/* ════════════════════════════════════════════════════════════
   RUPADI INTERNATIONAL — HOMEPAGE LAYER  ·  v4.0
   "Consulting-grade editorial, product-company energy."

   Structural rule, per brief:
     · TOP (hero) and BOTTOM (footer) carry the dark brand colour.
     · Everything between is LIGHT and NATURAL — warm paper, sand
       rules, ink type — with vibrant product hues used as accents
       and dark cinematic product imagery doing the storytelling.

   Scoped entirely to .hx-* / .flash-* / .spx-* class names so the
   shared rupadi.css and every inner page are untouched.
════════════════════════════════════════════════════════════ */

/* ── 0 · Homepage tokens ─────────────────────────────────── */
:root{
  /* Natural light world */
  --hx-paper:    #FBF7F0;   /* warm paper — primary light ground */
  --hx-paper-2:  #F4EFE4;   /* alt band — one shade deeper       */
  --hx-paper-3:  #F2F4F0;   /* cool sage band — natural contrast */
  --hx-card:     #FFFFFF;
  --hx-line:     #E9E0D0;
  --hx-line-2:   #D8CCB6;
  --hx-ink:      #1B1811;   /* headline ink   */
  --hx-ink-2:    #56503F;   /* body ink       */
  --hx-ink-3:    #8B8371;   /* muted / labels */

  /* Brand — hero + footer only */
  --hx-gold:     #F5A623;
  --hx-gold-2:   #F5C451;
  --hx-ember:    #C2410C;   /* light-ground brand accent, sparing */

  /* Vibrant product hues, tuned for legibility on light ground */
  --hx-violet:   #6D28D9;
  --hx-blue:     #1D4ED8;
  --hx-teal:     #0E7490;
  --hx-emerald:  #047857;
  --hx-amber:    #B45309;
  --hx-rose:     #A83A12;   /* burnt orange — no pink anywhere in the palette */

  --hx-r-sm: 12px;
  --hx-r:    18px;
  --hx-r-lg: 26px;
  --hx-r-xl: 34px;

  --hx-shadow:    0 2px 4px rgba(27,24,17,.03), 0 12px 30px -12px rgba(27,24,17,.10);
  --hx-shadow-lg: 0 4px 8px rgba(27,24,17,.04), 0 32px 64px -24px rgba(27,24,17,.22);
  --hx-shadow-xl: 0 8px 16px rgba(27,24,17,.05), 0 48px 96px -32px rgba(27,24,17,.30);
}

/* ── 1 · Light band scaffolding ──────────────────────────── */
.hx-band{
  position:relative;
  background:var(--hx-paper);
  color:var(--hx-ink);
  padding:clamp(72px,9vw,132px) 0;
  overflow:hidden;
}
.hx-band--alt{background:var(--hx-paper-2)}
.hx-band--sage{background:var(--hx-paper-3)}
.hx-band--tight{padding:clamp(48px,6vw,80px) 0}

/* Natural, low-saturation atmosphere wash — never competes with
   the imagery, just stops large light areas going flat. */
