:root{--paper:#F6F8F7;--ink:#17232B;--ink-soft:#4A5963;--ridge:#1D5373;--ridge-hover:#164260;--haze:#E4ECEF;--spruce:#2E6B4E;--mist:#A9C7D6;--error:#B3261E;--line:#8FA3AE;
--font-display:"Fraunces",Georgia,serif;--font-text:"Atkinson Hyperlegible",system-ui,sans-serif;
--fs-h1:clamp(40px,6vw,64px);--fs-h2:clamp(30px,4.2vw,44px);--fs-h3:clamp(22px,2.4vw,26px);--fs-body:clamp(19px,1.3vw,20px);--fs-small:16px;
--space-1:8px;--space-2:16px;--space-3:24px;--space-4:40px;--space-5:64px;--space-6:96px;--radius:10px;--tap:48px;--btn-h:56px;--measure:34em;--header-h:64px;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-body)/1.55 var(--font-text);overflow-x:hidden}
img,svg,picture{display:block;max-width:100%}
h1,h2,h3{font-family:var(--font-display);font-weight:600;margin:0 0 var(--space-2);text-wrap:balance;font-optical-sizing:auto}
h1{font-size:var(--fs-h1);line-height:1.08;letter-spacing:-.01em}
h2{font-size:var(--fs-h2);line-height:1.15;font-weight:500}
h3{font-size:var(--fs-h3);line-height:1.25;font-weight:600}
p{margin:0 0 var(--space-2);max-width:var(--measure)}
a{color:var(--ridge);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ridge-hover);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ridge);outline-offset:2px;box-shadow:0 0 0 2px var(--paper)}
.band-ink :focus-visible,.site-footer :focus-visible{outline-color:var(--mist);box-shadow:0 0 0 2px var(--ink)}
.nw{white-space:nowrap}
.email{overflow-wrap:anywhere}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:8px;top:-80px;z-index:100;background:var(--ink);color:var(--paper);padding:12px 16px;border-radius:var(--radius)}
.skip:focus{top:8px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
main{display:block}
main:focus{outline:none}
[id]{scroll-margin-top:72px}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--line)}
.hd-in{max-width:1120px;margin:0 auto;padding:0 16px 0 24px;height:var(--header-h);display:flex;align-items:center;gap:12px;transition:height .15s}
.is-condensed .hd-in{height:56px}
.wordmark{display:flex;align-items:center;gap:10px;font:600 20px/1 var(--font-display);color:var(--ink);text-decoration:none;min-height:48px;margin:0}
.wordmark .glyph{width:28px;height:28px;flex:none}
.wordmark:hover{color:var(--ink)}
.nav-desk{display:none}
.hd-act{margin-left:auto;display:flex;gap:12px;align-items:center}
.btn-call{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 16px;border-radius:999px;background:var(--ridge);color:#fff;font-weight:700;font-size:18px;text-decoration:none;white-space:nowrap}
.btn-call:hover{background:var(--ridge-hover);color:#fff}
.btn-call .ic{width:20px;height:20px}
.call-long{display:none}
.btn-menu,.btn-close{height:48px;min-width:48px;padding:0 14px;border:2px solid var(--ink-soft);border-radius:var(--radius);background:transparent;color:var(--ink);font:700 18px/1 var(--font-text);cursor:pointer}
.menu{position:fixed;inset:0;z-index:80;background:var(--paper);padding:8px 24px 32px;overflow-y:auto;opacity:1;transition:opacity .15s}
.menu[hidden]{display:none}
.menu-top{display:flex;justify-content:space-between;align-items:center;height:56px;margin-bottom:16px}
.menu-links{list-style:none;margin:0 0 24px;padding:0}
.menu-links a{display:flex;align-items:center;min-height:56px;font:500 26px/1.2 var(--font-display);color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.menu-links a[aria-current]{color:var(--ridge);text-decoration:underline}
.menu-contact{margin-top:24px}
.menu-contact a{display:inline-flex;align-items:center;min-height:48px}
body.menu-open{overflow:hidden}
@media (min-width:1024px){
 .nav-desk{display:flex;gap:4px;margin:0 auto}
 .nav-desk a{display:flex;align-items:center;min-height:48px;padding:0 10px;color:var(--ink);text-decoration:none;font-size:18px}
 .nav-desk a:hover,.nav-desk a[aria-current]{color:var(--ridge);text-decoration:underline}
 .hd-act{margin-left:0}
 .btn-menu{display:none}
 .call-short{display:none}.call-long{display:inline}
}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--btn-h);padding:0 28px;border-radius:var(--radius);font:700 19px/1 var(--font-text);text-decoration:none;cursor:pointer;border:2px solid transparent;text-align:center}
.btn-primary{background:var(--ridge);color:#fff}
.btn-primary:hover{background:var(--ridge-hover);color:#fff}
.btn-outline{background:transparent;color:var(--ridge);border-color:var(--ridge)}
.btn-outline:hover{background:var(--haze);color:var(--ridge-hover)}
.btn-quiet{background:transparent;color:var(--ridge);border-color:var(--ink-soft)}
.btn-block{display:flex;width:100%}
.btn[aria-disabled=true]{opacity:.75;cursor:progress}

/* bands */
.band{padding:var(--space-5) 0}
.band-haze{background:var(--haze)}
.band-ink{background:var(--ink);color:var(--paper)}
.band.tight-top{padding-top:var(--space-4)}
.page-top{padding-top:var(--space-4)}
.lede{font-size:clamp(20px,1.6vw,22px)}
@media (min-width:1024px){.band{padding:var(--space-6) 0}.page-top{padding-top:var(--space-5)}}

/* hero */
.hero{padding:32px 0 0}
.hero-alt{color:var(--ink-soft)}
.hero-alt a{display:inline-block;padding:12px 2px;margin:-12px 0}
.hero-art{margin-top:16px}
.hero-art .ridge-art{width:100%;height:120px}
.hero p .btn{margin-top:8px}
@media (min-width:1024px){
 .hero{padding:0}
 .hero-grid{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:center;min-height:70vh}
 .hero-art{align-self:end;margin:0}
 .hero-art .ridge-art{height:auto;aspect-ratio:600/240}
}

/* checks */
.checks{list-style:none;margin:var(--space-3) 0 0;padding:0;max-width:var(--measure)}
.checks li{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.chk{width:24px;height:24px;flex:none;margin-top:3px}

/* prices */
.tiers{margin:var(--space-3) 0}
.tier{padding:var(--space-3) 0;border-top:1px solid var(--line)}
.tier:last-child{border-bottom:1px solid var(--line)}
.tier h3{margin-bottom:4px}
.price{font:600 44px/1 var(--font-display);margin:0 0 16px;font-variant-numeric:lining-nums}
.tier-list{margin:0 0 12px;padding-left:1.1em}
.tier-list li{margin-bottom:4px}
.tlink{display:inline-flex;align-items:center;min-height:48px;font-weight:700}
.hosting-note{border-left:4px solid var(--ridge);padding-left:16px}
@media (min-width:1024px){
 .tiers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
 .tier,.tier:last-child{border:0;padding:var(--space-4) 32px;display:flex;flex-direction:column}
 .tier+.tier{border-left:1px solid var(--line)}
 .tier:first-child{padding-left:0}
 .tier .tlink{margin-top:auto}
 .price{font-size:56px}
}

/* how */
.steps-list{padding-left:1.3em;max-width:var(--measure);margin:0 0 var(--space-3)}
.steps-list li{margin-bottom:12px}

/* peak */
.peak{padding-top:0}
.peak-art img{width:100%;height:clamp(200px,42vw,520px);object-fit:cover;object-position:center bottom}
.peak .wrap{padding-top:var(--space-4)}
.peak h2{color:var(--paper)}
.mist{color:var(--mist)}
.btn-call-big{background:var(--ridge);color:#fff;width:100%;font-size:20px;border-color:var(--mist)}
.btn-call-big:hover{background:var(--ridge-hover);color:#fff}
.on-dark{color:var(--paper);display:inline-flex;align-items:center;min-height:48px}
.on-dark:hover{color:var(--mist)}
@media (min-width:768px){.btn-call-big{width:auto;padding:0 40px}}

/* teaser */
.teaser{display:grid;gap:24px}
.thumb{margin:0;max-width:320px}
.thumb figcaption{font-size:var(--fs-small);color:var(--ink-soft);margin-top:8px}
@media (min-width:768px){.teaser{grid-template-columns:1fr 320px;align-items:center}}

/* faq */
.faq{max-width:46em;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 0;font-weight:700;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.pm{flex:none;width:20px;height:20px;position:relative}
.pm::before,.pm::after{content:"";position:absolute;left:0;top:9px;width:20px;height:2px;background:var(--ridge)}
.pm::after{transform:rotate(90deg)}
details[open] .pm::after{display:none}
.faq details p{margin:0 0 20px}

/* quote flow */
.qf{max-width:36em;margin-top:var(--space-3)}
.step{border:0;margin:0;padding:0;min-width:0}
.step-ind{font-size:var(--fs-small);color:var(--ink-soft);margin:0 0 4px;font-weight:700}
.step-h{margin-bottom:var(--space-3)}
.step-h:focus{outline:none}
.radios{display:grid;gap:12px;margin-bottom:16px}
.radio,.check{display:flex;align-items:center;gap:14px;min-height:64px;padding:12px 16px;border:2px solid var(--ink-soft);border-radius:var(--radius);background:#fff;cursor:pointer}
.radio b{font-family:var(--font-display);font-weight:600;margin-left:6px}
.radio:has(input:checked){border-color:var(--ridge);box-shadow:inset 0 0 0 2px var(--ridge);background:#EEF4F7}
.radio input,.check input{width:24px;height:24px;margin:0;flex:none;accent-color:var(--ridge)}
.check{min-height:56px;border-width:0;background:transparent;padding-left:0}
.field{margin-bottom:20px}
.field label{display:block;font-weight:700;margin-bottom:6px}
.field input,.field textarea{display:block;width:100%;min-height:52px;padding:12px 14px;font:inherit;color:var(--ink);background:#fff;border:2px solid var(--ink-soft);border-radius:var(--radius)}
.field textarea{min-height:120px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-soft)}
.field.has-err input{border-color:var(--error)}
.field-err{color:var(--error);font-weight:700;margin:0 0 6px;font-size:var(--fs-small)}
.err-sum{border:3px solid var(--error);background:#fff;border-radius:var(--radius);padding:16px;margin-bottom:24px}
.err-sum p{margin:0 0 6px;font-weight:700;color:var(--error)}
.err-sum a{color:var(--error);display:inline-flex;min-height:48px;align-items:center;margin-right:12px}
.step-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.fine{font-size:var(--fs-small);color:var(--ink-soft)}
.fine a{display:inline-flex;min-height:48px;align-items:center}
.status{font-weight:700}
.status.is-error{color:var(--error);border-left:4px solid var(--error);padding-left:12px}
.qf-done{border-left:4px solid var(--spruce);padding:8px 0 8px 20px}
.qf-done .chk{width:40px;height:40px;margin-bottom:12px}
.qf-done h3:focus{outline:none}

/* other pages */
.plain{padding-left:1.2em;max-width:var(--measure)}
.plain li{margin-bottom:10px}
.chapters h2{margin-top:var(--space-4)}
.chapters h2:first-child{margin-top:0}
.srows{list-style:none;padding:0;margin:0 0 24px}
.srow{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.srow strong{display:block;font:600 var(--fs-h3)/1.25 var(--font-display)}
.srow small{font-size:var(--fs-small);color:var(--ink-soft)}
.sicon{width:56px;height:56px;border-radius:var(--radius);background:var(--paper);color:var(--ridge);display:grid;place-items:center;flex:none}
.sicon svg{width:32px;height:32px}
.art-band{max-width:1120px;margin:0 auto;padding:0 24px}
.wide-art img{width:100%;height:auto;border-radius:var(--radius)}
.prose h2{margin-top:var(--space-4)}
@media (max-width:420px){.h1-long{font-size:34px}}

/* footer */
.site-footer{background:var(--ink);color:var(--paper);padding:var(--space-5) 0 var(--space-3)}
.site-footer a{color:var(--paper)}
.site-footer a:hover{color:var(--mist)}
.ft-mark{color:var(--paper)}
.ft-grid{display:grid;gap:32px}
.ft-contact,.ft-links{list-style:none;margin:0;padding:0}
.ft-contact a,.ft-links a{display:flex;align-items:center;min-height:48px}
.ft-legal{color:var(--mist);font-size:var(--fs-small);margin-top:32px}
@media (min-width:768px){.ft-grid{grid-template-columns:1fr 1fr}}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
.wordmark span{white-space:nowrap}
.btn-call .ic{flex:none;width:20px;height:20px}
@media (max-width:419px){.hd-in{padding:0 12px 0 16px;gap:8px}.wordmark{font-size:18px;gap:8px}.wordmark .glyph{width:24px;height:24px}.btn-call{padding:0 14px}.btn-menu{padding:0 12px}.hd-act{gap:12px}}

/* ---- craft layer ---- */
:root{--measure:62ch}
body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;hanging-punctuation:first allow-end}
p,li{text-wrap:pretty}
h1{letter-spacing:-.018em}
h2{letter-spacing:-.012em}
h3{letter-spacing:-.01em}
.lede{color:var(--ink-soft);max-width:44ch}
.hero .lede{color:var(--ink)}
.band{padding:80px 0}
@media (min-width:1024px){.band{padding:128px 0}.band h2{margin-bottom:28px}}
.band h2+p{margin-top:-4px}
/* hover / press */
.btn,.btn-call,.btn-menu,.btn-close,.radio{transition:background-color .15s,color .15s,border-color .15s,transform .08s,box-shadow .15s}
.btn:active,.btn-call:active,.btn-menu:active,.btn-close:active{transform:translateY(1px) scale(.99)}
.btn-primary{box-shadow:0 1px 0 rgba(23,35,43,.25),inset 0 1px 0 rgba(255,255,255,.12)}
.btn-primary:hover{box-shadow:0 4px 14px -6px rgba(29,83,115,.7),inset 0 1px 0 rgba(255,255,255,.12)}
.btn-menu:hover,.btn-close:hover{border-color:var(--ink);background:var(--haze)}
.radio:hover{border-color:var(--ridge)}
.tlink .arr{display:inline-block;transition:transform .15s}
.tlink:hover .arr{transform:translateX(4px)}
.btn:focus-visible,.btn-call:focus-visible{outline:3px solid var(--ridge);outline-offset:3px;box-shadow:0 0 0 3px var(--paper)}
.band-ink .btn:focus-visible{outline-color:var(--paper);box-shadow:0 0 0 3px var(--ink)}
/* hero ridge planes */
.hero-art{overflow:hidden;margin-left:-24px;margin-right:-24px}
.hero-art .ridge-art{height:150px;width:100%}
.plane{will-change:transform}
.light{animation:glow 3.2s ease-in-out infinite}
@keyframes glow{50%{opacity:.35}}
@media (min-width:1024px){.hero-art{margin:0;border-radius:0}.hero-art .ridge-art{height:auto;aspect-ratio:600/260}}
/* peak band */
.peak{padding-top:0;position:relative}
.peak-art-wrap{overflow:hidden;position:relative}

.peak-art img{width:100%;height:clamp(220px,46vw,560px);object-fit:cover;object-position:center 70%;transform:translateY(var(--py,0));will-change:transform}
.peak-in{position:relative;margin-top:-24px}
.contour{width:min(520px,100%);height:auto;margin:0 0 20px}
.porch{animation:porch 4s ease-in-out infinite}
@keyframes porch{50%{opacity:.55}}
.peak h2{font-size:clamp(34px,5vw,56px);max-width:16ch}
@media (prefers-reduced-motion:reduce){.plane,.peak-art img{transform:none!important}.light,.porch{animation:none}}
.band.tight-top{padding-top:40px}
.peak.band{padding-top:0}
.peak-art img{transform:translateY(var(--py,0)) scale(1.14);transform-origin:center bottom}
@media (min-width:1024px){
 .hero.band{padding:0}
 .hero-grid{min-height:min(72vh,760px);align-items:end;padding-top:72px}
 .hero-text{padding-bottom:96px}
 .hero-art{margin-right:calc((100vw - 1120px)/-2 - 24px);align-self:end}
 .hero-art .ridge-art{aspect-ratio:auto;height:min(46vh,420px)}
 .band.tight-top{padding-top:64px}
}
@media (min-width:1024px){
 .hero{position:relative;overflow:hidden}
 .hero-grid{display:block;min-height:min(78vh,820px);padding-top:96px}
 .hero-text{max-width:720px;padding-bottom:calc(100vw * 260 / 1200 - 40px)}
 .hero-art{position:absolute;left:0;right:0;bottom:0;margin:0}
 .hero-art .ridge-art{width:100%;height:auto;aspect-ratio:1200/260}
}
@media (max-width:1023px){.hero.band{padding:40px 0 0}.hero-art .ridge-art{height:180px}}
.ft-links{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
@media (min-width:768px){.ft-links{grid-template-columns:1fr 1fr}}
.band.page-top{padding:48px 0 56px}
@media (min-width:1024px){.band.page-top{padding:96px 0 80px}}
.page-top .lede{max-width:52ch}
/* ===== round 2 layer ===== */
.arr{display:inline-block;margin-left:.4em;transition:transform .18s ease}
a:hover .arr{transform:translateX(3px)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.hero-mock{display:none}
/* device frames */
.dev-laptop{position:relative}
.dev-screen{background:#0E171D;border-radius:14px 14px 4px 4px;padding:3.2% 3.2% 2.6%;box-shadow:0 1px 0 #2a3a44 inset}
.dev-screen img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:3px}
.dev-base{height:12px;margin:0 -7%;background:#C9D3D8;border-radius:0 0 14px 14px;position:relative;box-shadow:0 18px 30px -18px rgba(23,35,43,.45)}
.dev-base::after{content:"";position:absolute;left:42%;right:42%;top:0;height:5px;background:#AEBBC2;border-radius:0 0 6px 6px}
.dev-phone{background:#0E171D;border-radius:30px;padding:7px;box-shadow:0 22px 40px -20px rgba(23,35,43,.55),0 0 0 1px #2a3a44 inset;width:150px}
.dev-phone img{display:block;width:100%;height:auto;aspect-ratio:390/844;object-fit:cover;object-position:top;border-radius:23px}
.sc-dev{position:relative;padding:0 6% 28px 0}
.sc-dev .over{position:absolute;right:0;bottom:0;width:30%}
/* samples section: full-bleed */
.samples{background:var(--haze);padding:var(--space-5) 0 var(--space-5)}
.wrap-wide{max-width:1280px;margin:0 auto;padding:0 24px}
.kicker{font-size:15px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--spruce);margin-bottom:8px}
.sh-head{max-width:40em;margin-bottom:var(--space-4)}
.sh-head h2{font-size:clamp(30px,4.4vw,48px);letter-spacing:-.02em;line-height:1.05}
.sc-list{list-style:none;margin:0;padding:0;display:grid;gap:56px}
.sc-link{display:block;text-decoration:none;color:var(--ink);border-radius:16px;outline-offset:8px}
.sc-tag{font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:20px 0 4px}
.sc h3{font-size:26px;margin:0 0 4px;letter-spacing:-.01em}
.sc-look{color:var(--ink-soft);margin:0 0 10px}
.sc-go{display:inline-flex;align-items:center;min-height:48px;font-weight:700;color:var(--ridge);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.sc-link:hover .sc-go{color:var(--ridge-hover)} .sc-link:hover .arr{transform:translateX(3px)}
.sc-link:hover .dev-laptop{transform:translateY(-4px)} .dev-laptop,.dev-phone{transition:transform .25s ease}
.sc-link:active .dev-laptop{transform:translateY(-1px)}
.sc-more{margin-top:var(--space-4)} .sc-more a{display:inline-flex;align-items:center;min-height:48px;font-weight:700}
@media (min-width:900px){
 .sc-list{grid-template-columns:repeat(6,1fr);gap:64px 48px}
 .sc-cafe{grid-column:1/5}
 .sc-contractor{grid-column:5/7;grid-row:1;align-self:end}
 .sc-salon{grid-column:2/6}
 .sc-contractor .sc-dev{padding:0}
 .sc-contractor .dev-laptop{display:none}
 .sc-contractor .sc-dev .over{position:static;width:min(240px,100%);margin:0 auto}
 .dev-phone{width:auto}
}
/* hero mock (desktop) */
@media (min-width:1024px){
 .hero-grid{position:relative}
 .hero-text{max-width:560px;position:relative;z-index:2}
 .hero-mock{display:block;position:absolute;z-index:1;right:0;top:64px;width:min(46vw,600px);text-decoration:none;border-radius:16px}
 .hero-mock .over{position:absolute;width:25%;right:-3%;bottom:-36px}
 .mock-tag{position:absolute;left:0;top:-34px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
 .hero-mock:hover .dev-laptop{transform:translateY(-4px)}
 .hero-grid{min-height:min(84vh,860px)}
 .hero-art{z-index:0}
}
@media (min-width:1024px) and (max-width:1200px){.hero-mock{width:44vw}.hero-text h1{font-size:52px}}
/* split layouts */
.split-in{display:grid;gap:var(--space-3)}
@media (min-width:900px){.split-in{grid-template-columns:5fr 7fr;gap:64px;align-items:start}.split-in>h2{position:sticky;top:96px;font-size:clamp(32px,3.4vw,44px)}.split .checks{margin-top:0}.split .checks li{font-size:20px}}
.faq-split .faq{max-width:none}
/* inset panels */
.inset-wrap{padding:var(--space-5) 16px}
.inset{max-width:1180px;margin:0 auto;border-radius:24px;padding:var(--space-4) 20px}
.inset-head{margin-bottom:var(--space-3)} .inset-head p{color:var(--ink-soft)}
@media (min-width:768px){.inset{padding:var(--space-5) 48px}}
.more-link a{display:inline-flex;align-items:center;min-height:48px;font-weight:700}
/* tier cards */
.tiers,.tiers .tier{border:0!important}
.tiers{display:grid;gap:20px;margin:0 0 20px}
.tier{background:#fff;border-radius:18px!important;padding:28px 24px!important;display:flex;flex-direction:column;box-shadow:0 0 0 1px rgba(23,35,43,.10)}
.tier h3{font-size:24px;margin:0}
.tier .price{font-family:var(--font-display);font-size:44px;font-weight:600;letter-spacing:-.02em;margin:6px 0 4px;line-height:1}
.tier .price small{font:400 16px var(--font-text);color:var(--ink-soft);letter-spacing:0}
.fit{color:var(--ink-soft);font-size:17px;margin:4px 0 16px}
.tier-list{list-style:none;padding:0;margin:0 0 24px}
.tier-list li{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.tick{width:20px;height:20px;flex:none;margin-top:3px}
.tbtn{margin-top:auto;width:100%;font-size:18px}
.tier-pop{box-shadow:0 0 0 3px var(--ridge),0 24px 40px -28px rgba(29,83,115,.6)}
.badge{align-self:flex-start;background:var(--ridge);color:#fff;font-size:14px;font-weight:700;letter-spacing:.04em;border-radius:999px;padding:6px 12px;margin:0 0 12px}
@media (min-width:900px){.tiers{grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}.tiers .tier+.tier{border-left:0!important}.tier:first-child{padding-left:24px!important}.tier-pop{transform:translateY(-12px)}}
.addon{display:flex;gap:16px;align-items:flex-start;background:var(--paper);border:2px dashed var(--line);border-radius:18px;padding:20px 24px}
.addon h3{font-size:21px;margin:0 0 4px} .addon p{margin:0;color:var(--ink-soft)}
.addon-tag{flex:none;margin:2px 0 0;background:var(--spruce);color:#fff;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:6px;padding:5px 9px}
/* how: horizontal on desktop */
.how .steps-list{list-style:none;padding:0;counter-reset:s;max-width:none}
.how .steps-list li{counter-increment:s;position:relative;padding:0 0 0 56px;margin-bottom:24px}
.how .steps-list li::before{content:counter(s);position:absolute;left:0;top:-4px;width:40px;height:40px;border-radius:50%;border:2px solid var(--ridge);color:var(--ridge);font:600 20px/36px var(--font-display);text-align:center}
.how .steps-list b{display:block}
@media (min-width:900px){.how .steps-list{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.how .steps-list li{padding:56px 0 0}.how .steps-list li::after{content:"";position:absolute;left:52px;right:-28px;top:16px;border-top:2px dotted var(--line)}.how .steps-list li:last-child::after{display:none}}
/* owner note placeholder */
.trust{padding-top:0}
.owner-note{max-width:760px;margin:0 auto;border:2px dashed var(--ink-soft);border-radius:20px;padding:28px 28px 24px;background:repeating-linear-gradient(-45deg,transparent 0 14px,rgba(169,199,214,.18) 14px 15px)}
.ph-tag{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--paper);border-radius:6px;padding:5px 10px}
.ph-q{font-family:var(--font-display);font-size:clamp(26px,3vw,34px);font-weight:500;margin:10px 0 6px;font-style:italic}
.ph-help{color:var(--ink-soft)}
.ph-lines span{display:block;height:10px;border-radius:5px;background:rgba(74,89,99,.16);margin:10px 0;width:92%}
.ph-lines span:nth-child(2){width:80%} .ph-lines span:nth-child(3){width:46%}
/* peak band */
.peak-art-wrap .ridge-art{display:block;width:100%;height:clamp(200px,30vw,400px)}
.btn-call-big{gap:12px} .btn-call-big .ic{width:24px;height:24px}
.on-dark{text-decoration:underline;text-underline-offset:4px}
.porch{animation:porch 4s ease-in-out infinite;transform-origin:474px 22px}
/* quote panel */
.quote-panel{background:#fff;box-shadow:0 0 0 1px rgba(23,35,43,.10);max-width:860px}
.check{align-items:flex-start}
.check input{margin-top:2px}
.check-t{display:block;line-height:1.35}
.check-t small{display:block;color:var(--ink-soft);font-size:16px;margin-top:2px}
.pay-note{background:var(--haze);border-radius:10px;padding:12px 14px}
.art-band .ridge-art{display:block;width:100%;height:clamp(160px,24vw,320px)}
@media (prefers-reduced-motion:reduce){.arr,.dev-laptop,.dev-phone{transition:none}a:hover .arr,.sc-link:hover .dev-laptop,.hero-mock:hover .dev-laptop{transform:none}}
@media (min-width:1024px){
 .hero-art{left:calc(50% - 50vw)!important;right:calc(50% - 50vw)!important}
 .hero-text{max-width:calc(100% - min(46vw,600px) - 56px)}
 .hero-grid{min-height:min(88vh,880px)}
}
@media (min-width:1024px){
 .hero-text{max-width:500px}
 .hero-text h1{font-size:clamp(46px,4.1vw,60px)}
 .hero-ctas .btn{min-width:0}
 .hero-grid{min-height:min(86vh,800px);padding-bottom:200px}
 .hero-mock{top:auto;bottom:120px;width:min(44vw,580px)}
}
@media (min-width:1024px){
 .hero-grid{display:grid!important;grid-template-columns:minmax(0,500px) 1fr;gap:48px;align-items:center;min-height:0;padding-top:40px;padding-bottom:120px}
 .hero-mock{position:relative;top:auto;bottom:auto;right:auto;width:100%;max-width:600px;justify-self:end;margin:36px 2% -130px 0}
}
/* r2 critique fixes */
.addon .addon-tag{color:#fff}
@media (max-width:599px){.addon{flex-direction:column;gap:10px;padding:18px}}
.tier{position:relative}
.tier-pop .badge{position:absolute;top:-15px;left:24px;margin:0}
@media (max-width:899px){.tier-pop{margin-top:12px}}
@media (max-width:599px){.inset-wrap{padding-left:12px;padding-right:12px}.inset{padding:32px 16px}.trust .wrap{padding:0 8px}.owner-note{padding:22px 18px}}
.call-short+.call-long{margin-left:.35em}
@media (min-width:900px){.peak-cols{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:end}.peak-act{justify-self:end;text-align:left}.peak-act p:first-child{margin-bottom:8px}}
.inset-wrap+.band{padding-top:var(--space-3)}
/* r3: mobile hero phone */
.hero-phone{display:flex;align-items:center;gap:16px;margin-top:4px;text-decoration:none;color:var(--ink);border-radius:16px;max-width:340px}
.hero-phone .dev-phone{width:92px;padding:4px;border-radius:18px;flex:none;box-shadow:0 14px 24px -14px rgba(23,35,43,.55)}
.hero-phone .dev-phone img{border-radius:14px}
.hp-cap{font-weight:700;font-size:16px;line-height:1.35;color:var(--ridge);text-decoration:underline;text-underline-offset:4px}
@media (max-width:1023px){
 .hero-text h1{font-size:clamp(30px,8.4vw,40px);margin-bottom:10px}
 .hero-text .lede{margin-bottom:14px}
 .hero-ctas{gap:10px;margin-bottom:8px}
 .hero-ctas .btn{min-height:52px;padding:0 18px;font-size:17px;flex:1 1 auto}
 .hero-alt{margin-bottom:12px}
}
@media (min-width:1024px){.hero-phone{display:none}}
@media (max-width:374px){.hd-in{padding-left:14px;padding-right:14px;gap:8px}.wordmark span{font-size:16px}.wordmark .glyph{width:26px;height:26px}.hd-act{gap:6px}.btn-call{padding:0 12px}.btn-menu{padding:0 10px}}

/* v2: anchor targets clear the sticky header */
html{scroll-padding-top:72px}
.ts-box{margin:12px 0}