/* ==========================================================================
   AARLEEZ — Botanical ingredients from India
   Design system: "Indigo & Marigold" — the portfolio palette, on the web
   ========================================================================== */

/* ---------- Tokens ---------- */
:root{
  --ink:      #1C2440;
  --forest:   #1E2A5A;   /* indigo ground */
  --forest-2: #151F47;   /* deeper indigo */
  --moss:     #5B6BB0;
  --saffron:  #C97F14;   /* marigold, deepened for text on light paper */
  --saffron-l:#F0A030;   /* marigold */
  --paper:    #F4EFE4;   /* warm ivory */
  --surface:  #FBF8F1;
  --surface-2:#EDE6D8;
  --stone:    #5E6684;
  --line:     rgba(28,36,64,.16);
  --line-soft:rgba(28,36,64,.09);
  --wash:     #F9E8CC;   /* marigold wash */

  --deep:     #151F47;
  --on-deep:  #F5F3EC;
  --btn-bg:   #1E2A5A;
  --btn-fg:   #F5F3EC;
  --btn-bd:   #1E2A5A;

  --text:     var(--ink);
  --text-mut: var(--stone);
  --bg:       var(--paper);

  --f-display:'Cormorant Garamond', 'Iowan Old Style', Georgia, serif;
  --f-sans:   'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono:   'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --wrap: 1180px;
  --gut: clamp(1.15rem, 4vw, 3rem);
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:      #EDEEF3;
    --forest:   #141B3A;
    --forest-2: #0B1022;
    --moss:     #8B9AE0;
    --saffron:  #F2AC48;
    --saffron-l:#F6C170;
    --paper:    #0F1426;
    --surface:  #171D33;
    --surface-2:#1F2745;
    --stone:    #98A0BC;
    --line:     rgba(237,238,243,.16);
    --line-soft:rgba(237,238,243,.09);
    --wash:     #22283F;
    --text:     var(--ink);
    --text-mut: var(--stone);
    --bg:       var(--paper);
    --btn-bg:#F0A030; --btn-fg:#1C2440; --btn-bd:#F0A030;
  }
}
:root[data-theme="dark"]{
  --ink:#EDEEF3; --forest:#141B3A; --forest-2:#0B1022; --moss:#8B9AE0;
  --saffron:#F2AC48; --saffron-l:#F6C170; --paper:#0F1426; --surface:#171D33;
  --surface-2:#1F2745; --stone:#98A0BC; --wash:#22283F;
  --line:rgba(237,238,243,.16); --line-soft:rgba(237,238,243,.09);
  --text:var(--ink); --text-mut:var(--stone); --bg:var(--paper);
  --btn-bg:#F0A030; --btn-fg:#1C2440; --btn-bd:#F0A030;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-sans);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;text-wrap:balance;font-weight:400}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

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

/* ---------- Type scale ---------- */
.display-xl{font-family:var(--f-display);font-size:clamp(2.9rem,7.4vw,5.4rem);line-height:1.02;letter-spacing:-.015em}
.display-l {font-family:var(--f-display);font-size:clamp(2.3rem,5vw,3.7rem);line-height:1.06;letter-spacing:-.012em}
.display-m {font-family:var(--f-display);font-size:clamp(1.75rem,3.3vw,2.6rem);line-height:1.12}
.display-s {font-family:var(--f-display);font-size:clamp(1.35rem,2.2vw,1.75rem);line-height:1.2}

.eyebrow{
  font-family:var(--f-mono);font-size:.7rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--saffron);
  display:flex;align-items:center;gap:.7rem;margin-bottom:1.1rem;
}
.eyebrow::before{content:"";width:1.9rem;height:1px;background:currentColor;flex:none}
.eyebrow.center{justify-content:center}

.lede{font-size:clamp(1.02rem,1.55vw,1.2rem);line-height:1.62;color:var(--text-mut);max-width:60ch}
.muted{color:var(--text-mut)}
.meta{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-mut)}

