/* Layout: Nordic and quiet. White and warm-white bands, one forest close, hairline edges, 2px corners, pill buttons. Motion: content rises in as you scroll; the bridge diagram draws itself and then carries a slow flow from tools to problems. */
@font-face{font-family:"Geist";src:url("fonts/geist-variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("fonts/geist-mono-variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{
  color-scheme: light;
  --white:#FFFFFF; --warm:#FAFAF8; --page:#F8F6F0; --page-2:#F1EEE6; --page-3:#F2EFE7; --tint:#E6EFE2; --hair:#D6E2D1;
  --forest:#0D3512; --forest-mid:#2E4A34; --moss:#4A7A50; --moss-deep:#3E6A44; --sage:#A8C4A0;
  --sand:#E0DDC0; --on-forest:#D8E6D3; --ink:#1A1A1A; --lead:#444444; --muted:#7A7A72; --smoke:#999999;
  --sans:"Geist","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,Consolas,monospace;
  --max:1200px; --pad:clamp(20px,5vw,48px); --gap-section:clamp(80px,10vw,128px);
  --r:2px; --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--moss-deep);font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;letter-spacing:.005em}
img{max-width:100%;display:block}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:475;color:var(--forest);text-wrap:balance}
a{color:inherit}
:focus-visible{outline:none;box-shadow:0 0 0 4px var(--sage);border-radius:var(--r)}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
section{padding-block:var(--gap-section)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:18px;height:1px;background:currentColor}
.h2{font-size:clamp(32px,3.6vw,44px);line-height:1.1;letter-spacing:-.02em}
.lead{font-size:clamp(18px,1vw + 12px,20px);line-height:1.5;color:var(--lead);max-width:34em}
.head{display:grid;gap:18px;max-width:720px}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:475;font-size:16px;line-height:1;text-decoration:none;border-radius:9999px;padding:15px 24px;border:1px solid transparent;cursor:pointer;transition:background-color .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn .arr{transition:transform .25s var(--ease)}.btn:hover .arr{transform:translateX(3px)}
.btn-fill{background:var(--forest);color:var(--white)}
.btn-fill:hover{background:var(--forest-mid);box-shadow:0 0 0 4px var(--tint)}
.btn-line{background:transparent;color:var(--forest);border-color:var(--forest)}
.btn-line:hover{box-shadow:0 0 0 4px var(--tint)}
.btn-sage{background:var(--sage);color:var(--forest)}
.btn-sage:hover{box-shadow:0 0 0 4px var(--forest-mid)}

/* reveal: visible by default; only hidden while JS is running and motion is allowed */
@media (prefers-reduced-motion:no-preference){
  html.js [data-r]{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0ms)}
  html.js [data-r].in{opacity:1;transform:none}
}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(248,246,240,.9);backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-bottom-color:var(--hair)}
.nav .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:72px;gap:24px}
.logo{display:block;overflow:hidden;line-height:0;flex:none}
.logo img{max-width:none}
.logo.sm{width:95px;height:54px}.logo.sm img{width:176px;height:82.5px;margin:-16px 0 0 -42px}
.logo.md{width:130px;height:74px}.logo.md img{width:240px;height:112.5px;margin:-22px 0 0 -57px}
.nav ul{display:flex;gap:32px;list-style:none;margin:0;padding:0}
.nav ul a{font-size:15px;color:var(--lead);text-decoration:none;position:relative;padding:6px 0}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--forest);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav ul a:hover{color:var(--forest)}.nav ul a:hover::after{transform:scaleX(1)}
.nav .cta{justify-self:end;padding:11px 20px;font-size:15px}

/* hero */
.hero{padding-block:clamp(56px,9vw,120px) clamp(72px,10vw,128px)}
.hero .grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero .copy{display:grid;gap:28px}
.hero h1{font-size:clamp(46px,7vw,92px);line-height:1;letter-spacing:-.035em}
.hero h1 .w{display:inline-block}
.hero h1 em{font-style:normal;color:var(--moss)}
@media (prefers-reduced-motion:no-preference){
  html.js .hero h1 .w{opacity:0;transform:translateY(.35em);animation:rise .9s var(--ease) forwards;animation-delay:calc(var(--i) * 90ms + 150ms)}
  @keyframes rise{to{opacity:1;transform:none}}
}
.hero .actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-art{width:100%;max-width:420px;justify-self:end}
.hero-art svg{width:100%;height:auto;display:block;overflow:visible}
.hero-art .line{stroke:var(--hair);stroke-width:1.5;fill:none}
.hero-art .line-on{stroke:var(--moss);stroke-width:1.5;fill:none}
.hero-art .ring{fill:none;stroke:var(--sage);stroke-width:1}
@media (prefers-reduced-motion:no-preference){
  html.js .hero-art .line-on{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s var(--ease) .5s forwards}
  html.js .hero-art .dot{transform-box:fill-box;transform-origin:center;transform:scale(0);animation:pop .7s cubic-bezier(.3,1.5,.5,1) forwards}
  html.js .hero-art .dot{animation-delay:var(--dl)}
  .hero-art .ring{transform-box:fill-box;transform-origin:center;animation:breathe 4.5s ease-in-out 2s infinite}
  @keyframes draw{to{stroke-dashoffset:0}}
  @keyframes pop{to{transform:scale(1)}}
  @keyframes breathe{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:.9;transform:scale(1.18)}}
}

