:root {
  color-scheme: only light; /* stops phone browsers (Brave, Chrome "force dark") from inverting the page */
  --blue: #1420c0;
  --lime: #ccff00;
  --dark: #242424;
  --white: #f8f8f8;
  --font-display: "Anton", "Impact", sans-serif;
  --font-body: "Poppins", system-ui, sans-serif;
  /* design is laid out on a 1280px reference; --u scales it */
  --u: calc(100vw / 1280);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--dark); color: var(--white); font-family: var(--font-body); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; border: 0; background: none; color: inherit; cursor: pointer; }
ul { list-style: none; }

/* ---------- hero shell ---------- */
.hero {
  position: relative;
  background: var(--blue);
  height: calc(var(--u) * 756);
  isolation: isolate;
  z-index: 2; /* above .services so the tilted marquee overlaps the next section */
}
.hero__noise {
  position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .28; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.4 -.2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.hero__inner {
  position: relative; z-index: 1;
  width: calc(var(--u) * 992); margin: 0 auto; height: 100%;
}

/* ---------- header ---------- */
.header {
  position: absolute; z-index: 5; top: calc(var(--u) * 12); left: 50%; transform: translateX(-50%);
  width: calc(var(--u) * 992);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
}
.phone { justify-self: end; }
.logo { display: flex; align-items: center; gap: calc(var(--u) * 10); }
.logo__star { width: calc(var(--u) * 62); height: calc(var(--u) * 62); color: var(--lime); }
.logo__text { display: flex; flex-direction: column; line-height: 1; }
.logo__name { position: relative; font-family: var(--font-display); font-size: calc(var(--u) * 37); letter-spacing: .01em; }
.logo__name sup { position: absolute; left: 100%; top: calc(var(--u) * 1); margin-left: calc(var(--u) * 2); font-family: var(--font-body); font-size: calc(var(--u) * 9); line-height: 1; }
.logo__sub { display: flex; justify-content: space-between; margin-top: calc(var(--u) * 4); font-family: var(--font-body); font-weight: 700; font-size: calc(var(--u) * 11.5); line-height: 1; }

.nav { display: flex; gap: calc(var(--u) * 22); font-family: var(--font-display); font-size: calc(var(--u) * 12); letter-spacing: .02em; text-transform: uppercase; }
.nav a { display: inline-flex; align-items: center; gap: calc(var(--u) * 4); transition: color .25s; }
.nav a:hover, .nav a.is-active { color: var(--lime); }
.nav svg { width: calc(var(--u) * 8); height: calc(var(--u) * 5); }

.phone { display: flex; align-items: center; gap: calc(var(--u) * 14); }
.phone__icon { width: calc(var(--u) * 44); height: calc(var(--u) * 44); border-radius: 50%; background: var(--lime); color: #111; display: grid; place-items: center; transition: transform .3s; }
.phone__icon svg { width: 46%; height: 46%; }
.phone:hover .phone__icon { transform: rotate(-12deg) scale(1.06); }
.phone__text { display: flex; flex-direction: column; }
.phone__text small { font-size: calc(var(--u) * 10.5); text-transform: uppercase; font-weight: 500; }
.phone__text strong { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 14); letter-spacing: .03em; }

/* ---------- left column ---------- */
.hero__left { position: absolute; left: 0; top: calc(var(--u) * 138); width: calc(var(--u) * 116); z-index: 4; }
.crew__avatars { display: flex; }
.crew__avatars img { width: calc(var(--u) * 38); height: calc(var(--u) * 38); border-radius: 50%; border: calc(var(--u) * 2) solid #f8f8f8; margin-left: calc(var(--u) * -9); object-fit: cover; }
.crew__avatars img:first-child { margin-left: calc(var(--u) * 4); }
.crew__text { margin-top: calc(var(--u) * 9); padding-top: calc(var(--u) * 7); border-top: 1px solid var(--lime); font-family: var(--font-display); font-size: calc(var(--u) * 11); line-height: 1.2; text-transform: uppercase; letter-spacing: .01em; }

.stats { margin-top: calc(var(--u) * 110); }
.stats li { padding-bottom: calc(var(--u) * 24); margin-bottom: calc(var(--u) * 21); border-bottom: 1px solid var(--lime); }
.stats li:last-child { border: 0; margin: 0; padding: 0; }
.stats__num { display: flex; align-items: baseline; gap: calc(var(--u) * 7); line-height: 1; }
.stats__num b { font-weight: 600; font-size: calc(var(--u) * 40); letter-spacing: .02em; }
.stats__num i { font-style: normal; font-weight: 600; font-size: calc(var(--u) * 20); color: var(--lime); }
.stats__label { display: block; margin-top: calc(var(--u) * 9); font-family: var(--font-display); font-size: calc(var(--u) * 14.8); line-height: 1.2; text-transform: uppercase; }

/* ---------- headline + person ---------- */
.headline { position: absolute; inset: 0; z-index: 2; font-weight: 400; pointer-events: none; }
.headline__layer { position: absolute; inset: 0; display: block; }
.headline__line {
  position: absolute; left: 0; display: block; white-space: nowrap;
  font-family: var(--font-display); font-size: calc(var(--u) * 222); line-height: 1; letter-spacing: -0.0167em; /* Anton 300px / lh 300px / ls -5px on the 1728px original */
  text-transform: uppercase;
}
.headline__line--1 { top: calc(var(--u) * 138); left: calc(var(--u) * 146); }
.headline__line--2 { top: calc(var(--u) * 358); left: calc(var(--u) * 199); }
.headline__line span { display: block; will-change: transform; }

.headline__layer--fill { z-index: 1; color: var(--lime); }
.headline__layer--outline { z-index: 3; color: transparent; -webkit-text-stroke: calc(var(--u) * 1.5) var(--lime); }

.hero__person {
  position: absolute; z-index: 2; left: calc(var(--u) * 211); top: calc(var(--u) * -26);
  width: calc(var(--u) * 580); height: auto; will-change: transform;
  clip-path: inset(0 0 calc(var(--u) * 82) 0); /* cut at the hero edge, under the marquee */
}

/* ---------- right column ---------- */
.hero__badge {
  position: absolute; z-index: 4; right: calc(var(--u) * 2); top: calc(var(--u) * 138);
  width: calc(var(--u) * 98); height: calc(var(--u) * 98); border-radius: 50%; border: 1.5px solid var(--lime); color: var(--lime);
  display: grid; place-items: center;
}
.hero__badge svg { width: 46%; height: 46%; animation: spin 9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.hero__right { position: absolute; z-index: 4; right: 0; top: calc(var(--u) * 421); width: calc(var(--u) * 178); }
.hero__right p { font-size: calc(var(--u) * 11.4); letter-spacing: .03em; line-height: 1.65; text-align: justify; font-weight: 400; }
.btn {
  display: inline-flex; align-items: center; gap: calc(var(--u) * 12); margin-top: calc(var(--u) * 26);
  padding: calc(var(--u) * 11) calc(var(--u) * 19); border: 1.5px solid var(--lime);
  font-family: var(--font-display); font-size: calc(var(--u) * 12); letter-spacing: .12em; text-transform: uppercase;
  transition: background .3s, color .3s;
}
.btn svg { width: calc(var(--u) * 14); height: calc(var(--u) * 14); }
.btn:hover { background: var(--lime); color: #111; }
.btn:hover svg path { stroke: var(--lime); }
.btn:hover svg circle { fill: #111; }

.play { position: absolute; left: calc(var(--u) * -4); top: calc(var(--u) * 190); width: calc(var(--u) * 52); height: calc(var(--u) * 52); }
.play__core { position: absolute; inset: 0; border-radius: 50%; background: var(--lime); color: #111; display: grid; place-items: center; transition: transform .3s; }
.play__core svg { width: 38%; height: 38%; margin-left: 8%; }
.play__ring { position: absolute; inset: calc(var(--u) * -9); border-radius: 50%; background: rgba(204,255,0,.22); border: calc(var(--u) * 5) solid rgba(204,255,0,.18); animation: pulse 2.2s ease-out infinite; }
.play:hover .play__core { transform: scale(1.1); }
@keyframes pulse { 0% { transform: scale(.85); opacity: 1; } 100% { transform: scale(1.25); opacity: 0; } }

/* ---------- tilted marquee ---------- */
.marquee {
  position: absolute; z-index: 6; left: -4vw; width: 108vw; bottom: calc(var(--u) * -48);
  transform: rotate(1.9deg); transform-origin: 50% 50%;
  background: var(--lime); color: var(--dark); overflow: hidden;
  height: calc(var(--u) * 96); display: flex; align-items: center;
}
.marquee__track { display: flex; width: max-content; will-change: transform; }
.marquee__group { display: flex; align-items: center; flex-shrink: 0; font-family: var(--font-display); font-size: calc(var(--u) * 55); text-transform: uppercase; line-height: 1; white-space: nowrap; }
.marquee__group span { padding: 0 calc(var(--u) * 22); }
.marquee__group i { font-style: normal; font-family: var(--font-body); font-weight: 600; font-size: calc(var(--u) * 46); transform: translateY(calc(var(--u) * 9)); }

/* ---------- what we do ---------- */
.container { width: calc(var(--u) * 992); margin: 0 auto; }
.services { background: var(--dark); padding: calc(var(--u) * 140) 0 calc(var(--u) * 72); position: relative; z-index: 1; }

.services__head { display: grid; grid-template-columns: calc(var(--u) * 173) 1fr auto; align-items: end; }
.eyebrow { display: flex; align-items: center; gap: calc(var(--u) * 13); align-self: start; margin-top: calc(var(--u) * 8); font-family: var(--font-display); font-size: calc(var(--u) * 15.5); text-transform: uppercase; }
.eyebrow svg { width: calc(var(--u) * 27); height: calc(var(--u) * 27); color: var(--lime); }
.services__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.13; text-transform: uppercase; max-width: calc(var(--u) * 640); }
.btn--sm { margin: 0 0 calc(var(--u) * 6); padding: calc(var(--u) * 11) calc(var(--u) * 19); }

.cards { display: flex; align-items: flex-start; gap: calc(var(--u) * 20); margin-top: calc(var(--u) * 54); }
.card {
  flex: 1 1 0; background: #2e2e2e; position: relative;
  transition: transform .35s ease;
}
.card:hover { transform: scale(1.02); }
.card--featured { background: var(--blue); transform: scale(1.02); }
.card--featured:hover { transform: scale(1.04); }

.card__top { display: flex; align-items: center; justify-content: space-between; gap: calc(var(--u) * 12); padding: calc(var(--u) * 35) calc(var(--u) * 26) calc(var(--u) * 5); }
.card__top::after { content: none; }
.card__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 29.6); line-height: 1.2; text-transform: uppercase; color: var(--white); max-width: calc(var(--u) * 210); }
.card__arrow { flex: none; width: calc(var(--u) * 52); height: calc(var(--u) * 52); border-radius: 50%; background: var(--lime); color: var(--dark); display: grid; place-items: center; }
.card__arrow svg { width: 46%; height: 46%; }
.card__arrow svg { transition: transform .35s ease; }
.card:hover .card__arrow svg { transform: rotate(45deg); } /* ↗ turns to → */

.card__text {
  margin: 0 calc(var(--u) * 26); padding-top: calc(var(--u) * 15); border-top: 1px solid rgba(255,255,255,.14);
  font-size: calc(var(--u) * 11.4); line-height: 1.65; letter-spacing: .02em; text-align: justify; color: rgba(248,248,248,.88);
}
.card__img { display: block; width: calc(100% - var(--u) * 30); margin: calc(var(--u) * 25) auto calc(var(--u) * 15); height: calc(var(--u) * 192); object-fit: cover; }

/* featured card: image first, copy below */
.card--featured .card__img { margin: calc(var(--u) * 15) auto 0; filter: grayscale(1) contrast(1.05); }
.card--featured .card__body { padding: calc(var(--u) * 50) 0 calc(var(--u) * 25); }
.card--featured .card__top { padding: calc(var(--u) * 0) calc(var(--u) * 24) calc(var(--u) * 5); }
.card--featured .card__text { margin: 0 calc(var(--u) * 24); }

/* ---------- who we are ---------- */
.about { position: relative; background: #e3e3e3; color: var(--dark); padding: calc(var(--u) * 74) 0 calc(var(--u) * 70); z-index: 1; overflow: hidden; }
.about__noise, .cta::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: #e3e3e3 url("../assets/bg-1.jpg") center center / cover fixed;
}
.about__grid { position: relative; display: grid; grid-template-columns: calc(var(--u) * 367) calc(var(--u) * 367) calc(var(--u) * 248); column-gap: calc(var(--u) * 5); align-items: start; }

.eyebrow--dark { color: var(--dark); margin-top: 0; }
.about__left .eyebrow { margin-bottom: calc(var(--u) * 5); }
.about__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.13; text-transform: uppercase; }
.about__text { margin-top: calc(var(--u) * 13); font-size: calc(var(--u) * 11.85); line-height: 1.56; letter-spacing: .02em; text-align: justify; color: #646464; }

.facts { margin-top: calc(var(--u) * 26); }
.facts li { display: flex; align-items: center; gap: calc(var(--u) * 19); }
.facts li + li { margin-top: calc(var(--u) * 19); padding-top: calc(var(--u) * 19); border-top: 1px solid rgba(36,36,36,.16); }
.facts__icon { flex: none; width: calc(var(--u) * 52); height: calc(var(--u) * 52); border-radius: 50%; display: grid; place-items: center; }
.facts__icon svg { width: 58%; height: 58%; }
.facts__icon--lime { background: var(--lime); color: var(--dark); }
.facts__icon--blue { background: var(--blue); color: #fff; }
.facts__label { font-family: var(--font-display); font-size: calc(var(--u) * 23.6); text-transform: uppercase; line-height: 1.1; }

/* centre portrait stands on the logo strip; lime panel sits behind her */
.about__center { position: relative; margin-top: calc(var(--u) * 73); height: calc(var(--u) * 404); }
.about__frame { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: calc(var(--u) * 264); height: calc(var(--u) * 177); background: var(--lime); border: calc(var(--u) * 5) solid var(--dark); border-bottom: 0; }
.about__person { position: absolute; inset: auto 0 0 0; width: 100%; height: 100%; object-fit: contain; object-position: bottom; }

.about__right { margin-top: 0; }
.about__photo { width: 100%; height: calc(var(--u) * 103); object-fit: cover; display: block; }
.skills { margin-top: calc(var(--u) * 17); }
.skills li + li { margin-top: calc(var(--u) * 17); }
.skills__row { display: flex; justify-content: space-between; align-items: baseline; font-family: var(--font-display); text-transform: uppercase; }
.skills__row span { font-size: calc(var(--u) * 13.2); }
.skills__row b { font-weight: 400; font-size: calc(var(--u) * 14); }
.skills__track { margin-top: calc(var(--u) * 5); height: calc(var(--u) * 8); background: #ececec; border-radius: 99px; overflow: hidden; }
.skills__bar { display: block; height: 100%; width: 0; border-radius: 99px; }
.skills__bar--lime { background: var(--lime); }
.skills__bar--blue { background: var(--blue); }
.skills__bar--dark { background: var(--dark); }
.about__right .about__text { margin-top: calc(var(--u) * 14); }
.btn--blue { margin-top: calc(var(--u) * 26); border-color: var(--blue); color: var(--dark); }
.btn--blue:hover { background: var(--lime); border-color: var(--lime); color: var(--dark); }
.btn--blue svg path { stroke: #e3e3e3; }
.btn--blue:hover svg path { stroke: var(--lime); }

/* client logos carousel */
.logos { grid-column: 1 / -1; overflow: hidden; background: #313131; border-radius: calc(var(--u) * 18.5); height: calc(var(--u) * 133); display: flex; align-items: center; position: relative; }
.logos__track { display: flex; will-change: transform; }
.logos__item { flex: none; width: calc(var(--u) * 114.4); margin-right: calc(var(--u) * 11.1); display: grid; place-items: center; color: var(--lime); }
.logos__item svg { width: calc(var(--u) * 70); height: calc(var(--u) * 54); }

/* ---------- statement ---------- */
.statement { background: var(--dark); color: var(--white); padding: calc(var(--u) * 78) 0 calc(var(--u) * 78); text-align: center; position: relative; z-index: 1; }
.statement__quote { width: calc(var(--u) * 1000); margin: 0 auto; font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 44.4); line-height: 1.25; text-transform: uppercase; }
.statement__quote > * { vertical-align: baseline; }

.outline { color: transparent; -webkit-text-stroke: 1px currentColor; }
.outline--white { -webkit-text-stroke-color: #fff; }
.outline--lime { -webkit-text-stroke-color: var(--lime); }
.outline--dark { -webkit-text-stroke-color: var(--dark); }
a.outline { display: inline-block; }

.chip { display: inline-block; padding: 0 calc(var(--u) * 10); border-radius: calc(var(--u) * 14); line-height: 1.1; transition: transform .35s cubic-bezier(.3,.7,.3,1); }
.chip--blue { background: var(--blue); }
.chip--lime { background: var(--lime); padding: 0 calc(var(--u) * 8); }
.pop { display: inline-block; color: var(--lime); transition: transform .35s cubic-bezier(.3,.7,.3,1); }
.tilt { transition: transform .35s cubic-bezier(.3,.7,.3,1); }
[data-tilt] { transform: rotate(calc(var(--r, 0) * 1deg)); }
.chip--blue:hover { --r: 0 !important; }

.pic { display: inline-block; width: calc(var(--u) * 100); height: calc(var(--u) * 38); margin: 0 calc(var(--u) * 6); border-radius: 99px; overflow: hidden; vertical-align: middle; transform: translateY(calc(var(--u) * -3)); }
.pic--wide { width: calc(var(--u) * 164); }
.pic img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; display: block; }

.statement__sign { display: inline-flex; align-items: center; gap: calc(var(--u) * 12); margin-top: calc(var(--u) * 54); font-family: var(--font-display); font-size: calc(var(--u) * 13); text-transform: uppercase; }
.statement__sign svg { width: calc(var(--u) * 22); height: calc(var(--u) * 22); color: var(--lime); }

/* ---------- team ---------- */
.team { position: relative; background: #e3e3e3; color: var(--dark); padding: calc(var(--u) * 75) 0; overflow: hidden; z-index: 1; }
.team__grid { position: relative; display: grid; grid-template-columns: calc(var(--u) * 352) 1fr; column-gap: calc(var(--u) * 75); align-items: center; }
.team__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.13; text-transform: uppercase; margin-top: calc(var(--u) * 6); }
.team__copy .about__text { margin-top: calc(var(--u) * 16); color: #3a3a3a; font-size: calc(var(--u) * 11.5); }
.team__stats { display: flex; gap: calc(var(--u) * 62); margin-top: calc(var(--u) * 34); padding-left: calc(var(--u) * 40); }
.team__stats li { display: flex; flex-direction: column; }
.team__num { position: relative; display: flex; align-items: baseline; gap: calc(var(--u) * 7); line-height: 1; }
.team__num svg { position: absolute; left: 0; top: 50%; width: calc(var(--u) * 84); height: calc(var(--u) * 84); color: var(--lime); transform: translate(-50%, -52%); transform-origin: 50% 50%; z-index: 0; }
.team__num b { position: relative; z-index: 1; font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 62); }
@keyframes starPulse { 0%,100% { transform: translate(-50%,-52%) scale(1) rotate(0); } 50% { transform: translate(-50%,-52%) scale(1.08) rotate(8deg); } }
.team__num svg { animation: starPulse 4s ease-in-out infinite; }
.team__num i { font-style: normal; font-family: var(--font-body); font-weight: 600; font-size: calc(var(--u) * 28); color: var(--blue); }
.team__label { margin-top: calc(var(--u) * 14); font-family: var(--font-display); font-size: calc(var(--u) * 15); text-transform: uppercase; }

.team__panels { display: flex; gap: calc(var(--u) * 15); height: calc(var(--u) * 410); }
.team__card { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; cursor: pointer; transition: flex-grow .6s cubic-bezier(.65,0,.25,1); background: #bbb; outline: none; }
.team__card.is-open { flex-grow: 2.5; }
.team__card img { position: absolute; top: 0; left: 50%; height: 100%; width: calc(var(--u) * 400); max-width: none; object-fit: cover; transform: translateX(-50%); }
.team__info { position: absolute; left: 0; right: 0; bottom: 0; padding: calc(var(--u) * 60) calc(var(--u) * 15) calc(var(--u) * 14); background: linear-gradient(to top, #000 8%, rgba(0,0,0,0)); opacity: 0; transition: opacity .35s; }
.team__card.is-open .team__info { opacity: 1; transition-delay: .25s; }
.team__info h3 { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 24); line-height: 1.2; text-transform: uppercase; color: #fff; white-space: nowrap; }
.team__info p { font-size: calc(var(--u) * 11.6); font-weight: 600; text-transform: uppercase; color: var(--lime); white-space: nowrap; }

/* ---------- process ---------- */
.process { position: relative; background: #e3e3e3; color: var(--dark); padding: calc(var(--u) * 76) 0 calc(var(--u) * 74); z-index: 1; overflow: hidden; }
.process .container { position: relative; }
.process__head { display: grid; grid-template-columns: calc(var(--u) * 496) 1fr; column-gap: calc(var(--u) * 50); align-items: end; }
.process__title { margin-top: calc(var(--u) * 4); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.1; text-transform: uppercase; white-space: nowrap; }
.process__text { margin-bottom: calc(var(--u) * 6); font-size: calc(var(--u) * 11.5); line-height: 1.6; color: #4a4a4a; text-align: justify; }
.steps { display: flex; align-items: flex-start; gap: calc(var(--u) * 14); margin-top: calc(var(--u) * 36); }
.step { position: relative; flex: 1 1 0; height: calc(var(--u) * 246); padding: calc(var(--u) * 22); transition: transform .4s ease; overflow: hidden; }
.step:nth-child(odd) { height: calc(var(--u) * 282); }
.step:hover { transform: scale(1.02); }
.step--blue { background: var(--blue); color: #fff; }
.step--dark { background: var(--dark); color: #fff; }
.step__num { display: block; font-family: var(--font-display); font-size: calc(var(--u) * 62); line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .55); }
.step--dark .step__num { -webkit-text-stroke-color: #4a4a4a; }
.step__tag { position: absolute; top: calc(var(--u) * 28); right: calc(var(--u) * 22); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 23.7); line-height: 1; text-transform: uppercase; color: var(--lime); }
.step__title { position: absolute; left: calc(var(--u) * 22); right: calc(var(--u) * 22); bottom: calc(var(--u) * 24); font-family: var(--font-display); font-size: calc(var(--u) * 30); line-height: 1.17; text-transform: uppercase; }
.step__title span { display: block; }

/* ---------- testimonials ---------- */
.testi { background: var(--dark); color: #fff; padding: calc(var(--u) * 106) 0 calc(var(--u) * 74); position: relative; z-index: 1; }
.testi__head { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.testi__head .btn { justify-self: end; margin: 0; }
.testi__head .eyebrow { margin-top: 0; }
.testi__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.1; text-transform: uppercase; white-space: nowrap; }
.testi__slider { margin-top: calc(var(--u) * 36); overflow: hidden; }
.testi__track { display: flex; gap: calc(var(--u) * 15); will-change: transform; }
.tcard { position: relative; flex: 0 0 calc((100% - var(--u) * 15) / 2); height: calc(var(--u) * 264); padding: calc(var(--u) * 30); background: #2b2b2b; }
.tcard__stars { display: flex; gap: calc(var(--u) * 5.5); padding-top: calc(var(--u) * 4); }
.tcard__stars svg { width: calc(var(--u) * 13); height: calc(var(--u) * 13); fill: var(--lime); }
.tcard__text { margin-top: calc(var(--u) * 24); font-size: calc(var(--u) * 14.4); line-height: 1.43; color: #f1f1f1; padding-right: calc(var(--u) * 14); }
.tcard__who { position: absolute; left: calc(var(--u) * 30); bottom: calc(var(--u) * 30); display: flex; align-items: center; gap: calc(var(--u) * 15); }
.tcard__who img { width: calc(var(--u) * 52); height: calc(var(--u) * 52); border-radius: 50%; object-fit: cover; background: #fff; border: 2px solid #fff; }
.tcard__name { font-family: var(--font-display); font-size: calc(var(--u) * 15); line-height: 1.2; text-transform: uppercase; }
.tcard__role { margin-top: calc(var(--u) * 3); font-size: calc(var(--u) * 10); color: var(--lime); }
.tcard__quote { position: absolute; right: calc(var(--u) * 24); bottom: calc(var(--u) * 33); width: calc(var(--u) * 37); height: auto; color: var(--lime); }

/* ---------- blog ---------- */
.blog { position: relative; background: #e3e3e3; color: var(--dark); padding: calc(var(--u) * 87) 0 calc(var(--u) * 75); z-index: 1; overflow: hidden; }
.blog .container { position: relative; }
.blog__head { display: grid; grid-template-columns: calc(var(--u) * 546) 1fr; column-gap: 0; align-items: end; }
.blog__title { margin-top: calc(var(--u) * 6); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.1; text-transform: uppercase; }
.blog__side { padding-bottom: calc(var(--u) * 4); }
.blog__side .process__text { margin: 0; }
.blog__side .btn { display: inline-flex; margin: calc(var(--u) * 35) 0 0; }
.btn--blue { color: var(--dark); border-color: var(--blue); }
.btn--blue:hover { background: var(--blue); color: #fff; }
.posts { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: calc(var(--u) * 22.5); margin-top: calc(var(--u) * 41); }
.post__thumb { display: block; aspect-ratio: 1300 / 1280; background: #cfcfcf; }
.post__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease, opacity .4s ease; }
.post:hover .post__thumb img { transform: scale(1.05) rotate(2deg); opacity: .8; }
.post__meta { display: flex; gap: calc(var(--u) * 10); margin-top: calc(var(--u) * 21); }
.post__meta span { display: inline-flex; align-items: center; gap: calc(var(--u) * 6); height: calc(var(--u) * 24); padding: 0 calc(var(--u) * 10); border-radius: 999px; background: var(--lime); font-size: calc(var(--u) * 9.6); color: var(--dark); }
.post__meta svg { width: calc(var(--u) * 11); height: calc(var(--u) * 11); }
.post__title { margin-top: calc(var(--u) * 16); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 23.7); line-height: 1.22; text-transform: uppercase; }
.post__title a { color: inherit; }

/* ---------- newsletter ---------- */
.news { position: relative; display: flex; align-items: center; height: calc(var(--u) * 250); margin-top: calc(var(--u) * 75); padding-left: calc(var(--u) * 340); border-radius: calc(var(--u) * 15); background: #2d2d2d; color: #fff; overflow: hidden; }
.news__ring { position: absolute; left: calc(var(--u) * -202); top: 50%; width: calc(var(--u) * 404); height: calc(var(--u) * 404); transform: translateY(-50%); color: var(--lime); }
.news__star { position: absolute; left: calc(var(--u) * -142); top: 50%; width: calc(var(--u) * 285); height: calc(var(--u) * 285); margin-top: calc(var(--u) * -142); color: var(--lime); transform-origin: 50% 50%; }
.news__body { position: relative; width: calc(var(--u) * 620); }
.news__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 30.2); line-height: 1.16; text-transform: uppercase; }
.news__title span { display: block; }
.news__text { margin-top: calc(var(--u) * 16); font-size: calc(var(--u) * 10.5); color: #5d5d5d; }
.news__form { display: flex; align-items: flex-end; margin-top: calc(var(--u) * 27); width: calc(var(--u) * 505); }
.news__form input { flex: 1; min-width: 0; height: calc(var(--u) * 42); padding: 0; border: 0; border-bottom: 1.5px solid var(--lime); background: transparent; color: #fff; font: inherit; font-size: calc(var(--u) * 10.5); outline: 0; }
.news__form input::placeholder { color: #5d5d5d; }
.news__form .btn { margin: 0; height: calc(var(--u) * 42); padding: 0 calc(var(--u) * 28); background: transparent; color: #fff; cursor: pointer; }
.news__form .btn:hover { background: var(--lime); color: var(--dark); }

/* ---------- footer ---------- */
.footer { position: relative; z-index: 1; background: var(--dark); color: #fff; padding: calc(var(--u) * 74) 0 calc(var(--u) * 30); }
.footer__grid { display: grid; grid-template-columns: calc(var(--u) * 328) calc(var(--u) * 149) calc(var(--u) * 238) minmax(0, 1fr); align-items: start; }
.footer__logo { display: inline-flex; align-items: center; gap: calc(var(--u) * 14); }
.footer__logo svg { width: calc(var(--u) * 68); height: calc(var(--u) * 68); color: var(--lime); }
.footer__word { position: relative; display: block; }
.footer__logo b { position: relative; display: block; width: max-content; font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 47); line-height: 1; letter-spacing: .01em; }
.footer__logo sup { position: absolute; left: 100%; top: .08em; margin-left: .08em; font-size: .26em; line-height: 1; }
.footer__logo i { display: flex; justify-content: space-between; margin-top: calc(var(--u) * 6); font-style: normal; font-family: var(--font-body); font-weight: 700; font-size: calc(var(--u) * 11); line-height: 1; }
.footer__h { margin-top: calc(var(--u) * 28); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 16); line-height: 1; text-transform: uppercase; }
.footer__h--lime { margin-top: calc(var(--u) * 4); font-size: calc(var(--u) * 26); color: var(--lime); }
.footer__p { margin-top: calc(var(--u) * 14); font-size: calc(var(--u) * 10.5); line-height: 1.75; color: #626262; }
.footer__p a { color: inherit; }
.footer__col ul { margin-top: calc(var(--u) * 28); }
.footer__col li + li { margin-top: calc(var(--u) * 14); }
.footer__col a { display: flex; align-items: center; font-size: calc(var(--u) * 10.5); line-height: 1.6; color: #666; transition: color .3s; }
.footer__col a:hover { color: var(--lime); }
.footer__col--social svg, .footer__glyph { width: calc(var(--u) * 14); height: calc(var(--u) * 14); margin-right: calc(var(--u) * 21); color: var(--lime); flex: none; }
.footer__glyph { font-family: var(--font-body); font-weight: 700; font-size: calc(var(--u) * 14); line-height: 1; letter-spacing: -.02em; text-align: center; width: calc(var(--u) * 14); height: auto; }
.footer__big { display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(var(--u) * 14); font-family: var(--font-display); line-height: 1.1; }
.footer__big a { font-size: calc(var(--u) * 26); color: #fff; white-space: nowrap; }
.footer__big a[href^="mailto"] { font-size: calc(var(--u) * 19.5); }
.footer__big span { padding-left: calc(var(--u) * 8); font-size: calc(var(--u) * 13); line-height: 1.05; text-transform: uppercase; color: #666; }
.footer__about { margin-top: calc(var(--u) * 24); font-size: calc(var(--u) * 10.5); line-height: 1.75; color: #5e5e5e; text-align: justify; }
.footer__marquee { margin-top: calc(var(--u) * -6); overflow: hidden; width: 100vw; margin-left: calc(50% - 50vw); }
.footer__track { display: flex; width: max-content; animation: footerMarquee 34s linear infinite; }
.footer__track span { display: flex; align-items: center; flex: none; padding: 0 calc(var(--u) * 15); font-family: var(--font-display); font-size: calc(var(--u) * 222); line-height: 1.3; letter-spacing: -.0167em; text-transform: uppercase; white-space: nowrap; color: transparent; -webkit-text-stroke: calc(var(--u) * 1.5) #77881c; }
.footer__track i { font-style: normal; margin-left: calc(var(--u) * 30); }
@keyframes footerMarquee { to { transform: translateX(-50%); } }
.footer__bar { display: flex; justify-content: space-between; margin-top: calc(var(--u) * 6); padding-top: calc(var(--u) * 22); border-top: 1px solid #2f2f2f; font-size: calc(var(--u) * 10.5); color: #4d4d4d; }
.footer__bar a { margin-left: calc(var(--u) * 22); color: inherit; }
.footer__bar a:hover { color: var(--lime); }

/* ---------- contact page ---------- */
.page-hero { position: relative; background: var(--blue); height: calc(var(--u) * 330); isolation: isolate; color: #fff; text-align: center; z-index: 2; }
.page-hero__text { position: absolute; left: 0; right: 0; top: calc(var(--u) * 160); z-index: 1; }
.page-hero__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.05; text-transform: uppercase; }
.crumbs { margin-top: calc(var(--u) * 22); font-size: calc(var(--u) * 12); font-weight: 500; text-transform: uppercase; }
.crumbs a { color: var(--lime); transition: opacity .3s; }
.crumbs a:hover { opacity: .75; }
.crumbs span { margin: 0 calc(var(--u) * 2); }
.contact { position: relative; background: #e3e3e3; color: var(--dark); padding: calc(var(--u) * 74) 0 calc(var(--u) * 75); z-index: 1; overflow: hidden; }
.contact__grid { position: relative; display: grid; grid-template-columns: calc(var(--u) * 477) calc(var(--u) * 477); column-gap: calc(var(--u) * 38); align-items: start; }
.form { background: var(--dark); color: #fff; padding: calc(var(--u) * 30) calc(var(--u) * 30) calc(var(--u) * 31); }
.form__title { font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 37); line-height: 1.1; text-transform: uppercase; }
.field { position: relative; display: block; margin-top: calc(var(--u) * 5); border-bottom: 1.5px solid var(--lime); }
.field:first-of-type { margin-top: calc(var(--u) * 26); }
.field input, .field textarea { display: block; width: 100%; padding: calc(var(--u) * 24) 0 calc(var(--u) * 9); border: 0; background: transparent; color: #fff; font: inherit; font-size: calc(var(--u) * 12); outline: 0; resize: none; }
.field textarea { height: calc(var(--u) * 104); padding-top: calc(var(--u) * 24); }
.field__label { position: absolute; left: 0; top: calc(var(--u) * 24); font-size: calc(var(--u) * 11); color: #5c5c5c; pointer-events: none; transition: transform .25s, font-size .25s, color .25s; transform-origin: 0 0; }
.field:focus-within .field__label, .field.is-filled .field__label { transform: translateY(calc(var(--u) * -18)); font-size: calc(var(--u) * 9.5); color: var(--lime); }
.form__btn { margin-top: calc(var(--u) * 24); padding: calc(var(--u) * 15) calc(var(--u) * 40); background: transparent; color: #fff; font-size: calc(var(--u) * 13); cursor: pointer; }
.form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.form { position: relative; }
.form__btn:disabled { opacity: .6; cursor: progress; }
.form__note.is-error { color: #ff8a8a; }
.form__btn:hover { background: var(--lime); color: var(--dark); }
.form__note { min-height: 1.2em; margin-top: calc(var(--u) * 12); font-size: calc(var(--u) * 11); color: var(--lime); }
.info { padding-top: calc(var(--u) * 4); }
.info .eyebrow { margin-top: 0; }
.info__title { margin-top: calc(var(--u) * 12); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.05; text-transform: uppercase; }
.info__text { margin-top: calc(var(--u) * 20); font-size: calc(var(--u) * 12); line-height: 1.6; color: #4a4a4a; }
.info__sub { margin-top: calc(var(--u) * 30); font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 28); line-height: 1.1; text-transform: uppercase; }
.info__list { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--u) * 22) calc(var(--u) * 22); margin-top: calc(var(--u) * 24); }
.info__list dt { font-family: var(--font-display); font-size: calc(var(--u) * 17); line-height: 1.2; text-transform: uppercase; }
.info__list dd { margin-top: calc(var(--u) * 6); font-family: var(--font-display); font-size: calc(var(--u) * 14.5); line-height: 1.35; color: var(--blue); }
.info__list a { color: inherit; transition: opacity .3s; }
.info__list a:hover { opacity: .7; }
.map { margin-top: calc(var(--u) * 24); height: calc(var(--u) * 154); background: #cfcfcf; overflow: hidden; }
.map iframe { display: block; width: 100%; height: 100%; border: 0; filter: grayscale(1); }

/* ---------- cta ---------- */
.cta { position: relative; background: #e3e3e3; padding: calc(var(--u) * 22) 0; z-index: 1; }
.cta__bg { position: absolute; left: 0; top: calc(var(--u) * 22); width: 100%; height: calc(100% - var(--u) * 44); object-fit: cover; }
.cta__wrap { position: relative; height: calc(var(--u) * 578); display: flex; align-items: center; justify-content: flex-end; }
.cta__card { position: relative; width: calc(var(--u) * 585); height: calc(var(--u) * 325); background: var(--dark); color: #fff; overflow: hidden; padding: calc(var(--u) * 30); }
.cta__title { position: relative; z-index: 2; font-family: var(--font-display); font-weight: 400; font-size: calc(var(--u) * 55.5); line-height: 1.13; text-transform: uppercase; max-width: calc(var(--u) * 550); }
.cta__btn { position: absolute; z-index: 2; left: calc(var(--u) * 30); bottom: calc(var(--u) * 30); margin: 0; }

.cta__badge { position: absolute; z-index: 1; right: calc(var(--u) * -27); bottom: calc(var(--u) * -169); width: calc(var(--u) * 354); height: calc(var(--u) * 354); color: var(--lime); }
.cta__badge svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.cta__ring text { font-family: var(--font-display); font-size: 46px; text-transform: uppercase; }
.cta__ring, .cta__emblem { transform-origin: 50% 50%; will-change: transform; }

/* ---------- responsive ---------- */
.menu { display: none; }
@media (max-width: 1100px) and (min-width: 901px) {
  :root { --u: calc(100vw / 1100); }
}
@media (max-width: 900px) {
  :root { --u: 1px; }
  html { scroll-padding-top: 0; }
  .container, .hero__inner { width: min(calc(100vw - 32px), 720px); }

  /* header + menu */
  .header { left: 16px; width: calc(100vw - 32px); transform: none !important; display: flex; justify-content: space-between; align-items: center; top: 12px; }
  .logo__star { width: 40px; height: 40px; }
  .logo__name { font-size: 26px; }
  .logo__sub { font-size: 6.5px; margin-top: 2px; }
  .phone { margin-left: auto; margin-right: 10px; }
  .phone__text { display: none; }
  .phone__icon { width: 40px; height: 40px; }
  .menu { display: grid; place-content: center; gap: 6px; width: 40px; height: 40px; border: 1.5px solid var(--lime); border-radius: 50%; background: transparent; cursor: pointer; }
  .menu span { display: block; width: 16px; height: 1.5px; background: var(--lime); transition: transform .3s; }
  .menu.is-open span:first-child { transform: translateY(3.75px) rotate(45deg); }
  .menu.is-open span:last-child { transform: translateY(-3.75px) rotate(-45deg); }
  .nav { position: absolute; left: 0; right: 0; top: calc(100% + 12px); z-index: 20; flex-direction: column; gap: 0; padding: 8px 20px; background: var(--dark); font-size: 17px; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .3s, transform .3s, visibility .3s; }
  .nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .nav a { padding: 14px 0; border-bottom: 1px solid #3a3a3a; }
  .nav a:last-child { border: 0; }
  .nav svg { width: 10px; height: 6px; }

  /* hero: stacked */
  .hero { height: auto; padding-bottom: 60px; }
  .hero__inner { position: relative; height: auto; padding-top: calc(min(80vw, 460px) * 1.49 + 84px); }
  .headline { z-index: 2; }
  .headline__line { font-size: calc(min(100vw - 32px, 720px) / 3.2); }
  .headline__line--1 { top: calc(var(--hl, min(100vw - 32px, 720px) / 3.2) * .98); left: 0; }
  .headline__line--2 { top: calc(var(--hl, min(100vw - 32px, 720px) / 3.2) * 1.98); left: 8%; }
  .hero__person { width: min(80vw, 460px); left: 50%; margin-left: calc(min(80vw, 460px) / -2 + 8px); top: 56px; clip-path: none; -webkit-mask-image: linear-gradient(#000 82%, transparent); mask-image: linear-gradient(#000 82%, transparent); }
  .hero__badge { display: none; }
  .hero__left, .hero__right { position: static; width: auto; }
  .hero__left { display: grid; grid-template-columns: 1fr; gap: 26px; }
  .crew { display: flex; align-items: center; gap: 14px; }
  .crew__avatars img { width: 40px; height: 40px; }
  .crew__text { margin: 0; padding: 0 0 0 14px; border: 0; border-left: 1px solid var(--lime); font-size: 13px; }
  .stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; }
  .stats li, .stats li:last-child { padding: 0 10px; margin: 0; border: 0; border-left: 1px solid var(--lime); }
  .stats li:first-child { padding-left: 0; border-left: 0; }
  .stats__num b { font-size: 30px; }
  .stats__num i { font-size: 16px; }
  .stats__label { font-size: 12px; }
  .hero__right { margin-top: 30px; display: flex; flex-wrap: wrap; align-items: center; gap: 18px 20px; }
  .hero__right p { flex: 1 1 100%; font-size: 14px; text-align: left; }
  .hero__right .btn { margin: 0; padding: 12px 22px; font-size: 13px; }
  .play { position: relative; left: auto; top: auto; width: 52px; height: 52px; }
  .btn { font-size: 13px; }
  .marquee { height: 64px; bottom: -26px; }
  .marquee__group { font-size: 36px; }
  .marquee__group i { font-size: 30px; transform: translateY(6px); }

  .services { padding: 100px 0 60px; }
  .services__head { grid-template-columns: 1fr; gap: 18px; }
  .services__title { font-size: 36px; }
  .services__head .btn { justify-self: start; margin: 8px 0 0; }
  .cards { flex-direction: column; margin-top: 36px; gap: 20px; }
  .card, .card--featured { width: 100%; transform: none; }
  .card__title { font-size: 28px; }
  .eyebrow { margin-top: 0; font-size: 15px; }
  .btn--sm { justify-self: start; padding: 11px 18px; font-size: 12px; }

  .about { padding: 60px 0; }
  .about__grid { display: flex; flex-direction: column; gap: 30px; }
  .about__title { font-size: 40px; }
  .about__center { height: 360px; margin-top: 0; width: 100%; }
  .about__grid > * { min-width: 0; }
  .logos { width: 100%; height: 100px; }
  .logos__item { width: 90px; margin-right: 10px; }
  .about__noise, .cta::before { background-attachment: scroll; }

  .statement { padding: 60px 0; }
  .statement__quote { width: calc(100vw - 32px); font-size: 28px; line-height: 1.3; }
  .pic { width: 64px; height: 26px; } .pic--wide { width: 100px; }
  .statement__quote br { display: none; }
  .statement__sign { margin-top: 30px; font-size: 12px; }

  .team { padding: 60px 0; }
  .team__grid { grid-template-columns: 1fr; row-gap: 36px; }
  .team__title { font-size: 40px; }
  .team__copy .about__text { font-size: 14px; }
  .team__stats { padding-left: 44px; gap: 64px; }
  .team__panels { height: 360px; gap: 8px; }
  .team__card img { width: calc(100vw - 32px); }

  .cta { padding: 12px 0; }
  .page-hero { height: 280px; }
  .page-hero__text { top: 120px; }
  .page-hero__title { font-size: 44px; }
  .crumbs { margin-top: 14px; font-size: 13px; }
  .contact { padding: 50px 0 60px; }
  .contact__grid { grid-template-columns: 1fr; row-gap: 44px; }
  .form { padding: 24px 22px 28px; }
  .form__title { font-size: 32px; }
  .field input, .field textarea { font-size: 15px; }
  .field__label { font-size: 14px; }
  .field:focus-within .field__label, .field.is-filled .field__label { font-size: 11px; }
  .form__btn { width: 100%; justify-content: center; font-size: 14px; padding: 15px 20px; }
  .info__title { font-size: 40px; }
  .info__text { font-size: 14px; }
  .info__sub { font-size: 24px; }
  .info__list { grid-template-columns: 1fr; }
  .info__list dt { font-size: 18px; }
  .info__list dd { font-size: 16px; }
  .map { height: 240px; }
  .cta__wrap { height: auto; padding: 40px 0; justify-content: center; }
  .cta__card { width: 100%; height: auto; min-height: 300px; padding: 24px; }
  .cta__title { font-size: 32px; max-width: none; }
  .cta__btn { position: relative; left: auto; bottom: auto; margin-top: 26px; }
  .cta__badge { width: 240px; height: 240px; right: -30px; bottom: -150px; }
  .cta__ring text { font-size: 38px; }

  .process { padding: 60px 0; }
  .process__head { grid-template-columns: 1fr; row-gap: 20px; }
  .process__title { font-size: 38px; white-space: normal; }
  .process__text { font-size: 14px; text-align: left; }
  .steps { flex-direction: column; gap: 14px; margin-top: 30px; }
  .step, .step:nth-child(odd) { flex: none; width: 100%; height: 210px; }
  .step__title { font-size: 26px; }

  .testi { padding: 60px 0; }
  .testi__head { grid-template-columns: 1fr; row-gap: 18px; justify-items: start; }
  .testi__head .btn { justify-self: start; }
  .testi__title { font-size: 36px; white-space: normal; }
  .testi__slider { margin-top: 28px; }
  .tcard { flex-basis: 100%; height: auto; min-height: 300px; padding: 24px; }
  .tcard__text { font-size: 15px; padding: 0 0 90px; }
  .tcard__who { left: 24px; bottom: 24px; }
  .tcard__quote { right: 20px; bottom: 26px; width: 32px; }
  .tcard__stars svg { width: 14px; height: 14px; }
  .tcard__name { font-size: 16px; }
  .tcard__role { font-size: 12px; }

  .blog { padding: 60px 0; }
  .blog__head { grid-template-columns: 1fr; row-gap: 24px; }
  .blog__title { font-size: 36px; }
  .blog__side .process__text { text-align: left; }
  .blog__side .btn { margin-top: 24px; }
  .posts { grid-template-columns: 1fr; row-gap: 36px; margin-top: 30px; }
  .post__title { font-size: 26px; }
  .post__meta span { height: 26px; font-size: 12px; padding: 0 12px; }
  .post__meta svg { width: 13px; height: 13px; }

  .news { height: auto; padding: 40px 22px; margin-top: 50px; border-radius: 14px; }
  .news__ring, .news__star { display: none; }
  .news__body { width: 100%; }
  .news__title { font-size: 26px; }
  .news__text { font-size: 13px; }
  .news__form { width: 100%; flex-wrap: wrap; gap: 14px; margin-top: 22px; }
  .news__form input { flex: 1 1 100%; font-size: 14px; height: 46px; }
  .news__form .btn { height: 46px; font-size: 13px; }

  .footer { padding: 50px 0 24px; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 36px 20px; }
  .footer__brand, .footer__contact { grid-column: 1 / -1; }
  .footer__contact { order: 2; }
  .footer__logo svg { width: 54px; height: 54px; }
  .footer__logo b { font-size: 40px; }
  .footer__h { font-size: 18px; }
  .footer__h--lime { font-size: 24px; }
  .footer__p, .footer__col a, .footer__about { font-size: 14px; }
  .footer__col a { padding: 2px 0; }
  .footer__big { margin-bottom: 10px; gap: 12px; }
  .footer__big a { font-size: 22px; }
  .footer__big span { font-size: 12px; }
  .footer__track span { font-size: 96px; -webkit-text-stroke-width: 1px; }
  .footer__marquee { margin-top: 10px; }
  .footer__bar { flex-direction: column; gap: 10px; margin-top: 10px; font-size: 12px; }
  .footer__bar a { margin: 0 16px 0 0; }
}
@media (max-width: 480px) {
  .cta__badge { width: 200px; height: 200px; right: -20px; bottom: -130px; }
  .footer__grid { grid-template-columns: 1fr; }
  .stats li { padding: 0 8px; }
  .stats__num b { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero__badge svg, .play__ring, .footer__track { animation: none; }
}