/* ============== SCROLL PROGRESS ============== */
.scroll-progress {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 2px;
  z-index: calc(var(--z-nav) + 1);
  background: transparent;
  pointer-events: none;
}
.scroll-progress__bar {
  height: 100%;
  background: linear-gradient(90deg, var(--orange-deep), var(--orange));
  width: 0%;
  transform-origin: left;
  box-shadow: 0 0 20px rgba(255, 107, 26, 0.6);
}

/* ============== CUSTOM CURSOR (Launchy logo mark) ==============
   Native cursor swapped for the Launchy A-rocket. 16,16 hotspot keeps the
   click point at the logo's centre. Old .cursor-dot is fully replaced;
   .cursor-ring kept for hover feedback (grows around the logo cursor). */
html, body {
  cursor: url('../assets/logos/cursor-launchy-ink.png') 16 16, auto;
}
a, button, [role="button"], .btn, .swipe-slider, .swipe-slider > *,
summary, label[for], input[type="submit"], input[type="button"],
[data-process], [data-preview], [data-cta-banner], .nav__burger {
  cursor: url('../assets/logos/cursor-launchy-ink.png') 16 16, pointer;
}

/* Hide the legacy small orange dot — the native cursor IS the logo now. */
.cursor-dot { display: none !important; }

/* Keep the trailing ring as a hover-state halo around the logo cursor. */
.cursor-ring {
  position: fixed;
  top: 0; left: 0;
  pointer-events: none;
  z-index: calc(var(--z-nav) + 5);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  will-change: transform;
  width: 40px; height: 40px;
  border: 1.5px solid rgba(255, 107, 26, 0.45);
  background: rgba(255, 107, 26, 0.04);
  transition: width 0.36s var(--ease-out-expo), height 0.36s var(--ease-out-expo), background 0.36s, border-color 0.36s, opacity 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: transparent;
  white-space: nowrap;
  overflow: hidden;
  opacity: 0;
}
.cursor-ring.is-link {
  width: 56px; height: 56px;
  border-color: rgba(255, 107, 26, 0.7);
  background: rgba(255, 107, 26, 0.06);
  opacity: 1;
}
.cursor-ring.is-preview {
  width: 92px; height: 92px;
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
  opacity: 1;
}
.cursor-ring.is-hidden { opacity: 0; transform: translate(-50%, -50%) scale(0); }

@media (max-width: 1024px), (pointer: coarse) {
  html, body { cursor: auto; }
  a, button, [role="button"], .btn { cursor: pointer; }
  .cursor-dot, .cursor-ring { display: none; }
}

/* ============== KINETIC MANIFESTO ============== */
.manifesto {
  position: relative;
  background: var(--ink);
  color: var(--white);
  padding-block: clamp(80px, 12vw, 160px);
  overflow: hidden;
}
.manifesto::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 50%, rgba(255, 107, 26, 0.16), transparent 40%),
    radial-gradient(circle at 80% 30%, rgba(255, 107, 26, 0.10), transparent 40%);
  pointer-events: none;
}
.manifesto__head {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-bottom: var(--s-12);
}
.manifesto__head .eyebrow { color: rgba(255,255,255,0.5); }
.manifesto__head .eyebrow::before { background: var(--orange); }
.manifesto__head h2 { color: var(--white); font-size: clamp(1.6rem, 2.8vw, 2.4rem); margin-top: var(--s-4); }

.manifesto__words {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 1.2vw, 16px);
  z-index: 2;
}
.manifesto__line {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 48px);
  white-space: nowrap;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(3rem, 9vw, 8rem);
  letter-spacing: -0.04em;
  line-height: 0.95;
  width: max-content;
}
.manifesto__line span { display: inline-flex; align-items: center; gap: clamp(20px, 3vw, 48px); }
.manifesto__line span > i {
  display: inline-block;
  width: clamp(14px, 1.6vw, 22px);
  height: clamp(14px, 1.6vw, 22px);
  border-radius: 50%;
  background: var(--orange);
  vertical-align: middle;
  flex-shrink: 0;
}
.manifesto__line .filled { color: var(--white); }
.manifesto__line .outline {
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,0.32);
}
.manifesto__line .accent { color: var(--orange); font-style: italic; font-family: "Cabinet Grotesk", serif; }

