@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-Regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-Medium.otf") format("opentype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-Medium.otf") format("opentype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-ExtraBold.otf") format("opentype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "Geometria";
  src: url("./assets/fonts/Geometria-Heavy.otf") format("opentype");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "Zalando Sans Expanded";
  src: url("./assets/fonts/ZalandoSansExpanded-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --black: #050505;
  --white: #f4f4f1;
  --muted: #9c9c98;
  --line: #222321;
  --blue: #032851;
  --accent: #056cff;
  --sidebar: clamp(220px, 21vw, 330px);
  --pad: clamp(20px, 3vw, 48px);
  --font-body: "Geometria", Arial, Helvetica, sans-serif;
  --font-display: "Zalando Sans Expanded", "Arial Black", sans-serif;
  --type-hero: clamp(2.5rem, 4.6vw, 4.5rem);
  --type-section-xl: clamp(2.5rem, 4.4vw, 4.25rem);
  --type-section-lg: clamp(2.15rem, 3.7vw, 3.75rem);
  --type-section-md: clamp(1.75rem, 2.7vw, 2.75rem);
  --type-card-title: clamp(1.125rem, 1.7vw, 1.625rem);
  --type-number: clamp(2.625rem, 4.2vw, 4rem);
  --type-section-title: clamp(36px, 3.25vw, 50px);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--black);
  overflow-x: clip;
}

body {
  margin: 0;
  color: var(--white);
  background: var(--black);
  font-family: var(--font-body);
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

img,
video,
iframe {
  display: block;
  max-width: 100%;
}

input,
select,
textarea,
button {
  min-width: 0;
  max-width: 100%;
}

main,
section,
.section-shell,
.section-shell > *,
[class*="grid"] > *,
[class*="track"] > * {
  min-width: 0;
}

a { color: inherit; }

h1,
h2,
h3 {
  font-family: var(--font-display);
}

.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;
}

.skip-link {
  position: fixed;
  z-index: 100;
  left: 20px;
  top: -100px;
  padding: 12px 16px;
  color: var(--black);
  background: var(--white);
}

.skip-link:focus { top: 20px; }

.site-header {
  position: fixed;
  z-index: 20;
  top: 0;
  left: 0;
  width: 100%;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--pad);
  mix-blend-mode: difference;
  pointer-events: none;
}

.wordmark,
.menu-toggle { pointer-events: auto; }

.wordmark {
  display: inline-flex;
  text-decoration: none;
}

.wordmark img {
  display: block;
  width: clamp(155px, 13vw, 190px);
  height: auto;
  filter: invert(1);
}

.menu-toggle {
  display: none;
  align-items: center;
  gap: 10px;
  border: 0;
  color: var(--white);
  background: transparent;
  font: 750 13px/1 var(--font-display);
  text-transform: uppercase;
}

.menu-lines,
.menu-lines::before,
.menu-lines::after {
  display: block;
  width: 23px;
  height: 2px;
  background: currentColor;
  content: "";
  transition: transform .25s ease, opacity .2s ease;
}

.menu-lines { position: relative; }
.menu-lines::before,
.menu-lines::after { position: absolute; left: 0; }
.menu-lines::before { transform: translateY(-6px); }
.menu-lines::after { transform: translateY(6px); }

.sidebar {
  position: fixed;
  z-index: 10;
  left: var(--pad);
  top: auto;
  bottom: clamp(30px, 5vh, 64px);
  width: calc(var(--sidebar) - var(--pad));
  transform: none;
}

.site-nav { display: grid; gap: 12px; }

.site-nav a {
  width: fit-content;
  padding: 3px 5px 2px;
  color: var(--white);
  font-family: var(--font-display);
  font-size: clamp(24px, 2vw, 32px);
  font-weight: 760;
  line-height: .9;
  letter-spacing: -.035em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .2s, background .2s;
}

.site-nav a:hover,
.site-nav a.active {
  color: var(--black);
  background: var(--white);
}

.socials {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 12px;
  width: 112px;
  margin-top: 34px;
}

.socials a {
  display: block;
  width: 28px;
  height: 28px;
  overflow: hidden;
  border-radius: 3px;
  opacity: .82;
  transition: opacity .2s ease, transform .2s ease;
}

.socials a:hover { opacity: 1; transform: translateY(-2px); }

.socials img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

main { padding-left: var(--sidebar); }

.section-shell {
  position: relative;
  max-width: 1250px;
  margin: 0 auto;
  padding-right: var(--pad);
}

.hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 76px;
  padding-bottom: 76px;
}

.hero-media {
  position: relative;
  width: 100%;
  height: min(86.4vh, 912px);
  min-height: 516px;
  overflow: hidden;
  border-radius: 20px;
  background:
    radial-gradient(circle at 29% 45%, #808080 0 2%, transparent 2.2%),
    linear-gradient(115deg, #111 0%, #616161 42%, #262626 68%, #0d0d0d 100%);
}

.hero-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% center;
}

.media-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 40px;
  text-align: left;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: .16em;
}

.media-placeholder span { font-size: 11px; font-weight: 800; }
.media-placeholder small { margin-top: 8px; font-size: 8px; }

.hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.08) 20%, rgba(0,0,0,.7) 100%);
}

.hero-copy {
  position: absolute;
  left: auto;
  right: clamp(16px, 2.2vw, 34px);
  top: 63%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  transform: translateY(-50%);
  text-align: right;
}

.hero h1 {
  margin: 0;
  max-width: calc(100vw - var(--sidebar) - 120px);
  font-size: clamp(2.3rem, 3.8vw, 3.8rem);
  font-weight: 900;
  line-height: .86;
  letter-spacing: -.045em;
  text-transform: uppercase;
  white-space: nowrap;
}

.hero h1 span {
  display: inline-block;
  font-size: .78em;
  font-weight: 500;
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  margin-top: 26px;
  padding: 10px 19px 9px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px;
  color: var(--white);
  background: rgba(28,28,28,.92);
  box-shadow: 0 5px 20px rgba(0,0,0,.25);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  backdrop-filter: blur(8px);
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.hero-cta:hover {
  border-color: var(--white);
  color: var(--black);
  background: var(--white);
}

.hero-editorial {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: clamp(40px, 7vw, 120px);
  padding-top: clamp(40px, 6vw, 88px);
  padding-bottom: clamp(54px, 7vw, 108px);
}

.hero-editorial h2 {
  max-width: 560px;
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--type-section-title);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.hero-editorial-copy {
  display: grid;
  gap: 20px;
  align-content: start;
  max-width: 760px;
}

.hero-editorial-copy p {
  margin: 0;
  font-size: clamp(16px, 1.3vw, 19px);
  line-height: 1.48;
}

.hero-editorial-copy p:last-child {
  font-weight: 700;
}

.current-offers {
  padding-top: 0;
  padding-bottom: clamp(54px, 6vw, 88px);
}

.current-offers-heading {
  margin-bottom: clamp(28px, 3vw, 46px);
}

.current-offers-heading .section-kicker { margin: 0 0 10px; }

.current-offers-heading h2 {
  margin: 0;
  font-size: var(--type-section-title);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.current-offers-grid {
  display: grid;
  grid-auto-columns: min(82%, 940px);
  grid-auto-flow: column;
  gap: 12px;
  overflow-x: auto;
  margin-right: calc(var(--pad) * -1);
  padding-right: var(--pad);
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}

.current-offers-grid::-webkit-scrollbar { display: none; }

.current-offer {
  position: relative;
  min-height: clamp(440px, 43vw, 570px);
  overflow: hidden;
  isolation: isolate;
  background: #111;
  scroll-snap-align: start;
}

.current-offer { border-radius: 18px; }

.current-offer > img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.8,.2,1);
}