/* bridge */
.bridge-sec{background:var(--page-2)}
.diagram{margin-top:clamp(48px,6vw,80px)}
.diagram svg{width:100%;height:auto;display:block;overflow:visible}
.diagram .box{fill:var(--white);stroke:var(--hair);stroke-width:1}
.diagram .box-t{font-family:var(--sans);font-size:15px;font-weight:475;letter-spacing:0;fill:var(--forest)}
.diagram .col-t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;fill:var(--moss)}
.diagram .port{fill:var(--white);stroke:var(--moss);stroke-width:1.5}
.diagram .wire{fill:none;stroke:var(--moss);stroke-width:1.5}
.diagram .wire-base{fill:none;stroke:var(--hair);stroke-width:1.5}
.diagram .hub{fill:var(--forest)}
.diagram .hub-ring{fill:none;stroke:var(--sage);stroke-width:1}
.diagram .hub-dot{fill:var(--sage)}
.diagram .hub-t{font-family:var(--mono);font-size:12px;letter-spacing:.06em;fill:var(--moss)}
.diagram .flow circle{fill:var(--moss)}
.diagram .flow{opacity:0;transition:opacity .8s var(--ease) 2s}
@media (prefers-reduced-motion:no-preference){
  html.js .diagram .wire{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease);transition-delay:var(--d,0ms)}
  html.js .diagram.in .wire{stroke-dashoffset:0}
  html.js .diagram .hub-g{transform-box:fill-box;transform-origin:center;transform:scale(.6);opacity:0;transition:transform .9s cubic-bezier(.3,1.4,.5,1) .5s,opacity .6s ease .5s}
  html.js .diagram.in .hub-g{transform:none;opacity:1}
  html.js .diagram .node{opacity:0;transform:translateX(var(--x,0));transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0ms)}
  html.js .diagram.in .node{opacity:1;transform:none}
  .diagram.in .flow{opacity:1}
}
@media (prefers-reduced-motion:reduce){.diagram .flow{display:none}}
.diagram .v{display:none}
.split{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.5vw,32px);margin-top:clamp(56px,7vw,88px)}
.split .intro{grid-column:1/-1;display:grid;gap:10px;max-width:720px;margin-bottom:8px}
.split .intro h3{font-size:clamp(22px,2vw,26px);letter-spacing:-.015em}
.split .item{border-top:1px solid var(--forest);padding-top:20px;display:grid;gap:8px;align-content:start}
.split .item .n{font-family:var(--mono);font-size:12px;color:var(--moss);letter-spacing:.06em}
.split .item h4{margin:0;font-weight:475;font-size:20px;color:var(--forest);letter-spacing:-.01em}
.split .item p{font-size:16px;color:var(--lead)}
.closing{margin-top:clamp(40px,5vw,56px);font-size:clamp(18px,1vw + 12px,21px);color:var(--forest);max-width:40em;line-height:1.45}

/* services */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px);margin-top:clamp(48px,6vw,72px)}
.card{position:relative;background:var(--white);border:1px solid var(--hair);border-radius:var(--r);padding:32px;display:flex;flex-direction:column;gap:14px;min-width:0;transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.card:hover{border-color:var(--moss);transform:translateY(-3px);box-shadow:0 0 0 4px var(--tint)}
.card .top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:28px}
.card svg.ic{width:64px;height:64px;display:block;overflow:visible}
.card .tag{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--tint);color:var(--forest);border-radius:var(--r);padding:5px 8px}
.card .n{font-family:var(--mono);font-size:12px;color:var(--smoke)}
.card h3{font-size:24px;letter-spacing:-.015em;line-height:1.15}
.card p{font-size:16px;color:var(--lead)}
.card .more{margin-top:auto;padding-top:20px;font-weight:475;font-size:15px;color:var(--forest);text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.card .more .arr{transition:transform .25s var(--ease)}
.card:hover .more .arr{transform:translateX(4px)}
.ic .s{fill:none;stroke:var(--moss);stroke-width:1.5;stroke-linecap:round}
.ic .h{fill:none;stroke:var(--hair);stroke-width:1.5}
.ic .f{fill:var(--forest)}
.ic .g{fill:var(--sage)}
.ic .m{fill:var(--moss)}

/* about */
.about{background:var(--page)}
.about .grid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center;max-width:960px}
.about img{width:clamp(128px,15vw,176px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:50%}
.about .text{display:grid;gap:16px}
.about .name{display:grid;gap:4px}
.about .name h2{font-size:clamp(26px,2.6vw,32px);letter-spacing:-.02em}
.about .name span{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--moss)}
.about p{font-size:clamp(18px,1vw + 12px,20px);line-height:1.5;color:var(--forest);max-width:36em}
.skills{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:4px 0 0;padding:0}
.skills li{font-size:14px;color:var(--forest);border:1px solid var(--hair);background:var(--white);border-radius:var(--r);padding:6px 10px}