.manifesto__line--1 { animation: marquee-l 60s linear infinite; }
.manifesto__line--2 { animation: marquee-r 70s linear infinite; }
.manifesto__line--3 { animation: marquee-l 80s linear infinite; }
@keyframes marquee-l {
  to { transform: translate3d(-50%, 0, 0); }
}
@keyframes marquee-r {
  from { transform: translate3d(-50%, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

.manifesto__statement {
  position: relative;
  z-index: 2;
  margin-top: var(--s-12);
  text-align: center;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}
.manifesto__statement p { color: rgba(255,255,255,0.74); font-size: 1.15rem; line-height: 1.55; max-width: none; }

/* ============== SECTION DIVIDER MARQUEE ============== */
.section-divider {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--white);
}
.section-divider__track {
  display: flex;
  gap: clamp(24px, 4vw, 64px);
  width: max-content;
  align-items: center;
  padding: var(--s-5) 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(2rem, 4.5vw, 3.6rem);
  letter-spacing: -0.03em;
  animation: marquee-l 50s linear infinite;
}
.section-divider__track i {
  display: inline-block;
  width: clamp(8px, 1.2vw, 14px);
  height: clamp(8px, 1.2vw, 14px);
  border-radius: 50%;
  background: var(--orange);
  flex-shrink: 0;
}
.section-divider__track .outline {
  color: transparent;
  -webkit-text-stroke: 1px var(--ink);
}

/* ============== HERO BACKGROUND KINETIC ============== */
.hero-bg-marquee {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
  opacity: 0.6;
}
.hero-bg-marquee__row {
  display: flex;
  align-items: center;
  gap: clamp(40px, 5vw, 90px);
  width: max-content;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(4rem, 9vw, 9rem);
  letter-spacing: -0.04em;
  line-height: 1;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 1px rgba(10, 22, 40, 0.06);
}
.hero-bg-marquee__row:nth-child(1) { animation: marquee-l 75s linear infinite; }
.hero-bg-marquee__row:nth-child(2) { animation: marquee-r 95s linear infinite; }
.hero-bg-marquee__row:nth-child(3) { animation: marquee-l 110s linear infinite; }
.hero-bg-marquee__row i {
  display: inline-block;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: rgba(255, 107, 26, 0.5);
  flex-shrink: 0;
}

/* ============== LIVE TICKER ============== */
.live-ticker {
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  padding: 6px var(--s-3) 6px 8px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ink-soft);
  box-shadow: var(--shadow-xs);
}
.live-ticker__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #1bb55a;
  box-shadow: 0 0 0 4px rgba(27, 181, 90, 0.18);
  animation: pulse-live 1.6s ease-in-out infinite;
}
@keyframes pulse-live {
  0%, 100% { box-shadow: 0 0 0 4px rgba(27, 181, 90, 0.18); }
  50% { box-shadow: 0 0 0 6px rgba(27, 181, 90, 0); }
}
.live-ticker__rail {
  position: relative;
  height: 1.2em;
  overflow: hidden;
  display: inline-block;
  min-width: 220px;
}
.live-ticker__rail ul { animation: ticker 16s ease-in-out infinite; }
.live-ticker__rail li { display: block; height: 1.2em; color: var(--ink); font-weight: 600; letter-spacing: 0.08em; }
@keyframes ticker {
  0%, 18% { transform: translateY(0); }
  22%, 40% { transform: translateY(-1.2em); }
  44%, 62% { transform: translateY(-2.4em); }
  66%, 84% { transform: translateY(-3.6em); }
  88%, 100% { transform: translateY(-4.8em); }
}

