/* Concept 1 · Immersive Visual Storytelling: Minimal Monochromatic Gray Luxury
   Palette (owner-specified): Pearl White #F3F3F1 · Silver Gray #C5C7C8 · Stone Gray #92979B · Graphite #535960 · Deep Charcoal #22262A
   Richness comes from type, light, shadow and tonal steps, never from colour accents. */
:root{
  --pearl:#F3F3F1; --silver:#C5C7C8; --stone:#92979B; --graphite:#535960; --charcoal:#22262A;
  --pearl-2:#E8E9E7; --pearl-3:#DCDEDD; --charcoal-2:#2C3136; --charcoal-3:#1A1D20; --white:#FFFFFF;
  --ink:var(--charcoal); --ink-2:var(--graphite); --on-dark:var(--pearl); --on-dark-2:var(--silver);
  --metal:linear-gradient(100deg,#9AA0A5 0%,#D9DBDC 30%,#A3A8AC 52%,#E4E6E7 70%,#8C9196 100%);
  --metal-btn:linear-gradient(180deg,#E3E4E4 0%,#C5C7C8 55%,#B3B6B8 100%);
  --metal-btn-hover:linear-gradient(180deg,#EDEEEE 0%,#D3D5D6 55%,#C1C4C6 100%);
  --hair:rgba(34,38,42,.12); --hair-2:rgba(34,38,42,.24); --hair-d:rgba(243,243,241,.14); --hair-d2:rgba(243,243,241,.26);
  --shadow:0 1px 2px rgba(34,38,42,.06),0 18px 40px -22px rgba(34,38,42,.28);
  --shadow-lg:0 2px 6px rgba(0,0,0,.18),0 50px 90px -40px rgba(0,0,0,.65);
  --scrim:rgba(26,29,32,.4); --veil:var(--pearl);
  --display:"Instrument Serif",Georgia,serif; --body:"Manrope",system-ui,sans-serif;
  --gutter:clamp(1.1rem,4.5vw,4rem); --max:1320px;
  --hdr-h:72px; --tap:48px; --btn-h:54px; --r:16px; --r-sm:10px; --r-pill:999px; --focus-w:2px; --icon:16px; --ck:20px;
  --drawer-w:440px; --blur:14px; --blur-sm:2px; --shift:6px; --lift:4px; --focus-off:3px; --r-focus:4px; --persp:1600px; --glow-blur:10px; --err:#7A2E2E;
  --btn-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 1px 2px rgba(0,0,0,.18),0 10px 24px -12px rgba(0,0,0,.45);
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--pearl)}
body{background:var(--pearl);color:var(--ink);font:400 1.0625rem/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip;text-rendering:optimizeLegibility}
::selection{background:var(--graphite);color:var(--pearl)}
a{color:inherit}
img,svg{display:block}
img{max-width:100%}
:focus-visible{outline:var(--focus-w) solid currentColor;outline-offset:var(--focus-off);border-radius:var(--r-focus)}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.d{font-family:var(--display);font-weight:400;letter-spacing:-.012em;line-height:1.02;text-wrap:balance}
.d em{font-style:italic}
.label{font:600 .72rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
.lede{color:var(--ink-2);max-width:56ch;font-size:clamp(1rem,1.25vw,1.125rem)}
.fine{font-size:.8125rem;color:var(--ink-2);max-width:70ch}
.ph{position:absolute;right:.6rem;bottom:.6rem;z-index:3;font:600 .6875rem var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--pearl);background:rgba(26,29,32,.62);padding:.28rem .55rem;border-radius:var(--r-pill);pointer-events:none}
.metal{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ck{width:var(--ck);height:var(--ck);flex:none}
.ck circle{fill:none;stroke:currentColor;stroke-width:1.2;opacity:.45}
.ck path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* Header */
.hdr{position:fixed;top:0;left:0;right:0;z-index:30;color:var(--on-dark);border-bottom:var(--line) solid transparent;transition:background-color var(--d-overlay) ease,color var(--d-overlay) ease,border-color var(--d-overlay) ease}
.past-hero .hdr,.no-hero .hdr{background:rgba(243,243,241,.9);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));color:var(--ink);border-color:var(--hair)}
.hdr .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--hdr-h)}
.burger{justify-self:start;display:inline-flex;align-items:center;gap:.8rem;height:var(--tap);padding:0 .75rem 0 0;background:none;border:0;color:inherit;cursor:pointer;font:600 .72rem var(--body);letter-spacing:.18em;text-transform:uppercase}
.burger .bars{display:grid;gap:.42rem;width:1.7rem}
.burger .bars i{height:var(--line);background:currentColor;transform-origin:left center;transition:transform var(--d-sweep) var(--ease-out)}
.burger .bars i:last-child{transform:scaleX(.55)}
@media (hover:hover) and (pointer:fine){.burger:hover .bars i:last-child{transform:scaleX(1)}}
.burger .lbl{display:none}
.mark{text-decoration:none;font-family:var(--display);font-size:1.8rem;line-height:1;letter-spacing:-.01em}
@media (min-width:760px){.burger .lbl{display:inline}.mark{font-size:2.05rem}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;min-height:var(--btn-h);padding:0 1.6rem;border-radius:var(--r-pill);font:700 .8125rem var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:0}
.btn .arr{width:var(--icon);height:var(--icon)}
.btn-silver{background:var(--metal-btn);color:var(--charcoal);box-shadow:var(--btn-shadow)}
.btn-silver::before{background:var(--metal-btn-hover)}
.btn-ghost{color:var(--on-dark);box-shadow:inset 0 0 0 var(--line) var(--hair-d2)}
.btn-ghost::before{background:rgba(243,243,241,.1)}
.btn-dark{background:var(--charcoal);color:var(--pearl)}
.btn-dark::before{background:var(--graphite)}
.btn-line{color:var(--ink);box-shadow:inset 0 0 0 var(--line) var(--hair-2)}
.btn-line::before{background:var(--pearl-2)}