/* ---------- Layout ---------- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.wrap-narrow{max-width:760px;margin-inline:auto;padding-inline:var(--gut)}
.band{padding-block:clamp(3.4rem,7vw,6.2rem)}
.band-tight{padding-block:clamp(2.4rem,4.5vw,3.6rem)}
.band-dark{background:var(--forest);color:#F5F3EC}
.band-dark .lede,.band-dark .muted,.band-dark .meta{color:rgba(245,243,236,.72)}
.band-dark .eyebrow{color:var(--saffron-l)}
.band-surface{background:var(--surface)}
.stack{display:flex;flex-direction:column;gap:1.1rem}
.grid{display:grid;gap:clamp(1.1rem,2.4vw,1.9rem)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.section-head{max-width:64ch;margin-bottom:clamp(1.8rem,3.5vw,2.8rem)}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* ---------- Header ---------- */
.site-head{
  position:sticky;top:0;z-index:60;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--line-soft);
}
.head-inner{
  max-width:var(--wrap);margin-inline:auto;padding:.85rem var(--gut);
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:none}
.brand-mark{width:34px;height:34px;flex:none}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-name{
  font-family:var(--f-display);font-size:1.32rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--text);
}
.brand-sub{
  font-family:var(--f-display);font-size:.8rem;letter-spacing:.42em;
  text-transform:uppercase;color:var(--text-mut);margin-top:.3rem;
}
.nav{display:flex;align-items:center;gap:1.55rem}
.nav a{
  text-decoration:none;font-size:.875rem;font-weight:450;color:var(--text);
  padding-bottom:2px;border-bottom:1.5px solid transparent;transition:border-color .18s,color .18s;
}
.nav a:hover{border-bottom-color:var(--saffron)}
.nav a[aria-current="page"]{border-bottom-color:var(--saffron);color:var(--saffron)}
.nav a.btn{margin-left:.3rem;color:var(--btn-fg);border:1px solid var(--btn-bd)}
.nav a.btn:hover{color:#1C2440;background:var(--saffron-l);border-color:var(--saffron-l)}

.nav-toggle{
  display:none;background:none;border:1px solid var(--line);border-radius:3px;
  padding:.42rem .6rem;cursor:pointer;color:var(--text);font-family:var(--f-mono);
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--f-mono);font-size:.76rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;text-decoration:none;
  padding:.78rem 1.3rem;border-radius:2px;border:1px solid var(--btn-bd);
  background:var(--btn-bg);color:var(--btn-fg);cursor:pointer;
  transition:background .2s,color .2s,border-color .2s,transform .2s;
}
.btn:hover{background:var(--saffron-l);border-color:var(--saffron-l);color:#1C2440;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn-ghost:hover{background:var(--saffron);border-color:var(--saffron);color:#1C2440}
.btn-light{background:var(--saffron);border-color:var(--saffron);color:#1C2440}
.btn-light:hover{background:transparent;color:var(--saffron-l);border-color:var(--saffron-l)}
.btn-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.8rem}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--forest-2)}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.5;animation:drift 26s ease-in-out infinite alternate}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg, rgba(21,31,71,.62) 0%, rgba(21,31,71,.5) 45%, rgba(21,31,71,.88) 100%),
    radial-gradient(90% 70% at 12% 30%, rgba(43,58,120,.35), transparent 70%);
}
.hero-inner{
  max-width:var(--wrap);margin-inline:auto;padding:clamp(4.5rem,11vw,8.5rem) var(--gut) clamp(3.2rem,7vw,5.5rem);
  color:#F5F3EC;position:relative;
}
.hero h1{color:#F5F3EC}
.hero .lede{color:rgba(245,243,236,.82)}
.hero .eyebrow{color:var(--saffron-l)}
.hero-sm .hero-inner{padding-block:clamp(3.2rem,7vw,5rem) clamp(2.6rem,5vw,4rem)}
@keyframes drift{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(1.14) translate3d(-1.4%,-1.2%,0)}}

/* Hero credential strip */
.credstrip{
  border-top:1px solid rgba(245,243,236,.16);
  display:grid;grid-template-columns:repeat(4,1fr);
}
.credstrip div{
  padding:1.15rem var(--gut);border-left:1px solid rgba(245,243,236,.14);
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:rgba(245,243,236,.62);
}
.credstrip div:first-child{border-left:0}
.credstrip b{display:block;font-family:var(--f-sans);font-size:.98rem;font-weight:500;
  letter-spacing:0;text-transform:none;color:#F5F3EC;margin-top:.3rem}
.credstrip-wrap{max-width:var(--wrap);margin-inline:auto;position:relative}

/* ---------- Animated logo lockup (home hero) ---------- */
.lockup{display:flex;flex-direction:column;align-items:flex-start;gap:1.15rem;margin-bottom:1.6rem}
.lockup-mark{width:64px;height:64px}
.lockup-mark .draw{
  fill:none;stroke:var(--saffron-l);stroke-width:1.6;
  stroke-linecap:round;stroke-dasharray:var(--len,300);stroke-dashoffset:var(--len,300);
  animation:draw 1.5s cubic-bezier(.55,.15,.25,1) forwards;
}
.lockup-mark .draw.d2{animation-delay:.42s;stroke-width:1.9}
.lockup-mark .draw.d3{animation-delay:.78s}
@keyframes draw{to{stroke-dashoffset:0}}

.wordmark{
  font-family:var(--f-display);color:#F5F3EC;
  font-size:clamp(2.5rem,8.2vw,5rem);line-height:1;display:flex;
}
.wordmark span{
  display:inline-block;opacity:0;transform:translateY(.42em);
  letter-spacing:.22em;
  animation:letterIn .82s cubic-bezier(.22,.9,.28,1) forwards;
}
@keyframes letterIn{to{opacity:1;transform:translateY(0)}}
.wordmark span:nth-child(1){animation-delay:.55s}
.wordmark span:nth-child(2){animation-delay:.63s}
.wordmark span:nth-child(3){animation-delay:.71s}
.wordmark span:nth-child(4){animation-delay:.79s}
.wordmark span:nth-child(5){animation-delay:.87s}
.wordmark span:nth-child(6){animation-delay:.95s}
.wordmark span:nth-child(7){animation-delay:1.03s}

.wordmark-sub{
  font-family:var(--f-display);color:#F5F3EC;text-transform:uppercase;
  font-size:clamp(1rem,3.1vw,1.95rem);line-height:1;letter-spacing:.46em;
  margin-top:-.15rem;opacity:0;animation:fadeUp .9s ease 1.05s forwards;
}
.lockup-rule{
  height:1px;background:var(--saffron-l);width:100%;max-width:430px;
  transform:scaleX(0);transform-origin:left;
  animation:ruleIn 1.05s cubic-bezier(.22,.9,.28,1) 1.05s forwards;
}
@keyframes ruleIn{to{transform:scaleX(1)}}
.lockup-strap{
  font-family:var(--f-mono);font-size:clamp(.66rem,1.5vw,.8rem);letter-spacing:.34em;
  text-transform:uppercase;color:rgba(245,243,236,.8);
  opacity:0;animation:fadeUp .9s ease 1.35s forwards;
}
.fade-late{opacity:0;animation:fadeUp .9s ease 1.6s forwards}
.fade-later{opacity:0;animation:fadeUp .9s ease 1.85s forwards}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,.9,.28,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- Division cards ---------- */
.division{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:3px;
  background:var(--surface);display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:border-color .25s,transform .25s;
}
.division:hover{border-color:var(--saffron);transform:translateY(-3px)}
.division-media{aspect-ratio:16/10;overflow:hidden;background:
  radial-gradient(120% 110% at 22% 14%, rgba(240,160,48,.30), transparent 62%),
  linear-gradient(152deg,#2B3A78 0%,#1E2A5A 58%,#0F1633 100%)}
.division-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.22,.9,.28,1)}
.division:hover .division-media img{transform:scale(1.05)}
.division-body{padding:clamp(1.4rem,2.6vw,2rem);display:flex;flex-direction:column;gap:.85rem;flex:1}
.division-body .arrow{
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--saffron);margin-top:auto;padding-top:.6rem;display:flex;align-items:center;gap:.5rem;
}

