@font-face {
  font-family: 'apercu';
  src: url('../fonts/apercu_regular-webfont.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: 'apercu';
  src: url('../fonts/apercu_bold-webfont.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: fallback;
}
@font-face {
  font-family: 'montserrat';
  src: url('../fonts/montserrat_bold-webfont.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@view-transition {
	navigation: auto;
}

/* Custom properties */
:root {
  --font-main: 'apercu', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-heading: 'montserrat', Avenir, 'Century Gothic', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --color-theme: #2277cc;
  --color-theme-dark: #002266;
  --color-theme-light: #6666BB;
  --color-theme-tint: #66CCDD;

  --color-accent: #115599;
  --color-accent-light: #3377bb;

  --color-highlight: #ffdd33;

  --color-white: #ffffff;
  --color-light: #f0f0f0;
  --color-mid: #484848;
  --color-dark: #001133;

  --size-constrain: 1400px;

/* easings */
  --confident-ease: cubic-bezier(0.39, 0.575, 0.565, 1);
  --bounce-ease: cubic-bezier(0.34, 1.56, 0.64, 1);
  --smooth-ease: cubic-bezier(0.61, 1, 0.88, 1);

}

/* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1400,22,1.333,6,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

:root {
  --step--2: clamp(0.6944rem, 0.6709rem + 0.1176vw, 0.7738rem);
  --step--1: clamp(0.8333rem, 0.7746rem + 0.2936vw, 1.0315rem);
  --step-0: clamp(1rem, 0.8889rem + 0.5556vw, 1.375rem);
  --step-1: clamp(1.2rem, 1.0125rem + 0.9376vw, 1.8329rem);
  --step-2: clamp(1.44rem, 1.1427rem + 1.4863vw, 2.4432rem);
  --step-3: clamp(1.728rem, 1.275rem + 2.2649vw, 3.2568rem);
  --step-4: clamp(2.0736rem, 1.4017rem + 3.3596vw, 4.3413rem);
  --step-5: clamp(2.4883rem, 1.5109rem + 4.8869vw, 5.787rem);
  --step-6: clamp(2.986rem, 1.5851rem + 7.0046vw, 7.7141rem);
}

/* Elements */
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  background-color: var(--color-theme-dark);
  color: var(--color-light);
  margin-inline: 0;
  margin-block: 0;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" viewBox="0 -40 1440 900"><circle cx="1389.5" cy="196.5" r="102.5" fill="%233880D4" opacity=".3"/><path fill="%235D67B6" fill-rule="evenodd" d="M1344 203a7 7 0 0 1-10-4l-10-23a7 7 0 0 1 4-9 7 7 0 0 1 9 4l3 8 10-26a7 7 0 0 1 13 5l-10 26 8-4a7 7 0 0 1 9 4 7 7 0 0 1-3 9z" data-svg-origin="1347.081298828125 176.50379180908203"/><circle cx="1107" cy="557" r="10" fill="%2311599F"/><path fill="none" stroke="%2311599F" stroke-linecap="round" stroke-linejoin="round" stroke-width="20" d="M826 835.9 1053.9 608" class="stroke"/><circle cx="931" cy="244" r="105" fill="%233880D4" data-name="circle" opacity=".3"/><path fill="none" stroke="%235D67B6" stroke-linecap="round" stroke-linejoin="round" stroke-width="20" d="M1483 580.9 1255.1 353"/><circle cx="1207" cy="303" r="10" fill="%235D67B6" data-name="dot1"/><circle cx="41" cy="522" r="10" fill="%233880D4"/><path fill="none" stroke="%233880D4" stroke-linecap="round" stroke-linejoin="round" stroke-width="20" d="M779.9-107 552 120.9"/><circle cx="491" cy="176" r="10" fill="%233880D4"/><path fill="%235D67B6" d="M295 226a6 6 0 0 1 7-2l37 13a6 6 0 0 1 5 6l-2 40a6 6 0 0 1-4 6l-38 11a6 6 0 0 1-7-3l-23-33a6 6 0 0 1 1-7z" data-svg-origin="306.6497802734375 261.9121398925781"/><g fill="%233880D4" opacity=".3"><path d="M54 600a11 11 0 0 1 7-13l49-16a11 11 0 0 1 6 20l-49 16a11 11 0 0 1-13-7zM21 655a11 11 0 0 1 7-14l140-44a11 11 0 0 1 7 20L34 662a11 11 0 0 1-13-7zM30 685a11 11 0 0 0 6 21l162-51a11 11 0 1 0-6-21zM47 736a11 11 0 0 1 6-13l141-45a11 11 0 1 1 6 21L60 743a11 11 0 0 1-13-7zM112 749a11 11 0 0 0 6 20l49-15a11 11 0 0 0-6-21z"/></g><path fill="%2311599F" fill-rule="evenodd" d="M1038 226a20 20 0 1 0-20-20 20 20 0 0 0 20 20zm0 30a50 50 0 1 0-50-50 50 50 0 0 0 50 50z"/><path fill="none" stroke="%2311599F" stroke-linecap="round" stroke-linejoin="round" stroke-width="20" d="M322 521 124 323"/><path fill="%2311599F" fill-rule="evenodd" d="M61 237a5 5 0 0 0-5 5v10H46a5 5 0 0 0 0 10h10v10a5 5 0 0 0 10 0v-10h10a5 5 0 0 0 0-10H66v-10a5 5 0 0 0-5-5z" data-name="dot4"/><path fill="%233880D4" fill-rule="evenodd" d="M1191 599a109 109 0 1 1 185 116l30 19a145 145 0 0 0-246-154zm61 39a36 36 0 1 1 62 38l31 20a73 73 0 0 0-123-77z" opacity=".3"/><path fill="%235D67B6" fill-rule="evenodd" d="M492 539a62 62 0 0 0 107 64l65 40a138 138 0 1 1-237-143z" opacity=".3"/><path fill="none" stroke="%233880D4" stroke-linecap="round" stroke-miterlimit="10" stroke-width="51" d="m278-18-360-92c-36-10-66-5-75 31s23 50 58 59l228 57c12 3 39 22 30 55s-41 33-53 30L-5 92c-36-9-65-8-74 27s15 51 50 60l54 11" opacity=".3" style="stroke-dashoffset:0;stroke-dasharray:none"/></svg>');
  background-attachment: fixed;
  background-size: cover;
}
body {
  font-family: var(--font-main);
  font-size: var(--step-0);
  line-height: 1.6;
  margin-inline: 0;
  margin-block: 0;
  min-height: 100vb;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
}
img,picture,video {
  max-inline-size: 100%;
  block-size: auto;
  display: block;
}
input,button,textarea,select {
  font: inherit;
}
ul,ol,dl,dt,dd,
p,figure,blockquote {
  hanging-punctuation: first last;
  text-wrap: pretty;
  margin-block-start: 0;
  margin-block-end: var(--step--1);
  margin-inline: 0;
}
h1,h2,h3,h4,h5,h6 {
  text-wrap: balance;
  color: inherit;
  font-family: var(--font-heading);
  font-weight: 700;
  margin-block-start: var(--step-0);
  margin-block-end: 0;
  line-height: 1.25;
}
h1 {
  font-size: var(--step-6);
  margin-inline: auto;
}
h2 {
  font-size: var(--step-5);
}
h3 {
  font-size: var(--step-4);
}
h4 {
  font-size: var(--step-3);
}
h5 {
  font-size: var(--step-2);
}
h6 {
  font-size: var(--step-1);
}
small {
  font-size: var(--step--1);
}
a {
  text-decoration: none;
  color: var(--color-white);
}
a:hover,
a:hover {
  border-block-end: 2px solid;
}
a:has(img):hover,
a:has([role="img"]):hover {
  border-block-end: 0;
}
nav ul {
  list-style: none;
  padding-inline: 0;
}
button {
  color: var(--color-light);
  color: var(--color-dark);
  padding: 0;
  margin: 0;
  cursor: pointer;
}
summary {
  cursor: pointer;
}
figure blockquote + figcaption {
  text-align: end;
}

*:focus {
  box-shadow: 0 0 0 3px var(--color-highlight);
}
*:focus:not(.focus-visible) {
  box-shadow: none;
}
*:focus-visible {
  outline: 3px dashed var(--color-highlight);
  outline-offset: 4px;
}

/* Utility classes */

.step-6 {
  font-size: var(--step-6);
  margin-inline: auto;
}
.step-5 {
  font-size: var(--step-5);
  margin-inline: auto;
}
.step-4 {
  font-size: var(--step-4);
}
.step-3 {
  font-size: var(--step-3);
}
.step-2 {
  font-size: var(--step-2);
}
.step-1 {
  font-size: var(--step-1);
}
.step-0 {
  font-size: var(--step-0);
}
.step--1 {
  font-size: var(--step--1);
}
.step--2 {
  font-size: var(--step--2);
}

.text-light {
  color: var(--color-light);
}
.text-dark {
  color: var(--color-theme-dark);
}
.text-tint {
  color: var(--color-theme-tint);
}
.text-accent {
  color: var(--color-accent);
}
.text-bold {
  font-weight: 700;
}


/* page structure */

body > header,
body > main,
body > footer {
  display: grid;
  grid-template-columns: minmax(auto, var(--size-constrain));
  justify-content: center;
  padding-inline: var(--step-0);
  padding-block: var(--step-0);
}

@media (min-width: 55em) {
  .Header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

.Header__logo-container {
  display: flex;
  flex-direction: row;
  line-height: 1;
  margin-block: var(--step-0);
}
.Header__logo {
  inline-size: 16rem;
  margin-inline-end: var(--step-0);
}
.Header__logo path {
  fill: var(--color-white);
  fill-rule: evenodd;
  clip-rule: evenodd;
}
.Header__meta {
  font-size: var(--step--2);
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-inline-start: 2px solid var(--color-white);
  padding-inline-start: var(--step-0);
}
.Header__meta p {
  margin-block: 0;
}
.Header nav {
  margin-block: var(--step-0);
  font-size: var(--step--1);
}
.Header nav ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--step-1);
  font-weight: 700;
  margin-block: 0;
}
.Header nav a {
  position: relative;
}
.Header nav a:hover,
.Header nav a:focus {
  border-block-end: none;
}
.Header nav a::after {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-inline-end: 0;
  inset-block-start: var(--step-1);
  block-size: 3px;
  transform: scaleX(0);
  transform-origin: center;
  background-color: var(--color-white);
  transition: 0.2s var(--confident-ease);
}
.Header nav a.button:after {
  content: none;
}
.Header nav a:hover::after,
.Header nav a:focus::after,
.Header nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

body > footer {
  background-color: var(--color-dark);
  color: var(--color-light);
}
.Footer {
  padding-block: var(--step-4);
}
.Footer__social {
  list-style: none;
  padding-inline: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--step-1);
}
.Footer__intro,
.Footer__social {
  margin-block-end: var(--step-2);
}
.Footer nav li {
  margin-block-end: var(--step--1);
}
.Footer a:has(svg) {
  transition: color 0.2s var(--smooth-ease);
}
.Footer a:has(svg):hover,
.Footer a:has(svg):focus {
  color: var(--color-highlight);
}
@media (min-width: 55em) {
  .Footer {
    display: flex;
  }
  .Footer__intro {
    inline-size: calc(74% - var(--step-2));
    margin-inline-end: var(--step-2);
  }
}