/* ============== SCROLL CUE ============== */
.scroll-cue {
  position: absolute;
  bottom: var(--s-8);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-2);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--mute);
  z-index: 5;
}
.scroll-cue__line {
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, var(--orange) 30%, transparent 70%);
  background-size: 1px 30px;
  animation: scrollCue 1.8s ease-in-out infinite;
  position: relative;
}
@keyframes scrollCue {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

@media (max-width: 768px) { .scroll-cue { display: none; } }

/* ============== TEXT SCRAMBLE / TYPEWRITER ============== */
.scramble { font-feature-settings: "tnum" 1; }
.scramble[data-scrambling] { color: var(--orange); }

/* ============== IMAGE REVEAL CLIP-PATH ============== */
.img-reveal { clip-path: inset(0 100% 0 0); transition: clip-path 1.4s var(--ease-out-expo); }
.img-reveal.is-visible { clip-path: inset(0 0% 0 0); }

/* ============== GAUGE (Lighthouse-style) ============== */
.gauge-set { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }
.gauge {
  background: var(--ink);
  border-radius: var(--r-xl);
  padding: var(--s-5);
  text-align: center;
  border: 1px solid rgba(255,255,255,0.08);
}
.gauge svg {
  width: 80px; height: 80px;
  display: block;
  margin: 0 auto var(--s-3);
  transform: rotate(-90deg);
}
.gauge__bg { fill: none; stroke: rgba(255,255,255,0.1); stroke-width: 8; }
.gauge__fg { fill: none; stroke: var(--orange); stroke-width: 8; stroke-linecap: round; transition: stroke-dashoffset 1.6s var(--ease-out-expo); }
.gauge__num {
  position: relative;
  font-family: var(--font-display);
  font-size: 1.8rem;
  color: var(--white);
  margin-top: -54px;
  margin-bottom: 12px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.gauge__label {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(255,255,255,0.6);
}

/* ============== HERO ROCKET TRAIL — SVG ============== */
.hero__trail-svg {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.hero__trail-svg path {
  fill: none;
  stroke: var(--orange);
  stroke-width: 1.4;
  stroke-dasharray: 3 6;
  opacity: 0.55;
  animation: trailDash 24s linear infinite;
}
@keyframes trailDash { to { stroke-dashoffset: -180; } }

/* ============== PROGRESS BUILD MOCKUP ============== */
.mockup-build .mockup-card__row,
.mockup-build .mockup-card__cta {
  opacity: 0;
  transform: translateY(8px);
  animation: buildIn 1s var(--ease-out-expo) forwards;
}
.mockup-build .mockup-card__row:nth-child(1) { animation-delay: 0.4s; }
.mockup-build .mockup-card__row:nth-child(2) { animation-delay: 0.6s; }
.mockup-build .mockup-card__row:nth-child(3) { animation-delay: 0.8s; }
.mockup-build .mockup-card__row:nth-child(4) { animation-delay: 1.0s; }
.mockup-build .mockup-card__cta { animation-delay: 1.2s; }
@keyframes buildIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ============== METRIC CHIPS (around mockup) ============== */
.metric-chip {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  box-shadow: var(--shadow-md);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  color: var(--ink);
  z-index: 4;
  animation: floatMC 5s ease-in-out infinite;
}
.metric-chip__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 4px var(--orange-glow);
}
.metric-chip strong { color: var(--orange); font-weight: 600; font-family: var(--font-display); font-size: 1.1rem; letter-spacing: -0.02em; }
.metric-chip--tl { top: 8%; left: -12%; animation-delay: 0s; }
.metric-chip--br { bottom: 18%; right: -10%; animation-delay: -2s; }
.metric-chip--ml { top: 50%; left: -18%; animation-delay: -1s; }
@keyframes floatMC {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -10px, 0); }
}

@media (max-width: 1024px) {
  .metric-chip--ml { display: none; }
  .metric-chip--tl { left: 4%; }
  .metric-chip--br { right: 4%; }
}

/* ============== UPDATED PROJECT CARD WITH SCREENSHOT ============== */
.project-card--shot {
  background: var(--white);
  border: 1px solid var(--line);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  padding: 0;
  position: relative;
  overflow: hidden;
}
.project-card--shot .project-card__shot {
  position: absolute;
  inset: 0;
  background: var(--linen);
  overflow: hidden;
}
/* Show only the TOP of the full-page screenshot in the card — STATIC (no swipe) */
.project-card--shot .project-card__shot {
  position: absolute;
  inset: 0;
  background: var(--linen);
  overflow: hidden;
  border-radius: inherit;
}
.project-card--shot .project-card__shot img {
  width: 100%;
  height: auto;
  display: block;
  filter: saturate(1.05);
  background: var(--linen);
  transition: transform 0.9s var(--ease-out-expo);
  transform: scale(1);
  will-change: transform;
}