/* ---------- Specimen card (products) ---------- */
.specimen{
  border:1px solid var(--line);border-radius:3px;background:var(--surface);
  overflow:hidden;display:flex;flex-direction:column;
  transition:border-color .25s,transform .25s;
}
.specimen:hover{border-color:var(--saffron);transform:translateY(-3px)}
.specimen-media{aspect-ratio:4/3;overflow:hidden;position:relative;background:
  radial-gradient(120% 110% at 22% 14%, rgba(240,160,48,.30), transparent 62%),
  linear-gradient(152deg,#2B3A78 0%,#1E2A5A 58%,#0F1633 100%)}
.specimen-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.22,.9,.28,1)}
.specimen:hover .specimen-media img{transform:scale(1.04)}
.specimen-media .tag{
  position:absolute;left:0;top:0;background:var(--deep);color:var(--on-deep);
  font-family:var(--f-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.4rem .65rem;
}
.specimen-body{padding:1.35rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.specimen-body h3{font-family:var(--f-display);font-size:1.5rem;line-height:1.12}
.botanical{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;color:var(--saffron);text-transform:uppercase}
.specimen-body p{font-size:.925rem;color:var(--text-mut);line-height:1.6}

/* Spec list with dotted leaders */
.spec{display:flex;flex-direction:column;gap:.4rem;margin-top:auto;padding-top:.9rem;border-top:1px solid var(--line-soft)}
.spec div{display:flex;align-items:baseline;gap:.5rem;font-family:var(--f-mono);font-size:.73rem}
.spec dt,.spec .k{color:var(--text-mut);letter-spacing:.09em;text-transform:uppercase;flex:none}
.spec .dots{flex:1;border-bottom:1px dotted var(--line);transform:translateY(-3px)}
.spec .v{color:var(--text);font-weight:500;text-align:right;flex:none}

/* ---------- Feature row (alternating) ---------- */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.4rem);align-items:center}
.feature-media{border:1px solid var(--line);border-radius:3px;overflow:hidden;aspect-ratio:5/4;background:
  radial-gradient(120% 110% at 22% 14%, rgba(240,160,48,.30), transparent 62%),
  linear-gradient(152deg,#2B3A78 0%,#1E2A5A 58%,#0F1633 100%)}
.feature-media img{width:100%;height:100%;object-fit:cover}
.feature.flip .feature-media{order:2}
.feature + .feature{margin-top:clamp(2.6rem,6vw,4.6rem)}

/* ---------- Value cards ---------- */
.value{border-top:2px solid var(--saffron);padding-top:1.15rem;display:flex;flex-direction:column;gap:.55rem}
.value h3{font-family:var(--f-sans);font-size:1.02rem;font-weight:600;letter-spacing:-.005em}
.value p{font-size:.92rem;color:var(--text-mut);line-height:1.6}
.band-dark .value p{color:rgba(245,243,236,.7)}

/* ---------- Numbered process (a real sequence) ---------- */
.steps{counter-reset:step;display:grid;gap:0}
.step{
  counter-increment:step;display:grid;grid-template-columns:auto 1fr;gap:clamp(1rem,3vw,2.2rem);
  padding:1.6rem 0;border-top:1px solid var(--line);align-items:start;
}
.step:last-child{border-bottom:1px solid var(--line)}
.step::before{
  content:counter(step,decimal-leading-zero);
  font-family:var(--f-mono);font-size:.78rem;letter-spacing:.1em;color:var(--saffron);padding-top:.35rem;
}
.step h3{font-family:var(--f-display);font-size:1.5rem;line-height:1.15;margin-bottom:.4rem}
.step p{color:var(--text-mut);font-size:.95rem;max-width:58ch}
.band-dark .step{border-color:rgba(245,243,236,.16)}
.band-dark .step p{color:rgba(245,243,236,.72)}

/* ---------- Tables ---------- */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:3px;background:var(--surface)}
table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:640px}
thead th{
  background:var(--deep);color:var(--on-deep);text-align:left;font-family:var(--f-mono);
  font-size:.66rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:.85rem 1rem;white-space:nowrap;
}
tbody td{padding:.85rem 1rem;border-top:1px solid var(--line-soft);vertical-align:top;font-variant-numeric:tabular-nums}
tbody tr:hover{background:var(--surface-2)}
tbody td:first-child{font-weight:600}
td .sub{display:block;font-family:var(--f-mono);font-size:.68rem;color:var(--text-mut);letter-spacing:.06em;margin-top:.2rem}

