/* =========================================================
   13th Elets NBFC100 Leaders of Excellence Awards 2026
   Same design language as the 24th Elets NBFC100 Tech Summit homepage
   (css/style.css): maroon-to-black diagonal and near-black bands, crimson
   action, gold accents, rounded dark cards, Urbanist headings + Inter.

   LOAD ORDER: this file comes AFTER css/style.css and Bootstrap, because
   the page uses the summit's own header and footer. Two consequences:
   - the page's own content lives inside <main class="awards-main">, and
     every bare-element rule here (body, h1-h3, p, img, a, ul) is scoped to
     it, so the shared header/footer render exactly as they do on index.html;
   - classes that also exist in style.css or Bootstrap (.btn, .hero, .card,
     .progress) are prefixed aw- here so neither side restyles the other.
   ========================================================= */

:root{
  /* --- summit tokens --- */
  --crimson:#c81e3a;
  --crimson-dark:#8f0f26;
  --ink:#0b0b10;
  --ink-2:#151319;
  --paper:#ffffff;
  --gold:#d9a94a;
  --muted:#c9c6d2;

  /* --- derived --- */
  --ink-3:#1d1a22;
  --crimson-glow:rgba(200,30,58,.4);
  --gold-soft:rgba(217,169,74,.5);
  --hair:rgba(255,255,255,.08);
  --hair-2:rgba(255,255,255,.14);
  --heading:#ffffff;
  --muted:rgba(255,255,255,.68);      /* the homepage's body-copy white */
  --muted-2:rgba(255,255,255,.5);

  /* the summit's type: Urbanist for headings, Inter for everything else */
  --display:"Urbanist","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  /* the summit's surfaces: rounded panels on a dark card gradient, and the
     maroon-to-black diagonal that hero + about share on the homepage */
  --radius:18px;
  --radius-sm:12px;
  --card-bg:linear-gradient(180deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 30%),
            linear-gradient(165deg,#1a0f13 0%,#0d0709 100%);
  --card-border:rgba(255,255,255,.1);
  --card-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 22px 44px -26px rgba(0,0,0,.95);
  --maroon-bg:linear-gradient(160deg,#87002e 0%,#87002e 14%,#060606 38%,#010101 55%,#161616 72%,#87002e 86%,#87002e 100%);

  --wrap:1240px;
  --shadow:0 26px 64px rgba(0,0,0,.55);
  /* --nav-h is the summit header's own variable (css/style.css); not redefined here */
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
/* body.awards-page (0,1,1) outranks style.css's `html body` (0,0,2) */
body.awards-page{
  margin:0;
  font-family:var(--sans);
  font-size:16px;
  line-height:1.7;
  color:var(--muted);
  background:var(--ink);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
.awards-main img{max-width:100%;display:block}
.awards-main a{color:inherit;text-decoration:none}
/* scoped (0,1,1) so these beat Bootstrap's reboot on the same elements;
   same face and weight as the summit's `html h1…h6` */
.awards-main h1,.awards-main h2,.awards-main h3{
  margin:0;font-family:var(--display);font-weight:800;
  line-height:1.15;letter-spacing:-.01em;color:var(--heading);
}
/* section titles carry the summit's .mumbai-feature-heading (size, uppercase,
   crimson .glance) — this only restores what the scoped rule above would
   otherwise override */
.awards-main h2.mumbai-feature-heading{
  font-weight:700;letter-spacing:.5px;line-height:1.15;text-transform:uppercase;
  margin-bottom:26px;text-wrap:balance;
}
.awards-main p{margin:0 0 1em}
.awards-main ul,.awards-main ol{margin:0;padding:0;list-style:none}
button{font-family:inherit}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

:focus-visible{outline:2px solid var(--crimson);outline-offset:3px}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.wrap.narrow{max-width:900px}
.center{text-align:center}

.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--crimson);color:#fff;padding:12px 20px;font-weight:800;
  text-transform:uppercase;letter-spacing:.6px;font-size:13px;text-decoration:none;
}
.skip:focus{left:0}

/* The header and footer are the summit's own (markup + css/style.css); it
   carries this page's menu. The script's scroll-spy marks the current
   section's link .active — the summit stylesheet has no rule for that. */
.awards-page .nav-links a.active{color:var(--crimson)}

/* =============== BUTTONS ===============
   The page uses the summit's own buttons (a.btn.btn-fill / .btn-outline
   from css/style.css — crimson sweep + arrow chip). */

/* =============== HERO ===============
   aw-hero, not .hero: style.css's .hero is the homepage's full-height
   flex stage and would otherwise apply here too. The summit header is an
   in-flow bar on this page, so no top padding is reserved for it.
   The banner and the copy panel share the homepage's maroon diagonal. */
.aw-hero{position:relative;background:var(--maroon-bg)}
.hero-media{position:relative;overflow:hidden}
.hero-img{width:100%;height:auto;animation:heroIn 1.4s cubic-bezier(.2,.7,.3,1) both}
@keyframes heroIn{from{transform:scale(1.05);opacity:.35}to{transform:scale(1);opacity:1}}
.hero-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(0deg,rgba(6,4,6,.82) 0%,rgba(6,4,6,.35) 18%,transparent 45%),
    linear-gradient(100deg,rgba(8,6,10,.55) 0%,rgba(20,6,12,.18) 35%,transparent 60%);
}

.hero-panel{position:relative;background:transparent}
/* single column: copy, then the facts row */
.hero-panel-in{
  display:block;
  padding-top:56px;padding-bottom:64px;
}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:2.2px;
  text-transform:uppercase;color:var(--gold);margin-bottom:18px;
}
.eyebrow .dot{
  width:7px;height:7px;border-radius:50%;flex:none;background:var(--crimson);
  box-shadow:0 0 0 0 var(--crimson-glow);animation:pulse 2.4s ease-out infinite;
}
/* the summit name in the eyebrow links back to the main site */
.eyebrow a{
  border-bottom:1px solid var(--gold-soft);padding-bottom:1px;
  transition:color .2s,border-color .2s;
}
.eyebrow a:hover{color:#fff;border-color:#fff}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(200,30,58,0)}100%{box-shadow:0 0 0 0 rgba(200,30,58,0)}}

/* same voice as the homepage headline: uppercase Urbanist, crimson accent */
.hero-copy h1{font-size:clamp(22px,2.6vw,34px);margin-bottom:18px;line-height:1.18;text-transform:uppercase;letter-spacing:.3px}
.hero-copy h1 em{font-style:normal;color:var(--crimson)}
.lede{color:var(--muted);font-size:16.5px;line-height:1.75;max-width:56ch}

.hero-facts{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0}
.hero-facts li{
  display:flex;align-items:center;gap:12px;
  padding:12px 20px 12px 15px;border-radius:var(--radius-sm);
  border:1px solid var(--card-border);background:rgba(255,255,255,.05);
}
.hero-facts svg{width:20px;height:20px;flex:none;color:var(--gold)}
.hero-facts span{display:flex;flex-direction:column;line-height:1.3;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted-2)}
.hero-facts b{font-family:var(--display);font-size:14px;font-weight:800;color:#fff;letter-spacing:.2px}

.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.center-cta{justify-content:center}

/* =============== STATS (the homepage's numbers band) =============== */
.stats{background:#050505;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:44px;padding-bottom:44px}
.stat{text-align:center;padding:0 10px}
.stat + .stat{border-left:1px solid var(--hair)}
.stat b{display:block;font-family:var(--display);font-size:clamp(30px,3.2vw,44px);font-weight:800;line-height:1;letter-spacing:-.5px;color:#fff;font-variant-numeric:tabular-nums}
.stat sup{font-size:.42em;top:-.8em}
.stat span{display:block;margin-top:10px;font-size:11.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#C9C9C2}

/* =============== SECTIONS ===============
   .sec alternates the homepage's maroon diagonal with its near-black. */
.sec{padding:96px 0;background:var(--maroon-bg);position:relative}
.sec-dark{background:#050304;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}

/* white variant (About): ink type on white, with soft wave bands top and
   bottom in the palest tints of the crimson — two layers each way so they
   read as depth rather than a stripe. The waves are inline SVGs, so no
   extra request. */
.sec-light{
  background-color:#ffffff;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath fill='%23fbeef1' d='M0 96C220 40 460 150 720 96S1220 40 1440 96V200H0Z'/%3E%3Cpath fill='%23f7dfe5' fill-opacity='.75' d='M0 140C300 96 540 190 840 142S1260 92 1440 150V200H0Z'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 140' preserveAspectRatio='none'%3E%3Cpath fill='%23fcf3f5' d='M0 0H1440V60C1180 116 940 20 700 62S220 116 0 56Z'/%3E%3Cpath fill='%23f9e6eb' fill-opacity='.6' d='M0 0H1440V28C1140 70 860 6 600 34S180 70 0 22Z'/%3E%3C/svg%3E");
  background-repeat:no-repeat,no-repeat;
  background-position:center bottom,center top;
  background-size:100% 200px,100% 140px;
}
.sec-light .kicker{color:var(--crimson)}
.sec-light .mumbai-feature-heading{color:#16101a}
.sec-light .body-lg{color:#4a4450}

/* About: copy on the left, the trophy illustration on the right */
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.about-copy{text-align:left}
.about-copy .kicker::before{display:none}   /* left-aligned eyebrow keeps only its trailing rule */
.about-art{margin:0;display:flex;justify-content:center;align-items:center}
.about-art svg{
  width:100%;max-width:420px;height:auto;
  filter:drop-shadow(0 28px 36px rgba(200,30,58,.16));
  animation:aboutArtIn 1s cubic-bezier(.22,.8,.28,1) both;
}
@keyframes aboutArtIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
@media (max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:36px}
  .about-copy{text-align:center}
  .about-copy .kicker::before{display:inline-block}
  .about-art{order:-1}
  .about-art svg{max-width:280px}
}
/* section eyebrow: the summit's gold small-caps with a rule either side */
.kicker{
  display:inline-flex;align-items:center;gap:12px;margin:0 0 14px;
  font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);
}
.kicker::before,.kicker::after{content:"";width:26px;height:1px;background:currentColor;opacity:.6}
.sec-head{max-width:820px;margin:0 auto 56px}
.sec-head.center{text-align:center}
.body-lg{color:var(--muted);font-size:16.5px;line-height:1.7}

/* =============== TIMELINE ===============
   Five milestone cards on a horizontal track. The track runs from the first
   dot's centre to the last dot's centre; with equal columns and --tl-gap
   between them, each end sits half a column in from the edge. The script
   sets --tl-px / --tl-py (the live dot's centre, in px from the list's
   edge) so the crimson fill stops exactly at that dot.
   Draw-in sequence, started by .tl-in: track (0s) -> fill (.5s) ->
   dots pop in left to right -> cards rise in behind them. */
.timeline{
  --tl-gap:18px;
  --tl-dot:18px;
  --tl-edge:calc((100% - 4*var(--tl-gap)) / 10);
  --tl-px:0px;--tl-py:0px;
  position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--tl-gap);
}
/* ol.timeline (0,1,1): beats the scoped `.awards-main ol{padding:0}` reset */
ol.timeline{padding:48px 0 0}
.timeline::before,.timeline::after{
  content:"";position:absolute;top:calc(var(--tl-dot)/2 - 1px);height:2px;border-radius:2px;pointer-events:none;
}
.timeline::before{
  left:var(--tl-edge);right:var(--tl-edge);background:var(--hair-2);
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1s cubic-bezier(.2,.7,.2,1);
}
.timeline::after{
  left:var(--tl-edge);width:calc(var(--tl-px) - var(--tl-edge));max-width:calc(100% - 2*var(--tl-edge));
  background:linear-gradient(90deg,var(--crimson-dark),var(--crimson));
  box-shadow:0 0 14px var(--crimson-glow);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .9s cubic-bezier(.2,.7,.2,1) .5s;
}
.timeline.tl-in::before,.timeline.tl-in::after{transform:scaleX(1)}

.timeline li{position:relative;display:flex}
.timeline li:nth-child(1){--tl-i:0}
.timeline li:nth-child(2){--tl-i:1}
.timeline li:nth-child(3){--tl-i:2}
.timeline li:nth-child(4){--tl-i:3}
.timeline li:nth-child(5){--tl-i:4}

/* Reveal is keyframed (not transitioned) so the stagger lives in
   animation-delay and hover transitions stay instant. Before .tl-in the
   pieces are hidden; the animation's `backwards` fill holds the first
   keyframe through each delay, then normal (visible) styles take over. */
.timeline:not(.tl-in) .tl-dot,
.timeline:not(.tl-in) li::before,
.timeline:not(.tl-in) .tl-card{opacity:0}

/* stem from the dot down to the card */
.timeline li::before{
  content:"";position:absolute;left:50%;top:calc(var(--tl-dot) - 48px);width:1px;height:calc(48px - var(--tl-dot));
  background:linear-gradient(180deg,var(--hair-2),transparent);transform-origin:top;
}
.timeline.tl-in li::before{animation:tlStem .45s ease both;animation-delay:calc(.5s + var(--tl-i) * .16s)}
@keyframes tlStem{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}

.tl-dot{
  position:absolute;top:-48px;left:50%;
  width:var(--tl-dot);height:var(--tl-dot);border-radius:50%;
  background:var(--ink);border:2px solid var(--hair-2);
  transform:translateX(-50%);
  transition:background-color .3s,border-color .3s,box-shadow .3s;
}
.timeline.tl-in .tl-dot{animation:tlPop .55s cubic-bezier(.34,1.56,.64,1) backwards;animation-delay:calc(.35s + var(--tl-i) * .16s)}
@keyframes tlPop{from{opacity:0;transform:translateX(-50%) scale(0)}to{opacity:1;transform:translateX(-50%) scale(1)}}
/* done: filled with a tick */
.timeline li.done .tl-dot{background:var(--hair-2);border-color:var(--hair-2)}
.timeline li.done .tl-dot::after{
  content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;
  border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg);
}
/* live: crimson with a breathing ring (runs alongside the pop-in) */
.timeline li.now .tl-dot{
  background:var(--crimson);border-color:var(--crimson);
  box-shadow:0 0 0 0 rgba(200,30,58,.5),0 0 18px var(--crimson-glow);
}
.timeline.tl-in li.now .tl-dot{
  animation:tlPop .55s cubic-bezier(.34,1.56,.64,1) backwards,tlPulse 2.2s ease-out infinite;
  animation-delay:calc(.35s + var(--tl-i) * .16s),calc(.9s + var(--tl-i) * .16s);
}
@keyframes tlPulse{
  70%{box-shadow:0 0 0 12px rgba(200,30,58,0),0 0 18px var(--crimson-glow)}
  100%{box-shadow:0 0 0 0 rgba(200,30,58,0),0 0 18px var(--crimson-glow)}
}
/* finale: gold */
.tl-final .tl-dot{background:var(--gold);border-color:var(--gold);box-shadow:0 0 18px rgba(217,169,74,.5)}
.tl-final.done .tl-dot::after{border-color:#2a1d05}

.tl-card{
  position:relative;flex:1;min-width:0;
  padding:26px 22px 24px;border-radius:var(--radius);
  border:1px solid var(--card-border);background:var(--card-bg);box-shadow:var(--card-shadow);
  transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s ease,box-shadow .3s ease,opacity .3s ease;
}
.timeline.tl-in .tl-card{animation:tlRise .7s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(.55s + var(--tl-i) * .16s)}
@keyframes tlRise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.tl-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.22)}
.timeline li.now .tl-card{border-color:rgba(200,30,58,.55);box-shadow:var(--card-shadow),0 0 0 1px rgba(200,30,58,.25),0 18px 40px -18px var(--crimson-glow)}
.timeline li.now .tl-card:hover{border-color:var(--crimson)}
.tl-final .tl-card{border-color:rgba(217,169,74,.35)}
.tl-final .tl-card:hover{border-color:var(--gold)}
.timeline.tl-in li.done .tl-card{opacity:.72}
.timeline.tl-in li.done .tl-card:hover{opacity:1}

/* --- abstract decor behind the section (homepage vocabulary) --- */
#dates{position:relative;overflow:hidden;isolation:isolate}
#dates>.wrap{position:relative;z-index:1}
/* soft crimson + gold light blooms */
#dates::before{
  content:"";position:absolute;inset:-10% -6%;z-index:0;pointer-events:none;
  background:
    radial-gradient(34% 40% at 8% 18%,rgba(200,30,58,.34) 0%,rgba(200,30,58,0) 70%),
    radial-gradient(30% 36% at 92% 84%,rgba(217,169,74,.16) 0%,rgba(217,169,74,0) 72%),
    radial-gradient(40% 30% at 50% 110%,rgba(135,0,46,.28) 0%,rgba(135,0,46,0) 70%);
  filter:blur(26px);
}
.tl-decor{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.tl-shape{position:absolute;display:block}
/* thin outlined ring, top-left, with an inner ring */
.tl-shape-ring{
  top:36px;left:-90px;width:260px;height:260px;border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  animation:tlDrift 14s ease-in-out infinite alternate;
}
.tl-shape-ring::before{content:"";position:absolute;inset:16px;border-radius:50%;border:1px solid rgba(255,255,255,.08)}
.tl-shape-ring::after{content:"";position:absolute;top:50%;right:-3px;width:7px;height:7px;margin-top:-3px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px rgba(217,169,74,.7)}
/* nested diamonds, bottom-right */
.tl-shape-diamond{
  right:24px;bottom:-30px;width:150px;height:150px;
  border:1px solid rgba(255,255,255,.10);transform:rotate(45deg);
  animation:tlSpin 60s linear infinite;
}
.tl-shape-diamond::before{content:"";position:absolute;inset:24px;border:1px solid rgba(255,255,255,.16)}
.tl-shape-diamond::after{content:"";position:absolute;inset:48px;border:1px solid rgba(200,30,58,.5)}
/* dotted-grid patches, masked so they fade out */
.tl-shape-dots{
  top:-20px;right:-20px;width:190px;height:190px;
  background-image:radial-gradient(rgba(255,255,255,.34) 1.4px,transparent 1.4px);
  background-size:15px 15px;
  -webkit-mask-image:linear-gradient(215deg,#000 8%,transparent 72%);
  mask-image:linear-gradient(215deg,#000 8%,transparent 72%);
}
.tl-shape-dots--b{
  top:auto;right:auto;bottom:-10px;left:8%;width:150px;height:150px;
  -webkit-mask-image:linear-gradient(35deg,#000 8%,transparent 72%);
  mask-image:linear-gradient(35deg,#000 8%,transparent 72%);
}
@keyframes tlDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(18px,-14px,0)}}
@keyframes tlSpin{from{transform:rotate(45deg)}to{transform:rotate(405deg)}}

.tl-tag{
  display:inline-block;margin:0 0 12px;padding:4px 10px;border-radius:999px;
  font-size:9.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--muted-2);border:1px solid var(--hair-2);
}
.timeline li.now .tl-tag{color:#fff;background:var(--crimson);border-color:var(--crimson)}
.tl-final .tl-tag{color:#2a1d05;background:var(--gold);border-color:var(--gold)}
.tl-date{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.timeline li.now .tl-date{color:var(--crimson)}
.timeline h3{font-size:17px;margin-bottom:8px;line-height:1.25}
.tl-note{font-size:13.5px;color:var(--muted-2);margin:0;line-height:1.6}

/* =============== CATEGORIES ===============
   Pinned photo behind the section, exactly as the homepage testimonials do
   it: a position:fixed layer that the section clips to its own box
   (clip-path, unlike overflow, clips fixed descendants), with a dark
   brand-tinted wash over it so the accordion stays legible. */
.sec-photo{
  position:relative;isolation:isolate;overflow:hidden;clip-path:inset(0);
  background:#0b0b10;
}
/* the audience at a previous edition — a neutral, cooler photo, and the wash
   over it is plain charcoal (no maroon tint) and light enough for the room
   to read, so the section doesn't turn into a red-black slab */
.cat-bg{
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:url("../../images/DSC_5699.jpg") center 45% / cover no-repeat;   /* relative to this css file */
  filter:saturate(.85);
}
.sec-photo::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,16,.86) 0%,rgba(10,10,16,.58) 35%,rgba(10,10,16,.6) 70%,rgba(10,10,16,.9) 100%);
}
.sec-photo>.wrap{position:relative;z-index:1}

.cat-count{text-align:center;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted-2);min-height:20px;margin:-30px 0 26px}

/* --- accordion: one white frosted-glass card per segment, the same glass as
   the homepage testimonial cards. brightness() in the backdrop-filter dims
   the photo showing through, so white type keeps its contrast even where
   the room behind is bright. --- */
.cat-acc{display:flex;flex-direction:column;gap:12px;max-width:1000px;margin:0 auto}
.acc-item{
  border:1px solid rgba(255,255,255,.42);border-radius:var(--radius);
  background:linear-gradient(135deg,rgba(255,255,255,.32) 0%,rgba(255,255,255,.16) 55%,rgba(255,255,255,.22) 100%);
  -webkit-backdrop-filter:blur(22px) saturate(1.5) brightness(.8);
  backdrop-filter:blur(22px) saturate(1.5) brightness(.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(255,255,255,.08),0 30px 60px -32px rgba(0,0,0,.85);
  overflow:hidden;
  transition:border-color .25s ease,box-shadow .25s ease,background .25s ease;
}
.acc-item[hidden]{display:none}
.acc-item.open{
  border-color:rgba(255,255,255,.6);
  background:linear-gradient(135deg,rgba(255,255,255,.38) 0%,rgba(255,255,255,.2) 55%,rgba(255,255,255,.26) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(255,255,255,.1),0 36px 64px -30px rgba(0,0,0,.9),0 0 0 1px rgba(200,30,58,.25);
}

.acc-head{
  display:flex;align-items:center;gap:18px;width:100%;
  padding:20px 24px;border:0;background:none;color:#fff;text-align:left;cursor:pointer;
  font-family:var(--sans);
}
.acc-head:hover .acc-title{color:#ffd0d8}
.acc-num{
  flex:none;width:40px;height:40px;border-radius:var(--radius-sm);display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:13px;color:#fff;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.4);
  transition:background .25s,color .25s,border-color .25s;
}
.acc-item.open .acc-num{background:var(--crimson);color:#fff;border-color:rgba(255,255,255,.45);box-shadow:0 8px 22px var(--crimson-glow)}
.acc-title{flex:1;min-width:0;font-family:var(--display);font-weight:800;font-size:18px;line-height:1.25;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25);transition:color .2s}
.acc-count{flex:none;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:rgba(255,255,255,.82);white-space:nowrap}
.acc-chev{
  flex:none;width:12px;height:12px;margin:0 6px 0 4px;
  border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);
  transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s ease;
}
.acc-item.open .acc-chev{transform:rotate(-135deg) translate(-2px,-2px)}

/* the body opens by growing its grid track: smooth, and no height maths */
.acc-body{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .4s cubic-bezier(.22,.8,.28,1),visibility .4s;
  visibility:hidden;
}
.acc-item.open .acc-body{grid-template-rows:1fr;visibility:visible}
.acc-inner{min-height:0;overflow:hidden}
.acc-inner .cat-list{padding:4px 24px 26px}

/* the categories inside: lighter glass tiles on the glass card */
.cat-item[hidden]{display:none}
.cat-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.cat-item{
  display:flex;gap:15px;align-items:flex-start;
  padding:17px 19px;border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.14);
  transition:border-color .2s ease,transform .2s ease,background .2s ease;
}
.cat-item:hover{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.24);transform:translateX(3px)}
.cat-item .n{
  flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  color:#fff;background:var(--crimson);border:1px solid rgba(255,255,255,.35);
  box-shadow:0 6px 14px -6px var(--crimson-glow);
}
.cat-item .n svg{width:16px;height:16px;display:block}
.cat-item .t{font-size:14.5px;font-weight:500;line-height:1.45;color:#fff}
.cat-item mark{background:rgba(200,30,58,.35);color:#fff;padding:0 3px}
.no-hits{text-align:center;color:var(--muted-2);padding:38px 0}
.linkish{background:none;border:0;color:var(--crimson);text-decoration:underline;cursor:pointer;font-size:inherit}

/* =============== CARDS (aw-card: Bootstrap owns .card) ===============
   The summit's card: rounded, dark gradient, hairline ring, and the
   crimson-to-gold rule along the top edge from the testimonial cards. */
.aw-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.aw-card{
  position:relative;overflow:hidden;padding:32px 28px 28px;border-radius:var(--radius);
  border:1px solid var(--card-border);background:var(--card-bg);box-shadow:var(--card-shadow);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.aw-card::before{
  content:"";position:absolute;top:-1px;left:28px;width:64px;height:2px;border-radius:999px;
  background:linear-gradient(90deg,var(--crimson),var(--gold));
}
.aw-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.18);box-shadow:var(--card-shadow),0 30px 60px -32px rgba(0,0,0,.85)}
.card-ico{
  display:grid;place-items:center;width:46px;height:46px;border-radius:var(--radius-sm);margin-bottom:18px;
  background:rgba(200,30,58,.14);border:1px solid rgba(200,30,58,.4);color:#ff7a92;
  transition:.25s ease;
}
.aw-card:hover .card-ico{background:var(--crimson);color:#fff;border-color:var(--crimson)}
.card-ico svg{width:23px;height:23px}
.aw-card h3{font-size:18px;margin-bottom:12px;line-height:1.25}
.aw-card p{margin:0;font-size:14.5px;color:var(--muted)}

/* light variant (Why Nominate on white): paper cards, ink type, the same
   crimson-to-gold top rule; hover lifts and warms the border */
.sec-light .aw-card{
  background:#fff;border-color:rgba(22,16,26,.1);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -28px rgba(22,16,26,.35);
}
.sec-light .aw-card:hover{
  border-color:rgba(200,30,58,.45);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 56px -30px rgba(200,30,58,.35);
}
.sec-light .aw-card h3{color:#16101a}
.sec-light .aw-card p{color:#4a4450}
.sec-light .card-ico{background:#fbeef1;border-color:rgba(200,30,58,.28);color:var(--crimson)}
.sec-light .aw-card:hover .card-ico{background:var(--crimson);color:#fff;border-color:var(--crimson)}

/* =============== WHO — marquee of eligibility pills ===============
   Full-bleed rows; each row is two copies of the same track, and the row
   slides exactly one track-width, so the loop never shows a seam. The
   second row runs the other way. Edges fade into the section background;
   hovering a row pauses it. */
.who-marquee{
  --who-gap:12px;
  --who-fade:140px;
  position:relative;margin:8px 0 0;padding:6px 0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--who-fade),#000 calc(100% - var(--who-fade)),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 var(--who-fade),#000 calc(100% - var(--who-fade)),transparent);
}
.who-row{display:flex;width:max-content;gap:var(--who-gap);padding:6px 0;animation:whoScroll 38s linear infinite}
.who-row--rev{animation-direction:reverse;animation-duration:44s}
.who-marquee:hover .who-row{animation-play-state:paused}
@keyframes whoScroll{to{transform:translateX(calc(-50% - var(--who-gap)/2))}}

.who-track{display:flex;flex:none;gap:var(--who-gap);margin:0;padding:0;list-style:none}
.who-track li{
  display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
  padding:12px 24px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;
  border:1px solid rgba(200,30,58,.4);color:rgba(255,255,255,.88);background:rgba(200,30,58,.14);
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}
/* tiny gold diamond leading each pill */
.who-track li::before{content:"";width:6px;height:6px;flex:none;background:var(--gold);transform:rotate(45deg);opacity:.85}
.who-track li:hover{background:var(--crimson);border-color:var(--crimson);color:#fff}
.who-track li:hover::before{background:#fff}
.who-note{margin-top:30px;font-size:14px;color:var(--muted-2);font-style:italic}

/* =============== STEPS — roadmap infographic ===============
   A warm-white section (like the reference) so the ink road reads. The
   road draws itself in when the section scrolls into view, then the pins
   drop onto it in travel order. Below 768px the SVG is replaced by the
   vertical stepper further down. */
.sec-road{background:#fdf8f4}
.sec-road .kicker{color:var(--crimson)}
.sec-road .mumbai-feature-heading{color:#16101a}

.road{margin:0 auto;max-width:1140px}
.road svg{display:block;width:100%;height:auto;overflow:visible}

/* road layers: all four are the one path, drawn with different strokes.
   pathLength="1" on the path makes the draw-in a 0->1 dash offset. */
.rd-shadow,.rd-kerb,.rd-tarmac,.rd-line{fill:none;stroke-linecap:round;stroke-linejoin:round}
.rd-shadow{stroke:rgba(22,16,26,.16);stroke-width:66;transform:translateY(10px)}
.rd-kerb{stroke:#e3d6da;stroke-width:64}
.rd-tarmac{stroke:#1c1520;stroke-width:52}
.rd-line{stroke:#fff;stroke-width:3;stroke-dasharray:.011 .009;opacity:0;transition:opacity .6s ease 1.5s}
.rd-shadow,.rd-kerb,.rd-tarmac{
  stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 1.8s cubic-bezier(.22,.8,.28,1) .1s;
}
.road.stp-in .rd-shadow,.road.stp-in .rd-kerb,.road.stp-in .rd-tarmac{stroke-dashoffset:0}
.road.stp-in .rd-line{opacity:1}

/* pins: crimson marker, white disc, ink number, title above (or, for the
   pins hanging below the road, title below). Each pin drops in from its own
   side of the road. */
.rd-pin{opacity:0;transform-box:fill-box;transform-origin:50% 100%}
.rd-pin--down{transform-origin:50% 0}
.road.stp-in .rd-pin{animation:pinDrop .6s cubic-bezier(.34,1.56,.64,1) forwards;animation-delay:calc(1.3s + var(--i) * .22s)}
.road.stp-in .rd-pin--down{animation-name:pinRise}
@keyframes pinDrop{from{opacity:0;transform:translateY(-40px) scale(.5)}to{opacity:1;transform:none}}
@keyframes pinRise{from{opacity:0;transform:translateY(40px) scale(.5)}to{opacity:1;transform:none}}
.rd-pin-body{fill:var(--crimson);filter:drop-shadow(0 8px 10px rgba(200,30,58,.35))}
.rd-pin--final .rd-pin-body{fill:var(--gold);filter:drop-shadow(0 8px 10px rgba(217,169,74,.45))}
.rd-num{font-family:var(--display);font-weight:800;font-size:20px;fill:#16101a}
.rd-trophy{color:#8f0f26;overflow:visible}
.rd-label{font-family:var(--display);font-weight:800;font-size:19px;fill:#16101a;letter-spacing:.2px}

@media (max-width:767px){.road{display:none}}
/* doubled class so this outranks the .stepper{display:grid} that follows */
@media (min-width:768px){.stepper.stepper{display:none}}

/* =============== STEPS — vertical stepper (phones) =============== */
.stepper{
  --node:64px;
  position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;
  padding-top:6px;
}
/* the track runs between the first and last node centres */
.stepper::before,.stepper::after{
  content:"";position:absolute;top:calc(6px + var(--node)/2 - 2px);height:4px;border-radius:4px;
  left:calc(100%/12);right:calc(100%/12);pointer-events:none;
}
.stepper::before{background:rgba(255,255,255,.12)}
.stepper::after{
  background:linear-gradient(90deg,var(--crimson) 0%,var(--crimson) 55%,var(--gold) 100%);
  box-shadow:0 0 16px var(--crimson-glow);
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.6s cubic-bezier(.22,.8,.28,1) .15s;
}
.stepper.stp-in::after{transform:scaleX(1)}

.step{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
.step-node{
  position:relative;z-index:1;
  width:var(--node);height:var(--node);border-radius:50%;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:18px;color:rgba(255,255,255,.7);
  background:var(--card-bg);border:2px solid rgba(255,255,255,.18);box-shadow:var(--card-shadow);
  transition:color .35s,border-color .35s,background .35s,box-shadow .35s,transform .35s;
}
.step-node svg{width:26px;height:26px}
/* lit: the fill has reached this node */
.stepper.stp-in .step-node{
  animation:stepLight .5s cubic-bezier(.34,1.56,.64,1) forwards;
  animation-delay:calc(.35s + var(--i) * .26s);
}
@keyframes stepLight{
  0%{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.18);transform:scale(1)}
  55%{transform:scale(1.12)}
  100%{color:#fff;background:var(--crimson);border-color:rgba(255,255,255,.55);box-shadow:0 10px 26px var(--crimson-glow);transform:scale(1)}
}
/* the last node is the finish line: gold */
.stepper.stp-in .step--final .step-node{animation-name:stepLightGold}
@keyframes stepLightGold{
  0%{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.18);transform:scale(1)}
  55%{transform:scale(1.14)}
  100%{color:#2a1d05;background:linear-gradient(135deg,#f3d38a,var(--gold) 55%,#b8892f);border-color:rgba(255,255,255,.7);box-shadow:0 10px 26px rgba(217,169,74,.5);transform:scale(1)}
}

/* stem from the node down to its card */
.step::before{
  content:"";width:2px;height:18px;margin:0 auto;
  background:linear-gradient(180deg,rgba(255,255,255,.35),transparent);
}
.step-card{
  width:100%;padding:16px 12px;border-radius:var(--radius-sm);
  border:1px solid var(--card-border);background:var(--card-bg);box-shadow:var(--card-shadow);
  transition:transform .25s ease,border-color .25s ease;
}
.step:hover .step-card{transform:translateY(-4px);border-color:rgba(200,30,58,.6)}
.step-card h3{font-size:15px;line-height:1.3;margin:0;text-wrap:balance}
.step--final .step-card{border-color:rgba(217,169,74,.45)}

/* mid widths: three per row, two rows — the single track can't span that,
   so it's dropped and the nodes still light in sequence */
@media (max-width:1099px){
  .stepper{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 14px}
  .stepper::before,.stepper::after{display:none}
}
/* phones: a vertical stepper — track down the left, node then card beside it */
@media (max-width:639px){
  .stepper{--node:48px;grid-template-columns:1fr;gap:18px;padding:0 0 0 2px}
  .stepper::before,.stepper::after{
    display:block;top:0;bottom:0;height:auto;width:4px;
    left:calc(2px + var(--node)/2 - 2px);right:auto;
  }
  .stepper::after{
    background:linear-gradient(180deg,var(--crimson) 0%,var(--crimson) 55%,var(--gold) 100%);
    transform:scaleY(0);transform-origin:top center;
  }
  .stepper.stp-in::after{transform:scaleY(1)}
  .step{flex-direction:row;align-items:center;text-align:left;gap:16px}
  .step::before{display:none}
  .step-node{font-size:15px;flex:none}
  .step-node svg{width:20px;height:20px}
  .step-card{flex:1;padding:14px 16px}
}

/* =============== SERIES PARTNERS ===============
   Same block as index.html (css/style.css .ptnrSection / .ptnrGrid /
   .ptnrLogoCard), copied here so the section renders identically whether
   or not style.css is on the page. Keep the two in sync. */
.ptnrSection{
  width:100%;
  padding:84px 24px 88px;
  background:#ffffff;
}
/* heading: summit's .mumbai-feature-heading, dark-on-white variant */
.ptnrSection .mumbai-feature-heading{
  margin:0 0 40px;
  font-family:'Urbanist',sans-serif;
  font-weight:800;
  font-size:46px;
  letter-spacing:.5px;
  line-height:1.15;
  text-transform:uppercase;
  color:#16101a;
}
.ptnrSection .glance{color:var(--crimson);font-weight:600}

/* Ruled grid: 1px "gap" over a line-coloured background reads as hairlines
   between cells. No padding, so nothing shows at the outer edge — internal
   lines only. Column counts are chosen so 42 logos always fill the last row
   (42 = 7·6 = 6·7 = 3·14 = 2·21). */
.ptnrGrid{
  --ptnr-line:rgba(22,16,26,.13);
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:1px;
  padding:0;
  width:100%;
  max-width:1240px;
  margin:0 auto;
  background:var(--ptnr-line);
}
.ptnrLogoCard{
  height:96px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 22px;
  background:#ffffff;
  transition:background-color .25s ease;
}
.ptnrLogoCard:hover{background-color:#fbf7f8}
.ptnrLogoCard img{max-width:100%;max-height:100%;object-fit:contain;display:block}

@media (max-width:1099px){
  .ptnrGrid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .ptnrLogoCard{height:88px;padding:16px 18px}
}
@media (max-width:1080px){
  .ptnrSection .mumbai-feature-heading{font-size:34px}
}
@media (max-width:799px){
  .ptnrGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .ptnrSection .mumbai-feature-heading{font-size:26px}
}
@media (max-width:600px){
  .ptnrSection{padding:60px 16px 64px}
}
@media (max-width:519px){
  .ptnrGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ptnrLogoCard{height:74px;padding:12px 14px}
}
@media (prefers-reduced-motion:reduce){
  .ptnrLogoCard{transition:none}
}


/* =============== FAQ =============== */
.faq details{
  border:1px solid var(--card-border);border-radius:14px;
  background:rgba(255,255,255,.04);margin-bottom:10px;overflow:hidden;transition:border-color .2s,background .2s;
}
.faq details[open]{border-color:rgba(200,30,58,.5);background:rgba(200,30,58,.08)}
.faq summary{list-style:none;cursor:pointer;padding:21px 58px 21px 24px;position:relative;font-family:var(--display);font-size:16px;font-weight:700;color:#fff}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:24px;top:50%;
  width:9px;height:9px;margin-top:-6px;
  border-right:2px solid var(--crimson);border-bottom:2px solid var(--crimson);
  transform:rotate(45deg);transition:transform .26s ease,margin-top .26s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.faq details p{margin:0;padding:0 24px 22px;font-size:14.5px;color:var(--muted)}

/* (footer: the summit's .ftr-wrap, styled by css/style.css) */

/* =============== STICKY CTA + TO TOP =============== */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:65;
  display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;
  padding:12px 24px;padding-bottom:calc(12px + env(safe-area-inset-bottom));
  background:rgba(6,6,10,.96);backdrop-filter:blur(12px);
  border-top:2px solid var(--crimson);
  transform:translateY(110%);visibility:hidden;
  transition:transform .32s cubic-bezier(.2,.7,.3,1),visibility .32s;
}
.sticky-cta.show{transform:none;visibility:visible}
.sticky-cta p{margin:0;font-size:12.5px;color:var(--muted)}
.sticky-cta b{color:#fff;font-weight:800;text-transform:uppercase;letter-spacing:.6px;margin-right:10px}

.to-top{
  position:fixed;right:22px;bottom:78px;z-index:66;
  width:44px;height:44px;border-radius:50%;cursor:pointer;display:grid;place-items:center;
  border:1px solid var(--hair-2);background:rgba(6,6,10,.92);color:#fff;
  opacity:0;visibility:hidden;transform:translateY(10px);transition:.28s ease;
}
.to-top.show{opacity:1;visibility:visible;transform:none}
.to-top:hover{border-color:var(--crimson);color:var(--crimson)}
.to-top svg{width:18px;height:18px}

/* =============== REVEAL =============== */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}

/* =============== RESPONSIVE =============== */
@media (max-width:1000px){
  /* vertical: a spine down the left, cards stacked beside it; the fill
     runs down to the live dot's centre (--tl-py, set by the script) */
  .timeline{grid-template-columns:1fr;gap:14px}
  ol.timeline{padding:0 0 0 40px}
  .timeline::before,.timeline::after{
    top:0;left:calc(9px - 1px);right:auto;width:2px;height:auto;max-width:none;
    transform-origin:top center;
  }
  .timeline::before{bottom:0;transform:scaleY(0)}
  .timeline::after{height:var(--tl-py);background:linear-gradient(180deg,var(--crimson-dark),var(--crimson));transform:scaleY(0)}
  .timeline.tl-in::before,.timeline.tl-in::after{transform:scaleY(1)}
  .tl-dot{top:24px;left:calc(9px - 40px);transform:translateX(-50%)}
  @keyframes tlPop{from{opacity:0;transform:translateX(-50%) scale(0)}to{opacity:1;transform:translateX(-50%) scale(1)}}
  .timeline li::before{top:32px;left:calc(9px - 40px);width:calc(40px - 9px);height:1px;transform-origin:left;background:linear-gradient(90deg,var(--hair-2),transparent)}
  @keyframes tlStem{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:scaleX(1)}}
  .stat-grid{grid-template-columns:repeat(2,1fr);gap:28px 8px}
  .stat:nth-child(3){border-left:0}
}
@media (max-width:640px){
  .sec{padding:66px 0}
  .hero-panel-in{padding-top:42px;padding-bottom:46px}
  .tl-card{padding:22px 18px 20px}
  .tl-shape-ring{width:180px;height:180px;left:-70px;top:20px}
  .tl-shape-diamond{width:110px;height:110px;right:-30px}
  .tl-shape-diamond::before{inset:18px}
  .tl-shape-diamond::after{inset:36px}
  .cat-list{grid-template-columns:1fr}
  .acc-head{padding:16px 16px;gap:12px}
  .acc-count{display:none}
  .acc-title{font-size:16px}
  .acc-inner .cat-list{padding:2px 16px 18px}
  .sticky-cta{gap:12px;padding:10px 16px}
  .sticky-cta p{font-size:12px;text-align:center;width:100%}
  .to-top{bottom:92px;right:16px}
}

/* =============== PRINT =============== */
@media print{
  .navbar,.nav-scrim,.ftr-wrap,.sticky-cta,.to-top,.hero-cta,.cat-search,.cat-bg{display:none!important}
  body.awards-page{background:#fff;color:#111}
  .sec,.sec-dark,.stats,.hero-panel{background:#fff!important;border-color:#ccc!important}
  .awards-main h1,.awards-main h2,.awards-main h3,.stat b{color:#8f0f26!important}
  .kicker{color:#c81e3a!important}
  .acc-item[hidden]{display:block!important}
  .acc-body{grid-template-rows:1fr!important;visibility:visible!important}
  .sec-photo{background:#fff!important}
  .sec-photo::before{display:none}
  .cat-item,.aw-card,.step-card,.faq details{border-color:#ddd;background:#fff}
  .cat-item .t,.aw-card p,.body-lg,.awards-main p{color:#333}
  .faq details p{display:block!important}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none}
  .sticky-cta.show{transform:none}
  .timeline:not(.tl-in) .tl-dot,.timeline:not(.tl-in) li::before,.timeline:not(.tl-in) .tl-card{opacity:1}
  .timeline::before,.timeline::after{transform:none}
  /* marquee becomes a static, wrapped, centred row of the eight pills */
  .who-marquee{-webkit-mask-image:none;mask-image:none;padding:0 clamp(20px,4vw,48px)}
  .who-row{width:auto;justify-content:center}
  .who-track{flex-wrap:wrap;justify-content:center}
  .who-track[aria-hidden],.who-row--rev{display:none}
}