/* ==========================================================================
   Iberian Olive — Spanish olive oil trading
   Base · components · sections · responsive
   ========================================================================== */

/* Self-hosted Google Fonts (SIL Open Font License) — latin + latin-ext only. */
/* Cormorant Garamond 500 italic — latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-italic-latin-ext-4f7084.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Cormorant Garamond 500 italic — latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-italic-latin-5d13e7.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Cormorant Garamond 500 normal — latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-ext-907682.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Cormorant Garamond 500 normal — latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-2fed1d.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Cormorant Garamond 600 normal — latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-ext-907682.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Cormorant Garamond 600 normal — latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-2fed1d.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Cormorant Garamond 700 normal — latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-ext-907682.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Cormorant Garamond 700 normal — latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/cormorant-garamond-normal-latin-2fed1d.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Inter 400 normal — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-ext-395290.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Inter 400 normal — latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-567244.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Inter 500 normal — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-ext-395290.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Inter 500 normal — latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-567244.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Inter 600 normal — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-ext-395290.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Inter 600 normal — latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-567244.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Inter 700 normal — latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-ext-395290.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Inter 700 normal — latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/inter-normal-latin-567244.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --black:      #080907;
  --near-black: #0e0f0b;
  --olive-950:  #161a10;
  --olive-900:  #1f2619;
  --olive-800:  #2e3821;
  --olive-700:  #42502f;
  --olive-600:  #56663d;
  --olive-500:  #728554;
  --olive-300:  #a4b07c;
  --cream:      #f5f0e3;
  --cream-2:    #ede5ce;
  --white:      #fdfcf8;
  --gold:       #c8a55c;
  --gold-soft:  #e2cfa0;
  --ink:        #141510;

  --text-muted:       rgba(20,21,16,.68);
  --text-muted-dark:  rgba(245,240,227,.72);
  --line-dark:        rgba(20,21,16,.12);
  --line-light:       rgba(245,240,227,.12);

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --ease:      cubic-bezier(.16,.84,.44,1);
  --ease-soft: cubic-bezier(.22,1,.36,1);
  --ease-expo: cubic-bezier(.87,0,.13,1);
  --ease-back: cubic-bezier(.34,1.56,.64,1);

  --gutter: 6vw;
  --nav-h: 76px;
}

/* ==========================================================================
   Base
   ========================================================================== */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:var(--nav-h); -webkit-text-size-adjust:100%; overflow-x:clip; }
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.menu-open { overflow:hidden; }
img { max-width:100%; display:block; height:auto; }
a { color:inherit; text-decoration:none; }
ul,ol { margin:0; padding:0; list-style:none; }
button { font-family:inherit; cursor:pointer; }
input,select,textarea { font:inherit; }
section { position:relative; }
em { font-style:italic; font-family:var(--font-display); }
table { border-collapse:collapse; width:100%; }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:600; margin:0; letter-spacing:-.01em; line-height:1.1; }
p { margin:0; }
::selection { background:var(--olive-700); color:var(--cream); }

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

.skip-link {
  position:absolute; left:1rem; top:-100px; z-index:10001;
  background:var(--gold); color:var(--ink); padding:.7rem 1rem; font-weight:600; font-size:.85rem;
}
.skip-link:focus { top:1rem; }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after {
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}

/* ==========================================================================
   Scroll progress
   ========================================================================== */
#scrollProgress {
  position:fixed; top:0; left:0; right:0; z-index:1300; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--olive-500));
  transform-origin:left; transform:scaleX(0); pointer-events:none;
}

/* ==========================================================================
   Typography
   ========================================================================== */
.section-intro { max-width:880px; padding:calc(5.5rem + 2vw) var(--gutter) 3rem; }
.section-intro.light { color:var(--cream); }

.tag {
  display:inline-flex; align-items:center; gap:.7em;
  font-family:var(--font-body); font-size:.72rem; letter-spacing:.24em; font-weight:600;
  color:var(--olive-600); margin:0 0 1.4rem; text-transform:uppercase;
}
.tag::before {
  content:''; width:28px; height:1px; background:var(--gold); flex-shrink:0;
  transform:scaleX(0); transform-origin:left; transition:transform .7s var(--ease-soft) .1s;
}
.tag.is-visible::before, html:not(.js) .tag::before { transform:scaleX(1); }
.light .tag, .products .tag, .private-label .tag, .process .tag, .market .tag, .final-cta .tag { color:var(--gold-soft); }

.display-lg {
  font-size:clamp(2.3rem,4.8vw,4.6rem); line-height:1; font-weight:700;
  text-transform:uppercase; letter-spacing:-.02em;
}
.display-lg em, .display-xl em, .display-md em { text-transform:none; font-weight:500; letter-spacing:-.01em; }
h1, h2, h3, .stat-val, .step-num, .ab-num { font-variant-numeric:lining-nums; font-feature-settings:"lnum" 1; }
/* Two-column sections get a slightly smaller display size so headlines break cleanly */
.about-text .display-lg, .bulk-intro .display-lg, .quality-intro .display-lg, .docs-grid .display-lg, .contact-intro .display-lg {
  font-size:clamp(2.1rem,3.6vw,3.6rem);
}
.display-lg em { color:var(--olive-700); }
.light .display-lg em, .products .display-lg em, .private-label .display-lg em, .process .display-lg em { color:var(--gold-soft); }
.display-md { font-size:clamp(1.9rem,3.4vw,3rem); font-weight:600; line-height:1.05; }
.display-xl {
  font-size:clamp(2.8rem,7.5vw,7rem); line-height:.95; font-weight:700;
  text-transform:uppercase; letter-spacing:-.025em; color:var(--cream);
}
.display-xl em { color:var(--gold-soft); }

.lead {
  max-width:580px; font-size:clamp(1rem,1.3vw,1.12rem); line-height:1.65;
  color:var(--text-muted); margin-top:1.5rem;
}
.lead strong { color:var(--ink); font-weight:600; }
.light .lead, .products .lead, .private-label .lead { color:var(--text-muted-dark); }

.text-link {
  font-size:.78rem; letter-spacing:.14em; font-weight:600; text-transform:uppercase;
  color:var(--gold-soft); border-bottom:1px solid rgba(226,207,160,.4); padding-bottom:.15rem;
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.text-link:hover { color:var(--cream); border-color:var(--cream); }

.table-note { font-size:.8rem; color:var(--text-muted); margin-top:1rem; line-height:1.55; max-width:560px; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:1.05rem 2rem; min-height:48px;
  font-family:var(--font-body); font-size:.74rem; letter-spacing:.16em; font-weight:600;
  text-transform:uppercase; white-space:nowrap;
  border-radius:1px; border:1px solid transparent;
  transition:transform .35s var(--ease), background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.btn .arrow { display:inline-block; transition:transform .4s var(--ease); }
.btn:hover .arrow { transform:translateX(6px); }

.btn-solid { background:var(--ink); color:var(--cream); }
.btn-solid:hover { background:var(--olive-700); }
.btn-solid.btn-on-dark { background:var(--gold); color:var(--ink); }
.btn-solid.btn-on-dark:hover { background:var(--cream); }
.btn-outline { border-color:var(--ink); color:var(--ink); }
.btn-outline:hover { background:var(--ink); color:var(--cream); }
.btn-ghost { border-color:rgba(245,240,227,.5); color:var(--cream); }
.btn-ghost:hover { border-color:var(--gold); color:var(--gold-soft); }

/* ==========================================================================
   Reveal system — only hides content when JS is running
   ========================================================================== */
/* Uses the individual `translate` property so it composes with tilt/hover `transform`.
   --rd = stagger delay set by JS; it only delays the entrance, never the hover transitions. */
.js .reveal-up {
  opacity:0; translate:0 36px;
  transition:opacity .9s var(--ease-soft) var(--rd,0s), translate .9s var(--ease-soft) var(--rd,0s),
             transform .5s var(--ease-soft), background .4s var(--ease), box-shadow .5s var(--ease), color .4s var(--ease), border-color .4s var(--ease);
}
.js .reveal-up.is-visible { opacity:1; translate:0 0; }
.js .reveal-line { overflow:hidden; }
.js .reveal-line > span { display:inline-block; transform:translateY(110%); transition:transform 1s var(--ease-soft); }
.js .reveal-line.is-visible > span { transform:none; }

/* ==========================================================================
   Navbar
   ========================================================================== */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1200;
  padding:1.5rem 0;
  transition:padding .45s var(--ease), background .45s var(--ease), box-shadow .45s var(--ease);
}
.navbar.is-scrolled, .navbar.menu-open {
  padding:.8rem 0;
  background:rgba(8,9,7,.82);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 1px 0 rgba(255,255,255,.06);
}
.navbar-inner {
  max-width:1640px; margin:0 auto; padding:0 var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
}
.logo { display:flex; flex-direction:column; line-height:1; gap:.4rem; }
.logo-mark {
  font-family:var(--font-display); font-weight:700; letter-spacing:.18em; font-size:1.3rem; color:var(--cream);
  transition:letter-spacing .5s var(--ease);
}
.logo:hover .logo-mark { letter-spacing:.22em; }
.logo-sub { font-size:.62rem; letter-spacing:.2em; color:var(--gold); text-transform:uppercase; }

.nav-menu { display:flex; align-items:center; gap:2rem; }
.nav-menu a {
  font-size:.7rem; letter-spacing:.15em; font-weight:600; color:rgba(245,240,227,.8);
  position:relative; padding:.4rem 0; transition:color .3s var(--ease);
}
.nav-menu a::after {
  content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);
}
.nav-menu a:hover, .nav-menu a.is-active { color:var(--cream); }
.nav-menu a:hover::after, .nav-menu a.is-active::after { transform:scaleX(1); }

