@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');

:root{
  /* CARTOGRAPHIC ATLAS SYSTEM */
  --paper:#efe6d5;
  --paper-deep:#e3d4bd;
  --paper-light:#f8f2e8;
  --ink:#171a17;
  --ink-soft:#353a34;
  --muted:#66685f;
  --faint:#8d8a80;
  --route:#d64b2a;
  --route-dark:#a9351d;
  --survey:#214e67;
  --survey-soft:#c9d8dd;
  --field:#59664c;
  --field-soft:#d7ddcf;
  --signal:#e1b34b;
  --line:#b9aa92;
  --line-dark:#877a66;
  --danger:#9e2f2f;
  --white:#fffdf8;

  --display:"Instrument Serif","Times New Roman",serif;
  --body:"IBM Plex Sans","Segoe UI",Arial,sans-serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;

  --space-1:.35rem;
  --space-2:.6rem;
  --space-3:.9rem;
  --space-4:1.25rem;
  --space-5:1.75rem;
  --space-6:2.5rem;
  --space-7:3.5rem;
  --space-8:5rem;
  --space-9:7rem;

  --radius-xs:2px;
  --radius-sm:4px;
  --radius-md:8px;

  --shadow-paper:0 18px 50px rgba(43,36,27,.12);
  --shadow-lift:0 24px 60px rgba(43,36,27,.16);
  --max:1200px;

  --contours:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='420' viewBox='0 0 640 420'%3E%3Cg fill='none' stroke='%23214e67' stroke-opacity='.17' stroke-width='1.2'%3E%3Cpath d='M-60 78C52 4 124 118 244 63s196-1 287 49 160-9 210-62'/%3E%3Cpath d='M-55 105C67 31 141 144 258 91s191-4 280 43 153-14 202-67'/%3E%3Cpath d='M-45 138C82 63 155 174 271 121s184-3 271 43 145-17 194-70'/%3E%3Cpath d='M-35 174C95 98 167 207 282 154s180-2 265 45 139-15 189-66'/%3E%3Cpath d='M-18 212C107 139 180 245 296 191s175 0 258 47 135-10 184-60'/%3E%3Cpath d='M1 254C122 182 195 286 312 232s171 5 252 51 131-4 181-51'/%3E%3Cpath d='M24 299C140 229 214 329 333 277s169 12 248 56 127 2 178-43'/%3E%3Cpath d='M52 347C163 280 239 374 359 324s168 19 246 61 126 9 177-32'/%3E%3C/g%3E%3C/svg%3E");

  --route-map:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 460 520'%3E%3Cpath d='M63 466C52 392 108 354 164 345s78-41 57-84 5-90 73-102 88-55 54-116' fill='none' stroke='%23d64b2a' stroke-width='5' stroke-linecap='square' stroke-dasharray='1 16'/%3E%3Cpath d='M353 40l-4 29-27-5' fill='none' stroke='%23171a17' stroke-width='4' stroke-linecap='square'/%3E%3Cg fill='%23efe6d5' stroke='%23171a17' stroke-width='3'%3E%3Crect x='53' y='456' width='20' height='20' transform='rotate(45 63 466)'/%3E%3Crect x='154' y='335' width='20' height='20' transform='rotate(45 164 345)'/%3E%3Crect x='284' y='149' width='20' height='20' transform='rotate(45 294 159)'/%3E%3C/g%3E%3C/svg%3E");
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  background:var(--paper);
  color-scheme:light;
}

body{
  margin:0;
  min-height:100vh;
  font-family:var(--body);
  color:var(--ink);
  background:
    linear-gradient(rgba(23,26,23,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(23,26,23,.025) 1px,transparent 1px),
    radial-gradient(circle at 16% 10%,rgba(225,179,75,.16),transparent 22rem),
    radial-gradient(circle at 90% 38%,rgba(33,78,103,.08),transparent 27rem),
    var(--paper);
  background-size:28px 28px,28px 28px,auto,auto,auto;
  line-height:1.65;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.28;
  background:
    radial-gradient(circle at 20% 20%,rgba(23,26,23,.05) 0 1px,transparent 1.2px) 0 0/13px 13px,
    radial-gradient(circle at 70% 50%,rgba(23,26,23,.035) 0 .8px,transparent 1px) 0 0/17px 17px;
  mix-blend-mode:multiply;
}

::selection{
  background:var(--signal);
  color:var(--ink);
}

a{
  color:inherit;
  text-underline-offset:.22em;
}

button,input,textarea{
  font:inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible{
  outline:3px solid rgba(214,75,42,.36);
  outline-offset:3px;
}

.wrap{
  width:min(100%,var(--max));
  margin-inline:auto;
  padding-inline:24px;
}

#how,#for-you,#offer{
  scroll-margin-top:96px;
}

/* WAYFINDING HEADER */
body[data-page="landing"] > .wrap:first-child{
  position:sticky;
  top:0;
  z-index:100;
  width:100%;
  max-width:none;
  padding:0;
  background:rgba(239,230,213,.91);
  border-bottom:1px solid rgba(135,122,102,.55);
  backdrop-filter:blur(15px);
}

body[data-page="landing"] > .wrap:first-child::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  height:5px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 28px,
      rgba(33,78,103,.22) 28px 29px
    );
  pointer-events:none;
}

body[data-page="landing"] > .wrap:first-child .nav{
  width:min(100%,var(--max));
  margin-inline:auto;
  padding-inline:24px;
}

.nav{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  color:var(--ink);
  font-family:var(--mono);
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.11em;
  text-decoration:none;
  white-space:nowrap;
}

.brand::before{
  content:"";
  width:18px;
  height:18px;
  background:
    linear-gradient(45deg,transparent 46%,var(--route) 46% 54%,transparent 54%),
    linear-gradient(-45deg,transparent 46%,var(--route) 46% 54%,transparent 54%);
  transform:rotate(45deg);
  border:1px solid var(--route);
}

