@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-display: swap;
}

/* Fidelity pass: visual overrides measured against diseño-15. */
.hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: auto 0 0;
  height: 155px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 155' preserveAspectRatio='none'%3E%3Cpath d='M0 98 C145 24 238 142 420 83 S720 31 890 92 S1162 140 1440 47' fill='none' stroke='%2342c8b8' stroke-opacity='.68' stroke-width='1.4'/%3E%3Cpath d='M0 118 C160 53 260 153 460 99 S790 28 1000 110 S1260 48 1440 86' fill='none' stroke='%232e9e95' stroke-opacity='.45' stroke-width='1'/%3E%3Cpath d='M0 137 C172 74 280 146 502 121 S830 56 1045 127 S1285 98 1440 123' fill='none' stroke='%2342c8b8' stroke-opacity='.26' stroke-width='1'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.hero-content {
  z-index: 2 !important;
}

.edition {
  padding-bottom: 166px !important;
}

.edition-actions {
  margin-bottom: 34px !important;
}

.photo-grid img {
  height: 184px !important;
}

.photo-grid .photo-group {
  height: 350px !important;
}

.wave-top {
  padding-top: 150px !important;
}

.sponsors {
  padding-bottom: 164px !important;
}

.sponsor-layout > div > p:not(.eyebrow) {
  font-size: var(--font-size-body) !important;
  line-height: 1.55 !important;
  margin-bottom: 32px !important;
}

.benefits {
  gap: 30px !important;
}

.benefits li {
  gap: 19px !important;
}

.benefits li > span {
  width: 60px !important;
  height: 60px !important;
  flex: 0 0 60px !important;
  font-size: 1.75rem !important;
}

.benefits h3 {
  margin: 2px 0 4px !important;
  font-size: var(--font-size-benefit-title) !important;
}

.benefits p {
  font-size: var(--font-size-body) !important;
}

.faq-layout > img {
  height: 280px !important;
}

.faq {
  padding-top: 150px !important;
}

.photo-grid::after {
  content: "";
  height: 184px;
  border-radius: 12px;
  background: url("../img/mesa-redonda.png") center/cover no-repeat;
}

/* Segunda pasada de fidelidad: composición de hero y edición 2025. */
.site-header {
  height: 88px !important;
  padding: 0 60px !important;
}

.brand {
  font-size: 1.35rem !important;
}

.brand-wave {
  font-size: 2.45rem !important;
}

.primary-nav {
  gap: 30px !important;
  font-size: 0.83rem !important;
}

.header-actions {
  gap: 18px !important;
}

.header-cta {
  padding: 9px 18px !important;
  min-height: 40px !important;
  font-size: var(--font-size-button) !important;
}

.hero {
  min-height: 600px !important;
  align-items: flex-start !important;
}

.hero .section-inner,
.edition .section-inner {
  width: calc(100% - 120px) !important;
  max-width: none !important;
}

.hero .section-inner {
  margin: 0 auto !important;
}

.hero-content {
  padding-top: 134px !important;
}

.hero-image {
  opacity: 1 !important;
}

.hero-overlay {
  background: linear-gradient(
    90deg,
    #011f2cf4 4%,
    #011f2cce 30%,
    #011f2c72 56%,
    #011f2c18 100%
  ) !important;
}

.hero::after {
  height: 105px !important;
  opacity: 0.9;
  /* Animated overlay replaces it and only fades in after scrolling. */
  visibility: hidden;
}

.edition .section-inner {
  position: relative;
}

.edition-heading h2 {
  font-size: var(--font-size-section-title) !important;
}

.edition-heading p {
  font-size: var(--font-size-section-lead) !important;
  max-width: 420px !important;
  line-height: 1.5;
}

.stats {
  margin: 40px 0 56px !important;
}

.stats div {
  position: relative;
  min-height: 64px;
  padding-left: 62px !important;
  display: grid;
  align-content: center;
}

.stats div::before {
  position: absolute;
  left: 16px;
  top: 12px;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  color: var(--accent);
  font-size: 30px;
  line-height: 1;
}

.stats div:nth-child(1)::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2342c8b8' stroke-width='1.8'%3E%3Ccircle cx='16' cy='9' r='4'/%3E%3Cpath d='M8 27v-2c0-4.4 3.6-8 8-8s8 3.6 8 8v2M5 13a3 3 0 1 0 0-6 3 3 0 0 0 0 6m22 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6M2 25c0-3 1.6-5.6 4-6.9M30 25c0-3-1.6-5.6-4-6.9'/%3E%3C/svg%3E")
    center/contain no-repeat;
}

.stats div:nth-child(2)::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2342c8b8' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='11' y='3' width='10' height='17' rx='5'/%3E%3Cpath d='M7 15a9 9 0 0 0 18 0M16 24v5m-5 0h10'/%3E%3C/svg%3E")
    center/contain no-repeat;
}

.stats div:nth-child(3)::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2342c8b8' stroke-width='1.8'%3E%3Ccircle cx='16' cy='9' r='4'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='26' cy='12' r='3'/%3E%3Cpath d='M8 28v-2c0-4.4 3.6-8 8-8s8 3.6 8 8v2M1 27v-2c0-3.1 1.7-5.8 4.3-7.2M31 27v-2c0-3.1-1.7-5.8-4.3-7.2'/%3E%3C/svg%3E")
    center/contain no-repeat;
}