.nav-cta { border-color:rgba(245,240,227,.45); color:var(--cream); padding:.7rem 1.3rem; min-height:40px; font-size:.68rem; }
.nav-cta:hover { background:var(--gold); border-color:var(--gold); color:var(--ink); }

.nav-toggle {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; background:none; border:none; padding:10px;
}
.nav-toggle span { width:24px; height:1.5px; background:var(--cream); transition:transform .45s var(--ease), opacity .3s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

.mobile-menu {
  position:fixed; inset:0; z-index:1100; background:var(--black);
  display:flex; flex-direction:column; justify-content:center; gap:2.2rem; padding:6rem 8vw 3rem;
  visibility:hidden; transform:translateY(-100%);
  transition:transform .6s var(--ease-expo), visibility 0s linear .6s;
}
.mobile-menu[hidden] { display:none; }
.mobile-menu.is-open { visibility:visible; transform:none; transition:transform .6s var(--ease-expo), visibility 0s; }
.mobile-menu nav { display:flex; flex-direction:column; gap:.9rem; }
.mobile-menu nav a {
  font-family:var(--font-display); font-size:clamp(1.8rem,7vw,2.4rem); color:var(--cream);
  text-transform:uppercase; line-height:1.15; transition:color .3s var(--ease);
}
.mobile-menu nav a:hover { color:var(--gold); }
.mobile-menu .btn { align-self:flex-start; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
  min-height:100vh; min-height:100svh; display:flex; align-items:flex-end;
  color:var(--cream); overflow:hidden; background:var(--olive-950);
}
.hero-media { position:absolute; inset:0; overflow:hidden; transform:scale(1.08); transition:transform 6s var(--ease-soft); }
.hero.is-ready .hero-media, html:not(.js) .hero-media { transform:none; }
.hero-img {
  position:absolute; top:-6%; left:0; width:100%; height:112%; object-fit:cover; object-position:center 40%;
  will-change:transform;
}
.hero-scrim {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(8,9,7,.72) 0%, rgba(8,9,7,.35) 55%, rgba(8,9,7,.15) 100%),
    linear-gradient(180deg, rgba(8,9,7,.55) 0%, rgba(8,9,7,.1) 30%, rgba(8,9,7,.55) 70%, rgba(8,9,7,.96) 100%);
}
.hero-grain {
  position:absolute; inset:0; opacity:.05; mix-blend-mode:overlay; pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.78' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
.hero-content { position:relative; z-index:2; padding:calc(var(--nav-h) + 3rem) var(--gutter) 5.5rem; max-width:1180px; }
.eyebrow { font-size:.74rem; letter-spacing:.24em; font-weight:600; color:var(--gold-soft); margin:0 0 1.8rem; text-transform:uppercase; }

.hero-title { margin:0 0 1.8rem; }
.hero-title .line { display:block; overflow:hidden; }
.hero-title .mask {
  display:inline-block; font-size:clamp(3rem,8.6vw,8.2rem); font-weight:700; line-height:.94;
  text-transform:uppercase; letter-spacing:-.02em;
}
.hero-title .mask.italic { font-style:italic; font-weight:500; text-transform:none; letter-spacing:-.01em; color:var(--gold-soft); }
.js .hero-title .mask { transform:translateY(115%); transition:transform 1.2s var(--ease-expo); }
.js .hero.is-ready .hero-title .mask { transform:none; }
.js .hero.is-ready .hero-title .line:nth-child(2) .mask { transition-delay:.12s; }
.js .hero.is-ready .hero-title .line:nth-child(3) .mask { transition-delay:.24s; }
.hero-h1-sub {
  display:block; margin-top:1.2rem;
  font-family:var(--font-body); font-size:clamp(.8rem,1.1vw,.95rem); font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--cream);
}
.hero-subhead { max-width:620px; font-size:clamp(1rem,1.4vw,1.2rem); color:rgba(245,240,227,.86); margin:0 0 2.2rem; }
.hero-ctas { display:flex; gap:1rem; flex-wrap:wrap; }

.hero-facts {
  margin:3rem 0 0; display:grid; grid-template-columns:repeat(6, auto); gap:0; justify-content:start;
  border-top:1px solid var(--line-light);
}
.hero-facts div { padding:1.1rem 2rem 0 0; margin-right:2rem; border-right:1px solid var(--line-light); }
.hero-facts div:last-child { border-right:0; margin-right:0; }
.hero-facts dt { font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.hero-facts dd { margin:.3rem 0 0; font-size:.9rem; color:var(--cream); }

.hero-scroll {
  position:absolute; right:var(--gutter); bottom:2.4rem; z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:.6rem;
}
.hero-scroll-line { width:1px; height:56px; background:linear-gradient(180deg,var(--gold),transparent); position:relative; overflow:hidden; }
.hero-scroll-line::after {
  content:''; position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--cream);
  animation:drip 2.6s var(--ease) infinite;
}
@keyframes drip { 0%{top:-100%} 65%,100%{top:100%} }
.hero-scroll-text { writing-mode:vertical-rl; font-size:.6rem; letter-spacing:.28em; color:rgba(245,240,227,.6); }

/* ==========================================================================
   Ticker
   ========================================================================== */
.ticker { background:var(--ink); overflow:hidden; padding:1.05rem 0; border-top:1px solid rgba(255,255,255,.05); }
.ticker-inner { display:flex; align-items:center; gap:2.2rem; width:max-content; animation:ticker 36s linear infinite; }
.ticker:hover .ticker-inner { animation-play-state:paused; }
.ticker span { font-size:.7rem; letter-spacing:.22em; font-weight:600; color:rgba(245,240,227,.62); white-space:nowrap; text-transform:uppercase; }
.ticker i { color:var(--gold); font-style:normal; }
@keyframes ticker { to { transform:translateX(-50%); } }

/* ==========================================================================
   About
   ========================================================================== */
.about { background:var(--cream); padding:calc(6rem + 2vw) var(--gutter) calc(5rem + 2vw); }
.about-grid { display:grid; grid-template-columns:1fr 1.05fr; gap:6vw; align-items:center; max-width:1640px; margin:0 auto; }
.about-visual { position:relative; }
.about-img-wrap { overflow:hidden; border-radius:3px; aspect-ratio:4 / 5; background:var(--olive-900); }
.about-img { width:100%; height:112%; object-fit:cover; will-change:transform; }
.about-badge {
  position:absolute; right:-1.5rem; bottom:2.5rem;
  background:var(--ink); color:var(--cream); padding:1.2rem 1.5rem; border-radius:2px;
  display:flex; flex-direction:column; align-items:center; box-shadow:0 20px 60px rgba(8,9,7,.3);
  animation:floatBadge 5s ease-in-out infinite;
}
@keyframes floatBadge { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.ab-num { font-family:var(--font-display); font-size:2rem; font-weight:700; line-height:1; color:var(--gold); letter-spacing:.08em; }
.ab-label { font-size:.62rem; letter-spacing:.18em; color:rgba(245,240,227,.75); text-transform:uppercase; margin-top:.35rem; }

.pillars { display:grid; gap:1.4rem; margin-top:2.4rem; border-top:1px solid var(--line-dark); padding-top:2rem; }
.pillars li { display:grid; grid-template-columns:2.4rem 1fr; gap:1rem; }
.pillar-k { font-size:.7rem; letter-spacing:.16em; font-weight:700; color:var(--gold); padding-top:.3rem; }
.pillars h3 { font-size:1.35rem; margin-bottom:.3rem; }
.pillars p { font-size:.93rem; color:var(--text-muted); }

/* ==========================================================================
   Products
   ========================================================================== */
.products { background:var(--near-black); color:var(--cream); padding-bottom:calc(5rem + 2vw); }
.evoo-feature {
  display:grid; grid-template-columns:.8fr 1.2fr; margin:0 var(--gutter);
  border:1px solid var(--line-light); border-radius:3px; overflow:hidden; background:var(--ink);
}
.evoo-media { position:relative; min-height:420px; overflow:hidden; }
.evoo-media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-soft); }
.evoo-feature:hover .evoo-media img { transform:scale(1.05); }
.evoo-body { padding:clamp(2rem,4vw,3.4rem); }
.product-grade { display:block; font-size:.66rem; letter-spacing:.2em; font-weight:600; color:var(--gold-soft); text-transform:uppercase; margin-bottom:.8rem; }
.evoo-body h3 { font-size:clamp(2rem,3.2vw,3rem); font-weight:700; }
.evoo-body h3 span { font-style:italic; font-weight:500; color:var(--gold-soft); }
.evoo-def { margin-top:1rem; color:var(--text-muted-dark); max-width:560px; }
.spec-list { margin:1.8rem 0 2rem; display:grid; }
.spec-list div { display:grid; grid-template-columns:10rem 1fr; gap:1rem; padding:.7rem 0; border-top:1px solid var(--line-light); }
.spec-list dt { font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); font-weight:600; padding-top:.15rem; }
.spec-list dd { margin:0; font-size:.92rem; color:rgba(245,240,227,.88); }
.evoo-ctas { display:flex; align-items:center; gap:1.6rem; flex-wrap:wrap; }