.brand span{
  color:var(--route-dark);
}

.navlinks{
  display:flex;
  align-items:center;
  gap:26px;
  color:var(--muted);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.04em;
}

.navlinks a{
  position:relative;
  text-decoration:none;
  transition:color .2s ease;
}

.navlinks a::before{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-7px;
  height:2px;
  background:var(--route);
  transition:right .25s ease;
}

.navlinks a:hover{
  color:var(--ink);
}

.navlinks a:hover::before{
  right:0;
}

/* WAYFINDING BUTTONS */
.btn{
  appearance:none;
  position:relative;
  min-height:49px;
  padding:13px 26px 13px 18px;
  border:1px solid var(--ink);
  border-radius:0;
  background:var(--ink);
  color:var(--paper-light);
  font-family:var(--mono);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.025em;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%);
  box-shadow:6px 6px 0 var(--signal);
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background-color .2s ease,
    color .2s ease;
}

.btn::after{
  content:"→";
  font-size:.95em;
  transform:translateX(0);
  transition:transform .2s ease;
}

.btn:hover{
  transform:translate(2px,2px);
  background:var(--route-dark);
  color:var(--white);
  box-shadow:3px 3px 0 var(--signal);
}

.btn:hover::after{
  transform:translateX(3px);
}

.btn:active{
  transform:translate(5px,5px);
  box-shadow:0 0 0 var(--signal);
}

.btn.secondary{
  padding:12px 4px 8px;
  background:transparent;
  color:var(--ink);
  border:0;
  border-bottom:1px solid var(--ink);
  clip-path:none;
  box-shadow:none;
}

.btn.secondary::after{
  content:"↗";
}

.btn.secondary:hover{
  background:transparent;
  color:var(--route-dark);
  border-color:var(--route-dark);
  transform:none;
}

.btn.block{
  width:100%;
}

/* HERO — THE FIRST MAP */
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:760px;
  padding:116px 0 104px;
  border-bottom:1px solid var(--line-dark);
}

.hero::before{
  content:"";
  position:absolute;
  inset:0 0 auto auto;
  width:min(54vw,760px);
  height:100%;
  z-index:-2;
  background:
    linear-gradient(90deg,transparent,rgba(248,242,232,.15)),
    var(--contours) right top/cover no-repeat;
  opacity:.72;
}

.hero::after{
  content:"";
  position:absolute;
  right:-80px;
  top:60px;
  width:min(46vw,540px);
  aspect-ratio:1/1.13;
  z-index:-1;
  background:var(--route-map) center/contain no-repeat;
  transform:rotate(2deg);
  filter:drop-shadow(0 18px 25px rgba(43,36,27,.10));
}

.hero .wrap{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);
  column-gap:56px;
  align-items:start;
}

.hero .wrap > *{
  grid-column:1;
}

.hero .wrap::before{
  content:"";
  position:absolute;
  left:-32px;
  top:-26px;
  width:14px;
  height:calc(100% + 54px);
  border-left:1px solid var(--line-dark);
  background:
    repeating-linear-gradient(
      180deg,
      var(--line-dark) 0 1px,
      transparent 1px 27px
    );
  opacity:.65;
}

.hero .wrap::after{
  content:"";
  position:absolute;
  left:-45px;
  top:-6px;
  width:26px;
  height:1px;
  background:var(--route);
  box-shadow:
    0 108px 0 var(--line-dark),
    0 216px 0 var(--line-dark),
    0 324px 0 var(--line-dark);
}

.eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--survey);
  text-transform:uppercase;
  font-family:var(--mono);
  letter-spacing:.12em;
  font-size:.68rem;
  line-height:1.2;
  font-weight:600;
}

.eyebrow::before{
  content:"";
  width:34px;
  height:6px;
  background:
    linear-gradient(90deg,var(--survey) 0 9px,transparent 9px 14px,var(--survey) 14px 23px,transparent 23px 28px,var(--survey) 28px);
}

.hero h1{
  max-width:820px;
  margin:24px 0 30px;
  font-family:var(--display);
  font-size:clamp(4.4rem,7.2vw,8rem);
  font-weight:400;
  line-height:.86;
  letter-spacing:-.052em;
  text-wrap:balance;
}

.hero h1::first-line{
  color:var(--ink);
}

.hero p{
  max-width:610px;
  margin:0;
  color:var(--ink-soft);
  font-size:clamp(1.02rem,1.45vw,1.16rem);
  line-height:1.72;
}

.actions{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:34px;
}

.subnote{
  position:relative;
  max-width:680px;
  margin-top:22px;
  padding:10px 0 0 0;
  border-top:1px dashed var(--line-dark);
  color:var(--muted);
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.025em;
}

/* SHARED SECTION RHYTHM */
.section{
  position:relative;
  padding:var(--space-9) 0;
}

.section h2{
  max-width:780px;
  margin:15px 0 20px;
  font-family:var(--display);
  font-size:clamp(2.9rem,5vw,5.6rem);
  font-weight:400;
  line-height:.93;
  letter-spacing:-.045em;
  text-wrap:balance;
}

.section .lead{
  max-width:690px;
  margin:0 0 44px;
  color:var(--muted);
  font-size:1rem;
  line-height:1.75;
}

.grid{
  display:grid;
  gap:28px;
}

.grid3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.grid2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.card{
  position:relative;
  background:rgba(248,242,232,.5);
  border:1px solid var(--line);
  border-radius:0;
  padding:30px;
  box-shadow:none;
  transition:
    transform .26s ease,
    box-shadow .26s ease,
    border-color .26s ease,
    background-color .26s ease;
}

.card::after{
  content:"";
  position:absolute;
  right:-1px;
  top:-1px;
  width:18px;
  height:18px;
  background:
    linear-gradient(135deg,transparent 48%,var(--line) 49% 53%,var(--paper) 54%);
  pointer-events:none;
}