.stats div:nth-child(4)::before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%2342c8b8' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='m16 3 5 6-5 6-5-6 5-6Zm0 14 5 6-5 6-5-6 5-6ZM5 9l5 6-5 6-5-6 5-6Zm22 0 5 6-5 6-5-6 5-6Z'/%3E%3C/svg%3E")
    center/contain no-repeat;
}

.stats dt {
  font-size: 2.25rem !important;
  line-height: 1;
}

.stats dd {
  margin-top: 4px !important;
}

.edition-actions {
  position: absolute;
  right: 0;
  top: 205px;
  margin: 0 !important;
}

.edition-actions .text-link {
  display: none;
}

.photo-grid {
  margin-top: 0 !important;
}

:root {
  font-size: 90%;
  --bg-deep: #011f2c;
  --bg-deep-alt: #053547;
  --bg-water: #1a525e;
  --bg-light: #f7fbfb;
  --bg-light-tint: #e7f4f2;
  --accent: #42c8b8;
  --accent-deep: #2e9e95;
  --text-light: #f7fbfb;
  --text-light-muted: #b9d1d3;
  --text-dark: #011f2c;
  --text-dark-muted: #526a73;
  --font-size-hero-title: clamp(3rem, 6.3vw, 4.25rem);
  --font-size-hero-lead: clamp(1.2rem, 1.98vw, 1.55rem);
  --font-size-section-title: 3.25rem;
  --font-size-section-lead: 1.2rem;
  --font-size-body: 1.2rem;
  --font-size-eyebrow: 1rem;
  --font-size-button: 1rem;
  --font-size-benefit-title: 1.08rem;
  --font-size-feature-title: clamp(1.45rem, 1.98vw, 1.75rem);
  font-family: "IBM Plex Sans", system-ui, sans-serif;
  color: var(--text-dark);
  background: var(--bg-light);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  line-height: 1.5;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}

.section-inner {
  width: min(1200px, calc(100% - 96px));
  margin: auto;
}

.section-dark {
  color: var(--text-light);
  background:
    radial-gradient(circle at 80% 20%, #1a525e88, transparent 38%),
    linear-gradient(140deg, var(--bg-deep), var(--bg-deep-alt) 60%, #0b4651);
}

.section-light {
  background: linear-gradient(145deg, var(--bg-light), var(--bg-light-tint));
  color: var(--text-dark);
}

.site-header {
  height: 76px;
  padding: 0 48px;
  display: flex;
  gap: 28px;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  z-index: 4;
  inset: 0 0 auto;
  color: var(--text-light);
}

.brand {
  font-size: 1.1rem;
  font-weight: 700;
  white-space: nowrap;
}

.brand span:last-child,
.brand-wave {
  color: var(--accent);
}

.brand-wave {
  font-size: 2rem;
  vertical-align: -0.2rem;
}

.primary-nav,
.header-actions,
.hero-links,
.edition-actions,
.social-links,
.footer-legal {
  display: flex;
  align-items: center;
  gap: 20px;
}

.primary-nav {
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 0.76rem;
  font-weight: 600;
}

.editions {
  position: relative;
}

.editions summary {
  cursor: pointer;
  list-style: none;
}

.editions summary::after {
  content: "⌄";
  margin-left: 5px;
}

.editions ul {
  position: absolute;
  right: 0;
  top: 24px;
  width: 100px;
  background: var(--bg-deep);
  padding: 8px 14px;
  margin: 0;
  list-style: none;
  border-radius: 10px;
}

.language-switcher {
  display: flex;
  border: 1px solid #ffffff55;
  border-radius: 999px;
  padding: 2px;
}

.language-switcher button {
  background: none;
  color: inherit;
  border: 0;
  border-radius: 999px;
  padding: 4px 7px;
  font-size: var(--font-size-button);
  cursor: pointer;
}

.language-switcher button[aria-pressed="true"] {
  background: var(--accent);
  color: var(--text-dark);
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 999px;
  padding: 10px 21px;
  border: 1px solid transparent;
  font-size: var(--font-size-button);
  font-weight: 700;
  letter-spacing: 0.02em;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.button-primary {
  background: var(--accent);
  color: var(--text-dark);
}

.button-primary:hover {
  background: var(--accent-deep);
  box-shadow: 0 8px 20px #011f2c24;
}

.button-secondary {
  border-color: currentColor;
}

.button-secondary:hover,
.button-secondary:focus-visible {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--text-dark);
}

.button-outline:hover,
.button-outline:focus-visible {
  border-color: var(--accent-deep);
  background: var(--accent-deep);
  color: var(--text-light);
}

.button:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}

.hero {
  min-height: 720px;
  position: relative;
  display: grid;
  align-items: center;
  overflow: hidden;
  background: #011f2c;
}

.hero-poster {
  position: absolute;
  inset: 0;
}

.hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.65;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #011f2cf5 18%, #011f2cad 54%, #011f2c40);
}

.hero-content {
  position: relative;
  z-index: 1;
  padding-top: 80px;
}

.eyebrow {
  font-size: var(--font-size-eyebrow);
  font-weight: 700;
  letter-spacing: 0.13em;
  color: var(--accent);
  margin: 0 0 14px;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  font-size: var(--font-size-hero-title);
  line-height: 1.02;
  margin-bottom: 8px;
}

h1 span,
h2 span {
  color: var(--accent);
}

h2 {
  font-size: var(--font-size-section-title);
  line-height: 1.05;
  margin-bottom: 20px;
}

