/* A Little Santa Magic: the "clean sheet" design system (Kev, 30 Oct 2026). Spec: DESIGN.md.
   White pages, evergreen ink, Santa red only on the action that buys or starts the product.
   Linked last in the head of every page by scripts/build_pages.py (before assets/device.css). It
   restyles the existing markup only: no ids, names, fields or scripts change. Rules start with
   "html" so they win over the page's own style blocks wherever those sit in the head. */

@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/young-serif-latin-400-normal.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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --cl-paper:#ffffff;
  --cl-snow:#f3f6f4;
  --cl-ink:#16231d;
  --cl-ink-2:#46544d;
  --cl-line:#dde3df;
  --cl-red:#b3202b;
  --cl-red-dk:#931821;
  --cl-pine:#1d5b3d;
  --cl-display:"Young Serif","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --cl-body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --cl-script:"Pinyon Script","Snell Roundhand","Apple Chancery",cursive;
  --cl-body-size:17px;
  /* the landers' own tokens, mapped onto the white system */
  --pine:#ffffff;
  --pine-2:#f3f6f4;
  --pine-3:#dde3df;
  --ivory:#16231d;
  --ivory-dim:#46544d;
  --dim:#46544d;
  --ink:#16231d;
  --ink-soft:#46544d;
  --berry:#b3202b;
  --berry-hi:#931821;
  --brass:#1d5b3d;
  --display:var(--cl-display);
  color-scheme:light;
}