.card:hover{
  transform:translateY(-5px) rotate(-.18deg);
  border-color:var(--line-dark);
  background:rgba(248,242,232,.82);
  box-shadow:var(--shadow-paper);
}

.card h3{
  margin:0 0 10px;
  font-family:var(--display);
  font-size:1.95rem;
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.025em;
}

.muted{
  color:var(--muted);
}

/* FOR YOU — THREE BRANCHES */
#for-you{
  padding-top:96px;
  padding-bottom:126px;
}

#for-you::before{
  content:"";
  position:absolute;
  left:50%;
  top:48px;
  width:min(100%,1020px);
  height:420px;
  transform:translateX(-50%);
  background:
    linear-gradient(115deg,transparent 49.7%,rgba(135,122,102,.38) 50%,transparent 50.3%) left 48% top 52px/51% 260px no-repeat,
    linear-gradient(65deg,transparent 49.7%,rgba(135,122,102,.38) 50%,transparent 50.3%) right 48% top 52px/51% 260px no-repeat;
  pointer-events:none;
}

#for-you .grid3{
  grid-template-columns:1.12fr .88fr;
  grid-template-areas:
    "a b"
    ". c";
  gap:44px 72px;
  align-items:start;
}

#for-you .card{
  min-height:248px;
  padding:34px 34px 30px 96px;
  background:rgba(248,242,232,.66);
  border:1px solid var(--line);
  box-shadow:8px 8px 0 rgba(33,78,103,.08);
}

#for-you .card:nth-child(1){
  grid-area:a;
  transform:rotate(-.45deg);
}

#for-you .card:nth-child(2){
  grid-area:b;
  margin-top:96px;
  transform:rotate(.55deg);
}

#for-you .card:nth-child(3){
  grid-area:c;
  width:86%;
  margin-top:-10px;
  transform:rotate(-.35deg);
}

#for-you .card:hover{
  transform:translateY(-6px) rotate(0deg);
  box-shadow:12px 16px 0 rgba(33,78,103,.10);
}

.number{
  position:absolute;
  left:24px;
  top:30px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  color:var(--route-dark);
  background:var(--paper-light);
  border:2px solid var(--route);
  font-family:var(--mono);
  font-size:.82rem;
  font-weight:600;
  line-height:1;
  transform:rotate(45deg);
}

.number::first-letter{
  transform:rotate(-45deg);
}

#for-you .number{
  color:transparent;
}

#for-you .card:nth-child(1) .number::before{content:"1"}
#for-you .card:nth-child(2) .number::before{content:"2"}
#for-you .card:nth-child(3) .number::before{content:"3"}

#for-you .number::before{
  position:absolute;
  color:var(--route-dark);
  transform:rotate(-45deg);
}

#for-you .card::before{
  content:"";
  position:absolute;
  left:44px;
  top:72px;
  width:1px;
  height:86px;
  background:
    repeating-linear-gradient(
      180deg,
      var(--route) 0 4px,
      transparent 4px 11px
    );
}

/* HOW IT WORKS — SURVEY ROUTE */
#how{
  overflow:hidden;
  background:
    var(--contours) center/cover no-repeat,
    linear-gradient(180deg,#e5d7c2 0%,#dfd0ba 100%);
  border-block:1px solid var(--line-dark);
}

#how::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(239,230,213,.74),transparent 18%,transparent 82%,rgba(239,230,213,.74));
}

#how .wrap{
  position:relative;
  z-index:1;
}

#how .grid3{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:
    "one ."
    ". two"
    "three .";
  gap:54px 64px;
  margin-top:62px;
}

#how .grid3::before{
  content:"";
  position:absolute;
  left:50%;
  top:22px;
  bottom:22px;
  width:2px;
  background:
    repeating-linear-gradient(
      180deg,
      var(--route) 0 10px,
      transparent 10px 21px
    );
  transform:translateX(-50%);
}

#how .grid3::after{
  content:"";
  position:absolute;
  left:calc(50% - 7px);
  top:calc(50% - 7px);
  width:14px;
  height:14px;
  border:2px solid var(--route);
  background:var(--paper);
  transform:rotate(45deg);
}

#how .card{
  min-height:230px;
  padding:38px 34px 30px 86px;
  border:1px solid var(--line-dark);
  background:rgba(248,242,232,.78);
  box-shadow:10px 12px 0 rgba(89,102,76,.10);
}

#how .card:nth-child(1){grid-area:one}
#how .card:nth-child(2){grid-area:two}
#how .card:nth-child(3){grid-area:three}

#how .card:nth-child(1)::before,
#how .card:nth-child(3)::before{
  content:"";
  position:absolute;
  right:-66px;
  top:56px;
  width:66px;
  border-top:1px dashed var(--line-dark);
}

#how .card:nth-child(2)::before{
  content:"";
  position:absolute;
  left:-66px;
  top:56px;
  width:66px;
  border-top:1px dashed var(--line-dark);
}

#how .number{
  left:24px;
  top:26px;
  color:var(--survey);
  border-color:var(--survey);
  background:var(--paper-light);
}

#how .number::after{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid currentColor;
}

#how .card:hover{
  transform:translateY(-6px) rotate(0deg);
  box-shadow:14px 16px 0 rgba(89,102,76,.12);
}

/* QUOTE — FOLDED MAP NOTE */
main > .section:nth-of-type(4){
  padding-block:126px;
}

main > .section:nth-of-type(4) .wrap{
  max-width:1060px;
}

main > .section:nth-of-type(4) .card{
  position:relative;
  overflow:hidden;
  padding:70px 74px 64px 110px;
  border:1px solid var(--line-dark);
  background:
    linear-gradient(90deg,transparent 49.8%,rgba(135,122,102,.18) 50%,transparent 50.2%),
    linear-gradient(180deg,transparent 49.8%,rgba(135,122,102,.18) 50%,transparent 50.2%),
    var(--contours) center/120% auto no-repeat,
    var(--paper-light);
  box-shadow:var(--shadow-paper);
}