/* ---------- Fact list ---------- */
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--line)}
.facts div{padding:1.05rem .2rem;border-bottom:1px solid var(--line)}
.facts dt{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mut);margin-bottom:.3rem}
.facts dd{margin:0;font-size:1rem;font-weight:500}
.band-dark .facts,.band-dark .facts div{border-color:rgba(245,243,236,.16)}

/* ---------- Pull quote band ---------- */
.quoteband{position:relative;isolation:isolate;overflow:hidden;background:var(--forest-2)}
.quoteband img.bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34;z-index:-2}
.quoteband::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(21,31,71,.72),rgba(21,31,71,.86))}
.quoteband blockquote{
  margin:0;font-family:var(--f-display);color:#F5F3EC;
  font-size:clamp(1.6rem,3.6vw,2.75rem);line-height:1.24;max-width:22ch;
}
.quoteband cite{
  display:block;margin-top:1.5rem;font-family:var(--f-mono);font-style:normal;
  font-size:.7rem;letter-spacing:.19em;text-transform:uppercase;color:var(--saffron-l);
}

/* ---------- Form ---------- */
.formcard{
  background:var(--surface);border:1px solid var(--line);border-radius:3px;
  padding:clamp(1.4rem,3.4vw,2.5rem);
}
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.15rem}
.field label{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mut)}
.field label .req{color:var(--saffron)}
.field input,.field select,.field textarea{
  font-family:var(--f-sans);font-size:.95rem;color:var(--text);
  background:var(--bg);border:1px solid var(--line);border-radius:2px;
  padding:.72rem .8rem;width:100%;transition:border-color .18s,box-shadow .18s;
}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--saffron);box-shadow:0 0 0 3px color-mix(in srgb,var(--saffron) 18%,transparent);
}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.formnote{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;color:var(--text-mut);margin-top:.9rem;line-height:1.7}

/* Contact detail sheet */
.detailsheet{border-top:1px solid var(--line)}
.detailsheet div{display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:.95rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.detailsheet dt{font-family:var(--f-mono);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mut);min-width:8.5rem}
.detailsheet dd{margin:0;font-size:.98rem;font-weight:500;word-break:break-word}
.detailsheet a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--saffron)}
.detailsheet a:hover{color:var(--saffron)}
.band-dark .detailsheet,.band-dark .detailsheet div{border-color:rgba(245,243,236,.16)}
.band-dark .detailsheet a{color:#F5F3EC}

/* ---------- CTA ---------- */
.cta{
  background:var(--deep);color:var(--on-deep);position:relative;overflow:hidden;
  border-top:1px solid rgba(240,160,48,.22);border-bottom:1px solid rgba(240,160,48,.22);
}
.cta h2{color:var(--on-deep)}
.cta .lede{color:rgba(245,243,236,.76)}
.cta .eyebrow{color:var(--saffron-l)}

/* ---------- Footer ---------- */
.site-foot{background:var(--forest-2);color:rgba(245,243,236,.78);padding-block:clamp(2.8rem,5vw,4rem) 0;font-size:.9rem}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:clamp(1.6rem,3vw,2.6rem)}
.site-foot .brand-name{color:#F5F3EC}
.site-foot .brand-sub{color:var(--saffron-l)}
.site-foot h4{font-family:var(--f-mono);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--saffron-l);margin-bottom:.95rem;font-weight:500}
.site-foot a{color:rgba(245,243,236,.78);text-decoration:none}
.site-foot a:hover{color:var(--saffron-l)}
.foot-links{display:flex;flex-direction:column;gap:.5rem}
.foot-bottom{
  margin-top:clamp(2.2rem,4vw,3.2rem);border-top:1px solid rgba(245,243,236,.16);
  padding-block:1.4rem;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.05em;
  line-height:1.9;color:rgba(245,243,236,.6);
}
.foot-bottom a{color:rgba(245,243,236,.75);border-bottom:1px solid rgba(245,243,236,.28)}

/* Hide broken-image alt text over the gradient panels */
.hero-media img,.division-media img,.specimen-media img,.feature-media img,.quoteband img{color:transparent;font-size:0}

