@font-face{font-family:Alegreya;src:url('/fonts/display.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/fonts/body.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/fonts/body-semibold.woff2') format('woff2');font-style:normal;font-weight:600 900;font-display:swap}
:root{
  --forest:#203f35;--forest-deep:#172e27;--green:#44854a;--paper:#f5f5ed;
  --ink:#263c32;--muted:#506158;--line:#b6bfb0;--mint:#dce8d8;--yellow:#ead47b;
  --gold:#c9a94f;
  --white:#fffdf5;--brass:#766a53;--error:#96352e;--pale-error:#ffc6ba;
  --bg1:var(--forest-deep);--accent:var(--gold);
  --type-body:'DM Sans',Arial,sans-serif;--type-display:Alegreya,Georgia,serif;
  --text-sm:0.875rem;--text-base:1rem;--text-lg:1.25rem;--text-xl:1.563rem;
  --text-2xl:1.953rem;--text-3xl:2.441rem;--text-4xl:3.052rem;
  --space-1:0.5rem;--space-2:1rem;--space-3:1.5rem;--space-4:2rem;
  --space-5:3rem;--space-6:4.5rem;--space-7:6rem;
  --ease:cubic-bezier(.2,.65,.3,1);--duration:180ms;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);scroll-behavior:smooth;scroll-padding-top:2rem;-webkit-text-size-adjust:100%}
body{font-family:var(--type-body);font-size:var(--text-base);line-height:1.65;background:var(--paper);color:var(--ink);font-variant-numeric:lining-nums}
/* Alegreya ships OLDSTYLE figures by default — its 0 and 2 sit at x-height, so
   "01" and "$5,000" read as lowercase next to the display type. The face carries
   lnum; this turns it on site-wide. DM Sans is lining-only, so body text is
   unaffected. Do not remove without checking every number set in the display face. */
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.25em}
button,input{font:inherit}
button,a,input{touch-action:manipulation}
button{cursor:pointer}
[hidden],.hidden{display:none!important}
:focus-visible{outline:3px solid var(--gold);outline-offset:5px}
.wrap{width:min(1200px,calc(100% - 112px));margin-inline:auto}
h1,h2,h3{font-family:var(--type-display);font-weight:600;line-height:1.1;text-wrap:balance}
header{background:var(--forest);color:var(--white)}
header .in{width:min(1280px,calc(100% - 112px));margin:auto;display:flex;align-items:center;justify-content:space-between;height:98px;border-bottom:1px solid var(--brass)}
.mark,.fmark{font-size:13px;text-transform:uppercase;letter-spacing:.38em;font-weight:600}
.mark-link{text-decoration:none}



.shop>.hero{display:none}
.shop .hero{position:relative;display:block;padding:96px max(56px,calc((100% - 1200px)/2)) 104px;background:var(--forest);color:var(--white);isolation:isolate;border-bottom:10px double var(--gold)}
.shop .hero-copy{width:auto;margin:0;max-width:none}
.shop h1{font-size:clamp(3rem,6.2vw,5.75rem);letter-spacing:-.035em;max-width:15ch}
.shop .sub{margin-top:30px;font-size:18px;max-width:58ch;color:var(--mint);line-height:1.8}
.shop .sub span{color:var(--gold);font-weight:600}
.proof{margin-top:36px;padding-top:24px;border-top:1px solid var(--brass);max-width:58ch;font-size:var(--text-sm);color:var(--mint)}
.proof b{color:var(--white)}



