/* ==========================================================================
   4T+ Performance Portfolio Membership — app.css (plain CSS, nav model C)
   Palette + fonts matched to the live storefront (4tplusperformance.com):
   black #000 · red #DA1414 · green #008031 · gold accent #F4C95D
   Headings = Montserrat · Body/UI = Barlow
   ========================================================================== */

:root{
  --ink:#000000;
  --red:#DA1414;
  --pink:#F4C95D;
  --green:#008031;
  --page:#FAFAFA;
  --card:#ffffff;
  --line:#E6E6E6;
  --muted:#8E8E8E;
  --muted2:#5A5A5A;
  --locked:#C9C9C9;
  --shadow:0 2px 6px rgba(0,0,0,.08);
  --mono:"Barlow",sans-serif;
  --cond:"Montserrat",sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--page);
  color:var(--ink);
  font-family:'Barlow',system-ui,-apple-system,sans-serif;
  font-size:17px;line-height:1.55;
}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--ink)}
img{max-width:100%;display:block}
.wrap{max-width:1440px;margin:0 auto;padding:0 20px}

/* sticky footer shell */
.app-shell{display:flex;flex-direction:column;min-height:100vh}
.app-shell .app-main{flex:1 0 auto}
.app-shell .foot,.app-shell .pub-foot{flex:none;margin-top:0}