/* contact */
.contact{background:var(--forest);color:var(--on-forest)}
.contact .grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,88px);align-items:start}
.contact .eyebrow{color:var(--sage)}
.contact h2{color:var(--sand);font-size:clamp(36px,4.4vw,56px);line-height:1.05;letter-spacing:-.025em}
.contact .copy{display:grid;gap:22px}
.contact .lead{color:var(--on-forest)}
.contact .mail{font-size:16px}
.contact .mail span{display:block;color:var(--sand);font-weight:475;user-select:all;margin-top:2px}
form{background:var(--white);border-radius:var(--r);padding:clamp(24px,3vw,36px);display:grid;grid-template-columns:1fr 1fr;gap:18px;color:var(--moss-deep)}
.f{display:grid;gap:8px;min-width:0}.f.full{grid-column:1/-1}
.f > label{font-size:14px;font-weight:475;color:var(--forest)}
.f > label .opt{font-weight:400;color:var(--smoke)}
input[type=text],input[type=email],select,textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--white);border:1px solid var(--hair);border-radius:var(--r);padding:12px 13px;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--moss);box-shadow:0 0 0 4px var(--tint)}
textarea{min-height:128px;resize:vertical}
.chk{display:flex;gap:12px;align-items:flex-start}
.chk input{width:18px;height:18px;margin:3px 0 0;accent-color:var(--forest);flex:none}
.chk > label{font-size:14px;font-weight:400;line-height:1.5;color:var(--lead)}
.chk a{color:var(--forest)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.submit{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.status{font-size:14px;line-height:1.45}.status.ok{color:var(--forest)}.status.err{color:var(--ink)}
.invalid{border-color:var(--ink)!important}

footer{background:var(--forest);color:var(--on-forest);font-size:14px;padding-block:0 36px}
footer .row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding-top:44px;border-top:1px solid var(--forest-mid)}
footer .line{margin-top:8px;color:var(--on-forest)}
footer .cb{text-align:right;line-height:1.8}
footer .cb a{color:var(--sand);text-decoration:none}
footer .cb a:hover{text-decoration:underline}
details.privacy{margin-top:28px}
details.privacy summary{cursor:pointer;color:var(--sand)}
details.privacy .txt{display:grid;gap:8px;max-width:46em;margin-top:14px;line-height:1.6}
details.privacy h4{margin:8px 0 0;font-weight:475;color:var(--sand)}
footer .fine{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px 24px;font-family:var(--mono);font-size:12px;color:var(--sage)}


/* v9 refinements */
.hero .copy{gap:32px}
.hero .lead{font-size:clamp(19px,1.2vw + 12px,23px);color:var(--forest-mid);max-width:30em}
.diagram .lbl{font-family:var(--sans);font-size:16px;font-weight:475;letter-spacing:0;fill:var(--forest)}
.diagram .pt{fill:var(--sage)}
.diagram .pt-f{fill:var(--moss)}
.diagram .col-rule{stroke:var(--moss);stroke-width:1}
.diagram .hub-halo{fill:var(--tint)}
.flow-m .grp ul{list-style:none;margin:0;padding:0;display:grid}
.flow-m .grp li{position:relative;padding:12px 0 12px 22px;border-bottom:1px solid var(--hair);color:var(--forest);font-weight:475;font-size:16px}
.flow-m .grp li::before{content:"";position:absolute;left:2px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--sage)}
.flow-m .grp:last-child li::before{background:var(--moss)}
.flow-m .grp .t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--moss);text-transform:uppercase;margin-bottom:4px}
.about .story{display:grid;gap:14px}
.about .story p{font-size:clamp(18px,1vw + 12px,20px);line-height:1.5;color:var(--forest);max-width:36em}
.about .story .beat{font-size:clamp(22px,1.6vw + 12px,28px);line-height:1.25;letter-spacing:-.015em;font-weight:475}
.about .story .beat{color:var(--moss-deep)}
.contact .copy{align-self:start;padding-top:0}
.contact .copy .eyebrow{margin-top:0}


/* v10 journey */
.journey{margin-top:clamp(48px,6vw,80px)}
.j-svg svg{width:100%;height:auto;display:block;overflow:visible}
.journey .col-t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;fill:var(--moss)}
.journey .ctext{font-family:var(--sans);font-size:15px;font-weight:475;letter-spacing:0;fill:var(--forest-mid)}
.journey .cdot{fill:var(--sage)}
.journey .pill{fill:#FFFFFF;stroke:var(--hair);stroke-width:1}
.journey .tangle{fill:none;stroke:var(--sage);stroke-width:1.25}
.journey .path-base{stroke:var(--hair);stroke-width:2}
.journey .path-on{stroke:var(--moss);stroke-width:2}
.journey .st{font-family:var(--mono);font-size:12px;letter-spacing:.08em;fill:var(--moss)}
.journey .halo{fill:var(--tint)}
.journey .n1,.journey .n2{fill:var(--moss)}
.journey .n3{fill:var(--forest)}
.journey .flow circle{fill:var(--moss)}
.journey .flow{opacity:0;transition:opacity .8s var(--ease) 2.2s}
.j-cols{display:grid;grid-template-columns:360fr 300fr 300fr 300fr;margin-top:4px}
.stage{padding-left:6%;padding-right:8%;display:grid;gap:12px;align-content:start}
.stage h3{font-size:20px;letter-spacing:-.01em;line-height:1.2}
.stage ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.stage li{font-size:15.5px;color:var(--lead);line-height:1.4;padding-left:16px;position:relative}
.stage li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--sage)}
.stage:last-child li::before{background:var(--forest)}
@media (prefers-reduced-motion:no-preference){
  .journey .chip{animation:float var(--fd) ease-in-out var(--fdel) infinite}
  @keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(3px,-5px)}}
  html.js .journey .tangle{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s var(--ease);transition-delay:var(--d,0ms)}
  html.js .journey.in .tangle{stroke-dashoffset:0}
  html.js .journey .path-on{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--ease) .8s}
  html.js .journey.in .path-on{stroke-dashoffset:0}
  html.js .journey .nd{transform-box:fill-box;transform-origin:center;transform:scale(.3);opacity:0;transition:transform .8s cubic-bezier(.3,1.5,.5,1),opacity .5s ease;transition-delay:var(--d,0ms)}
  html.js .journey.in .nd{transform:none;opacity:1}
  .journey.in .flow{opacity:1}
}
@media (prefers-reduced-motion:reduce){.journey .flow{display:none}}
.journey-m{display:none}
@media (max-width:960px){
  .journey{display:none}
  .journey-m{display:grid;gap:20px;margin-top:40px}
  .journey-m .t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--moss);text-transform:uppercase}
  .journey-m .cloud{display:flex;flex-wrap:wrap;gap:10px 14px}
  .journey-m .cloud span{display:inline-block;transform:rotate(var(--rot));font-weight:475;color:var(--forest-mid);font-size:14.5px;padding:5px 12px 5px 26px;position:relative;background:#FFFFFF;border:1px solid var(--hair);border-radius:9999px}
  .journey-m .cloud span::before{content:"";position:absolute;left:12px;top:calc(50% - 3.5px);width:7px;height:7px;border-radius:50%;background:var(--sage)}
  .journey-m .line-m{position:relative;display:grid;gap:28px;padding-left:44px;margin-top:12px}
  .journey-m .line-m::before{content:"";position:absolute;left:15px;top:0;bottom:12px;width:2px;background:var(--moss)}
  .journey-m .ms{position:relative;display:grid;gap:8px}
  .journey-m .mn{position:absolute;left:-29px;top:2px;transform:translateX(-50%);border-radius:50%;box-shadow:0 0 0 6px var(--tint)}
  .journey-m .mn1{width:12px;height:12px;background:var(--moss);left:-28px;top:4px}
  .journey-m .mn2{width:20px;height:20px;background:var(--moss)}
  .journey-m .mn3{width:30px;height:30px;background:var(--forest)}
  .journey-m .st-m{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--moss)}
  .journey-m h3{font-size:20px}
  .journey-m ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
  .journey-m li{color:var(--lead);font-size:15.5px}
}