.grades { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:1px var(--gutter) 0; background:var(--line-light); border:1px solid var(--line-light); border-top:0; }
.grade-card { background:var(--ink); padding:2.2rem 2rem; transition:background .4s var(--ease); }
.grade-card:hover { background:var(--olive-950); }
.grade-card h3 { font-size:1.6rem; margin-bottom:.8rem; }
.grade-card h3 small { font-size:.9rem; font-weight:500; font-style:italic; color:var(--gold-soft); }
.grade-card p { font-size:.9rem; color:var(--text-muted-dark); }

/* ==========================================================================
   Formats
   ========================================================================== */
.formats { background:var(--cream-2); padding-bottom:calc(5rem + 2vw); }
.formats-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:3rem; padding:0 var(--gutter); align-items:start; }
.format-table-wrap { background:var(--white); border:1px solid var(--line-dark); border-radius:3px; padding:2rem; }
.format-table caption, .compare-table caption, .limits-table caption {
  text-align:left; font-size:.7rem; letter-spacing:.18em; font-weight:600; text-transform:uppercase;
  color:var(--olive-600); padding-bottom:1rem;
}
.format-table th, .format-table td { padding:1rem .6rem; border-bottom:1px solid var(--line-dark); text-align:center; font-size:.9rem; }
.format-table thead th { font-size:.72rem; letter-spacing:.14em; font-weight:700; color:var(--ink); }
.format-table tbody th { text-align:left; font-family:var(--font-display); font-size:1.3rem; font-weight:600; }
.format-table tbody th .ficon { display:inline-block; vertical-align:middle; margin-right:.6rem; }
.yes { display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:600; color:var(--olive-700); }
.yes::before { content:''; width:.55rem; height:.55rem; border-radius:50%; background:var(--gold); }

.ficon { width:30px; height:30px; fill:none; stroke:var(--olive-600); stroke-width:1.6; stroke-linejoin:round; stroke-linecap:round; }
.ficon.lg { width:48px; height:48px; margin-bottom:1rem; }

.bulk-cards { display:grid; gap:1.2rem; }
.bulk-card { background:var(--white); border:1px solid var(--line-dark); border-radius:3px; padding:1.8rem; transition:transform .5s var(--ease-back), box-shadow .5s var(--ease); }
.bulk-card:hover { transform:translateY(-4px); box-shadow:0 20px 50px rgba(8,9,7,.08); }
.bulk-card h3 { font-family:var(--font-body); font-size:.95rem; font-weight:700; letter-spacing:.04em; margin-bottom:.5rem; }
.bulk-card p { font-size:.9rem; color:var(--text-muted); }

/* ==========================================================================
   Bulk
   ========================================================================== */
.bulk { background:var(--white); padding:calc(5.5rem + 2vw) var(--gutter); }
.bulk-grid { display:grid; grid-template-columns:1fr 1fr; gap:5vw; align-items:center; max-width:1640px; margin:0 auto; }
.checks { display:grid; gap:.7rem; margin:2rem 0 2.2rem; }
.checks li { position:relative; padding-left:1.8rem; font-size:.95rem; }
.checks li::before { content:''; position:absolute; left:0; top:.55em; width:.9rem; height:1px; background:var(--gold); }
.compare { background:var(--cream); border:1px solid var(--line-dark); border-radius:3px; padding:2rem; overflow-x:auto; }
.compare-table th, .compare-table td { padding:.9rem .7rem; border-bottom:1px solid var(--line-dark); text-align:left; font-size:.88rem; vertical-align:top; }
.compare-table thead th { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--olive-700); }
.compare-table tbody th { font-weight:600; font-size:.8rem; color:var(--olive-600); width:28%; }

/* ==========================================================================
   Private label
   ========================================================================== */
.private-label { background:var(--olive-950); color:var(--cream); padding-bottom:calc(5rem + 2vw); }
.pl-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0 var(--gutter); background:var(--line-light); border:1px solid var(--line-light); counter-reset:none; }
.pl-steps li { background:var(--olive-950); padding:2.2rem 2rem; transition:background .4s var(--ease); }
.pl-steps li:hover { background:var(--olive-900); }
.pl-steps span { font-size:.7rem; letter-spacing:.18em; font-weight:700; color:var(--gold); }
.pl-steps h3 { font-size:1.5rem; margin:.7rem 0 .5rem; }
.pl-steps p { font-size:.9rem; color:var(--text-muted-dark); }
.pl-foot { display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; margin:2.4rem var(--gutter) 0; }
.pl-foot p { color:var(--text-muted-dark); font-size:.95rem; max-width:520px; }

/* ==========================================================================
   Quality
   ========================================================================== */
.quality { background:var(--cream); padding:calc(5.5rem + 2vw) var(--gutter); }
.quality-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:5vw; max-width:1640px; margin:0 auto; align-items:start; }
.quality-notes { margin-top:2.4rem; display:grid; gap:.6rem; border-top:1px solid var(--line-dark); padding-top:1.8rem; max-width:560px; }
.quality-notes h3 { font-family:var(--font-body); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--olive-700); margin-top:.8rem; }
.quality-notes p { font-size:.92rem; color:var(--text-muted); }
.limits { background:var(--white); border:1px solid var(--line-dark); border-radius:3px; padding:2rem; overflow-x:auto; }
.limits-table th, .limits-table td { padding:.85rem .7rem; border-bottom:1px solid var(--line-dark); font-size:.9rem; }
.limits-table thead th { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--olive-700); text-align:left; }
.limits-table tbody th { text-align:left; font-weight:500; }
.limits-table td { font-variant-numeric:tabular-nums; white-space:nowrap; font-weight:600; }
.limits-table tbody tr:hover { background:var(--cream); }

/* ==========================================================================
   Process — vertical by default, horizontal pinned scroll when enabled by JS
   ========================================================================== */
.process { background:var(--black); color:var(--cream); }
.process-intro { padding-bottom:2rem; }
.process-track { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0 var(--gutter) calc(5rem + 2vw); background:var(--line-light); border:1px solid var(--line-light); }
.step { position:relative; background:var(--black); padding:2.4rem 2rem 2.6rem; overflow:hidden; }
.step-num {
  display:block; font-family:var(--font-display); font-size:4.2rem; font-weight:700; line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(200,165,92,.55); margin-bottom:1.2rem;
}
.step h3 { font-size:1.7rem; margin-bottom:.6rem; }
.step p { color:var(--text-muted-dark); font-size:.95rem; max-width:420px; }
.process-progress { display:none; }

.process.is-hscroll { height:calc(var(--steps, 6) * 70vh + 100vh); }
.process.is-hscroll .process-sticky { position:sticky; top:0; height:100vh; overflow:hidden; display:flex; flex-direction:column; }
.process.is-hscroll .process-intro { padding-top:calc(var(--nav-h) + 2.5rem); flex-shrink:0; }
.process.is-hscroll .process-track {
  display:flex; flex:1; gap:0; margin:0; background:none; border:0; padding:0 var(--gutter);
  will-change:transform;
}
.process.is-hscroll .step {
  flex:0 0 min(34vw, 500px); margin-right:2vw; border-left:1px solid var(--line-light);
  display:flex; flex-direction:column; justify-content:center; background:transparent;
}
.process.is-hscroll .step-num { font-size:clamp(5rem,9vw,8.5rem); transition:-webkit-text-stroke-color .4s var(--ease), color .4s var(--ease); }
.process.is-hscroll .step.is-current .step-num { color:rgba(200,165,92,.14); -webkit-text-stroke-color:var(--gold); }
.process.is-hscroll .process-progress { display:block; height:1px; background:var(--line-light); margin:0 var(--gutter) 2.2rem; flex-shrink:0; }
.process-progress span { display:block; height:100%; background:var(--gold); transform-origin:left; transform:scaleX(0); }

