*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --clay:#8B2500; --clay-light:#F5E8E2; --clay-mid:#D4896A;
  --amber:#C4501A; --amber-light:#FAEEE8;
  --gold:#D4954A; --gold-light:#F2D4A8; --gold-pale:#FBF0DC;
  --vine:#1E3830; --vine-light:#E4EDE9; --vine-mid:#2C4A3E; --vine-soft:#C6D8D2;
  --linen:#F7F2E8; --smoke:#EDE7D3; --parch:#E8DFC8;
  --warm-white:#FFFCF6; --ink:#2A1A0E; --ink-soft:#5C3D28;
  --muted:#9A7E68; --muted-light:#C4A98A;
  --bw:rgba(139,37,0,0.12); --bg:rgba(212,149,74,0.25);
}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--linen);color:var(--ink);overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%238B2500' fill-opacity='0.018'%3E%3Cpath d='M40 0L80 40L40 80L0 40Z'/%3E%3C/g%3E%3C/svg%3E");}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:20px 60px;background:rgba(247,242,232,0.88);backdrop-filter:blur(20px);border-bottom:1px solid var(--bw);transition:all 0.4s}
nav.scrolled{box-shadow:0 4px 32px rgba(139,37,0,0.09)}
.logo{font-family:'Unbounded',sans-serif;font-size:17px;font-weight:700;text-decoration:none;letter-spacing:-0.02em;color:var(--ink)}
.logo .dot{color:var(--amber)}
.nav-right{display:flex;align-items:center;gap:32px}
.nav-link{font-size:12px;font-weight:400;text-decoration:none;letter-spacing:0.05em;color:var(--muted);transition:color 0.25s}
.nav-link:hover{color:var(--clay)}
.nav-btn{font-family:'Unbounded',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.06em;padding:11px 22px;border-radius:6px;text-decoration:none;transition:all 0.25s;background:var(--clay);color:var(--warm-white);border:none;cursor:pointer}
.nav-btn:hover{background:var(--amber);transform:translateY(-2px);box-shadow:0 6px 20px rgba(139,37,0,0.25)}