/* ---------- Image fallback (blocked / offline images) ---------- */
.img-fallback{
  position:relative;
  background:
    radial-gradient(120% 110% at 22% 14%, rgba(240,160,48,.34), transparent 62%),
    linear-gradient(152deg, #2B3A78 0%, #1E2A5A 58%, #0F1633 100%);
}
.img-fallback::after{
  content:"";position:absolute;inset:0;opacity:.24;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 8C48 22 48 44 32 58C16 44 16 22 32 8Z' fill='none' stroke='%23E8B355' stroke-width='1.4'/%3E%3Cpath d='M32 14V54' stroke='%23E8B355' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:30%;
}
.hero-media.img-fallback::after{background-size:8rem;opacity:.16}

/* ---------- Utility ---------- */
.pill{
  display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-mono);
  font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:2px;padding:.3rem .55rem;color:var(--text-mut);
}
.band-dark .pill{border-color:rgba(245,243,236,.24);color:rgba(245,243,236,.72)}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem}
.checklist{display:flex;flex-direction:column;gap:.62rem}
.checklist li{display:grid;grid-template-columns:auto 1fr;gap:.7rem;font-size:.94rem;color:var(--text-mut);line-height:1.6}
.checklist li::before{content:"—";color:var(--saffron);font-family:var(--f-mono)}
.band-dark .checklist li{color:rgba(245,243,236,.75)}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .credstrip{grid-template-columns:repeat(2,1fr)}
  .credstrip div:nth-child(3){border-left:0}
  .credstrip div:nth-child(-n+2){border-bottom:1px solid rgba(245,243,236,.14)}
}
@media (max-width:820px){
  .nav{
    position:fixed;inset:64px 0 auto;flex-direction:column;align-items:stretch;gap:0;
    background:var(--bg);border-bottom:1px solid var(--line);padding:.5rem var(--gut) 1.2rem;
    display:none;
  }
  .nav.open{display:flex}
  .nav a{padding:.85rem 0;border-bottom:1px solid var(--line-soft)}
  .nav a:hover{border-bottom-color:var(--line-soft);color:var(--saffron)}
  .nav a.btn{margin:.9rem 0 0;justify-content:center}
  .nav-toggle{display:block}
  .g3,.g2{grid-template-columns:1fr}
  .feature{grid-template-columns:1fr}
  .feature.flip .feature-media{order:0}
  .facts{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
}
@media (max-width:560px){
  .g4{grid-template-columns:1fr}
  .credstrip{grid-template-columns:1fr}
  .credstrip div{border-left:0;border-bottom:1px solid rgba(245,243,236,.14)}
  .foot-grid{grid-template-columns:1fr}
  .detailsheet div{grid-template-columns:1fr;gap:.2rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .wordmark span,.wordmark-sub,.lockup-strap,.fade-late,.fade-later{opacity:1;transform:none}
  .lockup-mark .draw{stroke-dashoffset:0}
  .wordmark-sub{
  font-family:var(--f-display);color:#F5F3EC;text-transform:uppercase;
  font-size:clamp(1rem,3.1vw,1.95rem);line-height:1;letter-spacing:.46em;
  margin-top:-.15rem;opacity:0;animation:fadeUp .9s ease 1.05s forwards;
}
.lockup-rule{transform:scaleX(1)}
  .reveal{opacity:1;transform:none}
}

/* ---- SEO / NAP additions (Aug 2026) ---- */
.wordmark{margin:0;text-wrap:balance}
h1.lede{font-family:var(--f-sans);font-weight:400}
.foot-address{
  font-style:normal;line-height:1.65;margin:.35rem 0 0;
  color:inherit;max-width:26ch;
}
.specimen-body h3 a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s}
.specimen-body h3 a:hover{border-bottom-color:var(--saffron)}
.specimen-more{margin-top:.35rem}
.specimen-more a{
  font-family:var(--f-mono);font-size:.72rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--saffron);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s;
}
.specimen-more a:hover{border-bottom-color:var(--saffron)}

/* ---- Content expansion (Aug 2026): FAQ, related cards, article prose ---- */
.faq{
  max-width:78ch;border-top:1px solid var(--line);
}
.faq-item{
  border-bottom:1px solid var(--line);
}
.faq-item summary{
  cursor:pointer;list-style:none;padding:1.15rem 2.2rem 1.15rem 0;position:relative;
  font-family:var(--f-sans);font-weight:500;font-size:clamp(1rem,1.6vw,1.09rem);
  line-height:1.45;color:var(--text);
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"";position:absolute;right:.35rem;top:1.55rem;width:11px;height:11px;
  border-right:1.5px solid var(--saffron);border-bottom:1.5px solid var(--saffron);
  transform:rotate(45deg);transition:transform .25s ease;
}
.faq-item[open] summary::after{transform:rotate(225deg)}
.faq-item summary:hover{color:var(--saffron)}
.faq-item summary:focus-visible{outline:2px solid var(--saffron);outline-offset:3px}
.faq-item p{
  margin:0 0 1.35rem;padding-right:2.2rem;max-width:70ch;
  color:var(--text-mut);line-height:1.72;
}

.rel-grid{
  display:grid;gap:1px;background:var(--line);
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  border:1px solid var(--line);
}
.rel-card{
  background:var(--bg);padding:1.5rem 1.4rem;text-decoration:none;color:inherit;
  display:flex;flex-direction:column;gap:.4rem;transition:background .25s ease;
}
.rel-card:hover{background:var(--surface)}
.rel-card span{
  font-family:var(--f-display);font-size:1.3rem;line-height:1.2;
}
.rel-card em{
  font-style:normal;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-mut);
}
.rel-card:hover span{color:var(--saffron)}