/* ==========================================================================
   Buyers
   ========================================================================== */
.buyers { background:var(--cream-2); padding-bottom:calc(5rem + 2vw); }
.buyers-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0 var(--gutter); background:var(--line-dark); border:1px solid var(--line-dark); }
.buyer { background:var(--cream-2); padding:2.4rem 2rem; position:relative; overflow:hidden; transition:color .4s var(--ease); }
.buyer::before {
  content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--olive-950),var(--olive-800));
  transform:translateY(101%); transition:transform .55s var(--ease-expo);
}
.buyer > * { position:relative; }
.buyer:hover { color:var(--cream); }
.buyer:hover::before { transform:none; }
.buyer h3 { font-size:1.55rem; margin-bottom:.6rem; }
.buyer p { font-size:.92rem; color:var(--text-muted); transition:color .4s var(--ease); }
.buyer:hover p { color:var(--text-muted-dark); }

/* ==========================================================================
   Market
   ========================================================================== */
.market { background:var(--olive-950); color:var(--cream); padding:calc(5rem + 2vw) var(--gutter); }
.market-inner { max-width:1640px; margin:0 auto; }
.market-head { max-width:760px; }
.market-lead { color:var(--text-muted-dark); margin-top:1rem; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:2.6rem; background:var(--line-light); border:1px solid var(--line-light); }
.stat { background:var(--olive-950); padding:2rem; display:flex; flex-direction:column; gap:.6rem; }
.stat-val { font-family:var(--font-display); font-size:clamp(2.4rem,4vw,3.6rem); font-weight:700; line-height:1; color:var(--gold-soft); }
.stat-lbl { font-size:.92rem; color:rgba(245,240,227,.85); }
.stat-src { font-size:.72rem; letter-spacing:.06em; color:rgba(245,240,227,.55); margin-top:auto; }
.market-src { margin-top:1.4rem; font-size:.82rem; color:rgba(245,240,227,.6); }
.market-src a { color:var(--gold-soft); border-bottom:1px solid rgba(226,207,160,.35); }
.market-src a:hover { color:var(--cream); }

/* ==========================================================================
   Documents
   ========================================================================== */
.documents { background:var(--white); padding:calc(5.5rem + 2vw) var(--gutter); }
.docs-grid { display:grid; grid-template-columns:1fr 1fr; gap:5vw; max-width:1640px; margin:0 auto; align-items:start; }
.doc-list { display:grid; border-top:1px solid var(--line-dark); }
.doc-list li { display:flex; justify-content:space-between; gap:1.5rem; padding:1.05rem 0; border-bottom:1px solid var(--line-dark); transition:padding .35s var(--ease); }
.doc-list li:hover { padding-left:.6rem; }
.doc-list strong { font-family:var(--font-display); font-size:1.25rem; font-weight:600; }
.doc-list span { font-size:.86rem; color:var(--text-muted); text-align:right; }

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq { background:var(--cream); padding:calc(5.5rem + 2vw) var(--gutter); }
.faq-inner { max-width:980px; margin:0 auto; }
.faq-list { margin-top:2.6rem; border-top:1px solid var(--line-dark); }
.faq details { border-bottom:1px solid var(--line-dark); }
.faq summary {
  list-style:none; cursor:pointer; padding:1.35rem 3rem 1.35rem 0; position:relative;
  font-family:var(--font-display); font-size:clamp(1.25rem,2vw,1.55rem); font-weight:600;
}
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after {
  content:'+'; position:absolute; right:.4rem; top:50%; transform:translateY(-50%);
  font-family:var(--font-body); font-weight:400; font-size:1.5rem; color:var(--gold); transition:transform .35s var(--ease);
}
.faq details[open] summary::after { transform:translateY(-50%) rotate(45deg); }
.faq details p { padding:0 3rem 1.6rem 0; color:var(--text-muted); max-width:780px; }

/* ==========================================================================
   Final CTA
   ========================================================================== */
.final-cta { min-height:90vh; background:var(--black); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.drop-canvas { position:absolute; inset:0; width:100%; height:100%; }
.final-cta-content { position:relative; z-index:2; text-align:center; padding:6rem var(--gutter); max-width:1000px; }
.final-cta .lead { margin:1.8rem auto 2.6rem; color:var(--text-muted-dark); }
.final-cta .hero-ctas { justify-content:center; }

/* ==========================================================================
   Contact / RFQ
   ========================================================================== */
.contact { background:var(--cream); }
.contact-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:5vw; padding:calc(5.5rem + 2vw) var(--gutter) calc(5rem + 2vw); max-width:1640px; margin:0 auto; }
.contact-intro { position:sticky; top:calc(var(--nav-h) + 1.5rem); align-self:start; }
.contact-info { display:grid; gap:1.4rem; margin-top:2.4rem; }
.contact-info span { font-size:.66rem; letter-spacing:.18em; color:var(--olive-600); font-weight:700; }
.contact-info p { margin-top:.3rem; font-size:1rem; }
.contact-info a { border-bottom:1px solid var(--line-dark); }