/* Components */

.button {
  display: inline-block;
  background-color: var(--color-theme-dark);
  color: var(--color-white);
  padding-block: var(--step--2);
  padding-inline: var(--step-2);
  border-radius: 99px;
  text-decoration: none;
  font-family: var(--font-heading);
  font-weight: 700;
  text-align: center;
  line-height: 1;
  transition: background-color 0.2s var(--smooth-ease)
}
.button:hover,
.button:focus {
  transition: background-color 0.5s var(--smooth-ease);
  background-color: var(--color-theme);
}
a.button {
  border-block-end: 0;
}

.button--light {
  background-color: var(--color-theme-light);
  color: var(--color-white);
}
.button--light:hover,
.button--light:focus {
  background-color: var(--color-theme);
}

.button--highlight {
  background-color: var(--color-highlight);
  color: var(--color-theme-dark);
}

.button--highlight:hover,
.button--highlight:focus {
  background-color: var(--color-white);
  color: var(--color-theme-dark);
}

.button--lg {
  padding-block: var(--step-0);
  padding-inline: var(--step-4);
}


@media screen and (min-width: 54em) {
  .split {
    display: flex;
    inline-size: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--step-0) + 1vw);
  }
  .split > * {
    flex-basis: 50%;
  }
}

.illustration {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-block-end: var(--step-0);
}
.illustration img {
  inline-size: 100%;
  block-size: auto;
}