/* ---- typography helpers ---- */
.label{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mono{font-family:var(--mono)}
h1,h2,h3{font-family:var(--cond);font-weight:800;line-height:1.05;letter-spacing:-.01em;text-transform:uppercase}
h1{font-size:38px}
h2{font-size:30px}
h3{font-size:20px}
.big-num{font-family:var(--cond);font-weight:600;font-size:64px;line-height:1;color:var(--ink)}

/* ---- buttons ---- */
.btn{display:inline-block;font:600 15px/1 'Barlow',sans-serif;padding:14px 22px;border-radius:4px;
  border:1px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer;transition:.15s}
.btn:hover{background:var(--red);border-color:var(--red);color:#fff}
.btn-red{background:var(--red);border-color:var(--red)}
.btn-red:hover{background:var(--ink);border-color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-sm{padding:9px 14px;font-size:13px}
.btn-block{display:block;width:100%;text-align:center}

/* ---- top bar ---- */
.topbar{background:var(--ink);color:#fff}
.topbar .wrap{display:flex;align-items:center;gap:24px;height:72px}
.brand{font-family:var(--cond);font-weight:600;font-size:20px;color:#fff;letter-spacing:-.01em;display:flex;align-items:center}
.brand b{color:var(--red)}
.brand img{height:52px;width:auto;display:block}
.admin-tag{font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-left:12px}
.topnav{display:flex;gap:20px;margin-left:auto;align-items:center;flex-wrap:wrap}
.topnav a{color:#fff;font-size:14px;font-weight:500}
.topnav a:hover{color:var(--red)}
.topnav .btn{padding:9px 16px;font-size:14px}

/* member top bar — white, black wordmark, avatar (artboard 1c) */
.memberbar{background:#fff;border-bottom:1px solid var(--line)}
.memberbar .wrap{display:flex;align-items:center;gap:24px;height:78px}
.memberbar .brand{color:var(--ink)}
.memberbar .brand b{color:var(--red)}
.membernav{display:flex;gap:20px;margin-left:auto;align-items:center}
.membernav a{color:var(--muted2);font:500 15px 'Barlow',sans-serif}
.membernav a:hover{color:var(--ink)}
.membernav .avatar{width:28px;height:28px;border-radius:50%;background:var(--line);display:block}

/* "back to dashboard" bar (model C) */
.backbar{background:#fff;border-bottom:1px solid var(--line)}
.backbar .wrap{display:flex;align-items:center;gap:10px;height:48px;font-size:12.5px}
.backbar a{color:var(--red);font-weight:600}
.backbar a:hover{color:var(--ink)}
.backbar .muted{color:var(--locked)}

/* ---- cards ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);padding:22px}
.card h3{margin-bottom:6px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
section.block{padding:56px 0}
section.block.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
div.block{padding-top:36px;padding-bottom:56px}

/* ---- pill / tags ---- */
.pill{display:inline-block;font:600 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  padding:5px 8px;border-radius:5px;background:rgba(0,0,0,.08);color:var(--ink)}
.pill.red{background:var(--red);color:#fff}
.pill.ink{background:var(--ink);color:#fff}
.pill.ok{background:#e7f5ec;color:var(--green)}
.pill.warn{background:#fff4dc;color:#8a5a00}
.pill.bad{background:#fbe9eb;color:#8a1220}
.tag-example{background:var(--red);color:#fff}

/* ---- dashboard hub (model C) — matches artboard 1c ---- */
.hub-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:4px 0 0;flex-wrap:wrap}
.hub-meta{font:400 12.5px/1.4 var(--mono);color:var(--muted2)}
.hub-sub{display:none}

.task-card{background:var(--ink);color:#fff;border-radius:6px;padding:22px 26px;display:flex;
  align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:16px 0 0}
.task-card .label{font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}
.task-card h2{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:27px;line-height:1.05;color:#fff;letter-spacing:-.01em;margin:9px 0 0}
.task-card p{color:rgba(255,255,255,.7);font-size:13.5px;margin-top:7px;max-width:560px}
.task-card .btn{background:var(--red);border-color:var(--red);flex:none}
.task-card .btn:hover{background:#fff;color:var(--ink);border-color:#fff}

.dash-score{background:var(--ink);color:#fff;border-radius:8px;padding:22px 28px;
  display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin:16px 0 0}
.dash-score-num{display:flex;align-items:center;gap:14px;flex:none}
.dash-score-num .lbl{display:block;font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.dash-score-num .delta{display:block;font:700 14px/1.3 'Barlow',sans-serif;color:var(--green);margin-top:6px}
.dash-score-num .delta.down{color:#ff6b6b}
.dash-score-num .delta.muted{color:rgba(255,255,255,.5);font-weight:500}
.dash-score-pri,.dash-score-act{flex:1;min-width:160px;border-left:1px solid rgba(255,255,255,.15);padding-left:24px}
.dash-score-pri .lbl,.dash-score-act .lbl{display:block;font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.dash-score-pri .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.dash-score-pri .chips span{font:600 12.5px 'Barlow',sans-serif;background:rgba(255,255,255,.1);padding:6px 10px;border-radius:4px}
.dash-score-act p{font:600 14.5px/1.35 'Barlow',sans-serif;margin-top:9px;max-width:34ch}
.dash-score-link{flex:none;font:600 13.5px 'Barlow',sans-serif;color:var(--pink);white-space:nowrap}
.dash-score-link:hover{color:#fff}
@media (max-width:900px){
  .dash-score-pri,.dash-score-act{border-left:0;padding-left:0;min-width:100%}
}

.hub-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 0}
.hub-tile{background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);
  padding:24px;display:flex;flex-direction:column;min-height:180px;transition:.15s;color:var(--ink)}
.hub-tile:hover{border-color:var(--ink);transform:translateY(-2px)}
.hub-tile .ico{width:44px;height:44px;border-radius:9px;background:var(--ink);
  display:flex;align-items:center;justify-content:center;flex:none}
.hub-tile .ico svg{width:22px;height:22px}
.hub-tile.area-lib .ico{background:var(--red)}
.hub-tile.area-terms .ico{background:var(--muted)}
.hub-tile h3{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1.15;margin:14px 0 0}
.hub-tile .sub{font:400 13.5px/1.4 'Barlow',sans-serif;color:var(--muted);margin-top:5px}
.hub-tile .meta{margin-top:auto;padding-top:12px;font:600 11px/1 var(--mono);letter-spacing:.04em;text-transform:uppercase;}
.hub-tile.locked{pointer-events:none}
.hub-tile.locked .ico{background:var(--locked)}
.hub-tile.locked .meta{color:var(--locked)}
.hub-tile.area-terms .meta{color:var(--muted)}

.new-bar{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:6px;
  padding:16px 18px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.new-bar{color:var(--ink)}
.new-bar:hover{border-color:var(--ink)}
.new-bar .lbl{font:600 11px/1 var(--mono);letter-spacing:.08em;color:var(--muted2);flex:none}
.new-bar .txt{font:500 13.5px 'Barlow',sans-serif;color:var(--ink)}
.new-bar .go{margin-left:auto;font:600 12.5px 'Barlow',sans-serif;color:var(--red);flex:none}

/* ---- Shop (storefront) entry points ---- */
/* header Shop button — identical to the landing "Join now" button (chamfered red gradient, 46px tall) */
.membernav .shop-link{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 22px;
  font:800 12.5px/1 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:#fff;
  background:linear-gradient(170deg,#f58d78 0%,#e2301c 55%,#b81e0e 100%);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  transition:transform .2s ease,filter .2s ease}
.membernav .shop-link svg{width:18px;height:18px}
.membernav .shop-link:hover{color:#fff;filter:brightness(1.08);transform:translateY(-2px)}
/* mobile: collapse Shop to the cart icon so the nav fits beside Library/Account/Sign out */
@media (max-width:767px){
  .memberbar .wrap{gap:12px}
  .membernav{gap:12px}
  .membernav .shop-link{height:32px;padding:0 13px;gap:0;clip-path: polygon(4px 0, 100% 0, 100% calc(100% - 4px), calc(100% - 4px) 100%, 0 100%, 0 4px);}
  .membernav .shop-link .lbl{display:none}
  .membernav .shop-link svg{width:17px;height:17px}
}

/* SHOP card — dark tile with a NEW badge and a red highlight glow */
.hub-tile.area-shop{position:relative;background:var(--ink);border-color:var(--red);color:#fff;
  box-shadow:0 0 0 1px var(--red),0 10px 26px rgba(218,20,20,.35)}
.hub-tile.area-shop:hover{transform:translateY(-2px);box-shadow:0 0 0 2px var(--red),0 14px 32px rgba(218,20,20,.5)}
.hub-tile.area-shop .ico{background:var(--red)}
.hub-tile.area-shop h3{color:#fff}
.hub-tile.area-shop .sub{color:rgba(255,255,255,.7)}
.hub-tile.area-shop .meta{color:var(--red)}

/* reusable Shop CTA card — drops into any dashboard row */
.shop-cta{margin-top:16px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;color:#fff;
  background:radial-gradient(520px 300px at 88% 10%,rgba(218,20,20,.38),transparent 62%),var(--ink);
  border-radius:8px;padding:28px 30px;transition:.15s}
.shop-cta:hover{color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.22)}
.shop-cta-copy{flex:1;min-width:240px}
.shop-cta-tag{display:inline-block;background:var(--red);color:#fff;font:600 11px/1 var(--mono);
  letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:4px}
.shop-cta h2{font-family:var(--cond);font-weight:800;text-transform:uppercase;font-size:28px;line-height:1.05;
  color:#fff;margin:14px 0 0}
.shop-cta h2 span{color:var(--red)}
.shop-cta-copy p{font:400 14.5px/1.5 'Barlow',sans-serif;color:rgba(255,255,255,.72);margin-top:10px;max-width:44ch}
.shop-cta-act{flex:none;text-align:center}
.shop-cta-btn{display:inline-block;background:var(--red);color:#fff;font:600 14px 'Barlow',sans-serif;
  padding:15px 26px;border-radius:5px;transition:.15s}
.shop-cta:hover .shop-cta-btn{background:#fff;color:var(--ink)}
.shop-cta-note{display:block;font:500 12px 'Barlow',sans-serif;color:rgba(255,255,255,.55);margin-top:10px}
@media (max-width:700px){
  .shop-cta{padding:22px;gap:16px}
  .shop-cta-act{text-align:left}
  .shop-cta-btn{width:100%;text-align:center}
}

/* ---- blueprint (artboard 1f) ---- */
.bp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-top:26px}
.bp-head h1{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:30px}
.bp-sub{font:400 13px/1.4 var(--mono);color:var(--muted2);margin-top:6px}
.bp-pills{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bp-pills .lbl{font-size:14px;color:var(--muted2)}
.pill.soft{background:#FBE1E1;color:var(--red)}
.bp-tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin:20px 0 22px;flex-wrap:wrap}
.bp-tab{padding:0 0 12px;font:600 14px 'Barlow',sans-serif;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.bp-tab .meta{font:400 12px var(--mono);color:var(--locked);margin-left:6px}
.bp-tab.on{color:var(--ink);border-bottom-color:var(--red)}
.bp-grid{display:grid;grid-template-columns:1.9fr 1fr;gap:20px;align-items:start}
.guide{max-width:1440px}
.guide h1{margin:6px 0 8px}
.guide .sub{font-size:18px;color:var(--muted2);margin:0 0 6px}
.guide h2{margin:44px 0 12px;padding-top:24px;border-top:1px solid var(--line)}
.guide h3{margin:26px 0 10px;font-size:18px}
.guide p{line-height:1.65;margin:0 0 12px}
.guide ul,.guide ol{line-height:1.65;margin:0 0 14px;padding-left:22px}
.guide li{margin-bottom:6px}
.guide table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);margin:8px 0 18px}
.guide th,.guide td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.guide th{background:#f6f6f6;font:600 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.guide td:first-child{font-weight:600}
.guide .g-toc{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 4px}
.guide .g-note{background:#F6F6F6;border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-size:13.5px;color:var(--muted2);margin:14px 0}
.guide .g-promise{font:600 20px/1.35 'Barlow';margin:18px 0}
.guide .g-scroll{overflow-x:auto}
.guide .g-scroll table{min-width:620px}
.bp-guide-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:#111;color:#fff;border-radius:6px;padding:16px 20px;margin:0 0 18px}
.bp-guide-banner b{display:block;font-size:16px}
.bp-guide-banner small{display:block;font-size:13px;color:rgba(255,255,255,.65);margin-top:3px}
.bp-guide-banner .go{font-weight:600;color:#fff;background:var(--red);border-radius:4px;padding:9px 14px;font-size:13.5px;white-space:nowrap}
.bp-guide-banner:hover{color:#fff}
.bp-card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:22px 24px}
.bp-card.primary{border-left:3px solid var(--red)}
.bp-eyebrow{font:600 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--red)}
.bp-card h2{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:20px;line-height:1.05;margin:10px 0 0}
.bp-why{font-size:15px;color:var(--muted2);margin-top:12px;line-height:1.5}
.bp-why b{color:var(--ink)}
.bp-boxes{display:grid;grid-template-columns:1.3fr 1fr;gap:14px;margin-top:18px}
.bp-box{background:#F6F6F6;border:1px solid var(--line);border-radius:6px;padding:16px}
.bp-box .h{font:600 10.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted2)}
.bp-check{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:14px}
.bp-check input{width:17px;height:17px;accent-color:var(--green);cursor:pointer;flex:none}
.bp-check.done{color:var(--muted2)}
.bp-measure-num{font-family:var(--cond);font-weight:700;font-size:40px;line-height:1;margin-top:8px}
.bp-measure-num small{font-size:16px;color:var(--muted2);font-family:'Barlow'}
.bp-days{display:flex;gap:5px;margin-top:12px;flex-wrap:wrap}
.bp-day{width:24px;height:24px;border-radius:4px;border:1px solid var(--line);background:#fff}
.bp-day.on{background:var(--green);border-color:var(--green)}
.bp-learn{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.bp-learn .h{font:600 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted2);flex:none}
.learn-pill{font:500 12.5px 'Barlow';background:#fff;border:1px solid var(--line);border-radius:4px;padding:7px 11px;color:var(--ink)}
.learn-pill:hover{border-color:var(--ink);color:var(--ink)}
.bp-support{display:flex;align-items:center;gap:12px;background:#F6F6F6;border:1px solid var(--line);border-radius:6px;padding:12px 14px;margin-top:12px;font-size:13px;color:var(--muted2)}
.bp-support .h{font:600 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);flex:none}
.bp-collapse{margin-top:16px}
.bp-collapse summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
.bp-collapse summary::-webkit-details-marker{display:none}
.bp-collapse .open-link{font:600 13px 'Barlow';color:var(--red);flex:none}
.bp-side-card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:18px 20px;margin-bottom:16px}
.bp-side-card .h{font:600 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted2)}
.bp-side-card .big{font-family:var(--cond);font-weight:700;font-size:38px;line-height:1;margin-top:8px}
.bp-side-card .big small{font-size:14px;color:var(--muted2);font-family:'Barlow'}
.bp-bar{height:8px;background:#EDEDED;border-radius:99px;overflow:hidden;margin-top:12px}
.bp-bar i{display:block;height:100%;background:var(--red);border-radius:99px}
.bp-side-note{font-size:12.5px;color:var(--muted);margin-top:10px}
.bp-lesson{background:var(--ink);color:#fff;border-radius:6px;padding:18px 20px}
.bp-lesson .h{font:600 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--pink)}
.bp-lesson .t{font:600 15px/1.3 'Barlow';color:#fff;margin-top:8px}
.bp-lesson .m{font:400 11px var(--mono);color:rgba(255,255,255,.6);margin-top:8px}
@media (max-width:900px){.bp-grid{grid-template-columns:1fr}.bp-boxes{grid-template-columns:1fr}}

/* ---- score ring / domain bars ---- */
.score-hero{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.domain-row{display:flex;align-items:center;gap:12px;margin:10px 0}
.domain-row .name{width:150px;font-size:14px}
.domain-row .bar{flex:1;height:8px;background:rgba(0,0,0,.1);border-radius:99px;overflow:hidden}
.domain-row .bar i{display:block;height:100%;background:var(--ink);border-radius:99px}
.domain-row .val{width:34px;text-align:right;font:600 13px/1 var(--mono)}

/* ---- cycle spine ---- */
.cycle{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.cycle .step{border:1px solid var(--line);border-radius:8px;padding:16px;background:#fff}
.cycle .step .n{font:600 12px/1 var(--mono);color:var(--red)}
.cycle .step h3{font-size:17px;margin:8px 0 4px}
.cycle .step p{font-size:13px;color:var(--muted)}

/* ---- assessment ---- */
.assess{max-width:640px;margin:40px auto}
.progress{height:6px;background:rgba(0,0,0,.1);border-radius:99px;overflow:hidden;margin:14px 0 26px}
.progress i{display:block;height:100%;background:var(--red)}
.opt{display:block;border:1px solid var(--line);border-radius:8px;padding:16px 18px;margin-bottom:12px;
  background:#fff;cursor:pointer;font-size:16px;transition:.12s}
.opt:hover{border-color:var(--ink)}
.opt input{margin-right:10px}
.opt.sel{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}

/* ---- quiz (one question per screen + the section rail) ---- */
.qz{display:grid;grid-template-columns:240px 1fr;gap:40px;max-width:940px;margin:40px auto;align-items:start}
.qz-rail{border:1px solid var(--line);border-radius:8px;background:#fff;padding:18px 16px;position:sticky;top:24px}
.qz-rail ol{list-style:none;margin:10px 0 14px;padding:0;counter-reset:qzsec}
.qz-rail li{display:flex;justify-content:space-between;gap:10px;align-items:baseline;
  font-size:13px;color:var(--muted);padding:7px 0;border-bottom:1px solid var(--line)}
.qz-rail li:last-child{border-bottom:0}
.qz-rail li b{font:600 11px/1 var(--mono);color:var(--muted)}
.qz-rail li.done{color:var(--ink)}
.qz-rail li.done b{color:var(--green,#008031)}
.qz-rail li.on{color:var(--ink);font-weight:600}
.qz-rail li.on b{color:var(--red)}
.qz-rail p.muted{font-size:12px;margin:0}
.qz-main{min-width:0}
.qz-main h1{font-size:30px;line-height:1.2}
.qz-helper{color:var(--muted);font-size:14px;margin-top:10px;max-width:60ch}
.qz-number{display:flex;align-items:center;gap:12px;margin-top:8px}
.qz-number input{font:600 34px/1 var(--mono);width:190px;padding:14px 16px;
  border:1px solid var(--line);border-radius:8px;background:#fff}
.qz-number input:focus{outline:none;border-color:var(--red)}
.qz-number .unit{font:600 13px/1 var(--mono);text-transform:uppercase;color:var(--muted)}
.qz-nav{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:12px;flex-wrap:wrap}
.qz-nav-right{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.opt .opt-text{display:block}
.opt .opt-text b{display:block;font-weight:600}
.opt .opt-text i{display:block;font-style:normal;font-size:13px;color:var(--muted);margin-top:3px}

@media (max-width:900px){
  .qz{grid-template-columns:1fr;gap:20px;margin-top:20px}
  .qz-rail{position:static;order:2}
  .qz-main{order:1}
  .qz-main h1{font-size:24px}
}
@media (max-width:640px){
  .qz-number input{font-size:28px;width:100%}
  .qz-nav-right{width:100%}
  .qz-nav-right .btn{flex:1}
}

/* ---- hero (landing) ---- */
.hero{background:var(--ink);color:#fff;padding:72px 0}
.hero h1{font-size:56px;color:#fff;max-width:14ch}
.hero p.lead{color:rgba(255,255,255,.75);font-size:19px;margin:18px 0 26px;max-width:52ch}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero .fine{color:rgba(255,255,255,.5);font-size:13px;margin-top:14px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}

/* pricing */
.price{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.price .plan{flex:1;min-width:260px;max-width:360px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:28px}
.price .plan.feat{border-color:var(--ink);box-shadow:var(--shadow)}
.price .amt{font-family:var(--cond);font-weight:600;font-size:40px}
.price ul{list-style:none;margin:16px 0}
.price li{padding:7px 0;border-top:1px solid var(--line);font-size:14px}

/* faq */
.faq details{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px 18px;margin-bottom:10px}
.faq summary{font-weight:600;cursor:pointer}

/* auth */
.auth{width:580px;max-width:100%;margin:56px auto;padding: 0 20px;}
.auth .card{padding:40px}
.auth .btn-cta{width:100%}

/* baseline form-control look — applies everywhere (repeater table cells, ad-hoc inputs),
   not just inside .field, so nothing renders as an unstyled native input/select */
input[type=text],input[type=number],input[type=email],input[type=password],
input[type=search],input[type=date],input[type=url],input[type=tel],select{
  padding:9px 11px;border:1px solid var(--line);border-radius:5px;
  font:14px 'Barlow',sans-serif;background:#fff;color:var(--ink)}
input[type=text]:focus,input[type=number]:focus,input[type=email]:focus,
input[type=password]:focus,input[type=search]:focus,input[type=date]:focus,
input[type=url]:focus,input[type=tel]:focus,select:focus{outline:none;border-color:var(--red)}
input[type=file]{padding:6px 0;font:14px 'Barlow',sans-serif}

.field{margin-bottom:20px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.field input,.field select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:6px;font:16px 'Barlow',sans-serif;background:#fff}
.field input:focus{outline:none;border-color:var(--red)}
.permalink{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-top:8px;font-size:13px}
.permalink a{color:inherit;word-break:break-all}
.field .permalink input{width:auto;flex:1;min-width:180px;padding:4px 8px;font-size:13px;border-radius:4px}
/* jquery validate errors */
label.error,.field label.error{display:block;color:var(--red);font-size:13px;font-weight:500;margin:6px 0 0}
input.error,select.error,textarea.error{border-color:var(--red)!important}
.alert{padding:12px 16px;border-radius:6px;margin-bottom:16px;font-size:14px}
.alert.err{background:#fbe9eb;color:#8a1220;border:1px solid #f0c2c8}
.alert.ok{background:#e7f5ec;color:#155f33;border:1px solid #bfe3cb}

/* footer */
.foot{background:var(--ink);color:rgba(255,255,255,.6);padding:34px 0;font-size:13px;margin-top:40px}
.foot a{color:#fff}
.foot .fine{margin-top:8px;color:rgba(255,255,255,.4)}

/* ---- admin ---- */
.admin{display:flex;min-height:calc(100vh - 60px)}
.admin-side{width:210px;background:#111;color:#fff;padding:20px 0;flex:none}
.admin-side a{display:block;color:rgba(255,255,255,.75);padding:11px 22px;font-size:14px;font-weight:500}
.admin-side a:hover,.admin-side a.on{background:rgba(255,255,255,.08);color:#fff;border-left:3px solid var(--red)}
.admin-side-label{display:block;padding:18px 22px 6px;font:600 10px 'Barlow',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.admin-dropdown-trigger{
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:rgba(255,255,255,.75);
    padding:11px 22px;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
    user-select:none;
}
.admin-dropdown-trigger:hover{
    background:rgba(255,255,255,.08);
    color:#fff;
}
.admin-dropdown-trigger .arrow{
    display:inline-block;
    width:7px;
    height:7px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg);
    transition:transform .2s ease;
    margin-top:-4px;
}
.admin-dropdown.open .admin-dropdown-trigger .arrow{
    transform:rotate(225deg);
    margin-top:4px;
}
.admin-dropdown-items{display:none}
.admin-dropdown.open .admin-dropdown-items{display:block}
.admin-dropdown-items a{padding-left:34px!important}
.admin-main{flex:1;padding:40px;min-width:0}
.admin-head{display:flex;align-items:baseline;gap:24px;margin-bottom:24px}
.admin-head h1{margin:0}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.stat{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px;display:flex;flex-direction:column}
.stat .big-num{font-size:42px}
.stat p{margin-top:auto}
table.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
table.tbl th,table.tbl td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:middle}
table.tbl th{background:#f6f6f6;font:600 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
table.tbl tr:last-child td{border-bottom:none}
.textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:6px;font:15px 'Barlow',sans-serif}
@media (max-width:1200px){
  .stat-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .admin{flex-direction:column}
  .admin-side{width:100%;display:flex;flex-wrap:wrap;padding:8px}
  .admin-side a{border-left:none!important}
  .admin-side-label{width:100%;padding:8px 14px 2px}
  .admin-main{padding:24px}
  .stat-grid{grid-template-columns:1fr}
}

.center{text-align:center}
.mt0{margin-top:0}.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt40{margin-top:40px}
.muted{color:var(--muted)}

/* ---- library items: card on desktop, compact row on mobile (artboard 1c) ---- */
.lib-area{margin-top:40px}
.lib-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.lib-item{background:var(--card);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);
  padding:22px;display:flex;flex-direction:column;color:var(--ink)}
.lib-item:hover{border-color:var(--ink);color:var(--ink)}
.lib-meta{order:-1;font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lib-title{font:600 20px/1.1 var(--cond);color:var(--red);margin-top:8px}
.lib-sum{font-size:14px;color:var(--muted);margin-top:8px;line-height:1.5}

.show-m{display:none}

/* ---- responsive (mobile-honest, model C) ---- */
@media (max-width:900px){
  h1{font-size:34px}.hero h1{font-size:38px}h2{font-size:24px}
  .hero-grid{grid-template-columns:1fr}
  .hub-grid{grid-template-columns:repeat(3,1fr)}
  .g3,.g4,.cycle,.lib-grid{grid-template-columns:1fr 1fr}
  .g2{grid-template-columns:1fr}
  .topnav{gap:12px}
}

/* phones — values taken from the 390px Model C artboard */
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  h1{font-size:28px}h2{font-size:22px}h3{font-size:18px}
  .hero h1{font-size:38px;line-height:.98}
  .hero{padding:26px 0}
  .hero p.lead{font-size:14px}
  .hero .cta .btn{display:block;width:100%;text-align:center}
  section.block{padding:32px 0}
  div.block{padding-top:20px;padding-bottom:40px}
  .card{padding:16px}
  .g2,.g3,.g4,.cycle{grid-template-columns:1fr}
  .cycle[style]{grid-template-columns:1fr!important}
  .btn{padding:13px 18px}

  /* header 60px: logo + Library / Account / Sign out + avatar */
  .memberbar .wrap{gap:12px}
  .membernav{gap:14px}
  .membernav a{font-size:13px}
  .memberbar .wrap{height:60px}
  .memberbar .brand{font-size:18px}
  .memberbar .brand img{height:38px}
  .membernav .avatar{width:26px;height:26px}
  .topnav a:not(.btn){display:none}
  .topbar .wrap{height:48px}

  /* ← Dashboard bar */
  .backbar .wrap{height:42px;font-size:12.5px;white-space:nowrap;overflow:hidden}
  .backbar .wrap span:last-child{overflow:hidden;text-overflow:ellipsis}

  /* dashboard hub */
  .hub-head{flex-direction:column;align-items:flex-start;gap:4px}
  .hub-head h1{font-size:26px}
  .hub-meta{font-size:11.5px}
  .task-card{padding:16px;gap:0;margin-top:12px;display:block}
  .task-card .label{font-size:9.5px}
  .task-card h2{font-size:22px;margin-top:8px}
  .task-card p{display:none}
  .task-card .btn{display:block;width:100%;text-align:center;margin-top:13px;padding:13px;font-size:14px}
  .hide-m{display:none!important}
  .show-m{display:inline}
  .hub-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
  .hub-tile{padding:14px;min-height:100px}
  .hub-tile .ico{width:26px;height:26px;border-radius:6px}
  .hub-tile .ico svg{width:14px;height:14px}
  .hub-tile h3{font-size:15px;margin-top:9px}
  .hub-tile .meta{font-size:9.5px;padding-top:8px}
  .new-bar{padding:12px 13px;gap:4px 12px}
  .new-bar .lbl{font-size:9.5px;width:100%}
  .new-bar .txt{font-size:13px;flex:1}

  /* library: compact rows — title left, meta right */
  .lib-page h1{font:700 22px/1 var(--cond);text-transform:uppercase}
  .lib-area{margin-top:24px}
  .lib-area h2{font:700 18px/1 var(--cond);text-transform:uppercase}
  .lib-grid{grid-template-columns:1fr;gap:8px;margin-top:12px}
  .lib-item{flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px;
    padding:11px 13px;border-radius:4px;box-shadow:none}
  .lib-title{order:0;font:500 13px/1.35 'Barlow',sans-serif;color:var(--ink);margin:0}
  .lib-meta{order:1;flex:none;font:400 11px/1.35 var(--mono);letter-spacing:0;margin:0;text-align:right;max-width:40%}
  .lib-sum{display:none}

  /* blueprint */
  .bp-head h1{font-size:24px}
  .bp-tabs{gap:16px;flex-wrap:nowrap;overflow-x:auto}
  .bp-tab{white-space:nowrap}
  .bp-card{padding:16px}
  .bp-card h2{font-size:20px}
  .bp-why{font-size:14px}

  /* scores */
  .big-num{font-size:48px}
  .score-hero{gap:16px}
  .domain-row .name{width:110px;font-size:13px}

  /* assessment + auth */
  .assess{margin:20px auto}
  .opt{padding:14px;font-size:15px}
  .auth{margin:24px auto}
  .auth .card{padding:20px}

  /* pricing */
  .price .plan{min-width:0;max-width:none;padding:20px}

  /* admin tables scroll sideways instead of breaking the page */
  table.tbl{display:block;overflow-x:auto;white-space:nowrap}
  .admin-main{padding:16px}
}

/* very small phones: keep Library / Account / Sign out on one line */
@media (max-width:360px){
  .membernav{gap:10px}
  .membernav a{font-size:12px}
  .memberbar .brand{font-size:16px}
}

/* ==========================================================================
   Public header + landing — client artboard 1d (desktop 1080 frame, phone 390 frame)
   ========================================================================== */
.show-m-block{display:none!important}
/* public header / footer — mirrors the landing page bars */
.pub-head{background:var(--ink);border-bottom:3px solid var(--red);position:sticky;top:0;z-index:40}
.pub-head-wrap{max-width:1440px;margin:0 auto;padding:14px clamp(16px,4vw,40px);display:flex;align-items:center;justify-content:space-between;gap:16px}
.pub-head-logo img{height:44px;width:auto;display:block}
/* landing-style chamfered red CTA button */
.btn-cta{display:inline-flex;align-items:center;justify-content:center;gap:12px;font:800 14.5px/1 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:linear-gradient(170deg,#f58d78 0%,#e2301c 55%,#b81e0e 100%);padding:19px 30px;border:0;cursor:pointer;text-decoration:none;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);transition:transform .2s ease,filter .2s ease}
.btn-cta:hover{filter:brightness(1.08);transform:translateY(-2px);color:#fff}
.pub-head .btn-cta{padding:13px 22px;font-size:12.5px;letter-spacing:.1em}
.pub-foot{background:var(--ink);color:rgba(255,255,255,.55);padding-block:28px;font:600 12px/1.6 var(--cond);letter-spacing:.08em;text-transform:uppercase}
.pub-foot-wrap{max-width:1440px;margin:0 auto;padding:0 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.pub-foot b{color:#fff}
.pub-foot b span{color:var(--red)}
.pub-foot-logo img{height:38px;width:auto;display:block}
.pub-body{min-height:100vh;display:flex;flex-direction:column}
.pub-body .pub-foot{margin-top:auto}
.pubbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40}
/* anchor jumps land below the sticky header */
.lp > section{scroll-margin-top:84px}
.pub-wrap{max-width:1440px;margin:0 auto;padding:0 32px;height:84px;display:flex;align-items:center;justify-content:space-between}
.pub-logo img{height:56px;width:auto}
.pub-nav{display:flex;align-items:center;gap:18px;font:500 15px 'Barlow',sans-serif}
.pub-nav a{color:#3a3a3a}
.pub-nav a:hover{color:var(--red)}
.pub-nav a.pub-signin{font-weight:600;color:var(--ink)}
.pub-join,.pub-nav a.pub-join{background:var(--red);color:#fff;font:600 15px 'Barlow',sans-serif;padding:9px 14px;border-radius:3px}
.pub-join:hover,.pub-nav a.pub-join:hover{background:var(--ink);color:#fff}
.pub-menu,.pub-join-m{display:none}
.pub-menu summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;gap:3px;padding:8px 0}
.pub-menu summary::-webkit-details-marker{display:none}
.pub-menu summary span{width:18px;height:2px;background:var(--ink);display:block}
.pub-drop{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);
  box-shadow:0 10px 24px rgba(0,0,0,.1);padding:6px 0}
.pub-drop a{display:block;padding:12px 18px;font:500 17px 'Barlow',sans-serif;color:var(--ink)}
.pub-drop a:hover{background:var(--page);color:var(--ink)}

.lp{background:#fff;color:var(--ink);font-family:'Barlow',sans-serif;display:flex;flex-direction:column}
.lp-wrap{max-width:1440px;margin:0 auto;padding:0 32px;width:100%}
.lp-sec{padding:72px 0;border-bottom:1px solid var(--line)}
.lp-sec.gray{background:#F6F6F6}
.lp-sec.dark{background:var(--ink);border-bottom:0}
.lp-eyebrow{font:600 12.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.lp-hero .lp-eyebrow,.lp-sec.dark .lp-eyebrow{color:var(--pink)}
.lp-h2{font:700 36px/1.05 var(--cond);text-transform:uppercase;letter-spacing:-.01em;margin:14px 0 0}
.lp-h2.sm{font-size:34px}
.lp-sec.dark .lp-h2{color:#fff}
.lp-link{font:600 16px 'Barlow',sans-serif;color:var(--red)}
.lp-link:hover{color:var(--ink)}
.lp-block-link{display:block;margin-top:18px}
.lp-inline-link{display:inline-block;margin-top:16px}
.lp-p{font:400 16.5px/1.55 'Barlow',sans-serif;color:#3a3a3a;margin-top:12px}
.lp-btn{display:inline-block;font:600 18px 'Barlow',sans-serif;border-radius:4px;text-align:center;transition:.15s}
.lp-btn.red{background:var(--red);color:#fff;padding:16px 26px}
.lp-btn.red:hover{background:#A30F0F;color:#fff}
.lp-btn.ghost{border:1px solid rgba(255,255,255,.45);color:#fff;padding:15px 24px}
.lp-btn.ghost:hover{border-color:#fff;color:#fff}
.lp-btn-block{display:block;width:100%;padding:15px}
.lp-acc-sum{display:none}
.lp-split{display:flex;gap:36px;margin-top:14px;align-items:flex-start}
.lp-split.lp-mid{align-items:center;margin-top:0}
.lp-split.gap32{gap:32px}
.lp-split > .lp-h2{flex:1;margin:0}
.lp-col{flex:1;min-width:0}
.lp-col.wide{flex:1.1}
.lp-ph{flex:1;background:repeating-linear-gradient(135deg,#ececec 0,#ececec 10px,#fafafa 10px,#fafafa 20px);
  border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;justify-content:center}
.lp-ph span{font:400 14px var(--mono);color:var(--muted)}
.lp-portrait,.lp-portrait-img{flex:0 0 232px;height:248px}
.lp-portrait-img{display:block;width:232px;object-fit:cover;border-radius:6px}
.lp-figure{flex:1;min-width:0;display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:#F0F0F0}

/* hero */
.lp-hero{background:var(--ink);padding:88px 0}
.lp-hero-in{display:flex;gap:40px;align-items:center}
.lp-hero-copy{flex:1.1;min-width:0}
.lp-hero h1{font:700 62px/.98 var(--cond);text-transform:uppercase;color:#fff;margin:16px 0 0;letter-spacing:-.01em}
.lp-hero p{font:400 19px/1.5 'Barlow',sans-serif;color:rgba(255,255,255,.76);margin:16px 0 0;max-width:580px}
.lp-cta{display:flex;gap:12px;margin-top:26px;align-items:center;flex-wrap:wrap}
.lp-fine{font:400 14.5px var(--mono);color:rgba(255,255,255,.5);margin-top:18px}

/* sample score card */
.lp-sample{flex:1;min-width:0;background:#fff;border-radius:8px;padding:18px;box-shadow:0 18px 40px rgba(0,0,0,.3)}
.lp-sample-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.lp-mlabel{font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.lp-mlabel.sm{font-size:11.5px;letter-spacing:0}
.lp-mlabel.red{color:var(--red)}
.lp-tag{font:600 11.5px var(--mono);text-transform:uppercase;background:#FBE1E1;color:var(--red);padding:4px 7px;border-radius:2px;flex:none}
.lp-sample-body{display:flex;gap:18px;align-items:center;margin-top:14px}
.lp-sample-body svg{flex:none}
.lp-bars{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.lp-bar{display:flex;align-items:center;gap:8px}
.lp-bar .n{font:500 14px 'Barlow',sans-serif;width:124px;flex:none}
.lp-bar .track{flex:1;height:8px;background:#ECECEC;border-radius:1px;position:relative;display:block}
.lp-bar .track i{position:absolute;left:0;top:0;bottom:0;background:var(--ink);border-radius:1px}
.lp-bar.pri .track i{background:var(--red)}
.lp-bar .v{font:600 13px var(--mono);color:var(--muted2);width:20px;text-align:right}
.lp-bar.pri .v{color:var(--red)}
.lp-pris{display:flex;gap:8px;margin-top:14px}
.lp-pri{flex:1;background:#FBE1E1;border-left:3px solid var(--red);padding:10px 12px;border-radius:2px}
.lp-pri .l{font:600 11.5px var(--mono);text-transform:uppercase;color:var(--red)}
.lp-pri .t{font:600 15.5px 'Barlow',sans-serif;margin-top:4px}

/* 02 problem */
.lp-problem{flex:1;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.lp-problem p{font:400 17px/1.55 'Barlow',sans-serif;color:#3a3a3a}
.lp-minis{display:flex;gap:10px;width:100%}
.lp-mini{flex:1;border:1px solid var(--line);border-radius:4px;padding:12px}
.lp-mini .t{font:600 15.5px 'Barlow',sans-serif}
.lp-mini .s{font:400 14px/1.4 'Barlow',sans-serif;color:var(--muted);margin-top:4px}

/* 03 cycle */
.lp-cycle .lp-h2{margin-bottom:28px}
.lp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.lp-step{background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:5px;padding:18px}
.lp-step .n{font:700 28px/1 var(--cond);color:var(--locked)}
.lp-step .t{font:700 22px/1 var(--cond);text-transform:uppercase;margin-top:8px}
.lp-step .d{font:400 15.5px/1.5 'Barlow',sans-serif;color:#3a3a3a;margin-top:7px}

/* 04 dashboard preview */
.lp-qs{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.lp-qs div{font:500 17px/1.4 'Barlow',sans-serif}
.lp-qs strong{font-weight:700}
.lp-qs span{color:var(--muted2)}
.lp-dash{flex:1.2;min-width:0;background:#F6F6F6;border:1px solid var(--line);border-radius:6px;padding:16px}
.lp-dash-row{display:flex;gap:10px}
.lp-tile{flex:1;min-width:0;background:#fff;border:1px solid var(--line);border-radius:5px;padding:13px}
.lp-tile.fixed{flex:0 0 150px}
.lp-tile .big{font:700 42px/1 var(--cond);margin-top:4px}
.lp-tile .big.sm{font-size:36px}
.lp-tile .big span{font:600 16px 'Barlow',sans-serif}
.lp-tile .up{font:600 13.5px 'Barlow',sans-serif;color:var(--green);margin-top:2px}
.lp-tile .act{font:600 16px/1.3 'Barlow',sans-serif;margin-top:6px}
.lp-tile .sub{font:400 13.5px 'Barlow',sans-serif;color:var(--muted);margin-top:4px}
.lp-tile .date{font:400 13px 'Barlow',sans-serif;color:var(--muted)}
.lp-tile svg{display:block}
.lp-axis{display:flex;justify-content:space-between;font:400 12px var(--mono);color:var(--muted)}

/* 05 receive */
.lp-receive{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.lp-rcard{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:5px;padding:15px}
.lp-rcard .t{font:700 20px/1.05 var(--cond);text-transform:uppercase;color:#fff}
.lp-rcard .d{font:400 14.5px/1.45 'Barlow',sans-serif;color:rgba(255,255,255,.66);margin-top:6px}

/* 06 / 07 chips + lessons */
.lp-chips{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.lp-chips span,.lp-chips button{font:600 13.5px/1.2 'Barlow',sans-serif;background:#fff;border:1px solid var(--line);padding:7px 11px;border-radius:3px;color:var(--ink)}
.lp-chips button{appearance:none;-webkit-appearance:none;cursor:pointer;transition:background .15s,border-color .15s}
.lp-chips button:hover{border-color:var(--ink)}
.lp-chips span.on,.lp-chips button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.lp-chips.soft{margin-top:14px}
.lp-chips.soft span,.lp-chips.soft button{font-weight:500;background:#F6F6F6;padding:6px 10px}
.lp-chips.soft button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.lp-head-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.lp-lessons{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.lp-lesson{display:block;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;
  color:inherit;text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.lp-lesson[hidden]{display:none}
.lp-lesson:hover{border-color:var(--ink);box-shadow:0 10px 24px rgba(0,0,0,.09);transform:translateY(-2px)}
.lp-lesson:hover .t{color:var(--red)}
.lp-lesson-img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#F0F0F0}
.lp-lesson .lp-ph span{font-size:13px}
.lp-lesson .b{padding:14px}
.lp-lesson .m{font:400 12px var(--mono);text-transform:uppercase;color:var(--muted)}
.lp-lesson .t{font:600 18px/1.25 'Barlow',sans-serif;margin-top:6px}
.lp-lesson .d{font:400 14.5px/1.45 'Barlow',sans-serif;color:var(--muted2);margin-top:6px}

/* 08 timeline */
.lp-timeline{display:flex;align-items:flex-start}
.lp-tl{flex:1}
.lp-tl .line{display:flex;align-items:center}
.lp-tl .dot{width:15px;height:15px;border-radius:50%;background:var(--ink);flex:none}
.lp-tl .dot.red{background:var(--red)}
.lp-tl .rule{flex:1;height:2px;background:var(--line)}
.lp-tl .day{font:700 24px/1 var(--cond);text-transform:uppercase;margin-top:12px}
.lp-tl .t{font:600 16px 'Barlow',sans-serif;margin-top:4px}
.lp-tl .d{font:400 15px/1.45 'Barlow',sans-serif;color:var(--muted2);margin-top:4px;padding-right:20px}

/* 09 why */
.lp-stats{display:flex;gap:22px;margin-top:16px;flex-wrap:wrap}
.lp-stats .n{font:700 26px/1 var(--cond)}
.lp-stats .l{font:400 14px 'Barlow',sans-serif;color:var(--muted2)}

/* 10 pricing */
.lp-toggle-wrap,.lp-plan-wrap{display:flex;justify-content:center;margin-top:18px}
.lp-toggle{display:flex;background:#F6F6F6;border:1px solid var(--line);border-radius:4px;padding:3px}
.lp-toggle button{font:600 15px 'Barlow',sans-serif;padding:9px 20px;border:0;background:none;color:var(--muted2);border-radius:3px;cursor:pointer}
.lp-toggle button.on{background:var(--ink);color:#fff}
.lp-plan{width:580px;max-width:100%;border:1px solid var(--ink);border-radius:8px;overflow:hidden}
.lp-plan .top{background:var(--ink);padding:22px 24px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.lp-plan .name{font:700 26px/1 var(--cond);text-transform:uppercase;color:#fff}
.lp-plan .sub{font:400 15px 'Barlow',sans-serif;color:rgba(255,255,255,.66);margin-top:5px}
.lp-plan .lp-price{text-align:right;flex:none}
.lp-plan .amt{font:700 42px/1 var(--cond);color:#fff}
.lp-plan .per{font:600 17px 'Barlow',sans-serif;color:rgba(255,255,255,.6)}
.lp-plan .or{font:400 13.5px var(--mono);color:rgba(255,255,255,.5)}
.lp-plan .body{padding:20px 24px}
.lp-plan .feats{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.lp-plan .feats div{font:500 15.5px 'Barlow',sans-serif}
.lp-plan .lp-btn{margin-top:18px}
.lp-plan .fine{font:400 14px/1.5 'Barlow',sans-serif;color:var(--muted);margin-top:10px;text-align:center}

/* 11 faq */
.lp-faq{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;align-items:start}
.lp-q{background:#fff;border:1px solid var(--line);border-radius:4px;padding:14px 16px}
.lp-q summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:12px;font:600 16px 'Barlow',sans-serif}
.lp-q summary::-webkit-details-marker{display:none}
.lp-q summary i{font-style:normal;color:var(--muted);flex:none}
.lp-q[open] summary i{transform:rotate(45deg)}
.lp-q p{font:400 15.5px/1.5 'Barlow',sans-serif;color:var(--muted2);margin-top:10px}

/* 12 final */
.lp-final{background:var(--ink);padding:88px 0;text-align:center}
.lp-final .t{font:700 44px/1 var(--cond);text-transform:uppercase;color:#fff}
.lp-final .lp-btn{margin-top:22px;padding:16px 30px}
.lp-final .fine{font:400 14.5px var(--mono);color:rgba(255,255,255,.45);margin-top:14px}
.lp-sticky{display:none}

/* tablet: keep the artboard, stack the wide rows */
@media (max-width:1000px){
  .pub-nav{gap:12px;font-size:14px}
  .lp-hero-in,.lp-split{flex-direction:column;align-items:stretch}
  .lp-sample,.lp-dash{width:100%}
  .lp-ph{min-height:200px}
  .lp-portrait,.lp-portrait-img{flex:none;width:232px}
  .lp-receive{grid-template-columns:repeat(2,1fr)}
  .lp-steps{grid-template-columns:repeat(2,1fr)}
}

/* phones — the 390px mobile frame */
@media (max-width:640px){
  .show-m-block{display:block!important}
  .pub-wrap{height:60px;padding:0 16px}
  .pub-nav{display:none}
  .pub-menu{display:block}
  .pub-join-m{display:inline-block;font-size:14px;padding:7px 11px}
  .pub-logo img{height:40px}

  /* hero, sample score, four stages, then straight to pricing */
  .lp-hero{order:1}
  .lp-msample{order:2}
  .lp-cycle{order:3}
  .lp-pricing{order:4}
  .lp-o-acc{order:5}
  .lp-faq-sec{order:6}
  .lp-final{order:7}

  .lp-wrap{padding:0 18px}
  .lp-hero{padding:36px 0}
  .lp-hero .lp-eyebrow{font-size:11.5px;letter-spacing:.12em}
  .lp-hero h1{font-size:40px;line-height:.98;margin-top:12px}
  .lp-hero p{font-size:16px;color:rgba(255,255,255,.74);margin-top:11px}
  .lp-cta{flex-direction:column;align-items:stretch;gap:9px;margin-top:18px}
  .lp-cta .lp-btn{font-size:17px;padding:15px}
  .lp-cta .lp-btn.ghost{padding:14px}
  .lp-fine{font-size:13.5px;margin-top:14px;text-align:center}

  .lp-msample{padding:24px 18px;background:#F6F6F6;border-bottom:1px solid var(--line)}
  .lp-msample .lp-sample{box-shadow:none;border:1px solid var(--line);border-radius:6px;padding:14px}
  .lp-msample .lp-mlabel{font-size:11.5px;letter-spacing:0}
  .lp-msample .lp-tag{font-size:11px;padding:3px 6px}
  .lp-msample .lp-sample-body{gap:14px;margin-top:12px}
  .lp-msample .lp-bars{gap:5px}
  .lp-msample .lp-bar{gap:6px}
  .lp-msample .lp-bar .n{font-size:13.5px;width:86px}
  .lp-msample .lp-bar .track{height:7px;border-radius:0}

  .lp-sec{padding:36px 0}
  .lp-eyebrow{font-size:11.5px}
  .lp-h2{font-size:26px}
  .lp-h2.sm{font-size:24px}

  .lp-cycle{background:#fff}
  .lp-sec.gray.lp-cycle{background:#fff}
  .lp-steps{grid-template-columns:1fr;gap:9px;margin-top:12px}
  .lp-step{border:1px solid var(--line);border-left:3px solid var(--red);border-radius:4px;padding:12px}
  .lp-step .n,.lp-step .t{display:inline;font:700 19px/1 var(--cond);text-transform:uppercase;color:var(--ink);margin:0}
  .lp-step .d{font-size:14.5px;line-height:1.4;color:var(--muted2);margin-top:5px}
  .lp-cycle .lp-btn-block{margin-top:22px;font-size:17px}

  /* sections 2 and 4–9 collapse into accordions */
  .lp-o-acc,.lp-sec.gray.lp-o-acc{padding:0;background:#fff;border-bottom:1px solid var(--line)}
  .lp-sec.dark.lp-o-acc{background:var(--ink)}
  .lp-acc-sum{display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none;cursor:pointer;
    padding:20px 18px;font:700 19px/1.1 var(--cond);text-transform:uppercase}
  .lp-acc-sum::-webkit-details-marker{display:none}
  .lp-acc-sum i{font:400 22px/1 'Barlow',sans-serif;font-style:normal;color:var(--muted)}
  .lp-acc[open] .lp-acc-sum i{transform:rotate(45deg)}
  .lp-sec.dark .lp-acc-sum{color:#fff}
  .lp-acc > .lp-wrap{padding-bottom:22px}
  .lp-acc .lp-eyebrow{display:none}
  .lp-acc .lp-h2{margin-top:0}
  .lp-split,.lp-split.lp-mid{gap:16px;margin-top:10px}
  .lp-minis{flex-direction:column}
  .lp-dash-row{flex-direction:column}
  .lp-tile.fixed{flex:none}
  .lp-receive{grid-template-columns:1fr 1fr;gap:8px}
  .lp-rcard{padding:12px}
  .lp-rcard .t{font-size:17px}
  .lp-head-row{flex-direction:column;gap:8px}
  .lp-lessons{grid-template-columns:1fr;gap:10px}
  .lp-timeline{flex-direction:column;gap:16px}
  .lp-tl .rule{display:none}
  .lp-tl .d{padding-right:0}
  .lp-ph{min-height:180px}
  .lp-portrait,.lp-portrait-img{width:100%;height:220px}

  .lp-toggle button{padding:9px 14px}
  .lp-plan .top{padding:18px;flex-direction:column;align-items:flex-start}
  .lp-plan .lp-price{text-align:left}
  .lp-plan .body{padding:18px}
  .lp-plan .feats{grid-template-columns:1fr}

  .lp-faq{grid-template-columns:1fr;gap:8px}
  .lp-final{padding:44px 0 104px}
  .lp-final .t{font-size:30px}
  .lp-final .lp-btn{display:block}

  /* sticky CTA bar follows the scroll */
  .lp-sticky{display:block;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;
    border-top:1px solid var(--line);padding:10px 16px;box-shadow:0 -6px 18px rgba(0,0,0,.08)}
  .lp-sticky .lp-btn{font-size:17px;padding:14px}
}

/* ==========================================================================
   Member Benefits (module 1) — discount / exclusive content / perk cards
   ========================================================================== */
.ben-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.ben-head p{max-width:620px}
.ben-sec{margin-top:32px}
.ben-sec-t{font:700 15px/1 var(--cond);letter-spacing:.08em;text-transform:uppercase;
  padding-bottom:8px;border-bottom:1px solid var(--line)}
.ben-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.ben-card{background:var(--card);border:1px solid var(--line);border-radius:6px;
  box-shadow:var(--shadow);padding:20px;display:flex;flex-direction:column;gap:8px}
.ben-main{display:flex;flex-direction:column;gap:8px;flex:1}
.ben-card .ben-coupon{order:2}
/* discount cards: full width banner, content on the left (dark text on the light part of the image) */
.ben-grid-discount{grid-template-columns:1fr;gap:35px}
.ben-discount{position:relative;overflow:hidden;min-height:340px;padding:40px 6%;border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);display:flex;flex-direction:column;justify-content:center;gap:0;
  background-color:#eee;background-size:cover;background-position:center;background-repeat:no-repeat}
.ben-discount .ben-main{flex:none;max-width:560px;gap:6px}
.ben-discount .ben-partner{font:500 15px/1 var(--cond);letter-spacing:.35em;color:#111}
.ben-discount .ben-title{font:900 clamp(32px,6vw,54px)/1 var(--cond);overflow-wrap:anywhere;letter-spacing:-.02em;color:#000;text-transform:none}
.ben-discount .ben-offer{font:900 italic clamp(44px,9vw,78px)/1 var(--cond);letter-spacing:-.02em;color:var(--red);
  text-shadow:0 3px 0 rgba(0,0,0,.12)}
.ben-discount .ben-sum,.ben-discount .ben-body{color:#222;max-width:460px}
/* coupon: chamfered red button, like the "Go to shop" CTA */
.ben-discount .ben-coupon{order:0;align-self:flex-start;margin:20px 0 0;min-width:270px;padding:16px 22px 16px 26px;
  gap:22px;justify-content:space-between;border:0;border-radius:0;color:#fff;
  background:#000;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.ben-discount .ben-code{flex:none;font:800 20px/1 var(--cond);letter-spacing:.14em;color:#fff}
.ben-discount .ben-copy{background:transparent;border:1px solid rgba(255,255,255,.7);color:#fff;border-radius:0;
  padding:6px 12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ben-discount .ben-copy:hover{background:#fff;color:#c4170a}
.ben-discount .ben-copy.is-copied{background:#fff;border-color:#fff;color:#1a7f37}
/* footer: red slanted tag button (like "Member pricing") with an arrow, and the expiry with a clock */
.ben-discount .ben-foot{margin-top:20px;padding-top:0;justify-content:flex-start;gap:16px 28px;flex-wrap:wrap}
.ben-discount .ben-foot .btn-red{display:inline-flex;align-items:center;gap:12px;padding:13px 24px;border:0;border-radius:0;
  background:var(--red);color:#fff;font:600 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,10px 100%);transition:filter .2s,transform .2s}
.ben-discount .ben-foot .btn-red::after{content:"";width:16px;height:16px;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .2s}
.ben-discount .ben-foot .btn-red:hover{filter:brightness(1.12)}
.ben-discount .ben-foot .btn-red:hover::after{transform:translateX(4px)}
.ben-discount .ben-exp{display:inline-flex;align-items:center;gap:10px;font:600 12px/1 var(--cond);
  letter-spacing:.04em;color:#111}
.ben-discount .ben-exp::before{content:"";width:20px;height:20px;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DA1414' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/contain no-repeat}
.ben-discount:hover{box-shadow:0 16px 40px rgba(0,0,0,.26)}
.ben-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:4px;background:var(--ink);color:#fff;font-size:20px;margin-bottom:4px}
.ben-partner{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ben-title{font:700 20px/1.2 var(--cond);letter-spacing:-.01em;text-transform:capitalize}
.ben-offer{font:700 26px/1 var(--cond);color:var(--red)}
.ben-sum{color:var(--muted2);font-size:15px}
.ben-body{color:var(--muted2);font-size:14px}
.ben-coupon{display:flex;align-items:center;gap:8px;margin-top:4px;padding:10px 12px;
  border:1px dashed var(--line);border-radius:4px;background:var(--page)}
.ben-code{flex:1;font:600 15px/1 var(--mono);letter-spacing:.06em;color:var(--ink)}
.ben-copy.is-copied{background:var(--green);border-color:var(--green);color:#fff}
.ben-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:12px}
.ben-exp{font:600 11px/1.2 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

@media (max-width:900px){
  .ben-grid{grid-template-columns:1fr 1fr}
  .ben-grid-discount{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ben-head{flex-direction:column;gap:12px}
  .ben-grid{grid-template-columns:1fr;gap:12px}
  .ben-card{padding:16px}
  /* phone: banner covers the whole card; a light veil keeps the dark text readable over the photo */
  .ben-discount{padding:26px 20px 30px;min-height:420px;justify-content:center;
    background-size:cover;background-position:70% center}
  .ben-discount::before{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.45) 55%,rgba(255,255,255,.1) 100%)}
  .ben-discount>*{position:relative}
  .ben-discount .ben-main{max-width:none}
  .ben-discount .ben-coupon{min-width:0;align-self:stretch;margin-top:16px}
  .ben-discount .ben-code{font-size:18px}
  .ben-discount .ben-foot{margin-top:16px}
}


/* ==========================================================================
   Typed content (module 2) — Ambassadors + Science Lab cards, filters, detail
   ========================================================================== */
.ct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.ct-head p{max-width:640px}

/* ---- filters ---- */
.ct-search{display:flex;align-items:center;gap:8px;margin-top:20px}
.ct-search input[type=search]{flex:1;max-width:420px;height:40px;padding:0 12px;
  border:1px solid var(--line);border-radius:4px;background:var(--card);
  font:400 16px/1 'Barlow',sans-serif;color:var(--ink)}
.ct-search input[type=search]:focus{outline:none;border-color:var(--ink)}

.ct-tabs{display:flex;flex-wrap:wrap;gap:4px;margin-top:20px;border-bottom:1px solid var(--line)}
.ct-tab{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;
  font:700 13px/1 var(--cond);letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);
  border-bottom:2px solid transparent}
.ct-tab:hover{color:var(--ink)}
.ct-tab.on{color:var(--ink);border-bottom-color:var(--red)}
.ct-tab .n{font:600 11px/1 var(--mono);color:var(--muted)}

.ct-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px}
.ct-chips-lbl{font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-right:4px}
.ct-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);color:var(--muted2);font-size:14px}
.ct-chip:hover{border-color:var(--ink);color:var(--ink)}
.ct-chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.ct-chip .n{font:600 11px/1 var(--mono);opacity:.7}

/* ---- card grid ---- */
.ct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ct-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);
  border-radius:6px;box-shadow:var(--shadow);overflow:hidden;color:var(--ink)}
.ct-card:hover{border-color:var(--ink);color:var(--ink)}
.ct-body{display:flex;flex-direction:column;gap:10px;padding:16px;flex:1}
.ct-meta{font:600 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ct-title{font:700 20px/1.15 var(--cond);letter-spacing:-.01em;}
.ct-sum{color:var(--muted2);font-size:15px;line-height:1.45}
.ct-result{align-self:flex-start;padding:4px 8px;border-radius:3px;background:rgba(31,111,74,.1);
  color:var(--green);font:600 12px/1.3 var(--mono)}
.ct-foot{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:10px}
.ct-tag{padding:3px 8px;border:1px solid var(--line);border-radius:999px;
  font:600 10.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ct-tag-file{border-color:var(--red);color:var(--red)}

/* video thumbnail */
/* fixed 16:9 box — YouTube's hqdefault is 4:3 with black bars, so it gets cropped */
.ct-thumb{position:relative;display:block;height:0;padding-top:56.25%;background:var(--ink);flex:none}
.ct-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ct-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:48px;height:48px;border-radius:50%;background:rgba(218,20,20,.92);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:18px;padding-left:3px}
.ct-dur{position:absolute;right:8px;bottom:8px;padding:2px 6px;border-radius:3px;
  background:rgba(17,17,17,.82);color:#fff;font:600 11px/1.4 var(--mono)}

/* testimonial — the quote is the card's visual block (balances a video thumbnail),
   the person sits under the title */
.ct-quotebox{position:relative;flex:1;display:flex;align-items:center;min-height:150px;
  padding:24px 22px 24px 50px;background:var(--page);border-bottom:1px solid var(--line)}
.ct-quotebox::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--red)}
.ct-qmark{position:absolute;left:16px;top:10px;font:700 46px/1 var(--cond);color:rgba(218,20,20,.22)}
.ct-qtxt{font-size:16.5px;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.ct-testimonial .ct-body{flex:none}
.ct-person{display:flex;align-items:center;gap:10px;margin-top:4px;padding-top:12px;
  border-top:1px solid var(--line)}
.ct-photo{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--line)}
.ct-photo-blank{background:var(--page)}
.ct-person-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ct-person-name{font:700 16px/1.2 var(--cond);text-transform:uppercase;letter-spacing:-.01em}
.ct-person-meta{font:600 11px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

/* ---- detail page ---- */
.ct-detail{max-width:1440px}
.ct-detail-meta{margin-top:8px;font:600 11.5px/1.4 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.ct-lead{margin-top:16px;font-size:19px;line-height:1.5;color:var(--muted2);max-width:70ch}
.ct-h2{margin-top:32px;margin-bottom:12px;font:700 22px/1.1 var(--cond);text-transform:uppercase;letter-spacing:-.01em}
.ct-lede-img{width:100%;height:auto;border-radius:6px;border:1px solid var(--line)}
.ct-embed{position:relative;aspect-ratio:16/9;background:var(--ink);border-radius:6px;overflow:hidden}
.ct-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ct-embed-link{margin-top:8px}

.ct-tst{display:flex;align-items:center;gap:16px;padding:20px;background:var(--card);
  border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow)}
.ct-tst-photo{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--line)}
.ct-tst-name{font:700 22px/1.1 var(--cond);text-transform:uppercase;letter-spacing:-.01em}
.ct-tst-meta{margin-top:4px;font:600 11.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ct-tst-result{margin-top:8px;display:inline-block;padding:4px 9px;border-radius:3px;
  background:rgba(31,111,74,.1);color:var(--green);font:600 13px/1.3 var(--mono)}

/* admin-written rich text */
.ct-prose{line-height:1.6}
.ct-prose p{margin-bottom:12px}
.ct-prose p:last-child{margin-bottom:0}
.ct-prose h2,.ct-prose h3,.ct-prose h4{font-family:var(--cond);text-transform:uppercase;
  letter-spacing:.02em;margin:20px 0 8px}
.ct-prose h2{font-size:24px}
.ct-prose h3{font-size:20px}
.ct-prose h4{font-size:17px}
.ct-prose ul,.ct-prose ol{margin:0 0 12px 20px}
.ct-prose li{margin-bottom:5px}
.ct-prose blockquote{margin:12px 0;padding-left:14px;border-left:3px solid var(--red);color:var(--muted2)}
.ct-prose table{width:100%;border-collapse:collapse;margin:12px 0;font-size:15px}
.ct-prose th,.ct-prose td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.ct-prose th{background:var(--page);font:700 12px/1.3 var(--cond);letter-spacing:.06em;text-transform:uppercase}
.ct-prose code{font:400 14px/1.4 var(--mono);background:var(--page);padding:1px 4px;border-radius:3px}
.ct-prose pre{background:var(--page);border:1px solid var(--line);border-radius:4px;padding:12px;
  overflow-x:auto;font:400 14px/1.5 var(--mono);margin:12px 0}
.ct-prose img{max-width:100%;height:auto;border-radius:4px;margin:12px 0}
.ct-prose figure{margin:16px 0}
.ct-prose figcaption{margin-top:6px;font:600 12px/1.4 var(--mono);letter-spacing:.04em;color:var(--muted)}
.ct-prose iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:4px;margin:12px 0}
.ct-prose hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.ct-quote{font-size:19px;line-height:1.55;border-left:3px solid var(--red)}
.ct-source .label{color:var(--muted)}
.ct-file{display:flex;flex-wrap:wrap;gap:8px}
.ct-back a{font:600 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}

@media (max-width:900px){
  .ct-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .ct-head{flex-direction:column;gap:12px}
  .ct-grid{grid-template-columns:1fr;gap:12px}
  .ct-search{flex-wrap:wrap}
  .ct-search input[type=search]{max-width:none;width:100%}
  .ct-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ct-tab{white-space:nowrap}
  .ct-lead{font-size:17px}
  .ct-quotebox{min-height:120px;padding:18px 16px 18px 46px}
  .ct-qtxt{font-size:16px;-webkit-line-clamp:4}
  .ct-tst{flex-direction:column;align-items:flex-start;text-align:left}
  .ct-prose table{display:block;overflow-x:auto}
}
/* ==========================================================================
   Tools (module 3) — hub, protein calculator, workout tracker
   ========================================================================== */
.tl-sec{margin-top:32px}
.tl-sec-t{font:600 15px/1 var(--cond);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}

/* ---- protein calculator card on the hub ---- */
.tl-calc{display:flex;align-items:center;justify-content:space-between;gap:20px;
  background:var(--ink);color:#fff;border-radius:6px;padding:22px 24px}
.tl-calc:hover{color:#fff}
.tl-calc-txt{display:flex;flex-direction:column;gap:6px}
.tl-calc-lead{font-size:18px;font-weight:600}
.tl-calc-sub{font:400 13px/1.4 var(--mono);color:#bdbdbd}
.tl-calc-num{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.tl-calc-num b{font:600 44px/1 var(--cond);color:var(--pink)}
.tl-calc-unit{font:400 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#bdbdbd}

/* ---- routine cards ---- */
.tl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tl-card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:18px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}
.tl-meta{font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tl-title{font-size:19px;line-height:1.25;text-transform:capitalize;font-weight:700}
.tl-title a{color:var(--ink)}
.tl-title a:hover{color:var(--red)}
.tl-sum{font-size:15px;color:var(--muted2)}
.tl-equip{font-size:14px;color:var(--muted2)}
.tl-equip .label{margin-right:6px}
.tl-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto;padding-top:8px}

/* ---- food resources ---- */
.tl-docs{display:flex;flex-direction:column;gap:10px}
.tl-doc{display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px 18px}
.tl-doc-txt{display:flex;flex-direction:column;gap:4px}
.tl-doc-title{font-size:17px;font-weight:600;color:var(--ink)}
.tl-doc-title:hover{color:var(--red)}
.tl-doc-sum{font-size:14px;color:var(--muted2)}
.tl-doc-act{display:flex;gap:8px;white-space:nowrap}

/* ---- calculator page ---- */
.tl-protein{max-width:1440px}
.tl-intro{margin-top:16px}
.tl-form{margin-top:24px;padding:22px}
.tl-weight{display:flex;gap:8px;align-items:center}
.tl-weight input{max-width:160px}
.tl-weight select{max-width:90px}
.tl-goal{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:4px;
  padding:12px 14px;margin-bottom:8px;cursor:pointer;font-weight:400}
.tl-goal:hover{border-color:var(--ink)}
.tl-goal input{margin-top:5px}
.tl-goal-txt{display:flex;flex-direction:column;gap:2px}
.tl-goal-name{font-weight:600}
.tl-goal-factor{font:400 12px/1 var(--mono);color:var(--muted);margin-left:8px}
.tl-goal-desc{font-size:14px;color:var(--muted2)}
.tl-range{display:flex;gap:8px;align-items:center}

.tl-result{margin-top:32px}
.tl-result-top{background:var(--ink);color:#fff;border-radius:6px;padding:24px}
.tl-result-top .label{color:#bdbdbd}
.tl-result-num{margin-top:6px;font-size:20px}
.tl-result-num b{font:600 52px/1 var(--cond);color:var(--pink);margin-right:8px}
.tl-result-sub{font:400 13px/1.5 var(--mono);color:#bdbdbd;margin-top:8px}
.tl-result .tl-sec-t{margin-top:28px}
.tl-meals{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tl-meal{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:16px;
  display:flex;flex-direction:column;gap:6px}
.tl-meal-name{font:600 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tl-meal-num{font:600 26px/1 var(--cond)}
.tl-meal-unit{font-size:14px;color:var(--muted)}
.tl-meal-hint{font-size:14px;color:var(--muted2)}
.tl-note{margin-top:20px}
.tl-disclaimer{margin-top:24px;color:var(--muted2)}

/* ---- routine detail table + printable tracker ---- */
.tl-ex-tbl,.tl-trk-tbl{width:100%;border-collapse:collapse;background:var(--card);
  border:1px solid var(--line);border-radius:6px;overflow:hidden}
.tl-ex-tbl th,.tl-trk-tbl th{font:600 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:bottom}
.tl-ex-tbl td,.tl-trk-tbl td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
.tl-ex-tbl tr:last-child td,.tl-trk-tbl tr:last-child td{border-bottom:0}
.tl-ex-name,.tl-trk-ex{width:44%}
.tl-trk-name{display:block;font-weight:600}
.tl-trk-note{display:block;font-size:14px;color:var(--muted2)}
.tl-ex-video{display:inline-block;margin-top:4px;font:600 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.tl-trk-c{font:400 15px/1.4 var(--mono);white-space:nowrap}
.tl-trk-sub{display:block;font-weight:400;text-transform:none;letter-spacing:0;color:var(--locked)}
.tl-trk-box{min-width:90px;border-left:1px solid var(--line)}
.tl-trk-date{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:16px 0 20px}
.tl-trk-line{flex:1;min-width:140px;border-bottom:1px solid var(--muted);height:20px}
.tl-trk-line-sm{max-width:180px;flex:none;width:180px}
.tl-trk-notes{display:flex;flex-direction:column;gap:18px;margin-top:24px}

@media (max-width:900px){
  .tl-grid{grid-template-columns:1fr 1fr}
  .tl-meals{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .tl-grid{grid-template-columns:1fr}
  .tl-meals{grid-template-columns:1fr 1fr}
  .tl-calc{flex-direction:column;align-items:flex-start;gap:12px}
  .tl-doc{flex-direction:column;align-items:flex-start}
  .tl-ex-tbl,.tl-trk-tbl{display:block;overflow-x:auto;white-space:nowrap}
  .tl-protein{max-width:none}
}
/* ==========================================================================
   Print — every member page prints as a clean document
   ========================================================================== */
@media print{
  @page{margin:14mm}
  body{background:#fff;font-size:12pt}
  .memberbar,.backbar,.topbar,.foot,.admin-side,.btn-print,.lp-sticky{display:none !important}
  .app-main{padding:0 !important}
  .wrap{max-width:none;padding:0}
  .block{padding:0}
  a{color:#000;text-decoration:none}
  /* a link's destination is lost on paper — print it after the text */
  .ben-foot a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
  .ben-card,.lib-item,.card{box-shadow:none;border:1px solid #bbb;break-inside:avoid;page-break-inside:avoid}
  .ben-grid,.lib-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ben-sec{break-inside:avoid}
  .ben-coupon{background:#fff;border:1px dashed #888}
  .ben-offer{color:#000}
  .ben-copy{display:none !important}

  /* typed content (module 2) */
  .ct-search,.ct-tabs,.ct-chips,.ct-play,.ct-embed,.ct-back{display:none !important}
  .ct-card,.ct-tst,.ct-prose{box-shadow:none;border:1px solid #bbb;break-inside:avoid;page-break-inside:avoid}
  .ct-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ct-thumb{display:none}
  .ct-quotebox{background:#fff;border-bottom:1px solid #bbb;min-height:0;padding:12px 12px 12px 40px}
  .ct-quotebox::before{background:#888}
  .ct-qmark{color:#bbb;font-size:40px}
  .ct-qtxt{color:#000;-webkit-line-clamp:none;display:block;overflow:visible}
  .ct-result,.ct-tst-result{background:#fff;border:1px solid #bbb;color:#000}
  .ct-detail{max-width:none}
  .ct-lead{color:#000}
  .ct-prose table{width:100%;font-size:10pt}
  .ct-prose th{background:#eee}
  .ct-prose img{max-width:100%;break-inside:avoid;page-break-inside:avoid}
  .ct-prose iframe{display:none}
  /* tools (module 3): the calculator sheet and the gym tracker */
  .tl-calc,.tl-result-top{background:#fff;color:#000;border:1px solid #bbb}
  .tl-calc-num b,.tl-result-num b{color:#000}
  .tl-calc-sub,.tl-calc-unit,.tl-result-sub,.tl-result-top .label{color:#333}
  .tl-card,.tl-doc,.tl-meal{box-shadow:none;border:1px solid #bbb;break-inside:avoid;page-break-inside:avoid}
  .tl-doc-act,.tl-foot,.tl-form,.tl-ex-video{display:none !important}
  .tl-meals{grid-template-columns:repeat(4,1fr)}
  .tl-grid{grid-template-columns:1fr 1fr}
  .tl-ex-tbl,.tl-trk-tbl{width:100%;font-size:10pt;border:1px solid #888}
  .tl-ex-tbl th,.tl-trk-tbl th{background:#eee;color:#000}
  .tl-trk-tbl tr{break-inside:avoid;page-break-inside:avoid}
  .tl-trk-box{border-left:1px solid #888;height:34px}
  .tl-trk-line{border-bottom:1px solid #000}
  .ct-file a[href],.ct-source-link[href]{display:none !important}
  .ct-source p a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
  /* quiz (module 5): the result sheet prints, the question screen prints plainly */
  .qz{grid-template-columns:1fr;max-width:none;margin:0}
  .qz-rail,.qz-nav,.qz-main form p.muted{display:none !important}
  .score-hero{display:block}
  .domain-row{break-inside:avoid;page-break-inside:avoid}
  .cycle{grid-template-columns:repeat(3,1fr)}
  .cycle .step{break-inside:avoid;page-break-inside:avoid;border:1px solid #bbb}
}

/* ==========================================================================
   Module 4 — Portfolio Review (/health-portfolio): benchmarks, no score
   ========================================================================== */
.hp-page{max-width:1440px;
  --hp-tint:rgba(218,20,20,.07);--hp-redline:rgba(218,20,20,.3)}
.hp-head .label{color:var(--red)}
.hp-prose{color:var(--muted2);font-size:16px}
.hp-prose p{margin-top:10px}
.hp-prose p:first-child{margin-top:0}
.hp-prose ul,.hp-prose ol{margin:10px 0 0 20px}
.hp-h3{font:800 18px/1.1 var(--cond);letter-spacing:-.01em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}

/* hero */
/* smooth scrolling for the rail / table / button links on this page only */
html:has(.hp-page){scroll-behavior:smooth;scroll-padding-top:16px}
@media (prefers-reduced-motion:reduce){html:has(.hp-page){scroll-behavior:auto}}

.hp-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:48px;align-items:end;
  padding:22px 0 36px;border-bottom:1px solid var(--line)}
.hp-head{display:block}
.hp-kicker{font:700 13px/1.3 var(--mono);letter-spacing:.14em;color:var(--red);text-transform:uppercase}
.hp-hero h1{margin-top:10px;font-size:clamp(34px,4vw,54px);line-height:1}
.hp-noscore{display:inline-block;margin-top:14px;padding:6px 13px;border:0;
  border-radius:999px;background:#E7F5EC;
  font:600 11px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.hp-hero .hp-prose{font-size:16px;max-width:64ch}
.hp-side{border-left:4px solid var(--red);padding:4px 0 4px 20px}
.hp-side p{margin:0 0 12px;color:var(--muted2);font-size:15.5px}
.hp-side .hp-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}

/* pillars */
.hp-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line)}
.hp-pillar{padding:26px 26px 26px 0}
.hp-pillar+.hp-pillar{padding-left:26px;border-left:1px solid var(--line)}
.hp-pillar-icon{display:none}
.hp-pillar-t{font:800 20px/1.05 var(--cond);letter-spacing:-.01em;text-transform:uppercase;margin:0 0 8px}
.hp-pillar-b{color:var(--muted2);font-size:15.5px;margin:0}

.hp-sec-t{font:800 30px/1.05 var(--cond);letter-spacing:-.01em;text-transform:uppercase;margin:0}

/* holdings at a glance */
.hp-statement{padding-top:44px}
.hp-statement>p{margin:8px 0 16px;color:var(--muted);max-width:62ch}
.hp-hold{overflow-x:auto;border-top:3px solid var(--ink)}
.hp-hold table{width:100%;border-collapse:collapse;min-width:720px}
.hp-hold th{font:600 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--ink)}
.hp-hold td{padding:14px;border-bottom:1px solid var(--line);vertical-align:top;font-size:15.5px;color:var(--ink)}
.hp-hold tr.hp-hold-group td{background:#f0f0f0;font:700 12px/1.2 var(--cond);letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted2);padding:14px 14px}
.hp-hold tr.hp-hold-row{cursor:pointer}
.hp-hold tr.hp-hold-row:hover td{background:var(--hp-tint)}
.hp-hold .hp-hold-name{white-space:nowrap}
.hp-hold .hp-hold-name a{font:800 16px/1.1 var(--cond);color:var(--ink);text-transform:uppercase}
.hp-hold .hp-hold-name a:hover{color:var(--red)}
.hp-hold .hp-hold-fig{font:800 16px/1.2 var(--cond);color:var(--red);white-space:nowrap}
.hp-hold .hp-hold-flag{font:600 13px/1.2 var(--mono);color:var(--red);white-space:nowrap}

/* rail + areas */
.hp-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:48px;padding:40px 0 20px}
.hp-rail{position:sticky;top:20px;align-self:start;max-height:calc(100vh - 40px);overflow:auto}
.hp-rail .label{display:block;margin-bottom:8px;font: 800 12px / 1.2 var(--mono);}
.hp-rail ol{list-style:none;border-left:3px solid var(--line)}
.hp-rail a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;margin-left:-2px;
  border-left:2px solid transparent;color:var(--muted2);font-size:15px;line-height:1.3}
.hp-rail a:hover{color:var(--red)}
.hp-rail a.active{border-left:3px solid var(--red);margin-left:-3px;color:var(--ink);font-weight:600;background:var(--hp-tint)}
.hp-rail .dot{width:8px;height:8px;border-radius:50%;background:var(--red);flex-shrink:0;visibility:hidden}
.hp-rail a.flagged .dot{visibility:visible}
.hp-rail-foot{margin-top:18px;font-size:14px}

.hp-areas{display:flex;flex-direction:column;gap:0}
.hp-area{border-top:3px solid var(--ink);padding:26px 0 40px;scroll-margin-top:16px}
.hp-area-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.hp-badge{display:inline-block;font:600 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--red);
  border:1.5px solid var(--red);border-radius:3px;padding:2px 8px;white-space:nowrap}
.hp-area-title{font:800 clamp(28px,3.4vw,38px)/1.05 var(--cond);letter-spacing:-.01em;text-transform:uppercase;margin:10px 0 0}
.hp-area-icon{font-size:0.8em;vertical-align:.1em;}
.hp-area-body{padding:0}
.hp-focus-btn{min-width:160px;white-space:nowrap;justify-content:center}
.hp-focus-btn[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}

.hp-target{margin-top:14px;padding:16px 20px;border-left:5px solid var(--red);background:var(--hp-tint)}
.hp-target p{font:700 clamp(18px,2vw,22px)/1.3 var(--cond);margin-top:6px;color:var(--ink)}
.hp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:20px 0 24px;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hp-stat{padding:14px 16px 14px 0}
.hp-stat+.hp-stat{padding-left:16px;border-left:1px solid var(--line)}
.hp-stat b{display:block;font:800 30px/1 var(--cond);color:var(--red)}
.hp-stat span{display:block;margin-top:6px;font-size:14px;line-height:1.4;color:var(--muted2)}
.hp-compare{background:#f0f0f0;padding:16px 18px;border-radius:4px}
.hp-col-wide{grid-column:1/-1;display: none;}
.hp-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:22px}
.hp-list{list-style:none}
.hp-list li{position:relative;padding-left:22px;margin:0 0 8px;color:var(--muted2);font-size:15px}
.hp-list li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:10px;background:var(--red);transform:skewX(-8deg)}
.hp-list-help li::before{background:var(--red)}

.hp-deeper{margin-top:24px;border:1px solid var(--line);border-radius:4px}
.hp-deeper-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 16px;border-bottom:1px solid var(--line)}
.hp-deeper .hp-h3{margin:0}
.hp-deeper-domains{font-size:13.5px;color:var(--muted)}
.hp-deeper-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.hp-deeper-col{padding:14px 16px}
.hp-deeper-col+.hp-deeper-col{border-left:1px solid var(--line)}
.hp-deeper-col .label{display:block;margin-bottom:6px;color:var(--red)}
.hp-deeper-col ul{list-style:none}
.hp-deeper-col li{margin:0 0 6px;font-size:14.5px;line-height:1.35}
.hp-deeper-col li a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--hp-redline);text-underline-offset:3px}
.hp-deeper-col li a:hover{color:var(--red)}

.hp-products{margin-top:24px}
.hp-prod-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.hp-prod{display:inline-block;padding:7px 12px;border:1px solid var(--line);border-radius:4px;
  background:var(--page);font-size:14px;color:var(--ink)}
a.hp-prod:hover{border-color:var(--red);color:var(--red)}
.hp-domains{margin-top:20px;color:var(--muted);font-size:14px}
.hp-domains .label{margin-right:8px}
.hp-learn{font:600 13px/1.2 var(--mono);letter-spacing:.03em}

.hp-pager{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
.hp-pager a{flex:1 1 0;display:block;padding:12px 16px;border:1px solid var(--line);border-radius:4px;color:var(--ink)}
.hp-pager a:hover{border-color:var(--red)}
.hp-pager small{display:block;font-size:13px;color:var(--muted)}
.hp-pager span{font:800 16px/1.2 var(--cond);text-transform:uppercase}
.hp-pager a.next{text-align:right}

/* three ways to go deeper */
.hp-paths{padding:40px 0;border-top:3px solid var(--ink);margin-top:20px}
.hp-paths-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px;border-top:1px solid var(--line)}
.hp-path{padding:18px 20px 18px 0}
.hp-path+.hp-path{padding-left:20px;border-left:1px solid var(--line)}
.hp-path h3{font:800 20px/1.1 var(--cond);letter-spacing:-.01em;text-transform:uppercase;color:var(--red);margin:0 0 8px}
.hp-path p{margin:0;color:var(--muted2);font-size:15.5px}
@media (max-width:900px){
  .hp-paths-grid{grid-template-columns:1fr}
  .hp-path,.hp-path+.hp-path{padding:16px 0;border-left:0;border-top:1px solid var(--line)}
}

/* focus list + closing */
.hp-cta{padding:30px 36px;background:var(--ink);color:#fff;border-radius:8px}
.hp-cta .hp-sec-t{color:#fff}
.hp-cta .hp-prose{color:rgba(255,255,255,.72);max-width:64ch}
.hp-cta .hp-prose strong,.hp-cta .hp-prose b{color:#fff}
.hp-focus-empty,.hp-focus-note{margin-top:8px;color:rgba(255,255,255,.72);max-width:64ch}
.hp-focus-list{list-style:none;margin:18px 0 22px;display:grid;gap:10px}
.hp-focus-list li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;
  border-top:1px solid rgba(255,255,255,.2);padding-top:10px}
.hp-focus-list .nm{font:800 18px/1.2 var(--cond);text-transform:uppercase}
.hp-focus-list a{color:#fff;text-decoration:underline}
.hp-cta .btn{margin-top:20px;margin-right:8px}
.hp-cta .btn-ghost-dark{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.hp-cta .btn-ghost-dark:hover{background:#fff;color:var(--ink);border-color:#fff}
.hp-focus-closing{margin-top:22px}
.hp-disclaimer{margin-top:24px;font-size:14px;color:var(--muted)}

@media (max-width:900px){
  .hp-hero{grid-template-columns:1fr;gap:24px}
  .hp-pillars{grid-template-columns:1fr}
  .hp-pillar,.hp-pillar+.hp-pillar{padding:18px 0;border-left:0;border-top:1px solid var(--line)}
  .hp-layout{grid-template-columns:1fr;gap:0;padding-top:24px}
  .hp-rail{position:sticky;top:0;z-index:10;background:var(--page);max-height:none;overflow-x:auto;padding:10px 0;
    border-bottom:1px solid var(--line);margin-bottom:12px}
  .hp-rail .label,.hp-rail-foot{display:none}
  .hp-rail ol{display:flex;gap:8px;border:0;white-space:nowrap}
  .hp-rail a{border:1px solid var(--line);border-radius:20px;margin:0;padding:6px 12px;font-size:14px;background:#fff}
  .hp-rail a.active{border:1px solid var(--red);margin-left:0}
  .hp-cols,.hp-stats,.hp-deeper-grid{grid-template-columns:1fr}
  .hp-stat,.hp-stat+.hp-stat{padding:12px 0;border-left:0;border-top:1px solid var(--line)}
  .hp-stat:first-child{border-top:0}
  .hp-deeper-col+.hp-deeper-col{border-left:0;border-top:1px solid var(--line)}
  .hp-pager{flex-direction:column}
  .hp-area-head{flex-direction:column;flex-wrap:nowrap;align-items:flex-start}
}

@media print{
  .pubbar,.pub-head,.pub-foot{display:none !important}
  .hp-pillars{grid-template-columns:repeat(3,1fr);gap:10px}
  .hp-pillar,.hp-area,.hp-cta{box-shadow:none;border:1px solid #bbb;
    break-inside:avoid;page-break-inside:avoid}
  .hp-area-mark{display:none}
  .hp-rail,.hp-area-tools,.hp-side .hp-actions,.hp-pager{display:none !important}
  .hp-layout{display:block}
  .hp-area-sum{cursor:auto}
  .hp-target{background:#fff;border-left:3px solid #888}
  .hp-prod{background:#fff;border:1px solid #bbb}
  .hp-cta{background:#fff;color:#000}
  .hp-cta .hp-prose{color:#000}
  .hp-prose,.hp-list li,.hp-domains{color:#000}
  .hp-cta .btn{display:none !important}
  /* a link's destination is lost on paper — print it after the text */
  a.hp-prod[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
}

/* ==========================================================================
   Module 6 - My Portfolio (/portfolio): the result sheet of the latest attempt
   ========================================================================== */
.mp-page{max-width:1440px}
.mp-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.mp-head-act{display:flex;gap:10px;flex-wrap:wrap}
.mp-lead{max-width:62ch}
.mp-fine{font-size:13px}

/* score block + the three facts beside it */
.mp-top{display:grid;grid-template-columns:230px 1fr;gap:20px;align-items:stretch}
.mp-score{background:var(--ink);color:#fff;border-radius:6px;padding:22px 24px;
  display:flex;flex-direction:column;justify-content:center}
.mp-score .big-num{color:#fff;font-size:76px}
.mp-of{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.mp-score-lbl{color:rgba(255,255,255,.7);margin-top:12px}
.mp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mp-stat{background:#fff;border:1px solid var(--line);border-radius:6px;padding:16px 18px}
.mp-stat b{display:block;font-family:var(--cond);font-size:24px;font-weight:600;line-height:1.15;margin-top:6px}
.mp-stat i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:8px}

/* the seven bars reuse .domain-row; only the "strongest" mark is new */
.mp-domains .domain-row:first-child{margin-top:0}
.mp-best{font:600 10px/1 var(--mono);font-style:normal;letter-spacing:.08em;
  text-transform:uppercase;color:var(--green);margin-left:6px}

/* the two priorities, each with its own 30 / 60 / 90 plan */
.mp-prio-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.mp-plan{margin-top:16px;border-top:1px solid var(--line)}
.mp-plan-row{padding:14px 0;border-bottom:1px solid var(--line)}
.mp-plan-row:last-child{border-bottom:0;padding-bottom:0}
.mp-plan-row p{font-size:15px;margin-top:6px}
.mp-plan-row p.mp-measure{font-size:13px;color:var(--muted2);margin-top:6px}
.mp-links{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.mp-links ul{list-style:none;margin:8px 0 0;padding:0}
.mp-links li{font-size:14px;padding:3px 0}

.mp-barrier{border-left:3px solid var(--red)}

/* performance tests */
.mp-tbl-wrap{overflow-x:auto}
.mp-tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:6px}
.mp-tbl th,.mp-tbl td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);font-size:14px}
.mp-tbl th{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);background:#FAFAFA;white-space:nowrap}
.mp-tbl tr:last-child td{border-bottom:0}
.mp-tbl td.mono{font:600 14px/1 var(--mono);white-space:nowrap}

/* flags + data gaps */
.mp-flag{background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);
  border-radius:6px;padding:16px 18px;margin-bottom:12px}
.mp-flag p{font-size:15px}
.mp-gaps{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:6px}
.mp-gaps li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  padding:12px 16px;border-bottom:1px solid var(--line);font-size:14px}
.mp-gaps li:last-child{border-bottom:0}
.mp-gaps em{font:600 11px/1 var(--mono);font-style:normal;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap}

/* behaviour / outcome / monitoring */
.mp-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mp-kind b{display:block;font-family:var(--cond);font-size:40px;font-weight:600;line-height:1;margin-top:8px}
.mp-kind p{font-size:13px;margin-top:8px}

.mp-foot{display:flex;gap:10px;flex-wrap:wrap}

@media (max-width:900px){
  .mp-top{grid-template-columns:1fr}
  .mp-stats{grid-template-columns:1fr 1fr}
  .mp-prio-grid{grid-template-columns:1fr}
  .mp-kinds{grid-template-columns:1fr}
}
@media (max-width:640px){
  .mp-head h1{font-size:30px}
  .mp-stats{grid-template-columns:1fr}
  .mp-head-act,.mp-foot{width:100%}
  .mp-head-act .btn,.mp-foot .btn{flex:1;text-align:center}
  .mp-score .big-num{font-size:60px}
  .domain-row .name{width:112px;font-size:13px}
}

@media print{
  .mp-page{max-width:none}
  .mp-head-act,.mp-foot{display:none !important}
  .mp-top{grid-template-columns:200px 1fr;gap:10px}
  .mp-score{background:#fff;color:#000;border:1px solid #888}
  .mp-score .big-num{color:#000}
  .mp-of,.mp-score-lbl{color:#333}
  .mp-stats{grid-template-columns:repeat(3,1fr);gap:8px}
  .mp-stat,.mp-prio,.mp-kind,.mp-flag,.mp-barrier,.mp-domains,.mp-gaps{box-shadow:none;
    border:1px solid #bbb;break-inside:avoid;page-break-inside:avoid}
  .mp-prio-grid{grid-template-columns:1fr 1fr;gap:10px}
  .mp-kinds{grid-template-columns:repeat(3,1fr);gap:10px}
  .mp-tbl-wrap{overflow:visible}
  .mp-tbl{font-size:10pt;border:1px solid #888}
  .mp-tbl th{background:#eee;color:#000}
  .mp-tbl tr{break-inside:avoid;page-break-inside:avoid}
  .mp-stat i,.mp-plan-row p.mp-measure,.mp-gaps em,.mp-kind p{color:#333}
  .mp-best{color:#000}
  .mp-links a[href]{color:#000}
}

/* ==========================================================================
   Module 7 - Progress (/progress): attempt history + trends across all attempts
   ========================================================================== */
.pg-page{max-width:1440px}
.pg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.pg-head-act{display:flex;gap:10px;flex-wrap:wrap}
.pg-lead{max-width:62ch}
.pg-fine{font-size:13px}

/* timeline of attempts */
.pg-timeline{display:flex;gap:12px;flex-wrap:wrap}
.pg-attempt{background:#fff;border:1px solid var(--line);border-radius:6px;padding:14px 18px;min-width:200px}
.pg-attempt.current{border-color:var(--ink);border-width:2px}
.pg-attempt .n{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pg-attempt-score{display:block;font-size:36px;margin-top:4px}
.pg-attempt-date{display:block;font-size:14px;margin-top:2px}
.pg-attempt-level{display:block;font-size:14px;color:var(--muted2);margin-top:4px}

/* line chart (overall trend + per-domain sparklines) */
.pg-chart-card{overflow-x:auto}
.pg-svg{width:100%;height:160px;display:block}
.pg-line{fill:none;stroke:var(--red);stroke-width:2.5;vector-effect:non-scaling-stroke}
.pg-dot{fill:var(--red)}
.pg-chart-labels{display:flex;justify-content:space-between;gap:8px;margin-top:8px;flex-wrap:wrap}
.pg-chart-labels span{font-size:11px;color:var(--muted)}

/* first vs latest */
.pg-compare-total{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.pg-compare-total b{display:block;font-family:var(--cond);font-size:40px;font-weight:600;margin-top:4px}
.pg-compare-arrow{font-size:22px;color:var(--muted)}
.pg-domain-deltas .domain-row{display:flex;align-items:center;gap:10px}
.pg-delta{font:600 12px/1 var(--mono);border-radius:4px;padding:3px 8px;white-space:nowrap}
.pg-delta.up{background:#E7F5EC;color:var(--green)}
.pg-delta.down{background:#FBE9E9;color:var(--red)}
.pg-delta.flat{background:#F0F0F0;color:var(--muted2)}

/* per-domain trend row: every scored attempt as a plain number trail */
.pg-trail{letter-spacing:.02em}
.pg-trail-arrow{color:var(--muted);margin:0 6px;font-weight:400}

/* performance test trend table */
.pg-tbl-wrap{overflow-x:auto}
.pg-tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:6px}
.pg-tbl th,.pg-tbl td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);font-size:16px}
.pg-tbl th{font:600 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);background:#FAFAFA;white-space:nowrap}
.pg-tbl tr:last-child td{border-bottom:0}
.pg-tbl td.mono{font:600 14px/1 var(--mono);white-space:nowrap}

.pg-retake{border-left:3px solid var(--red)}

@media (max-width:640px){
  .pg-head h1{font-size:30px}
  .pg-head-act{width:100%}
  .pg-head-act .btn{flex:1;text-align:center}
  .pg-compare-total b{font-size:32px}
}

@media print{
  .pg-page{max-width:none}
  .pg-head-act{display:none !important}
  .pg-attempt,.pg-chart-card,.pg-compare,.pg-retake{box-shadow:none;
    border:1px solid #bbb;break-inside:avoid;page-break-inside:avoid}
  .pg-line{stroke:#000}
  .pg-dot{fill:#000}
  .pg-trail-arrow{color:#333}
  .pg-tbl-wrap{overflow:visible}
  .pg-tbl{font-size:10pt;border:1px solid #888}
  .pg-tbl th{background:#eee;color:#000}
  .pg-tbl tr{break-inside:avoid;page-break-inside:avoid}
  .pg-delta.up,.pg-delta.down,.pg-delta.flat{background:#fff;border:1px solid #888;color:#000}
  .pg-attempt-level,.pg-attempt-date,.pg-chart-labels span{color:#333}
}

/* ---- Landing v2: HPP diagram, training tabs (2026-09-28) ---- */
.lp-problem .lp-h2{margin:0 0 14px}
.lp-hpp{flex:0 0 min(46%,460px);width:min(46%,460px);height:auto;display:block;align-self:center}
.lp-tabs{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.lp-tabs button{appearance:none;-webkit-appearance:none;cursor:pointer;font:600 15px/1 'Barlow',sans-serif;
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:11px 20px;color:var(--ink);transition:.15s}
.lp-tabs button:hover{border-color:var(--ink)}
.lp-tabs button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.lp-tabpanel{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:14px;
  padding:22px;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:5px;background:#fff}
.lp-tabpanel[hidden]{display:none}
.lp-tp-t{font:700 26px/1 var(--cond);text-transform:uppercase}
.lp-tp-body p{font:400 16px/1.55 'Barlow',sans-serif;color:#3a3a3a;margin-top:8px;max-width:620px}
.lp-tabpanel .lp-btn{flex:0 0 auto;margin:0;white-space:nowrap}
.lp-btn.lp-btn-off{border:1px solid var(--line);color:var(--muted2);padding:15px 24px;cursor:default;background:#F6F6F6}

/* 06 training hero image */
.lp-training-hero{flex:0 0 min(40%,420px);width:min(40%,420px);height:auto;display:block;border-radius:6px;align-self:center}

/* 08 4T+ Coach */
.lp-formula{margin-top:22px;font:700 22px/1.2 var(--cond);text-transform:uppercase;letter-spacing:-.01em;
  background:var(--ink);color:#fff;padding:16px 20px;border-radius:5px;border-left:4px solid var(--red)}
.lp-formula span{color:var(--red)}
.lp-coach-cta{margin-top:22px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.lp-coach-placeholder{width:100%;max-width:420px;background:#F6F6F6;border:1px solid var(--line);border-radius:8px;padding:16px}
.lp-coach-bubble{background:#fff;border:1px solid var(--line);border-radius:20px;padding:12px 18px}
.lp-coach-q{font:400 15px/1.4 'Barlow',sans-serif;color:var(--muted)}
.lp-coach-logo{flex:0 0 min(26%,200px);width:min(26%,200px);display:flex;align-items:center;justify-content:center}
.lp-coach-logo img{width:100%;height:auto;max-width:200px}

@media (max-width:1000px){
  .lp-hpp{flex:none;width:min(100%,460px);margin:0 auto}
  .lp-training-hero{flex:none;width:min(100%,420px);margin:0 auto}
  .lp-coach-logo{flex:none;width:min(100%,200px);margin:0 auto}
}
@media (max-width:640px){
  .lp-tabpanel{flex-direction:column;align-items:stretch;padding:16px}
  .lp-tabpanel .lp-btn{white-space:normal}
  .lp-tabs button{flex:1;padding:11px 8px}
  .lp-formula{font-size:18px;padding:14px 16px}
  .lp-coach-logo{width:160px}
}

/* ==========================================================================
   Print — master rules for EVERY member page (comes last so it wins).
   Screen: only the floating Print button shows. Paper / PDF: a branded header
   and footer, no navigation, no buttons, colours kept, cards never split.
   ========================================================================== */
.print-head,.print-foot{display:none}
.print-fab{position:fixed;left:18px;bottom:18px;z-index:50;background:#111;color:#fff;border:0;border-radius:999px;
  padding:11px 18px;font:600 13px 'Barlow',sans-serif;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.print-fab:hover{background:var(--red)}

@media print{
  @page{size:A4;margin:14mm}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{background:#fff !important;color:#000}
  body{font-size:11pt;line-height:1.45}

  /* site chrome, controls and widgets */
  .memberbar,.backbar,.topbar,.pubbar,.pub-head,.pub-foot,.foot,.print-fab,.btn-print,.admin-side,
  .bp-guide-banner,.bp-tabs,.g-toc,.ct-back,
  .app-main .btn,.app-main button,#tidio-chat,#tidio-chat-iframe,iframe[id^="tidio"]{display:none !important}

  /* branded header + footer */
  .print-head{display:flex !important;align-items:center;justify-content:space-between;gap:16px;
    border-bottom:2px solid #111;padding-bottom:8px;margin-bottom:14px}
  .print-head img{height:34px;width:auto}
  .print-head-meta{text-align:right;font-size:10pt;line-height:1.35}
  .print-head-meta strong{display:block;font-size:12pt}
  .print-foot{display:block !important;margin-top:18px;padding-top:8px;border-top:1px solid #bbb;font-size:8.5pt;color:#444}

  /* page frame */
  .app-main{padding:0 !important;min-height:0 !important}
  .wrap,.wrap.block,.guide{max-width:none !important;width:auto !important;padding:0 !important;margin:0 !important}
  .block,section{padding-top:0 !important;padding-bottom:0 !important}
  a{color:#000 !important;text-decoration:none}

  /* keep things whole */
  h1,h2,h3,h4{break-after:avoid;page-break-after:avoid}
  p,li{orphans:3;widows:3}
  table{break-inside:auto}
  tr,img,figure,.card,.bp-card,.bp-box,.bp-side-card,.mp-stat,.hp-area,.lib-item,.ben-card,.ct-card{
    break-inside:avoid;page-break-inside:avoid}
  thead{display:table-header-group}
  tfoot{display:table-footer-group}
  .g-scroll{overflow:visible !important}
  .g-scroll table,.guide table{min-width:0 !important}

  /* boxes: flat, bordered, no shadows */
  .card,.bp-card,.bp-box,.tbl{box-shadow:none !important}
  .bp-card{border:1px solid #999 !important;margin-bottom:12px}
  .bp-card.primary{border-left:3px solid #d0021b !important}
  details.bp-collapse>summary .open-link{display:none}

  /* My Blueprint */
  .bp-grid{display:block !important}
  .bp-grid>div{margin-bottom:12px}
  .bp-boxes{grid-template-columns:1.3fr 1fr !important;gap:10px}
  .bp-check input{display:inline-block}

  /* guide tables + text */
  .guide h2{margin-top:22px;padding-top:12px}
  .guide table{font-size:9.5pt}
  .guide .g-note{background:#fff}
}

/* Guides — PDF grid with first-page preview */
.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:28px}
.guide-card{background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;transition:.15s;color:var(--ink)}
.guide-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.guide-prev{aspect-ratio:3/4;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:center;overflow:hidden}
.guide-prev canvas,.guide-prev img{width:100%;height:100%;object-fit:contain;object-position:top}
.guide-prev canvas{opacity:0;transition:opacity .25s}
.guide-prev canvas.is-ready{opacity:1}
.guide-prev-fail{background:#f2f2f2}
.guide-info{padding:16px;display:flex;flex-direction:column;gap:8px;flex:1}
.guide-row{display:flex;align-items:start;justify-content:space-between;gap:12px}
.guide-row h3{font-family:var(--cond);font-weight:700;text-transform:uppercase;font-size:17px;line-height:1.15;margin:0}
.guide-text{min-width:0;display:flex;flex-direction:column;gap:6px}
.guide-info p{font-size:13.5px;margin:0}
.guide-dl{flex:none;width:40px;height:40px;border-radius:8px;background:var(--red);display:flex;align-items:center;justify-content:center;transition:background .15s}
.guide-dl:hover{background:var(--ink)}
.guide-dl svg{width:20px;height:20px}
@media (max-width:1100px){.guide-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.guide-grid{grid-template-columns:1fr}}

/* Banner card: the uploaded image is the whole design (shown uncropped); only the coupon sits on top */
.ben-discount.ben-banner{display:block;padding:0;min-height:0;line-height:0;background:none}
.ben-banner-img{display:block;width:100%;height:auto}
.ben-banner-link{position:absolute;inset:0;z-index:1;cursor:pointer}
/* .ben-discount.ben-banner:has(.ben-banner-link):hover{transform:translateY(-3px)} */
.ben-discount.ben-banner::before{content:none}
.ben-discount.ben-banner .ben-coupon{position:absolute;left:5%;bottom:9%;margin:0;line-height:1;z-index:2}
/* tablet (641-1024px): a slightly smaller coupon on the banner */
@media (min-width:641px) and (max-width:1024px){
  .ben-discount.ben-banner .ben-coupon{min-width:0;padding:10px 14px 10px 20px;gap:14px;
    clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
  .ben-discount.ben-banner .ben-code{font-size:17px}
  .ben-discount.ben-banner .ben-copy{padding:4px 9px;font-size:11px}
}
@media (max-width:640px){
  .ben-discount.ben-banner{padding:0;min-height:0}
  .ben-discount.ben-banner .ben-coupon{left:3%;bottom:8%;min-width:0;align-self:auto;padding:5px 8px 5px 12px;gap:8px;
    clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
  .ben-discount.ben-banner .ben-code{font-size:11px;letter-spacing:.08em}
  /* icon instead of the "Copy" word (the JS swaps the text to "Copied", so the text stays hidden and a tick shows) */
  .ben-discount.ben-banner .ben-copy{font-size:0;width:24px;height:24px;padding:0;border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center}
  .ben-discount.ben-banner .ben-copy::before{content:"";width:13px;height:13px;background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 0 1 2-2h9'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 0 1 2-2h9'/%3E%3C/svg%3E") center/contain no-repeat}
  .ben-discount.ben-banner .ben-copy.is-copied::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E")}
}

/* Print — discount banners print exactly as on screen (backgrounds + colours kept) */
@media print{
  .ben-grid-discount{grid-template-columns:1fr;gap:16px}
  .ben-discount,.ben-discount *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ben-discount{border:2px solid var(--red);box-shadow:none;min-height:340px;padding:40px 6%;
    background-size:cover;background-position:center;break-inside:avoid;page-break-inside:avoid}
  .ben-discount::before{content:none}
  .ben-discount.ben-banner{padding:0;min-height:0}
  .ben-discount .ben-coupon{border:0}
  /* keep the text on the light left part, clear of the product photo */
  .ben-discount .ben-main{max-width:50%}
  .ben-discount .ben-title{font-size:30px}
  .ben-discount .ben-offer{font-size:44px}
  .ben-discount .ben-coupon{min-width:0;align-self:flex-start}
}

.guide-section{display:flex;align-items:center;gap:14px;margin-top:40px;font-size:22px;line-height:1;letter-spacing:.02em;text-transform:uppercase}
.guide-section::before{content:"";width:28px;height:4px;background:var(--red);border-radius:2px;flex:none}
.guide-section::after{content:"";flex:1;height:1px;background:var(--line)}
.guide-section .guide-count{order:2;font:600 11px/1 var(--mono);letter-spacing:.08em;color:var(--muted2);background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 10px}
.guide-section + .guide-grid{margin-top:22px}

/* discount banners: image-only cards in a responsive grid (coupon is part of the image) */
.ben-grid.ben-grid-discount{grid-template-columns:repeat(2,1fr);gap:20px}
@media(max-width:700px){.ben-grid.ben-grid-discount{grid-template-columns:1fr;gap:16px}}
.ben-grid-discount>.ben-card:not(.ben-banner){grid-column:1/-1}
@media print{.ben-grid.ben-grid-discount{grid-template-columns:1fr 1fr}}