.postmeta{
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--text-mut);margin-top:1.4rem;
}
.postlist{display:grid;gap:0;border-top:1px solid var(--line)}
.postlist a{
  display:block;text-decoration:none;color:inherit;padding:1.9rem 0;
  border-bottom:1px solid var(--line);transition:padding-left .3s ease;
}
.postlist a:hover{padding-left:.7rem}
.postlist h3{
  font-family:var(--f-display);font-weight:400;
  font-size:clamp(1.35rem,2.6vw,1.85rem);line-height:1.2;margin:.35rem 0 .5rem;
}
.postlist a:hover h3{color:var(--saffron)}
.postlist p{color:var(--text-mut);max-width:68ch;margin:0;line-height:1.7}


/* ==========================================================================
   Indigo & Marigold additions (Sept 2026)
   ========================================================================== */
h1,h2,h3,h4{font-weight:500}
.display-xl,.display-l,.display-m,.display-s{font-weight:500;letter-spacing:0}
.display-xl{line-height:1.0}
.eyebrow,.meta,.botanical,.pill,.credstrip div,.spec div,.facts dt,.detailsheet dt,.field label,.formnote,
.step::before,.specimen-media .tag,thead th,td .sub,.rel-card em,.postmeta,.lockup-strap,.foot-bottom,.site-foot h4,.nav-toggle,.specimen-more a,.division-body .arrow,.quoteband cite{font-weight:600}
.btn{font-weight:600;letter-spacing:.12em;border-radius:3px;padding:.8rem 1.35rem}
.brand-name{font-weight:600;letter-spacing:.26em}
.brand-sub{letter-spacing:.4em;color:var(--saffron)}
.nav a{font-weight:500;font-size:.92rem}
.nav a.btn{font-size:.76rem}
.lede{font-size:clamp(1.05rem,1.6vw,1.22rem)}
.value h3{font-family:var(--f-display);font-size:1.35rem;font-weight:600}
.step h3{font-weight:600}
.specimen-body h3,.rel-card span{font-weight:600}
.faq-item summary{font-weight:600}
.quoteband blockquote{font-weight:500}
.quoteband blockquote em{color:var(--saffron-l);font-style:italic}
.band-dark .eyebrow,.hero .eyebrow,.cta .eyebrow{color:var(--saffron-l)}
tbody td:first-child{color:var(--text)}
thead th{letter-spacing:.14em;font-size:.7rem}
.site-foot{background:var(--forest-2)}
.site-foot .brand-sub{color:var(--saffron-l)}
.hero-media img{opacity:.42}
.hero::after{background:linear-gradient(180deg,rgba(21,31,71,.55) 0%,rgba(21,31,71,.52) 45%,rgba(21,31,71,.9) 100%),radial-gradient(90% 70% at 12% 30%,rgba(43,58,120,.35),transparent 70%)}
.hero-dots::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(240,160,48,.18) 1px,transparent 1.5px);background-size:22px 22px;opacity:.6;mask-image:linear-gradient(90deg,transparent 40%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 40%,#000 100%)}
.credstrip b{font-family:var(--f-display);font-size:1.25rem;font-weight:600}
.lockup-mark .draw{stroke:var(--saffron-l)}
.lockup-strap{letter-spacing:.3em}

/* image cards: warmer fallback gradient */
.division-media,.specimen-media,.feature-media,.img-fallback{background:radial-gradient(120% 110% at 22% 14%,rgba(240,160,48,.32),transparent 62%),linear-gradient(152deg,#2B3A78 0%,#1E2A5A 58%,#0F1633 100%)}
.division,.specimen,.formcard,.tablewrap{border-radius:6px}
.division:hover,.specimen:hover{box-shadow:0 18px 40px -24px rgba(21,31,71,.45)}

/* reveal: stagger siblings */
.grid > .reveal:nth-child(2),.rel-grid > .reveal:nth-child(2){transition-delay:.08s}
.grid > .reveal:nth-child(3){transition-delay:.16s}
.grid > .reveal:nth-child(4){transition-delay:.24s}
.grid > .reveal:nth-child(5){transition-delay:.32s}
.reveal-left{opacity:0;transform:translateX(-22px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,.9,.28,1)}
.reveal-left.in{opacity:1;transform:none}

/* ---------- Marquee of ingredients ---------- */
.marquee{overflow:hidden;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--surface);padding:.85rem 0;position:relative}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,var(--surface),transparent)}
.marquee::after{right:0;background:linear-gradient(270deg,var(--surface),transparent)}
.marquee-track{display:flex;gap:2.6rem;width:max-content;animation:marquee 70s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track span{font-family:var(--f-display);font-size:1.15rem;font-weight:500;color:var(--text);white-space:nowrap;display:inline-flex;align-items:center;gap:2.6rem}
.marquee-track span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--saffron-l)}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- Audience cards ---------- */
.aud{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(.8rem,1.6vw,1.2rem)}
.aud a{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--saffron-l);border-radius:6px;padding:1.3rem 1.2rem 1.2rem;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:.5rem;transition:transform .3s,box-shadow .3s,border-color .3s}
.aud a:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(21,31,71,.45);border-color:var(--saffron)}
.aud b{font-family:var(--f-display);font-size:1.35rem;font-weight:600;line-height:1.1}
.aud p{font-size:.92rem;color:var(--text-mut);line-height:1.55}
.aud .arrow{margin-top:auto;padding-top:.6rem;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);font-weight:600}