/* Hero: smoky graphite light, the review dashboard floating in it */
.hero{position:relative;overflow:hidden;color:var(--on-dark);background:var(--charcoal-3);padding:calc(var(--hdr-h) + clamp(2rem,6vh,4.5rem)) 0 clamp(3rem,8vh,5.5rem)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 78% 30%,rgba(197,199,200,.16) 0%,transparent 60%),radial-gradient(60% 80% at 10% 90%,rgba(83,89,96,.35) 0%,transparent 65%),linear-gradient(180deg,rgba(26,29,32,.55) 0%,rgba(26,29,32,.35) 40%,rgba(26,29,32,.85) 100%);z-index:1;pointer-events:none}
.hero .wrap{position:relative;z-index:2}
.hero h1{font-size:clamp(2.7rem,6.3vw,6.1rem);line-height:1;letter-spacing:-.018em}
@media (min-width:1100px){.hero h1{white-space:nowrap;font-size:min(6.1rem,6.15vw)}}
.hero .second{display:block;font-family:var(--display);font-style:italic;font-size:clamp(1.8rem,4vw,3.9rem);line-height:1.05;margin-top:.35rem;color:var(--silver)}
.hero .second b{font-weight:400;font-style:normal;color:var(--pearl)}
.hero-grid{display:grid;gap:clamp(2rem,4vw,3.5rem);margin-top:clamp(1.25rem,3vw,2.5rem);align-items:start}
.hero .sub{font-size:clamp(1.05rem,1.4vw,1.25rem);color:var(--on-dark-2);max-width:34ch}
.hero .ctas{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.hero .assure{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;margin-top:1.4rem;color:var(--on-dark-2);font-size:.875rem}
.hero .assure span{display:inline-flex;align-items:center;gap:.45rem}
.hero .assure .ck{width:1rem;height:1rem;color:var(--silver)}
@media (max-width:759px){.hero{padding-top:calc(var(--hdr-h) + 1.5rem)}.hero .ctas .btn{flex:1 1 100%}}

/* Dashboard theme */
.ui{--ui-font:var(--body); --ui-num:var(--display)}
.ui .num{font-weight:400;font-size:3rem}
.dark-ui{--ui-bg:#2A2F34; --ui-panel:#343A40; --ui-ink:#F3F3F1; --ui-ink-2:#C5C7C8; --ui-line:rgba(243,243,241,.1); --ui-accent:#D9DBDC; --ui-track:rgba(243,243,241,.12); --ui-flag:#D9C3A8; --ui-flag-bg:rgba(217,195,168,.12); --ui-ok:#B9CFC4; --ui-ok-bg:rgba(185,207,196,.12); --ui-hl:rgba(197,199,200,.25)}
.light-ui{--ui-bg:#FFFFFF; --ui-panel:#F0F0EE; --ui-ink:#22262A; --ui-ink-2:#535960; --ui-line:rgba(34,38,42,.1); --ui-accent:#22262A; --ui-track:rgba(34,38,42,.1); --ui-flag:#7A4F2E; --ui-flag-bg:rgba(122,79,46,.09); --ui-ok:#3E6252; --ui-ok-bg:rgba(62,98,82,.1); --ui-hl:rgba(146,151,155,.28)}

/* Sections */
.pad{padding-block:clamp(3rem,7vw,6rem)}
.pearl-2{background:var(--pearl-2)}
.tone{background:linear-gradient(180deg,var(--pearl) 0%,var(--pearl-2) 100%)}
.dark{background:var(--charcoal);color:var(--on-dark)}
.dark .lede,.dark .fine{color:var(--on-dark-2)}
.dark .label{color:var(--on-dark-2)}
h2.d{font-size:clamp(2rem,4.4vw,3.6rem)}
.sec-head{display:grid;gap:.7rem;margin-bottom:clamp(1.5rem,3.5vw,2.5rem)}
.sec-head .lede{margin:0}
@media (min-width:980px){.sec-head.split{grid-template-columns:1fr 1fr;align-items:end;column-gap:4rem}}

/* Benefits checklist */
.expect{display:grid;gap:clamp(1.75rem,4vw,4rem);align-items:start}
.expect .story{font-size:1.0625rem;color:var(--ink-2);max-width:48ch;border-left:var(--line) solid var(--stone);padding-left:1.25rem}
.checklist{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.checklist li{display:flex;gap:.7rem;align-items:flex-start;background:var(--white);border-radius:var(--r-sm);padding:.95rem .95rem 1rem;box-shadow:var(--shadow);font-weight:600;font-size:.9375rem;line-height:1.35}
.checklist .ck{color:var(--graphite);margin-top:.05rem}
@media (min-width:980px){.expect{grid-template-columns:5fr 6fr}.checklist li{padding:1.2rem 1.2rem 1.25rem;font-size:1rem}}

/* Credit issues grid */
.issues{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.issues li{display:flex;align-items:center;gap:.6rem;min-height:3.25rem;padding:.6rem .8rem;border-radius:var(--r-sm);background:var(--white);border:var(--line) solid var(--hair);font-weight:600;font-size:.875rem;line-height:1.25;transition:border-color var(--d-hover) ease,transform var(--d-sweep) var(--ease-out)}
.issues .ck{width:1.05rem;height:1.05rem;color:var(--graphite)}
@media (hover:hover) and (pointer:fine){.issues li:hover{border-color:var(--stone);transform:translateY(-2px)}}
@media (min-width:760px){.issues{grid-template-columns:repeat(3,1fr)}.issues li{font-size:.9375rem}}
@media (min-width:1100px){.issues{grid-template-columns:repeat(4,1fr);gap:.65rem}.issues li{min-height:3.6rem;padding:.75rem 1rem}}
.issues-note{margin-top:1.1rem}

/* Two-iPhone section */
@media (min-width:980px){.phones-grid{grid-template-columns:5fr 6fr}}
.ui-msg{display:grid;gap:.5rem}
.ui-msg p{padding:.55rem .7rem;border-radius:var(--ui-r-sm);background:var(--ui-panel);font-size:.75rem;line-height:1.4}
.ui-msg small{color:var(--ui-ink-2);font-size:.6875rem}

/* Pricing */
.prices{display:grid;gap:.85rem}
.price{background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);padding:1.35rem 1.25rem 1.3rem;display:flex;flex-direction:column;gap:.85rem;border:var(--line) solid var(--hair)}
.price-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}
.price h3{font-family:var(--display);font-weight:400;font-size:1.6rem;line-height:1.05}
.flash{flex:none;font:700 .6875rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--pearl);background:var(--charcoal);padding:.38rem .6rem;border-radius:var(--r-pill)}
.amt{display:flex;align-items:baseline;gap:.7rem}
.amt s{color:var(--graphite);font-size:1.05rem}
.amt b{font-family:var(--display);font-weight:400;font-size:3.4rem;line-height:.9;letter-spacing:-.02em}
.price .desc{color:var(--ink-2);font-size:.9375rem}
.incl{list-style:none;padding:.85rem 0 0;border-top:var(--line) solid var(--hair);display:grid;gap:.45rem}
.incl li{display:flex;gap:.55rem;align-items:flex-start;font-size:.875rem;line-height:1.4}
.incl .ck{width:1.05rem;height:1.05rem;color:var(--graphite);margin-top:.05rem}
.price .btn{margin-top:auto;width:100%}
.price.simple{justify-content:flex-start}
.price.simple .desc{flex:1}
@media (min-width:760px){.prices{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1180px){.prices{grid-template-columns:repeat(6,1fr);gap:1rem}.prices>.price:nth-child(-n+3){grid-column:span 2}.prices>.price:nth-child(n+4){grid-column:span 3}
  .prices>.price.simple{display:grid;grid-template-columns:1fr auto;grid-template-areas:"head head" "amt btn" "desc desc";column-gap:1.5rem;align-items:end}
  .prices>.price.simple .price-head{grid-area:head}.prices>.price.simple .amt{grid-area:amt}.prices>.price.simple .btn{grid-area:btn;width:auto;margin:0}.prices>.price.simple .desc{grid-area:desc}}
.price-note{margin-top:1.25rem}
.price-more{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}

/* How it works: big editorial numerals, 2x2 */
.steps{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 1rem;counter-reset:s}
.steps li{display:grid;gap:.45rem;align-content:start;padding-top:1rem;border-top:var(--line) solid var(--hair-d2)}
.steps .n{font-family:var(--display);font-size:clamp(2.6rem,6vw,4.4rem);line-height:.85;color:var(--silver)}
.steps h3{font-weight:700;font-size:1rem;line-height:1.3}
.steps p{font-size:.875rem;line-height:1.5;color:var(--on-dark-2)}
@media (min-width:980px){.steps{grid-template-columns:repeat(4,1fr);gap:2rem}.steps h3{font-size:1.125rem}.steps p{font-size:.9375rem}}
.steps-foot{margin-top:clamp(1.75rem,3vw,2.5rem)}

/* Final CTA */
.final{position:relative;overflow:hidden;color:var(--on-dark);background:var(--charcoal-2)}
.final .bg{position:absolute;inset:-8% 0;opacity:.32}
.final .bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.final::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,29,32,.92) 0%,rgba(26,29,32,.55) 60%,rgba(26,29,32,.35) 100%)}
.final .wrap{position:relative;z-index:1;padding-block:clamp(3.5rem,9vw,6.5rem)}
.final h2{max-width:15ch}
.final .lede{color:var(--on-dark-2);margin-top:1rem}
.final .ctas{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.75rem}

