:root{
  --bone:#F4F0E8;
  --paper:#FFFEFC;
  --ink:#1F2528;
  --blue:#3F6F8F;
  --steel:#AAB4B8;
  --line:rgba(126,139,145,.34);
  --line-soft:rgba(126,139,145,.20);
  --ink82:rgba(31,37,40,.82);
  --ink68:rgba(31,37,40,.68);
  --ink54:rgba(31,37,40,.54);
  --blue-soft:rgba(63,111,143,.08);
  --sans:"Google Sans Flex","Aptos","Inter","Helvetica Neue",Arial,sans-serif;
  --serif:"Source Serif 4","Iowan Old Style",Georgia,serif;
  --max:1180px;
  --prose:720px;
  --radius:7px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto}
a{color:inherit}
button,input{font:inherit}
::selection{background:rgba(63,111,143,.18)}
:focus-visible{outline:3px solid rgba(63,111,143,.28);outline-offset:3px}
[id]{scroll-margin-top:94px}
.container{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
.prose{width:min(var(--prose),100%)}
.eyebrow{margin:0 0 14px;color:var(--blue);font-size:11px;font-weight:760;letter-spacing:.135em;text-transform:uppercase}
.display{font-size:clamp(42px,6.1vw,72px);line-height:.99;letter-spacing:-.052em;font-weight:610;margin:0}
.h1{font-size:clamp(39px,5.1vw,62px);line-height:1.01;letter-spacing:-.047em;font-weight:610;margin:0}
.h2{font-size:clamp(30px,3.8vw,46px);line-height:1.06;letter-spacing:-.038em;font-weight:610;margin:0}
.h3{font-size:clamp(23px,2.2vw,30px);line-height:1.15;letter-spacing:-.026em;font-weight:620;margin:0}
.lede{font-size:clamp(18px,2vw,21px);line-height:1.58;color:var(--ink82)}
.body{font-size:17px;line-height:1.68;color:var(--ink82)}
.small{font-size:13px;line-height:1.55;color:var(--ink68)}
.serif{font-family:var(--serif)}
.muted{color:var(--ink68)}
.section{padding:92px 0}
.section.compact{padding:70px 0}
.bone{background:var(--bone)}
.blue-wash{background:linear-gradient(180deg,rgba(63,111,143,.055),rgba(63,111,143,.018))}
.rule{border-top:1px solid var(--line)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 18px;border:1px solid var(--blue);border-radius:5px;background:var(--blue);color:#fff;font-size:14px;font-weight:720;text-decoration:none;line-height:1.2}
.btn.secondary{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--blue);padding-inline:0}
.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.nav-shell{position:sticky;top:0;z-index:50;background:rgba(255,254,252,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:center;line-height:0;text-decoration:none;flex:0 0 auto}
.brand img{display:block;width:126px;max-height:30px;object-fit:contain}
.nav-links{display:flex;align-items:center;justify-content:flex-end;gap:24px;font-size:13px}
.nav-links a{text-decoration:none;color:var(--ink68)}
.nav-links a:hover{color:var(--ink)}
.nav-links .nav-cta{min-height:40px;padding:0 14px;border:1px solid var(--blue);border-radius:4px;background:var(--blue);color:#fff;font-weight:700}
.hero{padding:84px 0 96px;background:var(--bone)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr);gap:72px;align-items:end}
.hero .lede{max-width:760px;margin:25px 0 0}
.hero-note{margin:27px 0 0;max-width:670px;font-size:15px;line-height:1.6;color:var(--ink68)}
.hero-actions{margin-top:30px}
.process-panel{border-top:2px solid var(--blue);padding-top:20px}
.process-label{font-size:11px;color:var(--blue);font-weight:760;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px}
.process-list{display:grid;gap:0;border-top:1px solid var(--line)}
.process-step{position:relative;display:grid;grid-template-columns:30px 1fr;align-items:center;min-height:48px;border-bottom:1px solid var(--line-soft);font-size:14px;font-weight:650}
.process-step::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);margin-left:5px}
.process-step.break::before{width:11px;height:1px;border-radius:0;background:var(--steel)}
.choice-head{max-width:720px;margin-bottom:35px}
.choice-head .body{margin:14px 0 0}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.choice-card{padding:34px 36px 36px 0}
.choice-card+.choice-card{padding-left:36px;border-left:1px solid var(--line)}
.choice-tag{font-size:11px;color:var(--blue);font-weight:760;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}
.choice-card .h3{margin-bottom:13px}
.choice-card p{margin:0;color:var(--ink82);font-size:15px;line-height:1.62}
.choice-card ul{margin:18px 0 24px;padding-left:19px;color:var(--ink68);font-size:14px;line-height:1.58}
.choice-card li{margin:6px 0}
.editorial-quote{max-width:880px;margin:0;font-family:var(--serif);font-size:clamp(27px,3.1vw,39px);line-height:1.28;letter-spacing:-.022em;font-weight:520}
.definition{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:64px;align-items:start}
.definition .h2{max-width:480px}
.definition-copy p{font-size:17px;line-height:1.7;color:var(--ink82);margin:0 0 18px}
.loss-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.loss-list span{padding:8px 11px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:680;color:var(--ink68);background:rgba(255,255,255,.42)}
.area-intro{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:36px}
.area-intro .body{max-width:550px;margin:0}
.area-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.area-card{min-height:260px;padding:26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.22)}
.area-num{font-family:var(--serif);font-size:17px;color:var(--blue);margin-bottom:36px}
.area-card h3{font-size:22px;line-height:1.15;margin:0 0 11px}
.area-question{font-size:14px;line-height:1.55;color:var(--ink82);font-weight:650;margin-bottom:14px}
.area-card p{font-size:13px;line-height:1.55;color:var(--ink68);margin:0}
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px}
.fit-panel{padding-top:22px;border-top:2px solid var(--blue)}
.fit-panel.not{border-top-color:var(--steel)}
.fit-panel .h3{margin-bottom:18px}
.fit-panel ul{margin:0;padding-left:19px;font-size:15px;line-height:1.62;color:var(--ink82)}
.fit-panel li{margin:7px 0}
.snapshot-bridge{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:start}
.snapshot-bridge .h2{max-width:570px}
.snapshot-copy{font-size:16px;line-height:1.67;color:var(--ink82)}
.snapshot-copy p{margin-top:0}
.snapshot-price{margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}
.snapshot-price strong{display:block;font-size:18px;margin-bottom:4px}
.about-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:72px;align-items:start}
.about-grid .body{margin-top:0}
.about-points{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 28px;margin-top:22px;color:var(--ink68);font-size:14px;line-height:1.5}
.footer{padding:28px 0 40px;border-top:1px solid var(--line)}
.footer-row{display:flex;justify-content:space-between;align-items:center;gap:26px}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--ink68)}
.footer-links a{text-decoration:none}