.hx-band::before{
  content:'';position:absolute;inset:-10%;z-index:0;
  pointer-events:none;filter:blur(70px);opacity:.5;
  background:
    radial-gradient(28% 38% at 8% 12%,  #FFE3B8, transparent 70%),
    radial-gradient(26% 34% at 92% 8%,  #DCEBF7, transparent 70%),
    radial-gradient(30% 40% at 88% 94%, #F6E2C8, transparent 70%),
    radial-gradient(24% 34% at 12% 92%, #E2EFDF, transparent 70%);
}
.hx-band--sage::before{
  background:
    radial-gradient(30% 40% at 10% 10%, #DDEBDD, transparent 70%),
    radial-gradient(28% 36% at 90% 14%, #E4EDF6, transparent 70%),
    radial-gradient(26% 36% at 84% 90%, #F3E7CF, transparent 70%);
}
.hx-band > .container,
.hx-band > .container-wide{position:relative;z-index:1}

.hx-wrap{width:100%;max-width:1320px;margin-inline:auto;padding-inline:32px;position:relative;z-index:1}
.hx-wrap--wide{max-width:1440px}
.hx-wrap--narrow{max-width:900px}

/* ── 2 · Editorial type kit (light bands) ────────────────── */
.hx-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-mono);font-size:10.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--hx-ember);
  padding:7px 14px 7px 12px;
  background:rgba(194,65,12,.06);
  border:1px solid rgba(194,65,12,.18);
  border-radius:999px;
  margin-bottom:22px;
}
.hx-eyebrow::before{
  content:'';width:5px;height:5px;border-radius:50%;flex-shrink:0;
  background:var(--hx-ember);
}
.hx-h2{
  font-size:clamp(1.9rem,3.9vw,3.15rem);
  font-weight:800;letter-spacing:-.042em;line-height:1.06;
  color:var(--hx-ink);margin-bottom:18px;
  max-width:19ch;
}
.hx-h2--wide{max-width:26ch}
.hx-h2 em{
  font-style:italic;font-family:'Fraunces',var(--font-display);
  font-weight:600;font-optical-sizing:auto;color:var(--hx-ember);
}
.hx-lede{
  font-size:clamp(15.5px,1.35vw,17.5px);
  line-height:1.7;color:var(--hx-ink-2);max-width:56ch;
}
.hx-head{margin-bottom:clamp(40px,5vw,64px)}
.hx-head--split{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr);
  gap:clamp(28px,5vw,72px);align-items:end;
}
.hx-head--split .hx-lede{padding-bottom:6px}
.hx-head--center{text-align:center}
.hx-head--center .hx-h2,
.hx-head--center .hx-lede{margin-inline:auto}

/* Numbered citation marker */
.cite{
  font-family:var(--font-mono);font-size:.62em;font-weight:600;
  vertical-align:super;line-height:0;margin-left:2px;
}
.cite a{
  color:var(--hx-ember);
  text-decoration:none;
  border-bottom:1px dotted rgba(194,65,12,.5);
  padding:0 1px;
}
.cite a:hover{background:rgba(194,65,12,.10)}

/* ══════════════════════════════════════════════════════════
   3 · HERO — the one dark, brand-coloured band at the top
══════════════════════════════════════════════════════════ */
.hx-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(120% 80% at 78% 8%,  rgba(245,166,35,.16), transparent 60%),
    radial-gradient(90% 70% at 6% 96%,   rgba(109,40,217,.14), transparent 62%),
    linear-gradient(180deg,#0A0C12 0%,#0C0F18 62%,#0A0C12 100%);
  color:#EDE8DD;
  padding:clamp(140px,15vw,180px) 0 clamp(56px,7vw,88px);
  min-height:min(100vh,940px);
  display:flex;align-items:center;
}
.hx-hero__grain,
.hx-hero__mesh{position:absolute;inset:0;pointer-events:none}
.hx-hero__mesh{
  background-image:
    linear-gradient(rgba(245,166,35,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(245,166,35,.055) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent 78%);
  mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent 78%);
}
.hx-hero__glow{
  position:absolute;border-radius:50%;pointer-events:none;
  filter:blur(110px);will-change:transform;
}
.hx-hero__glow--gold{
  top:-22%;right:-6%;width:680px;height:680px;
  background:radial-gradient(circle,rgba(245,166,35,.30),transparent 68%);
  animation:hxDrift 38s ease-in-out infinite;
}
.hx-hero__glow--violet{
  bottom:-30%;left:-10%;width:560px;height:560px;
  background:radial-gradient(circle,rgba(124,58,237,.24),transparent 70%);
  animation:hxDrift 46s ease-in-out infinite reverse;
}
@keyframes hxDrift{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%    {transform:translate3d(-40px,34px,0) scale(1.07)}
}
.hx-hero__fade{
  position:absolute;left:0;right:0;bottom:0;height:190px;pointer-events:none;
  background:linear-gradient(to bottom,transparent,var(--hx-paper));
  z-index:3;
}
.hx-hero .hx-wrap{z-index:2}

.hx-hero__grid{
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(36px,5vw,72px);align-items:center;
}

.hx-hero__tag{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:11px;font-weight:600;
  letter-spacing:.17em;text-transform:uppercase;
  color:var(--hx-gold);
  padding:8px 17px;
  background:rgba(245,166,35,.10);
  border:1px solid rgba(245,166,35,.28);
  border-radius:999px;margin-bottom:26px;
  animation:hxUp .8s cubic-bezier(.16,1,.3,1) .05s both;
}
.hx-hero__tag i{font-size:10px}
.hx-hero__dot{
  width:6px;height:6px;border-radius:50%;flex-shrink:0;
  background:var(--hx-gold);box-shadow:0 0 10px var(--hx-gold);
  animation:hxPulse 2.4s ease-in-out infinite;
}
@keyframes hxPulse{0%,100%{opacity:1}50%{opacity:.35}}

.hx-hero__h1{
  font-size:clamp(2.5rem,5.2vw,4.5rem);
  font-weight:800;letter-spacing:-.045em;line-height:1.02;
  color:#F6F2E9;margin-bottom:24px;
  animation:hxUp .9s cubic-bezier(.16,1,.3,1) .12s both;
}
/* The one brand-coloured tagline on the page */
.hx-hero__h1 em{
  display:block;font-style:italic;
  font-family:'Fraunces',var(--font-display);font-weight:600;
  font-optical-sizing:auto;padding-bottom:.1em;
  background:linear-gradient(100deg,#E0821A 0%,#F5A623 24%,#F7CE6B 44%,#FDEBC8 52%,#F5C451 62%,#F5A623 80%,#E0821A 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:hxShimmer 7s linear infinite;
}
@keyframes hxShimmer{0%{background-position:0% 50%}100%{background-position:220% 50%}}
.hx-hero__sub{
  font-size:clamp(15.5px,1.6vw,18px);line-height:1.72;
  color:#A9B0C0;max-width:50ch;margin-bottom:36px;
  animation:hxUp .9s cubic-bezier(.16,1,.3,1) .2s both;
}
.hx-hero__sub b{color:#E4DED2;font-weight:600}
.hx-hero__cta{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  animation:hxUp .9s cubic-bezier(.16,1,.3,1) .28s both;
}
.hx-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 30px;border-radius:var(--hx-r-sm);
  font-size:15px;font-weight:700;letter-spacing:-.01em;
  border:1px solid transparent;white-space:nowrap;cursor:pointer;
  transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s ease,
             background .22s ease,border-color .22s ease,color .22s ease;
}
.hx-btn i{font-size:12px;transition:transform .22s cubic-bezier(.16,1,.3,1)}
.hx-btn:hover i{transform:translateX(3px)}
.hx-btn--gold{
  background:linear-gradient(180deg,var(--hx-gold-2),var(--hx-gold));
  color:#160F02;box-shadow:0 10px 30px -8px rgba(245,166,35,.55);
}
.hx-btn--gold:hover{transform:translateY(-2px);box-shadow:0 16px 40px -10px rgba(245,166,35,.65)}
.hx-btn--wire{
  background:rgba(255,255,255,.03);color:#E4DED2;
  border-color:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.hx-btn--wire:hover{transform:translateY(-2px);border-color:rgba(245,166,35,.45);color:#fff;background:rgba(245,166,35,.08)}
.hx-btn--ink{
  background:var(--hx-ink);color:#FBF7F0;
  box-shadow:0 10px 28px -10px rgba(27,24,17,.55);
}
.hx-btn--ink:hover{transform:translateY(-2px);background:#2B261B;box-shadow:0 18px 40px -12px rgba(27,24,17,.5)}
.hx-btn--ghost{
  background:transparent;color:var(--hx-ink);border-color:var(--hx-line-2);
}
.hx-btn--ghost:hover{transform:translateY(-2px);border-color:var(--hx-ink);background:rgba(27,24,17,.03)}

/* Cinematic hero visual — the product, not a stock abstraction */
.hx-hero__stage{
  position:relative;
  animation:hxUp 1.1s cubic-bezier(.16,1,.3,1) .32s both;
}
.hx-hero__frame{
  position:relative;border-radius:var(--hx-r-lg);overflow:hidden;
  border:1px solid rgba(245,166,35,.24);
  box-shadow:
    0 50px 100px -30px rgba(0,0,0,.85),
    0 0 90px -30px rgba(245,166,35,.35),
    inset 0 1px 0 rgba(255,255,255,.10);
  transform:perspective(1600px) rotateY(-7deg) rotateX(2.5deg);
  transition:transform .7s cubic-bezier(.16,1,.3,1);
}
.hx-hero__stage:hover .hx-hero__frame{transform:perspective(1600px) rotateY(-3deg) rotateX(1deg)}
.hx-hero__frame img{width:100%;height:auto;display:block}
.hx-hero__frame::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,rgba(245,166,35,.10),transparent 45%);
}
/* Floating evidence chips over the visual */
.hx-chip-float{
  position:absolute;z-index:2;
  display:flex;align-items:center;gap:10px;
  padding:11px 16px;border-radius:14px;
  background:rgba(12,15,23,.82);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 20px 40px -16px rgba(0,0,0,.8);
  animation:hxFloat 6s ease-in-out infinite;
}
.hx-chip-float i{font-size:13px}
.hx-chip-float b{
  display:block;font-size:15px;font-weight:800;letter-spacing:-.02em;color:#F6F2E9;line-height:1.1;
}
.hx-chip-float span{
  display:block;font-family:var(--font-mono);font-size:9px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:#8E96A8;margin-top:3px;
}
.hx-chip-float--a{top:9%;left:-7%;animation-delay:0s}
.hx-chip-float--a i{color:#A78BFA}
.hx-chip-float--b{bottom:12%;right:-6%;animation-delay:-3s}
.hx-chip-float--b i{color:#34D399}
@keyframes hxFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}

/* Hero metric rail */
.hx-hero__rail{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;margin-top:clamp(48px,6vw,76px);
  border-top:1px solid rgba(255,255,255,.10);
  animation:hxUp .9s cubic-bezier(.16,1,.3,1) .42s both;
}
.hx-rail__item{padding:26px 20px 4px}
.hx-rail__item + .hx-rail__item{border-left:1px solid rgba(255,255,255,.08)}
.hx-rail__val{
  font-size:clamp(1.9rem,3vw,2.6rem);font-weight:800;
  letter-spacing:-.045em;line-height:1;color:#F6F2E9;margin-bottom:9px;
}
.hx-rail__val sup{font-size:.5em;color:var(--hx-gold);vertical-align:super;margin-left:1px}
.hx-rail__lbl{
  font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#7E8698;
}
@keyframes hxUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* ══════════════════════════════════════════════════════════
   4 · PROOF MARQUEE — thin light band under the hero
══════════════════════════════════════════════════════════ */
.hx-marquee{
  position:relative;background:var(--hx-paper);
  border-bottom:1px solid var(--hx-line);
  padding:22px 0;overflow:hidden;
}
.hx-marquee__track{
  display:flex;align-items:center;gap:0;width:max-content;
  animation:hxScroll 46s linear infinite;
}
.hx-marquee:hover .hx-marquee__track{animation-play-state:paused}
@keyframes hxScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.hx-marquee__item{
  display:inline-flex;align-items:center;gap:11px;
  padding:0 34px;white-space:nowrap;
  font-size:13.5px;font-weight:600;color:var(--hx-ink-2);
}
.hx-marquee__item i{font-size:12px;color:var(--hx-ember);opacity:.85}
.hx-marquee__item::after{
  content:'';width:4px;height:4px;border-radius:50%;
  background:var(--hx-line-2);margin-left:34px;
}
.hx-marquee::before,.hx-marquee::after{
  content:'';position:absolute;top:0;bottom:0;width:84px;z-index:2;pointer-events:none;
}
.hx-marquee::before{left:0;background:linear-gradient(90deg,var(--hx-paper),transparent)}
.hx-marquee::after{right:0;background:linear-gradient(270deg,var(--hx-paper),transparent)}

/* ══════════════════════════════════════════════════════════
   5 · POINT OF VIEW — the consulting-firm thesis block
══════════════════════════════════════════════════════════ */
.hx-pov{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(32px,5vw,68px);align-items:start;
}
.hx-pov__quote{
  font-size:clamp(1.5rem,2.9vw,2.35rem);
  font-weight:700;letter-spacing:-.035em;line-height:1.22;
  color:var(--hx-ink);margin-bottom:22px;
}
.hx-pov__quote span{color:var(--hx-ember)}
.hx-pov__body p{
  font-size:16px;line-height:1.75;color:var(--hx-ink-2);margin-bottom:16px;max-width:54ch;
}
.hx-pov__body p:last-child{margin-bottom:0}
.hx-pov__rule{
  width:56px;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--hx-ember),var(--hx-gold));
  margin-bottom:26px;
}
.hx-pov__verdict{
  margin-top:28px;padding:22px 24px;
  border-left:3px solid var(--hx-ember);
  background:linear-gradient(90deg,rgba(194,65,12,.055),transparent 85%);
  border-radius:0 var(--hx-r-sm) var(--hx-r-sm) 0;
  font-size:16.5px;font-weight:650;line-height:1.6;color:var(--hx-ink);
}

.hx-evidence{display:grid;gap:12px}

/* Cited figure — an image carries the claim alongside the numbers,
   credited in the same voice as the numbered sources below. */
.hx-figure{
  position:relative;margin:0;overflow:hidden;
  border-radius:var(--hx-r);background:#0A0C12;
  border:1px solid rgba(27,24,17,.10);
  box-shadow:var(--hx-shadow-lg);
  transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease;
}
.hx-figure:hover{transform:translateY(-4px);box-shadow:var(--hx-shadow-xl)}
.hx-figure img{
  width:100%;height:auto;display:block;
  transition:transform 1.2s cubic-bezier(.16,1,.3,1);
}
.hx-figure:hover img{transform:scale(1.04)}
.hx-figure figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:44px 22px 18px;
  background:linear-gradient(to top,rgba(10,12,18,.94) 22%,transparent);
}
.hx-figure figcaption b{
  display:flex;align-items:center;gap:9px;
  font-size:14.5px;font-weight:700;letter-spacing:-.015em;color:#F6F2E9;margin-bottom:5px;
}
.hx-figure figcaption b i{font-size:11px;color:var(--hx-gold)}
.hx-figure figcaption span{
  display:block;font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:#98A0B2;line-height:1.5;
}
.hx-figure figcaption span::before{
  content:'';display:inline-block;width:14px;height:1px;
  background:rgba(245,166,35,.65);vertical-align:middle;margin-right:8px;
}
.hx-ev{
  display:grid;grid-template-columns:auto 1fr;
  gap:20px;align-items:center;
  background:var(--hx-card);
  border:1px solid var(--hx-line);
  border-radius:var(--hx-r);
  padding:22px 24px;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease;
}
.hx-ev:hover{transform:translateY(-3px);box-shadow:var(--hx-shadow-lg);border-color:var(--hx-line-2)}
.hx-ev__num{
  font-size:clamp(1.9rem,3.2vw,2.45rem);font-weight:800;
  letter-spacing:-.05em;line-height:1;color:var(--hx-ember);
  min-width:3.4ch;
}
.hx-ev__txt h4{
  font-size:14.5px;font-weight:700;color:var(--hx-ink);
  margin-bottom:5px;letter-spacing:-.015em;
}
.hx-ev__txt p{font-size:13px;line-height:1.55;color:var(--hx-ink-3)}
.hx-ev__src{
  font-family:var(--font-mono);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--hx-ink-3);margin-top:8px;display:block;
}

/* ══════════════════════════════════════════════════════════
   6 · FLASH CARDS — the product suite, front & back
══════════════════════════════════════════════════════════ */
.hx-flash-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.flash{
  position:relative;
  height:498px;
  perspective:1800px;
}
.flash-inner{
  position:relative;width:100%;height:100%;
  transform-style:preserve-3d;
  transition:transform .78s cubic-bezier(.19,1,.22,1);
}
.flash:hover .flash-inner,
.flash:focus-within .flash-inner,
.flash.is-flipped .flash-inner{transform:rotateY(180deg)}

.flash-face{
  position:absolute;inset:0;
  border-radius:var(--hx-r-lg);
  overflow:hidden;
  -webkit-backface-visibility:hidden;backface-visibility:hidden;
  display:flex;flex-direction:column;
  border:1px solid var(--hx-line);
  background:var(--hx-card);
  box-shadow:var(--hx-shadow);
}
.flash:hover .flash-face{box-shadow:var(--hx-shadow-xl)}
.flash-back{transform:rotateY(180deg)}

/* — front — */
.flash-shot{
  position:relative;aspect-ratio:16/9;flex-shrink:0;overflow:hidden;
  background:#140D06;
}
.flash-shot img{
  width:100%;height:100%;object-fit:contain;display:block;
  transform:scale(1.02);
  transition:transform 1.1s cubic-bezier(.16,1,.3,1);
}
.flash:hover .flash-shot img{transform:scale(1.08)}
.flash-shot::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(to top,rgba(10,12,18,.72) 0%,transparent 52%),
    linear-gradient(115deg,var(--p-soft),transparent 60%);
}
.flash-status{
  position:absolute;top:14px;right:14px;z-index:2;
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-mono);font-size:9px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;
  padding:6px 11px;border-radius:999px;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.flash-status--live{
  color:#6EE7B7;background:rgba(4,120,87,.30);border:1px solid rgba(110,231,183,.42);
}
.flash-status--pilot{
  color:#FCD34D;background:rgba(180,83,9,.32);border:1px solid rgba(252,211,77,.42);
}
.flash-status--build{
  color:#C7D2FE;background:rgba(29,78,216,.30);border:1px solid rgba(199,210,254,.40);
}
.flash-status::before{
  content:'';width:5px;height:5px;border-radius:50%;background:currentColor;
  box-shadow:0 0 7px currentColor;
}
.flash-mark{
  position:absolute;left:20px;bottom:16px;z-index:2;
  display:flex;align-items:center;gap:11px;
}
.flash-mark i{
  width:34px;height:34px;border-radius:10px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:14px;
  color:#fff;background:var(--p);
  box-shadow:0 8px 20px -6px var(--p-soft-2);
}
.flash-mark span{
  font-family:var(--font-mono);font-size:9.5px;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.86);
}
.flash-body{
  padding:24px 24px 20px;
  display:flex;flex-direction:column;flex-grow:1;
}
.flash-title{
  font-size:1.42rem;font-weight:800;letter-spacing:-.035em;
  color:var(--hx-ink);line-height:1.14;margin-bottom:10px;
}
.flash-lede{
  font-size:14px;line-height:1.62;color:var(--hx-ink-2);
  flex-grow:1;
}
.flash-hint{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--p);
  background:none;border:none;padding:0;cursor:pointer;
  align-self:flex-start;
}
.flash-hint i{transition:transform .4s var(--ease-out,cubic-bezier(.16,1,.3,1))}
.flash:hover .flash-hint i{transform:rotate(180deg)}