/* ── HERO ── */
.hero{min-height:100vh;background:var(--warm-white);display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;padding-top:80px}
.hero::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 0% 50%,rgba(139,37,0,0.07) 0%,transparent 60%),radial-gradient(ellipse 50% 80% at 100% 20%,rgba(212,149,74,0.10) 0%,transparent 55%)}
.hero-left{display:flex;flex-direction:column;justify-content:center;padding:80px 56px 100px;position:relative;z-index:2}
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:'Unbounded',sans-serif;font-size:9px;font-weight:400;letter-spacing:0.2em;text-transform:uppercase;color:var(--amber);margin-bottom:28px}
.kicker::before{content:'';width:28px;height:1px;background:var(--gold)}
h1{font-family:'Cormorant Garamond',serif;font-size:clamp(56px,6vw,92px);font-weight:300;line-height:0.93;letter-spacing:-0.03em;color:var(--ink)}
h1 .bold{font-weight:700;font-style:italic;color:var(--clay);display:block}
h1 .acc{font-style:italic;color:var(--amber)}
.hero-sub{font-size:15px;line-height:1.8;color:var(--ink-soft);opacity:0.75;max-width:400px;margin:28px 0 44px}
.cta-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.btn-fill{font-family:'Unbounded',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.06em;padding:14px 28px;border-radius:6px;text-decoration:none;transition:all 0.25s;display:inline-block;background:var(--clay);color:var(--warm-white)}
.btn-fill:hover{background:var(--amber);transform:translateY(-2px);box-shadow:0 10px 28px rgba(139,37,0,0.22)}
.btn-ghost{font-size:13px;font-weight:400;padding:14px 22px;border-radius:6px;text-decoration:none;transition:all 0.25s;display:inline-block;border:1.5px solid var(--bw);color:var(--ink-soft)}
.btn-ghost:hover{border-color:var(--clay);color:var(--clay);background:var(--clay-light)}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap;margin-top:52px;padding-top:36px;border-top:1px solid var(--bw)}
.hs-num{font-family:'Unbounded',sans-serif;font-size:22px;font-weight:700;color:var(--clay);line-height:1;margin-bottom:4px}
.hs-lbl{font-size:11px;color:var(--muted);letter-spacing:0.04em}
.hero-right{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-right-bg{position:absolute;inset:0;background:linear-gradient(150deg,var(--gold-pale) 0%,var(--clay-light) 50%,var(--vine-light) 100%)}
.hero-right::after{content:'';position:absolute;top:0;bottom:0;left:0;width:80px;background:var(--warm-white);clip-path:polygon(0 0,100% 0,0 100%)}
.hero-svg-wrap{position:relative;z-index:2;width:min(400px,75%)}
.h-pill{position:absolute;z-index:3;background:var(--warm-white);border:1px solid var(--bg);border-radius:10px;padding:12px 16px;box-shadow:0 4px 24px rgba(139,37,0,0.10)}
.hp1{bottom:20%;left:8%}.hp2{top:20%;right:6%}
.h-pill .hp-n{font-family:'Unbounded',sans-serif;font-size:16px;font-weight:700;color:var(--clay);line-height:1}
.h-pill .hp-l{font-size:10px;color:var(--muted);letter-spacing:0.04em;margin-top:3px}

/* ── MARQUEE ── */
.mq{background:var(--clay);overflow:hidden;padding:14px 0}
.mq-track{display:flex;animation:mq 22s linear infinite;white-space:nowrap}
.mq-track:hover{animation-play-state:paused}
.mq-item{font-family:'Unbounded',sans-serif;font-size:9px;font-weight:400;letter-spacing:0.14em;text-transform:uppercase;color:rgba(247,242,232,0.7);padding:0 28px;display:flex;align-items:center;gap:12px}
.mq-item::after{content:'✦';color:rgba(247,242,232,0.3);font-size:7px}
@keyframes mq{to{transform:translateX(-50%)}}

/* ── SHARED SECTION STYLES ── */
.sw{padding:110px 60px}
.eyebrow{font-family:'Unbounded',sans-serif;font-size:9px;font-weight:400;letter-spacing:0.18em;text-transform:uppercase;color:var(--amber);margin-bottom:18px;display:inline-flex;align-items:center;gap:8px}
.eyebrow::before{content:'';width:22px;height:1px;background:var(--gold)}
h2.sec{font-family:'Cormorant Garamond',serif;font-size:clamp(38px,4vw,64px);font-weight:300;line-height:1.02;letter-spacing:-0.025em;color:var(--ink);margin-bottom:16px}
h2.sec em{font-style:italic;color:var(--clay)}
.sec-sub{font-size:15px;color:var(--muted);line-height:1.8;max-width:480px}

/* ── SUPRA ── */
.supra-s{background:var(--smoke)}
.supra-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.p-card{background:var(--warm-white);border:1px solid var(--bw);border-radius:12px;padding:22px 24px;display:flex;align-items:flex-start;gap:16px;transition:all 0.3s;margin-bottom:12px;cursor:default}
.p-card:hover{border-color:var(--clay-mid);transform:translateX(8px);box-shadow:0 6px 28px rgba(139,37,0,0.09)}
.p-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.ic-clay{background:var(--clay-light)}.ic-vine{background:var(--vine-light)}.ic-gold{background:var(--gold-pale)}
.p-title{font-size:14px;font-weight:500;color:var(--ink);margin-bottom:4px}
.p-desc{font-size:12px;color:var(--muted);line-height:1.65}

/* ── WHY CARDS ── */
.why-s{background:var(--linen)}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto;gap:16px;margin-top:56px}
.wc{border-radius:16px;overflow:hidden;position:relative;border:1px solid var(--bw)}
.wc-big{grid-column:1/2;grid-row:1/3;min-height:480px}
.wc-med{min-height:230px}
.wc-wide{grid-column:2/4;min-height:230px}
.wc-clay{background:var(--clay)}.wc-amber{background:var(--amber)}.wc-gold{background:var(--gold-pale);border-color:var(--bg)}.wc-vine{background:var(--vine-mid)}
.wc-in{position:absolute;inset:0;padding:28px;display:flex;flex-direction:column;justify-content:flex-end}
.wc-tag{font-family:'Unbounded',sans-serif;font-size:8px;letter-spacing:0.16em;text-transform:uppercase;margin-bottom:10px}
.wc-h{font-family:'Cormorant Garamond',serif;font-size:clamp(26px,2.8vw,42px);font-weight:400;line-height:1.05;letter-spacing:-0.02em}
.wc-sub{font-size:12px;margin-top:8px;line-height:1.65;max-width:280px}
.on-dk .wc-tag{color:rgba(247,242,232,0.5)}.on-dk .wc-h{color:var(--warm-white)}.on-dk .wc-sub{color:rgba(247,242,232,0.5)}
.on-lt .wc-tag{color:var(--amber)}.on-lt .wc-h{color:var(--ink)}.on-lt .wc-sub{color:var(--muted)}
.wc-num{position:absolute;top:20px;right:24px;font-family:'Unbounded',sans-serif;font-size:100px;font-weight:900;line-height:1}
.on-dk .wc-num{color:rgba(255,255,255,0.05)}.on-lt .wc-num{color:rgba(139,37,0,0.06)}
.wc-ring{position:absolute;border-radius:50%;border:1px solid}