.rfq { background:var(--white); border:1px solid var(--line-dark); border-radius:4px; padding:clamp(1.5rem,3vw,2.8rem); }
.rfq fieldset { border:0; margin:0 0 1.4rem; padding:0; }
.rfq legend {
  font-family:var(--font-display); font-size:1.35rem; font-weight:600; padding:0; margin-bottom:1rem;
  display:flex; align-items:center; gap:.8rem; width:100%;
}
.rfq legend::after { content:''; flex:1; height:1px; background:var(--line-dark); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.field { margin-bottom:1.05rem; }
.field label, .field .label {
  display:block; font-size:.7rem; letter-spacing:.12em; font-weight:700; color:var(--olive-600);
  margin-bottom:.5rem; text-transform:uppercase;
}
.field input[type="text"], .field input[type="email"], .field input[type="tel"], .field input[type="month"], .field select, .field textarea {
  width:100%; min-height:48px; border:1px solid rgba(20,21,16,.18); border-radius:2px;
  background:var(--cream); padding:.75rem .95rem; font-size:.95rem; color:var(--ink);
  transition:border-color .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
}
.field textarea { resize:vertical; min-height:96px; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline:none; border-color:var(--olive-600); background:var(--white); box-shadow:0 0 0 3px rgba(86,102,61,.16);
}
.field [aria-invalid="true"] { border-color:#a3412f; box-shadow:0 0 0 3px rgba(163,65,47,.12); }

.chips { display:flex; flex-wrap:wrap; gap:.5rem; }
.field .chip, .field .check {
  margin:0; text-transform:none; letter-spacing:0; font-weight:400; color:var(--ink); font-size:.9rem;
}
.field .chip { display:inline-block; }
.field .check { display:flex; }
.chip { position:relative; cursor:pointer; }
.chip input { position:absolute; opacity:0; width:1px; height:1px; }
.chip span {
  display:inline-block; padding:.55rem .9rem; border:1px solid rgba(20,21,16,.18); border-radius:40px;
  font-size:.82rem; background:var(--cream); transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.chip input:checked + span { background:var(--olive-800); border-color:var(--olive-800); color:var(--cream); }
.chip input:focus-visible + span { outline:2px solid var(--gold); outline-offset:2px; }

.field-check { display:flex; align-items:flex-end; }
.check { display:flex; align-items:flex-start; gap:.7rem; cursor:pointer; font-size:.9rem; line-height:1.45; }
.check input { width:18px; height:18px; margin:.1rem 0 0; accent-color:var(--olive-700); flex-shrink:0; }
.consent { margin:.4rem 0 1.4rem; font-size:.84rem; color:var(--text-muted); }
.consent a { color:var(--olive-700); border-bottom:1px solid currentColor; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.rfq .btn { width:100%; }
.form-note { font-size:.88rem; color:var(--olive-700); margin-top:1rem; min-height:1.4em; }
.form-note.is-error { color:#a3412f; }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer { background:var(--black); color:rgba(245,240,227,.72); }
.footer-top { display:grid; grid-template-columns:1.5fr repeat(4,1fr); gap:2.5rem; padding:5rem var(--gutter) 3rem; border-bottom:1px solid var(--line-light); }
.footer-brand .logo-mark { font-size:1.5rem; letter-spacing:.2em; }
.footer-brand p { margin-top:1rem; font-size:.88rem; max-width:320px; }
.footer-tagline { font-family:var(--font-display); font-style:italic; font-size:1.1rem; color:var(--gold) !important; }
.footer-col { display:flex; flex-direction:column; gap:.75rem; }
.footer-col h2 { font-family:var(--font-body); font-size:.68rem; letter-spacing:.2em; color:var(--gold-soft); margin-bottom:.6rem; font-weight:700; }
.footer-col a { font-size:.88rem; transition:color .3s var(--ease); }
.footer-col a:hover { color:var(--cream); }
.footer-bottom { display:flex; justify-content:space-between; gap:1rem; padding:1.6rem var(--gutter); font-size:.74rem; letter-spacing:.06em; color:rgba(245,240,227,.55); }
.footer-bottom a:hover { color:var(--gold); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1280px) {
  .hero-facts { grid-template-columns:repeat(3, auto); row-gap:1rem; }
  .hero-facts div:nth-child(3) { border-right:0; }
  .process-track { grid-template-columns:repeat(2,1fr); }
}
.nav-menu a, .logo-sub, .nav-cta { white-space:nowrap; }
@media (max-width:1400px) {
  .nav-menu { gap:1.5rem; }
  .nav-right .lang-switch { display:none; }
}
@media (max-width:1180px) {
  .nav-menu, .nav-cta { display:none; }
  .nav-toggle { display:flex; }
}
@media (max-width:1100px) {
  .about-grid, .bulk-grid, .quality-grid, .docs-grid { grid-template-columns:minmax(0,1fr); }
  .about-visual { max-width:620px; }
  .about-badge { right:1rem; }
  .formats-grid { grid-template-columns:minmax(0,1fr); }
  .format-table-wrap { overflow-x:auto; }
  .bulk-cards { grid-template-columns:1fr 1fr; }
  .evoo-feature { grid-template-columns:1fr; }
  .evoo-media { min-height:320px; }
  .pl-steps, .buyers-grid { grid-template-columns:repeat(2,1fr); }
  .contact-grid { grid-template-columns:minmax(0,1fr); }
  .contact-intro { position:static; }
  .footer-top { grid-template-columns:1fr 1fr; }
}
@media (max-width:960px) {
  :root { --gutter:5.5vw; --nav-h:68px; }
  .nav-menu, .nav-cta { display:none; }
  .nav-toggle { display:flex; }
  .navbar { padding:1rem 0; }
  .grades { grid-template-columns:1fr; }
  .stats { grid-template-columns:1fr; }
  .hero-scroll { display:none; }
}
@media (max-width:680px) {
  :root { --gutter:16px; }
  /* The tagline must never push the menu button off-screen (long in ES at 360 px) */
  .navbar-inner { gap:.75rem; }
  .logo { flex:1 1 auto; min-width:0; }
  .logo-sub { font-size:.56rem; letter-spacing:.12em; line-height:1.5; margin-top:-.2em; overflow:hidden; text-overflow:ellipsis; }
  .nav-toggle { flex-shrink:0; margin-right:-6px; }
  .limits { overflow-x:auto; }
  .hero-content { padding-bottom:3.5rem; }
  .hero-title .mask { font-size:clamp(2.6rem,13vw,4rem); }
  .hero-facts { grid-template-columns:1fr 1fr; }
  .hero-facts div { border-right:0; margin-right:0; padding-right:1rem; }
  .hero-ctas .btn { width:100%; }
  .btn { white-space:normal; text-align:center; max-width:100%; }
  .yes { font-size:.72rem; }
  .spec-list div { grid-template-columns:1fr; gap:.25rem; }
  .bulk-cards, .pl-steps, .buyers-grid, .process-track { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .doc-list li { flex-direction:column; gap:.2rem; }
  .doc-list span { text-align:left; }
  .format-table-wrap, .compare, .limits { padding:1.2rem; }
  .format-table th, .format-table td { padding:.8rem .3rem; font-size:.8rem; }
  .format-table tbody th .ficon { display:none; }
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; }
  .about-badge { display:none; }
}

/* ==========================================================================
   Subpages (generated by tools/build.py)
   ========================================================================== */
.nav-right { display:flex; align-items:center; gap:1.2rem; }
.lang-switch { display:flex; gap:.1rem; }
.lang-switch a {
  font-size:.66rem; letter-spacing:.12em; font-weight:700; color:rgba(245,240,227,.6);
  padding:.4rem .45rem; border-radius:2px; transition:color .3s var(--ease), background .3s var(--ease);
}
.lang-switch a:hover { color:var(--cream); }
.lang-switch a[aria-current="true"] { color:var(--ink); background:var(--gold); }
.mobile-menu .lang-switch a { font-size:.8rem; }

.page-hero { background:var(--near-black); color:var(--cream); padding:calc(var(--nav-h) + 3.5rem) var(--gutter) 3.8rem; position:relative; overflow:hidden; }
.page-hero::after {
  content:""; position:absolute; right:-10vw; top:-20%; width:55vw; height:140%;
  background:radial-gradient(closest-side, rgba(66,80,47,.35), rgba(14,15,11,0)); pointer-events:none;
}
.page-hero-inner { position:relative; z-index:1; max-width:1100px; }
.breadcrumbs ol { display:flex; flex-wrap:wrap; gap:.4rem; font-size:.74rem; color:rgba(245,240,227,.6); margin-bottom:1.6rem; }
.breadcrumbs li:not(:last-child)::after { content:"/"; margin-left:.4rem; color:rgba(245,240,227,.35); }
.breadcrumbs a { color:rgba(245,240,227,.75); border-bottom:1px solid transparent; }
.breadcrumbs a:hover { color:var(--gold-soft); border-color:currentColor; }
.page-hero .tag { color:var(--gold-soft); }
.page-title { font-size:clamp(2.3rem,5.2vw,4.6rem); font-weight:700; line-height:1.02; letter-spacing:-.02em; max-width:1000px; }
.page-title em { font-weight:500; color:var(--gold-soft); }
.page-lead { max-width:760px; margin-top:1.5rem; font-size:clamp(1rem,1.35vw,1.15rem); color:rgba(245,240,227,.86); }
.page-updated { margin-top:1rem; font-size:.78rem; color:rgba(245,240,227,.55); }
.page-facts {
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:0; margin:2.4rem 0 0; max-width:1000px;
  border-top:1px solid var(--line-light);
}
.page-facts div { padding:1rem 1.5rem 1rem 0; border-bottom:1px solid var(--line-light); }
.page-facts dt { font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.page-facts dd { margin:.3rem 0 0; font-size:.92rem; }
.page-hero .hero-ctas { margin-top:2.2rem; }

.page-body { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:4.5rem; padding:4.5rem var(--gutter) 3rem; max-width:1500px; margin:0 auto; }
.prose { max-width:780px; }
.prose > h2 { font-size:clamp(1.7rem,2.6vw,2.3rem); font-weight:600; margin:3rem 0 1rem; scroll-margin-top:calc(var(--nav-h) + 1rem); }
.prose > h2:first-child { margin-top:0; }
.prose h3 { font-size:1.35rem; margin:1.8rem 0 .5rem; }
.prose p, .prose li { color:var(--text-muted); font-size:1rem; }
.prose p { margin:0 0 1rem; }
.prose strong { color:var(--ink); font-weight:600; }
.prose a:not(.btn) { color:var(--olive-700); border-bottom:1px solid rgba(66,80,47,.35); transition:border-color .3s var(--ease); }
.prose a:not(.btn):hover { border-color:currentColor; }
.prose ul:not(.checks):not(.contact-lines):not(.lot-bars) { list-style:none; margin:0 0 1.2rem; }
.prose ul:not(.checks):not(.contact-lines):not(.lot-bars) li { position:relative; padding-left:1.4rem; margin-bottom:.6rem; }
.prose ul:not(.checks):not(.contact-lines):not(.lot-bars) li::before { content:""; position:absolute; left:0; top:.72em; width:.6rem; height:1px; background:var(--gold); }
.prose .checks { margin:0 0 1.4rem; }
.prose ol.numbered, .prose ol.steps-list { counter-reset:n; margin:0 0 1.4rem; }
.prose ol.numbered li, .prose ol.steps-list li { counter-increment:n; position:relative; padding-left:2.4rem; margin-bottom:.75rem; }
.prose ol.numbered li::before, .prose ol.steps-list li::before {
  content:counter(n, decimal-leading-zero); position:absolute; left:0; top:.1rem;
  font-size:.72rem; font-weight:700; letter-spacing:.1em; color:var(--gold);
}
.prose .note { font-size:.85rem; color:var(--text-muted); border-left:2px solid var(--gold); padding-left:1rem; }
.table-wrap { overflow-x:auto; margin:1.2rem 0 1.8rem; border:1px solid var(--line-dark); border-radius:3px; background:var(--white); -webkit-overflow-scrolling:touch; }
.data-table { min-width:560px; }
.data-table caption { text-align:left; font-size:.7rem; letter-spacing:.16em; font-weight:600; text-transform:uppercase; color:var(--olive-600); padding:1.1rem 1.2rem .4rem; }
.data-table th, .data-table td { padding:.8rem 1.2rem; border-bottom:1px solid var(--line-dark); text-align:left; font-size:.9rem; vertical-align:top; color:var(--ink); }
.data-table thead th { font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--olive-700); }
.data-table tbody th { font-weight:600; }
.data-table tbody tr:last-child th, .data-table tbody tr:last-child td { border-bottom:0; }
.data-table.limits-table td { white-space:nowrap; font-variant-numeric:tabular-nums; }
.data-table.limits-table td:last-child { white-space:normal; color:var(--text-muted); }

.page-aside { position:relative; }
.aside-card {
  position:sticky; top:calc(var(--nav-h) + 1.5rem);
  background:var(--near-black); color:var(--cream); padding:2rem; border-radius:3px;
  display:flex; flex-direction:column; gap:1rem;
}
.aside-card h2 { font-size:1.6rem; }
.aside-card p { font-size:.9rem; color:var(--text-muted-dark); }
.aside-card .text-link { align-self:flex-start; }

.page-faq { padding-top:3rem; }
.page-faq .faq-list { margin-top:1.6rem; }

.related { padding:3rem var(--gutter) 4rem; max-width:1500px; margin:0 auto; }
.related-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:1.6rem; background:var(--line-dark); border:1px solid var(--line-dark); }
.related-card { background:var(--cream); padding:1.6rem 1.5rem 3rem; position:relative; display:flex; flex-direction:column; gap:.5rem; transition:background .35s var(--ease); }
.related-card span { font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--olive-600); font-weight:700; }
.related-card strong { font-family:var(--font-display); font-size:1.3rem; font-weight:600; line-height:1.2; }
.related-card em { position:absolute; left:1.5rem; bottom:1.2rem; font-style:normal; color:var(--gold); transition:transform .35s var(--ease); }
.related-card:hover { background:var(--white); }
.related-card:hover em { transform:translateX(6px); }

.cta-band {
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
  background:var(--olive-950); color:var(--cream); padding:3.2rem var(--gutter);
}
.cta-band h2 { font-size:clamp(1.6rem,2.6vw,2.4rem); }
.cta-band p { color:var(--text-muted-dark); margin-top:.4rem; }

.rfq-inline { background:var(--cream-2); padding:4rem var(--gutter); }
.rfq-inline-inner { max-width:880px; margin:0 auto; }
.rfq-inline .display-md { margin-bottom:1.6rem; }

.rfq-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }
.rfq-steps div { background:var(--white); border:1px solid var(--line-dark); border-radius:3px; padding:1.2rem; }
.rfq-steps span { font-size:.7rem; font-weight:700; letter-spacing:.14em; color:var(--gold); }
.rfq-steps strong { display:block; font-family:var(--font-display); font-size:1.2rem; margin:.3rem 0 .2rem; }
.rfq-steps p { font-size:.85rem; margin:0; }
.rfq-page-form { margin-bottom:2rem; }
.contact-lines li { margin-bottom:.4rem; }

.explore { background:var(--white); padding:calc(4.5rem + 2vw) var(--gutter); }
.inline-link { color:var(--olive-700); font-weight:600; border-bottom:1px solid rgba(66,80,47,.35); white-space:nowrap; transition:border-color .3s var(--ease); }
.inline-link:hover { border-color:currentColor; }
.pl-foot .text-link { margin-left:.4rem; }
.explore .related-grid { margin-top:2rem; }

@media (max-width:1100px) {
  .page-body { grid-template-columns:minmax(0,1fr); gap:2.5rem; }
  .aside-card { position:static; }
  .related-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:960px) {
  .nav-right .lang-switch { display:none; }
}
@media (max-width:680px) {
  .page-facts { grid-template-columns:1fr 1fr; }
  .related-grid, .rfq-steps { grid-template-columns:1fr; }
  .page-body { padding-top:3rem; }
}

/* ==========================================================================
   MOTION LAYER
   Everything below is progressive enhancement: it only applies with JS
   (.js) and is switched off by prefers-reduced-motion.
   ========================================================================== */

/* --- Split headings: words rise out of a mask ------------------------------ */
.js .split .w { display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.14em; margin-bottom:-.14em; }
.js .split .wi { display:inline-block; translate:0 108%; transition:translate 1s var(--ease-expo) calc(var(--wi,0) * 45ms); will-change:translate; }
.js .split.is-visible .wi { translate:0 0; }

/* --- Image curtain reveal ---------------------------------------------------- */
/* The clip lives on the <img>, not the wrapper: a fully clipped target never
   reports an intersection to IntersectionObserver. */
.js .reveal-img img { clip-path:inset(0 0 100% 0); scale:1.18; transition:clip-path 1.4s var(--ease-expo), scale 1.8s var(--ease-soft), transform 1.2s var(--ease-soft); }
.js .reveal-img.is-visible img { clip-path:inset(0 0 0 0); scale:1; }

/* --- Buttons: colour sweep --------------------------------------------------- */
.btn { isolation:isolate; }
.btn::before {
  content:""; position:absolute; inset:-1px; z-index:-1;
  transform:scaleX(0); transform-origin:right center;
  transition:transform .55s var(--ease-expo);
}
.btn:hover::before { transform:scaleX(1); transform-origin:left center; }
.btn-solid:hover { background:var(--ink); }
.btn-solid::before { background:var(--olive-700); }
.btn-solid.btn-on-dark:hover { background:var(--gold); }
.btn-solid.btn-on-dark::before { background:var(--cream); }
.btn-ghost::before { background:var(--cream); }
.btn-ghost:hover { color:var(--ink); border-color:var(--cream); }
.btn-outline:hover { background:transparent; }
.btn-outline::before { background:var(--ink); }
.nav-cta:hover { background:transparent; color:var(--ink); }
.nav-cta::before { background:var(--gold); }

/* --- 3D tilt + glare (fine pointers; set up by JS) --------------------------- */
.js [data-tilt] {
  position:relative;
  transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));
  transition:transform .5s var(--ease-soft), background .4s var(--ease), box-shadow .5s var(--ease), color .4s var(--ease);
}
.js [data-tilt].is-tilting { transition:transform .12s linear, background .4s var(--ease), box-shadow .5s var(--ease), color .4s var(--ease); }
.js [data-tilt]:hover { --lift:-6px; box-shadow:0 24px 60px rgba(8,9,7,.14); z-index:2; }
.js [data-tilt] > .glare {
  position:absolute; inset:0; pointer-events:none; z-index:3; border-radius:inherit;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), var(--glare, rgba(200,165,92,.16)), transparent 45%);
  opacity:0; transition:opacity .4s var(--ease);
}
.js [data-tilt]:hover > .glare { opacity:1; }
.products [data-tilt], .private-label [data-tilt], .market [data-tilt], .process [data-tilt] { --glare:rgba(245,240,227,.10); }