/* Top hue rule identifies the product family at a glance */
.flash-face::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;z-index:3;
  background:linear-gradient(90deg,var(--p),var(--p-lite,var(--p)));
}

/* — back — */
.flash-back{
  padding:26px 24px 22px;
  background:
    linear-gradient(180deg,var(--p-soft) 0%,transparent 40%),
    var(--hx-card);
}
.flash-back__cat{
  font-family:var(--font-mono);font-size:9.5px;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;color:var(--p);margin-bottom:9px;
}
.flash-back__title{
  font-size:1.22rem;font-weight:800;letter-spacing:-.03em;
  color:var(--hx-ink);margin-bottom:16px;line-height:1.18;
}
.flash-list{display:flex;flex-direction:column;gap:11px;flex-grow:1}
.flash-list li{
  display:flex;gap:11px;align-items:flex-start;
  font-size:13.2px;line-height:1.52;color:var(--hx-ink-2);
}
.flash-list li i{
  font-size:9px;color:var(--p);margin-top:5px;flex-shrink:0;
}
.flash-metric{
  display:flex;align-items:baseline;gap:10px;
  margin-top:16px;padding-top:15px;
  border-top:1px solid var(--hx-line);
}
.flash-metric b{
  font-size:1.5rem;font-weight:800;letter-spacing:-.04em;color:var(--hx-ember);line-height:1;
}
.flash-metric span{
  font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--hx-ink-3);line-height:1.4;
}
.flash-go{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  margin-top:16px;padding:12px 18px;border-radius:var(--hx-r-sm);
  font-size:13.5px;font-weight:700;
  color:#fff;background:var(--p);
  transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s ease,filter .22s ease;
}
.flash-go i{font-size:11px;transition:transform .22s ease}
.flash-go:hover{transform:translateY(-2px);filter:brightness(1.1);box-shadow:0 14px 28px -10px var(--p)}
.flash-go:hover i{transform:translateX(3px)}