/* ── HOW IT WORKS ── */
.how-s{background:var(--smoke)}
.how-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:64px;position:relative}
.how-steps::before{content:'';position:absolute;top:23px;left:12.5%;right:12.5%;height:1px;background:linear-gradient(90deg,var(--clay),var(--amber),var(--gold),var(--vine-soft));z-index:0}
.step-b{padding:0 20px;text-align:center;position:relative;z-index:1}
.step-dot{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;margin:0 auto 20px;border:1.5px solid}
.sd1{background:var(--clay-light);border-color:var(--clay)}.sd2{background:var(--amber-light);border-color:var(--amber)}.sd3{background:var(--gold-pale);border-color:var(--gold)}.sd4{background:var(--vine-light);border-color:var(--vine-mid)}
.step-k{font-family:'Unbounded',sans-serif;font-size:8px;font-weight:700;letter-spacing:0.14em;color:var(--muted);margin-bottom:8px}
.step-t{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:400;color:var(--ink);margin-bottom:8px}
.step-d{font-size:12px;color:var(--muted);line-height:1.65}

/* ── REGIONS ── */
.reg-s{background:var(--warm-white)}
.reg-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:start;margin-top:56px}
.reg-row{display:flex;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--bw);cursor:pointer;transition:all 0.3s}
.reg-row:hover{padding-left:10px}
.reg-row:hover .rn{color:var(--clay)}.reg-row:hover .rl{color:var(--clay)}
.rn{font-family:'Unbounded',sans-serif;font-size:10px;font-weight:700;color:var(--muted-light);min-width:22px;transition:color 0.25s}
.rl{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:400;color:var(--ink);letter-spacing:-0.01em;flex:1;transition:color 0.25s}
.rt{font-size:11px;color:var(--muted)}
.rbar{width:64px;height:2px;background:var(--parch);border-radius:1px;overflow:hidden;flex-shrink:0}
.rbar-f{height:100%;border-radius:1px;background:var(--clay);transition:width 0.4s}
.rhosts{font-family:'Unbounded',sans-serif;font-size:11px;font-weight:700;color:var(--ink-soft);min-width:26px;text-align:right}
.map-panel{background:var(--smoke);border-radius:16px;border:1px solid var(--bg);padding:36px;box-shadow:0 4px 32px rgba(139,37,0,0.06);position:sticky;top:100px}