/* mobile bridge */
.flow-m{display:none}
@media (max-width:960px){
  .nav nav{display:none}
  .nav .wrap{grid-template-columns:1fr auto}
  .hero .grid{grid-template-columns:1fr}
  .hero-art{max-width:300px;justify-self:start;order:-1}
  .diagram{display:none}
  .flow-m{display:grid;gap:0;margin-top:40px;justify-items:center}
  .flow-m .grp{width:100%;display:grid;gap:8px}
  .flow-m .conn{width:1.5px;height:44px;background:var(--moss);transform-origin:top}
  .flow-m .hubm{width:84px;height:84px;border-radius:50%;background:var(--forest);display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 0 0 8px var(--tint)}
  .flow-m .hubm i{display:block;border-radius:50%;background:var(--sage)}
  .flow-m .hubm i:nth-child(1){width:7px;height:7px}.flow-m .hubm i:nth-child(2){width:12px;height:12px}.flow-m .hubm i:nth-child(3){width:19px;height:19px}
  .split,.cards,.contact .grid{grid-template-columns:1fr}
  footer .cb{text-align:left}
}
@media (max-width:560px){
  form{grid-template-columns:1fr}
  .about .grid{grid-template-columns:1fr}
  .hero .actions .btn{flex:1 1 auto;justify-content:center}
  .card{padding:24px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}





/* v11 gap flow: three columns joined through two TR[AI]L dots */
.gflow{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) 132px minmax(0,1fr) 132px minmax(0,1.2fr);align-items:center;margin-top:clamp(48px,6vw,80px)}
.gf-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.gf-lines path{fill:none;stroke:var(--sage);stroke-width:1.25}
.gf-lines circle{fill:#4A7A50}
.gcol{position:relative;z-index:1;display:grid;gap:18px;align-content:center}
.gcol h3{font-size:20px;letter-spacing:-.01em;color:var(--forest);font-weight:500}
.gcol ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.gcol li{position:relative;padding-left:18px;color:var(--lead);font-size:16px;line-height:1.4}
.gcol li::before{content:"";position:absolute;left:0;top:.52em;width:7px;height:7px;border-radius:50%;background:var(--sage)}
.gcol.c3 li::before{background:#4A7A50}
.gcol.c3 li{color:var(--forest-mid)}
.c1 h3,.c2 h3,.c3 h3{margin:0}
.gcol.c2,.gcol.c3{padding-left:6px}
.gnode{position:relative;z-index:1;display:grid;justify-items:center;align-self:stretch;align-content:center}
.gdot{display:block;border-radius:50%;background:#4A7A50;box-shadow:0 0 0 8px var(--tint)}
.g1 .gdot{width:26px;height:26px}
.g2 .gdot{width:40px;height:40px;background:var(--forest)}
.glab{position:absolute;top:calc(50% - 46px);font-weight:500;font-size:15px;letter-spacing:0;color:var(--moss)}
.g2 .glab{top:calc(50% - 54px)}
@media (prefers-reduced-motion:no-preference){
  html.js .gf-lines path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.1s var(--ease)}
  html.js .gflow.in .gf-lines path{stroke-dashoffset:0}
  html.js .gdot{transform:scale(.3);opacity:0;transition:transform .8s cubic-bezier(.3,1.5,.5,1),opacity .5s ease}
  html.js .gflow.in .g1 .gdot{transform:none;opacity:1;transition-delay:.6s}
  html.js .gflow.in .g2 .gdot{transform:none;opacity:1;transition-delay:1.2s}
}
@media (max-width:960px){
  .gflow{grid-template-columns:1fr;align-items:start;gap:0}
  .gf-lines{display:none}
  .gcol.c2,.gcol.c3{padding-left:0}
  .gnode{justify-items:start;padding:34px 0 34px 0;grid-template-columns:40px auto;align-items:center;column-gap:16px}
  .gnode::before{content:"";position:absolute;left:19px;top:0;bottom:0;width:2px;background:var(--hair)}
  .gdot{position:relative;justify-self:center}
  .glab{position:static;grid-column:2;grid-row:1}
  .gnode .gdot{grid-column:1;grid-row:1}
  .g2 .glab{top:auto}
}
/* v11 gap flow placement (after base rules) */
@media (min-width:961px){
  .gflow{grid-template-rows:auto auto;row-gap:28px}
  .gcol{display:contents}
  .c1 h3{grid-column:1;grid-row:1} .c1 ul{grid-column:1;grid-row:2}
  .c2 h3{grid-column:3;grid-row:1} .c2 ul{grid-column:3;grid-row:2}
  .c3 h3{grid-column:5;grid-row:1} .c3 ul{grid-column:5;grid-row:2}
  .g1{grid-column:2;grid-row:2} .g2{grid-column:4;grid-row:2}
  .gflow h3{align-self:end}
  .c2 h3,.c2 ul,.c3 h3,.c3 ul{padding-left:6px}
}

/* v18 how it works: checklist diagram (approved 6 Oct 2026) */
.hiw{margin-top:clamp(36px,5vw,64px)}
.hiw-d svg{display:block;width:100%;height:auto;overflow:visible;font-family:var(--sans)}
.hiw-d .mono{font-family:var(--mono);font-size:11px;letter-spacing:.09em;fill:var(--moss)}
.hiw-d .mid{text-anchor:middle}
.hiw-d .it{font-size:15.5px;fill:var(--forest);font-weight:475}
.hiw-d .hair{stroke:#DDD9CE;stroke-width:1}
.hiw-d .rule{stroke:var(--forest);stroke-width:1}.hiw-d .rule.thin{stroke:var(--moss);stroke-width:.6}
.hiw-d .wire{fill:none;stroke:var(--moss);stroke-width:1.25}
.hiw-d .port,.hiw-d .mk.dot,.hiw-d .hd circle{fill:var(--moss)}
.hiw-d .port.ring{fill:var(--page-2);stroke:var(--moss);stroke-width:1.5}
.hiw-d .pt{fill:var(--forest)}
.hiw-d .prob{text-anchor:middle;font-size:15px;font-weight:475;fill:var(--forest)}
.hiw-d .inner{fill:none;stroke:var(--moss);stroke-width:.8}
.hiw-d .chk{fill:none;stroke:var(--forest);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hiw-m{display:none}
@media (prefers-reduced-motion:no-preference){
  .hiw-d .wire{stroke-dasharray:1;stroke-dashoffset:1;animation:hw_draw 1.3s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i)*110ms + 300ms)}
  .hiw-d .wire.wr{animation-delay:calc(var(--i)*110ms + 1500ms)}
  .hiw-d .pt{opacity:0}
  .hiw-d .prob{animation:hw_focus 10s infinite;animation-delay:calc(var(--k)*2.5s - 10s)}
  .hiw-d .hubc{transform-box:fill-box;transform-origin:center;animation:hw_pop .9s cubic-bezier(.2,.7,.2,1) both .7s}
  .hiw-d .inner{stroke-dasharray:1;stroke-dashoffset:1;animation:hw_draw 1.6s cubic-bezier(.2,.7,.2,1) forwards 1.2s}
  .hiw-d .hd.pulse circle{transform-box:fill-box;transform-origin:center;animation:hw_dotpulse 6s ease-in-out infinite;animation-delay:calc(var(--p)*.35s + 2.5s)}
  .hiw-d .chk{stroke-dasharray:1;stroke-dashoffset:0}
  .hiw-d .chk.c0{animation:hw_ck0 14.0s infinite}.hiw-d .chk.c1{animation:hw_ck1 14.0s infinite}.hiw-d .chk.c2{animation:hw_ck2 14.0s infinite}.hiw-d .chk.c3{animation:hw_ck3 14.0s infinite}.hiw-d .chk.c4{animation:hw_ck4 14.0s infinite}
  html.js .hiw:not(.in) .hiw-d *{animation-play-state:paused!important}
}
@media (prefers-reduced-motion:reduce){.hiw-d .pt{display:none}.hiw-d animate,.hiw-d animateMotion{display:none}}
@keyframes hw_draw{to{stroke-dashoffset:0}}@keyframes hw_pop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes hw_focus{0%,22%{fill:var(--forest)}28%,94%{fill:#8FA291}100%{fill:var(--forest)}}@keyframes hw_ck0{0%,0.0%{stroke-dashoffset:1}4.0%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes hw_ck1{0%,15.7%{stroke-dashoffset:1}19.7%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes hw_ck2{0%,31.4%{stroke-dashoffset:1}35.4%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes hw_ck3{0%,47.1%{stroke-dashoffset:1}51.1%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes hw_ck4{0%,62.9%{stroke-dashoffset:1}66.9%,95%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}@keyframes hw_ck5{0%{stroke-dashoffset:1}6%,84%{stroke-dashoffset:0}94%,100%{stroke-dashoffset:1}}@keyframes hw_dotpulse{0%,18%,100%{transform:scale(1);fill:var(--moss)}8%{transform:scale(1.28);fill:var(--forest)}}
@media (max-width:960px){
  .hiw-d{display:none}
  .hiw-m{display:grid;gap:0;max-width:440px;margin:0 auto}
  .hiw-m .hm-t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);margin:0;padding-bottom:12px;border-bottom:1px solid var(--moss)}
  .hiw-m ul{list-style:none;margin:0;padding:0}
  .hiw-m li{position:relative;padding:15px 0 15px 26px;border-bottom:1px solid #DDD9CE;color:var(--forest);font-size:16px;font-weight:475;line-height:1.35}
  .hiw-m .in li::before{content:"";position:absolute;left:2px;top:23px;width:7px;height:7px;border-radius:50%;background:var(--moss)}
  .hiw-m .out li::before{content:"";position:absolute;left:3px;top:21px;width:11px;height:6px;border-left:2px solid var(--forest);border-bottom:2px solid var(--forest);transform:rotate(-45deg)}
  .hiw-m .out li{padding-left:30px}
  .hm-hub{position:relative;width:min(300px,82vw);aspect-ratio:1;margin:40px auto;border-radius:50%;border:1.5px solid var(--forest);display:grid;align-content:center;justify-items:center;gap:12px;padding:26px;text-align:center}
  .hm-hub::before{content:"";position:absolute;inset:9px;border-radius:50%;border:.8px solid var(--moss);clip-path:polygon(0 18%,100% 18%,100% 82%,0 82%)}
  .hm-dots{display:flex;align-items:center;gap:9px}.hm-dots i{display:block;border-radius:50%;background:var(--moss)}
  .hm-dots i:nth-child(1){width:6px;height:6px}.hm-dots i:nth-child(2){width:10px;height:10px}.hm-dots i:nth-child(3){width:15px;height:15px}
  .hm-hub .hm-t{border:0;padding:0}
  .hm-hub li{border:0;padding:0;text-align:center;font-size:14px}
  .hm-hub li::before{display:none}
  .hm-hub ul{display:grid;gap:8px}
}
.contact h2 .h2b{color:var(--sage)}
textarea.short{min-height:84px}
.ccard{display:grid;gap:0;align-self:start;margin-top:calc(var(--cc-off,0px))}
.ccard .crow{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:baseline;padding:18px 0;border-top:1px solid rgba(168,196,160,.28)}
.ccard .crow:first-child{border-top:0;padding-top:0}
.ccard .clab{font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.ccard a{font-size:clamp(20px,2.2vw,28px);line-height:1.2;font-weight:400;letter-spacing:-.01em;color:var(--sand);text-decoration:none;overflow-wrap:anywhere;transition:color .2s}
.ccard a:hover{color:var(--sage)}
.ccard .cname{padding-top:18px;border-top:1px solid rgba(168,196,160,.28);font-size:15px;color:var(--on-forest)}
.ccard .cname span{display:block;font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.08em;color:var(--sage);margin-top:2px}
@media(min-width:961px){.ccard{--cc-off:calc(41px + (clamp(36px,4.4vw,56px)*1.05 - clamp(20px,2.2vw,28px)*1.2)/2)}}
@media(max-width:560px){.ccard .crow{grid-template-columns:1fr;gap:4px}}



/* v18 work with me: two steps */
.ways-sec{background:var(--page)}
.steps{margin-top:clamp(48px,6vw,72px)}
.step{display:grid;grid-template-columns:120px minmax(0,1fr)}
.rail{position:relative;border-left:1.5px solid var(--moss);margin-left:10px;padding:0 0 48px 28px}
.step:last-child .rail{border-left-style:dashed}
.rail span{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss)}
.rail i{position:absolute;left:-7px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--moss)}
.rail i.big{left:-10px;width:18px;height:18px;background:var(--forest);box-shadow:0 0 0 4px var(--page),0 0 0 5.5px var(--sage)}
.step .body{padding-bottom:48px;min-width:0}
.step:last-child .body{padding-bottom:0}
.steps .card .top{margin-bottom:18px}
.steps .dx{max-width:640px}
.steps .alone{display:flex;gap:12px;align-items:flex-start;margin-top:8px;padding-top:18px;border-top:1px solid var(--hair);font-size:15px;color:var(--moss-deep)}
.steps .alone i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--forest);margin-top:6px}
.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 20px}
.chips b{font-weight:475;color:var(--forest);margin-right:8px}
.chips em{font-style:normal;font-size:14px;color:var(--forest);background:var(--white);border:1px solid var(--hair);border-radius:var(--r);padding:6px 10px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
@media (max-width:760px){
  .step{grid-template-columns:28px minmax(0,1fr)}
  .rail{margin-left:8px;padding:0}
  .rail span{position:absolute;left:18px;top:-1px;white-space:nowrap}
  .step .body{padding-top:30px}
  .two{grid-template-columns:1fr;gap:16px}
  .chips b{flex-basis:100%;margin-bottom:4px}
}

/* v18: sand cards in Work with me */
.steps .card{background:var(--white);border-color:#E6E2D8}
.steps .chips em,.steps .skills li{background:var(--white);border-color:#E6E2D8}

/* v18 course overview */
.cov{border-top:1px solid var(--hair);margin-top:6px;padding-top:14px}
.cov summary{list-style:none;cursor:pointer;font-weight:475;font-size:15px;color:var(--forest);display:inline-flex;align-items:center;gap:10px}
.cov summary::-webkit-details-marker{display:none}
.cov .chev{width:8px;height:8px;border-right:1.5px solid var(--moss);border-bottom:1.5px solid var(--moss);transform:rotate(45deg) translateY(-2px);transition:transform .25s var(--ease)}
.cov[open] .chev{transform:rotate(225deg) translateY(-2px)}
.cov summary:focus-visible{box-shadow:0 0 0 4px var(--tint)}
.cov ol{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:0}
.cov li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--hair)}
.cov li:first-child{border-top:0;padding-top:0}
.cov .sn{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--moss);display:grid;place-items:center;font-family:var(--mono);font-size:11px;color:var(--moss);margin-top:1px}
.cov .sn.f{background:var(--forest);border-color:var(--forest);color:var(--sand)}
.cov b{display:block;font-weight:475;color:var(--forest);font-size:15px}
.cov em{display:block;font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);margin:2px 0 4px}
.cov li p{font-size:14px;line-height:1.5;color:var(--lead)}
.card .cov-foot{margin-top:12px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--moss)}
.about{background:var(--page-3)}