main > .section:nth-of-type(4) .card::before{
  content:"";
  position:absolute;
  left:32px;
  top:30px;
  width:38px;
  height:38px;
  border:2px solid var(--signal);
  transform:rotate(45deg);
  box-shadow:inset 0 0 0 6px var(--paper-light),inset 0 0 0 8px var(--signal);
}

main > .section:nth-of-type(4) .card::after{
  content:"";
  position:absolute;
  right:-34px;
  bottom:-32px;
  width:160px;
  height:160px;
  border:1px solid rgba(33,78,103,.35);
  border-radius:50%;
  box-shadow:
    0 0 0 16px rgba(33,78,103,.08),
    0 0 0 34px rgba(33,78,103,.05);
  background:transparent;
}

main > .section:nth-of-type(4) .card:hover{
  transform:none;
  box-shadow:var(--shadow-lift);
}

.quote{
  max-width:790px;
  font-family:var(--display);
  font-size:clamp(2.6rem,4.8vw,5rem);
  line-height:.98;
  letter-spacing:-.04em;
}

/* OFFER — NIGHT MAP */
#offer{
  overflow:hidden;
  color:var(--paper-light);
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    radial-gradient(circle at 78% 24%,rgba(225,179,75,.14),transparent 20rem),
    #171a17;
  background-size:30px 30px,30px 30px,auto,auto;
  border-top:6px solid var(--signal);
}

#offer::before{
  content:"";
  position:absolute;
  left:0;
  top:84px;
  width:38%;
  height:1px;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(248,242,232,.46) 0 12px,
      transparent 12px 25px
    );
}

#offer .eyebrow{
  color:#8eb5c7;
}

#offer h2,
#offer .lead,
#offer .check{
  color:var(--paper-light);
}

#offer .lead{
  color:#c4c0b5;
}

#offer .grid2{
  grid-template-columns:minmax(0,1.22fr) minmax(340px,.78fr);
  gap:84px;
  align-items:start;
}

#offer .grid2 > div:first-child{
  padding-top:22px;
}

#offer .check{
  position:relative;
  margin:0;
  padding:13px 0 13px 28px;
  border-bottom:1px solid rgba(248,242,232,.16);
  font-family:var(--body);
}

#offer .check::before{
  content:"";
  position:absolute;
  left:1px;
  top:50%;
  width:11px;
  height:11px;
  border:1px solid var(--signal);
  transform:translateY(-50%) rotate(45deg);
}

#offer .grid2 > .card{
  padding:44px 38px 40px;
  border:1px solid var(--paper-light);
  background:var(--paper-light);
  color:var(--ink);
  box-shadow:14px 14px 0 var(--route);
  transform:rotate(.5deg);
}

#offer .grid2 > .card::before{
  content:"";
  position:absolute;
  left:-1px;
  top:30px;
  width:7px;
  height:76px;
  background:
    repeating-linear-gradient(
      180deg,
      var(--survey) 0 8px,
      transparent 8px 14px
    );
}

#offer .grid2 > .card:hover{
  transform:translate(-2px,-4px) rotate(0deg);
  box-shadow:18px 20px 0 var(--route-dark);
}

#offer .grid2 > .card .eyebrow{
  color:var(--survey);
}

#offer .grid2 > .card .muted,
#offer .grid2 > .card .subnote{
  color:var(--muted);
}

.price{
  margin:12px 0 8px;
  font-family:var(--display);
  font-size:clamp(4.7rem,7vw,7.4rem);
  font-weight:400;
  line-height:.86;
  letter-spacing:-.055em;
}

.price small{
  margin-left:6px;
  color:var(--muted);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.12em;
}

.footer{
  position:relative;
  padding:34px 0 48px;
  border-top:1px solid var(--line-dark);
  color:var(--muted);
  font-family:var(--mono);
  font-size:.7rem;
  background:#e7dbc8;
}

.footer::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:6px;
  height:1px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 18px,
      rgba(33,78,103,.28) 18px 19px
    );
}

.footer .row{
  display:flex;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}

.footer a{
  text-decoration-thickness:1px;
}

/* ASSESSMENT — FIELD SHEET */
.assessment-shell{
  max-width:900px;
  margin:54px auto 100px;
  padding:0 24px;
}

.assessment-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:14px;
  color:var(--muted);
  font-family:var(--mono);
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.03em;
}

.progress-shell{
  height:6px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--line) 0 1px,
      transparent 1px 24px
    );
  border:1px solid var(--line);
  border-radius:0;
  overflow:visible;
}

.progress{
  position:relative;
  width:0;
  height:100%;
  background:var(--route);
  transition:width .28s ease;
}

.progress::after{
  content:"";
  position:absolute;
  right:-5px;
  top:50%;
  width:10px;
  height:10px;
  background:var(--paper-light);
  border:2px solid var(--route);
  transform:translateY(-50%) rotate(45deg);
}

.question{
  position:relative;
  margin-top:58px;
}

.question::before{
  content:"";
  position:absolute;
  left:-34px;
  top:0;
  bottom:0;
  width:1px;
  background:var(--line);
}

.question::after{
  content:"";
  position:absolute;
  left:-39px;
  top:8px;
  width:10px;
  height:10px;
  background:var(--survey);
  transform:rotate(45deg);
}

.question h1{
  max-width:780px;
  margin:18px 0 34px;
  font-family:var(--display);
  font-size:clamp(2.8rem,5vw,5rem);
  line-height:.96;
  letter-spacing:-.045em;
  font-weight:400;
}

.options{
  display:grid;
  gap:10px;
  margin-top:24px;
}

.option{
  position:relative;
  display:block;
  padding:17px 18px 17px 48px;
  border:1px solid var(--line);
  border-radius:0;
  background:rgba(248,242,232,.64);
  color:var(--ink);
  cursor:pointer;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background-color .18s ease,
    box-shadow .18s ease;
}