/* ---------- Order journey ---------- */
.journey{display:grid;grid-template-columns:repeat(6,1fr);gap:0;position:relative;margin-top:.5rem}
.journey::before{content:"";position:absolute;left:16px;right:16px;top:17px;height:2px;background:var(--line);z-index:0}
.journey::after{content:"";position:absolute;left:16px;top:17px;height:2px;background:var(--saffron-l);width:0;z-index:0;transition:width 1.6s cubic-bezier(.22,.9,.28,1) .2s}
.journey.in::after{width:calc(100% - 32px)}
.journey > div{position:relative;z-index:1;padding:44px 1rem 0 0;opacity:0;transform:translateY(10px);transition:opacity .6s ease,transform .6s ease}
.journey.in > div{opacity:1;transform:none}
.journey.in > div:nth-child(2){transition-delay:.25s}.journey.in > div:nth-child(3){transition-delay:.5s}.journey.in > div:nth-child(4){transition-delay:.75s}.journey.in > div:nth-child(5){transition-delay:1s}.journey.in > div:nth-child(6){transition-delay:1.25s}
.journey > div::before{content:attr(data-n);position:absolute;top:0;left:0;width:34px;height:34px;border-radius:50%;background:var(--forest);color:var(--saffron-l);font-family:var(--f-display);font-weight:700;font-size:1.05rem;display:flex;align-items:center;justify-content:center;border:3px solid var(--bg)}
.journey .when{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);font-weight:600;margin-bottom:.35rem}
.journey b{display:block;font-size:1rem;font-weight:600;margin-bottom:.25rem}
.journey p{font-size:.9rem;color:var(--text-mut);line-height:1.55}
.band-dark .journey::before{background:rgba(245,243,236,.18)}
.band-dark .journey > div::before{border-color:var(--forest);background:var(--saffron-l);color:var(--forest)}
.band-dark .journey p{color:rgba(245,243,236,.72)}

/* ---------- Statement band ---------- */
.statement{background:var(--forest);color:var(--on-deep);position:relative;overflow:hidden}
.statement::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(240,160,48,.16) 1px,transparent 1.5px);background-size:22px 22px;opacity:.5;mask-image:linear-gradient(90deg,transparent 30%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000 100%)}
.statement p{position:relative;font-family:var(--f-display);font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.22;max-width:30ch;font-weight:500;color:var(--on-deep)}
.statement p em{color:var(--saffron-l)}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.stats div{background:var(--surface);padding:1.4rem 1.3rem}
.stats b{display:block;font-family:var(--f-display);font-size:clamp(1.9rem,3.4vw,2.6rem);font-weight:600;line-height:1;color:var(--forest)}
.stats small{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);font-weight:600;margin-bottom:.5rem}
.stats p{font-size:.9rem;color:var(--text-mut);margin-top:.45rem;line-height:1.5}
:root[data-theme="dark"] .stats b{color:var(--saffron-l)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .stats b{color:var(--saffron-l)}}

/* ---------- Range category list ---------- */
.cat{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:clamp(1rem,3vw,2.6rem);padding:1.7rem 0;align-items:start}
.cat:last-child{border-bottom:1px solid var(--line)}
.cat h3{font-family:var(--f-display);font-size:1.55rem;font-weight:600;line-height:1.15}
.cat .sub{font-size:.92rem;color:var(--text-mut);margin-top:.45rem;line-height:1.55}
.cat .count{display:inline-block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);font-weight:600;margin-top:.6rem}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chips span{font-size:.86rem;padding:.32rem .65rem;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text);transition:border-color .2s,background .2s}
.chips span:hover{border-color:var(--saffron);background:var(--wash)}
.chips a{font-size:.86rem;padding:.32rem .65rem;border:1px solid var(--saffron);border-radius:999px;background:var(--wash);color:var(--text);text-decoration:none;font-weight:600}