/* --- Cursor ------------------------------------------------------------------ */
.cursor, .cursor-dot {
  position:fixed; left:0; top:0; z-index:10000; pointer-events:none; border-radius:50%;
  opacity:0; transition:opacity .3s var(--ease);
}
.cursor { width:40px; height:40px; margin:-20px 0 0 -20px; display:flex; align-items:center; justify-content:center; }
.cursor-ring {
  position:absolute; inset:0; border-radius:50%; border:1px solid var(--gold); background:rgba(200,165,92,0);
  transform:scale(var(--cs,1)); transition:transform .45s var(--ease-soft), background .35s var(--ease);
}
.cursor-label {
  position:relative; font-size:.56rem; letter-spacing:.18em; font-weight:700; color:var(--ink);
  opacity:0; transform:scale(.6); transition:opacity .3s var(--ease), transform .4s var(--ease-soft);
}
.cursor-dot { width:6px; height:6px; margin:-3px 0 0 -3px; background:var(--gold); }
.has-cursor .cursor, .has-cursor .cursor-dot { opacity:1; }
.cursor.is-link { --cs:1.6; }
.cursor.is-link .cursor-ring { background:rgba(200,165,92,.14); }
.cursor.is-label { --cs:2.1; }
.cursor.is-label .cursor-ring { background:var(--gold); }
.cursor.is-label .cursor-label { opacity:1; transform:scale(1); }
.cursor.is-down { --cs:.8; }
.cursor.is-hidden, .cursor-dot.is-hidden { opacity:0 !important; }

/* --- Hero: scroll-out and ambient glow ---------------------------------------- */
.hero-content { will-change:transform, opacity; }
.page-hero::after { transition:transform 1.2s var(--ease-soft); transform:translate3d(var(--gx,0px), var(--gy,0px), 0); }

/* Subpage hero entrance — translate only (no opacity) so LCP is not delayed */
.js .page-hero-inner > * { translate:0 18px; transition:translate 1s var(--ease-soft) calc(var(--i,0) * 70ms); }
.js .page-hero.is-ready .page-hero-inner > * { translate:0 0; }
.js .page-facts > div { opacity:0; translate:0 14px; transition:opacity .7s var(--ease-soft) calc(.35s + var(--i,0) * 60ms), translate .7s var(--ease-soft) calc(.35s + var(--i,0) * 60ms); }
.js .page-hero.is-ready .page-facts > div { opacity:1; translate:0 0; }