/* ══════════════════════════════════════════════════════════
   7 · CINEMATIC STORY PANELS — the images do the talking
══════════════════════════════════════════════════════════ */
.hx-story{display:flex;flex-direction:column;gap:clamp(56px,7vw,104px)}
.spx{
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(32px,5vw,68px);align-items:center;
}
.spx--flip .spx-media{order:2}
.spx--flip .spx-copy{order:1}

.spx-media{position:relative}
.spx-media__frame{
  position:relative;border-radius:var(--hx-r-lg);overflow:hidden;
  border:1px solid rgba(27,24,17,.10);
  box-shadow:var(--hx-shadow-xl);
  background:#0A0C12;
  transition:transform .6s cubic-bezier(.16,1,.3,1),box-shadow .6s ease;
}
.spx-media:hover .spx-media__frame{transform:translateY(-6px)}
.spx-media__frame img{width:100%;height:auto;display:block}
.spx-media__frame::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,var(--p-soft),transparent 55%);
}
/* Accent slab behind the image — vibrant, but only as a shadow of colour */
.spx-media::before{
  content:'';position:absolute;z-index:-1;
  inset:auto -26px -26px auto;width:62%;height:72%;
  border-radius:var(--hx-r-lg);
  background:linear-gradient(140deg,var(--p),transparent 70%);
  opacity:.16;filter:blur(2px);
}
.spx--flip .spx-media::before{inset:auto auto -26px -26px}

