/* Layout: a quiet workbench (tabs + notes) around six full landing-page mockups, each in a browser frame. Mockups commit to the silverlynx brand (silver + charcoal, Trebuchet); the workbench follows the viewer's theme. */
:root{
  --bg:#EDEDEB; --panel:#F7F7F5; --ink:#111315; --muted:#5C5F63; --line:#C9CACC; --chip:#E1E2E3; --chip-on:#111315; --chip-on-ink:#F7F7F5; --note:#FFFFFF;
  --font-head:"Trebuchet MS","Lucida Grande",Arial,sans-serif;
  --font-body:Arial,"Helvetica Neue",sans-serif;
  /* brand, fixed in mockups */
  --sl-plat:#E5E4E2; --sl-silver:#C0C0C0; --sl-flat:#BFBFBF; --sl-matte:#A6A6A6; --sl-sand:#BEC0C2; --sl-char:#111315; --sl-white:#FFFFFF; --sl-ink2:#3A3D41;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#0D0E10;--panel:#17191B;--ink:#E5E4E2;--muted:#A6A6A6;--line:#2E3134;--chip:#24272A;--chip-on:#E5E4E2;--chip-on-ink:#111315;--note:#1D2023;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0D0E10;--panel:#17191B;--ink:#E5E4E2;--muted:#A6A6A6;--line:#2E3134;--chip:#24272A;--chip-on:#E5E4E2;--chip-on-ink:#111315;--note:#1D2023;color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 60px}
h1,h2,h3,h4{font-family:var(--font-head);text-wrap:balance;margin:0}
.top{display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--line)}
.brand{display:flex;gap:12px;align-items:center}
.brand svg{width:26px;height:42px;color:var(--ink)}
.brand h1{font-size:20px;letter-spacing:.01em}
.brand p{margin:0;color:var(--muted);font-size:13px}
nav.tabs{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);display:flex;gap:8px;flex-wrap:wrap;padding-block:12px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
nav.tabs a{font-family:var(--font-head);text-decoration:none;color:var(--ink);background:var(--chip);padding:7px 12px;border-radius:999px;font-size:13.5px;white-space:nowrap}
nav.tabs a .n{color:var(--muted);margin-right:6px;font-variant-numeric:tabular-nums}
nav.tabs a[aria-current="page"]{background:var(--chip-on);color:var(--chip-on-ink)}
nav.tabs a[aria-current="page"] .n{color:inherit;opacity:.6}
nav.tabs a:focus-visible,.btn:focus-visible{outline:2px solid var(--sl-matte);outline-offset:2px}
.view{display:none}
.view.on{display:block}
.intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:24px;align-items:start;margin:8px 0 18px}
.intro p{margin:0 0 8px;max-width:68ch}
.intro .use{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-size:13.5px}
.intro .use b{font-family:var(--font-head)}
@media (max-width:760px){.intro{grid-template-columns:minmax(0,1fr)}}

/* Advisor tab */
.adv{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px}
@media (max-width:860px){.adv{grid-template-columns:minmax(0,1fr)}}
.adv section{margin-bottom:26px}
.adv h2{font-size:24px;margin-bottom:10px}
.adv h3{font-size:16px;margin:18px 0 6px}
.adv p,.adv li{max-width:66ch}
.adv ol,.adv ul{padding-left:20px;margin:6px 0}
.adv li{margin-bottom:6px}
.oneliner{font-family:var(--font-head);font-size:clamp(22px,3.2vw,32px);line-height:1.2;margin:4px 0 14px;max-width:24ch}
.ladder{display:grid;gap:10px}
.rung{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:12px 14px}
.rung h4{font-size:16px}
.rung .price{font-family:var(--font-head);font-variant-numeric:tabular-nums;white-space:nowrap}
.rung p{grid-column:1/-1;margin:0;color:var(--muted);font-size:14px}
.decide{background:var(--note);border:1px solid var(--line);border-radius:6px;padding:14px 16px}
.decide li{margin-bottom:8px}
.math{font-variant-numeric:tabular-nums}
.math td{padding:4px 10px 4px 0;border-bottom:1px solid var(--line)}
.math td:last-child{text-align:right}
.tbl{overflow-x:auto}