.quote {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%235d67b6' d='M29.4 10.8c-1.1 1.1-2.6 1.7-4.5 1.7-.7 0-1.3-.1-1.8-.4.1 2 .9 3.6 2.3 4.9 1 .9 2.1 1.6 3.2 2 .8.3 1.4 1.1 1.4 2v1c0 1.5-1.4 2.5-2.7 2.1-.5-.2-1-.3-1.5-.6-1.5-.6-2.9-1.6-4.2-2.9-1.3-1.3-2.4-2.9-3.2-4.9-.9-2-1.3-4.4-1.3-7.3 0-2.3.7-4.2 2-5.9C20.4.9 22.2.1 24.4.1c2 0 3.6.6 4.8 1.9C30.4 3.3 31 4.7 31 6.4c0 1.8-.5 3.3-1.6 4.4M12.4 10.8c-1.1 1.1-2.6 1.7-4.5 1.7-.7 0-1.3-.1-1.8-.4.1 2 .9 3.6 2.3 4.9 1 .9 2.1 1.6 3.2 2 .8.3 1.4 1.1 1.4 2v1c0 1.5-1.4 2.5-2.7 2.1-.5-.2-1-.3-1.5-.6-1.5-.6-2.9-1.6-4.2-2.9-1.3-1.3-2.4-2.9-3.2-4.9-1-2-1.4-4.4-1.4-7.3 0-2.3.7-4.2 2-5.9C3.3 1 5.1.1 7.3.1c2 0 3.6.6 4.8 1.9C13.4 3.3 14 4.7 14 6.4c0 1.8-.5 3.3-1.6 4.4'/%3E%3C/svg%3E");
  background-position: top left;
  background-repeat: no-repeat;
  padding-inline-start: var(--step-2);
}