.spx-kicker{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--p);
  padding:7px 14px;border-radius:999px;
  background:var(--p-soft);border:1px solid var(--p-soft-2);
  margin-bottom:20px;
}
.spx-h3{
  font-size:clamp(1.6rem,3.1vw,2.5rem);font-weight:800;
  letter-spacing:-.04em;line-height:1.08;color:var(--hx-ink);
  margin-bottom:16px;max-width:17ch;
}
.spx-h3 em{font-style:italic;font-family:'Fraunces',var(--font-display);font-weight:600;color:var(--hx-ember)}
.spx-copy > p{
  font-size:15.5px;line-height:1.72;color:var(--hx-ink-2);
  max-width:50ch;margin-bottom:24px;
}
.spx-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:26px}
.spx-stat{
  background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r-sm);padding:16px 15px;
  transition:transform .28s cubic-bezier(.16,1,.3,1),border-color .28s ease,box-shadow .28s ease;
}
.spx-stat:hover{transform:translateY(-3px);border-color:var(--p-soft-2);box-shadow:var(--hx-shadow)}
.spx-stat b{
  display:block;font-size:1.42rem;font-weight:800;letter-spacing:-.04em;
  color:var(--hx-ember);line-height:1;margin-bottom:7px;
}
.spx-stat span{
  font-family:var(--font-mono);font-size:9px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--hx-ink-3);line-height:1.45;display:block;
}
.spx-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.spx-tag{
  font-family:var(--font-mono);font-size:10px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;
  color:var(--hx-ink-2);padding:7px 13px;border-radius:999px;
  background:rgba(27,24,17,.035);border:1px solid var(--hx-line);
}
.spx-links{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.spx-link{
  display:inline-flex;align-items:center;gap:9px;
  font-size:14.5px;font-weight:700;color:var(--p);
  padding-bottom:3px;border-bottom:1.5px solid transparent;
  transition:gap .22s ease,border-color .22s ease;
}
.spx-link:hover{gap:14px;border-color:var(--p)}
.spx-link i{font-size:11px}

/* ══════════════════════════════════════════════════════════
   8 · THE AI SHOP — how the work gets made
══════════════════════════════════════════════════════════ */
.hx-shop{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(32px,5vw,68px);align-items:center;
}
.hx-shop__media{position:relative;border-radius:var(--hx-r-lg);overflow:hidden;box-shadow:var(--hx-shadow-xl)}
.hx-shop__media img{width:100%;height:auto;display:block}
.hx-shop__badge{
  position:absolute;left:20px;bottom:20px;z-index:2;
  display:flex;align-items:center;gap:12px;
  padding:13px 18px;border-radius:16px;
  background:rgba(12,15,23,.86);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.14);
}
.hx-shop__badge i{font-size:17px;color:var(--hx-gold)}
.hx-shop__badge b{display:block;font-size:14px;font-weight:700;color:#F6F2E9;letter-spacing:-.02em}
.hx-shop__badge span{
  display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.13em;
  text-transform:uppercase;color:#8E96A8;margin-top:3px;
}
.hx-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:30px}
.hx-step{
  background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r);padding:22px 22px 20px;
  position:relative;overflow:hidden;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease;
}
.hx-step:hover{transform:translateY(-4px);box-shadow:var(--hx-shadow-lg);border-color:var(--p-soft-2,var(--hx-line-2))}
.hx-step__n{
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  letter-spacing:.14em;color:var(--p,var(--hx-ember));margin-bottom:12px;display:block;
}
.hx-step i{font-size:17px;color:var(--p,var(--hx-ember));margin-bottom:12px;display:block}
.hx-step h4{font-size:15px;font-weight:750;color:var(--hx-ink);margin-bottom:7px;letter-spacing:-.02em}
.hx-step p{font-size:13.2px;line-height:1.6;color:var(--hx-ink-2)}

/* ══════════════════════════════════════════════════════════
   9 · ENGAGEMENT MODELS
══════════════════════════════════════════════════════════ */
.hx-eng{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hx-eng__card{
  background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);padding:32px 30px;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .32s cubic-bezier(.16,1,.3,1),box-shadow .32s ease,border-color .32s ease;
}
.hx-eng__card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--p),transparent);
}
.hx-eng__card:hover{transform:translateY(-6px);box-shadow:var(--hx-shadow-xl);border-color:var(--p-soft-2)}
.hx-eng__ico{
  width:48px;height:48px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;font-size:19px;
  background:var(--p-soft);color:var(--p);margin-bottom:20px;
}
.hx-eng__card h3{font-size:1.15rem;font-weight:750;letter-spacing:-.025em;color:var(--hx-ink);margin-bottom:10px}
.hx-eng__card > p{font-size:14px;line-height:1.68;color:var(--hx-ink-2);margin-bottom:20px}
.hx-eng__list{display:flex;flex-direction:column;gap:10px;flex-grow:1;margin-bottom:24px}
.hx-eng__list li{display:flex;gap:10px;align-items:flex-start;font-size:13.2px;line-height:1.5;color:var(--hx-ink-2)}
.hx-eng__list li i{font-size:9px;color:var(--p);margin-top:5px;flex-shrink:0}
.hx-eng__foot{
  font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--hx-ink-3);padding-top:16px;border-top:1px solid var(--hx-line);
}

/* ══════════════════════════════════════════════════════════
   10 · IMPACT NUMBERS
══════════════════════════════════════════════════════════ */
.hx-impact{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;border-top:1px solid var(--hx-line);border-bottom:1px solid var(--hx-line);
}
.hx-impact__cell{padding:clamp(28px,3.4vw,42px) 26px}
.hx-impact__cell + .hx-impact__cell{border-left:1px solid var(--hx-line)}
.hx-impact__val{
  font-size:clamp(2.4rem,4.6vw,3.9rem);font-weight:800;
  letter-spacing:-.055em;line-height:1;color:var(--hx-ink);margin-bottom:12px;
}
.hx-impact__val sup{font-size:.42em;color:var(--p,var(--hx-ember));vertical-align:super;margin-left:2px}
.hx-impact__lbl{
  font-family:var(--font-mono);font-size:10px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--hx-ink-3);margin-bottom:8px;
}
.hx-impact__note{font-size:12.5px;line-height:1.55;color:var(--hx-ink-2)}