.option::before{
  content:"";
  position:absolute;
  left:18px;
  top:50%;
  width:11px;
  height:11px;
  border:1px solid var(--line-dark);
  transform:translateY(-50%) rotate(45deg);
  transition:background-color .18s ease,border-color .18s ease;
}

.option:hover{
  transform:translateX(5px);
  border-color:var(--survey);
  background:var(--paper-light);
  box-shadow:-5px 5px 0 rgba(33,78,103,.08);
}

.option:has(input:checked){
  border-color:var(--route);
  background:#f3dfd4;
  box-shadow:-5px 5px 0 rgba(214,75,42,.12);
}

.option:has(input:checked)::before{
  border-color:var(--route);
  background:var(--route);
}

.option input{
  margin-right:10px;
  accent-color:var(--route);
}

.textarea{
  width:100%;
  min-height:160px;
  padding:18px;
  border:1px solid var(--line-dark);
  border-radius:0;
  background:
    linear-gradient(rgba(33,78,103,.045) 1px,transparent 1px),
    var(--paper-light);
  background-size:100% 28px;
  color:var(--ink);
  resize:vertical;
}

.textarea:focus{
  border-color:var(--route);
}

.range-row{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}

.range-row label{
  text-align:center;
}

.navrow{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:34px;
}

.error{
  margin-top:12px;
  color:var(--danger);
  font-family:var(--mono);
  font-size:.75rem;
  font-weight:600;
}

/* REPORT — FIELD REPORT */
.report-hero{
  position:relative;
  padding:78px 0 38px;
  border-bottom:1px solid var(--line);
}

.report-hero::before{
  content:"";
  position:absolute;
  right:-24px;
  top:40px;
  width:300px;
  height:220px;
  background:var(--contours) center/cover no-repeat;
  opacity:.5;
  pointer-events:none;
}

.report-hero h1{
  position:relative;
  z-index:1;
  max-width:920px;
  margin:18px 0 20px;
  font-family:var(--display);
  font-size:clamp(3.5rem,6.2vw,6.6rem);
  line-height:.9;
  letter-spacing:-.05em;
  font-weight:400;
}

.score-pill{
  display:inline-flex;
  padding:7px 10px;
  border:1px solid var(--survey);
  border-radius:0;
  background:var(--survey-soft);
  color:var(--survey);
  font-family:var(--mono);
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.035em;
  text-transform:uppercase;
}

.path-card{
  position:relative;
  min-height:300px;
  padding-top:38px;
}

.path-card::before{
  content:"";
  position:absolute;
  left:28px;
  top:18px;
  width:28px;
  height:1px;
  background:var(--route);
}

.path-card::after{
  content:"";
  position:absolute;
  left:28px;
  right:28px;
  bottom:20px;
  height:1px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--line-dark) 0 10px,
      transparent 10px 18px
    );
}

.path-card.primary{
  border-color:var(--route);
  background:var(--paper-light);
  box-shadow:12px 12px 0 #d9c8b0;
}

.path-score{
  margin:16px 0 4px;
  font-family:var(--display);
  font-size:3.8rem;
  font-weight:400;
  line-height:.9;
  letter-spacing:-.04em;
}

.week{
  position:relative;
  display:grid;
  grid-template-columns:78px 1fr;
  gap:20px;
  align-items:start;
  margin:0;
  padding:24px 0;
  border-bottom:1px solid var(--line);
}

.week b{
  position:relative;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  background:var(--paper-light);
  border:2px solid var(--survey);
  color:var(--survey);
  font-family:var(--mono);
  font-size:.78rem;
  font-weight:600;
  line-height:1;
  transform:rotate(45deg);
}

.week b::after{
  content:"";
  position:absolute;
  right:-32px;
  top:50%;
  width:30px;
  border-top:1px dashed var(--line-dark);
  transform:translateY(-50%) rotate(-45deg);
}

.first-move{
  position:relative;
  border:1px solid var(--line-dark);
  border-left:5px solid var(--route);
  border-radius:0;
  padding:24px 26px;
  background:
    linear-gradient(90deg,rgba(225,179,75,.12),transparent 42%),
    var(--paper-light);
  color:var(--ink);
  box-shadow:8px 8px 0 rgba(89,102,76,.10);
}

.feedback{
  margin-top:28px;
}

.feedback button{
  margin:4px;
}

/* LEGAL + ADMIN — ARCHIVE SHEETS */
.legal{
  width:min(100%,880px);
  margin:auto;
  padding:78px 26px 120px;
}

.legal::before{
  content:"";
  display:block;
  width:100%;
  height:8px;
  margin:28px 0 44px;
  background:
    repeating-linear-gradient(
      90deg,
      var(--survey) 0 12px,
      transparent 12px 24px
    );
}

.legal h1{
  max-width:760px;
  margin:34px 0 26px;
  font-family:var(--display);
  font-size:clamp(3.5rem,6.3vw,6.2rem);
  font-weight:400;
  line-height:.9;
  letter-spacing:-.05em;
}

.legal h2{
  margin:44px 0 12px;
  font-family:var(--display);
  font-size:1.95rem;
  font-weight:400;
}

.legal p,
.legal li{
  color:var(--muted);
}

.legal > p:first-of-type{
  color:var(--faint);
  font-family:var(--mono);
  font-size:.7rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.hidden{
  display:none!important;
}

.loading{
  padding:94px 0;
  text-align:center;
  color:var(--muted);
  font-family:var(--mono);
  font-size:.78rem;
}

/* CONSENT — MAP LEGEND */
.consent-banner{
  position:fixed;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:9999;
  max-width:930px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 20px 18px 54px;
  border:1px solid var(--ink);
  border-radius:0;
  background:rgba(248,242,232,.98);
  color:var(--ink);
  box-shadow:12px 12px 0 rgba(33,78,103,.18);
}

.consent-banner::before{
  content:"";
  position:absolute;
  left:20px;
  top:50%;
  width:16px;
  height:16px;
  border:2px solid var(--survey);
  transform:translateY(-50%) rotate(45deg);
}

.consent-banner p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:.84rem;
}

