/* Home v3: bigger hero, scroll-letter, patterns, plan. Same palette + fonts as the rest of the site. */
@font-face{font-family:'Caveat';src:url(cinematic/rendered/Caveat.woff2) format('woff2');font-display:swap}
:root{--deep-rose:#8a2946;--wine-2:#3a1a28}
html{scroll-behavior:smooth}

/* ---------- Header cart pill ---------- */
.cart-pill{background:var(--paper);color:var(--wine)!important;font-weight:700;padding:10px 18px;border-radius:999px;border:1px solid var(--paper);white-space:nowrap;transition:transform .2s,background .2s}
.cart-pill:hover{transform:translateY(-1px);background:#fff}
@media(max-width:650px){.cart-pill{display:none}nav.open .cart-pill{display:inline-block;align-self:flex-start}}

/* ---------- Mobile sticky buy bar ---------- */
.buy-bar{display:none}
@media(max-width:650px){
 .buy-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--wine);color:var(--paper);border-top:1px solid #6d3546;transform:translateY(110%);transition:transform .35s}
 .buy-bar.show{transform:none}
 .buy-bar span{font-size:15px}.buy-bar .button{width:auto;min-height:46px;padding:10px 20px;margin:0;background:var(--paper);color:var(--wine)}
 body{padding-bottom:0}
}

/* ---------- Hero: the line people see first ---------- */
.scroll-story .hero{grid-template-columns:minmax(0,1.65fr) minmax(0,.75fr);gap:36px;padding-left:max(36px,calc((100vw - 1260px)/2));padding-right:max(36px,calc((100vw - 1260px)/2))}
.hero .eyebrow{font-size:13px;letter-spacing:.16em;color:#efce9e}
.hero h1{font-size:clamp(40px,5.8vw,90px);line-height:1.02;letter-spacing:-.045em;margin:18px 0 28px;max-width:15.5em}
.hero h1 em{display:block;color:#f2b9c4;margin-top:.08em}
.hero .support{font-size:clamp(19px,1.7vw,24px);line-height:1.5;color:#f6e7ea;max-width:30em;margin:0}
.hero .actions{margin-top:30px;gap:26px}
.hero small{font-size:14px;margin-top:20px;color:#e9d3d8}
.hero .light-link{font-size:17px}
@media(max-width:900px){.scroll-story .hero{grid-template-columns:1fr}.hero h1{font-size:clamp(38px,8.4vw,64px)}}
@media(max-width:650px){
 .hero h1{font-size:clamp(34px,9.4vw,42px);margin:12px 0 16px;line-height:1.04}
 .hero .support{font-size:17px;line-height:1.5}
 .hero .actions{margin-top:20px}
}

/* ---------- The letter that drifts down ---------- */
.letter-scene{position:relative;background:linear-gradient(180deg,var(--wine) 0,var(--wine) 6%,#3a1a28 18%,#6a3446 34%,var(--paper) 62%,var(--paper) 100%);padding:20vh 22px 16vh;perspective:1500px;overflow:hidden;isolation:isolate}
.letter-lead{text-align:center;margin-bottom:5vh}
.letter-lead .eyebrow{color:#efce9e;font-size:13px}
.paper{position:relative;max-width:780px;margin:0 auto;padding:clamp(34px,6.5vw,80px) clamp(24px,6.5vw,84px);background:
 linear-gradient(180deg,transparent calc(33.3% - 1px),#2a111e0f 33.3%,transparent calc(33.3% + 14px)),
 linear-gradient(180deg,transparent calc(66.6% - 1px),#2a111e0f 66.6%,transparent calc(66.6% + 14px)),
 linear-gradient(135deg,#fffaf0,#fbf1de);color:#3b2430;border-radius:3px;box-shadow:0 50px 90px -34px #0009,0 18px 30px -18px #0006,inset 0 0 0 1px #e8d6bd;transform-origin:50% 0;will-change:transform}
.paper-eyebrow{display:block;font:700 13px/1 'DM Sans',Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--deep-rose);margin-bottom:22px}
.paper h2{font-size:clamp(40px,5.4vw,66px);line-height:1.04;margin:0 0 30px;color:#2a111e}
.paper p{font-size:clamp(18px,1.5vw,20px);line-height:1.75;margin:0 0 1.15em;max-width:none}
.paper .signature{font:400 clamp(40px,5vw,56px)/1.1 'Caveat',cursive;color:#2a111e;margin-top:38px}
.paper mark.scribble{background:none;color:inherit;position:relative;white-space:nowrap;padding:0 .1em;font-style:italic}
.paper mark.scribble::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-.18em;height:.5em;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M2 12 C30 3 60 18 100 9 S170 5 198 11' fill='none' stroke='%23b9425d' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}

/* ---------- Slim banner ---------- */
.babysit-band{background:var(--wine);color:var(--paper);display:flex;align-items:center;justify-content:center;gap:28px;flex-wrap:wrap;text-align:center;padding:30px 24px;border-top:1px solid #6d3546;border-bottom:1px solid #6d3546}
.babysit-band p{margin:0;font:400 clamp(22px,2.7vw,34px)/1.25 Georgia,serif;letter-spacing:-.02em}
.babysit-band em{color:#f2b9c4}
.babysit-band a{color:var(--gold);text-decoration:none;border-bottom:1px solid var(--gold);font-size:15px;padding:6px 0;font-weight:600}

/* ---------- Big, calm statements on cream ---------- */
.behind,.gym{max-width:1000px;text-align:left}
.behind .eyebrow,.gym .eyebrow{display:block;color:var(--deep-rose);font-size:13px;margin-bottom:18px}
.behind h2,.gym h2{font-size:clamp(44px,6.4vw,84px);line-height:1.02;letter-spacing:-.045em;margin:0 0 36px}
.gym h2 em{color:var(--deep-rose)}
.behind-copy p,.gym-copy p{font-size:clamp(19px,1.6vw,22px);line-height:1.7;max-width:36em}
.gym-copy .gym-turn{margin-top:2em;padding:28px 0 0 28px;border-left:3px solid var(--rose);font-family:Georgia,serif;font-size:clamp(22px,2.1vw,28px);line-height:1.5;color:#2a111e;letter-spacing:-.01em}

/* ---------- Three patterns (dark panel for contrast) ---------- */
.band-wine{background:radial-gradient(ellipse at 15% 0,#542333 0,#2a111e 62%);color:var(--paper)}
.patterns{padding-top:90px;padding-bottom:100px}
.patterns h2{font-size:clamp(38px,5.2vw,68px);margin:0 0 34px;color:var(--paper)}
.patterns .eyebrow{color:#efce9e;font-size:13px}
.pattern-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:34px}
.pattern-tabs button{font:600 16px 'DM Sans',Arial,sans-serif;color:var(--paper);background:transparent;border:1px solid #936075;border-radius:999px;padding:13px 22px;min-height:48px;cursor:pointer;transition:background .2s,color .2s}
.pattern-tabs button:hover{background:#ffffff14}
.pattern-tabs button[aria-selected=true]{background:var(--paper);color:var(--wine);border-color:var(--paper)}
.pattern-tabs button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.pattern-panel blockquote{margin:0;max-width:30em;font:400 clamp(26px,3.4vw,44px)/1.25 Georgia,serif;letter-spacing:-.025em;color:#fff4e4}
.pattern-panel[hidden]{display:none}

@media(prefers-reduced-motion:reduce){.paper{transform:none!important;opacity:1!important}}
body.motion-off .paper{transform:none!important;opacity:1!important}

/* alignment: use the same left edge as the other sections */
.behind,.gym{max-width:1260px}
.behind-copy,.gym-copy{max-width:760px}
@media(max-width:650px){
 .hero .mini-books{display:none}
 .hero-art{display:block;margin-top:6px}
 .hero-knot{height:130px}
 .hero-art .rope-caption{margin:4px 0 0}
}
.gym h2 em{display:block}
@media(max-width:650px){
 .scroll-story .hero{padding-top:18px;padding-bottom:18px}
 .hero h1{font-size:clamp(36px,10.4vw,46px);margin:10px 0 12px}
 .hero .support{font-size:16.5px}
 .hero .actions{margin-top:16px;gap:12px}
 .hero small{margin-top:12px}
}

/* ---- Letter = the real workbook page, unchanged ---- */
.paper-image{padding:0;background:none;max-width:900px;overflow:hidden;line-height:0;margin:0 auto}
.paper-image img{display:block;width:100%;height:auto}
.letter-actions{max-width:900px;margin:22px auto 0;text-align:center}
.letter-actions .text-button{color:#59293d;font-size:16px;min-height:44px;display:inline-block;padding:8px}
.letter-text{max-width:900px;margin:10px auto 0;border-top:1px solid #cbb6ae;padding:20px 4px;color:#3b2430}
.letter-text summary{font:600 17px 'DM Sans',Arial,sans-serif;cursor:pointer;min-height:44px;display:flex;align-items:center}
.letter-text h3{font-size:30px;margin:18px 0 14px}
.letter-text p{font-size:18px;line-height:1.7;max-width:36em}
.letter-text .signature{font:400 34px/1.2 'Caveat',cursive}

/* ---- Lifter doodle ---- */
.gym-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.lifter{flex:0 0 clamp(150px,17vw,230px);width:clamp(150px,17vw,230px);height:auto;overflow:visible;margin-bottom:34px}
.lifter *{fill:none;stroke:#2a111e;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.lifter .floor{stroke:#cbb6ae;stroke-width:3}
.lifter .plate{fill:#8a2946;stroke:#8a2946;stroke-width:2}
.lifter .bar{stroke-width:6}
@media(max-width:650px){.gym-head{flex-direction:column;align-items:flex-start;gap:0}.lifter{margin:0 0 26px;order:2;flex-basis:auto;width:150px}}

/* ---- Pattern tab detail + logo barbell ---- */
.pattern-detail{max-width:38em;margin-top:30px;display:grid;gap:16px}
.pattern-says{margin:0;font-size:clamp(19px,1.7vw,23px);line-height:1.55;color:#f6e7ea}
.pattern-kit{margin:0;padding-top:18px;border-top:1px solid #6d3546;color:#e9d3d8;font-size:17px;line-height:1.6}
.pattern-kit b{display:block;color:#efce9e;font:700 13px/1 'DM Sans',Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}
.lifter image{stroke:none}
.lifter{flex-basis:clamp(170px,19vw,250px);width:clamp(170px,19vw,250px)}