/* Sub-pages */
.page-hero{padding:calc(var(--hdr-h) + clamp(2.5rem,7vw,5rem)) 0 clamp(1.5rem,4vw,2.5rem)}
.page-hero h1{font-size:clamp(2.5rem,6vw,5rem);max-width:16ch}
.page-hero .lede{margin-top:1rem}
.blocks{display:grid;gap:.75rem}
.block{background:var(--white);border-radius:var(--r);padding:clamp(1.25rem,3vw,2rem);box-shadow:var(--shadow);display:grid;gap:.6rem}
.block .n{font-family:var(--display);font-style:italic;font-size:1.25rem;color:var(--stone)}
.block h2,.block h3{font-family:var(--display);font-weight:400;font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.08}
.block p{color:var(--ink-2)}
@media (min-width:860px){.blocks{grid-template-columns:1fr 1fr;gap:1rem}}
.svc-list{display:grid;gap:.75rem}
@media (min-width:860px){.svc-list{grid-template-columns:repeat(2,1fr)}}
.chips{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.chips li{padding:.5rem .9rem;border-radius:var(--r-pill);background:var(--white);border:var(--line) solid var(--hair);font-size:.9rem;font-weight:500}
.dark .chips li{background:transparent;border-color:var(--hair-d2);color:var(--pearl)}
.howlist{list-style:none;padding:0;display:grid;gap:.75rem}
.howlist li{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:start;background:var(--white);border-radius:var(--r);padding:1.25rem 1.25rem 1.35rem;box-shadow:var(--shadow)}
.howlist .n{font-family:var(--display);font-size:3rem;line-height:.8;color:var(--stone);min-width:2.4ch}
.howlist h2{font-family:var(--display);font-weight:400;font-size:1.65rem;line-height:1.1}
.howlist p{color:var(--ink-2);margin-top:.35rem}
@media (min-width:860px){.howlist{grid-template-columns:1fr 1fr}}
.faq{display:grid;gap:.6rem;max-width:56rem}
.faq details{background:var(--white);border-radius:var(--r-sm);border:var(--line) solid var(--hair)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.05rem 1.15rem;font-weight:700;font-size:1rem;line-height:1.35;min-height:var(--tap)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{flex:none;width:1.25rem;height:1.25rem;position:relative}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:.8rem;height:var(--focus-w);background:currentColor;transform:translate(-50%,-50%);transition:transform var(--d-sweep) var(--ease-out)}
.faq summary .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] summary .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq .ans{padding:0 1.15rem 1.15rem;color:var(--ink-2);max-width:62ch}
.contact-grid{display:grid;gap:clamp(1.5rem,4vw,3rem);align-items:start}
@media (min-width:900px){.contact-grid{grid-template-columns:4fr 6fr}}
.cinfo{list-style:none;padding:0;display:grid;gap:.85rem}
.cinfo li{display:grid;gap:.1rem}
.cinfo b{font-weight:600}
.cinfo a{text-decoration:none;font-family:var(--display);font-size:1.6rem}
.form{background:var(--white);border-radius:var(--r);padding:clamp(1.25rem,3vw,2rem);box-shadow:var(--shadow);display:grid;gap:.9rem}
.form .row{display:grid;gap:.9rem}
@media (min-width:600px){.form .row{grid-template-columns:1fr 1fr}}
.field{display:grid;gap:.35rem}
.field label{font-weight:600;font-size:.875rem}
.field label small{font-weight:500;color:var(--ink-2)}
.field input,.field textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--pearl);border:var(--line) solid var(--hair-2);border-radius:var(--r-sm);padding:.8rem .9rem;min-height:var(--tap);transition:border-color var(--d-hover) ease,background-color var(--d-hover) ease}
.field textarea{min-height:8rem;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--charcoal);background:var(--white)}
.field .err{display:none;color:var(--err);font-size:.8125rem}
.field.bad input,.field.bad textarea{border-color:var(--err)}
.field.bad .err{display:block}
.form .note{font-size:.8125rem;color:var(--ink-2)}
.form-status{display:none;padding:.85rem 1rem;border-radius:var(--r-sm);background:var(--pearl-2);font-size:.9375rem}
.form-status.show{display:block}
.prose{max-width:46rem;display:grid;gap:1rem;color:var(--ink-2)}
.prose h2{font-family:var(--display);font-weight:400;font-size:1.8rem;color:var(--ink);margin-top:1rem}
.draft{display:inline-block;font:700 .6875rem var(--body);letter-spacing:.14em;text-transform:uppercase;background:var(--charcoal);color:var(--pearl);padding:.35rem .6rem;border-radius:var(--r-pill)}
.login-card{max-width:30rem;background:var(--white);border-radius:var(--r);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--shadow);display:grid;gap:1rem}
.empty{border:var(--line) dashed var(--stone);border-radius:var(--r);padding:clamp(2rem,6vw,4rem);text-align:center;display:grid;gap:.75rem;background:var(--white)}
.empty .d{font-size:clamp(2rem,4.5vw,3.4rem)}
.empty p:last-child{color:var(--ink-2)}
.stories{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:1rem}
.stories .story{background:var(--white);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.story-open{display:block;width:100%;padding:0;border:0;background:var(--pearl-2);cursor:zoom-in;aspect-ratio:3/4}
.story-open img{width:100%;height:100%;object-fit:cover}
.stories .story figcaption{padding:.8rem 1rem 1rem;font-size:.9rem}
.stories .story .meta{display:block;font-size:.75rem;color:var(--ink-2);margin-bottom:.2rem}
.lightbox{border:0;padding:0;background:transparent;max-width:min(92vw,60rem);max-height:90vh}
.lightbox::backdrop{background:rgba(26,29,32,.82)}
.lightbox img{max-height:84vh;width:auto;border-radius:var(--r-sm)}
.lightbox button{position:absolute;top:.5rem;right:.5rem;min-width:var(--tap);min-height:var(--tap);border-radius:50%;border:0;background:var(--pearl);cursor:pointer}
.consent{margin-top:1.5rem;display:grid;gap:.35rem}

/* Footer */
.foot{background:var(--pearl-2);padding-block:clamp(3rem,7vw,4.5rem) 1.5rem;border-top:var(--line) solid var(--hair)}
.foot-top{display:grid;gap:2rem}
.foot .mark{font-size:2.5rem}
.tag{margin-top:.6rem;color:var(--ink-2);max-width:30ch}
.foot .label{display:block;margin-bottom:.8rem}
.foot ul{list-style:none;padding:0;display:grid;gap:.45rem;color:var(--ink-2)}
.foot ul a{color:var(--ink)}
.foot-links{display:grid;grid-template-columns:1fr 1fr;gap:.45rem 1.5rem}
.legal{display:flex;gap:1.5rem;flex-wrap:wrap;margin-top:2.25rem;padding-top:1.25rem;border-top:var(--line) solid var(--hair);font-size:.9375rem}
.legal a{text-decoration:none}
.copy-line{margin-top:1.25rem;font-size:.8125rem;color:var(--ink-2)}
@media (min-width:900px){.foot-top{grid-template-columns:2fr 1.3fr 1fr}}

/* Drawer */
.overlay{background:rgba(26,29,32,.4);backdrop-filter:blur(var(--blur-sm));-webkit-backdrop-filter:blur(var(--blur-sm))}
.drawer{width:min(var(--drawer-w),90vw);background:var(--pearl);color:var(--ink);display:flex;flex-direction:column;padding:0 clamp(1.25rem,4vw,2.25rem) 1.5rem;box-shadow:var(--shadow-lg)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;height:var(--hdr-h);flex:none}
.drawer .mark{font-size:1.75rem}
.x{width:var(--tap);height:var(--tap);display:grid;place-items:center;border-radius:50%;background:var(--pearl-2);border:0;color:var(--ink);cursor:pointer;transition:background-color var(--d-hover) ease,transform var(--d-sweep) var(--ease-out)}
.x svg{width:var(--icon);height:var(--icon)}
@media (hover:hover) and (pointer:fine){.x:hover{background:var(--pearl-3);transform:rotate(90deg)}}
.nav{list-style:none;padding:0;margin-top:clamp(.25rem,2vh,1.25rem)}
.nav a{display:flex;align-items:center;gap:1rem;min-height:2.95rem;text-decoration:none;font-family:var(--display);font-size:clamp(1.55rem,3.6vh,2.05rem);line-height:1.05}
.nav a .t{transition:transform var(--d-sweep) var(--ease-out)}
.nav a::after{content:"";flex:1;height:var(--line);background:var(--hair-2);transform:scaleX(0);transform-origin:left center;transition:transform var(--d-sweep) var(--ease-out)}
.nav a[aria-current] .t{font-style:italic}
.nav a[aria-current]::after{transform:scaleX(.25)}
@media (hover:hover) and (pointer:fine){.nav a:hover .t{transform:translateX(var(--shift))}.nav a:hover::after{transform:scaleX(1)}}
.nav .login{font-family:var(--body);font-size:.9375rem;font-weight:700;margin-top:.4rem;gap:.7rem}
.nav .login::after{display:none}
.soon{font:600 .6875rem var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);background:var(--pearl-2);padding:.32rem .6rem;border-radius:var(--r-pill)}
.drawer-foot{margin-top:auto;padding-top:1.25rem;border-top:var(--line) solid var(--hair);display:grid;gap:.15rem}
.drawer-foot a{text-decoration:none;font-family:var(--display);font-size:1.5rem}
.drawer-foot p{font-size:.875rem;color:var(--ink-2)}

.veil span{font-family:var(--display);font-size:clamp(2.2rem,5vw,3.2rem);color:var(--ink)}
.metal .wi{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

/* Mobile: compact package comparison */
@media (max-width:759px){
  .incl{grid-template-columns:1fr 1fr;column-gap:.75rem;row-gap:.4rem}
  .incl li{font-size:.8125rem;line-height:1.35}
  .price{padding:1.15rem 1.05rem;gap:.7rem}
  .amt b{font-size:2.9rem}
}

/* Homepage pricing on phones: a swipeable row instead of five stacked cards */
.swipe-hint{display:none}
@media (max-width:759px){
  .swipe-hint{display:block;margin:-.75rem 0 .75rem}
  .rail-m{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.75rem;margin-inline:calc(-1 * var(--gutter));padding:.25rem var(--gutter) 1rem;scroll-padding-inline:var(--gutter);scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .rail-m::-webkit-scrollbar{display:none}
  .rail-m>.price{flex:0 0 84%;scroll-snap-align:start}
}
/* Solid fallbacks so the header and silver buttons keep their contrast even where gradients or the hero photo are absent */
.hdr{background-color:var(--charcoal-3)}
.btn-silver{background-color:var(--silver)}