.current-offer--speaker > img { object-position: 45% center; }
.current-offer--ambassador > img { object-position: 44% center; }
.current-offer--coaching > img { object-position: 51% center; }
.current-offer--book > img { object-position: 52% center; }

.current-offer:hover > img { transform: scale(1.025); }

.current-offer-shade {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(0,0,0,.12) 20%, rgba(0,0,0,.9) 100%),
    linear-gradient(90deg, rgba(0,0,0,.35), transparent 72%);
}

.current-offer-content {
  min-height: inherit;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: clamp(26px, 3vw, 42px);
}

.current-offer-index {
  position: absolute;
  top: clamp(24px, 2.5vw, 36px);
  left: clamp(26px, 3vw, 42px);
  margin: 0;
  color: rgba(255,255,255,.72);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .08em;
}

.current-offer h3 {
  max-width: 92%;
  margin: 0 0 14px;
  font-family: var(--font-display);
  font-size: clamp(30px, 3vw, 46px);
  font-weight: 700;
  line-height: .9;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.current-offer-copy {
  max-width: 590px;
  margin: 0;
  font-size: clamp(14px, 1.18vw, 17px);
  line-height: 1.45;
}

.current-offer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.current-offer-cta {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 10px 18px 9px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 999px;
  color: var(--white);
  background: rgba(15,15,15,.62);
  box-shadow: inset 0 1px rgba(255,255,255,.16), 0 8px 22px rgba(0,0,0,.24);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  backdrop-filter: blur(14px) saturate(130%);
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.current-offer-cta:hover {
  border-color: var(--white);
  color: var(--black);
  background: var(--white);
}

.current-offer-cta--secondary { background: rgba(255,255,255,.08); }

.current-offers-controls {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 30px;
}

.current-offers-arrow {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #5b5b58;
  border-radius: 50%;
  color: var(--white);
  background: transparent;
  font-family: var(--font-body);
  cursor: pointer;
}

.current-offers-progress {
  width: min(360px, 44vw);
  height: 1px;
  background: #343532;
}

.current-offers-progress span {
  display: block;
  width: 40%;
  height: 1px;
  background: var(--white);
  transition: width .2s ease;
}

.section-kicker {
  margin-bottom: 40px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.about { padding-top: 90px; padding-bottom: 90px; }

.about-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.25fr) minmax(260px, 1fr);
  gap: clamp(40px, 8vw, 130px);
  align-items: start;
}

.about h2,
.coming h2 {
  margin: 0;
  font-size: var(--type-section-xl);
  font-weight: 900;
  line-height: .86;
  letter-spacing: -.075em;
  text-transform: uppercase;
}

.about-copy {
  max-width: 430px;
  padding-top: 4px;
  color: #bdbdb9;
  font-size: clamp(13px, 1.15vw, 16px);
  line-height: 1.35;
}

.about-copy p { margin: 0 0 20px; }
.about-copy .lead { color: var(--white); font-weight: 700; }

.timeline {
  margin: 80px 0 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 18px;
  align-items: baseline;
  padding: 21px 0;
  border-bottom: 1px solid var(--line);
  font-size: 17px;
}

.timeline li.timeline-grouped {
  border-bottom: 0;
}

.timeline li.timeline-grouped::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 128px;
  height: 1px;
  background: var(--line);
}

.timeline time {
  color: var(--accent);
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: -.025em;
}

.timeline span {
  color: #d4d4d0;
  font-size: 17px;
  line-height: 1.35;
}

.manifesto { padding-top: 60px; padding-bottom: 90px; }

.manifesto > h2 {
  margin: 0 0 70px;
  font-size: var(--type-section-lg);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.055em;
  text-align: left;
  text-transform: uppercase;
}

.manifesto > h2 strong { font-weight: 900; }

.quote-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.quote-grid article {
  min-height: 260px;
  padding: clamp(24px, 3.5vw, 52px);
  background: var(--blue);
}