/* v18 about line: forest, with [AI] in moss */
.about .story .beat{color:var(--forest)}
.about .story .beat .ai{color:var(--moss)}



/* v18 alignment pass */
.steps .dx{max-width:none}
.two{align-items:stretch}
.steps .card{padding-bottom:22px}
.steps .alone{display:block;margin-top:6px;padding-top:14px;border-top:1px solid var(--hair);font-weight:475;font-size:15px;color:var(--forest)}
.steps .alone i{display:none}
.cov-blank{margin-top:auto;border-top:1px solid var(--hair);height:41px}
.cov{margin-top:6px}
.card .cov[open]{padding-bottom:4px}

/* v19 nav: language switch beside the call to action */
.nav-r{justify-self:end;display:flex;align-items:center;gap:20px}
.nav-r .cta{justify-self:auto}
.lang{font-size:15px;color:var(--lead);text-decoration:none;padding:6px 0;border-bottom:1px solid transparent;transition:border-color .25s var(--ease),color .25s var(--ease)}
.lang:hover{color:var(--forest);border-bottom-color:var(--forest)}
@media (max-width:560px){.nav-r{gap:14px}.nav-r .cta{padding:10px 16px}}

/* v19 Danish: longer compound words, so the hero headline steps down a size */
html[lang=da] .hero h1{font-size:clamp(42px,6.2vw,80px)}

