/* STILLWIND — still-wind.com
   Walnut & Ember. Fraunces headings, Jost body, Cormorant italic for quotes,
   Montserrat for the wordmark only. See STILLWIND-BRAND.md. */

:root{
  --ember:#C4784A; --ember-dk:#A9623A;
  --walnut:#4A3B30; --walnut-dk:#3A2E25;
  --oat:#EFE8DC; --bark:#33291F; --driftwood:#9A8C7C;
  --sage:#7A8C6E; --copper:#B87333; --paper:#FBF9F5;
  --line:#DDD3C3; --line-dk:#5E4D40;
  --muted:#6E6153;
  --max:1180px; --gutter:clamp(16px,4vw,40px);
  --radius:6px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--bark);font:300 17px/1.7 'Jost',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:400;line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(38px,5.6vw,68px)}
h2{font-size:clamp(30px,3.8vw,46px)}
h3{font-size:clamp(21px,2vw,25px);font-weight:500}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.eyebrow{font:500 12px/1 'Jost',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--driftwood);margin:0 0 18px}
.lede{font-size:clamp(18px,1.6vw,21px);color:var(--muted);max-width:40em}
.quote{font:italic 400 clamp(24px,2.6vw,34px)/1.35 'Cormorant Garamond',Georgia,serif}
.muted{color:var(--muted)}
.small{font-size:14px}
.skip{position:absolute;left:-999px;top:0;background:var(--bark);color:var(--paper);padding:10px 14px;z-index:99}
.skip:focus{left:8px;top:8px}

/* Wordmark — Montserrat, caps, 0.28em, WIND italic */
.wordmark{font-family:'Montserrat',sans-serif;font-weight:300;letter-spacing:.28em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.wordmark i{font-style:italic}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 13px/1 'Jost',sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:17px 28px;border-radius:var(--radius);border:1px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s;min-height:48px}
.btn--ember{background:var(--ember);color:var(--paper)}
.btn--ember:hover{background:var(--ember-dk)}
.btn--line{border-color:currentColor;background:transparent}
.btn--line:hover{background:var(--bark);color:var(--paper);border-color:var(--bark)}
.on-dark .btn--line:hover{background:var(--oat);color:var(--walnut);border-color:var(--oat)}
.btn[disabled]{opacity:.55;cursor:default}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

/* Header */
.site-head{position:sticky;top:0;z-index:40;background:rgba(251,249,245,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.site-head .wordmark{font-size:17px;color:var(--bark)}
.nav{display:flex;gap:30px;align-items:center}
.nav a{font-size:14px;letter-spacing:.06em;text-decoration:none;color:var(--bark);padding:6px 0;border-bottom:1px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-bottom-color:var(--ember)}
.nav .btn{padding:12px 18px;min-height:0;font-size:12px}
.nav .btn,.nav .btn:hover{border-bottom:1px solid transparent;color:var(--paper)}
.menu-btn{display:none;background:none;border:0;padding:10px;margin-right:-10px;cursor:pointer;color:var(--bark)}
@media (max-width:860px){
  .menu-btn{display:block}
  .nav{position:fixed;inset:72px 0 auto 0;background:var(--paper);flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gutter) 24px;border-bottom:1px solid var(--line);display:none}
  .nav.open{display:flex}
  .nav a{padding:15px 0;border-bottom:1px solid var(--line);font-size:16px}
  .nav .btn{margin-top:18px;padding:16px}
}

/* Sections */
section{padding:clamp(64px,9vw,120px) 0}
.on-oat{background:var(--oat)}
.on-dark{background:var(--walnut);color:var(--oat)}
.on-dark .eyebrow{color:#C9B9A5}
.on-dark .lede,.on-dark .muted{color:#D8CCBC}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px);align-items:center}
.split--wide-img{grid-template-columns:1.15fr .85fr}
@media (max-width:860px){.split,.split--wide-img{grid-template-columns:1fr}}
.frame{overflow:hidden;border-radius:var(--radius);background:var(--oat)}
.frame img{width:100%;height:100%;object-fit:cover}

/* Hero */
.hero{padding:0;background:var(--walnut-dk);color:var(--oat);position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;min-height:min(86vh,760px);align-items:center;gap:40px}
.hero-copy{padding:80px 0;position:relative;z-index:2}
.hero h1{color:var(--paper)}
.hero .lede{color:#D8CCBC}
.hero-img{position:absolute;inset:0 0 0 45%}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:40% 50%}
.hero-img::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--walnut-dk) 0%,rgba(58,46,37,.55) 22%,rgba(58,46,37,0) 50%);z-index:1}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;min-height:0}
  .hero-img{position:relative;inset:auto;height:62vw;max-height:460px;margin:0 calc(-1*var(--gutter))}
  .hero-img::before{background:linear-gradient(0deg,var(--walnut-dk) 0%,rgba(58,46,37,0) 40%)}
  .hero-copy{padding:36px 0 64px}
}

/* Page head (inner pages) */
.page-head{padding:clamp(56px,8vw,100px) 0 clamp(40px,5vw,64px);border-bottom:1px solid var(--line)}
.page-head .lede{margin-top:10px}