.consent-actions{
  display:flex;
  gap:8px;
  flex-shrink:0;
}

/* REVEALS + MICROINTERACTIONS */
@keyframes atlasRise{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes routeDraw{
  from{background-position-y:-120px}
  to{background-position-y:0}
}

@media (prefers-reduced-motion:no-preference){
  .hero .eyebrow{animation:atlasRise .5s .05s both}
  .hero h1{animation:atlasRise .7s .12s both}
  .hero p{animation:atlasRise .65s .22s both}
  .hero .actions{animation:atlasRise .65s .31s both}
  .hero .subnote{animation:atlasRise .65s .38s both}
  .hero::after{animation:atlasRise .9s .26s both}

  @supports (animation-timeline:view()){
    #for-you .card,
    #how .card,
    main > .section:nth-of-type(4) .card,
    #offer .grid2 > *{
      animation:atlasRise .8s both;
      animation-timeline:view();
      animation-range:entry 8% cover 26%;
    }
  }
}

@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

/* TABLET */
@media (max-width:980px){
  .hero{
    min-height:680px;
    padding-top:90px;
  }

  .hero::after{
    right:-120px;
    opacity:.68;
  }

  .hero .wrap{
    grid-template-columns:minmax(0,1fr) minmax(180px,.36fr);
  }

  .hero h1{
    font-size:clamp(4rem,8vw,6.4rem);
  }

  #for-you .grid3{
    gap:34px 44px;
  }

  #how .grid3{
    gap:42px 48px;
  }

  #offer .grid2{
    grid-template-columns:1fr .85fr;
    gap:50px;
  }
}

/* MOBILE */
@media (max-width:780px){
  .wrap{
    padding-inline:18px;
  }

  body[data-page="landing"] > .wrap:first-child .nav{
    padding-inline:18px;
  }

  .nav{
    min-height:68px;
  }

  .navlinks{
    display:none;
  }

  .brand{
    font-size:.66rem;
    letter-spacing:.08em;
  }

  .brand::before{
    width:14px;
    height:14px;
  }

  .hero{
    min-height:auto;
    padding:72px 0 70px;
  }

  .hero::before{
    width:100%;
    height:52%;
    top:auto;
    bottom:0;
    opacity:.38;
  }

  .hero::after{
    position:relative;
    display:block;
    right:auto;
    top:auto;
    width:220px;
    height:250px;
    margin:36px 16px -20px auto;
    opacity:.74;
  }

  .hero .wrap{
    display:block;
  }

  .hero .wrap::before,
  .hero .wrap::after{
    display:none;
  }

  .hero h1{
    font-size:clamp(3.7rem,17vw,5.2rem);
    line-height:.88;
  }

  .hero p{
    font-size:1rem;
  }

  .actions{
    align-items:stretch;
    flex-direction:column;
    gap:12px;
  }

  .actions .btn{
    width:100%;
  }

  .btn.secondary{
    width:auto;
    align-self:flex-start;
  }

  .section{
    padding:72px 0;
  }

  .section h2{
    font-size:clamp(3rem,13vw,4.4rem);
  }

  .grid3,
  .grid2{
    grid-template-columns:1fr;
  }

  #for-you{
    padding-bottom:78px;
  }

  #for-you::before{
    left:34px;
    top:88px;
    bottom:54px;
    width:1px;
    height:auto;
    transform:none;
    background:
      repeating-linear-gradient(
        180deg,
        rgba(135,122,102,.45) 0 10px,
        transparent 10px 20px
      );
  }

  #for-you .grid3{
    display:block;
  }

  #for-you .card,
  #for-you .card:nth-child(1),
  #for-you .card:nth-child(2),
  #for-you .card:nth-child(3){
    width:100%;
    min-height:0;
    margin:0 0 24px;
    padding:28px 22px 28px 82px;
    transform:none;
  }

  #for-you .card::before{
    height:56px;
  }

  #how .grid3{
    display:block;
    margin-top:38px;
  }

  #how .grid3::before{
    left:29px;
    top:18px;
    bottom:18px;
    transform:none;
  }

  #how .grid3::after{
    left:22px;
  }

  #how .card,
  #how .card:nth-child(1),
  #how .card:nth-child(2),
  #how .card:nth-child(3){
    min-height:0;
    margin:0 0 26px 0;
    padding:28px 22px 28px 84px;
  }

  #how .card:nth-child(1)::before,
  #how .card:nth-child(2)::before,
  #how .card:nth-child(3)::before{
    display:none;
  }

  main > .section:nth-of-type(4){
    padding-block:80px;
  }

  main > .section:nth-of-type(4) .card{
    padding:78px 24px 42px;
  }

  main > .section:nth-of-type(4) .card::before{
    left:22px;
    top:22px;
  }

  .quote{
    font-size:clamp(2.6rem,12vw,4rem);
  }

  #offer .grid2{
    grid-template-columns:1fr;
    gap:42px;
  }

  #offer .grid2 > .card{
    padding:34px 25px;
    box-shadow:10px 10px 0 var(--route);
  }

  .price{
    font-size:5rem;
  }

  .range-row{
    grid-template-columns:1fr;
  }

  .assessment-shell{
    margin-top:34px;
    padding-inline:18px;
  }

  .assessment-head{
    align-items:flex-start;
    flex-direction:column;
    gap:4px;
  }

  .question{
    margin-top:42px;
  }

  .question::before,
  .question::after{
    display:none;
  }

  .question h1{
    font-size:clamp(2.8rem,13vw,4.2rem);
  }

  .navrow{
    flex-direction:column-reverse;
  }

  .navrow .btn{
    width:100%;
  }

  .navrow .btn.secondary{
    width:auto;
  }

  .report-hero{
    padding-top:54px;
  }

  .report-hero::before{
    opacity:.25;
  }

  .week{
    grid-template-columns:58px 1fr;
  }

  .consent-banner{
    align-items:stretch;
    flex-direction:column;
    padding-left:20px;
  }

  .consent-banner::before{
    display:none;
  }

  .consent-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:420px){
  .hero h1{
    font-size:3.55rem;
  }

  .price{
    font-size:4.3rem;
  }

  .footer .row{
    display:block;
  }

  .footer .row > div + div{
    margin-top:12px;
  }
}