/* v19 hero: the positioning line, readable */
.eyebrow-lg{font-size:clamp(14px,.5vw + 11px,16px);letter-spacing:.1em;font-weight:500;color:var(--moss-deep)}
.eyebrow-lg::before{width:26px;background:var(--moss)}

/* v19 Work with me: the Tailored engagement card leads, the Course follows */
.te-ph{list-style:none;margin:6px 0 0;padding:0;display:grid;border-top:1px solid #E6E2D8}
.te-ph li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid #E6E2D8;font-size:15px;line-height:1.4}
.te-ph b{font-weight:475;color:var(--forest)}
.te-ph span{color:var(--lead)}
.two .card .cov{margin-top:auto}

/* Resources page: tips and context-file questions */
.nav ul a[aria-current]{color:var(--forest)}
.nav ul a[aria-current]::after{transform:scaleX(1)}
/* library: the overview of guides */
.lib-hero{padding-block:clamp(56px,8vw,104px) clamp(32px,4vw,48px)}
.lib-hero h1,.g-hero h1{font-size:clamp(40px,5.6vw,72px);line-height:1.02;letter-spacing:-.03em}
.lib-hero .head,.g-hero .head{max-width:820px;gap:22px}
.lib{padding-block:0 var(--gap-section)}
.lib-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:28px}
.lib-fl{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);margin-right:8px}
.lib-filter button{font:475 14px/1 var(--sans);color:var(--forest);background:var(--white);border:1px solid var(--hair);border-radius:9999px;padding:9px 16px;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.lib-filter button:hover{border-color:var(--moss)}
.lib-filter button[aria-pressed="true"]{background:var(--forest);border-color:var(--forest);color:var(--white)}
html:not(.js) .lib-filter{display:none}
.lib-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,20px)}
.lib-card[hidden]{display:none}
.lib-card a,.lib-soon>div{display:flex;flex-direction:column;gap:12px;height:100%;min-height:clamp(240px,24vw,300px);padding:clamp(24px,3vw,36px);background:var(--white);border:1px solid var(--hair);border-radius:var(--r);text-decoration:none;transition:border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease)}
.lib-card a:hover{border-color:var(--moss);transform:translateY(-2px);box-shadow:0 10px 30px -18px rgba(13,53,18,.35)}
.lib-tag{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss)}
.lib-card h3{font-size:clamp(26px,2.6vw,34px);line-height:1.08;letter-spacing:-.02em}
.lib-card p{font-size:16px;color:var(--lead);max-width:30em}
.lib-foot{margin-top:auto;padding-top:16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.lib-meta{font-family:var(--mono);font-size:12px;color:var(--muted)}
.lib-go{flex:none;width:46px;height:46px;border-radius:50%;background:var(--forest);color:var(--white);display:grid;place-items:center;font-size:20px;line-height:1;transition:transform .25s var(--ease),background-color .25s var(--ease)}
.lib-card a:hover .lib-go{transform:translateX(4px);background:var(--moss)}
.lib-soon>div{background:transparent;border:1.5px dashed var(--sage);justify-content:center;align-items:flex-start}
.lib-soon h3{font-size:24px}
.lib-dots{display:inline-flex;align-items:center;gap:6px;margin-bottom:6px}
.lib-dots i{display:block;border-radius:50%;background:var(--moss)}
.lib-dots i:nth-child(1){width:6px;height:6px}.lib-dots i:nth-child(2){width:10px;height:10px}.lib-dots i:nth-child(3){width:15px;height:15px;background:var(--forest)}

/* one guide */
.g-hero{padding-block:clamp(32px,5vw,56px) clamp(48px,6vw,80px)}
.g-back{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);text-decoration:none;margin-bottom:clamp(28px,4vw,44px)}
.g-back:hover{color:var(--forest);text-decoration:underline;text-underline-offset:4px}
.g-meta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:28px;font-family:var(--mono);font-size:13px;color:var(--muted)}
.g-meta .btn{padding:11px 20px;font-size:15px}
.lib-more{padding-top:var(--gap-section)}
.lib-more .h2{margin-bottom:clamp(28px,4vw,40px)}
.g-all{margin:32px 0 0}
.once-link{justify-self:start;margin-top:6px;color:var(--sand);font-weight:475;font-size:15px;text-decoration:none}
.once-link:hover{text-decoration:underline;text-underline-offset:4px}
.res-sec.res-b{background:var(--page-2)}
.res-sec.res-a{background:var(--page)}
.res-sec .head{margin-bottom:clamp(36px,5vw,56px)}