/* Cards / grids */
.grid{display:grid;gap:clamp(20px,3vw,34px)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.grid-2,.grid-3{grid-template-columns:1fr}}

.line-card{display:block;text-decoration:none;background:var(--paper);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}
.line-card .frame{aspect-ratio:4/5;border-radius:0}
.line-card .body{padding:26px 26px 30px}
.line-card .go{font:500 12px/1 'Jost';letter-spacing:.16em;text-transform:uppercase;color:var(--ember-dk)}
.line-card:hover .go{text-decoration:underline;text-underline-offset:4px}

.feature{padding-top:22px;border-top:1px solid var(--line)}
.on-dark .feature{border-top-color:var(--line-dk)}
.feature h3{margin-bottom:8px}
.feature p{color:var(--muted);margin:0}
.on-dark .feature p{color:#D8CCBC}

/* Variant chooser */
.chooser{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:860px){.chooser{grid-template-columns:1fr}}
.chooser .frame{aspect-ratio:1/1;background:#fff;border:1px solid var(--line)}
.chooser .frame img{object-fit:contain}
.opt-group{margin:26px 0}
.opt-label{font:500 12px/1 'Jost';letter-spacing:.18em;text-transform:uppercase;color:var(--driftwood);margin-bottom:12px;display:block}
.opts{display:flex;flex-wrap:wrap;gap:10px}
.opt{font:400 15px/1 'Jost';padding:13px 18px;border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);cursor:pointer;color:var(--bark);min-height:46px}
.opt:hover{border-color:var(--driftwood)}
.opt[aria-pressed=true]{border-color:var(--bark);box-shadow:inset 0 0 0 1px var(--bark)}
.swatch{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:8px;vertical-align:-2px;border:1px solid rgba(0,0,0,.15)}
.design-note{color:var(--muted);font-size:15px;min-height:3.4em}
.included{list-style:none;padding:0;margin:26px 0 0;border-top:1px solid var(--line)}
.included li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.amazon-note{font-size:13px;color:var(--muted);margin-top:14px}

/* Book offer */
.offer{background:var(--paper);color:var(--bark);border-radius:var(--radius);padding:clamp(28px,4vw,44px);border:1px solid var(--line)}
.price{font-family:'Fraunces',serif;font-size:52px;line-height:1;margin:6px 0 4px}
.price small{font:400 15px 'Jost';color:var(--muted);margin-left:8px}
.ticks{list-style:none;padding:0;margin:22px 0}
.ticks li{padding:9px 0 9px 28px;position:relative;border-bottom:1px solid var(--line);font-size:15.5px}
.ticks li::before{content:"";position:absolute;left:2px;top:17px;width:12px;height:7px;border-left:1.5px solid var(--ember);border-bottom:1.5px solid var(--ember);transform:rotate(-45deg)}
.form-row{margin:18px 0 0}
.form-row label{display:block;font-size:14px;margin-bottom:6px}
.input{width:100%;font:400 16px 'Jost';padding:14px 14px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--bark)}
.input:focus{outline:2px solid var(--ember);outline-offset:1px}
.err{color:#AE3626;font-size:14px;margin-top:10px;min-height:1em}

.steps-list{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.steps-list li{counter-increment:s;border-top:1px solid var(--line);padding-top:22px}
.steps-list li::before{content:counter(s);font-family:'Fraunces',serif;font-size:34px;color:var(--ember);display:block;margin-bottom:6px;line-height:1}
@media (max-width:760px){.steps-list{grid-template-columns:1fr}}

.spread{border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 60px -30px rgba(51,41,31,.45)}

/* FAQ */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;list-style:none;font-family:'Fraunces',serif;font-size:21px;padding:20px 40px 20px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:300 28px 'Jost';color:var(--ember)}
.faq details[open] summary::after{content:"−"}
.faq details p{color:var(--muted);max-width:44em}
.faq h2{margin-top:56px;font-size:28px}

/* Footer */
.site-foot{background:var(--bark);color:#CDBFAE;padding:64px 0 36px;font-size:15px}
.site-foot .wordmark{font-size:19px;color:var(--oat)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1/-1}}
.site-foot h4{font:500 12px/1 'Jost';letter-spacing:.18em;text-transform:uppercase;color:var(--driftwood);margin:6px 0 16px}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin:0 0 9px}
.site-foot a{text-decoration:none}
.site-foot a:hover{color:var(--oat);text-decoration:underline;text-underline-offset:3px}
.foot-base{border-top:1px solid #4A3E33;margin-top:44px;padding-top:22px;font-size:13px;color:#A8998A;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

.center{text-align:center}
.mx-auto{margin-left:auto;margin-right:auto}
.mt-0{margin-top:0}
.notice{background:var(--oat);border-left:3px solid var(--ember);padding:16px 20px;border-radius:var(--radius);font-size:15.5px}
.offer .muted{color:var(--muted)}
.offer .eyebrow{color:var(--driftwood)}
.offer a{color:var(--ember-dk)}