/* ══════════════════════════════════════════════════════════
   11 · SOURCES — consulting-grade citation apparatus
══════════════════════════════════════════════════════════ */
.hx-sources{
  border:1px solid var(--hx-line);border-radius:var(--hx-r-lg);
  background:var(--hx-card);padding:clamp(26px,3vw,38px);
}
.hx-sources h3{
  font-family:var(--font-mono);font-size:10.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--hx-ink-3);
  margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--hx-line);
}
.hx-sources ol{list-style:none;counter-reset:src;display:grid;grid-template-columns:repeat(2,1fr);gap:14px 34px}
.hx-sources li{
  counter-increment:src;position:relative;padding-left:30px;
  font-size:13px;line-height:1.6;color:var(--hx-ink-2);
}
.hx-sources li::before{
  content:counter(src);position:absolute;left:0;top:1px;
  width:20px;height:20px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  background:rgba(194,65,12,.08);color:var(--hx-ember);
}
.hx-sources li b{color:var(--hx-ink);font-weight:700}
.hx-sources li a{color:var(--hx-ember);text-decoration:underline;text-underline-offset:2px}
.hx-sources__note{
  margin-top:22px;padding-top:18px;border-top:1px solid var(--hx-line);
  font-size:12.5px;line-height:1.65;color:var(--hx-ink-3);
}
.hx-sources li:target{background:rgba(194,65,12,.06);border-radius:6px}