/* a prompt to try, with a copy button */
.try{margin-top:auto;background:var(--page);border-left:2px solid var(--moss);border-radius:var(--r);padding:10px 10px 12px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 8px}
.try-l{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss)}
.try-t{grid-column:1/-1;font-size:15px;line-height:1.45;color:var(--forest);padding-right:4px}
.try-copy{grid-row:1;grid-column:2;justify-self:end;font:475 12px/1 var(--sans);color:var(--forest);background:var(--white);border:1px solid var(--hair);border-radius:9999px;padding:6px 10px;cursor:pointer;transition:border-color .2s}
.try-copy:hover{border-color:var(--moss)}

/* tips */
.once{background:var(--forest);color:var(--on-forest);border-radius:var(--r);padding:clamp(24px,3.5vw,40px);display:grid;gap:12px;max-width:880px;margin-bottom:clamp(20px,2.5vw,32px)}
.once-l{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}
.once h2{color:var(--white);font-size:clamp(22px,2vw,28px);letter-spacing:-.015em;line-height:1.2}
.once p{color:var(--on-forest)}
.once .try{background:var(--forest-mid);border-left-color:var(--sage);margin-top:8px}
.once .try-l{color:var(--sage)}.once .try-t{color:var(--white)}
.tips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,20px)}
.tip{background:var(--white);border:1px solid var(--hair);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.tip-n{font-family:var(--mono);font-size:13px;color:var(--moss)}
.tip h3{font-size:20px;line-height:1.2;letter-spacing:-.01em}
.tip p{font-size:15.5px;color:var(--lead)}
.tip .try{margin-top:auto}
.tip p + .try{margin-top:auto}
.tip>p{margin-bottom:6px}

/* good to know */
.good{margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--forest);padding-top:20px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:16px 32px}
.good h2{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss)}
.good ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.good li{position:relative;padding-left:22px;color:var(--lead);font-size:16px}
.good li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--moss)}