.hero-motto {
  font-size: var(--font-size-hero-lead);
  margin-bottom: 10px;
}

.event-meta {
  color: var(--text-light-muted);
  font-size: var(--font-size-body);
  margin-bottom: 28px;
}

.video-link {
  font-size: var(--font-size-body);
  font-weight: 700;
}

.edition {
  padding: 88px 0 150px;
  position: relative;
}

.edition-heading {
  display: flex;
  gap: 48px;
  justify-content: space-between;
  align-items: end;
}

.edition-heading p {
  max-width: 390px;
  color: var(--text-light-muted);
}

.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin: 34px 0;
}

.stats div {
  border-left: 1px solid #ffffff33;
  padding-left: 18px;
}

.stats dt {
  color: var(--accent);
  font-size: 2rem;
  font-weight: 700;
}

.stats dd {
  font-size: var(--font-size-body);
  font-weight: 700;
  margin: 0;
}

.edition-actions {
  margin-bottom: 30px;
}

.text-link {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--accent);
}

.photo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.photo-grid img {
  width: 100%;
  height: 170px;
  object-fit: cover;
  border-radius: 12px;
}

.photo-grid img[data-lightbox],
.about-history-collage img[data-lightbox] {
  cursor: pointer;
  transition:
    filter 0.2s ease,
    transform 0.2s ease;
}

.photo-grid img[data-lightbox]:hover,
.about-history-collage img[data-lightbox]:hover {
  filter: brightness(1.06);
  transform: scale(1.025);
}

.photo-grid img[data-lightbox]:focus-visible,
.about-history-collage img[data-lightbox]:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}

.photo-lightbox {
  position: fixed;
  inset: 0;
  width: max-content;
  max-width: 96vw;
  max-height: 96vh;
  margin: auto;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}

.photo-lightbox::backdrop {
  background: #00131de8;
  backdrop-filter: blur(4px);
}

.photo-lightbox > img {
  display: block;
  max-width: 94vw;
  max-height: 88vh;
  object-fit: contain;
  border-radius: 10px;
  box-shadow: 0 16px 64px #0008;
}

.photo-lightbox-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #ffffff80;
  border-radius: 50%;
  background: #001f2ccc;
  color: #fff;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .photo-grid img[data-lightbox],
  .about-history-collage img[data-lightbox] {
    transition: none;
  }
}

.photo-grid .photo-group {
  grid-column: span 3;
  height: 330px;
}

.wave-bottom::after,
.wave-top::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  width: 100%;
  height: 90px;
  background: var(--bg-light);
  clip-path: polygon(
    0 38%,
    14% 72%,
    33% 40%,
    53% 82%,
    72% 38%,
    88% 70%,
    100% 42%,
    100% 100%,
    0 100%
  );
}

.wave-bottom::after {
  bottom: -1px;
}

.wave-top {
  position: relative;
  padding-top: 130px;
}

.wave-top::before {
  top: -1px;
  transform: rotate(180deg);
}

.sponsors {
  padding-bottom: 140px;
}

.sponsor-layout,
.location-layout,
.faq-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items: center;
}

.sponsor-layout > div > p:not(.eyebrow) {
  max-width: 530px;
  color: var(--text-dark-muted);
  margin-bottom: 28px;
}

.benefits {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 25px;
}

.benefits li {
  display: flex;
  gap: 16px;
}

.benefits li > span {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--bg-light-tint);
  display: grid;
  place-items: center;
  color: var(--accent-deep);
  font-size: 1.5rem;
}

.benefits h3 {
  margin: 0 0 2px;
  font-size: 1rem;
}

.benefits p {
  margin: 0;
  color: var(--text-dark-muted);
  font-size: var(--font-size-body);
}

.location-layout > div > p:not(.eyebrow):not(.location-detail) {
  font-size: var(--font-size-body);
}

.location {
  padding: 100px 0 118px;
  position: relative;
  overflow: hidden;
}

.location-layout > img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  border-radius: 0;
  clip-path: polygon(0 0, 100% 0, 100% 93%, 76% 100%, 50% 94%, 24% 100%, 0 92%);
}

.location-detail {
  font-size: 0.9rem;
  color: var(--text-light-muted);
  margin-bottom: 8px;
}

.location .button {
  margin-top: 18px;
}

.faq {
  padding-bottom: 130px;
}

.faq-layout > img {
  width: 100%;
  border-radius: 12px;
  object-fit: cover;
}

.faq-list details {
  border-bottom: 1px solid #1a525e33;
  margin-inline: -12px;
  padding: 13px 12px;
  border-radius: 8px;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease;
}

.faq-list summary {
  position: relative;
  cursor: pointer;
  font-size: var(--font-size-body);
  font-weight: 600;
  list-style: none;
  padding-right: 2.5rem;
  transition: color 0.18s ease;
}

.faq-list details:hover,
.faq-list details:focus-within,
.faq-list details[open] {
  border-bottom-color: var(--accent-deep);
  background: var(--bg-light-tint);
}

.faq-list details:hover summary,
.faq-list details:focus-within summary,
.faq-list details[open] summary {
  color: var(--accent-deep);
}

.faq-list summary::after {
  content: "+";
  position: absolute;
  top: 0;
  right: 0;
  color: var(--accent-deep);
  font-size: 1.25rem;
  line-height: 1.5;
}

.faq-list details[open] summary::after {
  content: "−";
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .faq-list details,
  .faq-list summary {
    transition: none;
  }
}