#builds{padding-top:80px}
.pb{--panel:var(--mint);display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.3fr);margin-bottom:84px;border-top:2px solid var(--forest);position:relative;scroll-margin-top:2rem}
.z1{padding:44px 40px 44px 0;border-right:1px solid var(--line)}
.nm{font-size:clamp(2rem,3vw,2.8rem);max-width:16ch;letter-spacing:-.02em}
.pr{font-size:var(--text-sm);font-weight:600;margin-top:16px;color:var(--muted)}
.k,.trap>span{display:block;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;line-height:1.6}
.z1 .k{margin-top:38px;color:var(--muted)}
.ask{font-family:var(--type-display);font-size:clamp(1.6rem,2.3vw,2rem);line-height:1.3;margin-top:14px;max-width:26ch}
.z2{padding:44px 0 40px 44px}
.z2>.k{margin-bottom:20px;color:var(--muted)}
.z2 ol{list-style:none;counter-reset:questions}
.z2 li{position:relative;padding:13px 0 13px 34px;border-bottom:1px solid var(--line);counter-increment:questions;font-size:15px;line-height:1.7}
.z2 li::before{content:counter(questions,decimal-leading-zero);position:absolute;left:0;top:16px;font-size:11px;font-weight:600;color:var(--muted)}
.z2 em{font-style:normal;font-weight:600}
.trap{margin-top:28px}
.trap>span{color:var(--muted)}
.trap p{font-size:15px;margin-top:9px;line-height:1.7;max-width:60ch}
.z3{grid-column:1/-1;background:var(--panel);padding:44px 48px;border:1px solid var(--forest);border-top:8px double var(--forest);border-radius:0 0 4px 4px}
.z3in{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:72px;align-items:center}
.payoff-wand{float:left;margin:3px 12px 0 0;transition:transform var(--duration) var(--ease)}
.z3:focus-within .payoff-wand,.z3:hover .payoff-wand{transform:rotate(-12deg)}
.z3 h3{font-size:var(--text-3xl);margin-bottom:18px;letter-spacing:-.02em}
.sup{font-size:16px;max-width:65ch;margin-top:16px}
.act{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:26px}
.btn,.btn2,.frow button{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:50px;padding:14px 22px;background:var(--forest);color:var(--white);font-size:14px;font-weight:600;text-decoration:none;border:1px solid var(--forest);border-radius:3px;line-height:1.5;transition:background var(--duration) var(--ease),transform var(--duration) var(--ease)}
.btn:hover,.frow button:hover{background:var(--forest-deep);transform:translateY(-2px)}
.btn2{margin-top:14px;background:transparent;color:var(--forest)}
.btn2:hover{background:var(--forest);color:var(--white)}
.meta{font-size:12px;line-height:1.6;color:var(--ink)}
.pvlink{display:inline-block;font-size:var(--text-sm);font-weight:600;margin-top:20px;min-height:32px}
.prev{display:block;transform:rotate(3deg);box-shadow:9px 9px 0 var(--forest);transition:transform var(--duration) var(--ease)}
.prev:hover,.prev:focus-visible{transform:rotate(0deg) translateY(-3px)}
.prev img{width:100%;height:auto;border:1px solid var(--forest)}
.how{background:var(--forest);color:var(--white);padding:76px 0 80px;border-block:8px double var(--gold)}
.how h2{font-size:clamp(2.4rem,4vw,3.6rem);max-width:18ch}
.g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:42px}
.c{border-top:1px solid var(--gold);padding-top:20px}
.c>b{font-family:var(--type-display);font-size:1.5rem;font-weight:600;color:var(--gold);line-height:1.2;display:block;margin-bottom:14px}
.c p{font-size:14px;color:var(--mint);line-height:1.8}
.later{padding:80px 0}
.box{display:grid;grid-template-columns:1fr 1fr;gap:18px 60px;align-items:start}
.box>b{font-family:var(--type-display);font-size:2.5rem;line-height:1.1;grid-column:1}
.box>p{grid-column:1;font-size:15px;color:var(--muted);max-width:65ch}
#nf{grid-column:2;grid-row:1/3;padding:28px;background:var(--mint);border-top:6px double var(--forest)}
#nf label{font-family:var(--type-display);font-size:1.8rem;line-height:1.2;display:block;margin-bottom:20px}
.frow{display:flex;flex-wrap:wrap;gap:12px}
input{min-width:0;min-height:50px;width:100%;font:inherit;padding:13px 16px;border:1px solid var(--muted);border-radius:3px;background:var(--white);color:var(--ink)}
input::placeholder{color:var(--muted);opacity:1}
.frow input{flex:1 1 210px}
.frow button{flex:1 1 auto}
.fmsg{font-size:14px;margin-top:12px}
.bad{color:var(--error)}
.preview-note{font-size:12px;line-height:1.6;color:var(--muted);margin-top:12px}
footer{padding:40px 0;background:var(--forest-deep);color:var(--mint);border-top:1px solid var(--gold)}
footer .in{width:min(1200px,calc(100% - 112px));margin:auto}
.fmark{color:var(--white)}
.fline{margin-top:20px;font-size:13px;line-height:1.9}
.fsmall{margin-top:14px;font-size:12px;color:var(--mint)}
.door-page{background:var(--forest-deep);color:var(--white);padding:24px 24px 60px;min-height:100vh}
.door-page .wrap{width:100%;max-width:440px}
.door-page .mark{color:var(--gold);text-align:center;font-size:11px;margin-bottom:18px}
.door-page .hero{height:242px;position:relative;margin-bottom:12px}
.door-page .hero-door{position:absolute;width:116px;height:auto;bottom:0;left:0}
.door-page .hero-trail{position:absolute;left:74px;bottom:52px;width:104px;opacity:.7}
.door-page .hero-fairy{position:absolute;width:130px;height:auto;right:0;top:2px;transform:rotate(5deg)}
.door-page h1{text-align:center;font-size:clamp(2.3rem,9.4vw,3rem);letter-spacing:-.02em;margin-bottom:16px}
.aside{font-style:italic;color:var(--mint);text-align:center;font-size:18px;margin-bottom:26px}
.rowwrap{margin-bottom:26px}
.doorrow{width:100%;height:auto}
.rowcap{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--mint);text-align:center;margin-top:8px}
.gate{margin-bottom:16px}
.door-page form{display:flex;flex-direction:column;gap:10px}
.door-page input{background:var(--forest);border-color:var(--brass);color:var(--white)}
.door-page input::placeholder{color:var(--mint)}
.door-page button{padding:15px;border:1px solid var(--gold);border-radius:3px;background:var(--yellow);color:var(--forest-deep);font-weight:600;font-size:17px;min-height:54px;transition:background var(--duration) var(--ease)}
.door-page button:hover{background:var(--gold)}
.err{font-size:14px;min-height:20px;color:var(--pale-error)}
.consent,.door-page .preview-note{font-size:12px;color:var(--mint)}
.door-page .preview-note{border-top:1px solid var(--brass);padding-top:12px;margin-top:2px}
.door-page hr{border:0;border-top:1px solid var(--brass);margin:32px 0 24px}
.door-page h2{font-size:2rem;margin-bottom:14px}
.shoplede,.close{font-size:15px;color:var(--mint);line-height:1.7}
.shelf{padding-left:20px;margin:24px 0;font-size:15px}
.shelf li{padding-left:4px;margin-bottom:12px}
.shelf li::marker{color:var(--gold)}
.cta{display:block;border:1px solid var(--gold);padding:14px;text-align:center;color:var(--yellow);border-radius:3px;font-weight:600;text-decoration:none}
.cta:hover{background:var(--forest)}
.close{margin-top:24px}
.fine,.keep{font-size:13px;color:var(--mint);margin-top:12px}
.fine{font-style:italic}
.charmicon{width:76px;height:76px;margin:20px auto 8px}
.charm{font-family:var(--type-display);font-size:clamp(2.5rem,12vw,3.6rem);letter-spacing:.06em;line-height:1.2;color:var(--yellow);text-align:center}
.keep{text-align:center;margin-bottom:28px}
.more{text-align:center;font-size:18px;font-weight:600;margin:22px 0 6px}
.pocket{text-align:center;font-size:15px;color:var(--mint);margin-bottom:24px}
.done{border-left:3px solid var(--gold);padding:10px 0 10px 16px;font-style:italic;color:var(--mint)}
#got:focus{outline:none}
@media(min-width:1600px){}
@media(max-width:1000px){
  .wrap,header .in,footer .in{width:calc(100% - 64px)}
  .shop .hero{padding:64px 32px 72px}
  .shop h1{font-size:3.5rem}
  .z1{padding-right:28px}.z2{padding-left:28px}.z3{padding:32px}.z3in{gap:40px;grid-template-columns:minmax(0,1fr) 165px}
  .g{grid-template-columns:1fr 1fr;gap:36px}.box{gap:24px 32px}
}
@media(max-width:640px){
  .wrap,header .in,footer .in{width:calc(100% - 40px)}
  header .in{height:76px}.mark,.fmark{font-size:11px}
  .shop .hero{padding:44px 20px 40px}
  .shop h1{font-size:clamp(2.6rem,10vw,3.3rem);max-width:16ch;letter-spacing:-.03em}
  .shop .sub{font-size:15px;margin-top:24px;line-height:1.75}.proof{font-size:12px;margin-top:24px;padding-top:18px}
  
  
  #builds{padding-top:44px}.pb{display:block;margin-bottom:48px}.z1{padding:28px 0;border-right:0}.nm{font-size:2.25rem;max-width:20ch}.pr{font-size:13px;margin-top:12px}
  .z1 .k{margin-top:28px}.ask{font-size:1.75rem;max-width:27ch}.z2{padding:4px 0 28px}.z2>.k{margin-bottom:10px}.z2 li{font-size:14px;padding-left:28px}
  .trap p{font-size:14px}.z3{padding:26px 22px}.z3in{display:flex;flex-direction:column;gap:36px;align-items:stretch}.z3 h3{font-size:2rem}.sup{font-size:15px}
  .act{gap:14px;align-items:flex-start;flex-direction:column}.btn,.btn2{width:100%;font-size:13px;padding:13px 15px}.meta br{display:none}.meta b::after{content:' '}
  .prev{width:180px;align-self:center;margin-bottom:12px}.how{padding:48px 0}.how h2{font-size:2.5rem}.g{grid-template-columns:1fr;gap:28px;margin-top:32px}.c{padding-top:16px}.c>b{font-size:1.5rem;margin-bottom:10px}
  .later{padding:48px 0}.box{display:block}.box>b{display:block;font-size:2.2rem}.box>p{margin-top:20px}#nf{margin-top:28px;padding:24px 20px}#nf label{font-size:1.6rem}.frow button{width:100%}
  footer{padding:32px 0}.fline{font-size:12px}.fsmall{font-size:11px}.door-page .wrap{width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.prev:hover,.prev:focus-visible{transform:rotate(0)}.btn:hover,.frow button:hover,.z3:hover .payoff-wand,.z3:focus-within .payoff-wand{transform:none}}
/* The supplied wand survives links and purchase controls at both resolutions. */
@media(hover:hover) and (pointer:fine){
  *,body,a,button,.prev,.pvlink{cursor:url('/img/cursor-wand.png') 6 6,auto}
}
@media(hover:hover) and (pointer:fine) and (min-resolution:1.5dppx){
  *,body,a,button,.prev,.pvlink{cursor:image-set(url('/img/cursor-wand.png') 1x,url('/img/cursor-wand-2x.png') 2x) 6 6,auto}
}

/* The Ops Fairy at her counter — closes the page beside the one sentence that
   says a person is behind this. Black line art, so she only works on paper;
   she cannot go on any forest section without a white-line version. */
.opsfairy{display:block;width:290px;margin:30px 0 0 -12px}
.opsfairy img{width:100%;height:auto}
@media(max-width:1000px){.opsfairy{width:240px;margin-left:-8px}}
@media(max-width:640px){.opsfairy{width:210px;margin:22px auto 0}}

/* Agency / consultant partner block. A different audience, so a different ground —
   deliberately not a sixth product card: no price, no excavation list, no wand. */
.partner{background:var(--forest);color:var(--white);padding:74px 0 78px;border-top:8px double var(--gold)}
.partner .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:start}
.partner .k{color:var(--gold);margin-bottom:14px}
.partner h2{font-size:clamp(2.1rem,3.4vw,3rem);letter-spacing:-.02em;margin-bottom:20px;max-width:14ch}
.pcopy p{color:var(--mint);font-size:16px;line-height:1.8;max-width:52ch}
.pcopy p + p{margin-top:16px}
.pcard{border-top:1px solid var(--brass);padding-top:26px}
.poff{font-family:var(--type-display);font-size:1.7rem;line-height:1.25;color:var(--white);margin-bottom:22px}
.poff b{color:var(--yellow);font-weight:600}
.pcard ul.b{list-style:none;margin:0 0 28px;padding:0}
.pcard ul.b li{position:relative;padding:9px 0 9px 20px;font-size:14.5px;line-height:1.65;color:var(--mint)}
.pcard ul.b li:before{content:"";position:absolute;left:0;top:17px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.pcard .btn{background:var(--gold);border-color:var(--gold);color:var(--forest-deep)}
.pcard .btn:hover{background:var(--yellow);border-color:var(--yellow)}
.pfine{margin-top:14px;font-size:12.5px;color:var(--mint);opacity:.8}
@media(max-width:1000px){.partner .wrap{gap:40px}}
@media(max-width:640px){
  .partner{padding:52px 0 56px}
  .partner .wrap{grid-template-columns:1fr;gap:32px}
  .partner h2{font-size:2.1rem;max-width:18ch}
  .pcard .btn{width:100%}
}

/* partner form, on the forest ground */
.sub2{display:block;margin-top:7px;font-size:13px;line-height:1.6;color:var(--mint);opacity:.85}
.sub2 a{color:var(--gold)}
.pcopy .poff{margin-top:26px}
.pcopy ul.b{list-style:none;margin:0;padding:0}
.pcopy ul.b li{position:relative;padding:9px 0 9px 20px;font-size:14.5px;line-height:1.65;color:var(--mint)}
.pcopy ul.b li:before{content:"";position:absolute;left:0;top:17px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
#pf{display:flex;flex-direction:column;gap:11px}
#pf label{font-family:var(--type-display);font-size:1.7rem;line-height:1.2;color:var(--white);margin-bottom:8px}
#pf input{background:rgba(255,255,255,.07);border:1px solid var(--brass);color:var(--white);border-radius:3px}
#pf input::placeholder{color:var(--mint);opacity:.75}
#pf input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:transparent}
#pf button{background:var(--gold);border-color:var(--gold);color:var(--forest-deep);margin-top:5px}
#pf button:hover{background:var(--yellow);border-color:var(--yellow)}
#pf .fmsg{color:var(--mint)}
#pf .fmsg.bad{color:var(--pale-error)}

/* THE LIBRARY — a contents page, not a nav bar. Present at rest, so it answers
   "what is this" before anyone scrolls, which the hero alone cannot do. */
.library{padding:64px 0 8px}
.library .k{color:var(--muted);margin-bottom:22px}
.lib{list-style:none;margin:0;padding:0;border-top:2px solid var(--forest);counter-reset:lib}
.lib li{counter-increment:lib;border-bottom:1px solid var(--line)}
.lib a{display:grid;grid-template-columns:minmax(0,22ch) minmax(0,1fr) auto;gap:32px;
  align-items:baseline;padding:22px 4px 22px 40px;position:relative;text-decoration:none;
  transition:background var(--duration) var(--ease)}
.lib a:before{content:counter(lib,decimal-leading-zero);position:absolute;left:2px;top:26px;
  font-size:11px;font-weight:600;color:var(--muted)}
.lib a:hover,.lib a:focus-visible{background:var(--mint)}
.lib a:after{content:"\2193";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:15px;color:var(--forest);opacity:0;transition:opacity var(--duration) var(--ease)}
.lib a:hover:after,.lib a:focus-visible:after{opacity:.55}
.ln{font-family:var(--type-display);font-size:1.45rem;line-height:1.2;color:var(--ink);
  letter-spacing:-.015em;text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:.18em;text-decoration-color:var(--line);
  transition:text-decoration-color var(--duration) var(--ease)}
.lib a:hover .ln,.lib a:focus-visible .ln{text-decoration-color:var(--forest)}
.lq{font-size:14.5px;line-height:1.6;color:var(--muted)}
.lq em{font-style:italic;font-weight:400}
.lp{font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:lining-nums tabular-nums;
  text-align:right;padding-right:22px}
.libfoot{margin-top:20px;font-size:13px;color:var(--muted)}
@media(max-width:1000px){
  .lib a{grid-template-columns:minmax(0,18ch) minmax(0,1fr) auto;gap:22px}
  .ln{font-size:1.25rem}
}
@media(max-width:640px){
  .library{padding:40px 0 4px}
  .lib a{grid-template-columns:1fr auto;gap:4px 16px;padding:18px 2px 18px 30px}
  .lib a:before{top:21px}
  .lib a:after{display:none}
  .ln{font-size:1.15rem;grid-column:1}
  .lp{grid-column:2;grid-row:1;padding-right:0}
  .lq{grid-column:1/-1;font-size:13.5px;margin-top:4px}
}