/* base */
html body{background:var(--cl-paper);color:var(--cl-ink);font-family:var(--cl-body);font-size:var(--cl-body-size);line-height:1.6;color-scheme:light}
html h1,html h2,html h3{font-family:var(--cl-display);font-weight:400;letter-spacing:-.005em;color:var(--cl-ink)}
html body h1 em,html body h2 em,html body h1 i,html body h2 i{font-style:normal!important;color:inherit!important;font-family:inherit!important}
/* no tracked all caps labels anywhere */
html body *{text-transform:none!important}
html body :not(h1):not(h2):not(h3){letter-spacing:0!important}
html a{color:inherit;text-decoration-color:var(--cl-pine);text-underline-offset:3px}
html :focus-visible{outline:3px solid var(--cl-pine);outline-offset:3px}
html .eyebrow{font:600 15px/1.3 var(--cl-body);letter-spacing:0;text-transform:none;color:var(--cl-pine)}
html .lede{color:var(--cl-ink-2)}
html .lfs-terms,html .lfs-terms a{color:var(--cl-ink-2)!important}
html .lfs-terms{font-size:13.5px!important}
html .free-quiet{color:var(--cl-ink-2)!important;font-size:15px!important}
html .free-quiet a{color:var(--cl-ink)!important;font-weight:600}
html ::selection{background:#d9eadf}

/* header and logo */
html header.top{position:relative;inset:auto;background:var(--cl-paper);border-bottom:1px solid var(--cl-line);top:auto}
html header.top .wrap{padding-block:12px}
html .brand{font-family:var(--cl-display);font-size:20px;color:var(--cl-ink);gap:.35em}
html .brand i{color:var(--cl-red)}
html .top-cta{color:var(--cl-ink);border-bottom-color:var(--cl-red)}

/* buttons */
html .btn{border-radius:12px;font:600 18px/1.15 var(--cl-body);min-height:58px;padding:0 22px;box-shadow:none;letter-spacing:0}
html .btn-primary{background:var(--cl-red);color:#fff;box-shadow:0 2px 0 var(--cl-red-dk)}
html .btn-primary:hover{background:var(--cl-red-dk);transform:none}
html .btn-primary:active{transform:translateY(1px);box-shadow:none}
html .btn-ghost{background:var(--cl-paper);color:var(--cl-ink);border:1.5px solid var(--cl-ink)}
html .btn-ghost:hover{border-color:var(--cl-red)}
html .btn[disabled]{opacity:.5}

/* lander hero (LF, CF; the VF hero further down) */
html .hero{background:var(--cl-paper);overflow:visible}
html section.hero,html section.page-hero{padding:0}
html .hero::before,html .hero-img{display:none}
html .hero:not(.vf-hero)>.motion{display:none}
html .hero:not(.vf-hero) .wrap{padding-block:20px 40px;grid-template-columns:minmax(0,1fr);gap:0;align-items:start}
html .hero:not(.vf-hero) .wrap>div{display:contents}
html .hero:not(.vf-hero) .eyebrow{display:none}
html .hero:not(.vf-hero) h1{order:1;font-size:34px;line-height:1.08;margin:0 0 10px;max-width:18em}
html .hero:not(.vf-hero) .lede{order:2;font-size:17px;line-height:1.5;max-width:34em;margin:0 0 16px}
html .hero:not(.vf-hero) .cl-product,html .hero:not(.vf-hero) .phone{order:3}
html .hero:not(.vf-hero) .hero-actions{order:4;margin:16px 0 0;display:grid;gap:10px}
html .hero:not(.vf-hero) .hero-actions .btn{width:100%}
html .hero:not(.vf-hero) .hero-actions .price-note{display:none}
html .hero:not(.vf-hero) .hero-actions+.lfs-terms{order:6}
html .hero:not(.vf-hero) .soon-note{order:5;background:#fff7e6;border-color:#e6c98c;color:var(--cl-ink)}
html .hero:not(.vf-hero) .trust{order:5;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:15px;color:var(--cl-ink)}
html .hero:not(.vf-hero) .trust span::before,html .hero:not(.vf-hero) .trust span+span::before{content:"";flex:none;width:12px;height:7px;border:solid var(--cl-pine);border-width:0 0 2.5px 2.5px;transform:rotate(-45deg) translateY(-2px);border-radius:0;background:none}
html .hero:not(.vf-hero) .trust b{color:var(--cl-ink);font-weight:600}
html .hero:not(.vf-hero) .facts{display:none}
html .hero:not(.vf-hero) .free-quiet{order:7;margin-top:14px!important}
html .hero:not(.vf-hero) .letter-stage{display:contents}
html .hero:not(.vf-hero) .letter-stage .letter{display:none}
html .hero:not(.vf-hero) .try{order:8}

/* the real product on the first screen */
html .cl-product{margin:0;position:relative}
html .cl-product img{display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 1px 2px rgba(22,35,29,.12),0 10px 24px -14px rgba(22,35,29,.45)}
html .cl-product figcaption{margin-top:8px;font-size:13.5px;line-height:1.4;color:var(--cl-ink-2)}
html .cl-product.cl-crop{overflow:hidden;border-radius:4px;box-shadow:0 1px 2px rgba(22,35,29,.12),0 10px 24px -14px rgba(22,35,29,.45)}
html .cl-product.cl-crop img{box-shadow:none;border-radius:0}

/* the "hear Santa's voice" try box: quiet, outlined */
html .try{margin-top:28px;background:var(--cl-snow);border:1px solid var(--cl-line);border-radius:12px;backdrop-filter:none;padding:16px}
html .try label{font:600 16px/1.3 var(--cl-body);letter-spacing:0;text-transform:none;color:var(--cl-ink)}
html .try input{background:#fff;color:var(--cl-ink);border:1px solid #b9c3bd;font-size:17px}
html .try small{color:var(--cl-ink-2);font-size:14px}
html .listen{background:#fff;color:var(--cl-ink);border:1.5px solid var(--cl-ink)}
html .listen .ic{background:var(--cl-ink)}

/* call-first hero: the incoming call card, in white */
html .phone{background:#fff;border:1px solid var(--cl-line);box-shadow:0 1px 2px rgba(22,35,29,.1),0 14px 30px -18px rgba(22,35,29,.5);width:min(100%,340px);margin:0 auto;padding:20px 20px 18px;gap:10px;border-radius:28px}
html .phone .ph-top,html .phone .ph-sub{color:var(--cl-ink-2)}
html .phone .ph-av{background:var(--cl-red);box-shadow:none;color:#fff;width:64px;height:64px;font-size:24px}
html .phone .ph-name{color:var(--cl-ink);font-family:var(--cl-display);font-size:28px}
html .phone .ph-line{background:var(--cl-snow);border-color:var(--cl-line);color:var(--cl-ink);font-family:var(--cl-display);font-style:normal;font-size:19px}
html .phone .ph-ai{color:var(--cl-pine);font-weight:600}
html .phone .ph-keys span{width:50px;height:50px}

@media (min-width:861px){
  html .hero:not(.vf-hero) .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(32px,5vw,72px);padding-block:48px 72px;align-items:start}
  html .hero:not(.vf-hero) h1,html .hero:not(.vf-hero) .lede,html .hero:not(.vf-hero) .hero-actions,html .hero:not(.vf-hero) .lfs-terms,html .hero:not(.vf-hero) .trust,html .hero:not(.vf-hero) .soon-note,html .hero:not(.vf-hero) .free-quiet,html .hero:not(.vf-hero) .try{grid-column:1}
  html .hero:not(.vf-hero) .cl-product,html .hero:not(.vf-hero) .phone{grid-column:2;grid-row:1 / span 8;align-self:start}
  html .hero:not(.vf-hero) h1{font-size:clamp(44px,4.2vw,58px);margin-top:12px}
  html .hero:not(.vf-hero) .lede{font-size:19px}
  html .hero:not(.vf-hero) .hero-actions{justify-items:start}
  html .hero:not(.vf-hero) .hero-actions .btn{width:auto;min-width:340px}
}

/* sections */
html section{padding-block:48px}
html .sec-head{gap:10px;margin-bottom:28px}
html .sec-head h2{font-size:28px;line-height:1.15;max-width:20em}
html .sec-head p{color:var(--cl-ink-2);font-size:17px}
html .samples,html section.tint{background:var(--cl-snow)}
@media (min-width:861px){
  html section{padding-block:88px}
  html .sec-head h2{font-size:40px}
  html .sec-head p{font-size:18px}
}

/* how it works: a real sequence, so numbered */
html .steps li{border-top:1px solid var(--cl-line);padding-top:18px;gap:6px}
html .steps li::before{font:400 30px/1 var(--cl-display);font-style:normal;color:var(--cl-pine)}
html .steps h3{font-size:21px;line-height:1.25}
html .steps p{color:var(--cl-ink-2)}

/* sample letters and the letter card */
html .sample{background:#fff;color:var(--cl-ink);border:1px solid var(--cl-line);border-radius:6px;box-shadow:none}
html .sample .who{font:600 14px/1.3 var(--cl-body);letter-spacing:0;text-transform:none;color:var(--cl-ink-2)}
html .sample blockquote{font-family:Georgia,"Times New Roman",serif;font-size:17px;color:var(--cl-ink)}
html .sample .play{background:#fff;border:1.5px solid var(--cl-ink);color:var(--cl-ink)}
html .sample .play .ic{background:var(--cl-ink)}
html .sample .bar{background:var(--cl-line)}
html .sample .bar i{background:var(--cl-pine)}
html .disclose{color:var(--cl-ink-2)}
html .letter{background:#fff;color:var(--cl-ink);box-shadow:0 1px 2px rgba(22,35,29,.12),0 10px 24px -14px rgba(22,35,29,.45);transform:none}
html .letter::before{border-color:#e6d6ad}
html .letter-body{font-family:Georgia,"Times New Roman",serif}
html .letterhead{color:var(--cl-ink-2)}
html .name{background:linear-gradient(transparent 62%,#f3dfa9 62%)}

/* the "That's me" moment and the product spotlights */
html .moment blockquote{font-family:var(--cl-display);font-style:normal;color:var(--cl-ink)}
html .moment p,html .spot p{color:var(--cl-ink-2)}
html .media{background:var(--cl-snow);box-shadow:none;border-radius:8px}
html .media .tag,html .tag,html .vtag{background:rgba(255,255,255,.94);color:var(--cl-ink);font:600 12.5px/1 var(--cl-body);letter-spacing:0;text-transform:none;padding:7px 10px;border-radius:6px}
html .spot h3{font-size:28px}
html .price-chip,html .spot .price-chip{background:var(--cl-snow);color:var(--cl-ink);border:1px solid var(--cl-line);border-radius:8px;font-weight:700}

/* pause control on looping clips */
html .motion{background:rgba(255,255,255,.94);color:var(--cl-ink);border:1px solid var(--cl-line);backdrop-filter:none}

/* questions */
html .faq details{border-bottom:1px solid var(--cl-line);padding-block:16px}
html .faq summary{font:600 18px/1.35 var(--cl-body);color:var(--cl-ink);min-height:48px;align-items:center}
html .faq summary::after{color:var(--cl-pine);font-size:24px;line-height:1}
html .faq details p{color:var(--cl-ink-2)}
html .faq details p a,html .disclose a{color:var(--cl-ink);text-decoration-color:var(--cl-pine)}

/* the closing call to action */
html .final{background:var(--cl-snow);border-top:1px solid var(--cl-line)}
html .final video,html .final::before{display:none}
html .final .eyebrow{display:none}
html .final h2{font-size:30px;line-height:1.12;color:var(--cl-ink)}
html .final p{color:var(--cl-ink-2)}
html .final .btn{width:100%;max-width:440px}
html .final .lfs-terms{margin-top:12px!important}
@media (min-width:861px){html .final h2{font-size:44px}}

/* the old order panel (never opened by the one tap buttons) in the same system */
html .summary,html .receipt{background:#fff;color:var(--cl-ink);border:1px solid var(--cl-line);box-shadow:none}
html .choice{background:#fff;border-color:var(--cl-line)}
html .choice:has(input:checked),html .offer-card.hl{background:#f1f7f3;border-color:var(--cl-pine)}
html .offer-card{background:#fff;border-color:var(--cl-line)}
html .offer-card .badge,html .badge{background:var(--cl-pine);color:#fff}
html .stepdots li.on{background:var(--cl-pine);color:#fff;border-color:var(--cl-pine)}
html .closed{background:#fff7e6}

/* footer: quiet */
html footer{background:var(--cl-paper);border-top:1px solid var(--cl-line);color:var(--cl-ink-2);font-size:14px}
html footer .legal a,html footer a,html .cc-link{color:var(--cl-ink-2)}

/* sticky buy bar (behavior from js and device.css unchanged) */
@media (max-width:860px){
  html .mbar{background:#fff;border-top:1px solid var(--cl-line);box-shadow:0 -6px 18px -12px rgba(22,35,29,.35)}
  html .mbar .mb-note{color:var(--cl-ink-2);font-size:14px}
  html .mbar .mb-note b{color:var(--cl-ink);font-size:17px;font-weight:700}
  html .mbar .mb-note small{color:var(--cl-pine);font-size:12.5px;font-weight:600}
  html .mbar .btn{min-height:50px;border-radius:12px;font-size:17px}
}

/* video first hero (VF, video-495; scripts/build_pages.py VF_HERO) */
html .vf-hero .wrap.vf-grid{padding-block:20px 40px;gap:0;display:flex;flex-direction:column;align-items:stretch}
html .vf-hero .vf-head,html .vf-hero .vf-copy,html .vf-hero .vf-media{display:contents}
html .vf-hero .eyebrow{display:none}
html .vf-hero h1{order:1;font-size:34px;line-height:1.08;margin:0 0 10px;color:var(--cl-ink);max-width:18em}
html .vf-hero .lede.vf-sub{order:2;font-size:17px;line-height:1.5;color:var(--cl-ink-2);margin:0 0 16px;max-width:34em}
html .vf-hero .vframe{order:3}
html .vf-hero .vf-buy{order:4;margin-top:16px;display:grid;gap:10px;justify-items:stretch}
html .vf-hero .soon-note{order:5}
html .vf-hero .vf-trust li:has(>b){display:none}
html .vf-hero .vf-trust{order:5;margin:12px 0 0;gap:6px 16px;font-size:15px;color:var(--cl-ink)}
html .vf-hero .gr-promise{order:6;margin:10px 0 0;font-size:15px;color:var(--cl-ink-2);max-width:34em}
html .vf-hero .vf-buy+.lfs-terms{order:7}
html .vf-hero .vf-steps{order:8;margin-top:28px}
html .vf-hero .vf-ai{order:9;color:var(--cl-ink-2);font-size:14px}
html .vf-hero .vf-try{order:10;margin-top:8px}
html .vf-hero .vframe{aspect-ratio:720/690;border-radius:6px;box-shadow:0 1px 2px rgba(22,35,29,.12),0 10px 24px -14px rgba(22,35,29,.45);background-color:#2a1d18;width:100%}
html .vf-hero .vframe::after{display:none}
html .vf-hero .vframe .vcap{display:none}
html .vf-hero .vframe>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
html .vf-hero .vframe.gr-real{aspect-ratio:4/5}
html .vframe .gr-proofbtn{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);min-height:52px;padding:0 20px 0 14px;display:inline-flex;align-items:center;gap:10px;background:#fff;color:var(--cl-ink);font:600 16px/1 var(--cl-body);border-radius:999px;box-shadow:0 6px 20px -8px rgba(0,0,0,.55);white-space:nowrap}
html .vframe .gr-proofbtn::before{content:"";width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent var(--cl-red);margin-left:4px}
html .vf-buy .btn{width:100%;min-height:58px;font-size:18px}
html .vf-buy .price-note{display:none}
html .vf-trust li::before{content:"";width:12px;height:7px;border:solid var(--cl-pine);border-width:0 0 2.5px 2.5px;transform:rotate(-45deg) translateY(-2px);flex:none}
html .vf-trust b{color:var(--cl-ink)}
html .vf-steps li{color:var(--cl-ink-2);font-size:16px}
html .vf-steps li::before{color:var(--cl-pine);font:400 20px/1 var(--cl-display);font-style:normal}
html .vf-steps b{color:var(--cl-ink)}
html .vf-try .free-quiet{margin-top:14px!important}
@media (min-width:861px){
  html .vf-hero .wrap.vf-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(32px,5vw,72px);padding-block:48px 72px;align-items:start}
  html .vf-hero .wrap.vf-grid>*,html .vf-hero h1,html .vf-hero .vf-sub,html .vf-hero .vf-buy,html .vf-hero .vf-trust,html .vf-hero .gr-promise,html .vf-hero .lfs-terms,html .vf-hero .vf-steps,html .vf-hero .vf-ai,html .vf-hero .soon-note{grid-column:1;grid-row:auto}
  html .vf-hero .vframe{grid-column:2;grid-row:1 / span 9;align-self:start}
  html .vf-hero h1{font-size:clamp(44px,4.2vw,58px);margin-top:12px}
  html .vf-hero .lede.vf-sub{font-size:19px}
  html .vf-hero .vf-buy{justify-items:start}
  html .vf-hero .vf-buy .btn{width:auto;min-width:340px}
}

/* proof block on the video pages (src/lib/page_fixes.js) */
html .gr-proof .eyebrow{display:block}
html .gr-proof .cap,html .gr-promise{color:var(--cl-ink-2)}
html .gr-proof video{background:#2a1d18}
html .gr-promise b{color:var(--cl-ink)}

/* page family: free letter, bundle, policy pages */
html .page-hero{background:var(--cl-paper)}
html .page-hero .wrap{padding-block:20px 8px;gap:10px}
html .page-hero h1{font-size:34px;line-height:1.08;color:var(--cl-ink)}
html .page-hero .lede{font-size:17px;line-height:1.5;color:var(--cl-ink-2)}
html .badge-free{background:#e7f2eb;color:var(--cl-pine);font:600 14px/1 var(--cl-body);letter-spacing:0;text-transform:none;border-radius:6px;padding:8px 10px}
@media (min-width:861px){html .page-hero h1{font-size:clamp(44px,4.2vw,58px)}html .page-hero .lede{font-size:19px}}
html .meta,html .note{color:var(--cl-ink-2)}
html .meta b{color:var(--cl-ink)}
html .paper{background:#fff;color:var(--cl-ink);border:1px solid var(--cl-line);border-radius:12px;box-shadow:none}
html .paper::before{display:none}
html .paper h2{color:var(--cl-ink)}
html .paper label{color:var(--cl-ink);font:600 15px/1.35 var(--cl-body)}
html .paper input,html .paper select,html .paper textarea{border:1px solid #b9c3bd;background:#fff;color:var(--cl-ink);font:500 17px var(--cl-body);min-height:50px}
html .paper input:focus,html .paper select:focus,html .paper textarea:focus{border-color:var(--cl-pine);outline:2px solid var(--cl-pine);outline-offset:0}
html .paper .check{color:var(--cl-ink)}
html .paper .note{color:var(--cl-ink-2)}
html .paper .disclosure{background:var(--cl-snow);border-left-color:var(--cl-pine);color:var(--cl-ink)}
html .paper .btn{width:100%}
html .paper legend{color:var(--cl-ink)!important;font-size:15px!important}
html .paper li{color:var(--cl-ink)}
html .paper li::before{background:var(--cl-pine)}
html .what li{color:var(--cl-ink)}
html .what li::before{content:"";flex:none;width:12px;height:7px;margin-top:.45em;border:solid var(--cl-pine);border-width:0 0 2.5px 2.5px;transform:rotate(-45deg)}
html .sample.cl-plain{border:0;border-radius:0;overflow:visible}
html .callout{background:var(--cl-snow);border-color:var(--cl-line);border-left-color:var(--cl-pine)}
html .callout p,html .prose strong,html .prose h3,html .ph{color:var(--cl-ink)}
html .prose p,html .prose li,html .toc li a{color:var(--cl-ink-2)}
html .prose a{color:var(--cl-ink)}
html .prose h2 .n{font-style:normal;color:var(--cl-pine)}
html .toc{border-top-color:var(--cl-line)}
html .toc summary{color:var(--cl-pine);letter-spacing:0;text-transform:none;font-size:15px}
html .lines .muted,html .receipt small{color:var(--cl-ink-2)}
html .save{color:var(--cl-red)}
html .total{border-top-color:var(--cl-line);font-family:var(--cl-display)}
html .skip{background:var(--cl-ink);color:#fff}

/* the free letter page: hero action and product (scripts/build_pages.py clear_free_hero) */
html .cl-hero-act{display:grid;gap:10px;margin-top:6px}
html .cl-hero-act .btn{width:100%}
html .cl-hero-act .cl-sub{font-size:15px;color:var(--cl-ink);display:flex;flex-wrap:wrap;gap:6px 16px;margin:0}
html .cl-hero-act .cl-sub span{display:inline-flex;align-items:center;gap:8px}
html .cl-hero-act .cl-sub span::before{content:"";flex:none;width:12px;height:7px;border:solid var(--cl-pine);border-width:0 0 2.5px 2.5px;transform:rotate(-45deg) translateY(-2px)}
html .page-hero .cl-product{margin-top:4px}
@media (min-width:861px){
  html .page-hero .wrap.cl-split{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);column-gap:clamp(32px,5vw,72px);align-items:start;padding-block:48px 24px}
  html .page-hero .wrap.cl-split>*{grid-column:1}
  html .page-hero .wrap.cl-split>.cl-product{grid-column:2;grid-row:1 / span 6}
  html .cl-hero-act{justify-items:start}
  html .cl-hero-act .btn{width:auto;min-width:340px}
}

/* grandparent pages: slightly larger reading size */
html.cl-gp{--cl-body-size:18.5px}
html.cl-gp .hero h1,html.cl-gp .vf-hero h1,html.cl-gp .page-hero h1{font-size:36px}
html.cl-gp .hero .lede,html.cl-gp .vf-hero .lede.vf-sub,html.cl-gp .page-hero .lede{font-size:18.5px}
html.cl-gp .faq summary{font-size:19px}
html.cl-gp .paper label{font-size:16px}
@media (min-width:861px){html.cl-gp .hero h1,html.cl-gp .vf-hero h1,html.cl-gp .page-hero h1{font-size:clamp(46px,4.3vw,60px)}}

@media (max-width:380px){html .hero h1,html .vf-hero h1,html .page-hero h1{font-size:30px}}

/* checkout sheets (js/onetap.js: name, then email, then Stripe) */
html #lfs-coemail>form{background:#fff!important;color:var(--cl-ink)!important;border:1px solid var(--cl-line)!important;border-radius:16px!important;box-shadow:0 20px 50px -20px rgba(22,35,29,.35)}
html #lfs-coemail-h{font-family:var(--cl-display)!important;font-weight:400!important;font-size:26px!important;color:var(--cl-ink)!important}
html #lfs-coemail p,html #lfs-coemail label{color:var(--cl-ink-2)!important}
html #lfs-coemail label[for]{color:var(--cl-ink)!important}
html #lfs-coemail input[type=text],html #lfs-coemail input[type=email]{border:1px solid #b9c3bd!important;border-radius:10px!important;min-height:50px;font-size:17px!important;color:var(--cl-ink)!important;background:#fff!important}
html #lfs-coemail input[type=text]:focus,html #lfs-coemail input[type=email]:focus{outline:2px solid var(--cl-pine)!important;border-color:var(--cl-pine)!important}
html #lfs-coemail button[type=submit]{background:var(--cl-red)!important;border-radius:12px!important;min-height:56px;font-size:18px!important;box-shadow:0 2px 0 var(--cl-red-dk)}
html #lfs-coemail button[type=submit]:hover{background:var(--cl-red-dk)!important}
html #lfs-coemail #lfs-coname-hear{border:1.5px solid var(--cl-ink)!important;color:var(--cl-ink)!important;border-radius:999px!important}
html #lfs-coemail [data-lfs-pname]{color:var(--cl-red)!important}
html #lfs-coemail div[style*="#fffaf0"]{background:#fff!important;border-color:var(--cl-line)!important}
html #lfs-coemail div[style*="#0f2a22"]{background:var(--cl-snow)!important;color:var(--cl-ink)!important;border:1px solid var(--cl-line)}
html #lfs-coemail div[style*="#0f2a22"] p{color:var(--cl-ink)!important;letter-spacing:0!important;text-transform:none!important}
html #lfs-coemail div[style*="#0f2a22"] p:first-child{color:var(--cl-pine)!important;font-size:14px!important}
html #lfs-coemail div[style*="#0f2a22"] [data-lfs-pname]{color:var(--cl-red)!important}
html #lfs-onetap{background:#fff!important;color:var(--cl-ink)!important;border:1px solid var(--cl-line)!important;box-shadow:0 12px 30px -14px rgba(22,35,29,.4)!important}
html #lfs-onetap .lfs-ot-act{border-radius:12px;border-color:var(--cl-red)}
html #lfs-zoom .lfs-zoom-x{background:#fff;color:var(--cl-ink);border-color:var(--cl-line)}

/* pop ups and banners the scripts draw: the shared type and buttons */
html .lfs-ex h2,html .gr-dlg h2,html .gr-dlg h3,html #lfs-aff h2,html .lfs-ccd h2,html .lfs-ex-price b{font-family:var(--cl-display)!important;font-weight:400!important;color:var(--cl-ink)}
html .lfs-ex-eye{letter-spacing:0!important;text-transform:none!important;font-size:14px!important;color:var(--cl-pine)!important}
html .lfs-ex-btn:not(.ghost),html .gr-btn:not(.ghost),html #lfs-aff .go{background:var(--cl-red)!important;color:#fff!important;border-radius:12px!important;min-height:52px;box-shadow:0 2px 0 var(--cl-red-dk)}
html .lfs-ex-btn.ghost,html .gr-btn.ghost{border-radius:12px!important;background:#fff!important;color:var(--cl-ink)!important;border:1.5px solid var(--cl-ink)!important}
html .lfs-ex-card,html .gr-dlg,html #lfs-aff .box{border-radius:16px!important}
html .lfs-cc{background:#fff!important;border:1px solid var(--cl-line)!important;border-top:1px solid var(--cl-line)!important}
html .lfs-b{border-radius:10px!important}
html .lfs-b.lfs-fill{background:var(--cl-ink)!important;color:#fff!important;border-color:var(--cl-ink)!important}
html .lfs-ccd{background:#fff!important;color:var(--cl-ink)!important}
html .lfs-co-err,html .lfs-co-msg{color:var(--cl-red)}

/* shared details */
html body .brand i{color:var(--cl-red)!important}
html .q-btn{border-radius:12px!important;min-height:56px;box-shadow:0 2px 0 var(--cl-red-dk)}
html .vframe .vcap{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
html .cert{background:#fff!important;color:var(--cl-ink)!important;border:1px solid var(--cl-line)}
html .cert h3,html .cert p,html .cert .who{color:var(--cl-ink)!important}
html #lfs-coemail,html .gr-ov,html #lfs-zoom,html .lfs-ex{background-color:rgba(22,35,29,.55)!important}

/* free video pages (FV, QV): the form's first question on the first phone screen */
@media (max-width:860px){
  html .v-hero .v-chips{display:none}
  html .v-hero .v-clip{aspect-ratio:2/1;margin-top:10px}
  html .v-hero{margin-bottom:8px}
}
html .v-clip{background:#2a1d18}
html .v-chips li{background:var(--cl-snow);color:var(--cl-ink);border-color:var(--cl-line)}

/* paid landers audit: the free letter link stays off the paid first screen (it is in the footer),
   the Santa Promise shows once, the popup close button sits inside its border */
html .hero .free-quiet,html .vf-hero .free-quiet{display:none}
html .gr-proof .gr-promise{display:none}
html .gr-dlg .gr-x{top:10px!important;right:10px!important}
html .gr-dlg{padding-top:48px!important}
html .vl-btn{background:var(--cl-red)!important;color:#fff!important;border-radius:12px!important;min-height:58px;box-shadow:0 2px 0 var(--cl-red-dk);font:600 18px/1.15 var(--cl-body)!important}
html .vl-btn:hover{background:var(--cl-red-dk)!important}
html body .btn-primary{color:#fff!important}
html .cl-added{margin:12px 16px 0;padding:14px 16px;border-radius:12px;background:#e7f2eb;color:var(--cl-ink);font:600 17px/1.4 var(--cl-body);border:1px solid #c6d3cb}
html .hero .cl-hero-act,html .page-hero .cl-hero-act{margin-top:8px}
html .tx-btn,html .ss-btn{background:var(--cl-red)!important;color:#fff!important;border-radius:12px!important;min-height:56px;box-shadow:0 2px 0 var(--cl-red-dk)}
/* the Christmas Eve gift guide keeps its own white layout: the shared type and red action */
html .gg-tag{background:#e7f2eb!important;color:var(--cl-pine)!important}
/* step forms and the texts page: their sections are parts of a card or a band, not page sections */
html section.q-step,html section.ss-hero,html section.tx-band{padding-block:0}
/* the caption on the sample clip: a flat band, no gradient wash */
html .v-cap{background:rgba(22,35,29,.72)!important;padding:8px 10px!important}
/* tap targets: 48 px or more */
html .gr-x{width:48px!important;height:48px!important}
html .gr-row a,html .gr-row button,html .gr-no,html .gr-ec-btn{min-height:48px!important}
@media (max-width:860px){
  html .ss-hero .wrap{padding-block:16px 12px!important;gap:10px}
  html .ss-hero h1{font-size:34px}
  html.cl-gp .ss-hero h1{font-size:36px}
  html .tx-band .wrap{padding-top:0}
  html .tx-paper{gap:12px}
}
html #mbar.lfs-mbar-x.cl-cc-on{transform:none}
/* tap targets of 48 px or more on every page (logo, header link, FAQ rows, players, dialogs) */
html .brand,html .q-brand,html .vl-brand{display:inline-flex;flex-wrap:wrap;align-items:center;align-content:center;column-gap:.27em;min-height:48px}
html .top-cta,html header .back{display:inline-flex;align-items:center;min-height:48px}
html summary{min-height:48px;align-items:center;box-sizing:border-box}
html .toc summary{display:flex}
html button.play,html button.motion,html .vctl,html button.copy,html .btn,html .gg-more,html .link-btn,html .q-btn,html .q-back{min-height:48px}
html button.motion.sm{min-width:48px}
html .gg-filters button,html [data-age]{min-height:48px}
html input[type=email],html input[type=text],html input[type=tel],html input[type=search],html select,html textarea{min-height:48px}
html button.link,html a.dl,html a.ss-all,html .fn-msg a.btn-link{display:inline-flex;align-items:center;min-height:48px}
html .lfs-ex-x,html #lfs-coname-x,html #lfs-coemail-x,html .gr-x{min-width:48px!important;min-height:48px!important}
html .lfs-ex-no,html #lfs-coname-hear,html #lfs-ex-email,html #lfs-ex-phone{min-height:48px!important}
html .related a,html .rel a,html nav.more a{min-height:48px;display:inline-flex;align-items:center}
/* the affiliate email step: a light scrim and the shared colors */
html #lfs-aff{background:rgba(243,246,244,.96)}
html #lfs-aff .eb{color:var(--cl-pine)}
html #lfs-aff .go{background:var(--cl-red);border-radius:12px}
html summary,html .toc summary,html .faq summary{min-height:48px!important}
html button.play,html .btn,html button.btn,html .gg-music,html #cin,html #chatform button,html .chat button{min-height:48px!important}
html .gg-alt a,html a.gg-alt{display:inline-flex;align-items:center;min-height:48px}
/* sample captions on the offer cards: a flat band, readable */
html .fn-pv-cap{background:rgba(22,35,29,.72)!important}
html .fn-pv-label{color:var(--cl-ink)!important}
html .gg-deal a{display:inline-flex;align-items:center;min-height:48px}
html .gg-deal{background:var(--cl-snow)!important;color:var(--cl-ink)!important;border-bottom:1px solid var(--cl-line)}html .gg-deal a{color:var(--cl-pine)!important}
html #qconfirm-use{white-space:normal;overflow-wrap:normal;word-break:normal;line-height:1.25;padding-block:10px;height:auto}
html .cl-share-note{margin:8px 0 12px;padding:10px 14px;border-radius:12px;background:#e7f2eb;color:var(--cl-ink);font:600 15px/1.4 var(--cl-body);border:1px solid #c6d3cb}
@media (max-width:860px){html .tx-paper{padding:14px}html .tx-paper .tx-note{padding:10px 12px;margin:0}}
@media (max-width:860px){html .q-proc .v-cam,html .q-proc .q-ic{margin:0 auto 4px}html .q-proc .v-cam svg,html .q-proc .q-ic svg{width:36px;height:36px}html .q-proc h2{margin-top:0}}
/* Santa red is spent on buying only: the gift guide's music button and card rules are evergreen */
html .gg-music{background:#fff!important;color:var(--cl-pine)!important;border:1px solid var(--cl-line)!important}
html .gg-bundle{border-top-color:var(--cl-pine)!important}
html #toast,html .toast{background:var(--cl-ink)!important;color:#fff!important}
/* the name over the video stays light on the picture; the share box is outlined, not red */
html .player .nm,html .stage .cap,html .stage .cap b{color:#fff!important;text-shadow:0 1px 4px rgba(0,0,0,.7)}
html .gr-box{border-color:var(--cl-line)!important}
/* the gift guide's red accents become evergreen: red stays on the buying buttons only */
html .hero-fig img{border-color:var(--cl-line)!important}
html .eyebrow,html .crumbs a,html .crumbs li+li::before,html .gg-tiles span,html .ours-grid em,html .gg-more,html .faq summary::after,html footer nav a,html .gg-music-ico{color:var(--cl-pine)!important}
html .gg-tiles a:hover,html .ours-grid a:hover,html .gg-ages button{border-color:var(--cl-line)!important}
html .gg-ages button{color:var(--cl-ink)!important}
html .gg-ages button[aria-pressed="true"]{background:var(--cl-ink)!important;color:#fff!important;border-color:var(--cl-ink)!important}
html .ours-grid a{border-top-color:var(--cl-pine)!important}
html .gg-card-img{border-bottom-color:var(--cl-line)!important}
html .gg-sub{border-top-color:var(--cl-line)!important}
html .gg-bundle-list li::before{background:var(--cl-pine)!important;color:var(--cl-pine)!important}
html .gg-music{box-shadow:0 2px 10px rgba(22,35,29,.14)!important}
html .brand,html .q-brand,html .vl-brand{flex-wrap:nowrap;white-space:nowrap}
html .top-cta{color:var(--cl-ink)!important;border-bottom-color:var(--cl-pine)!important}
html .cta-card{border-left-color:var(--cl-pine)!important}
html .page-hero .f2,html .final .f4{color:#c6d3cb!important}
html .hero-fig img{outline-color:var(--cl-line)!important}