/* PRINT */
@media print{
  @page{margin:16mm}

  body{
    background:#fff;
    color:#111;
  }

  body::before,
  .nav,
  .feedback,
  .print-actions,
  .consent-banner{
    display:none!important;
  }

  .wrap{
    max-width:none;
  }

  .section{
    padding:22px 0;
  }

  .card{
    break-inside:avoid;
    background:#fff!important;
    color:#111;
    border:1px solid #bbb;
    box-shadow:none!important;
    transform:none!important;
    clip-path:none!important;
  }

  .muted{
    color:#555;
  }

  .eyebrow{
    color:#214e67;
  }

  .first-move{
    background:#f2ede5;
    color:#111;
  }

  .score-pill{
    color:#214e67;
    border-color:#214e67;
    background:#fff;
  }
}


/* PRIVACY V1 */
.privacy-hint{
  margin:10px 0 0;
  color:var(--faint);
  font-family:var(--mono);
  font-size:.68rem;
  line-height:1.55;
}

.admin-feedback-card{
  margin-top:18px;
}

#login .textarea{
  min-height:0;
}


.privacy-controls{
  margin-top:28px;
  padding-top:20px;
  border-top:1px dashed var(--line-dark);
}


/* CONSULTATION EXPERIENCE V2 */
.consultation-intro{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:34px;
  align-items:start;
}

.consultant-note{
  position:relative;
  padding:40px 40px 40px 46px;
  border-left:5px solid var(--route);
  background:var(--paper-light);
  box-shadow:10px 10px 0 rgba(33,78,103,.10);
}

.consultant-note p{
  margin:18px 0 0;
  font-family:var(--display);
  font-size:clamp(1.75rem,3vw,2.65rem);
  line-height:1.08;
  letter-spacing:-.025em;
}

.tension-card{
  border-top:5px solid var(--signal);
}

.client-voice-section{
  padding-top:26px;
}

.client-words{
  padding:34px;
  border:1px dashed var(--line-dark);
  background:rgba(248,242,232,.45);
}

.client-words blockquote{
  margin:18px 0 0;
  color:var(--ink-soft);
  font-family:var(--display);
  font-size:1.55rem;
  line-height:1.25;
}

.decision-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:28px;
  margin-top:34px;
}

.decision-main,
.decision-action{
  min-height:100%;
}

.decision-main h3{
  margin-top:18px;
  font-size:clamp(2.4rem,4.5vw,4.5rem);
}

.brief-line{
  display:grid;
  grid-template-columns:170px 1fr;
  gap:20px;
  align-items:start;
  padding:16px 0;
  border-top:1px solid var(--line);
}