.faq-list p {
  color: var(--text-dark-muted);
  font-size: var(--font-size-body);
  margin: 10px 26px 0 0;
}

.site-footer {
  padding: 62px 0 25px;
  position: relative;
}

.footer-layout {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 35px;
  align-items: start;
}

.site-footer p {
  color: var(--text-light-muted);
  font-size: 0.9rem;
}

.footer-legal,
.social-links {
  align-items: flex-start;
  flex-direction: column;
  font-size: 0.85rem;
}

.footer-legal a:hover,
.social-links a:hover {
  color: var(--accent);
}

.copyright {
  width: min(1200px, calc(100% - 96px));
  margin: 50px auto 0;
  color: var(--text-light-muted);
  font-size: 0.72rem;
}

/* Las líneas son un detalle de transición, nunca una textura de fondo. */
.edition::before,
.location::before,
.faq::after {
  content: "";
  position: absolute;
  pointer-events: none;
  left: 0;
  width: 100%;
  height: 110px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 110' preserveAspectRatio='none'%3E%3Cpath d='M0 65 C140 8 238 109 415 54 S710 18 882 58 S1160 99 1440 30' fill='none' stroke='%2342c8b8' stroke-opacity='.48' stroke-width='1.5'/%3E%3Cpath d='M0 82 C183 20 278 100 493 62 S830 4 1030 70 S1275 52 1440 75' fill='none' stroke='%232e9e95' stroke-opacity='.28' stroke-width='1'/%3E%3C/svg%3E")
    center/100% 100% no-repeat;
  z-index: 2;
}

.edition::before {
  bottom: 42px;
}

.location::before {
  bottom: 14px;
  transform: scaleX(-1);
  opacity: 0.72;
}

.faq::after {
  top: 24px;
  opacity: calc(0.45 * var(--wave-gate, 0));
  transform: scaleX(-1);
}

.location {
  padding-bottom: 140px;
}

.location-layout {
  align-items: stretch;
}

.location-layout > img {
  align-self: stretch;
  min-height: 0;
  height: auto;
  margin: -100px 0 -140px;
  clip-path: polygon(0 0, 100% 0, 100% 95%, 75% 100%, 54% 96%, 28% 100%, 0 94%);
}

.location::after {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 90px;
  background: var(--bg-light);
  clip-path: polygon(
    0 40%,
    13% 74%,
    31% 41%,
    49% 83%,
    70% 36%,
    88% 72%,
    100% 43%,
    100% 100%,
    0 100%
  );
}

.location-layout {
  position: relative;
  z-index: 1;
}

.location-layout > img {
  position: relative;
  z-index: 1;
}

.location-layout > div {
  padding: 26px 0;
  position: relative;
  z-index: 2;
}

.faq {
  padding-top: 145px;
}