/* ══════════════════════════════════
   ── HOST CARDS — FULL REDESIGN ──
══════════════════════════════════ */
.hosts-s{background:var(--linen)}

/* Full-bleed cinematic grid */
.h-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:480px 300px;
  gap:14px;margin-top:48px;
}
.h-card{
  border-radius:18px;overflow:hidden;
  position:relative;cursor:default;
  transition:transform 0.5s cubic-bezier(0.23,1,0.32,1),box-shadow 0.5s cubic-bezier(0.23,1,0.32,1);
}
.h-card:hover{transform:scale(1.025) translateY(-4px);box-shadow:0 28px 60px rgba(30,10,0,0.18)}
/* Feature card spans two rows */
.h-card.feature{grid-row:1/3}

/* Background fills per host */
.hbg-1{background:linear-gradient(160deg,#7A1E00 0%,#A83010 45%,#C4501A 100%)}
.hbg-2{background:linear-gradient(160deg,#122820 0%,#1E3830 50%,#2C5044 100%)}
.hbg-3{background:linear-gradient(160deg,#3A2000 0%,#5A3410 50%,#8B5E2A 100%)}
.hbg-4{background:linear-gradient(160deg,#5A3010 0%,#8B5020 50%,#A06835 100%)}
.hbg-5{background:linear-gradient(160deg,#1A3020 0%,#2A4A38 50%,#3D6B5A 100%)}

/* Texture overlay on each card */
.h-card::before{
  content:'';position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Ccircle cx='40' cy='40' r='30' stroke='white' stroke-opacity='0.04' stroke-width='1'/%3E%3Ccircle cx='40' cy='40' r='15' stroke='white' stroke-opacity='0.03' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E");
  z-index:1;
}
/* Gradient overlay from bottom */
.h-card::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 0%,transparent 30%,rgba(10,4,0,0.55) 70%,rgba(10,4,0,0.85) 100%);
  z-index:2;
}
/* Content inside card */
.h-card-body{
  position:absolute;bottom:0;left:0;right:0;
  padding:28px;z-index:3;
}
.h-cert{
  display:inline-flex;align-items:center;gap:5px;
  font-family:'Unbounded',sans-serif;font-size:7px;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--gold-light);
  background:rgba(139,37,0,0.6);
  border:1px solid rgba(212,149,74,0.35);
  padding:4px 10px;border-radius:4px;margin-bottom:12px;
}
.h-name{
  font-family:'Cormorant Garamond',serif;
  font-weight:400;color:var(--warm-white);line-height:1.1;margin-bottom:5px;
}
.h-card.feature .h-name{font-size:28px}
.h-card:not(.feature) .h-name{font-size:20px}
.h-role{font-size:11px;color:rgba(247,242,232,0.55);margin-bottom:14px;letter-spacing:0.02em}
.h-card:not(.feature) .h-role{margin-bottom:10px}
.h-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:16px}
.h-card:not(.feature) .h-tags{margin-bottom:10px}
.h-tag{
  font-family:'Unbounded',sans-serif;font-size:7px;
  padding:3px 8px;border-radius:3px;letter-spacing:0.04em;
  background:rgba(212,149,74,0.18);color:var(--gold-light);
  border:1px solid rgba(212,149,74,0.2);
}
.h-foot{
  display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid rgba(255,255,255,0.1);padding-top:12px;
}
.h-rating{font-size:12px;color:var(--gold-light)}
.h-price{
  font-family:'Unbounded',sans-serif;font-size:13px;font-weight:700;color:var(--warm-white);
}
.h-price small{font-size:9px;opacity:0.45;font-weight:300}

/* Top info on feature card */
.h-card-top{
  position:absolute;top:0;left:0;right:0;
  padding:22px 28px;z-index:3;
  display:flex;justify-content:space-between;align-items:flex-start;
}
.h-region-pill{
  background:rgba(255,255,255,0.12);
  backdrop-filter:blur(8px);
  font-size:10px;color:rgba(247,242,232,0.8);
  padding:5px 12px;border-radius:20px;
  border:1px solid rgba(255,255,255,0.1);
  letter-spacing:0.04em;
}
.h-score{
  font-family:'Unbounded',sans-serif;
  font-size:10px;font-weight:700;
  color:var(--gold-light);
  background:rgba(139,37,0,0.5);
  border:1px solid rgba(212,149,74,0.3);
  padding:5px 12px;border-radius:20px;
}

/* ── NUMBERS ── */
.nums{background:var(--clay);padding:72px 60px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;overflow:hidden}
.nums::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 20% 50%,rgba(255,255,255,0.07) 0%,transparent 60%),repeating-linear-gradient(90deg,transparent,transparent 24%,rgba(255,255,255,0.03) 24%,rgba(255,255,255,0.03) calc(24% + 1px))}
.ni{padding:0 40px 0 0;margin-right:40px;border-right:1px solid rgba(255,255,255,0.15);position:relative;z-index:1}
.ni:last-child{border-right:none;margin-right:0;padding-right:0}
.nb{font-family:'Unbounded',sans-serif;font-size:clamp(40px,4.5vw,64px);font-weight:900;color:var(--warm-white);line-height:1;margin-bottom:6px;letter-spacing:-0.04em}
.nb .u{font-size:0.45em;font-weight:300;opacity:0.6;letter-spacing:0}
.nl{font-size:12px;color:rgba(247,242,232,0.55);letter-spacing:0.04em}
.ns{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:13px;color:rgba(247,242,232,0.4);margin-top:5px}

/* ── TESTIMONIALS ── */
.testi-s{background:var(--smoke)}
.testi-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px;margin-top:56px}
.tc{border-radius:16px;padding:32px;position:relative;overflow:hidden;border:1px solid var(--bw)}
.tc-w{background:var(--warm-white)}.tc-c{background:var(--clay)}.tc-g{background:var(--gold-pale);border-color:var(--bg)}
.tc-qm{position:absolute;right:20px;top:10px;font-family:'Cormorant Garamond',serif;font-size:100px;font-weight:300;line-height:1}
.tc-w .tc-qm,.tc-g .tc-qm{color:rgba(139,37,0,0.06)}.tc-c .tc-qm{color:rgba(255,255,255,0.07)}
.tc-st{font-size:12px;margin-bottom:14px;letter-spacing:3px}
.tc-w .tc-st,.tc-g .tc-st{color:var(--amber)}.tc-c .tc-st{color:var(--gold-light)}
.tc-q{font-family:'Cormorant Garamond',serif;font-size:17px;font-style:italic;line-height:1.65;margin-bottom:22px}
.tc-w .tc-q,.tc-g .tc-q{color:var(--ink-soft)}.tc-c .tc-q{color:rgba(247,242,232,0.8)}
.tc-au{display:flex;align-items:center;gap:10px;padding-top:18px;border-top:1px solid}
.tc-w .tc-au,.tc-g .tc-au{border-top-color:var(--bw)}.tc-c .tc-au{border-top-color:rgba(255,255,255,0.12)}
.tc-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Unbounded',sans-serif;font-size:9px;font-weight:700;flex-shrink:0}
.tc-w .tc-av{background:var(--clay-light);color:var(--clay)}.tc-c .tc-av{background:rgba(255,255,255,0.15);color:var(--warm-white)}.tc-g .tc-av{background:var(--gold-light);color:var(--ink)}
.tc-nm{font-size:13px;font-weight:500}.tc-mt{font-size:11px;opacity:0.5}
.tc-w .tc-nm,.tc-g .tc-nm{color:var(--ink)}.tc-c .tc-nm{color:var(--warm-white)}

/* ── CTA ── */
.cta-s{background:var(--vine-mid);padding:0 60px;display:grid;grid-template-columns:1fr 1fr;min-height:440px;position:relative;overflow:hidden}
.cta-s::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 100% at 75% 50%,rgba(212,149,74,0.1) 0%,transparent 70%)}
.cta-l{display:flex;flex-direction:column;justify-content:center;padding:80px 52px 80px 0;border-right:1px solid rgba(212,149,74,0.15);position:relative;z-index:1}
.cta-l h2{font-family:'Cormorant Garamond',serif;font-size:clamp(38px,4.2vw,60px);font-weight:300;letter-spacing:-0.02em;color:var(--warm-white);line-height:1.05;margin-bottom:18px}
.cta-l h2 em{font-style:italic;color:var(--gold-light)}
.cta-l p{font-size:14px;color:rgba(247,242,232,0.5);line-height:1.8;margin-bottom:32px;max-width:380px}
.btn-gold{font-family:'Unbounded',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.06em;padding:14px 26px;border-radius:6px;text-decoration:none;display:inline-block;background:var(--gold);color:var(--ink);transition:all 0.25s}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-2px);box-shadow:0 8px 24px rgba(212,149,74,0.3)}
.cta-r{display:flex;flex-direction:column;justify-content:center;padding:80px 0 80px 52px;position:relative;z-index:1;gap:12px}
.cta-f{background:rgba(247,242,232,0.06);border:1px solid rgba(212,149,74,0.15);border-radius:8px;padding:14px 18px;display:flex;align-items:center;gap:14px;transition:all 0.25s}
.cta-f:hover{background:rgba(212,149,74,0.1);border-color:rgba(212,149,74,0.35);transform:translateX(8px)}
.cf-ic{font-size:18px;flex-shrink:0}
.cf-t{font-size:13px;font-weight:500;color:var(--warm-white);margin-bottom:2px}
.cf-d{font-size:11px;color:rgba(247,242,232,0.4)}