.page {
  background-color: var(--color-white);
  color: var(--color-dark);
  margin-block: var(--step-4);
  padding: calc(var(--step-1) + 2.5vi);
}
.page a:not(.button) {
  color: var(--color-theme);
}
.page h2 {
  color: var(--color-theme-dark);
}
.page h2:not([class]) {
  font-size: var(--step-4);
}

.constrain {
  max-inline-size: 60em;
  text-align: center;
  margin-block: var(--step-5);
  margin-inline: auto;
}

.logo {
  height: 1em;
  fill: currentColor;
}

.Speakers {
  padding-inline: 0;
  padding-block: var(--step-2);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.Speakers__profile {
  list-style: none;
  text-align: center;
  padding: var(--step-0);
  flex: 1 0 250px;
}
.Speakers__image {
  position: relative;
  inline-size: 180px;
  block-size: 180px;
  border-radius: 100%;
  margin-inline: auto;
  margin-block-start: 0;
  margin-block-end: var(--step-0);
}
.Speakers__image img {
  object-fit: cover;
  block-size: 100%;
  inline-size: 100%;
  border-radius: 100%;
}
a.Speakers__link {
  color: inherit;
}
.Speakers__link .Speakers__image:after {
  content: '';
  position: absolute;
  inset: 0;
  border: solid 8px var(--color-accent);
  border-radius: 100%;
  opacity: 0;
  transition: opacity 0.6s var(--confident-ease);
}
.Speakers__link:hover .Speakers__image:after,
.Speakers__link:focus .Speakers__image:after {
  opacity: 1;
}
.Speakers__profile--page {
  margin-block-end: var(--step-0);
}

@media screen and (min-width: 40em) {
  .Speakers {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .Speakers__profile {
    flex-basis: 50%;
  }
  .Speakers__image--page {
    inline-size: 50%;
    block-size: auto;
    margin-inline-start: var(--step-0);
    float: inline-end;
  }
}
@media screen and (min-width: 60em) {
  .Speakers__profile {
    flex-basis: 33.3%;
  }
  .Speakers__profile:nth-of-type(5n + 4) {
    margin-inline-start: 16%;
  }
  .Speakers__profile:nth-of-type(5n + 5) {
    margin-inline-end: 16%;
  }
  .Speakers__profile:nth-of-type(5n+4):last-child {
    margin-inline: auto;
  }
  .Speakers__image {
    inline-size: 240px;
    block-size: 240px;
  }
  .Speakers__image--page {
    inline-size: 33.3%;
    block-size: auto;
    shape-outside: circle();
    margin-inline-start: var(--step-6);
  }
}


.Schedule__nav {
  list-style: none;
  display: flex;
  justify-content: space-between;
  padding-inline: var(--step-0);
  padding-block-end: var(--step-0);
}
.Schedule__date {
  display: none;
}
.Schedule__navitem {
  text-align: center;
}
.Schedule__navlink {
  display: inline-block;
  padding-block-end: var(--step-0);
  border-block-end: 2px solid transparent;
}
.Schedule__navlink * {
  line-height: 1;
  margin: 0;
  padding: 0;
}
.Schedule__navlink[aria-current='page'] {
  border-color: var(--color-accent);
  pointer-events: none;
}
.Schedule__navlink p {
  color: var(--color-accent);
}
@media screen and (min-width: 50em) {
  .Schedule__date {
    margin-block-start: calc(var(--step-0) / 2);
    display: block;
  }
  .Schedule__nav {
    justify-content: space-around;
  }
}

.Schedule {
  margin-block-start: var(--step-3);
}
.Schedule .Schedule__title {
  margin-block-start: 0;
  text-wrap: pretty;
}
@media screen and (min-width: 50em) {
  .Schedule {
    display: grid;
    grid-gap: var(--step-0);
    grid-template-columns: repeat(9, 1fr);
  }
  .Schedule .Schedule__time {
    grid-column: 1/3;
    text-align: end;
    text-wrap: nowrap;
  }
  .Schedule .Schedule__content {
    grid-column: 3/9;
  }
}


.Sponsors__sponsor {
  margin-block-start: var(--step-3);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--step-3);;
}
.Sponsors__image {
  max-inline-size: 180px;
}
@media screen and (min-width: 800px) {
  .Sponsors__sponsor {
    flex-direction: row;
    align-items: flex-start;
    margin-inline-start: var(--step-3);
  }
}

.Newsletter__inner {
  margin-block-start: var(--step-3);
}
.Newsletter__input {
  inline-size: 100%;
  padding-block: var(--step--1);
  padding-inline: var(--step-0);
  border-radius: 99px;
  background-color: var(--color-white);
  border: var(--color-white) 2.5px solid;
}

.Newsletter__button {
  inline-size: 100%;
  border: none;
  padding-block: var(--step--1);
  padding-inline: var(--step-0);
  margin-block-start: var(--step-0);
}

@media screen and (min-width: 900px) {
  .Newsletter__inner {
    display: flex;
  }

  .Newsletter__inner > * {
    margin: 0;
  }

  .Newsletter__input {
    flex: 1 0 70%;
    border-start-end-radius: 0;
    border-end-end-radius: 0;
  }

  .Newsletter__button {
    flex: 1 1 auto;
    border-start-start-radius: 0;
    border-end-start-radius: 0;
  }
}

.Map {
  margin-block: var(--step-2);
  min-block-size: 50vh;
  border: 1px solid var(--color-dark);
}