/* ══════════════════════════════════════════════════════════
   12 · CLOSING CTA (light — the dark resumes at the footer)
══════════════════════════════════════════════════════════ */
.hx-close{
  position:relative;overflow:hidden;
  border-radius:var(--hx-r-xl);
  background:linear-gradient(135deg,#FFF6E7 0%,#FFEDD9 45%,#FDE7E4 100%);
  border:1px solid #F4DFC2;
  padding:clamp(48px,6.5vw,86px) clamp(28px,5vw,64px);
  text-align:center;
  box-shadow:var(--hx-shadow-lg);
}
.hx-close::before{
  content:'';position:absolute;inset:-30%;pointer-events:none;opacity:.55;filter:blur(60px);
  background:
    radial-gradient(30% 40% at 16% 20%,#FFD59A,transparent 70%),
    radial-gradient(28% 38% at 86% 26%,#FFC9C0,transparent 70%),
    radial-gradient(30% 40% at 62% 92%,#FDE9B8,transparent 70%);
}
.hx-close > *{position:relative;z-index:1}
.hx-close h2{
  font-size:clamp(2rem,4.6vw,3.5rem);font-weight:800;
  letter-spacing:-.05em;line-height:1.04;color:#231E14;margin-bottom:18px;
}
.hx-close h2 em{
  font-style:italic;font-family:'Fraunces',var(--font-display);font-weight:600;
  background:linear-gradient(180deg,#E0821A,#C2410C);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  padding-bottom:.08em;
}
.hx-close p{font-size:16.5px;line-height:1.7;color:#5B4E3C;max-width:52ch;margin:0 auto 32px}
.hx-close__actions{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.hx-close__meta{
  margin-top:34px;padding-top:26px;border-top:1px solid rgba(194,65,12,.14);
  display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:wrap;
  font-family:var(--font-mono);font-size:10.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:#8A7458;
}
.hx-close__meta span{display:inline-flex;align-items:center;gap:8px}
.hx-close__meta i{color:var(--hx-ember);font-size:11px}

/* ══════════════════════════════════════════════════════════
   13 · Reveal motion
══════════════════════════════════════════════════════════ */
.hx-rev{
  opacity:0;transform:translateY(26px);
  transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);
}
.hx-rev.in{opacity:1;transform:none}

/* ══════════════════════════════════════════════════════════
   14 · Responsive
══════════════════════════════════════════════════════════ */
/* Narrow three-column band: columns get tight, back-face copy wraps
   further, so give the flip cards more room rather than clipping. */
@media(min-width:1101px) and (max-width:1340px){
  .flash{height:548px}
}
@media(max-width:1100px){
  .hx-flash-grid{grid-template-columns:repeat(2,1fr)}
  .hx-eng{grid-template-columns:1fr}
  .hx-impact{grid-template-columns:repeat(2,1fr)}
  .hx-impact__cell:nth-child(3){border-left:none}
  .hx-impact__cell:nth-child(n+3){border-top:1px solid var(--hx-line)}
}
@media(max-width:1024px){
  .hx-hero{min-height:auto;padding:132px 0 64px}
  .hx-hero__grid{grid-template-columns:1fr;gap:52px}
  .hx-hero__frame{transform:none}
  .hx-hero__stage:hover .hx-hero__frame{transform:translateY(-4px)}
  .hx-chip-float--a{left:-2%}
  .hx-chip-float--b{right:-2%}
  .hx-pov{grid-template-columns:1fr;gap:40px}
  .hx-head--split{grid-template-columns:1fr;gap:22px;align-items:start}
  .spx,.hx-shop{grid-template-columns:1fr;gap:38px}
  .spx--flip .spx-media{order:1}
  .spx--flip .spx-copy{order:2}
  .spx-media::before{display:none}
  .hx-sources ol{grid-template-columns:1fr}
}
@media(max-width:760px){
  .hx-wrap{padding-inline:22px}
  .hx-hero{padding:118px 0 56px}
  .hx-hero__rail{grid-template-columns:repeat(2,1fr);row-gap:0}
  .hx-rail__item{padding:20px 14px 16px}
  .hx-rail__item + .hx-rail__item{border-left:none}
  .hx-rail__item:nth-child(even){border-left:1px solid rgba(255,255,255,.08)}
  .hx-rail__item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.08)}
  .hx-chip-float{display:none}
  .hx-flash-grid{grid-template-columns:1fr;gap:16px}
  .flash{height:470px}
  .hx-impact{grid-template-columns:1fr}
  .hx-impact__cell{border-left:none !important}
  .hx-impact__cell + .hx-impact__cell{border-top:1px solid var(--hx-line)}
  .hx-steps{grid-template-columns:1fr}
  .spx-stats{grid-template-columns:1fr}
  .hx-ev{grid-template-columns:1fr;gap:10px}
  .hx-close__meta{gap:16px;flex-direction:column}
}

/* ══════════════════════════════════════════════════════════
   15 · Reduced motion — final word
══════════════════════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  .hx-hero__glow,.hx-hero__h1 em,.hx-hero__dot,
  .hx-chip-float,.hx-marquee__track{animation:none !important}
  .hx-marquee__track{width:100%;justify-content:flex-start;flex-wrap:wrap;row-gap:10px}
  .hx-hero__tag,.hx-hero__h1,.hx-hero__sub,.hx-hero__cta,
  .hx-hero__stage,.hx-hero__rail{animation:none !important;opacity:1;transform:none}
  .flash-inner{transition-duration:.001s}
  .hx-rev{opacity:1 !important;transform:none !important}
  .hx-hero__frame{transform:none}
  *{scroll-behavior:auto}
}


/* ══════════════════════════════════════════════════════════
   FOUNDERS PANEL — real people, in place of stock imagery.
   Sits in the media column of the "AI shop" band and keeps the
   caption + credit pattern the rest of the page's imagery uses.
══════════════════════════════════════════════════════════ */
.hx-people{
  background:var(--hx-card);
  border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);
  padding:22px 22px 0;
  box-shadow:var(--hx-shadow-lg);
  overflow:hidden;
}
.hx-people__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.hx-person{margin:0;text-align:center}
.hx-person img{
  width:100%;height:auto;aspect-ratio:1/1.15;object-fit:cover;object-position:center 35%;
  display:block;border-radius:16px;background:#EFE9DE;
  border:1px solid rgba(27,24,17,.09);
  box-shadow:0 12px 26px -14px rgba(27,24,17,.55);
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.hx-person:hover img{transform:translateY(-4px)}
.hx-person figcaption{padding-top:12px}
.hx-person b{
  display:block;font-size:13.5px;font-weight:750;letter-spacing:-.02em;
  color:var(--hx-ink);margin-bottom:3px;
}
.hx-person span{
  display:block;font-family:var(--font-mono);font-size:8.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--hx-ember);line-height:1.4;
}
.hx-people__cap{
  margin:20px -22px 0;padding:16px 22px;
  border-top:1px solid var(--hx-line);
  background:linear-gradient(180deg,rgba(194,65,12,.035),transparent);
}
.hx-people__cap b{
  display:flex;align-items:center;gap:9px;
  font-size:14px;font-weight:700;letter-spacing:-.015em;color:var(--hx-ink);margin-bottom:5px;
}
.hx-people__cap b i{font-size:11px;color:var(--hx-ember)}
.hx-people__cap span{
  display:block;font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--hx-ink-3);
}
.hx-people__cap span::before{
  content:'';display:inline-block;width:14px;height:1px;
  background:rgba(194,65,12,.6);vertical-align:middle;margin-right:8px;
}
@media(max-width:520px){
  .hx-people__grid{gap:10px}
  .hx-person b{font-size:12px}
  .hx-person span{font-size:8px;letter-spacing:.09em}
}


/* ══════════════════════════════════════════════════════════
   MODEL FIGURE — a light diagram, so the caption sits below
   the image rather than in a scrim over it (the .hx-figure
   overlay is built for dark cinematic frames and would bury
   the bottom row of the chart).
══════════════════════════════════════════════════════════ */
.hx-model{
  background:var(--hx-card);
  border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);
  overflow:hidden;
  box-shadow:var(--hx-shadow-lg);
  margin:0 0 clamp(32px,4vw,52px);
  transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease;
}
.hx-model:hover{transform:translateY(-3px);box-shadow:var(--hx-shadow-xl)}
.hx-model a{display:block;position:relative}
.hx-model img{width:100%;height:auto;display:block}
.hx-model__zoom{
  position:absolute;top:16px;right:16px;
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:999px;
  font-family:var(--font-mono);font-size:9.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;
  background:rgba(12,15,23,.82);color:#F6F2E9;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.16);
  opacity:0;transition:opacity .3s ease;
}
.hx-model:hover .hx-model__zoom{opacity:1}
.hx-model__zoom i{font-size:10px;color:var(--hx-gold)}
.hx-model figcaption{
  padding:18px 24px;
  border-top:1px solid var(--hx-line);
  background:linear-gradient(180deg,rgba(194,65,12,.035),transparent);
}
.hx-model figcaption b{
  display:flex;align-items:center;gap:9px;
  font-size:14.5px;font-weight:700;letter-spacing:-.015em;
  color:var(--hx-ink);margin-bottom:5px;
}
.hx-model figcaption b i{font-size:11px;color:var(--hx-ember)}
.hx-model figcaption span{
  display:block;font-family:var(--font-mono);font-size:9.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--hx-ink-3);
}
.hx-model figcaption span::before{
  content:'';display:inline-block;width:14px;height:1px;
  background:rgba(194,65,12,.6);vertical-align:middle;margin-right:8px;
}
/* Four steps read as a single row under the model */
.hx-steps--row{grid-template-columns:repeat(4,1fr);margin-top:0}
@media(max-width:900px){.hx-steps--row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.hx-steps--row{grid-template-columns:1fr}}