/* ---------- Portfolio promo ---------- */
.promo{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;background:var(--forest);color:var(--on-deep);border-radius:8px;overflow:hidden;position:relative}
.promo::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(240,160,48,.18) 1px,transparent 1.5px);background-size:22px 22px;opacity:.5;mask-image:linear-gradient(90deg,transparent 45%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 45%,#000 100%)}
.promo > div{position:relative;padding:clamp(1.6rem,3.5vw,2.8rem)}
.promo h2{color:var(--on-deep)}
.promo .lede{color:rgba(245,243,236,.78)}
.promo .eyebrow{color:var(--saffron-l)}
.promo-pages{position:relative;display:flex;gap:.8rem;justify-content:center;align-items:flex-end;padding:2rem 1.5rem;min-height:260px}
.promo-pages img{width:34%;border-radius:4px;box-shadow:0 24px 50px -22px rgba(0,0,0,.7);transition:transform .5s cubic-bezier(.22,.9,.28,1)}
.promo-pages img:nth-child(1){transform:rotate(-6deg) translateY(10px)}
.promo-pages img:nth-child(3){transform:rotate(6deg) translateY(10px)}
.promo:hover .promo-pages img:nth-child(1){transform:rotate(-9deg) translateY(4px)}
.promo:hover .promo-pages img:nth-child(3){transform:rotate(9deg) translateY(4px)}
.promo:hover .promo-pages img:nth-child(2){transform:translateY(-8px)}

/* Feature image: soft indigo frame + hover */
.feature-media{border-radius:8px;box-shadow:0 30px 60px -36px rgba(21,31,71,.5)}
.feature-media img{transition:transform 1.2s cubic-bezier(.22,.9,.28,1)}
.feature:hover .feature-media img{transform:scale(1.04)}

/* Buttons: marigold primary in the hero and CTA bands */
.btn-light{background:var(--saffron-l);border-color:var(--saffron-l);color:#1C2440}
.btn-light:hover{background:#F6C170;border-color:#F6C170;color:#1C2440}
.btn-ghost{color:var(--text)}
.btn-ghost:hover{background:var(--saffron-l);border-color:var(--saffron-l);color:#1C2440}
.hero .btn-ghost,.cta .btn-ghost,.band-dark .btn-ghost{color:var(--on-deep);border-color:rgba(245,243,236,.35)}

/* Product hero: gold rule */
.hero-inner .eyebrow::before{background:var(--saffron-l)}

@media (max-width:1000px){.aud{grid-template-columns:repeat(2,1fr)}.journey{grid-template-columns:repeat(3,1fr)}.journey::before,.journey::after{display:none}.stats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:820px){.aud{grid-template-columns:1fr 1fr}.cat{grid-template-columns:1fr}.promo{grid-template-columns:1fr}.promo-pages{min-height:0;padding:0 1.5rem 1.6rem}}
@media (max-width:560px){.aud,.journey,.stats{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none}.journey > div{opacity:1;transform:none}.journey::after{width:calc(100% - 32px)}}

.promo .btn-ghost{color:var(--on-deep);border-color:rgba(245,243,236,.35)}
.promo .btn-ghost:hover{color:#1C2440}

/* ---------- Split hero (home) ---------- */
.hero-split{background:var(--forest-2);position:relative;isolation:isolate;overflow:hidden}
.hero-split::before{content:"";position:absolute;inset:0;z-index:0;background-image:radial-gradient(rgba(240,160,48,.16) 1px,transparent 1.5px);background-size:22px 22px;opacity:.55;mask-image:linear-gradient(90deg,transparent 35%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 100%)}
.hero-split::after{content:"";position:absolute;inset:auto;z-index:0;background:none;right:-140px;top:-140px;left:auto;bottom:auto;width:520px;height:520px;border-radius:50%;border:1px solid rgba(240,160,48,.3)}
.hero-split .hero-inner{position:relative;z-index:1}
.hero-split .hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;padding-top:clamp(3.2rem,7vw,5.5rem);padding-bottom:clamp(3rem,6vw,5rem)}
.hero-art{position:relative;aspect-ratio:1/1;max-width:560px;margin-left:auto;width:100%}
.hero-art img{position:absolute;object-fit:cover;border-radius:10px;box-shadow:0 40px 80px -30px rgba(0,0,0,.75)}
.hero-art .a1{left:0;top:0;width:78%;height:78%;animation:floatA 9s ease-in-out infinite}
.hero-art .a2{right:0;bottom:0;width:52%;height:52%;border:4px solid var(--forest-2);animation:floatB 11s ease-in-out infinite}
.hero-art .frame{position:absolute;left:6%;top:6%;width:78%;height:78%;border:1.5px solid var(--saffron-l);border-radius:10px;opacity:.75;animation:floatA 9s ease-in-out infinite .4s}
.hero-art .badge{position:absolute;left:-14px;bottom:14%;background:var(--saffron-l);color:#1C2440;border-radius:6px;padding:.7rem .95rem;box-shadow:0 20px 40px -18px rgba(0,0,0,.6);animation:floatB 11s ease-in-out infinite .6s}
.hero-art .badge b{display:block;font-family:var(--f-display);font-size:1.5rem;font-weight:700;line-height:1}
.hero-art .badge small{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-top:.25rem}
@keyframes floatA{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes floatB{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.hero-split .fade-late{opacity:0;animation:fadeUp .9s ease .9s forwards}
.hero-split .fade-later{opacity:0;animation:fadeUp .9s ease 1.15s forwards}
.hero-split .hero-art{opacity:0;animation:fadeUp 1.1s ease .5s forwards}
.hero-split .credstrip-wrap{position:relative;z-index:1}
@media (max-width:900px){.hero-split .hero-inner{grid-template-columns:1fr}.hero-art{max-width:420px;margin:0 auto}}
@media (prefers-reduced-motion:reduce){.hero-art img,.hero-art .frame,.hero-art .badge{animation:none}.hero-split .fade-late,.hero-split .fade-later,.hero-split .hero-art{opacity:1}}
/* stronger photos on inner-page heroes */
.hero-sm .hero-media img{opacity:.55}
.hero-sm::after{background:linear-gradient(180deg,rgba(21,31,71,.55) 0%,rgba(21,31,71,.62) 50%,rgba(21,31,71,.92) 100%)}
.hero-sm .hero-inner{padding-block:clamp(4rem,9vw,6.5rem) clamp(3rem,6vw,4.5rem)}

/* checklist: block layout so inline <em> never becomes a grid cell */
.checklist li{display:block;position:relative;padding-left:1.5rem}
.checklist li::before{position:absolute;left:0;top:0}
.checklist li em{font-style:italic}
/* origin strip */
.origin{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;align-items:center;font-size:.9rem;color:var(--text-mut);margin-top:1.2rem}
.origin span{display:inline-flex;align-items:center;gap:.5rem}
.origin span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--saffron-l)}
.hero .origin,.band-dark .origin{color:rgba(245,243,236,.78)}