/* ── FOOTER ── */
footer{background:var(--smoke);padding:60px 60px 32px;border-top:1px solid var(--bw)}
.ft{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.fb .logo{color:var(--ink)}
.fb p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:14px;color:var(--muted);margin-top:12px;line-height:1.7;max-width:260px}
.fc h4{font-family:'Unbounded',sans-serif;font-size:8px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--clay);margin-bottom:16px}
.fc a{display:block;font-size:13px;color:var(--muted);text-decoration:none;margin-bottom:10px;transition:color 0.2s}
.fc a:hover{color:var(--clay)}
.fb-bot{border-top:1px solid var(--bw);padding-top:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.f-copy{font-size:11px;color:var(--muted)}
.f-tag{font-size:11px;color:var(--clay-mid);letter-spacing:0.04em}

/* ══════════════════════════════════════════
   ── CINEMATIC SCROLL ANIMATIONS ──
══════════════════════════════════════════ */

/* Base hidden state — each element starts invisible */
.sr          {opacity:0;transform:translateY(40px);transition:opacity 1s cubic-bezier(0.16,1,0.3,1),transform 1s cubic-bezier(0.16,1,0.3,1)}
.sr-left     {opacity:0;transform:translateX(-48px);transition:opacity 1s cubic-bezier(0.16,1,0.3,1),transform 1s cubic-bezier(0.16,1,0.3,1)}
.sr-right    {opacity:0;transform:translateX(48px);transition:opacity 1s cubic-bezier(0.16,1,0.3,1),transform 1s cubic-bezier(0.16,1,0.3,1)}
.sr-scale    {opacity:0;transform:scale(0.92);transition:opacity 1s cubic-bezier(0.16,1,0.3,1),transform 1s cubic-bezier(0.16,1,0.3,1)}
.sr-clip     {clip-path:inset(0 0 100% 0);transition:clip-path 1.1s cubic-bezier(0.16,1,0.3,1)}

/* Revealed state */
.sr.in,.sr-left.in,.sr-right.in,.sr-scale.in{opacity:1;transform:none}
.sr-clip.in  {clip-path:inset(0 0 0% 0)}

/* Stagger delays */
.d1{transition-delay:0.08s}.d2{transition-delay:0.18s}.d3{transition-delay:0.30s}
.d4{transition-delay:0.44s}.d5{transition-delay:0.58s}.d6{transition-delay:0.72s}

/* ── HOST CARD SPECIFIC ENTRANCE ── */
.h-card{opacity:0;transform:translateY(36px) scale(0.97);transition:opacity 0.9s cubic-bezier(0.16,1,0.3,1),transform 0.9s cubic-bezier(0.16,1,0.3,1),box-shadow 0.5s,filter 0.5s}
.h-card.in{opacity:1;transform:none}
/* Hover state preserved after .in */
.h-card.in:hover{transform:scale(1.025) translateY(-4px);box-shadow:0 28px 60px rgba(30,10,0,0.18)}

/* ── NUMBER COUNTER ANIMATION ── */
.nb{transition:color 0.3s}
.nums.in .nb{animation:countUp 0.8s cubic-bezier(0.23,1,0.32,1) both}
@keyframes countUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.nums.in .ni:nth-child(1) .nb{animation-delay:0s}
.nums.in .ni:nth-child(2) .nb{animation-delay:0.12s}
.nums.in .ni:nth-child(3) .nb{animation-delay:0.24s}
.nums.in .ni:nth-child(4) .nb{animation-delay:0.36s}

/* ── LINE REVEAL (eyebrow lines) ── */
@keyframes lineGrow{from{width:0}to{width:22px}}
.eyebrow.in::before{animation:lineGrow 0.6s 0.2s cubic-bezier(0.16,1,0.3,1) both}

/* ── MARQUEE COLOR PULSE on first view ── */
@keyframes mqPulse{0%{opacity:0;transform:translateX(-100%)}100%{opacity:1;transform:translateX(0)}}

/* ── PILLAR CARD HOVER LINE ── */
.p-card{position:relative}
.p-card::before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:2.5px;background:var(--clay);border-radius:2px;transform:scaleY(0);transform-origin:top;transition:transform 0.3s cubic-bezier(0.16,1,0.3,1)}
.p-card:hover::before{transform:scaleY(1)}