.brief-line span{
  color:var(--faint);
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.brief-line strong{
  font-weight:600;
  line-height:1.45;
}

.snapshot-card{
  margin-top:30px;
  padding:0;
  overflow:hidden;
}

.snapshot-row{
  display:grid;
  grid-template-columns:minmax(180px,.45fr) minmax(0,1fr);
  gap:24px;
  padding:18px 24px;
  border-bottom:1px solid var(--line);
}

.snapshot-row:last-child{
  border-bottom:0;
}

.snapshot-row span{
  color:var(--faint);
  font-family:var(--mono);
  font-size:.68rem;
  letter-spacing:.055em;
  text-transform:uppercase;
}

.snapshot-row strong{
  font-weight:600;
}

.diagnostics-card h3{
  margin-top:20px;
  font-size:1.45rem;
}

.diagnostics-card .watch-title{
  margin-top:34px;
  padding-top:24px;
  border-top:1px dashed var(--line-dark);
}

.fit-row{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}

.fit-row span{
  color:var(--muted);
}

.fit-row strong{
  min-width:48px;
  text-align:right;
  font-family:var(--mono);
  color:var(--survey);
}

.alternative-card{
  display:flex;
  flex-direction:column;
}

.alt-score{
  margin:6px 0 18px;
  color:var(--survey);
  font-family:var(--mono);
  font-size:.76rem;
  font-weight:600;
}

.switch-condition{
  margin-top:auto;
  padding:16px 18px;
  border-left:3px solid var(--signal);
  background:rgba(225,179,75,.10);
}

.consultation-week{
  grid-template-columns:78px 1fr;
}

.consultation-week .week-title{
  margin-bottom:6px;
  color:var(--survey);
  font-family:var(--mono);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.consultation-week p{
  margin:0;
  color:var(--ink-soft);
}

.anti-plan{
  border-color:var(--route);
  background:
    linear-gradient(90deg,rgba(214,75,42,.07),transparent 55%),
    rgba(248,242,232,.72);
}

.anti-plan p{
  position:relative;
  margin:0;
  padding:16px 0 16px 28px;
  border-top:1px solid var(--line);
}

.anti-plan p::before{
  content:"×";
  position:absolute;
  left:2px;
  top:15px;
  color:var(--route);
  font-family:var(--mono);
  font-weight:700;
}

.confidence-card{
  position:relative;
  overflow:hidden;
  padding-right:min(34vw,390px);
}

.confidence-card::before{
  content:"";
  position:absolute;
  right:-30px;
  top:-34px;
  width:300px;
  height:260px;
  background:var(--contours) center/cover no-repeat;
  opacity:.42;
}

.confidence-card h2,
.confidence-card p,
.confidence-card .eyebrow{
  position:relative;
  z-index:1;
}

.confidence-number{
  position:absolute;
  right:44px;
  bottom:20px;
  color:rgba(33,78,103,.16);
  font-family:var(--display);
  font-size:clamp(5rem,10vw,9rem);
  line-height:.8;
  letter-spacing:-.06em;
}

@media (max-width:780px){
  .consultation-intro,
  .decision-grid{
    grid-template-columns:1fr;
  }

  .consultant-note{
    padding:30px 24px 30px 28px;
  }

  .brief-line,
  .snapshot-row{
    grid-template-columns:1fr;
    gap:6px;
  }

  .confidence-card{
    padding-right:30px;
    padding-bottom:120px;
  }

  .confidence-number{
    right:24px;
    bottom:26px;
  }
}

@media print{
  .consultant-note,
  .client-words,
  .decision-main,
  .decision-action,
  .snapshot-card,
  .diagnostics-card,
  .alternative-card,
  .confidence-card,
  .anti-plan{
    break-inside:avoid;
  }

  .confidence-number{
    color:#ddd;
  }
}


.decision-rules{
  margin-top:30px;
}

.rule-card{
  min-height:260px;
}

.rule-card h3{
  margin-top:16px;
  font-size:1.55rem;
}

.continue-rule{
  border-top:5px solid var(--field);
}

.adjust-rule{
  border-top:5px solid var(--signal);
}

.switch-rule{
  border-top:5px solid var(--route);
}


.score-caption{
  margin-top:-6px;
  margin-bottom:8px;
  color:var(--faint);
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.055em;
  text-transform:uppercase;
}

.case-against{
  margin-top:26px;
  padding:20px 0 0;
  border-top:1px dashed var(--line-dark);
}

.case-against p{
  margin:10px 0 0;
  color:var(--ink-soft);
}

/* PRINT REFINEMENT V2.2 */


@media print{
  @page{
    margin:12mm 14mm;
  }

  .section{
    padding:12px 0!important;
  }

  .report-hero{
    padding-bottom:18px!important;
  }

  .section > .eyebrow,
  .section > h2,
  .section > .lead{
    break-after:avoid-page;
    page-break-after:avoid;
  }

  .consultation-intro,
  .decision-grid,
  .grid2,
  .grid3,
  .decision-rules{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .situation-section .snapshot-card{
    break-inside:auto!important;
    page-break-inside:auto!important;
  }

  .snapshot-row{
    break-inside:avoid;
    page-break-inside:avoid;
    padding:10px 14px!important;
  }

  .path-card,
  .alternative-card,
  .rule-card,
  .consultant-note,
  .tension-card,
  .decision-main,
  .decision-action,
  .primary-reason-card,
  .diagnostics-card,
  .confidence-card,
  .anti-plan,
  .consultation-week{
    break-inside:avoid;
    page-break-inside:avoid;
  }

  .rule-card{
    min-height:0!important;
  }

  .section h2{
    font-size:32pt!important;
    line-height:.98!important;
    margin:8px 0 12px!important;
  }

  .report-hero h1{
    font-size:38pt!important;
    line-height:.96!important;
  }

  .consultant-note{
    padding:22px 24px 22px 28px!important;
  }

  .consultant-note p{
    font-size:18pt!important;
    line-height:1.12!important;
  }

  .card{
    padding:18px!important;
  }

  .first-move{
    padding:18px!important;
  }

  .week{
    padding:12px 0!important;
  }

  .alternatives-section,
  .plan-section,
  .rules-section,
  .ranked-section,
  .situation-section{
    break-before:auto;
    page-break-before:auto;
  }

  .privacy-controls{
    break-inside:avoid;
  }
}


/* PRELAUNCH RETURNING CUSTOMER UX */
.consultation-history{
  margin-top:24px;
  padding-top:20px;
  border-top:1px dashed var(--line-dark);
}

.consultation-history-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}

.consultation-history-row span{
  color:var(--muted);
  font-size:.9rem;
  line-height:1.4;
}

.consultation-history-row .btn{
  flex:0 0 auto;
}

.new-consultation-btn{
  margin-top:14px;
}

.returning-access{
  display:inline-block;
  font-family:var(--mono);
  font-size:.9rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}

@media (max-width:640px){
  .consultation-history-row{
    align-items:flex-start;
    flex-direction:column;
  }
}


.backup-key-content{
  margin-top:18px;
  padding:18px;
  border:1px dashed var(--line-dark);
  background:rgba(248,242,232,.72);
  font-family:var(--mono);
  word-break:break-word;
}

.backup-key-content p{
  margin:0 0 10px;
}

.access-backup-card .hidden{
  display:none;
}


.link-button{
  appearance:none;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}


/* CHECKOUT RETURN UX */
.checkout-return-notice{
  position:relative;
  z-index:80;
  border-bottom:1px solid var(--line-dark);
  background:rgba(225,179,75,.18);
}

.checkout-return-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-top:18px;
  padding-bottom:18px;
}

.checkout-return-inner strong{
  display:block;
  margin-top:4px;
  font-family:var(--display);
  font-size:1.65rem;
  line-height:1.05;
}

.checkout-return-inner p{
  margin:6px 0 0;
  color:var(--muted);
}

.checkout-return-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
}

.checkout-notice-dismiss{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid var(--line-dark);
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-family:var(--mono);
  font-size:1.5rem;
  line-height:1;
}

.checkout-notice-dismiss:hover{
  background:rgba(23,26,23,.06);
}

@media (max-width:700px){
  .checkout-return-inner{
    align-items:flex-start;
    flex-direction:column;
  }

  .checkout-return-actions{
    width:100%;
    justify-content:space-between;
  }

  .checkout-return-actions .btn{
    flex:1 1 auto;
    text-align:center;
  }
}

@media print{
  .checkout-return-notice{
    display:none!important;
  }
}