/* --- Ticker: JS drives it (velocity-reactive) ---------------------------------- */
.ticker.is-driven .ticker-inner { animation:none; will-change:transform; }

/* --- FAQ answers animate their height (JS) --------------------------------------- */
.faq details p { overflow:hidden; }

/* --- Stat counters ----------------------------------------------------------------- */
[data-count] { font-variant-numeric:tabular-nums lining-nums; }

/* --- Cross-page transitions (Chromium; others simply navigate) ---------------------- */
@media (prefers-reduced-motion:no-preference) {
  @view-transition { navigation:auto; }
  .navbar { view-transition-name:site-nav; }
  ::view-transition-old(root) { animation:vt-out .32s var(--ease) both; }
  ::view-transition-new(root) { animation:vt-in .55s var(--ease-soft) both; }
  @keyframes vt-out { to { opacity:0; transform:translateY(-14px); } }
  @keyframes vt-in { from { opacity:0; transform:translateY(22px); } }
}

@media (prefers-reduced-motion:reduce) {
  .cursor, .cursor-dot { display:none; }
  .js .split .wi, .js .reveal-img img, .js .page-hero-inner > *, .js .page-facts > div { translate:none; scale:none; clip-path:none; opacity:1; }
  .js [data-tilt] { transform:none; }
}
@media (hover:none), (pointer:coarse) {
  .cursor, .cursor-dot { display:none; }
}

/* ==========================================================================
   BUYER TOOLS — calculator + lot checker (need JS; hidden without it)
   ========================================================================== */
html:not(.js) .tool, html:not(.js) .tools { display:none; }
.tools-section { background:var(--cream-2); padding:calc(5.5rem + 2vw) var(--gutter); }
.tools-inner { max-width:1640px; margin:0 auto; display:grid; grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr); gap:4vw; align-items:start; }
.tools-intro { position:sticky; top:calc(var(--nav-h) + 1.5rem); }
.tools-intro .display-lg { font-size:clamp(2.1rem,3.6vw,3.6rem); }

.tool-tabs { position:relative; display:flex; gap:.2rem; border-bottom:1px solid var(--line-dark); margin-bottom:1.4rem; overflow-x:auto; scrollbar-width:none; }
.tool-tabs::-webkit-scrollbar { display:none; }
.tool-tabs [role="tab"] {
  appearance:none; background:none; border:0; min-height:48px; padding:.9rem 1.1rem; cursor:pointer; white-space:nowrap;
  font:600 .74rem/1 var(--font-body); letter-spacing:.16em; text-transform:uppercase; color:var(--text-muted); transition:color .3s var(--ease);
}
.tool-tabs [role="tab"]:hover, .tool-tabs [role="tab"][aria-selected="true"] { color:var(--ink); }
.tool-tabs [role="tab"]:focus-visible { outline:2px solid var(--gold); outline-offset:-2px; }
.tab-ink { position:absolute; left:0; bottom:-1px; height:2px; width:var(--w,0); transform:translateX(var(--x,0)); background:var(--gold); transition:transform .55s var(--ease-expo), width .55s var(--ease-expo); }
.tool-panel:focus-visible { outline:2px solid var(--gold); outline-offset:6px; }
.tool-intro { color:var(--text-muted); max-width:660px; margin:0 0 1.3rem; font-size:.98rem; }

.tool { container-type:inline-size; background:var(--white); border:1px solid var(--line-dark); border-radius:4px; padding:clamp(1.1rem,2.6vw,2.4rem); }
.tool-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(1.4rem,3vw,2.6rem); }
@container (max-width:700px) { .tool-grid { grid-template-columns:minmax(0,1fr); } }
/* Tool labels keep their case: units such as kg and meq O₂/kg must not be capitalised */
.tool .field label, .tool .field .label { text-transform:none; letter-spacing:.02em; font-size:.8rem; }
.tool .field label small { margin-left:.35rem; font-size:.66rem; font-weight:600; letter-spacing:.04em; text-transform:none; color:var(--olive-500); white-space:nowrap; }
.tool .field input[type="text"] { font-size:1.05rem; font-variant-numeric:tabular-nums; }

.seg { display:flex; flex-wrap:wrap; gap:.4rem; }
.field .seg-opt { display:inline-block; position:relative; margin:0; cursor:pointer; text-transform:none; letter-spacing:0; font-weight:400; color:var(--ink); font-size:.86rem; }
.seg-opt input { position:absolute; opacity:0; width:1px; height:1px; }
.seg-opt span {
  display:inline-flex; align-items:center; min-height:42px; padding:.5rem .95rem; border:1px solid rgba(20,21,16,.18); border-radius:40px; background:var(--cream);
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .35s var(--ease-back);
}
.seg-opt:hover span { border-color:var(--olive-600); }
.seg-opt input:checked + span { background:var(--olive-800); border-color:var(--olive-800); color:var(--cream); }
.seg-opt input:focus-visible + span { outline:2px solid var(--gold); outline-offset:2px; }
.seg-opt:active span { transform:scale(.95); }

.tool-kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(118px,1fr)); gap:1px; margin:0 0 1.2rem; background:var(--line-dark); border:1px solid var(--line-dark); }
.tool-kpis > div { background:var(--white); padding:.85rem 1rem; transition:background .35s var(--ease); }
.tool-kpis dt { font-size:.62rem; letter-spacing:.15em; text-transform:uppercase; font-weight:700; color:var(--olive-600); }
.tool-kpis dd { margin:.35rem 0 0; font-family:var(--font-display); font-size:clamp(1.45rem,2.2vw,1.95rem); font-weight:600; line-height:1.05; color:var(--ink); font-variant-numeric:tabular-nums lining-nums; overflow-wrap:anywhere; }
.tool-kpis > .is-input { background:var(--cream); box-shadow:inset 0 -2px 0 var(--gold); }
.tool-calc .tool-kpis:not(.tool-money) { grid-template-columns:repeat(6,minmax(0,1fr)); }
.tool-calc .tool-kpis:not(.tool-money) > div { grid-column:span 2; }
.tool-calc .tool-kpis:not(.tool-money) > div:nth-child(n+4) { grid-column:span 3; }
@container (max-width:440px) {
  .tool-calc .tool-kpis:not(.tool-money) { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tool-calc .tool-kpis:not(.tool-money) > div, .tool-calc .tool-kpis:not(.tool-money) > div:nth-child(n+4) { grid-column:auto; }
  .tool-calc .tool-kpis:not(.tool-money) > div:last-child { grid-column:1 / -1; }
}
.tool-money dd { color:var(--olive-700); }
.tool-table-wrap { border:1px solid var(--line-dark); margin:0 0 1.2rem; overflow-x:auto; }
.tool-table { font-variant-numeric:tabular-nums lining-nums; }
.tool-table th, .tool-table td { padding:.62rem .9rem; border-bottom:1px solid var(--line-dark); font-size:.9rem; text-align:right; color:var(--ink); }
.tool-table th:first-child { text-align:left; }
.tool-table thead th { font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--olive-700); }
.tool-table tbody tr:last-child > * { border-bottom:0; }
.tool-cta { width:100%; }
.tool p.tool-note { margin:1.3rem 0 0; font-size:.78rem; line-height:1.55; color:var(--text-muted); border-left:2px solid var(--gold); padding-left:.9rem; }

