/* ============================================================
   Homesy Marketing Research - shared styles
   Edit colours & type here once; every page updates.
   Sections: 1) foundation & tokens  2) study pages  3) home page
   ============================================================ */

/* ---------- 1 · foundation & brand tokens ---------- */

:root{
  --green:#1A2A24; --green2:#24382F; --green-deep:#11201A;
  --text:#2D3A33; --mute:#6B7570; --soft:#9AA39D;
  --white:#FFFFFF; --alt:#FAFBFA; --paper:#F5F2EC;
  --surface-green:#F4F8F5; --border:#E2E6E2; --gold:#A67C2E; --alert:#B03025;
  --line-on-dark:rgba(255,255,255,.16);
  --serif:Georgia,"Times New Roman",serif;
  --sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --rail:230px; --content:720px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--text);background:var(--paper);
  -webkit-font-smoothing:antialiased;line-height:1.6}
a{color:inherit;text-decoration:none}
.serif{font-family:var(--serif)}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:60;background:rgba(26,42,36,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line-on-dark)}
.topbar .inner{max-width:1180px;margin:0 auto;padding:13px 28px;
  display:flex;align-items:center;justify-content:space-between}
.topbar .wm{font-family:var(--serif);font-size:18px;color:#fff}
.topbar .wm .tag{font-family:var(--sans);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:#9FB3A8;font-weight:600;margin-left:7px}
.topbar nav{display:flex;gap:20px;font-size:13px;color:#C7D2CC;align-items:center}
.topbar nav a{padding:4px 0;border-bottom:1.5px solid transparent;transition:.15s}
.topbar nav a:hover,.topbar nav a.active{color:#fff;border-color:#9FB3A8}

/* ---------- dropdown nav groups ---------- */
.nav-group{position:relative;display:flex;align-items:center}
.nav-group::after{content:"";position:absolute;bottom:-12px;left:-8px;right:-8px;height:12px}
.nav-label{padding:4px 0;color:#C7D2CC;font-size:13px;cursor:default;
  display:flex;align-items:center;gap:5px;border-bottom:1.5px solid transparent;
  transition:color .15s;user-select:none;white-space:nowrap}
.nav-label::after{content:"▾";font-size:9px;opacity:.6;margin-top:1px}
.nav-group:hover .nav-label{color:#fff}
.nav-dropdown{display:none;position:absolute;top:calc(100% + 10px);left:-14px;
  background:var(--green2);border:1px solid var(--line-on-dark);border-radius:10px;
  padding:6px 0;list-style:none;z-index:200;min-width:230px;
  box-shadow:0 8px 28px rgba(0,0,0,.4)}
.nav-group:hover .nav-dropdown{display:block}
.nav-dropdown li a{display:block;padding:7px 16px;color:#C7D2CC;font-size:12.5px;
  line-height:1.3;transition:background .12s,color .12s;white-space:nowrap}
.nav-dropdown li a:hover,.nav-dropdown li a.active{background:rgba(255,255,255,.07);color:#fff}
.dd-sep{padding:8px 16px 3px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;
  color:#6A7E78;font-weight:700;pointer-events:none}
.nav-dropdown li+li.dd-sep{border-top:1px solid var(--line-on-dark);margin-top:4px;padding-top:8px}

/* ---------- hero ---------- */

/* ---------- 2 · study (research) pages ---------- */
.study-hero{background:var(--green);color:#fff;position:relative;overflow:hidden}
.study-hero .inner{max-width:1180px;margin:0 auto;padding:66px 28px 58px;position:relative;z-index:2}
.study-hero .breadcrumb{font-size:12.5px;color:#9FB3A8;margin-bottom:22px}
.study-hero .breadcrumb a:hover{color:#fff}
.study-hero .eyebrow{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  color:#9FB3A8;font-weight:600;margin-bottom:16px}
.study-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.4vw,50px);
  line-height:1.06;letter-spacing:-.02em;max-width:18ch}
.study-hero .standfirst{font-size:clamp(15px,1.7vw,19px);color:#C7D2CC;max-width:62ch;
  margin-top:22px;line-height:1.5}
.study-hero .meta{margin-top:30px;font-size:12px;color:#7E908A;display:flex;gap:24px;flex-wrap:wrap}
.study-hero .meta b{color:#C7D2CC;font-weight:600}
.study-hero .motif{position:absolute;right:-130px;top:-90px;width:480px;height:480px;
  border-radius:50%;border:1px solid var(--line-on-dark);opacity:.5;z-index:1}
.study-hero .motif::before,.study-hero .motif::after{content:"";position:absolute;border-radius:50%;border:1px solid var(--line-on-dark)}
.study-hero .motif::before{inset:64px}.study-hero .motif::after{inset:140px}

/* ---------- layout: rail + content ---------- */
.layout{max-width:1180px;margin:0 auto;padding:0 28px;
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);gap:48px;align-items:start}
.rail{position:sticky;top:74px;padding:46px 0;align-self:start}
.rail h5{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--mute);
  font-weight:700;margin-bottom:14px}
.rail ol{list-style:none}
.rail li a{display:block;padding:7px 0 7px 14px;font-size:13px;color:var(--mute);
  border-left:2px solid var(--border);line-height:1.3;transition:.14s;cursor:pointer}
.rail li a:hover{color:var(--green)}
.rail li a.active{color:var(--green);border-left-color:var(--gold);font-weight:600}
.rail .railback{margin-top:22px;font-size:12.5px;color:var(--mute)}
.rail .railback a{color:var(--green);font-weight:600}

.content{padding:46px 0 30px;min-width:0;max-width:var(--content)}
section.block{padding:26px 0 38px;border-bottom:1px solid var(--border);scroll-margin-top:74px}
section.block:last-of-type{border-bottom:none}
.kicker{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);
  font-weight:700;margin-bottom:11px}
h2.sec{font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.12;
  letter-spacing:-.01em;color:var(--green);margin-bottom:16px}
.content p{font-size:15.5px;line-height:1.62;color:var(--text);margin-bottom:15px;max-width:66ch}
.content p .lead{font-weight:600;color:var(--green)}
.content .big{font-size:17px;line-height:1.5;color:var(--text)}

/* callout & paper boxes */
.callout{background:var(--surface-green);border-radius:12px;padding:20px 22px;margin:20px 0}
.callout .lab{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--green);
  font-weight:700;margin-bottom:8px}
.callout p{margin-bottom:0}
.paper{background:var(--paper);border-radius:12px;padding:20px 22px;margin:20px 0}
.paper p{margin-bottom:0}
.darkbox{background:var(--green);color:#fff;border-radius:12px;padding:22px 24px;margin:20px 0}
.darkbox .lab{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:#9FB3A8;font-weight:700;margin-bottom:9px}
.darkbox p{color:#C7D2CC;margin-bottom:0;max-width:none}
.darkbox .big{color:#fff;font-family:var(--serif);font-size:21px;line-height:1.2;margin-bottom:8px}

/* customer sketch chips */
.sketch{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.sketch span{background:var(--white);border:1px solid var(--border);border-radius:999px;
  padding:6px 13px;font-size:12.5px;color:var(--text)}

/* ---------- signature: warmth × weight plot ---------- */
.plot-wrap{margin:24px 0 8px}
.plot{position:relative;width:100%;aspect-ratio:1/.74;background:var(--white);
  border:1px solid var(--border);border-radius:14px;overflow:hidden}
.plot .sweet{position:absolute;right:0;top:0;width:48%;height:52%;
  background:linear-gradient(215deg,rgba(166,124,46,.10),transparent 70%)}
.plot .sweet-label{position:absolute;right:16px;top:14px;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold);font-weight:700;text-align:right;line-height:1.4}
.plot .axis{position:absolute;background:var(--border)}
.plot .axis.x{left:9%;right:5%;bottom:13%;height:1px}
.plot .axis.y{left:9%;top:7%;bottom:13%;width:1px}
.plot .axlab{position:absolute;font-size:10.5px;color:var(--soft);letter-spacing:.04em}
.plot .axlab.xr{right:6%;bottom:6.5%}
.plot .axlab.xl{left:9%;bottom:6.5%}
.plot .axlab.yt{left:11px;top:5%;writing-mode:vertical-rl;transform:rotate(180deg)}
.plot .axlab.yb{left:11px;bottom:15%;writing-mode:vertical-rl;transform:rotate(180deg)}
.dot{position:absolute;transform:translate(-50%,50%);display:flex;flex-direction:column;
  align-items:center;gap:5px;z-index:3}
.dot .pt{width:13px;height:13px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(26,42,36,.08)}
.dot.gold .pt{background:var(--gold);box-shadow:0 0 0 4px rgba(166,124,46,.12)}
.dot.muted .pt{background:transparent;border:1.5px dashed var(--soft);box-shadow:none}
.dot .nm{font-family:var(--serif);font-size:13px;color:var(--green);white-space:nowrap}
.dot.muted .nm{color:var(--mute)}
.dot .nm small{font-family:var(--sans);font-size:9.5px;color:var(--soft);display:block;text-align:center;letter-spacing:.02em}

/* brand section: quotes + borrow/avoid */
.brandhead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.brandhead .tagline{font-size:12.5px;color:var(--soft)}
.quotes{display:flex;flex-direction:column;gap:11px;margin:18px 0}
blockquote{background:var(--surface-green);border-radius:11px;padding:15px 18px;margin:0}
blockquote.warn{background:var(--paper)}
blockquote .q{font-family:var(--serif);font-style:italic;font-size:15.5px;color:var(--green);line-height:1.36}
blockquote.warn .q{color:var(--alert)}
blockquote .src{font-size:11.5px;color:var(--mute);margin-top:8px}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.ba .item{background:var(--white);border:1px solid var(--border);border-radius:11px;padding:15px 17px}
.ba .item .h{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;margin-bottom:7px}
.ba .item.borrow .h{color:#2F6B4F}
.ba .item.avoid .h{color:var(--alert)}
.ba .item p{font-size:13.5px;margin-bottom:0;line-height:1.5}
.dormant-flag{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold);background:var(--paper);padding:3px 9px;border-radius:5px;margin-left:4px}

/* patterns grid */
.patterns{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:8px}
.pat{border-radius:12px;padding:18px 20px}
.pat:nth-child(odd){background:var(--surface-green)}
.pat:nth-child(even){background:var(--paper)}
.pat h4{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--green);margin-bottom:6px}
.pat p{font-size:13.5px;margin-bottom:0;line-height:1.5}

/* actions list */
.actions{list-style:none;counter-reset:a;margin-top:6px}
.actions li{counter-increment:a;display:flex;gap:16px;padding:15px 0;border-bottom:1px solid var(--border)}
.actions li:last-child{border-bottom:none}
.actions li::before{content:counter(a);font-family:var(--serif);font-size:22px;color:var(--green);opacity:.35;flex:0 0 28px;line-height:1}
.actions li .t{font-family:var(--serif);font-size:16px;color:var(--green);display:block;margin-bottom:3px}
.actions li p{font-size:13.5px;margin-bottom:0;line-height:1.5}

/* sources */
.sources p{font-size:13.5px;color:var(--mute)}
.sources .live{color:var(--green);font-weight:600}

/* ---------- footer nav between studies ---------- */
.studynav{background:var(--green);color:#fff;margin-top:10px}
.studynav .inner{max-width:1180px;margin:0 auto;padding:30px 28px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.studynav a{color:#C7D2CC;font-size:14px;display:flex;flex-direction:column;gap:3px}
.studynav a:hover{color:#fff}
.studynav a .dir{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#7E908A}
.studynav a.next{text-align:right}
.studynav .home{font-family:var(--serif);font-size:15px;color:#9FB3A8}
.studynav .home:hover{color:#fff}

.foot{max-width:1180px;margin:0 auto;padding:26px 28px 56px;color:var(--soft);font-size:12px}

/* mobile rail toggle (hidden on desktop) */
.rail-mobile{display:none}

@media(max-width:880px){
  .layout{grid-template-columns:1fr;gap:0}
  .rail{display:none}
  .content{max-width:none;padding-top:24px}
  .ba,.patterns{grid-template-columns:1fr}
  .topbar nav{display:none}
  .rail-mobile{display:block;position:sticky;top:50px;z-index:40;background:var(--paper);
    border-bottom:1px solid var(--border);padding:10px 28px}
  .rail-mobile select{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:8px;
    background:var(--white);font-family:var(--sans);font-size:13.5px;color:var(--text)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- 3 · home / index page ---------- */
.hero{background:var(--green);color:#fff;position:relative;overflow:hidden}
.hero .inner{max-width:var(--maxw);margin:0 auto;padding:84px 28px 72px}
.hero .eyebrow{font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:#9FB3A8;font-weight:600;margin-bottom:20px}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(34px,5vw,58px);
  line-height:1.04;letter-spacing:-.02em;max-width:16ch}
.hero p{font-size:clamp(15px,1.7vw,19px);color:#C7D2CC;max-width:60ch;
  margin-top:22px;line-height:1.5}
.hero .meta{margin-top:34px;display:flex;gap:28px;flex-wrap:wrap;
  font-size:12.5px;color:#7E908A}
.hero .meta b{color:#C7D2CC;font-weight:600}
/* faint motif: concentric "home" feel via offset rules */
.hero .motif{position:absolute;right:-120px;top:-80px;width:520px;height:520px;
  border-radius:50%;border:1px solid var(--line-on-dark);opacity:.5}
.hero .motif::before,.hero .motif::after{content:"";position:absolute;
  border-radius:50%;border:1px solid var(--line-on-dark)}
.hero .motif::before{inset:70px}
.hero .motif::after{inset:150px}

.section{max-width:var(--maxw);margin:0 auto;padding:56px 28px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;
  gap:20px;margin-bottom:8px;flex-wrap:wrap}
.section-head h2{font-family:var(--serif);font-weight:400;font-size:26px;color:var(--green)}
.section-head .count{font-size:12.5px;color:var(--soft)}
.section-intro{color:var(--mute);max-width:70ch;margin-bottom:28px;font-size:14.5px}

.track-label{display:flex;align-items:center;gap:12px;margin:40px 0 18px}
.track-label .dot{width:9px;height:9px;border-radius:50%;background:var(--gold)}
.track-label .dot.b{background:var(--green)}
.track-label h3{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--green)}
.track-label .ln{flex:1;height:1px;background:var(--border)}

/* card grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:18px}
.card{background:var(--white);border:1px solid var(--border);border-radius:14px;
  overflow:hidden;display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s;
  box-shadow:var(--shadow)}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.card a.card-link{display:flex;flex-direction:column;height:100%}
.card .top{padding:20px 20px 16px;flex:1}
.card .kicker{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  font-weight:600;color:var(--gold);margin-bottom:10px}
.card .kicker.partner{color:var(--gold)}
.card .kicker.consumer{color:#3E7D5C}
.card .kicker.voice{color:#7A6CB0}
.card .kicker.app{color:#B0762E}
.card h4{font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.2;
  color:var(--green);margin-bottom:9px}
.card p{font-size:13px;color:var(--mute);line-height:1.5}
.card .foot{padding:13px 20px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  background:var(--alt)}
.card .foot .fmt{font-size:11px;color:var(--soft);display:flex;align-items:center;gap:7px}
.card .foot .fmt .badge{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;
  font-weight:700;padding:2px 7px;border-radius:4px;background:var(--surface-green);color:var(--green)}
.card .foot .fmt .badge.pdf{background:var(--paper);color:var(--gold)}
.card .foot .go{font-size:12.5px;color:var(--green);font-weight:600;display:flex;align-items:center;gap:5px;
  transition:gap .15s}
.card:hover .foot .go{gap:9px}

.note-strip{background:var(--surface-green);border:1px solid var(--border);
  border-radius:12px;padding:18px 22px;margin-top:8px;font-size:13.5px;color:var(--text)}
.note-strip b{color:var(--green)}

.site-foot{max-width:var(--maxw);margin:0 auto;padding:40px 28px 64px;
  color:var(--soft);font-size:12px;border-top:1px solid var(--border)}

/* ============================================================
   DECK VIEWER
   ============================================================ */
.deck-body{background:var(--green-deep);overflow:hidden}
.viewer{position:fixed;inset:0;display:flex;flex-direction:column}
.viewer-bar{flex:0 0 auto;background:rgba(26,42,36,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line-on-dark);display:flex;align-items:center;
  justify-content:space-between;padding:11px 20px;z-index:30}
.viewer-bar .left{display:flex;align-items:center;gap:16px;min-width:0}
.viewer-bar .home{color:#C7D2CC;font-size:13px;display:flex;align-items:center;gap:7px;white-space:nowrap}
.viewer-bar .home:hover{color:#fff}
.viewer-bar .dtitle{font-family:var(--serif);color:#fff;font-size:15px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.viewer-bar .right{display:flex;align-items:center;gap:14px}
.viewer-bar button,.viewer-bar a.tool{background:rgba(255,255,255,.08);border:1px solid var(--line-on-dark);
  color:#C7D2CC;border-radius:8px;padding:6px 11px;font-size:12.5px;cursor:pointer;
  font-family:var(--sans);display:inline-flex;align-items:center;gap:6px;transition:background .15s,color .15s}
.viewer-bar button:hover,.viewer-bar a.tool:hover{background:rgba(255,255,255,.16);color:#fff}
.viewer-bar .counter{color:#9FB3A8;font-size:12.5px;min-width:54px;text-align:center;font-variant-numeric:tabular-nums}

/* stage */
.stage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;padding:26px}
.slides{position:relative;width:100%;max-width:1000px;aspect-ratio:297/167;
  margin:0 auto}
.slide{position:absolute;inset:0;background:var(--white);border-radius:12px;
  box-shadow:var(--shadow-lg);overflow:hidden;opacity:0;visibility:hidden;
  transform:translateX(24px) scale(.985);transition:opacity .34s ease,transform .34s ease,visibility .34s;
  padding:42px 48px}
.slide.active{opacity:1;visibility:visible;transform:none}
.slide.prev{transform:translateX(-24px) scale(.985)}

/* arrows */
.nav-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:20;
  width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.1);
  border:1px solid var(--line-on-dark);color:#fff;cursor:pointer;font-size:20px;
  display:flex;align-items:center;justify-content:center;transition:background .15s;backdrop-filter:blur(4px)}
.nav-arrow:hover{background:rgba(255,255,255,.22)}
.nav-arrow:disabled{opacity:.25;cursor:default}
.nav-arrow.left{left:18px}
.nav-arrow.right{right:18px}

/* progress */
.progress{flex:0 0 auto;height:3px;background:rgba(255,255,255,.08);position:relative}
.progress .bar{height:100%;background:#9FB3A8;width:0;transition:width .34s ease}

/* contents drawer */
.toc{position:fixed;top:0;left:0;bottom:0;width:300px;background:var(--green);
  border-right:1px solid var(--line-on-dark);z-index:40;transform:translateX(-100%);
  transition:transform .26s ease;display:flex;flex-direction:column;padding:18px 0}
.toc.open{transform:none}
.toc h5{color:#9FB3A8;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;padding:8px 22px 12px}
.toc ol{list-style:none;overflow-y:auto;flex:1}
.toc li{margin:0}
.toc li a{display:flex;gap:12px;padding:9px 22px;color:#C7D2CC;font-size:13px;
  cursor:pointer;border-left:2px solid transparent;line-height:1.35;transition:background .12s,color .12s}
.toc li a:hover{background:rgba(255,255,255,.05);color:#fff}
.toc li a.current{border-left-color:#9FB3A8;color:#fff;background:rgba(255,255,255,.06)}
.toc li a .n{color:#7E908A;font-variant-numeric:tabular-nums;flex:0 0 auto}
.toc-backdrop{position:fixed;inset:0;background:rgba(17,32,26,.5);z-index:35;opacity:0;
  visibility:hidden;transition:opacity .2s}
.toc-backdrop.show{opacity:1;visibility:visible}

/* hint */
.kbd-hint{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:25;
  background:rgba(26,42,36,.82);border:1px solid var(--line-on-dark);border-radius:999px;
  padding:7px 16px;color:#9FB3A8;font-size:11.5px;display:flex;gap:14px;align-items:center;
  transition:opacity .4s}
.kbd-hint kbd{background:rgba(255,255,255,.12);border-radius:4px;padding:1px 6px;
  font-family:var(--sans);color:#C7D2CC;font-size:11px}
.kbd-hint.hide{opacity:0}

/* ============================================================
   SLIDE CONTENT PRIMITIVES (shared by all decks)
   ============================================================ */
.s-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mute);font-weight:600;margin-bottom:10px}
.s-title{font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.1;
  letter-spacing:-.01em;color:var(--green);margin-bottom:14px}
.s-lede{font-size:15.5px;line-height:1.5;color:var(--text);max-width:64ch}
.s-grid2{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.s-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.s-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.s-card{border-radius:11px;padding:18px 20px}
.s-card.green{background:var(--surface-green)}
.s-card.paper{background:var(--paper)}
.s-card.dark{background:var(--green);color:#fff}
.s-card.dark .s-eyebrow{color:#9FB3A8}
.s-card h3{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--green);margin-bottom:6px}
.s-card.dark h3{color:#fff}
.s-card p{font-size:13.5px;line-height:1.5;color:var(--text)}
.s-card.dark p{color:#C7D2CC}
.quote-card{background:var(--surface-green);border-radius:10px;padding:15px 17px}
.quote-card .q{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--green);line-height:1.34}
.quote-card .src{font-size:11px;color:var(--mute);margin-top:7px}
.trait-num{width:42px;height:42px;border-radius:50%;background:var(--green);color:#fff;
  font-family:var(--serif);font-size:19px;display:flex;align-items:center;justify-content:center;margin-bottom:13px}
.borrow{color:#2F6B4F;font-weight:700}
.avoid{color:var(--alert);font-weight:700}
.cover-slide{background:var(--green)!important;color:#fff;display:flex;flex-direction:column;justify-content:center}
.cover-slide .wm{font-family:var(--serif);font-size:21px;position:absolute;top:38px;left:48px}
.cover-slide .keyw{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#9FB3A8;font-weight:600;margin-bottom:14px}
.cover-slide h1{font-family:var(--serif);font-weight:400;font-size:42px;line-height:1.05;letter-spacing:-.02em;margin-bottom:18px}
.cover-slide .sub{font-size:16px;color:#C7D2CC;max-width:54ch;line-height:1.45}
.cover-slide .brandline{position:absolute;bottom:38px;right:48px;font-family:var(--serif);font-style:italic;color:#9FB3A8;font-size:13px}
.cover-slide .cmeta{position:absolute;bottom:38px;left:48px;font-size:11px;color:#7E908A}

/* responsive */
@media(max-width:760px){
  .s-grid2,.s-grid3,.s-grid4{grid-template-columns:1fr}
  .slide{padding:24px 22px}
  .s-title{font-size:22px}
  .cover-slide h1{font-size:28px}
  .topbar nav{display:none}
  .nav-arrow{display:none}
}
@media(prefers-reduced-motion:reduce){
  .slide{transition:opacity .01s}
  .card:hover{transform:none}
  html{scroll-behavior:auto}
}


/* ---------- welcome / purpose page (index.html) ---------- */
.about-block{max-width:1180px;margin:0 auto}
.about-lead{font-size:clamp(16px,1.7vw,19px);line-height:1.65;color:var(--text);max-width:72ch;margin-bottom:44px}
.about-pillars{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:40px}
.pillar{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:28px 30px;display:flex;flex-direction:column}
.pillar .pillar-eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--gold);margin-bottom:12px}
.pillar h3{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.18;color:var(--green);margin-bottom:10px}
.pillar p{font-size:14px;line-height:1.62;color:var(--mute);flex:1;margin-bottom:0}
.pillar .pillar-link{display:inline-block;margin-top:22px;font-size:13.5px;font-weight:600;color:var(--green);transition:color .15s}
.pillar .pillar-link:hover{color:var(--gold)}
.about-cta{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.about-cta-count{font-size:13px;color:var(--mute)}
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--green);color:#fff;padding:11px 22px;border-radius:8px;font-size:13.5px;font-weight:600;transition:background .15s}
.btn:hover{background:var(--green2)}

@media(max-width:760px){
  .about-pillars{grid-template-columns:1fr}
  .about-cta{flex-direction:column;align-items:flex-start}
}

/* ---------- audience + category headers (home page) ---------- */
.audience{margin:60px 0 0}
.audience:first-of-type{margin-top:6px}
.audience .aud-eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);font-weight:700;margin-bottom:8px}
.audience h2{font-family:var(--serif);font-weight:400;font-size:32px;color:var(--green);letter-spacing:-.01em}
.audience .aud-intro{color:var(--mute);max-width:72ch;margin-top:8px;font-size:14.5px}
.audience .aud-rule{height:2px;background:var(--green);opacity:.12;margin-top:18px;border-radius:2px}
.cat-label{display:flex;align-items:baseline;gap:12px;margin:34px 0 16px}
.cat-label h3{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--green)}
.cat-label .ln{flex:1;height:1px;background:var(--border);align-self:center}
.cat-label .ct-count{font-size:12px;color:var(--soft)}

/* ---------- "coming soon" affordances ---------- */
.dd-soon{display:block;padding:7px 16px;color:var(--soft);font-size:12px;font-style:italic}
.cat-empty{background:var(--alt);border:1px dashed var(--border);border-radius:14px;padding:22px 24px;color:var(--mute);font-size:13.5px}
.cat-empty b{color:var(--text);font-weight:600}
.cat-label .soon-tag{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);font-weight:700}

.nav-label.active{color:#fff}

/* ---------- data-viz: workforce dot grid (waffle) ---------- */
.viz-wrap{margin:24px 0 8px}
.viz-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:26px 28px}
.viz-title{font-family:var(--serif);font-size:18px;color:var(--green);margin-bottom:4px}
.viz-sub{font-size:12.5px;color:var(--mute);margin-bottom:20px}
.waffle{display:grid;grid-template-columns:repeat(20,1fr);gap:5px;max-width:440px}
.waffle .d{aspect-ratio:1;border-radius:2.5px;background:var(--border)}
.waffle .d.young{background:#3E7D5C}
.waffle .d.retire{background:var(--gold)}
.viz-legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:18px;font-size:12.5px;color:var(--text)}
.viz-legend .k{display:flex;align-items:center;gap:7px}
.viz-legend .sw{width:12px;height:12px;border-radius:3px;flex:0 0 auto}
.viz-legend .sw.young{background:#3E7D5C}
.viz-legend .sw.retire{background:var(--gold)}
.viz-legend .sw.mid{background:var(--border)}
.viz-note{font-size:12px;color:var(--soft);margin-top:14px;line-height:1.5}
.viz-punch{font-family:var(--serif);font-size:15.5px;color:var(--green);margin-top:16px;line-height:1.4}

/* ---------- data-viz: estimate range bar ---------- */
.range-row{margin:18px 0}
.range-row .rl{display:flex;justify-content:space-between;font-size:12.5px;color:var(--text);margin-bottom:7px}
.range-row .rl b{color:var(--green)}
.range-track{position:relative;height:34px;background:var(--surface-green);border-radius:8px;overflow:hidden}
.range-fill{position:absolute;top:0;bottom:0;background:linear-gradient(90deg,rgba(166,124,46,.25),rgba(166,124,46,.55));border-left:2px solid var(--gold);border-right:2px solid var(--gold)}
.range-fill.solid{background:var(--green);border:none;opacity:.9}
.range-scale{display:flex;justify-content:space-between;font-size:10.5px;color:var(--soft);margin-top:6px}
.range-cap{font-size:12px;color:var(--mute);margin-top:5px}

/* dead/inactive top-level nav item */
.topbar nav a.nav-dead{color:#C7D2CC;cursor:default;border-bottom:1.5px solid transparent}
.topbar nav a.nav-dead:hover{color:#C7D2CC;border-color:transparent}

/* ============================================================
   SIDEBAR LAYOUT (replaces topbar) — added in sidebar redesign
   ============================================================ */
:root{ --sbw:264px; }
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sbw);background:var(--green);
  border-right:1px solid var(--line-on-dark);display:flex;flex-direction:column;z-index:60;overflow-y:auto}
.sidebar .sb-brand{padding:22px 22px 14px;flex:0 0 auto}
.sidebar .sb-brand a{font-family:var(--serif);font-size:20px;color:#fff;display:block;line-height:1.1}
.sidebar .sb-brand .tag{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:#9FB3A8;font-weight:600;margin-top:4px}
/* search */
.sb-search{padding:4px 18px 16px;position:relative;flex:0 0 auto}
.sb-search input{width:100%;padding:9px 12px;border-radius:8px;border:1px solid var(--line-on-dark);
  background:rgba(255,255,255,.07);color:#fff;font-family:var(--sans);font-size:13px}
.sb-search input::placeholder{color:#8FA39A}
.sb-search input:focus{outline:none;border-color:#9FB3A8;background:rgba(255,255,255,.12)}
.search-results{display:none;position:absolute;left:14px;right:14px;top:48px;background:#fff;
  border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-lg);z-index:80;
  max-height:60vh;overflow-y:auto}
.search-results.show{display:block}
.sr-item{display:block;padding:11px 14px;border-bottom:1px solid var(--border)}
.sr-item:last-child{border-bottom:none}
.sr-item:hover{background:var(--surface-green)}
.sr-title{font-family:var(--serif);font-size:14px;color:var(--green)}
.sr-meta{font-size:10.5px;color:var(--gold);letter-spacing:.04em;margin:2px 0 4px}
.sr-snip{font-size:11.5px;color:var(--mute);line-height:1.4}
.sr-empty{padding:14px;font-size:12.5px;color:var(--mute)}
/* nav */
.sb-nav{flex:1 1 auto;padding:6px 12px 24px}
.sb-sec{margin-bottom:6px}
.sb-sec > .sb-sec-label{display:flex;align-items:center;justify-content:space-between;
  padding:9px 10px;color:#fff;font-size:13px;font-weight:600;
  border-radius:7px;cursor:pointer;width:100%}
.sb-sec.dead > .sb-sec-label{color:#8FA39A;cursor:default}
details.sb-sec > summary.sb-sec-label::after{content:"›";font-size:15px;opacity:.45;
  transition:transform .2s;transform:rotate(90deg);flex-shrink:0;font-weight:400}
details.sb-sec[open] > summary.sb-sec-label::after{transform:rotate(-90deg)}
details.sb-sec > summary::-webkit-details-marker,
details.sb-cat-group > summary::-webkit-details-marker{display:none}
details.sb-sec > summary,details.sb-cat-group > summary{list-style:none}
.sb-cat{display:flex;align-items:center;justify-content:space-between;
  padding:5px 10px 2px 14px;color:#9FB3A8;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  cursor:pointer;width:100%}
details.sb-cat-group > summary.sb-cat::after{content:"›";font-size:13px;opacity:.4;
  transition:transform .2s;transform:rotate(90deg);flex-shrink:0;
  text-transform:none;letter-spacing:0;font-weight:400}
details.sb-cat-group[open] > summary.sb-cat::after{transform:rotate(-90deg)}
.sb-nav a.sb-link{display:block;padding:5px 10px 5px 16px;color:#C7D2CC;font-size:12.5px;
  border-radius:6px;line-height:1.35}
.sb-nav a.sb-link:hover{background:rgba(255,255,255,.07);color:#fff}
.sb-nav a.sb-link.active{background:rgba(255,255,255,.10);color:#fff}
.sb-soon{display:block;padding:3px 10px 3px 16px;color:#6F827A;font-size:11.5px;font-style:italic}
.sb-foot{padding:14px 22px 22px;font-size:11px;color:#6F827A;border-top:1px solid var(--line-on-dark)}
.sb-foot a{color:#9FB3A8}

/* main content shifted right of sidebar */
.main{margin-left:var(--sbw);min-width:0}

/* mobile toggle button (hidden on desktop) */
.sb-toggle{display:none}
.sb-backdrop{display:none}

/* ---- study page: rail moves to the RIGHT ---- */
.layout{grid-template-columns:minmax(0,1fr) var(--rail)}   /* col1 content, col2 rail */
.layout > .content{grid-column:1;grid-row:1}
.layout > .rail{grid-column:2;grid-row:1}
.rail{top:24px}

@media(max-width:1100px){
  :root{ --sbw:240px; }
}
@media(max-width:880px){
  .sidebar{transform:translateX(-100%);transition:transform .25s ease;width:280px}
  .sidebar.open{transform:none}
  .main{margin-left:0}
  .sb-toggle{display:flex;align-items:center;gap:8px;position:fixed;top:12px;left:12px;z-index:70;
    background:var(--green);color:#fff;border:1px solid var(--line-on-dark);border-radius:8px;
    padding:8px 12px;font-family:var(--sans);font-size:13px;cursor:pointer}
  .sb-backdrop.show{display:block;position:fixed;inset:0;background:rgba(17,32,26,.5);z-index:55}
  .main{padding-top:52px}
  /* rail back to single column flow on mobile (handled by existing rule) */
}

/* ---------- needs fingerprint (buyer persona pages) ---------- */
.fp{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:24px 26px;margin:22px 0 8px}
.fp h4{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--green);margin-bottom:3px}
.fp .fp-sub{font-size:12px;color:var(--mute);margin-bottom:18px}
.fp-row{display:grid;grid-template-columns:210px 1fr;align-items:center;gap:14px;margin:7px 0}
.fp-row .fl{font-size:12px;color:var(--text);line-height:1.25}
.fp-row .fl b{color:var(--mute);font-weight:600;margin-right:5px}
.fp-track{height:14px;background:var(--surface-green);border-radius:7px;overflow:hidden}
.fp-bar{height:100%;border-radius:7px;background:var(--green)}
.fp-bar.lead{background:var(--gold)}
.fp-leg{font-size:11px;color:var(--soft);margin-top:14px;line-height:1.5}
.fp-leg b{color:var(--mute)}
@media(max-width:680px){.fp-row{grid-template-columns:1fr;gap:4px}}

/* persona profile fields */
.pf-essence{font-family:var(--serif);font-size:18px;color:var(--green);font-style:italic;line-height:1.45;margin:4px 0 18px;max-width:64ch}
.pf-ses{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin:18px 0}
.pf-ses .g{font-family:var(--serif);font-size:17px;color:var(--green)}
.pf-ses .grade{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;padding:3px 10px;border-radius:20px;background:rgba(166,124,46,.14);color:#7a5a1f;margin-left:8px}
.pf-ses .grade.wide{background:rgba(38,56,47,.12);color:#24382F}
.pf-vignette{background:var(--surface-green);border-left:3px solid var(--gold);border-radius:0 10px 10px 0;padding:16px 20px;font-style:italic;color:#3a4a40;font-size:14px;line-height:1.55;margin:18px 0}
.pf-killbox{background:rgba(38,56,47,.05);border:1px solid var(--border);border-radius:10px;padding:14px 18px;margin-top:10px}
.pf-killbox .kl{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--gold);margin-bottom:5px}
.pf-killbox p{font-size:12.5px;color:var(--mute);line-height:1.5;margin:0}

/* ---------- register × persona matrix (Homesy Voice page) ---------- */
.rpm-wrap{margin:22px 0 8px;overflow-x:auto}
.rpm{border-collapse:separate;border-spacing:0;width:100%;min-width:760px;font-size:12px}
.rpm th,.rpm td{padding:9px 8px;text-align:center;border-bottom:1px solid var(--border)}
.rpm thead th{font-family:var(--sans);font-weight:600;font-size:10.5px;letter-spacing:.03em;color:var(--mute);
  vertical-align:bottom;line-height:1.25;border-bottom:2px solid var(--border)}
.rpm thead th.lever-h{text-align:left;width:150px;color:var(--green)}
.rpm tbody th{text-align:left;font-weight:600;font-family:var(--serif);font-size:13px;color:var(--green);
  border-bottom:1px solid var(--border)}
.rpm .cell{font-size:0}
.rpm .dot{display:inline-block;width:13px;height:13px;border-radius:50%}
.rpm .lead{background:var(--gold)}
.rpm .support{background:#9DB3A6}
.rpm .minimal{background:var(--border)}
.rpm-leg{display:flex;gap:18px;margin-top:14px;font-size:11.5px;color:var(--text);flex-wrap:wrap}
.rpm-leg .k{display:flex;align-items:center;gap:7px}
.rpm-leg .dot{width:12px;height:12px;border-radius:50%;display:inline-block}
.rpm-cap{font-size:11px;color:var(--soft);margin-top:10px;line-height:1.5}

/* per-persona argued block */
.argue{border-left:3px solid var(--border);padding:2px 0 2px 20px;margin:22px 0}
.argue h3{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--green);margin-bottom:2px}
.argue .dialup{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--gold);margin-bottom:10px}
.argue .rec{font-size:14px;line-height:1.55;margin-bottom:8px}
.argue .rec b{color:var(--ink)}
.argue .because{font-size:13.5px;line-height:1.55;color:var(--text);margin-bottom:12px}
.argue .because .lbl{font-weight:700;color:var(--green)}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.dodont .dd{border-radius:8px;padding:11px 14px;font-size:12.5px;line-height:1.45}
.dodont .do{background:rgba(38,56,47,.06);border:1px solid rgba(38,56,47,.16)}
.dodont .dont{background:rgba(176,48,37,.05);border:1px solid rgba(176,48,37,.18)}
.dodont .dl{font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;margin-bottom:5px}
.dodont .do .dl{color:#2f6b4a}
.dodont .dont .dl{color:var(--alert)}
.dodont .dd p{margin:0;font-style:italic;color:#3a4a40}
@media(max-width:640px){.dodont{grid-template-columns:1fr}}

/* ---------- tonal-signature tiles (Homesy Voice — replaces wide matrix) ---------- */
.tl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:18px 0 6px}
.tl-tile{background:var(--surface-green);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.tl-head{font-family:var(--serif);font-size:15px;color:var(--green);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.tl-row{display:grid;grid-template-columns:1fr 74px;align-items:center;gap:10px;margin:6px 0}
.tl-name{font-size:11.5px;color:var(--text);line-height:1.2}
.tl-track{height:9px;background:#E7ECE8;border-radius:5px;overflow:hidden}
.tl-bar{display:block;height:100%;border-radius:5px;background:#9DB3A6}
.tl-bar.lead{background:var(--gold)}
.tl-bar.support{background:#7E9788}
.tl-bar.minimal{background:#CBD5CE}
.tl-leg{display:flex;gap:18px;margin-top:16px;font-size:11.5px;color:var(--text);flex-wrap:wrap}
.tl-leg .k{display:flex;align-items:center;gap:7px}
.tl-leg .sw{width:12px;height:12px;border-radius:3px;display:inline-block}
.tl-leg .sw.lead{background:var(--gold)}
.tl-leg .sw.support{background:#7E9788}
.tl-leg .sw.minimal{background:#CBD5CE}
.tl-cap{font-size:11px;color:var(--soft);margin-top:12px;line-height:1.5}
