/* ============ tokens ============ */
:root{
  --navy:#0B1F3A;
  --navy-light:#14294a;
  --gold:#B8862B;
  --signal:#1F4FD8;
  --cream:#F5F0E6;
  --slate:#3C4552;
  --ease: cubic-bezier(.16,1,.3,1);
  --risk-color: var(--signal);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter', sans-serif;
  color:var(--slate);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces', serif; font-weight:600; margin:0;}
p{margin:0;}
button{font-family:inherit; cursor:pointer; border:none; background:none;}
input{font-family:inherit;}
svg{display:block;}
.mono{font-family:'IBM Plex Mono', monospace;}
.gold-text{color:var(--gold);}
.cream-text{color:var(--cream);}
.signal-text{color:var(--signal);}

.wrap{max-width:1120px; margin:0 auto; padding:0 20px;}
.wrap.narrow{max-width:760px;}
.section{padding:80px 20px;}
.section.tight{padding:56px 0;}
.section.cream{background:var(--cream);}
.section.white{background:#fff;}
.section.navy-section{background:var(--navy); padding-top:64px; padding-bottom:64px;}
@media(min-width:640px){.section{padding:96px 20px;}}

.center-head{text-align:center;}
.center-head h1, .center-head h2{margin-bottom:16px;}
.lead{color:var(--slate); max-width:640px; margin:0 auto 56px; text-align:center;}
.center-title{font-size:1.9rem; text-align:center; margin-bottom:48px;}
.eyebrow{font-size:.72rem; letter-spacing:.25em; text-transform:uppercase; color:var(--signal); margin-bottom:18px; font-family:'Inter',sans-serif;}
.kicker{font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:#9a8f6f; margin-bottom:10px;}
.kicker.gold{color:var(--gold);}
.body-sm{font-size:.9rem; line-height:1.6; color:var(--slate);}
.body-sm.light{color:#c3cede;}
.fine-print{font-size:.68rem; color:#9a8f6f; text-align:left;}
.fine-print.center{text-align:center;}

/* ============ nav ============ */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(11,31,58,0.85);
  border-bottom:1px solid #1a2f52;
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:background .4s var(--ease), box-shadow .4s var(--ease);
}
.nav.scrolled{background:rgba(11,31,58,0.96); box-shadow:0 12px 30px -18px rgba(0,0,0,.6);}
.scroll-progress{position:absolute; left:0; top:0; height:2px; width:100%; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .1s linear;}
.nav-inner{max-width:1280px; margin:0 auto; padding:0 20px; height:64px; display:flex; align-items:center; justify-content:space-between;}
.logo{display:flex; align-items:center; gap:8px; background:none;}
.logo-img{height:26px; width:auto; display:block; object-fit:contain;}
.ghost-spin{display:inline-flex; transition:transform .6s var(--ease);}
.logo:hover .ghost-spin{transform:rotate(-8deg) scale(1.05);}
.logo-text{font-family:'Fraunces',serif; color:var(--cream); font-size:1.1rem; letter-spacing:-0.01em;}
.nav-links{display:none; align-items:center; gap:28px; position:relative;}
@media(min-width:1024px){.nav-links{display:flex;}}
.nav-link{font-size:.9rem; color:#9fb0c9; transition:color .3s ease; padding:2px 2px;}
.nav-link.active,.nav-link:hover{color:var(--cream);}
.nav-indicator{position:absolute; bottom:-8px; height:2px; border-radius:2px; background:var(--gold); transition:left .45s var(--ease), width .45s var(--ease); opacity:0;}
.nav-actions{display:flex; align-items:center; gap:12px;}
.buy-now-desktop{display:none;}
@media(min-width:640px){.buy-now-desktop{display:inline-flex;}}
.menu-toggle{color:var(--cream); padding:8px;}
@media(min-width:1024px){.menu-toggle{display:none;}}
.mobile-menu{max-height:0; overflow:hidden; transition:max-height .4s var(--ease); background:var(--navy);}
.mobile-menu.open{max-height:420px;}
.mobile-link{display:block; width:100%; text-align:left; color:#e6ecf5; font-size:.9rem; padding:8px 20px;}
.mobile-buy{margin:8px 20px 16px; background:var(--gold); color:var(--navy); border-radius:999px; padding:10px; text-align:center; font-weight:500; width:calc(100% - 40px);}

/* ============ buttons ============ */
.btn-gold{background:var(--gold); color:var(--navy); border-radius:999px; padding:12px 28px; font-size:.9rem; font-weight:500; transition:transform .3s var(--ease);}
.btn-gold.full{width:100%; display:block; text-align:center;}
.btn-outline{border:1px solid #3a4c6d; color:var(--cream); border-radius:999px; padding:12px 28px; font-size:.9rem; font-weight:500; transition:border-color .3s ease;}
.btn-outline:hover{border-color:var(--cream);}
.btn-line{border:1px solid var(--navy); color:var(--navy); border-radius:999px; padding:8px 0; width:100%; font-size:.85rem; font-weight:500; transition:transform .3s var(--ease);}
.btn-line:hover{transform:scale(1.03);}
.btn-line.gold{border-color:var(--gold); color:var(--gold);}
.btn-select{margin-top:auto; border:1px solid var(--navy); color:var(--navy); border-radius:999px; padding:9px 0; width:100%; font-size:.85rem; font-weight:500; transition:all .3s ease;}
.btn-select:hover{background:var(--navy); color:var(--cream); transform:scale(1.03);}
.btn-select-gold{margin-top:auto; background:var(--gold); border-radius:999px; padding:10px 0; width:100%; font-size:.85rem; font-weight:500; color:var(--navy); transition:transform .3s var(--ease);}
.btn-select-gold:hover{transform:scale(1.03);}

.magnetic{position:relative; will-change:transform;}
.shimmer{position:relative; overflow:hidden;}
.shimmer::before{content:""; position:absolute; top:0; left:-75%; width:50%; height:100%; background:linear-gradient(75deg, transparent, rgba(255,255,255,.55), transparent); transform:skewX(-20deg); transition:left .65s var(--ease);}
.shimmer:hover::before{left:130%;}

/* ============ page transitions ============ */
.page{display:none;}
.page.active{display:block;}
.page-wrap{transition:opacity .42s var(--ease), transform .42s var(--ease), filter .42s var(--ease);}
.page-wrap.page-out{opacity:0; transform:translateY(14px) scale(.985); filter:blur(6px);}
.page-wrap.page-idle{opacity:1; transform:translateY(0) scale(1); filter:blur(0);}

/* ============ reveal ============ */
.reveal{opacity:0; transform:translateY(28px) scale(.98); transition:opacity .9s var(--ease) var(--d,0s), transform .9s var(--ease) var(--d,0s);}
.reveal.in-view{opacity:1; transform:translateY(0) scale(1);}

/* ============ tilt / glare ============ */
.tilt{transform-style:preserve-3d; position:relative; will-change:transform; transition:transform .5s var(--ease); height:100%;}
.tilt::after{content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(184,134,43,.16), transparent 55%); opacity:var(--gop,0); transition:opacity .35s ease;}

/* ============ hero ============ */
.hero{position:relative; overflow:hidden;}
.hero-gradient{background-image:linear-gradient(120deg,#0B1F3A 0%, #0e2447 50%, #0B1F3A 100%); background-size:200% 200%; animation:heroShift 14s ease infinite;}
@keyframes heroShift{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
.hero::before{content:""; position:absolute; inset:0; pointer-events:none; z-index:0; background:radial-gradient(650px circle at var(--mx,50%) var(--my,30%), rgba(31,79,216,.18), transparent 60%); }
.hero-inner{max-width:1280px; margin:0 auto; padding:80px 20px 96px; display:grid; gap:56px; align-items:center; position:relative; z-index:1;}
@media(min-width:1024px){.hero-inner{grid-template-columns:1fr 1fr; padding:112px 32px 128px;}}
.eyebrow{margin-bottom:20px;}
.hero h1{color:var(--cream); font-size:2.4rem; line-height:1.05; margin-bottom:24px;}
@media(min-width:640px){.hero h1{font-size:3rem;}}
@media(min-width:1024px){.hero h1{font-size:3.7rem;}}
.hero-sub{color:#c3cede; font-size:1.1rem; max-width:440px; margin-bottom:36px; line-height:1.6;}
.hero-ctas{display:flex; flex-wrap:wrap; gap:16px;}
.hero-card-wrap{display:flex; justify-content:center;}
@media(min-width:1024px){.hero-card-wrap{justify-content:flex-end;}}
.hero-card{position:relative; width:260px; height:160px; border-radius:20px; background:linear-gradient(135deg,var(--navy-light) 0%, var(--navy) 60%); border:1px solid #24406b; transition:transform .15s var(--ease);}
@media(min-width:640px){.hero-card{width:320px; height:190px;}}
.card-float{animation:floaty 5s ease-in-out infinite;}
@keyframes floaty{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.card-glow{box-shadow:0 25px 60px -20px rgba(31,79,216,.35), 0 10px 30px -12px rgba(0,0,0,.5);}
.card-sheen{position:absolute; inset:0; border-radius:inherit; overflow:hidden; pointer-events:none;}
.card-sheen::before{content:""; position:absolute; top:-50%; left:-60%; width:40%; height:200%; background:linear-gradient(75deg, transparent, rgba(255,255,255,.16), transparent); animation:sheenSweep 5s ease-in-out infinite;}
@keyframes sheenSweep{0%{left:-60%;}45%,100%{left:140%;}}
.card-mark{position:absolute; top:20px; left:24px;}
.card-mark-img{height:22px; width:auto; display:block; object-fit:contain;}
.card-footer{position:absolute; bottom:20px; left:24px; right:24px; display:flex; align-items:center; justify-content:space-between;}
.card-tier{font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:#8fa3c4;}
.card-status{display:flex; align-items:center; gap:6px; font-size:.68rem; color:var(--signal); font-family:'IBM Plex Mono',monospace;}
.pulse-dot{width:6px; height:6px; border-radius:50%; background:var(--signal); animation:pulse 1.8s ease-in-out infinite; display:inline-block;}
@keyframes pulse{0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(31,79,216,.5);}50%{opacity:.4; box-shadow:0 0 0 4px rgba(31,79,216,0);}}
.hero-in{opacity:0; transform:translateY(22px); animation:heroRise .9s var(--ease) forwards;}
.hero-in-1{animation-delay:.05s;} .hero-in-2{animation-delay:.18s;} .hero-in-3{animation-delay:.32s;} .hero-in-4{animation-delay:.46s;}
@keyframes heroRise{to{opacity:1; transform:translateY(0);}}
.scroll-cue{position:absolute; bottom:22px; left:50%; transform:translateX(-50%); z-index:1;}
.scroll-cue span{display:block; width:1px; height:30px; background:linear-gradient(var(--gold), transparent); animation:cueMove 1.8s ease-in-out infinite;}
@keyframes cueMove{0%{transform:translateY(-6px); opacity:0;}40%{opacity:1;}100%{transform:translateY(16px); opacity:0;}}

.ghost-divider{height:56px; overflow:hidden; line-height:0;}
.ghost-divider svg{width:100%; height:100%;}

.page-hero{padding:80px 20px; position:relative; overflow:hidden;}
.page-hero.center-head{text-align:center;}
.page-hero h1{font-size:2.4rem; margin-bottom:14px;}
@media(min-width:640px){.page-hero h1{font-size:3rem;}}

/* ============ stats band ============ */
.stats-band{background:#fff; padding:56px 20px; border-bottom:1px solid #f0ece0;}
.stats-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:32px; text-align:center;}
@media(min-width:768px){.stats-grid{grid-template-columns:repeat(4,1fr);}}
.stat-num{font-family:'IBM Plex Mono',monospace; font-size:2.1rem; color:var(--navy); margin-bottom:6px;}
.stat-label{font-size:.8rem; color:var(--slate);}
.stat-footnote{text-align:center; font-size:.68rem; color:#9a8f6f; margin-top:28px;}

/* ============ grids / cards ============ */
.grid-3{display:grid; gap:24px;}
@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,1fr);}}
.grid-4{display:grid; gap:20px;}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr);}}
.grid-5{display:grid; gap:20px;}
@media(min-width:768px){.grid-5{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-5{grid-template-columns:repeat(5,1fr);}}
.grid-features{display:grid; gap:24px;}
@media(min-width:640px){.grid-features{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-features{grid-template-columns:repeat(3,1fr);}}

.card-panel{border:1px solid #e4dcc9; border-radius:16px; padding:28px; background:#fff; height:100%;}
.card-panel.dark{background:var(--navy); border-color:var(--navy); box-shadow:0 20px 45px -25px rgba(11,31,58,.5);}
.card-panel h3{font-size:1.25rem; margin-bottom:12px; color:var(--navy);}

.feature-card{border:1px solid #e7e2d4; border-radius:14px; padding:24px; background:#fff; overflow:hidden;}
.feature-card h3{font-size:1rem; margin-bottom:8px; color:var(--navy);}
.feature-card p{font-size:.9rem; line-height:1.6; color:var(--slate);}
.ghost-hover{position:absolute; right:-12px; top:-12px; opacity:0; transition:opacity .3s ease, transform .3s ease; transform:rotate(0deg);}
.feature-ghost-img{width:40px; height:auto; display:block; object-fit:contain;}
.feature-card:hover .ghost-hover{opacity:1; transform:rotate(8deg);}

.placeholder-note{text-align:center; font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:#9a8f6f; margin-bottom:24px;}
.marquee-mask{overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, black 10%, black 90%, transparent); mask-image:linear-gradient(90deg, transparent, black 10%, black 90%, transparent);}
.marquee-track{display:flex; width:max-content; animation:marqueeScroll 22s linear infinite;}
.marquee-track span{font-family:'Fraunces',serif; color:var(--navy); font-size:1.1rem; white-space:nowrap; padding:0 32px; opacity:.7;}
@keyframes marqueeScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

.price-card{border:1px solid #e7e2d4; border-radius:18px; padding:24px; background:#fff; display:flex; flex-direction:column; height:100%;}
.price-card.popular{background:var(--navy); border-color:var(--gold); box-shadow:0 24px 50px -28px rgba(11,31,58,.55);}
.price-card h3{font-size:1.1rem; margin-bottom:4px; color:var(--navy);}
.price{font-family:'IBM Plex Mono',monospace; font-size:1.6rem; color:var(--navy); margin-bottom:10px;}
.price.sm{font-size:1.3rem;}
.hook{margin-bottom:24px; flex:1;}
.badge{position:absolute; top:-12px; left:24px; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; background:var(--gold); color:var(--navy); padding:4px 12px; border-radius:999px;}

/* ============ compare ============ */
.tier-card{border:1px solid #e7e2d4; border-radius:18px; padding:24px; background:#fff; display:flex; flex-direction:column; position:relative;}
.tier-card.popular{border-color:var(--gold);}
.tier-card h3{font-size:1.1rem; margin-bottom:6px; color:var(--navy);}
.spec-list{font-size:.75rem; margin:0 0 18px; color:var(--slate);}
.spec-list div{display:flex; justify-content:space-between; margin-bottom:4px;}
.expand-toggle{display:flex; align-items:center; gap:4px; font-size:.75rem; color:var(--signal); margin-bottom:12px; text-align:left;}
.chevron{display:inline-block; transition:transform .35s var(--ease);}
.expand-toggle.open .chevron{transform:rotate(180deg);}
.feature-collapse{max-height:0; overflow:hidden; transition:max-height .45s var(--ease);}
.feature-collapse ul{margin:0 0 18px; padding:0; list-style:none; font-size:.85rem; color:var(--slate);}
.feature-collapse li{margin-bottom:6px;}
.btn-select{margin-top:auto;}
.table-wrap{overflow-x:auto; border:1px solid #e7e2d4; border-radius:18px; background:#fff;}
table{width:100%; border-collapse:collapse; font-size:.85rem; min-width:640px;}
thead tr{background:var(--navy);}
th{text-align:left; padding:14px 20px; color:var(--cream); font-weight:500;}
td{padding:14px 20px; color:var(--slate);}
tr.alt{background:var(--cream);}
tbody tr{transition:background .25s ease;}
tbody tr:hover{background:#efe9d8;}
.bold{font-weight:600; color:var(--navy);}

/* ============ guardian console ============ */
.console-head{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:32px;}
.console-head h2{font-size:1.7rem;}
.live-pill{display:flex; align-items:center; gap:8px; font-size:.75rem; color:var(--cream); border:1px solid #2c4470; border-radius:999px; padding:8px 16px; letter-spacing:.05em;}
.scenario-row{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:32px;}
.scenario-btn{border:1px solid #2c4470; color:#c3cede; border-radius:999px; padding:9px 18px; font-size:.85rem; transition:all .3s var(--ease);}
.scenario-btn:hover{transform:scale(1.03);}
.scenario-btn.active{background:var(--gold); border-color:var(--gold); color:var(--navy);}
.console-grid{display:grid; gap:28px;}
@media(min-width:900px){.console-grid{grid-template-columns:1.4fr 1fr;}}
.signal-list{display:flex; flex-direction:column; gap:12px;}
.signal-row{display:grid; grid-template-columns:120px 1fr 48px; align-items:center; gap:12px;}
.signal-name{font-size:.78rem; color:#c3cede;}
.signal-bar-track{height:6px; border-radius:4px; background:#16294a; overflow:hidden;}
.signal-bar-fill{height:100%; border-radius:4px; background:var(--signal); transition:width .6s var(--ease), background .4s ease;}
.signal-val{font-size:.72rem; color:#8fa3c4; text-align:right;}
.gauge-panel{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; border:1px solid #22375d; border-radius:20px; padding:28px; background:rgba(255,255,255,0.02);}
.gauge-ring{width:150px; height:150px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background 1s ease;}
.gauge-hole{width:112px; height:112px; border-radius:50%; background:var(--navy); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;}
.gauge-pct{font-size:1.5rem; color:var(--cream);}
.gauge-label{font-size:.68rem; color:#9fb0c9; text-transform:uppercase; letter-spacing:.08em;}
.gauge-caption{font-size:.85rem; color:#c3cede; text-align:center; max-width:220px;}

.flow-wire{position:relative; height:3px; max-width:640px; margin:0 auto 40px; background:#ecebe4; border-radius:2px; overflow:hidden;}
.flow-dot{position:absolute; top:-3px; width:9px; height:9px; border-radius:50%; background:var(--signal); box-shadow:0 0 10px 2px rgba(31,79,216,.5); animation:flowMove 2.7s linear infinite;}
@keyframes flowMove{0%{left:0%; opacity:0;}8%{opacity:1;}92%{opacity:1;}100%{left:100%; opacity:0;}}
.flow-card{border:1px solid #e7e2d4; border-radius:16px; padding:24px; background:#fff; transition:transform .3s var(--ease);}
.flow-card.dark{background:var(--navy);}
.flow-card h3{font-size:1.1rem; color:var(--navy);}
.risk-bar-track{height:5px; border-radius:3px; background:#ecebe4; overflow:hidden; margin-top:10px;}
.risk-bar-fill{height:100%; border-radius:3px; transition:width .7s var(--ease), background .4s ease; background:var(--signal);}

/* ============ phantom+ ============ */
.toggle-wrap{display:inline-flex; align-items:center; gap:2px; border:1px solid #3a4c6d; border-radius:999px; padding:4px; position:relative; margin-top:8px;}
.toggle-pill{position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px); border-radius:999px; background:var(--gold); transition:left .4s var(--ease), width .4s var(--ease);}
.toggle-btn{position:relative; z-index:1; border-radius:999px; padding:8px 18px; font-size:.85rem; color:var(--cream); transition:color .3s ease;}
.toggle-btn.active{color:var(--navy);}
.plan-card{border:1px solid #e7e2d4; border-radius:18px; padding:28px; background:#fff; display:flex; flex-direction:column; height:100%;}
.plan-card.popular{background:var(--navy); border-color:var(--gold);}
.plan-card h3{font-size:1.2rem; margin-bottom:4px; color:var(--navy);}
.period{font-size:.85rem;}
.billed{margin-bottom:24px; font-size:.72rem; color:#9a8f6f;}
.billed.light{color:#9fb0c9;}
.check-list{list-style:none; margin:0 0 28px; padding:0; font-size:.88rem; color:var(--slate); flex:1;}
.check-list li{margin-bottom:8px; padding-left:20px; position:relative;}
.check-list li::before{content:"✓"; position:absolute; left:0; color:var(--gold);}
.check-list.light{color:#dbe3f0;}

/* ============ business ============ */
.form-panel{max-width:560px; margin:56px auto 0; border:1px solid #e7e2d4; border-radius:18px; padding:32px; background:#fff;}
.form-panel h3{font-size:1.2rem; margin-bottom:6px; color:var(--navy);}
.form-panel p{margin-bottom:20px;}
#bizForm{display:flex; flex-direction:column; gap:14px;}
#bizForm input{border:1px solid #d8d0ba; border-radius:10px; padding:11px 16px; font-size:.9rem; transition:border-color .3s ease, box-shadow .3s ease;}
.input-focus:focus{outline:none; border-color:var(--signal); box-shadow:0 0 0 3px rgba(31,79,216,.15);}

/* ============ faq ============ */
.faq-list{display:flex; flex-direction:column; gap:12px;}
.faq-item{border:1px solid #e7e2d4; border-radius:14px; background:#fff; overflow:hidden;}
.faq-q{width:100%; display:flex; justify-content:space-between; align-items:center; padding:18px 20px; font-size:.9rem; font-weight:500; color:var(--navy); text-align:left;}
.faq-plus{color:var(--gold); font-size:1.2rem; line-height:1; transition:transform .35s var(--ease); display:inline-block;}
.faq-q.open .faq-plus{transform:rotate(45deg);}
.faq-collapse{max-height:0; overflow:hidden; transition:max-height .45s var(--ease);}
.faq-collapse p{padding:0 20px 18px; font-size:.88rem; line-height:1.6; color:var(--slate);}

/* ============ cart ============ */
.cart-section{display:flex; justify-content:center;}
.cart-panel{width:100%; max-width:520px; border:1px solid #e7e2d4; border-radius:20px; padding:32px; background:#fff;}
.cart-panel h1{font-size:1.5rem; margin-bottom:24px;}
.model-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:24px;}
.model-btn{border:1px solid #e7e2d4; border-radius:14px; padding:14px 16px; text-align:left; display:flex; flex-direction:column; gap:4px; transition:all .3s var(--ease); color:var(--navy);}
.model-btn span{font-size:.75rem; color:#9a8f6f;}
.model-btn.active{background:var(--navy); border-color:var(--navy); color:var(--cream);}
.model-btn.active span{color:#9fb0c9;}
.model-btn:hover{transform:translateY(-2px);}
.qty-row{display:flex; align-items:center; gap:16px; margin-bottom:28px;}
.qty-btn{width:36px; height:36px; border-radius:50%; border:1px solid var(--navy); color:var(--navy); display:flex; align-items:center; justify-content:center; transition:transform .2s ease;}
.qty-btn:hover{transform:scale(1.1);}
.qty-btn:active{transform:scale(.95);}
#qtyValue{min-width:24px; text-align:center; display:inline-block; color:var(--navy);}
.total-row{display:flex; justify-content:space-between; align-items:center; border-top:1px solid #e7e2d4; padding-top:20px; margin-bottom:24px;}
.total-value{font-size:1.5rem; color:var(--navy);}

/* ============ footer ============ */
.footer{background:var(--navy); padding:56px 20px;}
.footer-inner{display:flex; flex-direction:column; gap:32px; justify-content:space-between;}
@media(min-width:640px){.footer-inner{flex-direction:row;}}
.footer-logo{display:flex; align-items:center; gap:8px; margin-bottom:12px; font-family:'Fraunces',serif; color:var(--cream);}
.footer-logo-img{height:18px; width:auto; display:block; object-fit:contain;}
.footer-sub{font-size:.75rem; color:#8fa3c4; max-width:280px;}
.footer-links{display:flex; flex-wrap:wrap; gap:16px 40px;}
.footer-links button{font-size:.9rem; color:#c3cede; position:relative; transition:color .3s ease;}
.footer-links button::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--gold); transition:width .3s var(--ease);}
.footer-links button:hover{color:var(--cream);}
.footer-links button:hover::after{width:100%;}
.footer-copy{text-align:center; font-size:.68rem; color:#5f7396; margin-top:40px;}

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