.lot-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1rem; align-items:end; }
@container (max-width:380px) { .lot-fields { grid-template-columns:minmax(0,1fr); } }
.tool-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.2rem; }
.chip-btn {
  appearance:none; min-height:44px; padding:.6rem 1.1rem; border:1px solid var(--olive-700); border-radius:40px; background:transparent; color:var(--olive-800); cursor:pointer;
  font:600 .7rem/1 var(--font-body); letter-spacing:.12em; text-transform:uppercase; transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.chip-btn:hover { background:var(--olive-800); border-color:var(--olive-800); color:var(--cream); }
.chip-btn.is-quiet { border-color:transparent; color:var(--text-muted); }
.chip-btn.is-quiet:hover { background:var(--cream); color:var(--ink); border-color:transparent; }
.chip-btn:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.tool p.tool-flag { margin:.8rem 0 0; padding:.5rem .75rem; border-radius:2px; font-size:.78rem; color:#6b4f12; background:rgba(200,165,92,.16); }

.lot-verdict {
  display:flex; gap:.9rem; align-items:flex-start; margin-bottom:1.1rem; padding:1.05rem 1.2rem; border-radius:3px;
  background:var(--cream); border:1px solid var(--line-dark); transition:background .45s var(--ease), border-color .45s var(--ease);
}
.lot-verdict strong { display:block; font-family:var(--font-display); font-size:1.45rem; line-height:1.15; font-weight:600; color:var(--ink); }
.lot-verdict p { margin:.3rem 0 0; font-size:.88rem; color:var(--text-muted); }
.lot-verdict p.lot-extra { color:#6b4f12; }
.lot-verdict p:empty { display:none; }
.lot-dot { flex-shrink:0; width:12px; height:12px; margin-top:.5rem; border-radius:50%; background:var(--olive-300); transition:background .45s var(--ease); }
.lot-verdict[data-state="evoo"] { background:rgba(86,102,61,.10); border-color:rgba(86,102,61,.38); }
.lot-verdict[data-state="evoo"] .lot-dot { background:var(--olive-600); }
.lot-verdict[data-state="voo"] { background:rgba(200,165,92,.16); border-color:rgba(200,165,92,.6); }
.lot-verdict[data-state="voo"] .lot-dot { background:#b9822f; }
.lot-verdict[data-state="out"] { background:rgba(163,65,47,.08); border-color:rgba(163,65,47,.42); }
.lot-verdict[data-state="out"] .lot-dot { background:#a3412f; }
@media (prefers-reduced-motion:no-preference) {
  .lot-verdict:not([data-state="empty"]) .lot-dot { animation:dot-pulse 2.4s var(--ease) infinite; }
}
@keyframes dot-pulse { 0% { box-shadow:0 0 0 0 rgba(200,165,92,.5); } 70%, 100% { box-shadow:0 0 0 12px rgba(200,165,92,0); } }

.lot-bars { list-style:none; margin:0 0 1.3rem; padding:0; }
.lot-bars li { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) 3.2rem auto; align-items:center; gap:.8rem; margin:0; padding:.55rem 0; border-bottom:1px solid var(--line-dark); font-size:.84rem; color:var(--ink); }
.lb-name { font-weight:500; }
.lb-track { position:relative; height:6px; border-radius:6px; background:var(--cream-2); }
.lb-track::after { content:""; position:absolute; left:80%; top:-4px; bottom:-4px; width:2px; border-radius:2px; background:var(--ink); opacity:.45; }
.lb-fill { position:absolute; inset:0; border-radius:6px; background:var(--olive-500); transform-origin:left center; transform:scaleX(var(--f,0)); transition:transform .8s var(--ease-expo), background .4s var(--ease); }
.lot-bars li[data-s="tight"] .lb-fill { background:var(--gold); }
.lot-bars li[data-s="voo"] .lb-fill { background:#b9822f; }
.lot-bars li[data-s="out"] .lb-fill { background:#a3412f; }
.lot-bars li.no-bar .lb-track { visibility:hidden; }
.lb-pct { font-size:.74rem; color:var(--text-muted); text-align:right; font-variant-numeric:tabular-nums; }
.lb-status { justify-self:end; padding:.3rem .55rem; border-radius:30px; background:var(--cream); color:var(--text-muted); font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; transition:background .35s var(--ease), color .35s var(--ease); }
.lot-bars li[data-s="ok"] .lb-status { background:rgba(86,102,61,.14); color:var(--olive-800); }
.lot-bars li[data-s="tight"] .lb-status, .lot-bars li[data-s="voo"] .lb-status { background:rgba(200,165,92,.26); color:#6b4f12; }
.lot-bars li[data-s="out"] .lb-status { background:rgba(163,65,47,.14); color:#8a3626; }
@container (max-width:520px) {
  .lot-bars li { grid-template-columns:minmax(0,1fr) auto; row-gap:.45rem; }
  .lb-track { grid-column:1 / -1; order:3; }
  .lb-pct { display:none; }
}

.prose > .tool-card { margin:2.2rem 0 2.8rem; }
.tool-card > h3 { margin-top:0; }

@media (max-width:1100px) {
  .tools-inner { grid-template-columns:minmax(0,1fr); }
  .tools-intro { position:static; }
}

/* ==========================================================================
   MORE MOTION — hero cycle & glow, mega marquee, icon draw, heading underline,
   sticky mobile CTA, back-to-top progress ring
   ========================================================================== */
.hero-h1-sub { line-height:2; }
.hero-h1-sub .cyc { position:relative; display:inline-block; line-height:1.3; transition:color .6s var(--ease); }
.hero-h1-sub .cyc::after {
  content:""; position:absolute; left:0; right:.22em; bottom:-.2em; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:right center; transition:transform .8s var(--ease-expo);
}
.hero-h1-sub .cyc.is-on { color:var(--gold-soft); }
.hero-h1-sub .cyc.is-on::after { transform:scaleX(1); transform-origin:left center; }

.hero-glow {
  position:absolute; inset:-20%; pointer-events:none; mix-blend-mode:screen;
  background:radial-gradient(38% 34% at 28% 62%, rgba(200,165,92,.20), transparent 70%),
             radial-gradient(32% 28% at 76% 34%, rgba(164,176,124,.13), transparent 70%);
  animation:glow-drift 18s ease-in-out infinite alternate;
}
@keyframes glow-drift {
  0%   { transform:translate3d(-4%,2%,0) scale(1); }
  50%  { transform:translate3d(3%,-3%,0) scale(1.08); }
  100% { transform:translate3d(6%,3%,0) scale(1); }
}

.mega { overflow:hidden; background:var(--near-black); padding:clamp(2.2rem,5vw,4.5rem) 0 clamp(1.6rem,4vw,3.5rem); }
.mega-row {
  display:flex; align-items:center; width:max-content; white-space:nowrap;
  font-family:var(--font-display); font-size:clamp(3.2rem,10vw,9.5rem); line-height:1; font-weight:700;
  text-transform:uppercase; letter-spacing:-.02em; will-change:transform;
}
.mega-row span { padding:0 .22em; color:transparent; -webkit-text-stroke:1px rgba(245,240,227,.32); }
.mega-row i { font-style:normal; font-size:.3em; color:var(--gold); }
.mega-row.is-solid { font-style:italic; font-weight:500; text-transform:none; letter-spacing:-.01em; }
.mega-row.is-solid span { color:var(--gold-soft); -webkit-text-stroke:0; }
.js .mega-row { transform:translate3d(-25%,0,0); }

.js .ficon.draw > * { stroke-dasharray:var(--len); stroke-dashoffset:var(--len); transition:stroke-dashoffset 1.8s var(--ease-soft) calc(var(--di,0) * 150ms); }
.js .ficon.draw.is-visible > * { stroke-dashoffset:0; }

.js .split em {
  background:linear-gradient(var(--gold), var(--gold)) no-repeat 0 100% / 0 2px;
  transition:background-size 1.3s var(--ease-expo) .55s;
}
.js .split.is-visible em { background-size:100% 2px; }

.sticky-cta, .to-top { display:none; }
.js .to-top {
  position:fixed; right:22px; bottom:22px; z-index:900; width:52px; height:52px; display:grid; place-items:center; border-radius:50%;
  background:rgba(14,15,11,.86); color:var(--cream); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  opacity:0; visibility:hidden; transform:translateY(12px) scale(.9);
  transition:opacity .4s var(--ease), transform .5s var(--ease-soft), visibility 0s linear .5s;
}
.js .to-top.is-on { opacity:1; visibility:visible; transform:none; transition:opacity .4s var(--ease), transform .5s var(--ease-soft), visibility 0s; }
.to-top svg { position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.to-top circle { fill:none; stroke-width:2; }
.tt-track { stroke:rgba(245,240,227,.16); }
.tt-ring { stroke:var(--gold); stroke-dasharray:1; stroke-dashoffset:1; }
.to-top span { position:relative; font-size:1.05rem; transition:transform .4s var(--ease-soft); }
.to-top:hover span { transform:translateY(-3px); }
.to-top:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }

@media (max-width:680px) {
  .js .to-top { display:none; }
  .js .sticky-cta {
    position:fixed; left:0; right:0; bottom:0; z-index:900; display:flex; align-items:center; gap:.5rem;
    padding:.6rem 16px calc(.6rem + env(safe-area-inset-bottom)); background:rgba(14,15,11,.94);
    -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-top:1px solid var(--line-light);
    transform:translateY(105%); visibility:hidden; transition:transform .5s var(--ease-expo), visibility 0s linear .5s;
  }
  .js .sticky-cta.is-on { transform:none; visibility:visible; transition:transform .5s var(--ease-expo), visibility 0s; }
  .menu-open .sticky-cta { visibility:hidden !important; }
  .sticky-cta .btn { flex:1 0 auto; min-height:46px; padding:.8rem .9rem; font-size:.68rem; letter-spacing:.12em; white-space:nowrap; }
  .sticky-sample { flex:0 1 auto; max-width:46%; padding:.4rem .2rem; color:var(--gold-soft); font-size:.66rem; line-height:1.3; font-weight:600; letter-spacing:.08em; text-transform:uppercase; text-align:center; }
}

@media (prefers-reduced-motion:reduce) {
  .hero-glow { animation:none; }
  .js .mega-row { transform:none; }
  .js .ficon.draw > * { stroke-dasharray:none; stroke-dashoffset:0; transition:none; }
  .js .split em { transition:none; }
  .seg-opt span, .lb-fill, .tab-ink { transition:none; }
}