.card-label {
  margin: 0 0 30px;
  color: #9eb9d3;
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

.quote-grid blockquote {
  max-width: 440px;
  margin: 0 0 26px;
  font-size: clamp(17px, 1.6vw, 24px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -.035em;
}

.quote-grid article > p:last-child {
  width: 100%;
  max-width: none;
  margin: 0;
  color: #bfd0df;
  font-size: 11px;
  line-height: 1.5;
}

.identity {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(360px, 1.1fr);
  gap: clamp(60px, 10vw, 150px);
  align-items: start;
  padding-top: 0;
  padding-bottom: 70px;
}

.identity-intro h2 {
  margin: 0 0 24px;
  font-size: clamp(32px, 3.25vw, 50px);
  font-weight: 850;
  line-height: .92;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.identity-intro p {
  max-width: 520px;
  margin: 0;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
}

.identity-roles {
  margin: 0;
  padding: 0;
  border-top: 1px solid #8a8a86;
  list-style: none;
}

.identity-roles li {
  padding: 15px 0 12px;
  border-bottom: 1px solid #8a8a86;
  font-family: var(--font-display);
  font-size: clamp(29px, 3.1vw, 47px);
  font-weight: 350;
  line-height: 1;
  letter-spacing: -.035em;
  text-transform: uppercase;
}

.results {
  padding-top: 70px;
  padding-bottom: 80px;
}

.results .section-kicker { margin-bottom: 46px; }

.stats-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(40px, 5vw, 70px);
}

.stats-group-title {
  margin: 0 0 16px;
  font-family: var(--font-display);
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  width: 100%;
  max-width: none;
  margin-left: 0;
}

.stats-group .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stats-group .stats-grid article { min-height: 220px; }

.stats-grid article {
  min-height: 260px;
  padding: clamp(24px, 3vw, 44px);
  background: #03244a;
}

.stats-grid strong {
  display: block;
  margin-bottom: 12px;
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 5.4vw, 5.25rem);
  font-weight: 900;
  line-height: .78;
  letter-spacing: -.07em;
}

.stats-grid .stat-label {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.05;
  text-transform: uppercase;
}

.stats-grid p {
  width: 100%;
  max-width: none;
  margin: 0;
  color: #d1deea;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.35;
}

.voices {
  padding-top: 55px;
  padding-bottom: 100px;
}

.voices-overline {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.voices > h2 {
  margin: 0 0 54px;
  font-size: var(--type-section-lg);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.voice-tabs {
  position: absolute;
  z-index: 4;
  left: clamp(32px, 5vw, 70px);
  right: clamp(32px, 5vw, 70px);
  top: 26px;
  display: flex;
  gap: clamp(18px, 3vw, 44px);
  width: auto;
  margin: 0;
  padding: 0;
  transform: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.voice-tabs::-webkit-scrollbar { display: none; }

.voice-tabs button {
  padding: 0;
  border: 0;
  color: rgba(255,255,255,.58);
  background: none;
  font: 500 9px/1 var(--font-body);
  cursor: pointer;
  white-space: nowrap;
}

.voice-tabs button.active { color: var(--white); font-weight: 700; }

.testimonial {
  width: 100%;
  margin-left: 0;
}

.testimonial-media {
  position: relative;
  min-height: 660px;
  overflow: hidden;
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 72% 47%, rgba(100,113,105,.9) 0 14%, transparent 14.5%),
    linear-gradient(120deg, #30473f, #617269 58%, #24342f);
}

.testimonial-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% center;
}

@media (min-width: 769px) {
  .testimonial-image--anna {
    transform: scale(1.25);
    transform-origin: left 35%;
  }
}

.testimonial-media::before {
  position: absolute;
  z-index: 1;
  content: "";
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.34) 45%, rgba(0,0,0,.08) 78%);
}

.photo-note {
  position: absolute;
  z-index: 3;
  right: 20px;
  bottom: 18px;
  color: rgba(255,255,255,.45);
  font-size: 7px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.player-title {
  position: absolute;
  z-index: 3;
  left: clamp(32px, 5vw, 70px);
  top: clamp(82px, 9vw, 118px);
  display: flex;
  flex-direction: column;
}

.testimonial-first-name,
.testimonial-last-name {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 4.2vw, 4rem);
  line-height: .84;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.testimonial-first-name { font-weight: 420; }
.testimonial-last-name { font-weight: 850; }

.player-title > span:last-child {
  margin-top: 24px;
  font-size: 24px;
  font-weight: 600;
}

.testimonial blockquote {
  position: absolute;
  z-index: 3;
  left: clamp(32px, 5vw, 70px);
  top: 47%;
  width: min(46%, 560px);
  margin: 0;
  padding: 0;
  font-size: clamp(18px, 1.8vw, 25px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.02em;
}

.testimonial blockquote.testimonial-quote--long {
  top: 43%;
  width: min(52%, 650px);
  font-size: clamp(15px, 1.35vw, 20px);
  line-height: 1.42;
}
.testimonial-media--no-image {
  background: linear-gradient(135deg, #06172c 0%, #0a3768 58%, #05080d 100%);
}

.players {
  overflow: hidden;
  padding-top: 80px;
  padding-bottom: 100px;
  border-top: 1px solid var(--line);
}

.players-overline {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.players > h2 {
  margin: 0 0 56px;
  font-size: var(--type-section-lg);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.players-viewport {
  overflow: hidden;
  margin-right: calc(var(--pad) * -1);
  padding-top: 18px;
}

.players-track {
  display: grid;
  grid-auto-columns: clamp(320px, 31vw, 420px);
  grid-auto-flow: column;
  gap: 4px;
  width: max-content;
  padding-right: var(--pad);
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}

.player-card {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: .76;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  background: #202020;
  transition: transform .42s cubic-bezier(.2,.8,.2,1), border-color .25s ease;
}

.player-card.is-expanded {
  z-index: 5;
  border-color: rgba(255,255,255,.42);
}

.player-visual {
  position: absolute;
  inset: 0;
  overflow: hidden;
  filter: none;
}

.player-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.player-card--serena .player-photo { object-position: 52% center; }
.player-card--naomi .player-photo { object-position: 50% center; }
.player-card--stefanos .player-photo { object-position: 50% center; }
.player-card--holger .player-photo { object-position: 46% center; }
.player-card--coco .player-photo { object-position: 50% center; }

.player-card--serena .player-visual {
  background: radial-gradient(circle at 65% 28%, #a5a5a5 0 8%, transparent 8.5%), linear-gradient(145deg, #393939, #101010 60%);
}

.player-card--stefanos .player-visual {
  background: radial-gradient(circle at 52% 26%, #9c9c9c 0 8%, transparent 8.5%), linear-gradient(115deg, #171717, #5b5b5b 58%, #181818);
}

.player-card--holger .player-visual {
  background: radial-gradient(circle at 50% 25%, #b0b0b0 0 8%, transparent 8.5%), linear-gradient(150deg, #5a5a5a, #141414 70%);
}

.player-card--coco .player-visual {
  background: radial-gradient(circle at 48% 27%, #9f9f9f 0 8%, transparent 8.5%), linear-gradient(125deg, #151515, #555 55%, #111);
}

.player-card--grigor .player-visual,
.player-card--jeremy .player-visual,
.player-card--yanina .player-visual,
.player-card--marcos .player-visual,
.player-card--alexei .player-visual {
  background: radial-gradient(circle at 52% 27%, #a4a4a4 0 8%, transparent 8.5%), linear-gradient(135deg, #171717, #565656 58%, #101010);
}

.player-card--simona .player-visual,
.player-card--anastasia .player-visual,
.player-card--aravane .player-visual {
  background: radial-gradient(circle at 48% 25%, #ababab 0 8%, transparent 8.5%), linear-gradient(145deg, #4f4f4f, #111 72%);
}

.player-card--anastasia .player-meta h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
}

.player-visual::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(0,0,0,.04) 30%, rgba(0,0,0,.14) 52%, rgba(0,0,0,.92) 100%);
}

.player-monogram {
  position: absolute;
  left: 50%;
  top: 42%;
  transform: translate(-50%, -50%);
  color: rgba(255,255,255,.08);
  font-size: clamp(82px, 10vw, 150px);
  font-weight: 900;
  letter-spacing: -.1em;
}

.player-meta {
  position: absolute;
  z-index: 2;
  inset: 0;
}

.flag { display: none; }

.player-meta h3 {
  position: absolute;
  left: 24px;
  bottom: 72px;
  display: flex;
  flex-direction: column;
  margin: 0;
  font-size: clamp(2rem, 3vw, 2.75rem);
  font-weight: 450;
  line-height: .82;
  letter-spacing: -.04em;
  text-transform: uppercase;
}

.player-meta h3 span { font-weight: 420; }
.player-meta h3 strong { font-weight: 850; }

.player-meta p {
  position: absolute;
  left: 24px;
  bottom: 22px;
  width: fit-content;
  margin: 0;
  padding: 7px 12px 6px;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.badge {
  position: absolute;
  top: 20px;
  left: 20px;
  display: inline-block;
  padding: 8px 13px 7px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  color: var(--white);
  background: rgba(25,25,25,.5);
  font-size: 10px;
  font-weight: 500;
  text-transform: capitalize;
  backdrop-filter: blur(8px);
}

.player-more {
  position: absolute;
  z-index: 6;
  top: 18px;
  right: 18px;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.76);
  border-radius: 50%;
  place-items: center;
  color: var(--white);
  background: rgba(7,7,7,.34);
  backdrop-filter: blur(8px);
  cursor: pointer;
}

.player-more > span[aria-hidden="true"] {
  display: block;
  font: 300 28px/1 var(--font-body);
  transition: transform .3s ease;
}

.player-card.is-expanded .player-more > span[aria-hidden="true"] { transform: rotate(45deg); }

.player-collaboration {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 88px 26px 30px;
  background: #000;
  opacity: 1;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  pointer-events: none;
  transform: translateY(100%);
  transition: transform .58s cubic-bezier(.72,0,.18,1);
}

.player-collaboration-label {
  margin: 0 0 10px;
  color: #72afff;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.player-collaboration-copy {
  margin: 0;
  color: var(--white);
  font-size: 15px;
  line-height: 1.45;
}

.player-card.is-expanded .player-collaboration {
  pointer-events: auto;
  transform: translateY(0);
}

.players-controls {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 48px;
}

.player-arrow {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #5b5b58;
  border-radius: 50%;
  color: var(--white);
  background: transparent;
  font-size: 14px;
  cursor: pointer;
  transition: color .2s, background .2s;
}

.player-arrow:hover {
  color: var(--black);
  background: var(--white);
}

.players-progress {
  position: relative;
  width: min(220px, 30vw);
  height: 1px;
  background: #373735;
}

.players-progress span {
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  height: 1px;
  background: var(--white);
  transform-origin: left;
  transition: width .4s ease;
}

.news {
  padding-top: 80px;
  padding-bottom: 100px;
  border-top: 1px solid var(--line);
}

.news-overline,
.partners-overline {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.news > h2,
.partners > h2 {
  margin: 0 0 58px;
  font-size: var(--type-section-lg);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.news-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "one two"
    "one four"
    "three four";
  grid-template-rows: 270px 330px 270px;
  width: 100%;
  max-width: none;
  margin-left: 0;
  border-top: 1px solid #a5a5a1;
  border-left: 1px solid #a5a5a1;
}

.news-card { border-right: 1px solid #a5a5a1; border-bottom: 1px solid #a5a5a1; }
.news-card--one { grid-area: one; }
.news-card--two { grid-area: two; }
.news-card--three { grid-area: three; }
.news-card--four { grid-area: four; }

.news-card > a {
  display: flex;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.news-card--one > a,
.news-card--four > a { flex-direction: column; }

.news-image {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.news-image > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.news-card--one .news-image > img,
.news-card--four .news-image > img { object-position: center; }

.news-card--one .news-image {
  background:
    radial-gradient(circle at 55% 38%, #5f91a5 0 9%, transparent 9.5%),
    radial-gradient(ellipse at 52% 80%, #164f68 0 28%, transparent 28.5%),
    linear-gradient(135deg, #02aee9, #0354a1);
}

.news-card--four .news-image {
  background:
    radial-gradient(circle at 65% 42%, #a3a3a3 0 9%, transparent 9.5%),
    radial-gradient(ellipse at 48% 72%, #686868 0 24%, transparent 24.5%),
    linear-gradient(135deg, #161616, #777);
}

.news-image::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.48));
}

.news-image > span {
  position: absolute;
  left: 50%;
  top: 45%;
  transform: translate(-50%, -50%);
  color: rgba(255,255,255,.13);
  font-size: 90px;
  font-weight: 900;
  letter-spacing: -.1em;
}

.news-content {
  position: relative;
  flex: 1;
  min-height: 0;
  padding: 22px 24px;
}

.news-card--one .news-content,
.news-card--four .news-content { flex: 0 0 250px; }

.news-type {
  display: block;
  width: fit-content;
  margin-bottom: 9px;
  padding: 7px 12px 6px;
  border-radius: 999px;
  color: #d6d6d2;
  background: #2b2b2b;
  font-size: 6px;
  font-weight: 500;
  text-transform: lowercase;
}

.news-content time {
  display: block;
  margin-bottom: 12px;
  font-size: 8px;
  font-weight: 600;
}

.news-content h3 {
  margin: 0 0 12px;
  font-size: clamp(1.5rem, 2.2vw, 2.125rem);
  font-weight: 900;
  line-height: .94;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.news-content p {
  max-width: none;
  margin: 0 0 25px;
  color: #cececa;
  font-size: 11px;
  line-height: 1.4;
}

.read-more {
  position: absolute;
  right: 22px;
  bottom: 18px;
  font-size: 7px;
  font-weight: 700;
  text-transform: uppercase;
}

.news-card a:hover .news-content h3 { text-decoration: underline; text-underline-offset: 3px; }

.partners {
  padding-top: 50px;
  padding-bottom: 90px;
}

.partner-logos {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  width: 100%;
  max-width: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.partner-logos::-webkit-scrollbar { display: none; }

.partner-logo {
  display: flex;
  min-width: 160px;
  height: 82px;
  align-items: center;
  justify-content: flex-start;
}

/* Each logo gets the same visual area: the height follows its aspect ratio. */
.partner-logo img {
  display: block;
  width: auto;
  max-width: 100%;
  height: var(--partner-logo-h, 32px);
  object-fit: contain;
  opacity: .5;
  transition: opacity .25s ease;
}

.partner-logo img[src$="/asics.png"] { --partner-logo-h: 41px; }
.partner-logo img[src$="/dunlop.png"] { --partner-logo-h: 33px; }
.partner-logo img[src$="/waterdrop.png"] { --partner-logo-h: 31px; }
.partner-logo img[src$="/bymycar.png"] { --partner-logo-h: 33px; }

.partner-logo:hover img { opacity: .82; }

.brands {
  overflow: hidden;
  padding-top: 80px;
  padding-bottom: 100px;
  border-top: 1px solid var(--line);
}

.brands-overline,
.newsletter-overline {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.brands > h2 {
  margin: 0 0 55px;
  font-size: var(--type-section-lg);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.07em;
  text-transform: uppercase;
}

.brands-viewport {
  overflow-x: auto;
  margin-right: calc(var(--pad) * -1);
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}

.brands-viewport::-webkit-scrollbar { display: none; }

.brands-track {
  display: grid;
  grid-auto-columns: clamp(235px, 25vw, 330px);
  grid-auto-flow: column;
  gap: 14px;
  width: max-content;
  padding-right: var(--pad);
}

.brand-card {
  position: relative;
  display: flex;
  min-height: 500px;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 36px 24px;
  border-radius: 8px;
  scroll-snap-align: start;
  text-align: center;
  isolation: isolate;
}

.brand-card::before,
.brand-card::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
}

.brand-card::after {
  background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.5) 48%, rgba(0,0,0,.9) 100%);
}
.brand-card--academy::before { background: url("./assets/images/brand-mouratoglou-academy.jpg") center / cover no-repeat; }
.brand-card--school::before { background: url("./assets/images/brand-mouratoglou-school.webp") center / cover no-repeat; }
.brand-card--uts::before { background: url("./assets/images/brand-uts.webp") 48% center / cover no-repeat; }
.brand-card--hotel::before { background: url("./assets/images/brand-hotel-resort.webp?v=20261007") center / cover no-repeat; }
.brand-card--padel::before { background: url("./assets/images/brand-m-padel.png") 54% 89% / auto 125% no-repeat; }
.brand-card--center::before { background: url("./assets/images/brand-tennis-centers.jpg") center / cover no-repeat; }
.brand-card--apparel::before { background: url("./assets/images/brand-mouratoglou-apparel.webp") center / cover no-repeat; }
.brand-card--unlmtd::before { background: #17261a url("./assets/images/brand-unlmtd-soccer.webp") 41% 64.7% / auto 178% no-repeat; }
.brand-card--champseed::before {
  background: #061b2b url("./assets/images/brand-champseed-pm-gala-2025.jpg") 50% -260px / auto 160% no-repeat;
}

.brand-card-mark {
  position: absolute;
  left: 24px;
  right: 24px;
  top: 30%;
  height: 112px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  transform: translateY(-50%);
  text-transform: uppercase;
}

.brand-card-mark i {
  font-size: 66px;
  font-style: normal;
  font-weight: 900;
  line-height: .8;
  letter-spacing: -.12em;
}

.brand-card-mark img {
  width: min(76%, 170px);
  height: 110px;
  object-fit: contain;
}

.brand-card--academy .brand-card-mark img {
  width: min(50%, 108px);
  height: 84px;
}

.brand-card--center .brand-card-mark img {
  width: min(82%, 184px);
  height: 126px;
  transform: scale(1.18);
}

.brand-card--uts .brand-card-mark img {
  width: min(46%, 96px);
  height: 64px;
}

.brand-card--school .brand-card-mark img {
  width: min(46%, 96px);
  height: 74px;
}

.brand-card--hotel .brand-card-mark img,
.brand-card--padel .brand-card-mark img {
  width: min(84%, 188px);
  height: 132px;
  transform: scale(1.2);
}

.brand-card--apparel .brand-card-mark img {
  width: min(82%, 184px);
  height: 128px;
  transform: scale(1.18);
}

.brand-card--unlmtd .brand-card-mark img {
  width: min(64%, 145px);
  height: 72px;
}

.brand-card--champseed .brand-card-mark img {
  width: min(34%, 72px);
  height: 88px;
}

.brand-card-mark strong { margin-top: 10px; font-size: 12px; line-height: .95; }
.brand-card-mark--uts i { color: #ff174d; font-size: 58px; font-style: italic; letter-spacing: -.09em; }
.brand-card--padel .brand-card-mark strong { font-size: 30px; }

.brand-card > p {
  min-height: 31px;
  margin: 0 0 18px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.3;
}

.brand-card > p strong {
  display: block;
  margin-bottom: 7px;
  font-weight: 900;
  letter-spacing: .02em;
  line-height: 1;
  text-transform: uppercase;
}

.brand-card > p strong:only-child {
  margin-bottom: 0;
}

.brand-card--detailed {
  min-height: 540px;
}

.brand-card--detailed > p {
  font-size: 13px;
  line-height: 1.38;
}

.brand-card > a {
  padding: 8px 13px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 18px;
  font-size: 8px;
  text-decoration: none;
  transition: color .2s, background .2s;
}

.brand-card > a:hover { color: var(--black); background: var(--white); }

.brands-controls {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 44px;
}

.brand-arrow {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #5b5b58;
  border-radius: 50%;
  color: var(--white);
  background: transparent;
  cursor: pointer;
}

.brands-progress {
  position: relative;
  width: min(280px, 35vw);
  height: 1px;
  background: #373735;
}

.brands-progress span {
  position: absolute;
  left: 0;
  top: 0;
  width: 40%;
  height: 1px;
  background: var(--white);
  transition: width .3s ease;
}

.newsletter {
  min-height: auto;
  padding-top: 90px;
  padding-bottom: 100px;
  border-top: 1px solid var(--line);
}

.newsletter-grid {
  display: block;
}

.newsletter h2 {
  max-width: 850px;
  margin: 0 0 30px;
  font-size: var(--type-section-lg);
  font-weight: 900;
  line-height: .9;
  letter-spacing: -.075em;
  text-transform: uppercase;
}

.newsletter-grid > div > p {
  max-width: none;
  margin: 0;
  font-size: 18px;
  line-height: 1.4;
}

.newsletter-form {
  width: calc((100% - 36px) / 2);
  max-width: none;
  margin-top: 44px;
}

.newsletter-form label {
  display: block;
  margin-bottom: 14px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}

.players,
.news,
.brands,
.newsletter,
.contact {
  border-top: 0;
}

.newsletter-field {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-bottom: 0;
}

.newsletter-field input {
  flex: 0 0 48px;
  width: 100%;
  height: 48px;
  min-height: 48px;
  min-width: 0;
  padding: 0 18px;
  border: 1px solid #65717b;
  border-radius: 999px;
  outline: 0;
  color: var(--white);
  background: transparent;
  font: 500 14px/1 var(--font-body);
}

.newsletter-field input::placeholder { color: #6e6e6a; }

.newsletter-field button {
  width: 100%;
  height: 44px;
  padding: 0 18px;
  border: 1px solid var(--white);
  border-radius: 999px;
  color: var(--black);
  background: var(--white);
  font: 500 13px/1 var(--font-body);
  text-transform: none;
  cursor: pointer;
}

.form-status { min-height: 18px; margin: 10px 0 0; color: #8ebcff; font-size: 10px; }
.form-status.error { color: #ff7777; }

.form-legal {
  max-width: 950px;
  margin: 20px 0 0;
  color: #6f6f6b;
  font-size: 10px;
  line-height: 1.35;
}

.contact {
  min-height: auto;
  padding-top: 90px;
  padding-bottom: 38px;
  border-top: 1px solid var(--line);
}

.contact-overline {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.contact-grid {
  display: grid;
  grid-template-columns: minmax(310px, .8fr) minmax(480px, 1.2fr);
  gap: clamp(60px, 9vw, 150px);
  align-items: start;
}

.contact-heading h2 {
  margin: 0 0 30px;
  font-size: var(--type-section-xl);
  font-weight: 900;
  line-height: .86;
  letter-spacing: -.075em;
  text-transform: uppercase;
}

.contact-heading p {
  max-width: 320px;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.contact-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}

.contact-fields label > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
}

.contact-fields input,
.contact-fields select,
.contact-fields textarea {
  width: 100%;
  border: 1px solid #565653;
  border-radius: 0;
  outline: 0;
  color: var(--white);
  background: #0a0a0a;
  font: 500 11px/1.2 var(--font-body);
  transition: border-color .2s;
}

.contact-fields input,
.contact-fields select { height: 44px; padding: 0 13px; }
.contact-fields textarea { min-height: 190px; padding: 13px; resize: vertical; }
.contact-fields input::placeholder,
.contact-fields textarea::placeholder { color: #747470; }
.contact-fields select { color-scheme: dark; color: #747470; }

.contact-fields input:focus,
.contact-fields select:focus,
.contact-fields textarea:focus { border-color: var(--white); }

.contact-message { grid-column: 1 / -1; }

.contact-submit-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 30px;
  margin-top: 18px;
}

.consent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  max-width: 420px;
  color: #797975;
  font-size: 8px;
  line-height: 1.35;
}

.consent input { accent-color: var(--white); }

.contact-submit-row button {
  flex: 0 0 auto;
  padding: 10px 17px;
  border: 1px solid #5d5d59;
  border-radius: 20px;
  color: var(--white);
  background: transparent;
  font: 700 8px/1 var(--font-body);
  text-transform: uppercase;
  cursor: pointer;
  transition: color .2s, background .2s;
}

.contact-submit-row button:hover { color: var(--black); background: var(--white); }

.contact-status { min-height: 18px; margin: 10px 0 0; color: #8ebcff; font-size: 10px; }
.contact-status.error { color: #ff7777; }
.contact-legal { margin: 12px 0 0; color: #62625f; font-size: 7px; line-height: 1.35; }

.contact-grid { display: block; }

.contact-heading h2 {
  max-width: 850px;
  margin-bottom: 30px;
  font-size: var(--type-section-lg);
  line-height: .9;
}

.contact-heading p {
  max-width: none;
  font-size: 22px;
  color: var(--white);
}

.contact-form {
  width: min(100%, 820px);
  margin-top: 42px;
}

.contact-progress {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 28px;
}

.contact-progress i {
  flex: 1;
  height: 1px;
  background: #a8a8a4;
}

.progress-number {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid #a8a8a4;
  border-radius: 50%;
  color: var(--white);
  font-size: 15px;
}

.progress-number.active {
  color: var(--black);
  background: var(--white);
  border-color: var(--white);
}

.contact-step {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.contact-step[hidden] { display: none; }

.contact-fields { gap: 18px 24px; }

.contact-fields input,
.contact-fields select,
.contact-fields textarea {
  border: 1px solid #65717b;
  color: var(--white);
  background: transparent;
  font-size: 14px;
}

.contact-fields input,
.contact-fields select {
  height: 46px;
  padding: 0 16px;
  border-radius: 999px;
}

.phone-control {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 8px;
  width: 100%;
}

.contact-fields .phone-control select,
.contact-fields .phone-control input { min-width: 0; }
.contact-fields .phone-control select {
  padding: 0 38px 0 14px;
  color: var(--white);
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23f4f4f1' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 10px 7px;
}
.contact-fields .phone-control option { color: var(--white); background: #090909; }

.phone-label { display: block; }
.phone-control.has-error select,
.phone-control.has-error input { border-color: #ff7777; }
.phone-error {
  display: block;
  min-height: 18px;
  margin: 7px 4px 0;
  color: #ff7777;
  font: 500 12px/1.35 var(--font-body);
}

.country-label { position: relative; z-index: 80; }
.country-combobox { position: relative; z-index: 80; width: 100%; }
.contact-fields .country-combobox input[type="search"] {
  padding-right: 44px;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23f4f4f1' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 18px center;
  background-size: 10px 7px;
}
.contact-fields .country-combobox input[type="search"]::-webkit-search-cancel-button { display: none; }
.country-combobox.has-error input { border-color: #ff7777; }
.country-options {
  position: fixed;
  z-index: 2147483000;
  width: 100%;
  max-height: 300px;
  overflow-y: auto;
  padding: 7px;
  border: 1px solid #65717b;
  border-radius: 18px;
  background: #050505;
  box-shadow: 0 18px 45px rgba(0, 0, 0, .65);
  scrollbar-width: thin;
  scrollbar-color: #606c77 #111;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.country-options[hidden] { display: none; }
.country-options button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 40px;
  padding: 9px 12px;
  border: 0;
  border-radius: 11px;
  color: var(--white);
  background: transparent;
  font: 500 14px/1.2 var(--font-body);
  text-align: left;
  cursor: pointer;
}
.country-options button:hover,
.country-options button.is-active { color: #fff; background: #0a3260; }
.country-options button small { margin-left: 16px; color: #8d969e; font-size: 11px; }
.country-empty { margin: 0; padding: 12px; color: #9aa2a8; font-size: 13px; }

.contact-fields textarea {
  min-height: 140px;
  padding: 16px;
  border-radius: 20px;
}

.contact-next,
.contact-send,
.contact-back {
  height: 46px;
  margin-top: 20px;
  border: 1px solid var(--white);
  border-radius: 999px;
  font: 500 13px/1 var(--font-body);
  cursor: pointer;
}

.contact-next,
.contact-send {
  width: 100%;
  color: var(--black);
  background: var(--white);
}

.contact-actions { display: flex; gap: 16px; }
.contact-actions .contact-back {
  width: 25%;
  color: var(--white);
  background: transparent;
}
.contact-actions .contact-send { width: 75%; }
.consent { margin-top: 20px; max-width: none; font-size: 11px; }
.contact-status { font-size: 13px; }
.contact-legal { max-width: 950px; margin-top: 20px; font-size: 10px; }

.site-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 120px;
  padding: 48px 0 34px;
  border-top: 0;
  color: var(--white);
  font-size: 15px;
  text-transform: uppercase;
}

.footer-wordmark { color: var(--white); }
.footer-wordmark img { width: clamp(235px, 22vw, 310px); }

.footer-socials {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

.footer-socials a {
  display: block;
  width: 34px;
  height: 34px;
  overflow: hidden;
  opacity: .95;
  transition: opacity .2s ease, transform .2s ease;
}

.footer-socials a:hover { opacity: 1; transform: translateY(-2px); }

.footer-socials img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* The YouTube mark is wider than tall: enlarge it slightly so it weighs the same as the others. */
.footer-socials img[src*="youtube"] { transform: scale(1.18); }
.footer-socials a:has(img[src*="youtube"]) { overflow: visible; }

.footer-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px 38px;
  margin-top: 12px;
}

.footer-nav a {
  color: var(--white);
  font: 500 15px/1 var(--font-body);
  text-decoration: none;
}

.footer-nav a:hover { opacity: .65; }

.footer-nav.footer-legal { gap: 12px 24px; margin-top: 4px; }
.footer-nav.footer-legal a { font-size: 11px; line-height: 1.5; text-transform: none; opacity: .7; }

/* Readability pass for all Geometria interface and editorial copy. */
.media-placeholder small,
.photo-note { font-size: 10px; }

.eyebrow {
  font-size: 11px;
}

.section-kicker,
.voices-overline,
.players-overline,
.news-overline,
.partners-overline,
.brands-overline,
.newsletter-overline,
.contact-overline {
  font-size: 12px;
}

.about-copy { font-size: clamp(16px, 1.25vw, 19px); }
.timeline li {
  font-size: 17px;
  line-height: 1.35;
}

.quote-grid article > p:last-child,
.news-content p,
.brand-card > p,
.newsletter-grid > div > p {
  font-size: 14px;
}

.quote-grid article > p:last-child,
.stats-grid p {
  font-size: 15px;
  line-height: 1.45;
}

.quote-grid article > p:last-child { max-width: none; }
.stats-grid p { width: 100%; max-width: none; }

.stats-grid .stat-label {
  font-size: 16px;
}

.voice-tabs button {
  font-size: 13px;
}

.player-meta p,
.news-content time,
.newsletter-form label {
  font-size: 12px;
}

.player-title > span:last-child { font-size: 24px; }
.testimonial blockquote { font-size: clamp(18px, 1.8vw, 25px); }

.news-type,
.read-more,
.brand-card > a {
  font-size: 9px;
}

.news-type { font-size: 13px; }
.news-content time { font-size: 14px; }
.news-content p { font-size: 16px; line-height: 1.5; }
.read-more { font-size: 13px; }

.brand-card-mark strong { font-size: 16px; }
.brand-card--padel .brand-card-mark strong { font-size: 30px; }
.brand-card > p {
  max-width: 95%;
  font-size: 16px;
  line-height: 1.45;
}
.brand-card > a {
  padding: 11px 18px 10px;
  font-size: 13px;
  font-weight: 600;
}

.newsletter-form .form-status { font-size: 13px; }
.newsletter-form .form-legal { max-width: 950px; margin-top: 20px; font-size: 10px; }
.form-status { font-size: 11px; }
.contact-status { font-size: 13px; }
.form-legal { font-size: 10px; }
.contact-legal { font-size: 10px; }

.newsletter-grid > div > p,
.contact-heading p {
  color: var(--white);
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}
.contact-fields input,
.contact-fields select,
.contact-fields textarea { font-size: 14px; }
.consent { font-size: 11px; }
.contact-submit-row button { font-size: 10px; }
.site-footer { font-size: 10px; }

.anchor-target { min-height: 1px; }

@media (max-width: 900px) {
  :root { --pad: 18px; }

  .site-header {
    height: 64px;
    background: rgba(5,5,5,.82);
    backdrop-filter: blur(10px);
    mix-blend-mode: normal;
  }

  .menu-toggle { display: flex; }
  .menu-toggle > span:first-child:not(.menu-lines) { display: none; }

  .sidebar {
    inset: 64px 0 auto 0;
    width: auto;
    height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 50px var(--pad);
    background: var(--black);
    transform: translateY(-120%);
    transition: transform .35s cubic-bezier(.22,.85,.25,1);
  }

  body.menu-open { overflow: hidden; }
  body.menu-open .sidebar { transform: translateY(0); }
  body.menu-open .menu-lines { transform: rotate(45deg); }
  body.menu-open .menu-lines::before { transform: rotate(-90deg); }
  body.menu-open .menu-lines::after { opacity: 0; }

  .site-nav { gap: 18px; }
  .site-nav a { font-size: clamp(38px, 10.5vw, 46px); }
  .socials { width: auto; margin-top: 44px; gap: 14px; }
  .socials a { width: 32px; height: 32px; }

  main { padding-left: 0; }
  .section-shell { padding-left: var(--pad); }

  .hero { min-height: auto; padding-top: 84px; padding-bottom: 44px; }
  .hero-media { height: 72vh; min-height: 540px; border-radius: 14px; }
  .hero-image { object-position: 38% center; }

  .hero-copy {
    left: 18px;
    right: 18px;
    top: auto;
    bottom: 36px;
    max-width: calc(100% - 36px);
    align-items: flex-start;
    transform: none;
    text-align: left;
  }
  .hero h1 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(30px, 8.7vw, 34px);
    line-height: .9;
    letter-spacing: -.055em;
    white-space: normal;
  }
  .hero-editorial {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 22px;
    padding-bottom: 36px;
  }
  .hero-editorial h2 {
    max-width: 330px;
    font-size: var(--type-section-title);
  }
  .hero-editorial-copy {
    gap: 18px;
  }
  .hero-editorial-copy p {
    font-size: 15px;
  }
  .current-offers {
    padding-top: 0;
    padding-bottom: 36px;
  }
  .current-offers-heading {
    margin-bottom: 28px;
  }
  .current-offers-heading h2 { font-size: var(--type-section-title); }
  .current-offers-grid {
    grid-auto-columns: 88%;
    gap: 10px;
  }
  .current-offer {
    min-height: min(650px, 138vw);
    border-radius: 14px;
  }
  .current-offer-content { padding: 22px; }
  .current-offer h3 {
    max-width: 100%;
    margin-bottom: 10px;
    font-size: clamp(24px, 7vw, 30px);
  }
  .current-offer--ambassador h3 {
    font-size: clamp(22px, 6.4vw, 27px);
    letter-spacing: -.055em;
  }
  .current-offer-copy {
    max-width: 100%;
    font-size: 13.5px;
    line-height: 1.4;
  }
  .current-offer-actions { width: 100%; gap: 7px; margin-top: 16px; }
  .current-offer-cta { min-height: 38px; font-size: 11.5px; }
  .current-offer--speaker > img { object-position: 43% center; }
  .current-offer--ambassador > img { object-position: 44% center; }
  .current-offer--coaching > img { object-position: 48% center; }
  .current-offer--book > img { object-position: 57% center; }
  .current-offers-controls { margin-top: 24px; }
  .about { padding-top: 36px; padding-bottom: 36px; }
  .section-kicker { margin-bottom: 18px; }
  .about-grid { grid-template-columns: 1fr; gap: 52px; }
  .about h2 { font-size: clamp(38px, 11vw, 48px); }
  .timeline { margin-top: 36px; }
  .timeline li {
    grid-template-columns: 78px 1fr;
    gap: 12px;
    padding: 18px 0;
  }
  .timeline li.timeline-grouped::after { left: 90px; }
  .timeline time { font-size: 16px; }
  .timeline span { font-size: 15px; }

  .manifesto { padding-top: 36px; padding-bottom: 36px; }
  .manifesto > h2 { text-align: left; margin-bottom: 28px; }
  .quote-grid { grid-template-columns: 1fr; gap: 12px; }

  .identity {
    grid-template-columns: 1fr;
    gap: 48px;
    padding-top: 0;
    padding-bottom: 55px;
  }
  .identity-intro h2 { font-size: clamp(32px, 9vw, 42px); }
  .identity-intro p { font-size: 15px; }
  .identity-roles li { padding: 14px 0 11px; font-size: clamp(27px, 8vw, 38px); }

  .results { padding-top: 36px; padding-bottom: 36px; }
  .stats-groups { grid-template-columns: 1fr; gap: 40px; }
  .stats-group .stats-grid { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 3px; }
  /* Compact two-column key figures; an odd last card spans the full row. */
  .stats-grid article,
  .stats-group .stats-grid article { min-height: 0; padding: 20px 16px 22px; }
  .stats-grid article:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .stats-grid strong { margin-bottom: 10px; font-size: 40px; }
  .stats-grid .stat-label { margin-bottom: 8px; font-size: 12.5px; }
  .stats-grid p { font-size: 12px; line-height: 1.4; }

  .voices { padding-top: 36px; padding-bottom: 36px; }
  .voices > h2 { margin-bottom: 24px; }
  .voice-tabs {
    left: 22px;
    right: 22px;
    top: 48px;
    overflow-x: auto;
    margin: 0;
    padding: 6px 0 10px;
    transform: none;
    scrollbar-width: none;
  }
  .voice-tabs::-webkit-scrollbar { display: none; }
  .voice-tabs button { flex: 0 0 auto; }
  /* Name and quote stack at the bottom of the card so long quotes never overlap the name. */
  .testimonial-media {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 16px;
    min-height: 560px;
    padding: 110px 22px 26px;
    border-radius: 14px;
  }
  .testimonial-media::before {
    background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.05) 30%, rgba(0,0,0,.55) 58%, rgba(0,0,0,.85) 100%);
  }
  .testimonial-image { object-position: 66% center; }
  .player-title,
  .testimonial blockquote,
  .testimonial blockquote.testimonial-quote--long {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
  }
  .testimonial-first-name,
  .testimonial-last-name { font-size: clamp(34px, 9.5vw, 44px); }
  .player-title > span:last-child { margin-top: 12px; font-size: 18px; }
  .testimonial blockquote {
    font-size: 16px;
    line-height: 1.45;
  }
  .testimonial blockquote.testimonial-quote--long {
    font-size: 14px;
    line-height: 1.4;
  }

  .players { padding-top: 36px; padding-bottom: 36px; }
  .players > h2 { margin-bottom: 24px; }
  .players-viewport { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .players-viewport::-webkit-scrollbar { display: none; }
  .players-track {
    grid-auto-columns: 88vw;
    width: max-content;
    transition: none;
  }
  .player-card { height: auto; scroll-snap-align: start; }
  .player-meta h3 { left: 20px; bottom: 68px; font-size: 32px; }
  .player-meta p { left: 20px; bottom: 20px; }
  .players-controls { gap: 12px; margin-top: 28px; }
  .players-controls .players-progress { width: 22vw; }
  .players-cta { padding: 10px 14px 9px; font-size: 12px; }

  .news { padding-top: 36px; padding-bottom: 36px; }
  .news > h2, .partners > h2 { margin-bottom: 24px; }
  .news-grid {
    grid-template-columns: 1fr;
    grid-template-areas: "one" "two" "three" "four";
    grid-template-rows: auto;
  }
  .news-card--one .news-content,
  .news-card--four .news-content { flex-basis: auto; }
  .news-content { min-height: 280px; padding: 20px; }
  .news-image { min-height: 300px; }
  .news-content h3 { font-size: 21px; }

  .partners { padding-top: 36px; padding-bottom: 36px; }
  .partner-logos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 18px;
    overflow: visible;
    padding-bottom: 0;
  }
  .partner-logo {
    min-width: 0;
    height: 64px;
    justify-content: center;
  }
  .partner-logo img[src$="/asics.png"] { --partner-logo-h: 35px; }
  .partner-logo img[src$="/dunlop.png"] { --partner-logo-h: 28px; }
  .partner-logo img[src$="/waterdrop.png"] { --partner-logo-h: 27px; }
  .partner-logo img[src$="/bymycar.png"] { --partner-logo-h: 28px; }

  .brands { padding-top: 36px; padding-bottom: 36px; }
  .brands > h2 { margin-bottom: 24px; }
  .brands-track { grid-auto-columns: 78vw; }
  .brand-card { min-height: 520px; }
  .brands-controls { margin-top: 28px; }

  .newsletter { min-height: auto; padding-top: 36px; padding-bottom: 36px; }
  .newsletter-grid { grid-template-columns: 1fr; gap: 60px; }
  .newsletter h2 { font-size: var(--type-section-lg); }
  .newsletter-grid > div > p { font-size: 18px; }
  .newsletter-form { width: 100%; margin-top: 40px; }

  .contact { min-height: auto; padding-top: 36px; }
  .contact-grid { grid-template-columns: 1fr; gap: 55px; }
  .contact-heading h2 { font-size: var(--type-section-lg); }
  .contact-heading p { font-size: 18px; }
  .contact-form { width: 100%; margin-top: 40px; }
  .contact-fields { grid-template-columns: 1fr; }
  .contact-message { grid-column: auto; }
  .contact-fields { gap: 16px; }
  .contact-actions .contact-back { width: 34%; }
  .contact-actions .contact-send { width: 66%; }
  .contact-submit-row { align-items: flex-end; }
  .site-footer { align-items: center; margin-top: 48px; padding-bottom: 24px; }
  .footer-wordmark img { width: 230px; }
  .footer-socials { gap: 22px; }
  .footer-socials a { width: 24px; height: 24px; }
  /* Mobile footer links: a balanced 3 + 2 menu, then the legal links under a thin rule. */
  .footer-nav { gap: 16px 0; width: min(100%, 330px); margin-top: 4px; }
  .footer-nav a { flex: 0 0 33.333%; font-size: 13px; letter-spacing: .03em; text-align: center; }
  .footer-nav.footer-legal {
    gap: 8px 22px;
    width: calc(100% - 40px);
    margin-top: 6px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.12);
  }
  .footer-nav.footer-legal a { flex: 0 0 auto; font-size: 11.5px; letter-spacing: 0; }
}

@media (max-width: 390px) {
  .stats-grid strong { font-size: 36px; }
  .stats-grid article,
  .stats-group .stats-grid article { padding: 18px 14px 20px; }
}

/* One shared scale for every section title across all pages. */
.about h2,
.manifesto > h2,
.identity-intro h2,
.voices > h2,
.players > h2,
.news > h2,
.partners > h2,
.brands > h2,
.newsletter h2,
.contact-heading h2 {
  font-size: var(--type-section-title);
}

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

.player-card--simona .player-visual,
.player-card--grigor .player-visual,
.player-card--jeremy .player-visual,
.player-card--anastasia .player-visual,
.player-card--yanina .player-visual,
.player-card--aravane .player-visual,
.player-card--marcos .player-visual {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.player-card--simona .player-visual { background-image: url("./assets/images/simona-halep-player.webp"); }
.player-card--grigor .player-visual { background-image: url("./assets/images/grigor-dimitrov-player.webp"); }
.player-card--jeremy .player-visual { background-image: url("./assets/images/jeremy-chardy-player.webp"); }
.player-card--anastasia .player-visual { background-image: url("./assets/images/anastasia-pavlyuchenkova-player.webp"); }
.player-card--yanina .player-visual { background-image: url("./assets/images/yanina-wickmayer-player.webp"); }
.player-card--aravane .player-visual { background-image: url("./assets/images/aravane-rezai-player.webp"); }
.player-card--marcos .player-visual { background-image: url("./assets/images/marcos-baghdatis-player.webp"); }

.player-card--simona .player-monogram,
.player-card--grigor .player-monogram,
.player-card--jeremy .player-monogram,
.player-card--anastasia .player-monogram,
.player-card--yanina .player-monogram,
.player-card--aravane .player-monogram,
.player-card--marcos .player-monogram {
  display: none;
}

.player-card--alexei .player-visual {
  background: url("./assets/images/alexei-popyrin-player.jpg") center / cover no-repeat;
}

.player-card--alexei .player-monogram { display: none; }

/* Tighter global rhythm: halve the vertical space between homepage sections. */
.hero { padding-bottom: 38px; }
.about { padding-top: 45px; padding-bottom: 45px; }
.manifesto { padding-top: 30px; padding-bottom: 45px; }
.identity { padding-bottom: 35px; }
.results { padding-top: 35px; padding-bottom: 40px; }
.voices { padding-top: 27.5px; padding-bottom: 50px; }
.players { padding-top: 40px; padding-bottom: 50px; }
.news { padding-top: 40px; padding-bottom: 50px; }
.partners { padding-top: 25px; padding-bottom: 45px; }
.brands { padding-top: 40px; padding-bottom: 50px; }
.newsletter { padding-top: 45px; padding-bottom: 50px; }
.contact { padding-top: 45px; padding-bottom: 19px; }
.site-footer { margin-top: 60px; }

@media (max-width: 900px) {
  .hero { padding-bottom: 50px; }
  .about { padding-top: 25px; padding-bottom: 35px; }
  .manifesto { padding-top: 22.5px; padding-bottom: 35px; }
  .identity { padding-bottom: 27.5px; }
  .results { padding-top: 25px; padding-bottom: 32.5px; }
  .voices { padding-top: 22.5px; padding-bottom: 35px; }
  .players { padding-top: 30px; padding-bottom: 35px; }
  .news { padding-top: 30px; padding-bottom: 35px; }
  .partners { padding-top: 20px; padding-bottom: 35px; }
  .brands { padding-top: 30px; padding-bottom: 35px; }
  .newsletter { padding-top: 30px; padding-bottom: 35px; }
  .contact { padding-top: 30px; padding-bottom: 19px; }
  .site-footer { margin-top: 40px; }
}

/* Dark native dropdowns that remain readable across desktop and mobile browsers. */
.contact-fields select {
  color-scheme: dark;
  color: var(--white);
  background-color: #050505;
  -webkit-appearance: none;
  appearance: none;
  padding-right: 54px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23f4f4f1' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 24px center;
  background-size: 10px 7px;
}

.contact-fields select option {
  color: var(--white);
  background-color: #0a0a0a;
  font-family: var(--font-body);
  font-size: 15px;
}

.contact-fields select option[value=""] { color: #9c9c98; }
.contact-fields select option:checked {
  color: #fff;
  background-color: var(--accent);
}

/* The hidden attribute always wins (used to switch off the "My tips" newsletter blocks and links). */
[hidden] { display: none !important; }

/* Anti-spam honeypot field: off-screen rather than display:none, which some bots skip. */
.form-trap { position: absolute !important; left: -10000px !important; top: auto; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

/* Stat labels were h3 headings; kept as plain labels for a cleaner heading outline. */
.stat-label { font-family: var(--font-display); }

/* Mouse drag-to-scroll sliders (see script.js). */
.is-draggable { cursor: grab; }
.is-draggable.is-dragging { cursor: grabbing; scroll-snap-type: none !important; scroll-behavior: auto !important; user-select: none; }
.is-draggable.is-dragging * { pointer-events: none; }

/* Privacy policy link inside the GDPR notices. */
.contact-legal a, .form-legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.contact-legal a:hover, .form-legal a:hover { color: var(--white); }

/* Optional email / SMS marketing consents stacked under the required consent. */
.consent + .consent { margin-top: 10px; }

/* Coaching call to action next to the players carousel arrows (same look as the hero Biography button). */
.players-cta { flex: 0 0 auto; margin-top: 0; margin-left: auto; white-space: nowrap; }
/* On desktop the carousel bleeds into the right padding: extend the arrows row too so the button lines up with the cards' right edge. */
@media (min-width: 901px) {
  .players-controls { margin-right: calc(var(--pad) * -1); }
}

/* Desktop: the partner logos span the same width as the network cards below them,
   from the first card's left edge to the carousel's right edge, with larger logos. */
@media (min-width: 901px) {
  .partner-logos {
    display: flex;
    justify-content: space-between;
    width: auto;
    margin-right: calc(var(--pad) * -1);
    overflow: visible;
  }
  .partner-logo { min-width: 0; flex: 0 0 auto; }
  .partner-logo img[src$="/asics.png"] { --partner-logo-h: clamp(34px, 3.8vw, 55px); }
  .partner-logo img[src$="/dunlop.png"] { --partner-logo-h: clamp(28px, 3.1vw, 45px); }
  .partner-logo img[src$="/waterdrop.png"] { --partner-logo-h: clamp(26px, 2.9vw, 42px); }
  .partner-logo img[src$="/bymycar.png"] { --partner-logo-h: clamp(28px, 3.1vw, 45px); }
}