/* Field guide publication */
.guide-hero{padding:76px 0 72px;background:var(--bone);border-bottom:1px solid var(--line)}
.guide-meta{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:54px;color:var(--ink68);font-size:12px}
.guide-hero .h1{max-width:960px}
.guide-hero .lede{max-width:760px;margin:23px 0 0}
.guide-hero .actions{margin-top:28px}
.guide-shell{display:grid;grid-template-columns:240px minmax(0,760px);gap:74px;justify-content:center;align-items:start;padding:70px 0 100px}
.guide-index{position:sticky;top:98px;align-self:start}
.guide-index-title{font-size:10px;color:var(--blue);font-weight:780;letter-spacing:.12em;text-transform:uppercase;margin-bottom:15px}
.guide-index ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.guide-index li{border-bottom:1px solid var(--line-soft)}
.guide-index a{display:grid;grid-template-columns:27px 1fr;gap:5px;padding:9px 0;text-decoration:none;color:var(--ink68);font-size:11px;line-height:1.35}
.guide-index a:hover{color:var(--ink)}
.mobile-index{display:none;margin-bottom:34px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mobile-index summary{cursor:pointer;padding:13px 0;font-size:13px;font-weight:700}
.mobile-index nav{padding:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:7px 18px}
.mobile-index a{font-size:12px;color:var(--ink68);text-decoration:none}
.guide-article{min-width:0}
.guide-section{padding:0 0 82px;margin-bottom:82px;border-bottom:1px solid var(--line)}
.guide-section:last-child{margin-bottom:0}
.chapter{display:flex;align-items:center;gap:12px;color:var(--blue);font-size:11px;font-weight:760;letter-spacing:.115em;text-transform:uppercase;margin-bottom:17px}
.chapter::after{content:"";height:1px;flex:1;background:var(--line-soft)}
.guide-section .h2{margin-bottom:24px}
.guide-section .body p{margin:0 0 19px}
.guide-section .body ul,.guide-section .body ol{padding-left:21px;margin:19px 0 0}
.guide-section .body li{margin:8px 0}
.pullquote{margin:34px 0;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-family:var(--serif);font-size:25px;line-height:1.45;color:var(--ink)}
.journey{margin:32px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.journey-row{display:grid;grid-template-columns:42px 1fr;align-items:center;min-height:45px;border-bottom:1px solid var(--line-soft);font-size:14px;font-weight:650}
.journey-row:last-child{border-bottom:0}
.journey-row span:first-child{font-family:var(--serif);color:var(--blue)}
.leak-module{padding:34px 0;border-top:1px solid var(--line)}
.leak-module:first-of-type{margin-top:30px}
.leak-head{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:start}
.leak-number{font-family:var(--serif);font-size:20px;color:var(--blue);padding-top:3px}
.leak-title{font-size:27px;line-height:1.15;letter-spacing:-.025em;margin:0}
.leak-question{font-family:var(--serif);font-size:19px;line-height:1.47;margin:14px 0 22px;color:var(--ink)}
.signal-title{font-size:10px;color:var(--blue);font-weight:780;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.signals{margin:0;padding-left:19px;color:var(--ink68);font-size:14px;line-height:1.58}
.signals li{margin:6px 0}
.reframe{margin-top:24px;padding:18px 20px;background:var(--blue-soft);border-left:3px solid var(--blue);font-size:14px;line-height:1.58;color:var(--ink82)}
.reframe strong{display:block;margin-bottom:5px;color:var(--ink)}
.misdiagnosis-list{margin-top:30px;border-top:1px solid var(--line)}
.mis-row{display:grid;grid-template-columns:.92fr 1.08fr;gap:36px;padding:22px 0;border-bottom:1px solid var(--line-soft)}
.mis-assumption{font-family:var(--serif);font-size:19px;line-height:1.4}
.mis-reframe{font-size:14px;line-height:1.58;color:var(--ink68)}
.check-bridge{padding:34px 36px;background:var(--bone);border-top:2px solid var(--blue)}
.check-bridge .h3{margin-bottom:12px}
.example-questions{display:grid;grid-template-columns:1fr 1fr;gap:9px 28px;margin:22px 0;color:var(--ink68);font-size:13px;line-height:1.5}
.trace{margin-top:30px;border-top:1px solid var(--line)}
.trace-row{display:grid;grid-template-columns:minmax(160px,.45fr) minmax(0,.55fr);gap:30px;padding:18px 0;border-bottom:1px solid var(--line-soft)}
.trace-row strong{font-size:14px}
.trace-row span{font-size:14px;line-height:1.55;color:var(--ink68)}
.tech-sequence{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:28px}
.tech-sequence div{display:flex;align-items:center;justify-content:center;min-height:58px;padding:10px;border:1px solid var(--line);font-size:12px;font-weight:690;text-align:center;background:rgba(255,255,255,.45)}
.reference{margin-top:30px;border-top:1px solid var(--line)}
.reference-row{display:grid;grid-template-columns:135px 1fr;gap:22px;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.reference-row strong{font-size:11px;color:var(--blue);letter-spacing:.08em}
.reference-row span{font-family:var(--serif);font-size:17px;line-height:1.45}
.snapshot-boundary{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:28px}
.boundary-col{padding-top:18px;border-top:2px solid var(--blue)}
.boundary-col.limit{border-top-color:var(--steel)}
.boundary-col h3{font-size:17px;margin:0 0 12px}
.boundary-col ul{margin:0;padding-left:18px;color:var(--ink68);font-size:13px;line-height:1.55}
.boundary-col li{margin:6px 0}
.guide-about{display:grid;grid-template-columns:.7fr 1.3fr;gap:50px}
.guide-about p{margin-top:0}

@media(max-width:920px){
  .nav-links a:not(.nav-cta):not(.keep-mobile){display:none}
  .hero-grid{grid-template-columns:1fr;gap:48px}.process-panel{max-width:680px}
  .definition,.snapshot-bridge,.about-grid{grid-template-columns:1fr;gap:34px}
  .area-grid{grid-template-columns:1fr 1fr}
  .guide-shell{grid-template-columns:minmax(0,760px);gap:0}
  .guide-index{display:none}.mobile-index{display:block}
  .tech-sequence{grid-template-columns:1fr 1fr}
}
@media(max-width:660px){
  .container{width:calc(100% - 32px)}
  .nav{height:64px}.brand img{width:112px}.nav-links{gap:10px}.nav-links .nav-cta{font-size:12px;padding:0 12px}
  .hero{padding:58px 0 70px}.section{padding:68px 0}.section.compact{padding:56px 0}
  .choice-grid,.fit-grid,.snapshot-boundary{grid-template-columns:1fr}
  .choice-card{padding:27px 0}.choice-card+.choice-card{padding:27px 0;border-left:0;border-top:1px solid var(--line)}
  .area-grid{grid-template-columns:1fr}.area-card{min-height:0}
  .area-intro{display:block}.area-intro .body{margin-top:16px}
  .footer-row{align-items:flex-start;flex-direction:column}
  .guide-hero{padding:52px 0 55px}.guide-meta{margin-bottom:36px}
  .guide-shell{padding:48px 0 70px}
  .guide-section{padding-bottom:62px;margin-bottom:62px}
  .mobile-index nav{grid-template-columns:1fr}
  .leak-head{grid-template-columns:42px 1fr}.leak-title{font-size:24px}
  .mis-row,.trace-row,.reference-row,.guide-about{grid-template-columns:1fr;gap:8px}
  .check-bridge{padding:28px 22px}.example-questions{grid-template-columns:1fr}
  .tech-sequence{grid-template-columns:1fr}
  .actions{align-items:stretch}.actions .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Phase 2 Visual Polish v1 */
/*
  Purpose: tighten cross-page header consistency, improve Entry hero journey
  legibility, and make the long-form Field Guide easier to navigate without
  changing approved content, CTA hierarchy, or the locked Lead Leakage Check.
*/
:root{
  --ll-brand-width:118px;
  --ll-brand-width-mobile:108px;
}

/* Match the locked Check's header/logo scale. */
.nav .brand img,
.footer .brand img{
  width:var(--ll-brand-width);
  max-width:var(--ll-brand-width);
  max-height:28px;
}

/* Entry: keep the process rail restrained, but make it easier to read. */
.process-panel{
  padding-top:22px;
}
.process-label{
  margin-bottom:18px;
  font-size:11.5px;
  letter-spacing:.125em;
}
.process-list{
  border-top-color:rgba(126,139,145,.42);
}
.process-step{
  min-height:50px;
  color:var(--ink82);
  font-size:14.5px;
  font-weight:680;
  line-height:1.35;
}
.process-step::before{
  width:7px;
  height:7px;
}
.process-step.break::before{
  width:12px;
  height:1px;
}

/* Field Guide: stronger reading rhythm and navigation landmarks. */
.guide-shell{
  grid-template-columns:252px minmax(0,760px);
  gap:82px;
  padding-top:78px;
  padding-bottom:112px;
}
.guide-index-title{
  margin-bottom:17px;
  font-size:11px;
  letter-spacing:.125em;
}
.guide-index a{
  grid-template-columns:31px 1fr;
  gap:7px;
  padding:11px 0;
  color:var(--ink68);
  font-size:12px;
  line-height:1.42;
}
.guide-index a:hover,
.guide-index a:focus-visible{
  color:var(--ink);
}
.guide-section{
  padding-bottom:96px;
  margin-bottom:96px;
}
.chapter{
  margin-bottom:20px;
  font-size:11.5px;
  letter-spacing:.12em;
}
.chapter::after{
  background:var(--line);
}
.guide-section .h2{
  margin-bottom:28px;
}
.guide-section .body p{
  margin-bottom:21px;
}
.leak-module{
  padding-top:40px;
  padding-bottom:40px;
}

@media(max-width:920px){
  .guide-shell{
    padding-top:62px;
    padding-bottom:92px;
  }
}

@media(max-width:660px){
  .nav .brand img,
  .footer .brand img{
    width:var(--ll-brand-width-mobile);
    max-width:var(--ll-brand-width-mobile);
    max-height:27px;
  }
  .process-step{
    min-height:48px;
    font-size:14px;
  }
  .guide-shell{
    padding-top:52px;
    padding-bottom:76px;
  }
  .guide-section{
    padding-bottom:70px;
    margin-bottom:70px;
  }
  .chapter{
    margin-bottom:17px;
    font-size:11px;
  }
  .guide-section .h2{
    margin-bottom:24px;
  }
  .leak-module{
    padding-top:34px;
    padding-bottom:34px;
  }
}

/* Phase 2 Visual Polish v2 */
/*
  Purpose: rebalance the Entry and Field Guide desktop compositions, bring the
  complete hero experience comfortably above the fold on typical laptop/desktop
  viewports, normalize CTA sizing/alignment, and tighten the cross-page type
  hierarchy. Content, conversion architecture, and the locked Check remain unchanged.
*/
:root{
  --ll-nav-height:64px;
  --ll-display:clamp(44px,5.25vw,64px);
  --ll-h1:clamp(40px,4.35vw,56px);
  --ll-h2:clamp(30px,3.15vw,42px);
  --ll-h3:clamp(22px,2vw,27px);
}

/* Shared hierarchy: fewer near-duplicate headline sizes. */
.display{font-size:var(--ll-display);line-height:1.005;letter-spacing:-.048em;font-weight:620}
.h1{font-size:var(--ll-h1);line-height:1.035;letter-spacing:-.044em;font-weight:620}
.h2{font-size:var(--ll-h2);line-height:1.08;letter-spacing:-.035em;font-weight:620}
.h3{font-size:var(--ll-h3);line-height:1.16;letter-spacing:-.025em;font-weight:630}
.lede{font-size:clamp(18px,1.6vw,20px);line-height:1.54}
.body{font-size:16.5px;line-height:1.68}
.eyebrow{font-size:11px;line-height:1.2;letter-spacing:.13em}

/* Header: compact enough to support an above-fold hero, but not miniature. */
.nav{height:var(--ll-nav-height)}
.nav-links{gap:22px}
.nav-links .nav-cta{
  min-height:38px;
  padding:0 16px;
  border-radius:5px;
  font-size:12.5px;
  font-weight:720;
  letter-spacing:.005em;
  box-shadow:0 1px 0 rgba(31,37,40,.08);
}

/* Entry hero: balance editorial statement with a real visual counterweight. */
.hero{
  min-height:calc(100svh - var(--ll-nav-height));
  display:flex;
  align-items:center;
  padding:36px 0 40px;
}
.hero-grid{
  width:100%;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:64px;
  align-items:center;
}
.hero .lede{max-width:700px;margin-top:20px}
.hero-note{max-width:640px;margin-top:20px;font-size:14.5px;line-height:1.58}
.process-panel{
  padding:26px 28px 22px;
  border:1px solid var(--line);
  border-top:2px solid var(--blue);
  background:rgba(255,255,255,.26);
}
.process-label{margin-bottom:15px;font-size:11px;letter-spacing:.12em}
.process-step{min-height:43px;font-size:14px;font-weight:680}
.process-step::before{width:7px;height:7px}
.process-step.break::before{width:12px;height:1px}

/* Entry two-column decisions: equal visual weight and aligned action rows. */
.choice-head{margin-bottom:30px}
.choice-grid{align-items:stretch}
.choice-card{min-width:0}
.choice-card:has(> ul){
  display:grid;
  grid-template-rows:auto auto auto 1fr auto 32px;
}
.choice-card:has(> ul) > .choice-tag{grid-row:1}
.choice-card:has(> ul) > .h3{grid-row:2}
.choice-card:has(> ul) > p:not(.small){grid-row:3}
.choice-card:has(> ul) > ul{grid-row:4}
.choice-card:has(> ul) > .btn{grid-row:5;justify-self:start;align-self:end}
.choice-card:has(> ul) > .small{grid-row:6;align-self:start}
.choice-card:not(:has(> ul)){
  display:grid;
  grid-template-rows:auto auto 1fr auto 32px;
}
.choice-card:not(:has(> ul)) > .choice-tag{grid-row:1}
.choice-card:not(:has(> ul)) > .h3{grid-row:2}
.choice-card:not(:has(> ul)) > p:not(.small){grid-row:3}
.choice-card:not(:has(> ul)) > .actions{grid-row:4;align-self:end}
.choice-card:not(:has(> ul)) > .small{grid-row:5;align-self:start}
.choice-grid .btn{min-width:174px}
.choice-card p{font-size:15px;line-height:1.64}
.choice-card ul{margin-top:18px;margin-bottom:22px}

/* Entry content splits: closer to 50/50 unless the content itself requires otherwise. */
.definition{grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);gap:72px}
.area-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:start}
.area-intro .body{max-width:520px;justify-self:end}
.snapshot-bridge{grid-template-columns:1fr 1fr;gap:72px}
.about-grid{grid-template-columns:.95fr 1.05fr;gap:72px}
.editorial-quote{max-width:960px}

/* Buttons: one family, with page-level consistency. */
.btn{min-height:44px;padding:0 18px;font-size:13.5px;border-radius:5px;font-weight:720}
.guide-hero .btn,.check-bridge .btn,.snapshot-copy .btn{min-width:156px}

/* Field Guide hero: title on the left, explanation + actions on the right. */
.guide-hero{padding:54px 0 58px}
.guide-hero .container{
  display:grid;
  grid-template-columns:minmax(0,1.14fr) minmax(320px,.86fr);
  column-gap:72px;
  align-items:start;
}
.guide-meta{grid-column:1/-1;margin-bottom:36px}
.guide-hero .eyebrow{grid-column:1;grid-row:2;margin-bottom:12px}
.guide-hero .h1{grid-column:1;grid-row:3 / span 2;max-width:none}
.guide-hero .lede{grid-column:2;grid-row:3;max-width:520px;margin:2px 0 0;align-self:start}
.guide-hero .actions{grid-column:2;grid-row:4;margin-top:24px;align-self:start}

/* Field Guide reading column: stronger article weight, quieter but usable rail. */
.guide-shell{
  grid-template-columns:230px minmax(0,800px);
  gap:70px;
  padding-top:72px;
  padding-bottom:104px;
}
.guide-index-title{font-size:11px}
.guide-index a{grid-template-columns:30px 1fr;gap:7px;padding:10px 0;font-size:12.5px;line-height:1.42}
.guide-article .body{font-size:17px;line-height:1.7}
.guide-section{padding-bottom:86px;margin-bottom:86px}
.guide-section .h2{max-width:780px;margin-bottom:25px}
.chapter{margin-bottom:18px;font-size:11px}
.leak-module{padding:35px 0}
.leak-title{font-size:28px}
.leak-question{font-size:20px}
.pullquote{font-size:25px;line-height:1.42}
.mis-row{grid-template-columns:1fr 1fr;gap:40px}
.guide-about{grid-template-columns:.92fr 1.08fr;gap:48px}

@media(max-width:920px){
  .hero{min-height:0;display:block;padding:58px 0 70px}
  .hero-grid{grid-template-columns:1fr;gap:46px}
  .process-panel{max-width:680px}
  .definition,.snapshot-bridge,.about-grid{grid-template-columns:1fr;gap:36px}
  .area-intro{grid-template-columns:1fr;gap:16px}
  .area-intro .body{justify-self:start;max-width:620px}

  .guide-hero{padding:52px 0 56px}
  .guide-hero .container{display:block}
  .guide-meta{margin-bottom:34px}
  .guide-hero .h1{max-width:820px}
  .guide-hero .lede{max-width:720px;margin-top:20px}
  .guide-hero .actions{margin-top:24px}
  .guide-shell{grid-template-columns:minmax(0,780px);gap:0;padding-top:58px;padding-bottom:88px}
}

@media(max-width:660px){
  .nav{height:64px}
  .nav-links .nav-cta{min-height:36px;padding:0 12px;font-size:12px}
  .display{font-size:clamp(40px,11.6vw,50px);line-height:1.02}
  .h1{font-size:clamp(36px,10vw,46px)}
  .h2{font-size:clamp(29px,8vw,37px)}
  .h3{font-size:clamp(22px,6vw,26px)}
  .hero{padding:48px 0 58px}
  .process-panel{padding:22px 20px 18px}

  .choice-card:has(> ul),
  .choice-card:not(:has(> ul)){display:block}
  .choice-grid .btn{min-width:0}
  .choice-card > .small{min-height:0}

  .guide-hero{padding:44px 0 48px}
  .guide-shell{padding-top:48px;padding-bottom:72px}
  .guide-section{padding-bottom:64px;margin-bottom:64px}
  .guide-article .body{font-size:16.5px;line-height:1.68}
  .mis-row,.guide-about{grid-template-columns:1fr;gap:10px}
}

/* Phase 2 Brand + Composition Polish v3 */
/*
  Governing visual standard:
  - Warm analytical minimalism
  - Google Sans Flex for UI, navigation, headings, body, labels and buttons
  - Source Serif 4 only for reflective/editorial moments
  - Warm Bone / Deep Charcoal / Operational Blue / Soft Steel
  - Signal Amber reserved for genuine semantic use (not decorative)
  - Premium operational publication, not SaaS-card styling
*/
:root{
  --brand-bone:#F4F0E8;
  --brand-ink:#1F2528;
  --brand-blue:#3F6F8F;
  --brand-amber:#C28A3A;
  --brand-steel:#AAB4B8;
  --p2-nav-h:68px;
  --p2-hero-display:clamp(46px,4.65vw,58px);
  --p2-guide-h1:clamp(43px,4.1vw,52px);
  --p2-h2:clamp(30px,2.8vw,34px);
  --p2-h3:clamp(20px,1.8vw,21px);
  --p2-body:16px;
  --p2-small:13px;
}

/* Brand token reconciliation — keep the public experience on the canonical palette. */
:root{
  --bone:var(--brand-bone);
  --ink:var(--brand-ink);
  --blue:var(--brand-blue);
  --steel:var(--brand-steel);
  --sans:"Google Sans Flex","Aptos","Helvetica Neue",Arial,sans-serif;
  --serif:"Source Serif 4","Iowan Old Style",Georgia,serif;
}
body{background:var(--paper);color:var(--brand-ink)}

/* A clearer Fibonacci-like hierarchy: hero ~55, section ~34, subsection ~21, body 16, support 13. */
.display{font-size:var(--p2-hero-display);line-height:1.015;letter-spacing:-.046em;font-weight:620}
.h1{font-size:var(--p2-guide-h1);line-height:1.04;letter-spacing:-.042em;font-weight:620}
.h2{font-size:var(--p2-h2);line-height:1.10;letter-spacing:-.032em;font-weight:620}
.h3{font-size:var(--p2-h3);line-height:1.20;letter-spacing:-.020em;font-weight:650}
.body{font-size:var(--p2-body);line-height:1.68}
.small{font-size:var(--p2-small);line-height:1.55}
.lede{font-size:18px;line-height:1.55}
.eyebrow,.chapter,.choice-tag,.process-label,.guide-index-title{color:var(--brand-blue)}

/* Shared navigation: premium utility bar, with a real primary action rather than a badge. */
.nav{height:var(--p2-nav-h);gap:30px}
.brand img{width:118px;max-width:118px;max-height:28px}
.nav-links{gap:25px;font-size:13.5px}
.nav-links > a:not(.nav-cta){color:rgba(31,37,40,.68);font-weight:520}
.nav-links > a:not(.nav-cta):hover{color:var(--brand-ink)}
.nav-links .nav-cta{
  min-height:44px;
  padding:0 19px;
  border:1px solid var(--brand-blue);
  border-radius:5px;
  background:var(--brand-blue);
  color:#fff;
  font-size:13px;
  font-weight:720;
  letter-spacing:.005em;
  box-shadow:none;
  transition:transform .16s ease,filter .16s ease;
}
.nav-links .nav-cta:hover{filter:brightness(.94);transform:translateY(-1px)}
.nav-links .nav-cta:active{transform:translateY(0)}

/* Buttons: one calm operational family across Entry + Guide. */
.btn{
  min-height:44px;
  padding:0 18px;
  border-radius:5px;
  border-color:var(--brand-blue);
  background:var(--brand-blue);
  color:#fff;
  font-size:13px;
  font-weight:720;
  box-shadow:none;
  transition:transform .16s ease,filter .16s ease,background-color .16s ease;
}
.btn:hover{filter:brightness(.94);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.secondary{background:transparent;color:var(--brand-ink);border-color:rgba(170,180,184,.78)}
.btn.secondary:hover{filter:none;background:rgba(63,111,143,.055)}

/* ENTRY HERO — above-fold, balanced, and visually quieter than a conversion landing page. */
.hero{
  min-height:min(610px,calc(100svh - var(--p2-nav-h)));
  padding:34px 0 38px;
  align-items:center;
}
.hero-grid{
  grid-template-columns:minmax(0,1.04fr) minmax(390px,.96fr);
  gap:58px;
  align-items:start;
}
.hero .eyebrow{margin-bottom:12px}
.hero .lede{max-width:650px;margin-top:17px;font-size:17px;line-height:1.56}
.hero-note{max-width:625px;margin-top:16px;font-size:13px;line-height:1.55;color:rgba(31,37,40,.62)}

/* The journey is an operational diagram, not a card. Thin rules carry the brand. */
.process-panel{
  align-self:center;
  padding:16px 0 0;
  border:0;
  border-top:2px solid var(--brand-blue);
  border-bottom:1px solid rgba(170,180,184,.52);
  background:transparent;
}
.process-label{margin-bottom:10px;font-size:10.5px;letter-spacing:.13em}
.process-list{border-top:1px solid rgba(170,180,184,.38)}
.process-step{
  grid-template-columns:26px 1fr;
  min-height:39px;
  border-bottom:1px solid rgba(170,180,184,.30);
  color:rgba(31,37,40,.88);
  font-size:13px;
  font-weight:650;
}
.process-step:last-child{border-bottom:0}
.process-step::before{width:6px;height:6px;margin-left:4px;background:var(--brand-blue)}
.process-step.break::before{width:11px;height:1px;background:var(--brand-steel)}

/* ENTRY SECTION RHYTHM — enough air, without oversized marketing-page whitespace. */
.section{padding:82px 0}
.section.compact{padding:62px 0}
.choice-head{max-width:690px;margin-bottom:28px}
.choice-grid{grid-template-columns:1fr 1fr}
.choice-card{padding-top:30px;padding-bottom:31px}
.choice-card+.choice-card{padding-left:34px}
.choice-card .h3{font-size:21px;margin-bottom:11px}
.choice-card p{font-size:14.5px;line-height:1.60}
.choice-card ul{font-size:13.5px;line-height:1.58}
.choice-grid .btn{min-width:172px}

/* Visually balance paired decisions: same button geometry and action baseline. */
.choice-card:has(> ul){grid-template-rows:auto auto auto 1fr 44px 30px}
.choice-card:has(> ul) > .btn{align-self:end}
.choice-card:not(:has(> ul)){grid-template-rows:auto auto 1fr 44px 30px}
.choice-card:not(:has(> ul)) > .actions{align-self:end}
.choice-card .actions .btn,.choice-card > .btn{height:44px}

.definition{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:68px}
.definition-copy p{font-size:16px;line-height:1.68}
.area-intro{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:64px}
.area-grid{background:rgba(255,254,252,.28)}
.area-card{min-height:238px;padding:24px;background:transparent}
.area-num{margin-bottom:28px;font-size:15px}
.area-card h3{font-size:21px}
.fit-grid{gap:38px}
.fit-panel{padding-top:18px}
.fit-panel ul{font-size:14px;line-height:1.62}
.snapshot-bridge{grid-template-columns:1fr 1fr;gap:64px}
.about-grid{grid-template-columns:1fr 1fr;gap:64px}
.about-points{font-size:13px}
.editorial-quote{font-size:clamp(25px,2.55vw,32px);line-height:1.32;max-width:900px}

/* Keep Operational Blue meaningful: rule, label, action, focus — not decorative saturation. */
.fit-panel,.process-panel{border-top-color:var(--brand-blue)}
.fit-panel.not{border-top-color:var(--brand-steel)}
.loss-list span{background:rgba(255,254,252,.38)}

/* FIELD GUIDE HERO — restrained publication entry, balanced title/explanation. */
.guide-hero{padding:46px 0 50px}
.guide-hero .container{
  grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);
  column-gap:64px;
}
.guide-meta{margin-bottom:30px}
.guide-hero .eyebrow{margin-bottom:10px}
.guide-hero .h1{max-width:650px}
.guide-hero .lede{max-width:500px;margin-top:0;font-size:16.5px;line-height:1.58}
.guide-hero .actions{margin-top:21px}
.guide-hero .btn{min-width:148px}

/* FIELD GUIDE — target brand reading width 650–760px, not a stretched SaaS article. */
.guide-shell{
  grid-template-columns:220px minmax(0,748px);
  gap:68px;
  padding-top:64px;
  padding-bottom:96px;
}
.guide-index{top:92px}
.guide-index-title{font-size:10.5px;letter-spacing:.125em}
.guide-index a{grid-template-columns:29px 1fr;padding:9px 0;font-size:11.5px;line-height:1.40}
.guide-article .body{font-size:16px;line-height:1.70}
.guide-section{padding-bottom:74px;margin-bottom:74px}
.guide-section .h2{max-width:720px;margin-bottom:21px}
.chapter{margin-bottom:15px;font-size:10.5px;letter-spacing:.12em}
.leak-module{padding:31px 0}
.leak-title{font-size:21px;line-height:1.20}
.leak-question{font-size:17px;line-height:1.45}
.pullquote{font-family:var(--serif);font-size:23px;line-height:1.42;letter-spacing:-.012em}
.signal-title{font-size:11px;letter-spacing:.10em}
.signals{font-size:15px;line-height:1.62}
.reframe{border-left-color:var(--brand-blue);background:rgba(63,111,143,.055)}
.mis-row{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:38px}
.check-bridge{background:var(--brand-bone);border-color:rgba(170,180,184,.55)}
.guide-about{grid-template-columns:.9fr 1.1fr;gap:44px}

/* Footer and quiet UI remain warm, structured and unobtrusive. */
.footer{padding-top:24px;padding-bottom:32px}
.footer .brand img{width:112px;max-width:112px}
.footer-links{font-size:12px}

@media (min-width:921px) and (max-height:760px){
  .hero{min-height:0;padding:28px 0 30px}
  .display{font-size:clamp(43px,4.25vw,54px)}
  .hero .lede{margin-top:14px;font-size:16.5px}
  .hero-note{margin-top:13px}
  .process-step{min-height:36px}
}

@media(max-width:920px){
  .nav{height:66px}
  .hero{min-height:0;padding:52px 0 62px}
  .hero-grid{grid-template-columns:1fr;gap:38px}
  .process-panel{max-width:650px;width:100%;align-self:start}
  .section{padding:72px 0}
  .definition,.snapshot-bridge,.about-grid{gap:34px}

  .guide-hero{padding:48px 0 52px}
  .guide-hero .container{display:block}
  .guide-hero .h1{max-width:760px}
  .guide-hero .lede{max-width:680px;margin-top:18px}
  .guide-shell{grid-template-columns:minmax(0,748px);padding-top:54px;padding-bottom:82px}
}

@media(max-width:660px){
  :root{--p2-nav-h:62px}
  .container{width:min(var(--max),calc(100% - 36px))}
  .nav{height:62px}
  .nav .brand img{width:104px;max-width:104px}
  .nav-links{gap:10px}
  .nav-links > a:not(.nav-cta){display:none}
  .nav-links .nav-cta{min-height:40px;padding:0 13px;font-size:12px}
  .display{font-size:clamp(39px,11vw,47px);line-height:1.025}
  .h1{font-size:clamp(35px,9.6vw,43px)}
  .h2{font-size:clamp(28px,7.7vw,33px)}
  .h3{font-size:20px}
  .body{font-size:16px}
  .lede{font-size:17px}
  .hero{padding:42px 0 50px}
  .hero-note{font-size:13px}
  .process-panel{padding-top:14px}
  .process-step{min-height:38px;font-size:12.75px}
  .section{padding:62px 0}
  .section.compact{padding:52px 0}
  .choice-card,.choice-card+.choice-card{padding-top:26px;padding-bottom:28px}
  .choice-grid .btn{min-width:0;width:auto}
  .area-card{min-height:0}
  .editorial-quote{font-size:25px}

  .guide-hero{padding:40px 0 44px}
  .guide-shell{padding-top:44px;padding-bottom:68px}
  .guide-section{padding-bottom:58px;margin-bottom:58px}
  .guide-article .body{font-size:16px}
  .leak-title{font-size:21px}
  .leak-question{font-size:17px}
  .pullquote{font-size:22px}
}

@media(prefers-reduced-motion:reduce){
  .btn,.nav-links .nav-cta{transition:none}
  .btn:hover,.nav-links .nav-cta:hover{transform:none}
}
/* End Phase 2 Brand + Composition Polish v3 */


/* Phase 2 UX Integrity + Component System v4
   Hard-gate correction for grid integrity, CTA alignment, readable spacing,
   semantic control dimensions, equal-choice agency, accessible tables, and
   consistent brand use across Entry + Web Field Guide. */
:root{
  --vz-space-1:8px;
  --vz-space-2:12px;
  --vz-space-3:16px;
  --vz-space-4:20px;
  --vz-space-5:24px;
  --vz-space-6:32px;
  --vz-space-7:40px;
  --vz-gutter-desktop:48px;
  --vz-gutter-mobile:36px;
}

/* 1. Master-grid integrity: backgrounds may bleed; content may not. */
.hero .container.hero-grid{
  width:min(var(--max),calc(100% - var(--vz-gutter-desktop)));
  margin-inline:auto;
}
.guide-hero > .container,
.nav.container,
.footer .container{
  margin-inline:auto;
}

/* 2. Interactions: true optical centering and predictable touch targets. */
.nav-links .nav-cta,
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding-top:0;
  padding-bottom:0;
  line-height:1;
  text-align:center;
  white-space:nowrap;
}
.nav-links .nav-cta{padding-inline:20px}
.btn{padding-inline:19px}

/* 3. Accessibility: small supporting copy cannot sit on the contrast threshold. */
.hero-note{color:var(--ink68)}

/* 4. Keep the restrained brand system flat rather than gradient-driven. */
.blue-wash{background:rgba(63,111,143,.045)}

/* 5. Choice component: equal agency, equal action zones, consistent rhythm. */
.choice-grid{align-items:stretch}
.choice-card,
.choice-card:has(> ul),
.choice-card:not(:has(> ul)){
  display:flex;
  flex-direction:column;
  min-width:0;
}
.choice-card .h3{margin-bottom:var(--vz-space-2);line-height:1.20}
.choice-card > p:not(.choice-microcopy){
  margin:0;
  font-size:15px;
  line-height:1.56;
  max-width:545px;
}
.choice-card ul{
  margin:var(--vz-space-4) 0 var(--vz-space-5);
  padding-left:20px;
  font-size:14px;
  line-height:1.60;
}
.choice-card li{margin:7px 0}
.choice-action-zone{
  margin-top:auto;
  padding-top:var(--vz-space-2);
  min-height:92px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:10px;
}
.choice-microcopy{
  margin:0!important;
  min-height:20px;
  color:var(--ink68)!important;
  font-size:12.5px!important;
  line-height:1.5!important;
}

/* 6. Six control dimensions: explanatory system, not faux buttons. */
.control-dimensions{margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.control-dimensions-label{
  margin:0;
  padding:12px 0 10px;
  color:var(--blue);
  font-size:10.5px;
  line-height:1.3;
  font-weight:760;
  letter-spacing:.115em;
  text-transform:uppercase;
}
.control-dimensions ul{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  margin:0;
  padding:0;
  border-top:1px solid var(--line-soft);
}
.control-dimensions li{
  position:relative;
  min-height:48px;
  display:flex;
  align-items:center;
  padding:10px 10px 10px 20px;
  color:var(--ink82);
  font-size:12px;
  line-height:1.35;
  font-weight:650;
}
.control-dimensions li+li{border-left:1px solid var(--line-soft)}
.control-dimensions li::before{
  content:"";position:absolute;left:8px;top:50%;width:5px;height:5px;
  border-radius:50%;background:var(--blue);transform:translateY(-50%);
}

/* 7. Fit boundary: neutral shared rule; copy—not color—carries the distinction. */
.fit-grid{
  gap:38px;
  padding-top:20px;
  border-top:1px solid var(--line);
}
.fit-panel,
.fit-panel.not{padding-top:0;border-top:0}
.fit-panel .h3{margin-bottom:16px;line-height:1.24}
.fit-panel ul{line-height:1.64}
.fit-panel li{margin:8px 0}

/* 8. Snapshot bridge: clarify the destination and make the qualified action obvious. */
.snapshot-copy p{margin:0 0 16px;line-height:1.66}
.snapshot-price{margin-top:24px}
.snapshot-action{margin-top:22px}
.snapshot-action .btn{min-width:224px}

/* 9. About: use tabular structure only where a real relationship exists. */
.operating-lens-table{
  width:100%;
  margin-top:26px;
  border-collapse:collapse;
  table-layout:fixed;
  color:var(--ink82);
  font-size:13.5px;
  line-height:1.48;
}
.operating-lens-table caption{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.operating-lens-table th,
.operating-lens-table td{padding:12px 0;vertical-align:top;border-bottom:1px solid var(--line-soft);text-align:left}
.operating-lens-table thead th{
  padding-top:0;padding-bottom:10px;color:var(--blue);font-size:10.5px;
  font-weight:760;letter-spacing:.10em;text-transform:uppercase;border-bottom:1px solid var(--line);
}
.operating-lens-table th:first-child,
.operating-lens-table td:first-child{width:38%;padding-right:24px}
.operating-lens-table tbody th{color:var(--ink);font-weight:650}
.operating-lens-table tbody tr:last-child th,
.operating-lens-table tbody tr:last-child td{border-bottom:0}
.about-principle{margin:24px 0 0;font-size:19px;line-height:1.5}

/* 10. Editorial reading rhythm: consistent paragraph cadence across Guide modules. */
.guide-article .body{line-height:1.72}
.guide-section .body p{margin:0 0 22px}
.guide-section .body p:last-child{margin-bottom:0}
.guide-section .body ul,
.guide-section .body ol{margin-top:20px}
.guide-section .body li{margin:8px 0;line-height:1.58}
.check-bridge{padding:34px 36px}
.check-bridge .h3{line-height:1.22;margin-bottom:14px}
.check-bridge p{line-height:1.62}
.guide-about-role{margin-top:14px!important}
.guide-about-intro{margin:0!important}
.guide-operating-lens-table{margin-top:24px}

/* 11. Preserve consistent page geometry at common breakpoints. */
@media(max-width:920px){
  .hero .container.hero-grid{width:min(var(--max),calc(100% - var(--vz-gutter-desktop)))}
  .control-dimensions ul{grid-template-columns:repeat(3,1fr)}
  .control-dimensions li:nth-child(4){border-left:0}
  .control-dimensions li:nth-child(n+4){border-top:1px solid var(--line-soft)}
}
@media(max-width:660px){
  .hero .container.hero-grid{width:calc(100% - var(--vz-gutter-mobile))}
  .nav-links .nav-cta{min-height:44px;padding-inline:15px}
  .choice-action-zone{min-height:0;padding-top:18px}
  .control-dimensions ul{grid-template-columns:repeat(2,1fr)}
  .control-dimensions li:nth-child(odd){border-left:0}
  .control-dimensions li:nth-child(n+3){border-top:1px solid var(--line-soft)}
  .operating-lens-table{font-size:13px}
  .operating-lens-table th:first-child,
  .operating-lens-table td:first-child{width:40%;padding-right:16px}
  .snapshot-action .btn{min-width:0;width:100%;white-space:normal;line-height:1.2;padding-top:12px;padding-bottom:12px}
}
/* End Phase 2 UX Integrity + Component System v4 */

/* Phase 2 UX Micro-Integrity v4.1
   Normalizes journey markers and balances the six control-dimension strip. */

/* Journey stages all use one visual grammar. Uncertainty should be expressed
   by copy or connectors, not a different icon attached to a stage label. */
.process-step::before,
.process-step.break::before{
  width:6px;
  height:6px;
  margin-left:4px;
  border-radius:50%;
  background:var(--brand-blue);
}

/* Give longer semantic labels the space they need without changing type size. */
.control-dimensions ul{
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) minmax(0,1.05fr) minmax(0,1.10fr) minmax(0,1.30fr) minmax(0,.85fr);
}
.control-dimensions li{
  white-space:nowrap;
  hyphens:none;
}

@media (max-width: 920px){
  .control-dimensions ul{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 620px){
  .control-dimensions ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .control-dimensions li{white-space:normal}
}

/* Phase 2 Composition Synthesis v5
   Uses the strongest composition ideas from the editorial reference while
   preserving the approved Velzenith doctrine, buyer agency, typography,
   color system, diagnostic boundaries, and existing routes. */

/* Hero: editorial premise + operational counterweight. */
.process-panel{
  align-self:center;
  padding:28px 30px 26px;
  border:0;
  border-top:3px solid var(--blue);
  border-radius:4px;
  background:var(--ink);
  box-shadow:none;
}
.process-label{
  margin-bottom:14px;
  color:rgba(255,254,252,.78);
  font-size:10.5px;
  letter-spacing:.13em;
}
.process-list{border-top:1px solid rgba(170,180,184,.26)}
.process-step{
  min-height:42px;
  border-bottom:1px solid rgba(170,180,184,.22);
  color:rgba(255,254,252,.88);
  font-size:13.5px;
  font-weight:650;
}
.process-step::before,
.process-step.break::before{
  background:var(--blue);
  box-shadow:0 0 0 2px rgba(63,111,143,.10);
}

/* Decision modules: contained, equal, and intentionally limited to decisions. */
.choice-grid{
  gap:18px;
  border-top:0;
  border-bottom:0;
}
.choice-card,
.choice-card+.choice-card{
  padding:28px 30px;
  border:1px solid var(--line);
  border-radius:5px;
  background:rgba(244,240,232,.62);
}
.choice-card+.choice-card{border-left:1px solid var(--line)}
.choice-card .btn{min-width:174px}
.choice-microcopy{max-width:310px}

/* Why this matters: evidence first, then the shared operating pattern. */
.evidence-intro{max-width:820px;margin-left:auto;margin-right:auto}
.evidence-intro .h2{max-width:760px}
.evidence-lede{max-width:720px;margin:18px 0 0}
.scenario-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:42px;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
.scenario-card{
  min-height:190px;
  padding:24px 26px 26px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:rgba(255,254,252,.20);
}
.scenario-label{
  margin:0 0 18px;
  color:var(--blue);
  font-size:10px;
  font-weight:760;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.scenario-card h3{
  max-width:430px;
  margin:0 0 12px;
  font-size:20px;
  line-height:1.22;
  letter-spacing:-.018em;
  font-weight:650;
}
.scenario-card p:last-child{
  max-width:470px;
  margin:0;
  color:var(--ink68);
  font-size:14px;
  line-height:1.58;
}
.pattern-synthesis{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:58px;
  margin-top:46px;
  padding-top:36px;
  border-top:1px solid var(--line);
}
.pattern-statement .h3{max-width:430px}
.pattern-copy>p{
  margin:0 0 17px;
  color:var(--ink82);
  font-size:15.5px;
  line-height:1.65;
}
.pattern-copy .control-dimensions{margin-top:24px}
.evidence-conclusion{margin-top:58px}
.evidence-conclusion .editorial-quote{max-width:940px}
.evidence-conclusion .body{margin-top:22px!important}

/* Inspection matrix: less feature-card, more diagnostic reference surface. */
.area-grid{
  border:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.area-card{
  min-height:238px;
  padding:24px 26px 28px 0;
  border:0;
  border-right:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background:transparent;
}
.area-card:nth-child(3n+2){padding-left:26px}
.area-card:nth-child(3n){padding-left:26px;padding-right:0;border-right:0}
.area-card:nth-child(n+4){border-bottom:0}
.area-num{
  margin-bottom:28px;
  font-family:var(--sans);
  font-size:10px;
  font-weight:760;
  letter-spacing:.12em;
}
.area-card h3{font-size:20px;line-height:1.18}
.area-question{font-size:13.5px;line-height:1.5}
.area-card p{font-size:12.75px;line-height:1.58}

/* Structured dark footer: a deliberate endpoint, not another content panel. */
.footer.footer-structured{
  padding:48px 0 24px;
  border-top:0;
  background:var(--ink);
  color:rgba(255,254,252,.78);
}
.footer-structured .footer-grid{
  display:grid;
  grid-template-columns:minmax(280px,1.7fr) minmax(150px,.65fr) minmax(150px,.65fr);
  gap:56px;
  align-items:start;
}
.footer-structured .brand img{
  width:118px;
  max-width:118px;
  filter:brightness(0) invert(1);
  opacity:.96;
}
.footer-brand-block p{
  max-width:310px;
  margin:18px 0 0;
  color:rgba(255,254,252,.58);
  font-size:13px;
  line-height:1.55;
}
.footer-group{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.footer-group a{
  color:rgba(255,254,252,.68);
  font-size:12.5px;
  line-height:1.4;
  text-decoration:none;
}
.footer-group a:hover,.footer-group a:focus-visible{color:#fff}
.footer-heading{
  margin:0 0 4px;
  color:rgba(255,254,252,.92);
  font-size:10px;
  font-weight:760;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:28px;
  margin-top:42px;
  padding-top:20px;
  border-top:1px solid rgba(170,180,184,.22);
  color:rgba(255,254,252,.46);
  font-size:10.5px;
  line-height:1.4;
}

@media(max-width:920px){
  .process-panel{max-width:620px}
  .pattern-synthesis{grid-template-columns:1fr;gap:24px}
  .pattern-statement .h3{max-width:620px}
  .footer-structured .footer-grid{grid-template-columns:1.4fr .8fr .8fr;gap:34px}
}

@media(max-width:660px){
  .process-panel{padding:24px 22px 22px}
  .choice-grid{gap:14px}
  .choice-card,.choice-card+.choice-card{padding:25px 22px}
  .choice-card+.choice-card{border-top:1px solid var(--line)}
  .choice-card .btn{width:100%;min-width:0}
  .scenario-grid{grid-template-columns:1fr}
  .scenario-card{min-height:0;padding:22px 20px 24px}
  .evidence-intro{margin:0}
  .pattern-synthesis{margin-top:38px;padding-top:30px}
  .evidence-conclusion{margin-top:44px}
  .area-grid{grid-template-columns:1fr}
  .area-card,
  .area-card:nth-child(3n+2),
  .area-card:nth-child(3n){
    padding:24px 0;
    border-right:0;
    border-bottom:1px solid var(--line-soft);
  }
  .area-card:last-child{border-bottom:0}
  .area-card:nth-child(n+4){border-bottom:1px solid var(--line-soft)}
  .area-card:last-child{border-bottom:0}
  .footer.footer-structured{padding-top:38px}
  .footer-structured .footer-grid{grid-template-columns:1fr;gap:30px}
  .footer-bottom{flex-direction:column;gap:8px;margin-top:34px}
}
/* End Phase 2 Composition Synthesis v5 */

/* v5 responsive inspection-matrix correction for the inherited 2-column tablet grid. */
@media (min-width:661px) and (max-width:920px){
  .area-card,
  .area-card:nth-child(3n+2),
  .area-card:nth-child(3n){
    padding:24px 24px 26px 0;
    border-right:1px solid var(--line-soft);
    border-bottom:1px solid var(--line-soft);
  }
  .area-card:nth-child(even){padding-left:24px;padding-right:0;border-right:0}
  .area-card:nth-child(n+5){border-bottom:0}
}

/* Phase 2 Entry Fold + Decision Visibility v6
   Purpose: make the two-path decision architecture visible sooner on common
   laptop viewports, reduce hero visual dominance, and turn the process panel
   into a connected journey without changing approved copy, routes, or buyer agency. */

/* The journey should read as movement through connected control points, not a list. */
.process-list{position:relative}
.process-list::before{
  content:"";
  position:absolute;
  z-index:0;
  left:7px;
  top:19px;
  bottom:19px;
  width:1px;
  background:repeating-linear-gradient(
    to bottom,
    rgba(63,111,143,.90) 0 12px,
    rgba(63,111,143,.90) 12px 13px,
    rgba(63,111,143,.20) 13px 17px
  );
  pointer-events:none;
}
.process-step{z-index:1}
.process-step::before,
.process-step.break::before{
  position:relative;
  z-index:2;
  box-shadow:0 0 0 4px var(--ink);
}

/* Keep the key question strong without making the entire sentence visually heavy. */
.hero .lede strong{font-weight:650}

/* Bring the real Learn / Check decision closer to the first viewport. */
.start-section{padding-top:52px}

@media(min-width:921px){
  /* Remove inherited viewport-filling behavior. Let the approved content set the hero height. */
  .hero{
    min-height:0;
    padding:28px 0 30px;
  }
  .hero-grid{
    grid-template-columns:minmax(0,1.16fr) minmax(400px,.84fr);
    gap:44px;
    align-items:center;
  }
  .hero .display{
    max-width:670px;
    font-size:clamp(46px,4.05vw,52px);
    line-height:1.02;
    letter-spacing:-.045em;
  }
  .hero .lede{
    max-width:670px;
    margin-top:15px;
    font-size:16.5px;
    line-height:1.52;
  }
  .hero-note{
    max-width:640px;
    margin-top:12px;
    font-size:13px;
    line-height:1.52;
  }

  /* Reduce the dark module's footprint while strengthening the journey signal. */
  .process-panel{
    padding:22px 26px 20px;
  }
  .process-label{
    margin-bottom:11px;
    font-size:10px;
  }
  .process-step{
    min-height:37px;
    font-size:13px;
  }
}

/* Common 768px-class laptop screens need a slightly tighter first fold. */
@media(min-width:921px) and (max-height:760px){
  .hero{padding:22px 0 24px}
  .hero-grid{gap:40px}
  .hero .display{font-size:clamp(45px,3.85vw,50px);max-width:680px}
  .hero .lede{margin-top:13px;font-size:16px;line-height:1.49}
  .hero-note{margin-top:10px;line-height:1.48}
  .process-panel{padding:18px 24px 17px}
  .process-step{min-height:34px;font-size:12.75px}
  .process-list::before{top:17px;bottom:17px}
  .start-section{padding-top:30px}
  .start-section .choice-head{max-width:100%;margin-bottom:14px}
  .start-section .choice-head .body{margin-top:8px;font-size:14px;line-height:1.45}
}

@media(min-width:661px) and (max-width:920px){
  .hero{min-height:0}
  .hero-grid{gap:30px}
  .process-panel{
    width:100%;
    max-width:680px;
    padding:18px 20px 17px;
  }
  .process-label{margin-bottom:10px}
  .process-list{
    display:flex;
    flex-wrap:wrap;
    gap:8px 0;
    padding-top:12px;
  }
  .process-list::before{display:none}
  .process-step{
    display:inline-flex;
    align-items:center;
    width:auto;
    min-height:24px;
    border-bottom:0;
    font-size:12.5px;
  }
  .process-step::before,
  .process-step.break::before{
    width:5px;
    height:5px;
    margin:0 7px 0 0;
    box-shadow:none;
    flex:0 0 auto;
  }
  .process-step:not(:last-child)::after{
    content:"→";
    margin:0 10px;
    color:rgba(170,180,184,.62);
    font-weight:500;
  }
  .start-section{padding-top:44px}
}

@media(max-width:660px){
  /* The journey is supporting context, not unique content. On narrow screens,
     remove the secondary visual so Learn / Check agency arrives sooner. */
  .hero{min-height:0;padding:36px 0 38px}
  .hero-grid{gap:0}
  .process-panel{display:none}
  .start-section{padding-top:36px}
}
/* End Phase 2 Entry Fold + Decision Visibility v6 */

/* Phase 2 Editorial UX + Reading Experience v8
   Purpose: improve the explanatory value of the Entry journey, make the
   long-form Field Guide easier to orient and read, strengthen editorial
   distinctions, and give the Snapshot bridge slightly more decision weight.
   Approved offer logic, copy hierarchy, routes, and Check behavior remain intact. */

/* Entry journey: make movement—not rows—the dominant visual grammar. */
@media(min-width:921px){
  .process-list{
    border-top:0;
  }
  .process-list::before{
    display:none;
  }
  .process-step{
    border-bottom:0;
  }
  .process-step:not(:last-child)::after{
    content:"";
    position:absolute;
    left:7px;
    top:50%;
    width:1px;
    height:100%;
    background:rgba(63,111,143,.72);
    pointer-events:none;
  }
  .process-step:nth-child(3)::after,
  .process-step:nth-child(5)::after{
    background:repeating-linear-gradient(
      to bottom,
      rgba(63,111,143,.72) 0 4px,
      rgba(63,111,143,.16) 4px 9px
    );
  }
}

/* Field Guide: the rail was already sticky; add location awareness and keep
   the reading column closer to an editorial measure on desktop. */
.guide-index a{
  position:relative;
  transition:color .15s ease,font-weight .15s ease;
}
.guide-index a.is-active,
.guide-index a[aria-current="location"]{
  color:var(--ink);
  font-weight:700;
}
.guide-index a.is-active::before,
.guide-index a[aria-current="location"]::before{
  content:"";
  position:absolute;
  left:-13px;
  top:50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--blue);
  transform:translateY(-50%);
}

@media(min-width:921px){
  .guide-shell{
    grid-template-columns:220px minmax(0,700px);
    gap:76px;
  }
  .guide-index{
    max-height:calc(100svh - 118px);
    overflow:auto;
    padding-right:12px;
    scrollbar-width:thin;
    scrollbar-color:rgba(170,180,184,.58) transparent;
  }
  .guide-section>.body,
  .guide-section>p.body{
    max-width:660px;
  }
  .guide-section .h2{
    max-width:680px;
  }
}

/* Editorial primitives: principles, diagnostic questions, and structured
   modules should not all read as the same paragraph rhythm. */
.pullquote{
  max-width:680px;
  margin:34px 0;
  padding:4px 0 4px 24px;
  border-top:0;
  border-bottom:0;
  border-left:2px solid rgba(63,111,143,.68);
}
.leak-question{
  max-width:620px;
  padding-left:16px;
  border-left:2px solid rgba(63,111,143,.34);
  color:var(--ink82);
}
.reframe{
  border-left-width:2px;
}
.check-bridge{
  border:1px solid var(--line);
  border-top:2px solid rgba(63,111,143,.56);
  background:rgba(244,240,232,.72);
}

/* The paid diagnostic remains restrained, but should read as a distinct
   decision boundary rather than another paragraph in the section. */
.snapshot-price{
  margin-top:26px;
  padding:18px 20px;
  border:1px solid var(--line);
  border-left:2px solid var(--blue);
  background:rgba(255,254,252,.48);
}
.snapshot-price strong{
  margin-bottom:6px;
  font-size:18.5px;
  line-height:1.32;
}
.snapshot-action{
  margin-top:18px;
}

/* Small but meaningful scan improvements. */
.area-card p{font-size:13.25px;line-height:1.60}
.area-question{font-size:13.75px;line-height:1.52}
.choice-microcopy{font-size:13px!important}

@media(max-width:660px){
  .pullquote{
    padding-left:18px;
  }
  .leak-question{
    padding-left:13px;
  }
  .snapshot-price{
    padding:17px 16px;
  }
}
/* End Phase 2 Editorial UX + Reading Experience v8 */

/* Phase 2 Snapshot Value Resolution + Readability v9
   Purpose: make the paid diagnostic's decision value concrete and raise
   reading sizes where the content carries meaning, while preserving the
   established hierarchy, first-fold behavior, routes, and restrained visual system. */

/* Readability foundation: body/support copy gets more breathing room; labels
   remain compact because they are short navigational or categorical cues. */
:root{
  --p2-body:17px;
  --p2-small:14px;
}
.body{font-size:17px;line-height:1.70}
.small{font-size:14px;line-height:1.58}
.nav-links{font-size:14px}
.nav-links .nav-cta,.btn{font-size:14px}
.hero .lede{font-size:17.5px;line-height:1.58}
.hero-note{font-size:14px;line-height:1.60}
.choice-card > p:not(.choice-microcopy){font-size:15.5px;line-height:1.62}
.choice-card ul{font-size:14.5px;line-height:1.64}
.choice-microcopy{font-size:13.5px!important;line-height:1.55!important}
.scenario-card p:last-child{font-size:14.5px;line-height:1.62}
.pattern-copy>p{font-size:16px;line-height:1.68}
.control-dimensions li{font-size:12.5px;line-height:1.40}
.definition-copy p{font-size:17px;line-height:1.70}
.area-question{font-size:14.5px;line-height:1.56}
.area-card p{font-size:14px;line-height:1.64}
.fit-panel ul{font-size:15px;line-height:1.66}
.snapshot-copy{font-size:17px;line-height:1.70}
.about-points{font-size:14px;line-height:1.58}
.operating-lens-table{font-size:14.5px;line-height:1.54}
.footer-brand-block p{font-size:13.5px;line-height:1.58}
.footer-group a{font-size:13.5px;line-height:1.45}
.footer-bottom{font-size:11.5px;line-height:1.45}

/* Long-form reading: comfortably readable without flattening the hierarchy. */
.guide-article .body{font-size:17.5px;line-height:1.74}
.guide-index a{font-size:12.5px;line-height:1.45}
.mobile-index summary{font-size:14px}
.mobile-index a{font-size:13.5px;line-height:1.45}
.signals{font-size:15.5px;line-height:1.66}
.reframe{font-size:15px;line-height:1.64}
.mis-reframe{font-size:15px;line-height:1.64}
.check-bridge p{font-size:16px;line-height:1.66}
.example-questions{font-size:14px;line-height:1.58}
.trace-row strong,.trace-row span{font-size:14.5px;line-height:1.60}
.tech-sequence div{font-size:13px;line-height:1.4}
.reference-row strong{font-size:11.5px}
.reference-row span{font-size:17.5px;line-height:1.48}
.boundary-col h3{font-size:18px;line-height:1.35}
.boundary-col ul{font-size:14.5px;line-height:1.62}

/* Snapshot: sell decision clarity rather than a list of deliverable features. */
.snapshot-resolution{
  margin-top:24px;
  padding:18px 0 4px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line-soft);
}
.snapshot-resolution-label{
  margin:0 0 13px!important;
  color:var(--ink);
  font-size:15px;
  line-height:1.4;
  font-weight:720;
}
.snapshot-resolution ul{
  list-style:none;
  margin:0;
  padding:0;
}
.snapshot-resolution li{
  position:relative;
  margin:0;
  padding:12px 0 12px 22px;
  border-top:1px solid var(--line-soft);
  color:var(--ink82);
  font-size:15px;
  line-height:1.60;
}
.snapshot-resolution li:first-child{border-top:0}
.snapshot-resolution li::before{
  content:"";
  position:absolute;
  left:2px;
  top:1.48em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--blue);
}
.snapshot-resolution li strong{color:var(--ink);font-weight:700}
.snapshot-resolution-guide{max-width:660px;margin-top:30px}
.snapshot-outcome-note{max-width:660px;margin-top:26px!important}
.snapshot-price{margin-top:24px}
.snapshot-price strong{font-size:19px;line-height:1.34}
.snapshot-price .small{display:block;margin-top:2px}

@media(max-width:920px){
  .guide-article .body{font-size:17px}
  .operating-lens-table{font-size:14px}
}

@media(max-width:660px){
  .body{font-size:16.5px;line-height:1.70}
  .small{font-size:13.5px}
  .hero .lede{font-size:17px}
  .hero-note{font-size:13.5px}
  .choice-card > p:not(.choice-microcopy){font-size:15.5px}
  .choice-card ul{font-size:14.5px}
  .scenario-card p:last-child{font-size:14.5px}
  .area-question{font-size:14.5px}
  .area-card p{font-size:14px}
  .guide-article .body{font-size:17px;line-height:1.72}
  .signals{font-size:15.25px}
  .reframe,.mis-reframe{font-size:14.5px}
  .boundary-col ul{font-size:14px}
  .snapshot-resolution{margin-top:22px;padding-top:16px}
  .snapshot-resolution-label{font-size:14.5px}
  .snapshot-resolution li{font-size:14.5px;line-height:1.58;padding-left:20px}
  .snapshot-price strong{font-size:18.5px}
}
/* End Phase 2 Snapshot Value Resolution + Readability v9 */


/* Phase 2 Typography System + Journey Cohesion v10
   Purpose: replace ad-hoc body-size drift with a compact semantic type scale,
   keep reading text comfortably legible without flattening hierarchy, and
   turn the Field Guide journey into a connected full-path orientation model.
   Major heading scale, v6 first-fold geometry, v9 Snapshot value resolution,
   routes, and diagnostic logic remain unchanged. */

:root{
  --vz-type-editorial:17px;
  --vz-type-body:16px;
  --vz-type-support:14.5px;
  --vz-type-micro:13px;
  --vz-type-label:11.5px;
  --vz-type-button:14px;
}

/* Semantic reading roles. */
.body{font-size:var(--vz-type-body);line-height:1.68}
.small{font-size:var(--vz-type-micro);line-height:1.56}
.btn,.nav-links,.nav-links .nav-cta{font-size:var(--vz-type-button)}
.eyebrow,.chapter,.choice-tag,.process-label,.guide-index-title,.signal-title,
.scenario-label,.control-dimensions-label,.operating-lens-table thead th{
  font-size:var(--vz-type-label);
}
.hero .lede{font-size:17px;line-height:1.56}
.hero-note{font-size:var(--vz-type-support);line-height:1.58}
.choice-card > p:not(.choice-microcopy){font-size:var(--vz-type-body);line-height:1.64}
.choice-card ul{font-size:var(--vz-type-support);line-height:1.64}
.choice-microcopy{font-size:var(--vz-type-micro)!important;line-height:1.55!important}
.scenario-card p:last-child{font-size:var(--vz-type-support);line-height:1.62}
.pattern-copy>p,.definition-copy p{font-size:var(--vz-type-body);line-height:1.68}
.control-dimensions li{font-size:var(--vz-type-micro);line-height:1.40}
.area-question,.area-card p{font-size:var(--vz-type-support);line-height:1.60}
.fit-panel ul{font-size:var(--vz-type-body);line-height:1.66}
.snapshot-copy{font-size:var(--vz-type-body);line-height:1.68}
.about-points,.operating-lens-table{font-size:var(--vz-type-support);line-height:1.56}
.footer-brand-block p,.footer-group a{font-size:var(--vz-type-micro)}

/* Field Guide: editorial prose has one clearly defined reading tier. */
.guide-article .body{font-size:var(--vz-type-editorial);line-height:1.72}
.guide-index a{font-size:var(--vz-type-micro);line-height:1.44}
.mobile-index summary{font-size:var(--vz-type-support)}
.mobile-index a{font-size:var(--vz-type-support);line-height:1.45}
.signals,.reframe,.mis-reframe,.check-bridge p{font-size:var(--vz-type-body);line-height:1.64}
.example-questions,.trace-row strong,.trace-row span,.boundary-col ul{
  font-size:var(--vz-type-support);line-height:1.60;
}
.tech-sequence div,.reference-row strong{font-size:var(--vz-type-micro)}
.reference-row span{font-size:var(--vz-type-editorial);line-height:1.48}
.boundary-col h3{font-size:18px;line-height:1.34}

/* Full Field Guide journey: one connected path, grouped only to aid memory. */
.journey.journey-rail{
  width:min(100%,620px);
  margin:34px 0 0;
  padding:0;
  border:0;
}
.journey-label{
  margin:0 0 18px;
  color:var(--ink);
  font-size:var(--vz-type-label);
  line-height:1.35;
  font-weight:760;
  letter-spacing:.115em;
  text-transform:uppercase;
}
.journey-track{
  position:relative;
  padding:4px 0 2px;
}
.journey-track::before{
  content:"";
  position:absolute;
  left:50px;
  top:42px;
  bottom:22px;
  width:1px;
  background:var(--line);
  pointer-events:none;
}
.journey-phase-label{
  position:relative;
  z-index:1;
  margin:24px 0 8px 72px;
  color:var(--blue);
  font-size:var(--vz-type-label);
  line-height:1.35;
  font-weight:760;
  letter-spacing:.115em;
  text-transform:uppercase;
  background:var(--paper);
}
.journey-phase-label:first-child{margin-top:0}
.journey-row{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:34px 32px minmax(0,1fr);
  align-items:center;
  min-height:47px;
  padding:0;
  border:0;
  font-size:inherit;
  font-weight:inherit;
}
.journey-row:last-child{border:0}
.journey-num,
.journey-row span:first-child{
  font-family:var(--sans);
  color:var(--blue);
  font-size:var(--vz-type-micro);
  line-height:1;
  font-weight:720;
  letter-spacing:.02em;
}
.journey-node{
  position:relative;
  justify-self:center;
  width:9px;
  height:9px;
  border:2px solid var(--paper);
  border-radius:50%;
  background:var(--blue);
  box-shadow:0 0 0 1px rgba(63,111,143,.32);
}
.journey-name{
  color:var(--ink);
  font-size:var(--vz-type-body);
  line-height:1.35;
  font-weight:680;
}

/* The hero uses a deliberately simplified set of key control points. */
.process-label{font-size:var(--vz-type-label)}
.process-step{font-size:13.5px}

@media(max-width:920px){
  .guide-article .body{font-size:16.5px}
  .journey.journey-rail{width:min(100%,590px)}
}

@media(max-width:660px){
  :root{
    --vz-type-editorial:16.5px;
    --vz-type-body:16px;
    --vz-type-support:14.5px;
    --vz-type-micro:13px;
    --vz-type-label:11.5px;
  }
  .body{font-size:var(--vz-type-body);line-height:1.68}
  .small{font-size:var(--vz-type-micro)}
  .hero .lede{font-size:16.5px;line-height:1.56}
  .hero-note{font-size:var(--vz-type-support)}
  .guide-article .body{font-size:var(--vz-type-editorial);line-height:1.70}
  .signals,.reframe,.mis-reframe,.check-bridge p{font-size:var(--vz-type-body)}
  .journey.journey-rail{width:100%;margin-top:30px}
  .journey-track::before{left:45px;top:40px;bottom:21px}
  .journey-phase-label{margin-left:66px;margin-top:22px}
  .journey-row{grid-template-columns:30px 30px minmax(0,1fr);min-height:46px}
  .journey-name{font-size:var(--vz-type-body)}
}
/* End Phase 2 Typography System + Journey Cohesion v10 */

/* Phase 2 Editorial Detail + Decision Emphasis v11
   Purpose: improve scanability where prose is inherently list-like, strengthen
   the full-journey flow signal without implying a diagnosis, and make the paid
   Snapshot boundary easier to notice through warm neutral contrast—not urgency.
   v10 typography roles and eyebrow sizing remain unchanged. */

:root{
  --bone-warm:#EEE6D9;
  --journey-rail:rgba(63,111,143,.38);
}

/* List-like examples should scan as examples rather than masquerade as prose. */
.guide-section .body .operating-examples{
  max-width:660px;
  margin:22px 0 24px;
  padding-left:23px;
  color:var(--ink82);
}
.guide-section .body .operating-examples li{
  margin:8px 0;
  padding-left:2px;
  line-height:1.62;
}
.guide-section .body .operating-examples li::marker{
  color:var(--blue);
  font-size:.86em;
}

/* Keep eyebrows compact. Their job is orientation, not primary reading. */
.eyebrow{font-size:var(--vz-type-label)}

/* Full journey: clearer continuity and grouping, still one neutral process. */
.journey.journey-rail{
  width:min(100%,640px);
}
.journey-label{
  margin-bottom:20px;
}
.journey-track::before{
  left:50px;
  top:45px;
  bottom:23px;
  width:2px;
  background:var(--journey-rail);
}
.journey-phase-label{
  display:flex;
  align-items:center;
  gap:12px;
  width:calc(100% - 72px);
  margin:28px 0 9px 72px;
  background:transparent;
}
.journey-phase-label::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:var(--line-soft);
}
.journey-phase-label:first-child{margin-top:0}
.journey-row{
  min-height:49px;
}
.journey-node{
  width:10px;
  height:10px;
  border-width:2px;
  box-shadow:0 0 0 1px rgba(63,111,143,.40);
}

/* Paid diagnostic: warm neutral separation, not an alert or promo treatment. */
.snapshot-price{
  margin-top:26px;
  padding:20px 22px;
  border:1px solid rgba(126,139,145,.38);
  border-left:3px solid var(--blue);
  background:var(--bone-warm);
}
.snapshot-price strong{
  margin-bottom:6px;
}
.snapshot-price .small{
  color:var(--ink68);
}

@media(max-width:660px){
  .guide-section .body .operating-examples{
    margin:19px 0 22px;
    padding-left:21px;
  }
  .journey.journey-rail{width:100%}
  .journey-track::before{left:45px;top:43px;bottom:22px}
  .journey-phase-label{
    width:calc(100% - 66px);
    margin-left:66px;
    margin-top:24px;
  }
  .journey-row{min-height:48px}
  .snapshot-price{padding:18px 17px}
}
/* End Phase 2 Editorial Detail + Decision Emphasis v11 */


/* Phase 2 Field Guide PDF Capture v12
   Optional identity capture without gating the open web guide. */
.pdf-inline-trigger{
  display:inline;
  border:0;
  background:transparent;
  color:var(--blue);
  padding:0;
  margin:0;
  font:inherit;
  font-weight:650;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  cursor:pointer;
}
.pdf-inline-trigger:hover{text-decoration-thickness:2px}
.pdf-inline-trigger:focus-visible{outline:3px solid rgba(63,111,143,.24);outline-offset:3px}
.pdf-utility{
  grid-column:2;
  grid-row:5;
  margin:7px 0 0;
  color:var(--ink68);
  font-size:var(--vz-type-support);
  line-height:1.55;
}
.pdf-save-strip{
  margin-top:34px;
  padding:24px 26px;
  border:1px solid var(--line);
  background:rgba(244,240,232,.54);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:center;
}
.pdf-save-strip .eyebrow{margin-bottom:7px}
.pdf-save-strip .h3{margin-bottom:7px}
.pdf-save-strip .body{margin:0;max-width:610px}
.pdf-save-strip .btn{white-space:nowrap}

.pdf-dialog{
  width:min(520px,calc(100% - 32px));
  max-height:min(720px,calc(100vh - 32px));
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  overflow:visible;
}
.pdf-dialog::backdrop{background:rgba(31,37,40,.62)}
.pdf-dialog-card{
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  border-top:3px solid var(--blue);
  padding:34px 34px 32px;
  box-shadow:0 24px 70px rgba(31,37,40,.20);
  max-height:min(760px,calc(100vh - 32px));
  overflow:auto;
}
.pdf-dialog-close{
  position:absolute;
  top:14px;
  right:15px;
  width:44px;
  height:44px;
  border:0;
  background:transparent;
  color:var(--ink68);
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.pdf-dialog-close:hover{color:var(--ink)}
.pdf-dialog .h2{font-size:30px;line-height:1.12;margin-bottom:13px;max-width:430px}
.pdf-dialog-intro{margin-bottom:21px;max-width:430px}
.pdf-form-grid{display:grid;grid-template-columns:1fr;gap:14px}
.pdf-field{display:flex;flex-direction:column;gap:7px;font-size:var(--vz-type-support);font-weight:650}
.pdf-field em{font-style:normal;font-weight:500;color:var(--ink68)}
.pdf-field input{
  min-height:46px;
  width:100%;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  padding:10px 12px;
  font-family:inherit;
  font-size:16px;
}
.pdf-field input:focus{border-color:var(--blue);outline:3px solid rgba(63,111,143,.14);outline-offset:1px}
.pdf-consent{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:10px;
  align-items:start;
  margin-top:18px;
  color:var(--ink82);
  font-size:var(--vz-type-support);
  line-height:1.55;
}
.pdf-consent input{width:17px;height:17px;margin:2px 0 0;accent-color:var(--blue)}
.pdf-form-note{margin:12px 0 0;color:var(--ink68);font-size:var(--vz-type-micro);line-height:1.55}
.pdf-form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:23px}
.pdf-form-status{min-height:20px;margin-top:13px;font-size:var(--vz-type-support);line-height:1.5;color:var(--ink68)}
.pdf-form-status[data-state="error"]{color:#7a3028}
.pdf-request-success .h3{margin-bottom:9px}
.pdf-request-success .body{margin-bottom:22px}

@media(max-width:900px){
  .pdf-utility{grid-column:auto;grid-row:auto;margin-top:13px}
}
@media(max-width:660px){
  .pdf-save-strip{grid-template-columns:1fr;gap:18px;padding:22px 20px}
  .pdf-save-strip .btn{width:100%;white-space:normal}
  .pdf-dialog-card{padding:30px 20px 24px}
  .pdf-form-grid{grid-template-columns:1fr}
  .pdf-form-actions{display:grid;grid-template-columns:1fr}
  .pdf-form-actions .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .pdf-dialog::backdrop{transition:none}
}
/* End Phase 2 Field Guide PDF Capture v12 */

/* v16.6.5 polish: make the practical observation exercise easier to find. */
.guide-article #follow-one{
  position:relative;
}
.guide-article #follow-one::before{
  content:"";
  display:block;
  width:52px;
  height:2px;
  margin-bottom:20px;
  background:var(--blue);
}
.guide-article #follow-one .trace{
  border-top:2px solid var(--blue);
}
.guide-article #follow-one .pullquote{
  padding-left:22px;
  border-left:3px solid var(--blue);
}
@media(max-width:660px){
  .guide-article #follow-one::before{margin-bottom:16px}
  .guide-article #follow-one .pullquote{padding-left:18px}
}