/* ══════════════════════════════════════════════════════════
   FORMS — careers applications and feedback submission
══════════════════════════════════════════════════════════ */
.hx-form{
  background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);padding:clamp(26px,3.5vw,44px);
  box-shadow:var(--hx-shadow-lg);
}
.hx-form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hx-form .form-group{margin-bottom:20px}
.hx-form label{
  display:block;font-size:12.5px;font-weight:650;color:var(--hx-ink-2);
  margin-bottom:7px;letter-spacing:-.01em;
}
.hx-form label .opt{font-weight:500;color:var(--hx-ink-3)}
.hx-form input[type=text],.hx-form input[type=email],.hx-form input[type=tel],
.hx-form input[type=url],.hx-form select,.hx-form textarea{
  width:100%;padding:13px 16px;
  background:#FFFDF8;border:1px solid var(--hx-line);
  border-radius:var(--hx-r-sm);
  font-family:var(--font-body);font-size:14.5px;color:var(--hx-ink);
  outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.hx-form textarea{min-height:150px;resize:vertical;line-height:1.6}
.hx-form input::placeholder,.hx-form textarea::placeholder{color:var(--hx-ink-3)}
.hx-form input:focus,.hx-form select:focus,.hx-form textarea:focus{
  border-color:var(--hx-ember);background:#fff;
  box-shadow:0 0 0 3px rgba(194,65,12,.12);
}
.hx-form [aria-invalid]{border-color:#B91C1C;box-shadow:0 0 0 3px rgba(185,28,28,.10)}
.field-error{
  margin-top:7px;font-size:12.5px;font-weight:600;color:#B91C1C;
  display:flex;align-items:center;gap:7px;
}
.field-error::before{content:'\f06a';font-family:'Font Awesome 6 Free';font-weight:900;font-size:11px}
.hx-form input[type=file]{
  width:100%;padding:12px;font-size:13.5px;color:var(--hx-ink-2);
  background:#FFFDF8;border:1px dashed var(--hx-line-2);border-radius:var(--hx-r-sm);
}
.hx-form input[type=file]::file-selector-button{
  margin-right:14px;padding:8px 16px;border:none;border-radius:8px;
  background:var(--hx-ink);color:#FBF7F0;font-weight:650;font-size:13px;cursor:pointer;
}
.hx-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.hx-consent{display:flex;gap:12px;align-items:flex-start;margin-bottom:22px}
.hx-consent input{margin-top:3px;width:17px;height:17px;accent-color:var(--hx-ember);flex-shrink:0}
.hx-consent label{font-size:13.2px;line-height:1.6;color:var(--hx-ink-2);margin:0;font-weight:500}

.form-banner{
  display:none;margin-bottom:20px;padding:14px 18px;border-radius:var(--hx-r-sm);
  font-size:14px;font-weight:600;line-height:1.55;
}
.form-banner[data-kind=error]{background:rgba(185,28,28,.07);border:1px solid rgba(185,28,28,.24);color:#991B1B}

.form-done{
  background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);padding:clamp(36px,5vw,56px);text-align:center;
  box-shadow:var(--hx-shadow-lg);
}
.form-done > i{font-size:38px;color:#047857;margin-bottom:18px;display:block}
.form-done h3{font-size:1.5rem;font-weight:800;letter-spacing:-.035em;color:var(--hx-ink);margin-bottom:10px}
.form-done p{font-size:15.5px;line-height:1.7;color:var(--hx-ink-2);max-width:46ch;margin:0 auto}
.form-done__ref{
  display:inline-block;margin-top:20px;padding:7px 15px;border-radius:999px;
  font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;background:rgba(27,24,17,.045);color:var(--hx-ink-3);
}

/* Star rating */
.rating{display:flex;gap:8px;margin-bottom:4px}
.rating-star{
  font-size:24px;color:var(--hx-line-2);cursor:pointer;background:none;border:none;padding:0;
  transition:color .18s ease,transform .18s cubic-bezier(.16,1,.3,1);
}
.rating-star:hover{transform:scale(1.15)}
.rating-star.is-on{color:var(--hx-gold)}

/* Application-type picker cards */
.hx-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:clamp(34px,4vw,54px)}
.hx-pick__card{
  text-align:left;background:var(--hx-card);border:1px solid var(--hx-line);
  border-radius:var(--hx-r-lg);padding:26px 24px;cursor:pointer;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease;
}
.hx-pick__card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--p),transparent);
}
.hx-pick__card:hover{transform:translateY(-4px);box-shadow:var(--hx-shadow-lg);border-color:var(--p-soft-2)}
.hx-pick__card.is-picked{border-color:var(--p);box-shadow:0 0 0 2px var(--p-soft),var(--hx-shadow-lg)}
.hx-pick__ico{
  width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:17px;background:var(--p-soft);color:var(--p);margin-bottom:18px;
}
.hx-pick__card h3{font-size:1.08rem;font-weight:750;letter-spacing:-.025em;color:var(--hx-ink);margin-bottom:8px}
.hx-pick__card p{font-size:13.5px;line-height:1.6;color:var(--hx-ink-2);flex-grow:1}
.hx-pick__go{
  display:inline-flex;align-items:center;gap:8px;margin-top:18px;
  font-family:var(--font-mono);font-size:9.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--p);
}
.hx-pick__card.is-picked .hx-pick__go::after{content:' — selected'}

@media(max-width:820px){
  .hx-pick{grid-template-columns:1fr}
  .hx-form__row{grid-template-columns:1fr;gap:0}
}


/* ══════════════════════════════════════════════════════════
   PLATFORM GALLERY — first-party slides shown as they are
   Dark, text-bearing figures on the light ground. They carry
   their own typography, so nothing is overlaid on them; the
   caption and credit sit beneath, as with every other figure.
══════════════════════════════════════════════════════════ */
.hx-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.hx-plate{
  margin:0;background:var(--hx-card);
  border:1px solid var(--hx-line);border-radius:var(--hx-r-lg);
  overflow:hidden;box-shadow:var(--hx-shadow-lg);
  transition:transform .32s cubic-bezier(.16,1,.3,1),box-shadow .32s ease,border-color .32s ease;
}
.hx-plate:hover{transform:translateY(-4px);box-shadow:var(--hx-shadow-xl);border-color:var(--hx-line-2)}
.hx-plate a{display:block;position:relative}
.hx-plate img{width:100%;height:auto;display:block}
.hx-plate__zoom{
  position:absolute;top:14px;right:14px;
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 13px;border-radius:999px;
  font-family:var(--font-mono);font-size:9px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;
  background:rgba(12,8,3,.82);color:#F6F2E9;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1px solid rgba(245,166,35,.22);
  opacity:0;transition:opacity .3s ease;
}
.hx-plate:hover .hx-plate__zoom{opacity:1}
.hx-plate figcaption{padding:18px 22px;border-top:1px solid var(--hx-line)}
.hx-plate figcaption b{
  display:block;font-size:14.5px;font-weight:750;letter-spacing:-.02em;
  color:var(--hx-ink);margin-bottom:5px;
}
.hx-plate figcaption span{
  display:block;font-family:var(--font-mono);font-size:9px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--hx-ink-3);line-height:1.5;
}
.hx-plate figcaption span::before{
  content:'';display:inline-block;width:13px;height:1px;
  background:rgba(194,65,12,.6);vertical-align:middle;margin-right:8px;
}
.hx-gallery__note{
  margin-top:26px;padding-top:18px;border-top:1px solid var(--hx-line);
  font-size:12.5px;line-height:1.65;color:var(--hx-ink-3);max-width:78ch;
}
@media(max-width:860px){.hx-gallery{grid-template-columns:1fr}}