/* context-file questions */
.how{background:var(--white);border:1px solid var(--hair);border-radius:var(--r);padding:clamp(22px,3vw,32px);display:grid;gap:10px;max-width:880px;margin-bottom:clamp(36px,5vw,56px)}
.how h2{font-size:22px;letter-spacing:-.015em}
.how p{color:var(--lead);font-size:16px}
.how .try{margin-top:8px}
.rq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,48px) clamp(24px,4vw,64px);align-items:start}
.rq-g h2{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--moss);padding-bottom:12px;border-bottom:1px solid var(--forest)}
.rq-g ol{list-style:none;margin:0;padding:0}
.rq-g li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px;padding:14px 0;border-bottom:1px solid var(--hair)}
.rq-n{font-family:var(--mono);font-size:13px;color:var(--smoke);padding-top:3px}
.rq-q{color:var(--forest);font-weight:475;font-size:17px;line-height:1.35}
.rq-h{color:var(--muted);font-size:15px;margin-top:3px}

/* closing band */
.res-end .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:end}
.res-end h2{color:var(--white);font-size:clamp(30px,3.4vw,42px);line-height:1.1;letter-spacing:-.02em;margin-top:16px}
.res-end .eyebrow{color:var(--sage)}
.res-end-r{display:grid;gap:24px;justify-items:start}
.res-end-r p{color:var(--on-forest);font-size:18px;line-height:1.5}

@media (max-width:960px){
  .tips{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rq,.res-end .grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .tips,.good,.lib-grid{grid-template-columns:minmax(0,1fr)}
}

@media print{
  @page{margin:16mm}
  body.res-page{background:#fff;font-size:11pt}
  .res-page .nav,.res-page footer,.res-page .res-end,.res-page .lib-more,.res-page .g-back,.res-page .g-meta .btn,.res-page .try-copy{display:none!important}
  .res-page section{padding-block:0 18pt;background:#fff!important}
  .res-page [data-r]{opacity:1!important;transform:none!important}
  .res-page .tips{grid-template-columns:1fr 1fr;gap:8pt}
  .res-page .tip,.res-page .rq-g li,.res-page .once,.res-page .how,.res-page .good{break-inside:avoid}
  .res-page .rq{grid-template-columns:1fr 1fr}
  .res-page .once{background:#fff;color:var(--ink);border:1px solid var(--forest)}
  .res-page .once h2,.res-page .once .try-t{color:var(--forest)}.res-page .once p{color:var(--lead)}
  .res-page .once .try{background:var(--page)}
}

/* v20 card icons: lines end cleanly on the ring */
.ic .sl{stroke-linecap:butt}

/* v20 Tailored engagement fold-out: three phases with a gate between each */
.cov-lead{margin-top:18px;font-size:14px;line-height:1.5;color:var(--lead)}
.cov-lead b{display:block;font-weight:475;font-size:15px;color:var(--forest);margin-bottom:4px}
.cov ol.cov-ph{margin-top:16px}
.cov .cov-ph li:first-child{border-top:1px solid var(--hair);padding-top:12px}

/* v21 one line between the preview list and the fold-out, and equal cards when both are open */
.te-ph li:last-child{border-bottom:0}

/* v23 the two cards: rows are matched in height by site.js, each card opens on its own,
   and when both are open they end at the same height */
.two{align-items:start}
.two .card .cov{margin-top:6px}
.two:has(.cov[open]):not(:has(.cov:not([open]))){align-items:stretch}
.card .cov-lead{font-size:14px;line-height:1.5}
.ic .o{fill:var(--white);stroke:var(--moss);stroke-width:1.5}

/* v23 tip cards: number, title, text and prompt each on a shared row, so every card in a row lines up.
   Titles reserve two lines; prompts show two lines and open over the card when clicked */
.tip{display:grid;grid-template-rows:subgrid;grid-row:span 4;gap:10px;align-content:start}
.tip h3{min-height:2.4em}
.tip .try-slot{position:relative;align-self:end}
.tip .try-t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;min-height:2.9em}
.tip .try.clamped .try-t{cursor:pointer}
.tip .try.clamped .try-t:hover{text-decoration:underline;text-decoration-color:var(--sage);text-underline-offset:3px}
.tip .try.open{position:absolute;left:0;right:0;bottom:0;z-index:3;background:var(--white);border:1px solid var(--hair);border-left:2px solid var(--moss);box-shadow:0 14px 34px -14px rgba(13,53,18,.4)}
.tip .try.open .try-t{display:block;-webkit-line-clamp:unset;line-clamp:none;overflow:visible}
.once-links{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:6px}
@media print{
  .res-page .tip .try-t{display:block;-webkit-line-clamp:unset;line-clamp:none;overflow:visible}
  .res-page .tip h3{min-height:0}
}