/* ── WHY CARD HOVER LIFT ── */
.wc{transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),box-shadow 0.4s}
.wc:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(30,10,0,0.15)}

/* ── TESTIMONIAL HOVER ── */
.tc{transition:transform 0.35s cubic-bezier(0.16,1,0.3,1),box-shadow 0.35s}
.tc:hover{transform:translateY(-5px);box-shadow:0 16px 44px rgba(30,10,0,0.10)}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  nav{padding:16px 24px}
  .hero{grid-template-columns:1fr}
  .hero-right{display:none}
  .hero-left{padding:100px 24px 80px}
  .sw{padding:72px 24px}
  .supra-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr 1fr}
  .wc-big{grid-column:1/3;grid-row:auto;min-height:260px}
  .wc-wide{grid-column:1/3}
  .how-steps{grid-template-columns:1fr 1fr;gap:32px}
  .how-steps::before{display:none}
  .reg-layout{grid-template-columns:1fr}
  .map-panel{display:none}
  .h-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .h-card.feature{grid-row:auto}
  .nums{grid-template-columns:1fr 1fr;gap:32px;padding:56px 24px}
  .ni{border-right:none;border-bottom:1px solid rgba(255,255,255,0.1);padding-bottom:24px;margin:0}
  .testi-grid{grid-template-columns:1fr}
  .cta-s{grid-template-columns:1fr;padding:0 24px}
  .cta-l{padding:60px 0 32px;border-right:none;border-bottom:1px solid rgba(212,149,74,0.15)}
  .cta-r{padding:32px 0 60px}
  .ft{grid-template-columns:1fr 1fr;gap:32px}
}