/* Pseudo-element overlay (smooth perf, no filter repaint) */
.project-card--shot .project-card__shot::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 22, 40, 0) 30%, rgba(10, 22, 40, 0.55) 100%);
  opacity: 0;
  transition: opacity 0.5s var(--ease-out-expo), backdrop-filter 0.5s var(--ease-out-expo);
  pointer-events: none;
  z-index: 1;
}
.project-card--shot:hover .project-card__shot::after {
  opacity: 1;
  background: linear-gradient(180deg, rgba(10, 22, 40, 0.18) 0%, rgba(10, 22, 40, 0.62) 100%);
  backdrop-filter: saturate(0.85);
  -webkit-backdrop-filter: saturate(0.85);
}

/* Subtle zoom on the image (premium "lens" feel — not a swipe) */
.project-card--shot:hover .project-card__shot img {
  transform: scale(1.025);
}

/* Centered "Prévisualiser" button — Glass + Spring overshoot */
.project-card--shot .project-card__preview-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0) scale(0.86);
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  padding: 16px 26px;
  background: rgba(255, 107, 26, 0.96);
  color: var(--white);
  border-radius: var(--r-pill);
  border: 1px solid rgba(255, 255, 255, 0.18);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 500;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.32),
    inset 0 -1px 0 rgba(0, 0, 0, 0.08),
    0 18px 40px -12px rgba(255, 107, 26, 0.55),
    0 6px 16px -6px rgba(10, 22, 40, 0.35);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.32s var(--ease-out-expo),
    transform 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
  z-index: 4;
  white-space: nowrap;
}
.project-card--shot .project-card__preview-btn svg {
  width: 14px;
  height: 14px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  transition: transform 0.4s var(--ease-out-expo);
}
.project-card--shot:hover .project-card__preview-btn {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) scale(1);
}
.project-card--shot:hover .project-card__preview-btn svg {
  transform: scale(1.1);
}
.project-card--shot:active .project-card__preview-btn {
  transform: translate3d(-50%, -50%, 0) scale(0.96);
  transition: transform 0.12s var(--ease-out-expo);
}

.project-card--shot .project-card__overlay {
  background: linear-gradient(to top,
    rgba(10, 22, 40, 0.78) 0%,
    rgba(10, 22, 40, 0.32) 28%,
    rgba(10, 22, 40, 0) 60%);
  opacity: 1;
  padding: var(--s-6);
  z-index: 2;
}
.project-card--shot .project-card__name { color: var(--white); }
.project-card--shot .project-card__role { color: rgba(255,255,255,0.78); }

.project-card--shot .project-card__client-logo {
  position: absolute;
  top: var(--s-5); left: var(--s-5);
  height: 32px;
  background: var(--white);
  border-radius: var(--r-pill);
  padding: 4px var(--s-3);
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-xs);
  z-index: 3;
}
.project-card--shot .project-card__client-logo img { height: 22px; width: auto; max-width: 70px; object-fit: contain; }
.project-card--shot .project-card__client-logo span {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink);
  font-weight: 500;
}

.project-card--shot .project-card__cta {
  position: absolute;
  bottom: var(--s-5); right: var(--s-5);
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  background: var(--orange);
  color: var(--white);
  padding: var(--s-2) var(--s-4);
  border-radius: var(--r-pill);
  font-family: var(--font-mono);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  z-index: 3;
  transform: translateY(8px);
  opacity: 0;
  transition: transform var(--d-base) var(--ease-out-expo), opacity var(--d-base);
}
.project-card--shot:hover .project-card__cta { transform: translateY(0); opacity: 1; }
.project-card--shot .project-card__cta svg { width: 12px; height: 12px; }