/* Browser frame */
.frame{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--sl-white);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.bar{display:flex;gap:10px;align-items:center;padding:9px 12px;background:#DADBDC;border-bottom:1px solid #BFBFBF}
.dots{display:flex;gap:6px}.dots i{width:10px;height:10px;border-radius:50%;background:#A6A6A6;display:block}
.url{flex:1;min-width:0;background:#F2F2F1;color:#3A3D41;border-radius:6px;padding:4px 10px;font-size:12.5px;font-family:var(--font-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ===== Mockup base (fixed brand colors) ===== */
.site{color:var(--sl-char);font-family:var(--font-body);background:var(--sl-white);font-size:16px;line-height:1.6}
.site .in{max-width:1020px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.site h1,.site h2,.site h3{font-family:var(--font-head);color:inherit}
.site p{margin:0 0 14px}
.site .nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:16px;flex-wrap:wrap}
.site .logo{display:flex;align-items:center;gap:10px;font-family:var(--font-head);font-size:20px;letter-spacing:.02em;color:inherit;text-decoration:none}
.site .logo svg{width:20px;height:33px}
.site .nav .links{display:flex;gap:16px;font-size:14px;flex-wrap:wrap}
.site .nav .links span{opacity:.75}
.btn{display:inline-block;font-family:var(--font-head);font-size:16px;text-decoration:none;padding:12px 20px;border-radius:4px;border:1px solid transparent;cursor:pointer}
.btn.dark{background:var(--sl-char);color:var(--sl-plat)}
.btn.light{background:var(--sl-plat);color:var(--sl-char)}
.btn.ghost{background:transparent;border-color:currentColor;color:inherit}
.band{padding-block:56px}
.eyebrow{font-family:var(--font-head);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-bottom:10px;display:block}
.cols{display:grid;gap:24px}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){.c2,.c3{grid-template-columns:minmax(0,1fr)}}
.quote{font-family:var(--font-head);font-size:17px;line-height:1.45;margin:0 0 6px}
.who{font-size:13.5px;opacity:.75}
.who a{color:inherit;text-underline-offset:2px}
.fine{font-size:13px;opacity:.7}
.ph{background:#FFF7D6;color:#5A4A00;padding:0 4px;border-radius:3px;font-size:.92em}
.form{display:grid;gap:10px;max-width:520px}
.form label{font-family:var(--font-head);font-size:14px}
.form input,.form textarea{width:100%;font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--sl-matte);border-radius:4px;background:var(--sl-white);color:var(--sl-char)}
.form textarea{min-height:90px;resize:vertical}
.sent{font-family:var(--font-head);font-size:14px}

/* V1 offer stack — charcoal, loud */
.v1{background:var(--sl-char);color:var(--sl-plat)}
.v1 .hero{padding-block:48px 56px}
.v1 h1{font-size:clamp(34px,5.6vw,62px);line-height:1.04;letter-spacing:-.01em;max-width:16ch}
.v1 .sub{font-size:19px;max-width:52ch;color:var(--sl-sand)}
.v1 .stack{background:var(--sl-plat);color:var(--sl-char);border-radius:6px;padding:28px}
.v1 .stack table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.v1 .stack td{padding:10px 0;border-bottom:1px solid var(--sl-flat);vertical-align:top}
.v1 .stack td:last-child{text-align:right;white-space:nowrap;padding-left:14px}
.v1 .stack .tot td{border-bottom:0;font-family:var(--font-head);font-size:19px;padding-top:16px}
.v1 .stack s{opacity:.6}
.v1 .guar{border:2px solid var(--sl-silver);border-radius:6px;padding:20px 22px}
.v1 .light-band{background:var(--sl-plat);color:var(--sl-char)}
.v1 .eq{font-family:var(--font-head);font-size:20px;line-height:1.5}
.v1 .eq b{border-bottom:2px solid var(--sl-matte)}
.v1 .count{font-family:var(--font-head);font-size:15px;color:var(--sl-silver)}

/* V2 patient — platinum, wide air */
.v2{background:var(--sl-plat)}
.v2 .hero{padding-block:72px 64px}
.v2 h1{font-size:clamp(30px,4.4vw,48px);line-height:1.15;font-weight:normal;max-width:20ch}
.v2 .sub{font-size:19px;max-width:46ch;color:var(--sl-ink2)}
.v2 .rule{height:1px;background:var(--sl-matte);margin:0}
.v2 .steps{display:grid;gap:28px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){.v2 .steps{grid-template-columns:minmax(0,1fr)}}
.v2 .steps h3{font-size:19px;font-weight:normal;margin-bottom:6px}
.v2 .steps .when{font-family:var(--font-head);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--sl-ink2)}
.v2 .white{background:var(--sl-white)}
.v2 .slow{max-width:60ch;font-size:18px}

/* V3 my voice — white, conversational */
.v3 .hero{padding-block:52px 40px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:36px;align-items:end}
@media (max-width:760px){.v3 .hero{grid-template-columns:minmax(0,1fr)}}
.v3 h1{font-size:clamp(32px,5vw,56px);line-height:1.06}
.v3 .sub{font-size:19px;max-width:50ch}
.v3 .card{background:var(--sl-plat);border-radius:6px;padding:20px}
.v3 .card .big{font-family:var(--font-head);font-size:34px;line-height:1}
.v3 .strip{background:var(--sl-char);color:var(--sl-plat)}
.v3 .story{max-width:64ch;font-size:17.5px}
.v3 .gray{background:var(--sl-plat)}
.v3 .creds li{margin-bottom:8px}

/* V4 essay — one column, reading */
.v4{background:#FBFBFA}
.v4 .col{max-width:660px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.v4 h1{font-size:clamp(32px,5vw,50px);line-height:1.1;margin:44px 0 10px}
.v4 .dek{font-size:20px;color:var(--sl-ink2);margin-bottom:28px}
.v4 .byline{display:flex;gap:10px;align-items:center;font-size:14px;color:var(--sl-ink2);border-top:1px solid var(--sl-flat);border-bottom:1px solid var(--sl-flat);padding:10px 0;margin-bottom:28px}
.v4 .col>p{font-size:18.5px;line-height:1.7}
.v4 h2{font-size:22px;margin:36px 0 12px}
.v4 .pull{font-family:var(--font-head);font-size:24px;line-height:1.35;border-left:3px solid var(--sl-char);padding-left:18px;margin:28px 0}
.v4 .box{background:var(--sl-plat);border-radius:6px;padding:22px;margin:28px 0}
.v4 .box ul{margin:6px 0 14px;padding-left:20px}

/* V5 don't hire me — inverted */
.v5{background:var(--sl-white)}
.v5 .hero{background:var(--sl-char);color:var(--sl-plat);padding-block:60px}
.v5 h1{font-size:clamp(34px,5.4vw,60px);line-height:1.04;max-width:14ch}
.v5 .sub{font-size:19px;max-width:50ch;color:var(--sl-sand)}
.v5 .nofor li,.v5 .yesfor li{margin-bottom:10px;font-size:17px}
.v5 .nofor{list-style:none;padding:0}
.v5 .nofor li::before{content:"\00D7";font-family:var(--font-head);margin-right:10px;color:var(--sl-matte)}
.v5 .yesfor{list-style:none;padding:0}
.v5 .yesfor li::before{content:"\2713";font-family:var(--font-head);margin-right:10px}
.v5 .bill{background:var(--sl-plat);border-radius:6px;padding:24px;max-width:70ch}

/* V6 five slides */
.v6{background:var(--sl-sand)}
.v6 .deck{display:grid;gap:18px;padding-block:24px 40px}
.v6 .slide{background:var(--sl-white);border-radius:6px;aspect-ratio:16/9;max-width:100%;padding:clamp(18px,4vw,44px);display:flex;flex-direction:column;justify-content:space-between;gap:12px;overflow:hidden}
.v6 .slide.dark{background:var(--sl-char);color:var(--sl-plat)}
.v6 .slide h2{font-size:clamp(20px,3.6vw,40px);line-height:1.1;max-width:22ch}
.v6 .slide .foot{display:flex;justify-content:space-between;font-size:12.5px;opacity:.65;font-family:var(--font-head)}
.v6 .slide .row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;font-size:clamp(12px,1.6vw,16px)}
.v6 .slide .row b{font-family:var(--font-head);display:block;font-size:clamp(14px,2vw,20px)}
@media (max-width:560px){.v6 .slide{aspect-ratio:auto}.v6 .slide .row{grid-template-columns:minmax(0,1fr)}}
.v6 .slide ul{margin:0;padding-left:20px;font-size:clamp(13px,1.8vw,18px)}
.v6 .cap{font-size:14px;max-width:64ch}

@media (prefers-reduced-motion:no-preference){.view.on{animation:fade .25s ease}@keyframes fade{from{opacity:.4}to{opacity:1}}}

  .src{font-size:13px;color:var(--muted);margin-top:6px}
  .src a{color:inherit}
  .intro .method{font-family:var(--font-head);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
  /* StoryBrand */
  .sb .hero{padding-block:60px 56px;background:var(--sl-plat)}
  .sb h1{font-size:clamp(32px,5vw,54px);line-height:1.08;max-width:18ch}
  .sb .sub{font-size:19px;max-width:48ch;color:var(--sl-ink2)}
  .sb .stakes{background:var(--sl-char);color:var(--sl-plat)}
  .sb .stakes li{margin-bottom:8px}
  .sb .plan{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;counter-reset:s}
  @media (max-width:760px){.sb .plan{grid-template-columns:minmax(0,1fr)}}
  .sb .plan div{border-top:3px solid var(--sl-char);padding-top:14px}
  .sb .plan b{font-family:var(--font-head);font-size:20px;display:block;margin-bottom:6px}
  .sb .lead{background:var(--sl-plat);border-radius:6px;padding:22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center}
  @media (max-width:640px){.sb .lead{grid-template-columns:minmax(0,1fr)}}
  /* Scorecard */
  .sc{background:var(--sl-white)}
  .sc .hero{padding-block:44px 30px;text-align:left}
  .sc h1{font-size:clamp(30px,4.8vw,52px);line-height:1.08;max-width:20ch}
  .sc .quiz{background:var(--sl-plat);border-radius:8px;padding:clamp(16px,3vw,30px);display:grid;gap:14px}
  .sc .area{font-family:var(--font-head);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sl-ink2)}
  .sc .q{background:var(--sl-white);border-radius:6px;padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center}
  @media (max-width:640px){.sc .q{grid-template-columns:minmax(0,1fr)}}
  .sc .q p{margin:0}
  .sc .opts{display:flex;gap:6px}
  .sc .opts button{font:inherit;font-family:var(--font-head);font-size:14px;padding:7px 12px;border-radius:999px;border:1px solid var(--sl-matte);background:var(--sl-white);color:var(--sl-char);cursor:pointer}
  .sc .opts button[aria-pressed="true"]{background:var(--sl-char);color:var(--sl-plat);border-color:var(--sl-char)}
  .sc .meter{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
  @media (max-width:900px){.sc .meter{grid-template-columns:repeat(3,minmax(0,1fr))}}
  @media (max-width:640px){.sc .meter{grid-template-columns:repeat(2,minmax(0,1fr))}}
  .sc .meter div{background:var(--sl-white);border-radius:6px;padding:10px 12px}
  .sc .meter b{font-family:var(--font-head);font-size:13px;display:block}
  .sc .track{height:8px;background:var(--sl-flat);border-radius:4px;margin-top:8px;overflow:hidden}
  .sc .fill{height:100%;background:var(--sl-char);width:0;transition:width .3s}
  .sc .result{background:var(--sl-char);color:var(--sl-plat);border-radius:8px;padding:22px}
  .sc .result .score{font-family:var(--font-head);font-size:44px;line-height:1;font-variant-numeric:tabular-nums}
  /* Productized spec */
  .ps{background:var(--sl-white);font-size:15.5px}
  .ps .head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:30px;padding-block:40px;align-items:start}
  @media (max-width:760px){.ps .head{grid-template-columns:minmax(0,1fr)}}
  .ps h1{font-size:clamp(28px,4vw,42px);line-height:1.1}
  .ps .buy{border:1px solid var(--sl-flat);border-radius:8px;padding:20px;display:grid;gap:10px}
  .ps .buy .p{font-family:var(--font-head);font-size:38px;line-height:1}
  .ps .spec{width:100%;border-collapse:collapse}
  .ps .spec td,.ps .spec th{padding:10px 12px 10px 0;border-bottom:1px solid var(--sl-plat);text-align:left;vertical-align:top}
  .ps .spec th{font-family:var(--font-head);font-weight:normal;color:var(--sl-ink2);width:32%}
  .ps .incl{list-style:none;padding:0;margin:0}
  .ps .incl li{padding:6px 0;border-bottom:1px solid var(--sl-plat)}
  .ps .incl li::before{content:"+";font-family:var(--font-head);margin-right:10px}
  .ps .excl li::before{content:"\2013"}
  .ps .tl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  @media (max-width:760px){.ps .tl{grid-template-columns:repeat(2,minmax(0,1fr))}}
  .ps .tl div{background:var(--sl-plat);border-radius:6px;padding:12px}
  .ps .tl b{font-family:var(--font-head);display:block}
  .ps .sample{border:1px dashed var(--sl-matte);border-radius:6px;padding:20px;background:#FAFAF9;font-size:15px}
  .ps .sample h4{font-family:var(--font-head);margin:12px 0 4px}
  .ps details{border-bottom:1px solid var(--sl-plat);padding:10px 0}
  .ps summary{font-family:var(--font-head);cursor:pointer}
  /* Video / no pitch */
  .np{background:var(--sl-char);color:var(--sl-plat)}
  .np .vid{aspect-ratio:16/9;max-width:100%;background:#24272A;border-radius:8px;display:grid;place-items:center;text-align:center;padding:20px;border:1px solid #3A3D41}
  .np .play{width:64px;height:64px;border-radius:50%;background:var(--sl-plat);display:grid;place-items:center;margin:0 auto 10px}
  .np .play::after{content:"";border-left:18px solid var(--sl-char);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
  .np h1{font-size:clamp(30px,4.6vw,50px);line-height:1.08;max-width:18ch}
  .np .wide{background:var(--sl-white);color:var(--sl-char)}
  .np .min{border:1px solid var(--sl-matte);border-radius:6px;padding:18px}
  /* Details page: reference layout */
  .dp{background:var(--sl-white);font-size:15.5px}
  .dp-head{padding-block:28px 22px;border-bottom:1px solid var(--sl-plat)}
  .dp-head h1{font-size:clamp(26px,3.6vw,36px);line-height:1.15;font-weight:normal}
  .dp-head p{color:var(--sl-ink2);max-width:60ch;margin:8px 0 18px}
  .facts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0;border:1px solid var(--sl-plat);border-radius:6px}
  .facts div{padding:10px 12px;border-left:1px solid var(--sl-plat)}
  .facts div:first-child{border-left:0}
  .facts dt{font-family:var(--font-head);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--sl-ink2)}
  .facts dd{margin:2px 0 0;font-size:14.5px}
  @media (max-width:760px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}.facts div{border-left:0;border-top:1px solid var(--sl-plat)}.facts div:first-child{border-top:0}}
  .dp-body{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;padding-block:28px 40px}
  @media (max-width:760px){.dp-body{grid-template-columns:minmax(0,1fr)}.toc{display:none}}
  .toc{position:sticky;top:70px;align-self:start;font-size:14px}
  .toc ol{margin:6px 0 0;padding-left:18px;color:var(--sl-ink2)}
  .toc li{margin-bottom:6px}
  .doc{max-width:720px}
  .doc section{padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid var(--sl-plat)}
  .doc h2{font-size:21px;margin-bottom:10px}
  .doc h3{font-size:16px;margin-bottom:6px}
  .doc ul{padding-left:20px}
  .doc li{margin-bottom:6px}
  .doc a{color:inherit}
  .doc .plain{list-style:none;padding:0;margin:0}
  .doc .plain li{padding:5px 0;border-bottom:1px solid var(--sl-plat);margin:0}
  .steps-t{width:100%;border-collapse:collapse;font-size:15px}
  .steps-t th,.steps-t td{text-align:left;vertical-align:top;padding:9px 12px 9px 0;border-bottom:1px solid var(--sl-plat)}
  .steps-t th{font-family:var(--font-head);font-weight:normal;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--sl-ink2)}
  .steps-t td:first-child{font-family:var(--font-head);white-space:nowrap;width:22%}
  .doc .sample{border:1px dashed var(--sl-matte);border-radius:6px;padding:16px 18px;background:#FAFAF9}
  .doc .g{font-family:var(--font-head);font-size:19px;line-height:1.45;border-left:3px solid var(--sl-char);padding-left:14px;margin:0}
  .doc details{border-bottom:1px solid var(--sl-plat);padding:9px 0}
  .doc summary{font-family:var(--font-head);cursor:pointer}
  .dp-cta{display:flex;gap:12px;flex-wrap:wrap}
  /* Main page price split */
  .v1 .pay2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
  .v1 .pay2 div{background:var(--sl-white);border:1px solid var(--sl-flat);border-radius:6px;padding:12px 14px;display:flex;flex-direction:column}
  .v1 .pay2 .eyebrow{margin-bottom:4px}
  .v1 .pay2 b{font-family:var(--font-head);font-size:26px;line-height:1.1}
  
/* ---- live site ---- */
body{background:#FFFFFF;margin:0}
.sitebar{background:var(--sl-char);color:var(--sl-plat);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
body::before{background:var(--sl-char)}
.sitebar .in,.foot .in,.site .book-page{max-width:1020px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.sitebar .in{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-block:12px}
.sitebar .logo{display:flex;align-items:center;gap:10px;font-family:var(--font-head);font-size:20px;color:var(--sl-plat);text-decoration:none}
.sitebar .logo svg{width:18px;height:30px}
.sitebar nav{display:flex;align-items:center;gap:6px 18px;flex-wrap:wrap;font-family:var(--font-head);font-size:15px}
.sitebar nav a{color:var(--sl-sand);text-decoration:none}
.sitebar nav a:hover,.sitebar nav a[aria-current="page"]{color:var(--sl-white)}
.sitebar nav a.book{background:var(--sl-plat);color:var(--sl-char);padding:7px 14px;border-radius:4px}
.sitebar nav a.book[aria-current="page"]{background:var(--sl-white)}
.site .in.nav,.site .nav{display:none}
.site h1{margin-bottom:16px}
.sc .result .meter>div{background:#24272A}
.sc .result .meter b{color:var(--sl-plat)}
.sc .result .track{background:#3A3D41}
.sc .result .fill{background:var(--sl-plat)}
.site a{color:inherit}
.site a.btn.dark{color:var(--sl-plat)}
.site a.btn.light{color:var(--sl-char)}
.foot{border-top:1px solid var(--sl-plat);padding-block:22px;font-size:13px;color:var(--sl-ink2)}
.foot .in{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.book-page{padding-block:48px 64px}
.book-page h1{font-size:clamp(30px,4.6vw,46px);line-height:1.1;max-width:20ch}
.book-page ol{padding-left:20px;max-width:60ch;font-size:17px}
.book-page li{margin-bottom:10px}
.mail{display:inline-flex;gap:10px;align-items:center;background:var(--sl-plat);border-radius:6px;padding:14px 18px;font-family:var(--font-head);font-size:20px;margin:6px 0 14px}