.site-footer {
  background:
    radial-gradient(circle at 75% 0, #1a525e66, transparent 35%),
    linear-gradient(120deg, var(--bg-deep), var(--bg-deep-alt));
}

@media (max-width: 800px) {
  .site-header {
    display: flex;
    position: fixed;
    inset: 0 0 auto;
    justify-content: center;
    gap: 0;
    background: #011f2cce;
    backdrop-filter: blur(10px);
  }

  .site-header > nav {
    display: none;
  }

  .header-actions {
    position: absolute;
    right: 24px;
    margin-left: 0;
  }

  .site-header .brand {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .site-header {
    padding: 0 24px;
    height: 66px;
  }

  .primary-nav {
    display: none;
  }

  .header-cta {
    display: none;
  }

  .section-inner,
  .copyright {
    width: min(100% - 48px, 1200px);
  }

  .hero {
    min-height: 650px;
  }

  .hero-overlay {
    background: linear-gradient(90deg, #011f2cf5, #011f2c80);
  }

  .edition {
    padding: 72px 0 120px;
  }

  .edition-heading,
  .sponsor-layout,
  .location-layout,
  .faq-layout {
    grid-template-columns: 1fr;
    display: grid;
    gap: 28px;
  }

  .stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .photo-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .photo-grid .photo-group {
    grid-column: span 2;
    height: 240px;
  }

  .photo-grid img {
    height: 130px;
  }

  .sponsors {
    padding-bottom: 110px;
  }

  .location {
    padding-top: 80px;
    padding-bottom: 100px;
  }

  .location-layout > img {
    min-height: 300px;
    margin: 0;
    height: 320px;
  }

  .location::after {
    height: 60px;
  }

  .location::before {
    display: none;
  }

  .faq {
    padding-top: 100px;
  }

  .faq::after {
    display: none;
  }

  .footer-layout {
    grid-template-columns: 1fr 1fr;
  }

  .footer-layout > div:first-child {
    grid-column: span 2;
  }

  .wave-bottom::after,
  .wave-top::before {
    height: 60px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }

  .hero {
    background: url("../img/mesa-redonda.png") center / cover no-repeat;
  }
}

/* Tercera pasada: composición más recogida e iconografía funcional. */
.section-inner {
  width: min(75%, 1200px);
}

.hero .section-inner,
.edition .section-inner {
  width: 75% !important;
}

.hero {
  min-height: 100vh !important;
}

.event-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-bottom: 28px;
  color: var(--text-light-muted);
}

.event-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.event-meta svg {
  width: 20px;
  height: 20px;
  color: var(--accent);
  stroke-width: 2.5;
}

.event-venue::after {
  content: ", A Coruña";
}

.hero-overlay {
  background: linear-gradient(
    90deg,
    #011f2ced 0%,
    #011f2cd8 30%,
    #011f2c5a 58%,
    #011f2c18 100%
  ) !important;
}

.hero {
  min-height: 115vh !important;
}

/* Title, motto, date and CTA are centred within the first screen (h-screen). */
.hero .hero-content {
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.hero-image {
  object-position: 20% center;
  transform: translateX(8%) scale(1.16);
  transform-origin: center;
}

.brand-logo {
  display: block;
  width: 112px;
  height: auto;
}

.hero-content {
  position: relative;
  padding-top: 214px !important;
}

.hero h1 {
  font-size: var(--font-size-hero-title) !important;
}

.hero-motto {
  font-size: var(--font-size-hero-lead) !important;
}

.hero .video-link {
  position: absolute;
  z-index: 3;
  right: 24px;
  /* Hero can be taller than the viewport: pin to the first screen's bottom. */
  top: calc(100vh - 56px);
  top: calc(100svh - 56px);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.015em;
  opacity: 0.7;
  text-shadow: 0 1px 6px rgba(1, 31, 44, 0.7);
  transition: opacity 0.2s ease;
}

.hero .video-link:hover,
.hero .video-link:focus-visible {
  opacity: 1;
}

.video-play {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 0.62rem;
  line-height: 1;
  padding-left: 2px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.aftermovie-modal {
  width: min(92vw, 1000px);
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-light);
}

.aftermovie-modal::backdrop {
  background: #011f2ce8;
  backdrop-filter: blur(7px);
}

.aftermovie-dialog {
  position: relative;
  border: 1px solid #42c8b888;
  border-radius: 18px;
  overflow: hidden;
  background: var(--bg-deep);
  box-shadow: 0 24px 80px #0009;
}

.aftermovie-dialog iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  border: 0;
  background: #000;
}

.aftermovie-close {
  position: absolute;
  z-index: 1;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  border: 1px solid #ffffff88;
  border-radius: 50%;
  background: #011f2cd9;
  color: var(--text-light);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  padding-top: 0;
}

.aftermovie-close:hover {
  background: var(--accent);
  color: var(--text-dark);
}

/* Cabecera: objetivos táctiles más grandes y navegación junto al idioma. */
.site-header {
  height: 98px !important;
}

.brand-logo {
  width: 124px;
}

.site-header nav {
  margin-left: auto;
}

.primary-nav {
  gap: 16px !important;
  font-size: 1rem !important;
}

.primary-nav a,
.editions summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 7px;
  background: linear-gradient(var(--accent), var(--accent)) center bottom 5px /
    0 2px no-repeat;
  transition: background-size 0.2s ease;
}

.primary-nav a:hover,
.primary-nav a:focus-visible,
.editions summary:hover,
.editions summary:focus-visible {
  background-size: calc(100% - 14px) 2px;
}

.language-switcher button:not([aria-pressed="true"]):hover,
.language-switcher button:not([aria-pressed="true"]):focus-visible {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.editions summary::after {
  display: inline-flex;
  align-items: center;
  height: 1em;
  margin-top: -4px;
  line-height: 1;
}

.editions ul {
  top: 48px !important;
  width: 158px !important;
  padding: 8px !important;
}

.editions ul a {
  min-height: 42px;
  padding: 9px 8px;
}

.header-actions {
  gap: 14px !important;
}

.language-switcher button {
  padding: 6px 9px !important;
  font-size: var(--font-size-button) !important;
}

.header-cta {
  min-height: 44px !important;
  padding: 10px 20px !important;
  font-size: var(--font-size-button) !important;
}

@media (max-width: 800px) {
  :root {
    --font-size-section-title: clamp(2.2rem, 6.3vw, 3.25rem);
  }

  .site-header {
    height: 66px !important;
  }

  .brand-logo {
    width: 96px;
  }

  .language-switcher button {
    padding: 4px 7px !important;
    font-size: var(--font-size-button) !important;
  }
}

.hero::before {
  display: block;
}

.edition {
  padding-top: 58px !important;
}

.hero::after {
  bottom: 25px !important;
  height: 235px !important;
  opacity: 1 !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 235' preserveAspectRatio='none'%3E%3Cpath d='M0 145 C120 65 236 213 420 125 C610 37 754 72 888 134 C964 169 1022 157 1080 158 C1155 164 1186 175 1232 169 C1305 160 1365 191 1440 181' fill='none' stroke='%2342c8b8' stroke-opacity='.62' stroke-width='1.35' stroke-linecap='round'/%3E%3Cpath d='M0 163 C162 82 272 222 450 145 C638 65 806 88 974 153 C1017 170 1050 163 1080 164 C1148 169 1215 187 1245 178 C1300 170 1352 194 1440 188' fill='none' stroke='%2342c8b8' stroke-opacity='.48' stroke-width='1.15' stroke-linecap='round'/%3E%3Cpath d='M0 185 C146 122 302 188 486 169 C682 146 842 116 1038 175 C1052 179 1067 169 1080 170 C1158 179 1195 181 1238 186 C1302 191 1350 190 1440 195' fill='none' stroke='%232e9e95' stroke-opacity='.54' stroke-width='1.15' stroke-linecap='round'/%3E%3Cpath d='M0 206 C186 137 280 226 505 183 C704 144 856 143 1019 199 C1042 207 1062 175 1080 176 C1165 174 1208 204 1254 193 C1305 181 1378 215 1440 202' fill='none' stroke='%2342c8b8' stroke-opacity='.36' stroke-width='1' stroke-linecap='round'/%3E%3Cpath d='M0 124 C180 172 286 71 438 127 C600 187 756 182 892 118 C974 80 1036 151 1080 152 C1155 160 1190 155 1247 171 C1300 187 1360 169 1440 177' fill='none' stroke='%232e9e95' stroke-opacity='.3' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.hero-links {
  align-items: flex-start;
  flex-direction: column;
  gap: 0;
}


.stats div::before {
  display: none !important;
}

.stats div {
  padding-left: 56px !important;
}

.stat-icon {
  position: absolute;
  left: 16px;
  top: 16px;
  width: 29px;
  height: 29px;
  color: var(--accent);
  stroke-width: 1.8;
}

.stats {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.edition-actions {
  top: 206px !important;
}

.photo-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

.photo-grid .photo-group {
  grid-column: 1 / -1 !important;
  height: 400px !important;
}

.photo-grid img:not(.photo-group) {
  grid-column: span 2;
  height: 184px !important;
}

.photo-grid img:nth-child(2),
.photo-grid img:nth-child(3) {
  grid-column: span 3;
}

.photo-grid::after {
  content: none !important;
}

/* Cambios de sección: olas suaves y asimétricas, sin dientes rectos. */
.wave-bottom::after,
.wave-top::before,
.location::after {
  /* Never squeezed: 1440px design width, centred and clipped on narrow screens. */
  left: min(0px, calc(50% - 720px));
  width: max(100%, 1440px);
  height: 126px !important;
  clip-path: none !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 126' preserveAspectRatio='none'%3E%3Cpath fill='%23f7fbfb' d='M0 45 C160 18 265 92 418 66 C570 40 670 14 820 55 C980 96 1120 42 1280 62 C1350 71 1392 60 1440 45 V126 H0Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.wave-top::before {
  transform: rotate(180deg);
}

.sponsors.wave-bottom::after {
  display: none;
}

.sponsors {
  background-attachment: fixed;
}

.faq {
  background-attachment: fixed;
}

.edition {
  background-attachment: fixed;
}

/* Las tres transiciones que antes quedaban ocultas por el siguiente bloque. */
.hero::before {
  content: "";
  position: absolute;
  z-index: 1;
  /* Never squeezed: 1440px design width, centred and clipped when narrower. */
  inset: auto auto 0 min(0px, calc(50% - 720px));
  width: max(100%, 1440px);
  height: 160px;
  background:
    radial-gradient(circle at 80% 20%, #1a525e88, transparent 38%),
    linear-gradient(140deg, var(--bg-deep), var(--bg-deep-alt) 60%, #0b4651);
  background-attachment: fixed;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 132' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 52 C155 18 278 100 432 67 C574 37 690 12 844 55 C1000 99 1130 39 1284 64 C1355 76 1395 56 1440 42 V132 H0Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 132' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 52 C155 18 278 100 432 67 C574 37 690 12 844 55 C1000 99 1130 39 1284 64 C1355 76 1395 56 1440 42 V132 H0Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.hero::after {
  z-index: 2;
}

.hero::before,
.hero::after {
  pointer-events: none;
}

/* Detalle de agua antes de entrar en la Facultad de Informática. */
.sponsors.wave-bottom::after {
  display: block;
  z-index: 4;
  bottom: -40px;
  height: 82px !important;
  pointer-events: none;
  clip-path: none !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 82' preserveAspectRatio='none'%3E%3Cpath d='M0 57 C130 14 246 80 424 44 S704 7 872 48 S1164 77 1440 22' fill='none' stroke='%2342c8b8' stroke-opacity='.48' stroke-width='1.35'/%3E%3Cpath d='M0 67 C168 28 286 81 468 55 S770 17 990 60 S1268 34 1440 54' fill='none' stroke='%232e9e95' stroke-opacity='.34' stroke-width='1.05'/%3E%3Cpath d='M0 76 C152 45 304 78 512 67 S834 31 1048 70 S1288 55 1440 70' fill='none' stroke='%2342c8b8' stroke-opacity='.27' stroke-width='1'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

/* Footer: marca, comunidad y organización en dos niveles. */
.footer-layout {
  grid-template-columns: minmax(220px, 1fr) auto minmax(260px, 1fr);
  align-items: center;
  gap: 48px;
}

.footer-brand p {
  max-width: 260px;
  margin: 12px 0 0;
}

.footer-social {
  justify-self: center;
}

.footer-organizers {
  justify-self: end;
  text-align: right;
}

.footer-label {
  margin: 0 0 12px !important;
  color: var(--accent) !important;
  font-size: 0.67rem !important;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.social-links {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 10px;
}

.social-links a {
  display: inline-grid;
  width: 38px;
  height: 38px;
  border: 1px solid #ffffff3d;
  border-radius: 50%;
  place-items: center;
  color: var(--text-light-muted);
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}

.social-links a:hover,
.social-links a:focus-visible {
  border-color: var(--accent);
  background: #42c8b81c;
  color: var(--accent);
}

.social-links svg,
.bluesky-icon {
  width: 18px;
  height: 18px;
}

.organizer-logos {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}

.organizer-logos a,
.organizer-logos span {
  display: block;
  height: 72px;
}

.organizer-logos .agasol-logo {
  position: relative;
  width: 72px;
  overflow: hidden;
}

.organizer-logos img {
  display: block;
  width: auto;
  height: 72px;
  mix-blend-mode: screen;
  object-fit: contain;
}

.organizer-logos a:first-child img {
  filter: invert(1);
}

.organizer-logos .agasol-logo img {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 96px;
  max-width: none;
  transform: translate(-50%, -50%);
}

.footer-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 12px;
  padding-top: 20px;
  border-top: 1px solid #ffffff24;
}

.site-footer .copyright {
  width: auto;
  margin: 0;
  color: var(--text-light-muted);
  font-size: 0.72rem;
}

.footer-legal {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 18px;
  font-size: 0.78rem;
}

.location {
  padding-top: 180px !important;
}

.location::before {
  /* Never squeezed: 1440px design width, centred and clipped when narrower. */
  left: min(0px, calc(50% - 720px));
  width: max(100%, 1440px);
  top: -1px !important;
  bottom: auto !important;
  z-index: 3 !important;
  opacity: 1 !important;
  transform: none !important;
  height: 126px !important;
  clip-path: none !important;
  background: linear-gradient(
    145deg,
    var(--bg-light),
    var(--bg-light-tint)
  ) !important;
  background-attachment: fixed !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 126' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 0H1440V81 C1392 66 1350 55 1280 64 C1120 84 980 30 820 71 C670 112 570 86 418 60 C265 34 160 108 0 81Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 126' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 0H1440V81 C1392 66 1350 55 1280 64 C1120 84 980 30 820 71 C670 112 570 86 418 60 C265 34 160 108 0 81Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.site-footer {
  padding-top: 170px !important;
  overflow: hidden;
}

.site-footer::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: -1px;
  width: 100%;
  height: 126px;
  transform: none;
  background: linear-gradient(
    145deg,
    var(--bg-light),
    var(--bg-light-tint)
  ) !important;
  background-attachment: fixed !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 126' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 0H1440V81 C1392 66 1350 55 1280 64 C1120 84 980 30 820 71 C670 112 570 86 418 60 C265 34 160 108 0 81Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 126' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 0H1440V81 C1392 66 1350 55 1280 64 C1120 84 980 30 820 71 C670 112 570 86 418 60 C265 34 160 108 0 81Z'/%3E%3C/svg%3E")
    bottom/100% 100% no-repeat;
}

.site-footer .footer-layout,
.site-footer .copyright {
  position: relative;
  z-index: 2;
}

/* Las dos olas comparten parte de la transición blanca, sin cambiar su forma. */
.sponsors.wave-top::before,
.faq.wave-top::before {
  top: -52px;
}

/* Aire interno de las secciones claras, independiente de sus olas. */
.sponsors {
  padding-top: 72px !important;
  padding-bottom: 20px !important;
}

.faq {
  padding-top: 72px !important;
  padding-bottom: 20px !important;
}

.faq::after {
  top: -24px;
}

.location {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

.location-layout > img {
  position: absolute;
  top: -100px;
  right: calc((min(75vw, 1200px) - 100vw) / 2);
  bottom: -140px;
  width: 40vw;
  height: calc(100% + 190px);
  margin: 0;
  object-position: 10% 60%;
}

.faq-list p a {
  color: var(--accent-deep);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.section-wave-trigger {
  position: absolute;
  left: 50%;
  width: 1px;
  height: 1px;
  visibility: hidden;
  pointer-events: none;
}

.section-wave-trigger--top {
  top: 0;
}

.section-wave-trigger--bottom {
  bottom: 0;
}

.edition.wave-lines-motion::before,
.faq.wave-lines-motion::after,
.sponsors.wave-lines-motion.wave-bottom::after {
  visibility: hidden;
}

/* Overlays keep their 1440px design width (never squeezed): wider screens
   stretch them, narrower ones centre them and the page clips the overflow. */
body {
  overflow-x: clip;
}

.section-wave-lines {
  position: absolute;
  left: min(0px, calc(50% - 720px));
  width: max(100%, 1440px);
  overflow: visible;
  pointer-events: none;
  opacity: var(--wave-gate, 0);
}

.section-wave-lines--edition {
  z-index: 2;
  bottom: 42px;
  height: 110px;
}

.section-wave-lines--sponsors {
  left: 0;
  width: 100%;
  z-index: 4;
  bottom: -40px;
  height: 82px;
}

.section-wave-lines--faq {
  z-index: 2;
  top: 24px;
  height: 110px;
  opacity: calc(0.45 * var(--wave-gate, 0));
  transform: scaleX(-1);
}

.hero-wave-overlay {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 25px;
  width: 100%;
  height: 235px;
  overflow: visible;
  pointer-events: none;
  opacity: var(--wave-gate, 0);
}

@media (prefers-reduced-motion: reduce) {
  .hero-wave-overlay {
    display: none;
  }
}

.faq-list p a:hover,
.faq-list p a:focus-visible {
  color: var(--accent);
  text-decoration-thickness: 2px;
}

.mobile-menu-toggle,
.mobile-menu {
  display: none;
}

.site-header {
  position: fixed;
  background: #011f2cce;
  backdrop-filter: blur(10px);
  transition:
    background 0.2s ease,
    backdrop-filter 0.2s ease,
    box-shadow 0.2s ease;
}

@media (min-width: 801px) {
  .site-header {
    height: 76px !important;
    background: transparent;
    backdrop-filter: none;
  }

  .site-header.is-scrolled {
    background: #011f2cce;
    backdrop-filter: blur(10px);
    box-shadow: 0 1px 0 #ffffff14;
  }

  .brand-logo {
    width: 110px;
  }
}

@media (min-width: 801px) and (max-width: 900px) {
  .site-header {
    padding-inline: 24px !important;
    gap: 20px;
  }
}

@media (max-width: 800px) {
  .hero-video {
    display: none;
  }

  .section-inner,
  .hero .section-inner,
  .edition .section-inner {
    width: min(100% - 48px, 1200px) !important;
  }

  .event-meta {
    gap: 10px;
  }

  .hero-links {
    gap: 0;
  }

  .hero .video-link {
    right: 16px;
    top: calc(100vh - 48px);
    top: calc(100svh - 48px);
  }

  .stats {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .edition-actions {
    position: static;
    margin-top: -16px !important;
    margin-bottom: 54px !important;
  }

  .photo-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .photo-grid .photo-group {
    grid-column: span 2 !important;
    height: 300px !important;
  }

  .photo-grid img:not(.photo-group),
  .photo-grid img:nth-child(2),
  .photo-grid img:nth-child(3) {
    grid-column: span 1;
    height: 130px !important;
  }

  .location {
    padding-top: 110px !important;
  }

  .site-footer {
    padding-top: 120px !important;
  }

  .sponsors {
    padding-top: 64px !important;
    padding-bottom: 20px !important;
  }

  .faq {
    padding-top: 64px !important;
    padding-bottom: 20px !important;
  }

  .location {
    padding-top: 96px !important;
    padding-bottom: 96px !important;
  }

  .location::before {
    display: block;
  }

  .location-layout > img {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    height: 320px;
    margin: 0;
    object-position: center 58%;
  }

  .footer-layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .footer-layout > div:first-child {
    grid-column: auto;
  }

  .footer-social,
  .footer-organizers {
    justify-self: start;
    text-align: left;
  }

  .organizer-logos {
    justify-content: flex-start;
    gap: 10px;
  }

  .organizer-logos a,
  .organizer-logos span,
  .organizer-logos img {
    height: 64px;
  }

  .organizer-logos .agasol-logo {
    width: 64px;
  }

  .organizer-logos .agasol-logo img {
    height: 88px;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 16px;
    margin-top: 12px;
  }

  .footer-legal {
    flex-wrap: wrap;
    gap: 12px 18px;
  }

  .mobile-menu-toggle {
    display: inline-flex;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    position: absolute;
    left: 24px;
    margin-left: 0;
    padding: 0;
    border: 1px solid #ffffff66;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    background: #011f2c99;
    color: var(--text-light);
    cursor: pointer;
  }

  .mobile-menu-toggle > span:not(.sr-only) {
    width: 17px;
    height: 1.5px;
    border-radius: 999px;
    background: currentColor;
  }

  .mobile-menu {
    display: block;
    position: fixed;
    z-index: 5;
    inset: 0;
    overflow: auto;
    padding: 0 24px 40px;
    background:
      radial-gradient(circle at 86% 0, #1a525eaa, transparent 36%),
      linear-gradient(145deg, var(--bg-deep), var(--bg-deep-alt));
    color: var(--text-light);
  }

  .mobile-menu[hidden] {
    display: none !important;
  }

  .mobile-menu nav {
    display: flex;
    width: min(100%, 420px);
    margin: 0 auto;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .mobile-menu-topbar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 66px;
    margin: 0 -24px 16px;
    padding: 0 24px;
    background: transparent;
  }

  .mobile-menu-topbar .brand {
    justify-self: center;
  }

  .mobile-menu-topbar .brand-logo {
    width: 96px;
  }

  .mobile-menu-topbar .language-switcher {
    position: absolute;
    right: 24px;
  }

  .mobile-menu-close {
    position: absolute;
    left: 24px;
    display: inline-grid;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid #ffffff66;
    border-radius: 50%;
    place-items: center;
    background: #011f2c99;
    color: var(--text-light);
    cursor: pointer;
  }

  .mobile-menu-close > span:not(.sr-only) {
    position: absolute;
    width: 17px;
    height: 1.5px;
    border-radius: 999px;
    background: currentColor;
  }

  .mobile-menu-close > span:first-child {
    transform: rotate(45deg);
  }

  .mobile-menu-close > span:nth-child(2) {
    transform: rotate(-45deg);
  }

  .mobile-menu nav > a,
  .mobile-editions > span {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 4px;
    font-size: 1.05rem;
    font-weight: 600;
  }

  .mobile-menu nav > a:first-child {
    border-bottom: 1px solid #ffffff2b;
  }

  .mobile-editions {
    display: grid;
    grid-template-columns: 1fr repeat(3, auto);
    align-items: center;
    gap: 14px;
    padding: 10px 4px 18px;
    border-top: 1px solid #ffffff2b;
    border-bottom: 1px solid #ffffff2b;
  }

  .mobile-editions > span {
    padding: 0;
  }

  .mobile-editions a {
    color: var(--text-light-muted);
    font-size: 0.9rem;
  }

  .mobile-menu-cta {
    align-self: flex-start;
    margin-top: 24px;
    padding: 12px 32px !important;
  }

  body.mobile-menu-open {
    overflow: hidden;
  }
}

@media (max-width: 480px) {
  .stats {
    grid-template-columns: 1fr !important;
  }
}