/* ============== HERO ENHANCEMENTS ============== */
/* Hero — Word stack rotator with depth */
.hero-stack {
  display: flex;
  flex-direction: column;
  margin-block: var(--s-3);
  position: relative;
}
.hero-stack__line {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 3.25rem);
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--ink);
  display: flex;
  align-items: center;
  gap: var(--s-3);
}
.hero-stack__num {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--orange);
  background: var(--orange-soft);
  padding: 4px 8px;
  border-radius: var(--r-pill);
  font-weight: 500;
}

/* Hero badge moving */
.hero-badge {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  background: var(--white);
  border-radius: var(--r-pill);
  border: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  z-index: 3;
  box-shadow: var(--shadow-md);
}

/* ============== HOVER REVEAL TEXT ============== */
.btn-arrow-large {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--s-3);
  padding: 18px var(--s-6) 18px var(--s-8);
  background: var(--ink);
  color: var(--white);
  border-radius: var(--r-pill);
  overflow: hidden;
  isolation: isolate;
}
.btn-arrow-large::before {
  content: "";
  position: absolute;
  top: 50%; right: 18px;
  width: 48px; height: 48px;
  background: var(--orange);
  border-radius: 50%;
  transform: translate(0, -50%) scale(1);
  transition: transform 0.45s var(--ease-out-expo);
  z-index: -1;
}
.btn-arrow-large:hover::before { transform: translate(0, -50%) scale(40); }
.btn-arrow-large > * { transition: color 0.4s; }
.btn-arrow-large:hover > * { color: var(--white); }

/* ============== ABOUT FOUNDER STRIP ============== */
.founder-strip {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: var(--s-6);
  align-items: center;
  padding: var(--s-6) var(--s-8);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  box-shadow: var(--shadow-md);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.founder-strip::before {
  content: "";
  position: absolute;
  top: -40%; right: -10%;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 107, 26, 0.18), transparent 60%);
  z-index: -1;
}
.founder-strip__avatar {
  width: 110px; height: 110px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--orange);
  position: relative;
}
.founder-strip__avatar img { width: 100%; height: 100%; object-fit: cover; }
.founder-strip__avatar::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px dashed var(--orange);
  animation: spin 14s linear infinite;
}
.founder-strip__content h4 { font-size: 1.35rem; margin-bottom: var(--s-1); }
.founder-strip__content p { font-size: 0.95rem; max-width: 50ch; }
.founder-strip__sig {
  font-family: "Cabinet Grotesk", serif;
  font-style: italic;
  font-size: 1.4rem;
  color: var(--orange);
  font-weight: 500;
}
@media (max-width: 768px) {
  .founder-strip { grid-template-columns: 80px 1fr; padding: var(--s-5); }
  .founder-strip__avatar { width: 80px; height: 80px; }
  .founder-strip__sig { display: none; }
}

/* ============== STAT BIG CARD ============== */
.big-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--s-5);
}
.big-stat {
  position: relative;
  padding: var(--s-10);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  overflow: hidden;
  isolation: isolate;
}
.big-stat--dark { background: var(--ink); color: var(--white); border: 0; }
.big-stat--dark .big-stat__num { color: var(--white); }
.big-stat--dark .big-stat__label, .big-stat--dark .big-stat__desc { color: rgba(255,255,255,0.62); }

.big-stat__num {
  font-family: var(--font-display);
  font-size: clamp(3rem, 6vw, 5rem);
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--ink);
  display: flex;
  align-items: baseline;
  margin-bottom: var(--s-3);
}
.big-stat__num em { font-family: var(--font-mono); font-size: 1.4rem; color: var(--orange); margin-left: 6px; font-style: normal; font-weight: 500; }
.big-stat__label {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--mute);
  margin-bottom: var(--s-3);
}
.big-stat__desc { font-size: 0.95rem; max-width: 42ch; color: var(--mute); }
.big-stat__deco {
  position: absolute;
  right: -40px; top: -40px;
  width: 180px; height: 180px;
  border-radius: 50%;
  border: 1px solid var(--line);
  z-index: -1;
}
.big-stat__deco--orange { border-color: rgba(255, 107, 26, 0.32); }

@media (max-width: 768px) { .big-stats { grid-template-columns: 1fr; } }