

:root { --cream:#f4efe5; --paper:#fbf8f1; --green:#243e32; --green-2:#506455; --sage:#dce1d5; --terra:#b96847; --ink:#213028; --line:rgba(36,62,50,.17); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { --display:'Cormorant Garamond', Georgia, serif; --sans:'DM Sans', Arial, sans-serif; margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }
.announcement { min-height:32px; display:flex; align-items:center; justify-content:center; background:var(--green); color:#eef0e8; font-size:11px; letter-spacing:.055em; padding:7px 20px; text-align:center; }
.announcement span { color:#d58b6c; padding:0 8px; }
.site-header { height:78px; position:sticky; top:0; z-index:30; display:grid; grid-template-columns:200px 1fr 200px; align-items:center; padding:0 clamp(24px,4.2vw,72px); background:rgba(251,248,241,.96); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.logo { font-weight:600; font-size:17px; line-height:.82; letter-spacing:.19em; color:var(--green); }
.logo i { display:block; font-family:var(--display); font-weight:500; letter-spacing:.35em; font-size:12px; margin-top:5px; font-style:normal; }
nav { display:flex; gap:clamp(20px,2.2vw,38px); justify-content:center; font-size:13px; }
nav a,.header-actions a,.header-actions button { transition:opacity .2s; }
nav a:hover,.header-actions a:hover,.header-actions button:hover { opacity:.55; }
.header-actions { display:flex; justify-content:flex-end; gap:22px; font-size:12px; }
.header-actions button,.mobile-icon { border:0; background:none; color:inherit; padding:0; cursor:pointer; }
.header-actions span { opacity:.55; }
.mobile-icon { display:none; }
.search-panel { position:absolute; left:0; right:0; top:77px; padding:28px clamp(24px,7vw,120px); background:var(--paper); border-bottom:1px solid var(--line); display:grid; grid-template-columns:auto 1fr auto; align-items:end; gap:30px; box-shadow:0 12px 30px rgba(33,48,40,.08); }
.search-panel label { font-family:var(--display); font-size:28px; }
.search-panel input { border:0; border-bottom:1px solid var(--green); background:transparent; padding:12px 2px; outline:none; }
.search-panel button { border:0; background:none; cursor:pointer; font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.hero { min-height:650px; display:grid; grid-template-columns:minmax(340px,.82fr) 1.18fr; background:var(--cream); }
.hero-copy { padding:clamp(60px,9vw,130px) clamp(36px,6.3vw,96px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.eyebrow { font-size:10px!important; line-height:1.4!important; font-weight:600; letter-spacing:.2em; text-transform:uppercase; margin:0 0 24px; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:var(--display); font-weight:500; letter-spacing:-.03em; }
h1 { font-size:clamp(54px,5.3vw,82px); line-height:.93; max-width:620px; margin-bottom:30px; }
.hero-copy>p:not(.eyebrow) { color:#56645c; line-height:1.75; max-width:500px; font-size:16px; }
.hero-image { min-height:650px; background:url('/hero-zuvee-duvee.webp') center/cover no-repeat; }
.button-row { display:flex; gap:30px; align-items:center; margin-top:22px; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; padding:0 26px; font-size:12px; letter-spacing:.04em; transition:transform .2s, background .2s; }
.button:hover { transform:translateY(-2px); }
.button.primary { background:var(--green); color:#fff; }
.button.outline { border:1px solid currentColor; }
.text-link { display:inline-flex; align-items:center; gap:12px; padding-bottom:5px; border-bottom:1px solid currentColor; font-size:12px; letter-spacing:.04em; }
.text-link span { color:var(--terra); }
.section { padding:clamp(88px,9vw,140px) clamp(22px,5vw,72px); }
.section-heading { margin-bottom:55px; }
.section-heading.centered { text-align:center; max-width:760px; margin:0 auto 60px; }
.section-heading.split { display:flex; align-items:flex-end; justify-content:space-between; }
.section-heading h2,.philosophy h2,.story-copy h2,.why-section h2,.process-section h2,.retention-section h2,.community-copy h2 { font-size:clamp(44px,4.3vw,65px); line-height:1; margin-bottom:16px; }
.section-heading>p:not(.eyebrow),.section-heading>div>p:not(.eyebrow) { color:#647069; margin-bottom:0; line-height:1.7; }
.age-section { background:var(--paper); }
.age-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1320px; margin:auto; }
.age-card { position:relative; display:grid; grid-template-columns:36px 1fr auto; align-items:end; min-height:540px; overflow:hidden; color:white; padding:28px; background:var(--green); }
.age-photo { position:absolute; inset:0; background:url('/age-zuvee-duvee.webp') center/cover no-repeat; transition:transform .5s; }
.age-photo:after { content:""; position:absolute; inset:25% 0 0; background:linear-gradient(transparent,rgba(21,34,27,.78)); }
.age-card:hover .age-photo { transform:scale(1.025); }
.age-card>span,.age-card>div,.age-card>b { position:relative; z-index:1; }
.age-card>span { font-size:11px; opacity:.7; align-self:start; }
.age-card h3 { font-family:var(--display); font-size:37px; font-weight:500; margin-bottom:4px; }
.age-card p { font-size:12px; margin:0; opacity:.78; }
.age-card>b { font-weight:400; font-size:23px; color:#e0a183; }
.product-section { background:#eef0e9; }
.product-scroll { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.product-card { min-width:0; }
.product-image { display:block; position:relative; aspect-ratio:.86; background-image:url('/age-zuvee-duvee.webp'); background-size:310% auto; background-repeat:no-repeat; overflow:hidden; }
.product-image-link { position:absolute; inset:0; z-index:1; }
.age-pill { position:absolute; top:15px; left:15px; min-height:30px; display:inline-flex; align-items:center; justify-content:center; padding:0 11px; background:rgba(251,248,241,.9); font-size:10px; line-height:1; letter-spacing:.08em; }
.age-pill,.heart,.quick-add { z-index:2; }
.heart { position:absolute; top:12px; right:12px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; padding:0; border:0; border-radius:50%; background:rgba(251,248,241,.9); font-size:21px; line-height:1; color:var(--green); cursor:pointer; }
.heart.active { color:var(--terra); }
.quick-add { position:absolute; bottom:12px; right:12px; min-width:62px; height:37px; display:inline-flex; align-items:center; justify-content:center; padding:0 13px; border:0; background:var(--paper); color:var(--green); font-size:11px; line-height:1; cursor:pointer; transform:translateY(55px); transition:transform .25s; }
.product-image:hover .quick-add,.quick-add:focus { transform:translateY(0); }
.product-info { padding:18px 2px; }
.tags { display:flex; gap:8px; color:#6d776f; font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.tags span+span:before { content:"·"; margin-right:8px; }
.product-info h3 { font-family:var(--display); font-weight:500; font-size:22px; margin:9px 0 7px; }
.product-info>p { font-size:16px; font-weight:600; margin:0; color:var(--green); }
.product-details-link { display:inline-block; margin-top:13px; padding-bottom:3px; border-bottom:1px solid var(--line); font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.development-section { background:var(--green); color:#f6f2e8; padding:clamp(90px,9vw,140px) clamp(22px,7vw,112px); display:grid; grid-template-columns:.8fr 1.2fr; gap:9vw; }
.section-heading.light { position:sticky; top:140px; align-self:start; }
.section-heading.light>p:not(.eyebrow) { color:#bdc8bf; max-width:420px; }
.development-grid { border-top:1px solid rgba(255,255,255,.2); }
.development-card { display:grid; grid-template-columns:45px 1fr auto; padding:27px 0; gap:18px; border-bottom:1px solid rgba(255,255,255,.2); align-items:start; }
.development-card>span { color:#c97b5a; font-size:10px; }
.development-card h3 { font-family:var(--display); font-size:28px; font-weight:500; margin-bottom:8px; }
.development-card p { color:#acb8af; font-size:12px; margin:0; line-height:1.6; }
.development-card b { font-weight:400; color:#c97b5a; }
.skill-photo-section { background:#eef0e9; }
.skill-photo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.skill-photo-card { min-width:0; }
.skill-photo { aspect-ratio:1.05; background-image:url('/skill-play-grid.webp'); background-size:300% 200%; background-repeat:no-repeat; margin-bottom:18px; }
.skill-photo-card>span { display:block; color:var(--terra); font-size:10px; letter-spacing:.14em; margin-bottom:14px; }
.skill-photo-card h3 { font-family:var(--display); font-weight:500; font-size:29px; line-height:1.05; margin-bottom:10px; }
.skill-photo-card p { color:#68746c; font-size:12px; line-height:1.65; max-width:360px; margin:0; }
.philosophy { background:var(--cream); text-align:center; padding:clamp(100px,12vw,190px) 24px; }
.philosophy h2 { margin:0; }
.philosophy h2.accent { color:var(--terra); font-style:italic; }
.philosophy>p:not(.eyebrow) { max-width:660px; margin:35px auto 30px; line-height:1.8; color:#5c685f; }
.story-section { display:grid; grid-template-columns:1.13fr .87fr; min-height:680px; }
.story-image { background:url('/story-zuvee-duvee.webp') center/cover no-repeat; }
.story-copy { padding:80px clamp(38px,7vw,110px); background:#dfe4d9; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.story-copy p:not(.eyebrow) { line-height:1.8; color:#59665d; max-width:480px; margin-bottom:30px; }
.newly-section { background:var(--paper); }
.newly-section .product-scroll { grid-template-columns:repeat(3,1fr); }
.why-section { padding:clamp(85px,10vw,150px) clamp(22px,7vw,110px); background:#efe9de; }
.principles { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.principles article { padding:28px 30px 10px 0; border-right:1px solid var(--line); min-height:195px; }
.principles article:not(:first-child) { padding-left:30px; }
.principles article:last-child { border:0; }
.principles span { font-size:10px; color:var(--terra); }
.principles h3 { font-family:var(--display); font-weight:500; font-size:25px; margin:38px 0 10px; }
.principles p { font-size:12px; line-height:1.6; color:#68726b; }
.process-section { padding:clamp(90px,11vw,160px) clamp(22px,7vw,110px); background:var(--paper); display:grid; grid-template-columns:.8fr 1.2fr; gap:9vw; }
.process-section>div>p:not(.eyebrow) { max-width:450px; color:#68726b; line-height:1.8; }
.process-section ol { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); counter-reset:steps; }
.process-section li { display:grid; grid-template-columns:50px 1fr; border-bottom:1px solid var(--line); padding:22px 0; align-items:center; }
.process-section li span { font-size:10px; color:var(--terra); }
.process-section li b { font-family:var(--display); font-size:27px; font-weight:500; }
.reviews-section { padding:clamp(90px,10vw,150px) clamp(22px,9vw,140px); background:#d7dfd5; }
.review-placeholders { display:grid; grid-template-columns:repeat(2,1fr); max-width:1000px; margin:auto; gap:20px; }
.review-placeholders article { background:rgba(251,248,241,.55); padding:35px; min-height:210px; }
.review-placeholders article>span { font-size:9px; letter-spacing:.16em; color:#758077; }
.skeleton { height:9px; background:rgba(36,62,50,.12); margin-top:18px; width:80%; }
.skeleton.wide { margin-top:44px; width:100%; }.skeleton.short { width:55%; }
.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.article-image { aspect-ratio:1.25; position:relative; background-image:url('/age-zuvee-duvee.webp'); background-size:300% auto; }
.article-01 { background-position:0 center; }.article-02 { background-position:50% center; }.article-03 { background-position:100% center; }
.article-image span { position:absolute; left:18px; top:18px; background:var(--paper); width:32px; height:32px; display:grid; place-items:center; font-size:10px; }
.article-grid>a>p { margin:20px 0 10px; font-size:9px; letter-spacing:.13em; color:#69746c; }
.article-grid h3 { font-family:var(--display); font-size:28px; line-height:1.1; font-weight:500; max-width:360px; }
.read-link { font-size:11px; border-bottom:1px solid var(--line); padding-bottom:4px; }
.community-section { display:grid; grid-template-columns:.72fr 1.28fr; min-height:560px; background:#e7e4da; }
.community-copy { padding:80px clamp(35px,6vw,90px); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.community-copy>p:not(.eyebrow) { color:#657068; line-height:1.7; margin-bottom:28px; }
.community-collage { display:grid; grid-template-columns:1.25fr .75fr; grid-template-rows:1fr 1fr; gap:8px; padding:8px; }
.community-collage div { background-image:url('/hero-zuvee-duvee.webp'); background-size:cover; }
.community-collage div:first-child { grid-row:1/3; background-position:60% center; }.community-collage div:nth-child(2) { background-image:url('/story-zuvee-duvee.webp'); }.community-collage div:nth-child(3) { background-image:url('/age-zuvee-duvee.webp'); }
.retention-section { background:var(--terra); color:#fff8ef; padding:clamp(75px,8vw,120px) clamp(22px,9vw,140px); display:grid; grid-template-columns:1fr 1fr; gap:10vw; align-items:center; }
.retention-section>div>p:not(.eyebrow) { max-width:500px; line-height:1.7; color:#f1d9ce; }
.retention-section form { display:grid; grid-template-columns:1fr auto; align-items:end; }
.retention-section label { grid-column:1/3; font-size:10px; letter-spacing:.15em; text-transform:uppercase; margin-bottom:8px; }
.retention-section input { border:0; border-bottom:1px solid rgba(255,255,255,.65); padding:15px 0; color:white; background:transparent; outline:none; }
.retention-section input::placeholder { color:rgba(255,255,255,.55); }
.retention-section button { background:var(--green); color:white; border:0; padding:16px 22px; cursor:pointer; }
.retention-section small { grid-column:1/3; margin-top:13px; opacity:.7; }
.success { font-family:var(--display); font-size:27px; }
footer { padding:80px clamp(22px,6vw,90px) 26px; background:#1f352b; color:#dbe1d9; display:grid; grid-template-columns:1.5fr repeat(4,1fr); gap:40px; }
footer .logo { color:white; }
.footer-brand p { font-family:var(--display); font-size:25px; margin:35px 0; line-height:1.1; }
.footer-brand>span { font-size:10px; opacity:.6; }
.footer-column { display:flex; flex-direction:column; gap:13px; }
.footer-column h3 { font-size:9px; letter-spacing:.16em; color:#bf7658; margin-bottom:12px; }
.footer-column a { font-size:12px; opacity:.75; }
.footer-bottom { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.15); margin-top:35px; padding-top:24px; display:flex; justify-content:space-between; font-size:9px; letter-spacing:.08em; opacity:.6; }
.footer-bottom div { display:flex; gap:25px; }

/* Product detail page */
.product-header { height:78px; position:sticky; top:0; z-index:30; display:grid; grid-template-columns:200px 1fr 200px; align-items:center; padding:0 clamp(24px,4.2vw,72px); background:rgba(251,248,241,.96); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.product-breadcrumb { max-width:1440px; margin:auto; padding:20px clamp(22px,5vw,72px); display:flex; align-items:center; gap:10px; font-size:10px; color:#758077; }
.product-breadcrumb a { border-bottom:1px solid transparent; }.product-breadcrumb a:hover { border-color:currentColor; }
.product-detail-hero { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(380px,.82fr); gap:clamp(30px,5vw,80px); padding:0 clamp(22px,5vw,72px) clamp(80px,9vw,140px); max-width:1440px; margin:auto; }
.product-gallery { display:grid; grid-template-columns:1fr 1fr; gap:10px; align-content:start; }
.product-gallery figure { position:relative; aspect-ratio:1.05; margin:0; overflow:hidden; background:var(--cream); }
.product-gallery .product-gallery-main { grid-column:1/3; aspect-ratio:1.36; }
.product-gallery img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .45s; }.product-gallery figure:hover img { transform:scale(1.015); }
.product-summary { padding:clamp(28px,4vw,64px) 0; align-self:start; position:sticky; top:98px; }
.product-summary h1 { font-size:clamp(50px,5vw,72px); max-width:560px; margin-bottom:20px; }
.product-price { font-size:clamp(24px,2.1vw,32px); line-height:1; font-weight:600; color:var(--green); margin-bottom:30px; }
.product-intro { color:#5f6c64; line-height:1.8; max-width:510px; }
.product-tags { display:flex; flex-wrap:wrap; gap:8px; margin:25px 0 34px; }
.product-tags span { border:1px solid var(--line); padding:8px 11px; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.purchase-panel { display:grid; grid-template-columns:105px 1fr; gap:10px; }
.quantity-control { display:grid; grid-template-columns:1fr 32px 1fr; border:1px solid var(--line); min-height:54px; align-items:center; text-align:center; }
.quantity-control button { border:0; background:none; cursor:pointer; color:var(--green); }.quantity-control output { font-size:12px; }
.product-add-button { min-height:54px; border:0; background:var(--green); color:white; cursor:pointer; font-size:12px; letter-spacing:.04em; transition:background .2s; }.product-add-button:hover { background:#345344; }
.purchase-note { grid-column:1/3; font-size:10px; color:#6f7a73; line-height:1.5; margin:2px 0 0; }
.product-service-notes { border-top:1px solid var(--line); margin-top:34px; padding-top:8px; }
.product-service-notes p { display:grid; grid-template-columns:105px 1fr; gap:15px; padding:12px 0; margin:0; font-size:11px; border-bottom:1px solid var(--line); }
.product-service-notes b { font-weight:600; }.product-service-notes span { color:#67736b; line-height:1.5; }
.product-editorial { background:var(--green); color:#f6f2e8; padding:clamp(90px,10vw,155px) clamp(22px,9vw,140px); display:grid; grid-template-columns:1fr 1fr; gap:10vw; }
.product-editorial h2,.product-benefits h2,.product-information h2,.product-seo-copy h2 { font-size:clamp(44px,4.5vw,68px); line-height:1; }
.product-editorial>div:last-child { padding-top:34px; }
.product-editorial>div:last-child p { color:#bcc8bf; line-height:1.85; max-width:580px; }
.product-benefits { display:grid; grid-template-columns:1.05fr .95fr; min-height:720px; background:#e1e5dc; }
.benefit-image { position:relative; min-height:650px; overflow:hidden; }.benefit-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.product-benefits>div:last-child { padding:clamp(70px,8vw,120px) clamp(30px,7vw,105px); }
.product-benefits ol { list-style:none; padding:0; margin:45px 0 0; border-top:1px solid var(--line); }
.product-benefits li { display:grid; grid-template-columns:38px 1fr; gap:15px; padding:24px 0; border-bottom:1px solid var(--line); }
.product-benefits li>span { font-size:9px; color:var(--terra); }.product-benefits h3 { font-family:var(--display); font-weight:500; font-size:25px; margin-bottom:7px; }.product-benefits li p { color:#68746c; font-size:12px; line-height:1.6; margin:0; }
.product-information { display:grid; grid-template-columns:.8fr 1.2fr; gap:9vw; padding:clamp(90px,10vw,150px) clamp(22px,9vw,140px); background:var(--paper); }
.product-information>div:first-child>p:not(.eyebrow) { color:#68746c; line-height:1.8; max-width:430px; }
.product-accordions { border-top:1px solid var(--line); }
.product-accordions details { border-bottom:1px solid var(--line); padding:22px 0; }
.product-accordions summary { cursor:pointer; font-family:var(--display); font-size:25px; list-style-position:outside; }
.product-accordions details p { padding:16px 30px 0 0; color:#68746c; line-height:1.75; font-size:12px; max-width:620px; margin:0; }
.product-specs-panel summary { font-size:31px; }
.product-specs-content { padding-top:26px; display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(28px,5vw,70px); }
.product-specs-list { margin:0; display:grid; gap:0; border-top:1px solid var(--line); }
.product-specs-list div { display:grid; grid-template-columns:145px 1fr; gap:18px; padding:16px 0; border-bottom:1px solid var(--line); }
.product-specs-list dt { font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:#7a847d; }
.product-specs-list dd { margin:0; font-size:13px; line-height:1.55; color:var(--ink); }
.product-detail-notes { display:grid; gap:22px; }
.product-detail-notes article { padding-bottom:20px; border-bottom:1px solid var(--line); }
.product-detail-notes h3 { font-family:var(--display); font-weight:500; font-size:24px; margin-bottom:0; }
.product-detail-notes p { padding-top:10px!important; }
.product-seo-copy { padding:clamp(90px,10vw,150px) clamp(22px,18vw,280px); text-align:center; background:var(--cream); }
.product-seo-copy>p:not(.eyebrow) { max-width:800px; margin:28px auto; line-height:1.9; color:#606d65; }
.product-seo-copy>div { display:flex; justify-content:center; gap:30px; margin-top:35px; }.product-seo-copy a { font-size:11px; border-bottom:1px solid currentColor; padding-bottom:5px; }

/* Commerce flows */
.commerce-overlay { position:fixed; inset:0; z-index:80; display:grid; grid-template-columns:1fr minmax(360px,520px); }
.commerce-backdrop { position:absolute; inset:0; border:0; background:rgba(20,31,26,.48); cursor:pointer; }
.commerce-panel { position:relative; grid-column:2; height:100vh; overflow:auto; background:var(--paper); box-shadow:-30px 0 70px rgba(22,34,28,.22); padding:30px; }
.commerce-panel-header { display:flex; justify-content:space-between; gap:24px; border-bottom:1px solid var(--line); padding-bottom:22px; margin-bottom:24px; }
.commerce-panel-header h2 { font-size:clamp(36px,4vw,48px); line-height:1; margin:0; }
.commerce-panel-header button,.link-button { border:0; background:none; color:var(--green); cursor:pointer; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.commerce-tabs { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); margin-bottom:22px; }
.commerce-tabs button { border:0; background:transparent; color:var(--green); min-height:46px; cursor:pointer; }
.commerce-tabs button.active { background:var(--green); color:white; }
.commerce-form { display:grid; gap:16px; }
.commerce-form label { display:grid; gap:8px; color:#66726a; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.commerce-form input,.commerce-form textarea { width:100%; border:1px solid var(--line); background:white; color:var(--ink); min-height:46px; padding:12px; outline:none; }
.commerce-form textarea { min-height:92px; resize:vertical; }
.commerce-form button,.checkout-primary,.order-success button,.commerce-actions button { min-height:52px; border:0; background:var(--green); color:white; cursor:pointer; padding:0 18px; font-size:12px; letter-spacing:.05em; }
.commerce-form p,.empty-state,.order-success p,.account-card p { color:#66726a; line-height:1.65; font-size:12px; }
.account-card { border:1px solid var(--line); padding:24px; background:#fffdf8; }
.account-card h3,.order-success h3 { font-family:var(--display); font-size:30px; font-weight:500; margin-bottom:8px; }
.commerce-actions { display:flex; gap:10px; margin-top:22px; }
.commerce-actions button.secondary { background:transparent; color:var(--green); border:1px solid var(--line); }
.checkout-steps { display:flex; gap:8px; margin-bottom:22px; }
.checkout-steps span { width:26px; height:26px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; font-size:10px; color:#738078; }
.checkout-steps span.active { background:var(--green); border-color:var(--green); color:white; }
.cart-items { border-top:1px solid var(--line); }
.cart-items article { display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); }
.cart-items h3 { font-family:var(--display); font-size:24px; font-weight:500; margin-bottom:4px; }
.cart-items p { margin:0; color:#66726a; font-size:12px; }
.cart-quantity { display:grid; grid-template-columns:32px 34px 32px; align-items:center; border:1px solid var(--line); min-height:38px; text-align:center; }
.cart-quantity button { border:0; background:transparent; cursor:pointer; color:var(--green); }
.cart-quantity output { font-size:12px; }
.order-summary { border-top:1px solid var(--line); margin:22px 0; }
.order-summary p { display:flex; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); padding:12px 0; margin:0; color:#66726a; font-size:12px; }
.order-summary b { color:var(--green); text-align:right; }
.radio-row { display:flex!important; grid-template-columns:none!important; align-items:center; gap:10px!important; font-size:13px!important; text-transform:none!important; letter-spacing:0!important; color:var(--ink)!important; }
.radio-row input { width:auto; min-height:auto; }
.order-success { border:1px solid var(--line); background:#fffdf8; padding:26px; }

@media (max-width: 900px) {
  .site-header { height:64px; grid-template-columns:1fr auto 1fr; padding:0 18px; }
  .mobile-icon { display:block; justify-self:start; font-size:18px; font-size:0; }
  .mobile-icon:after { content:"MENU"; font-size:10px; letter-spacing:.12em; }
  .site-header>.logo { justify-self:center; font-size:14px; }
  nav { display:none; position:absolute; left:0; right:0; top:63px; background:var(--paper); padding:32px 24px; flex-direction:column; align-items:center; border-bottom:1px solid var(--line); }
  nav.open { display:flex; }
  .header-actions { gap:14px; font-size:10px; }
  .header-actions .desktop-only { display:none; }
  .header-actions button { font-size:0; }.header-actions button:after { content:"SEARCH"; font-size:10px; }
  .search-panel { top:63px; grid-template-columns:1fr auto; padding:22px; gap:15px; }
  .search-panel label { grid-column:1/3; font-size:22px; }
  .hero { min-height:auto; grid-template-columns:1fr; }
  .hero-copy { padding:56px 24px 48px; }
  h1 { font-size:52px; max-width:330px; }
  .hero-copy>p:not(.eyebrow) { font-size:14px; }
  .hero-image { min-height:420px; background-position:64% center; }
  .age-grid { grid-template-columns:1fr; }
  .age-card { min-height:390px; }
  .product-scroll { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin-right:-22px; padding-right:22px; scrollbar-width:none; }
  .product-card { flex:0 0 76vw; scroll-snap-align:start; }
  .product-image { aspect-ratio:.9; }
  .quick-add { transform:none; }
  .development-section,.process-section { grid-template-columns:1fr; gap:25px; }
  .section-heading.light { position:static; }
  .skill-photo-grid { grid-template-columns:repeat(2,1fr); }
  .story-section { grid-template-columns:1fr; }
  .story-image { min-height:480px; }
  .newly-section .product-scroll { display:flex; }
  .principles { grid-template-columns:repeat(2,1fr); }
  .principles article:nth-child(2) { border-right:0; }
  .principles article:nth-child(3),.principles article:nth-child(4) { border-top:1px solid var(--line); }
  .article-grid { grid-template-columns:1fr; gap:50px; }
  .community-section { grid-template-columns:1fr; }
  .community-collage { min-height:520px; }
  .retention-section { grid-template-columns:1fr; gap:35px; }
  footer { grid-template-columns:repeat(2,1fr); }
  .footer-brand { grid-column:1/3; margin-bottom:20px; }
  .product-header { height:64px; grid-template-columns:1fr auto; padding:0 18px; }
  .product-header nav { display:none; }
  .product-header .header-actions { justify-self:end; }
  .product-header>.logo { justify-self:start; }
  .product-detail-hero { grid-template-columns:1fr; gap:10px; }
  .product-summary { position:static; padding:38px 0 0; }
  .product-editorial,.product-information { grid-template-columns:1fr; gap:25px; }
  .product-specs-content { grid-template-columns:1fr; }
  .product-benefits { grid-template-columns:1fr; }.benefit-image { min-height:520px; }
  .commerce-overlay { grid-template-columns:1fr; }
  .commerce-panel { grid-column:1; margin-left:auto; width:min(100%,520px); }
}

@media (max-width: 520px) {
  .announcement { font-size:9px; }
  .section { padding:80px 20px; }
  .section-heading { margin-bottom:38px; }
  .section-heading.centered { text-align:left; margin-bottom:38px; }
  .section-heading.split { align-items:start; }
  .section-heading.split>.text-link { display:none; }
  .section-heading h2,.philosophy h2,.story-copy h2,.why-section h2,.process-section h2,.retention-section h2,.community-copy h2 { font-size:42px; }
  .button-row { width:100%; gap:22px; }
  .button.primary { padding:0 18px; }
  .hero-image { min-height:360px; }
  .age-card { min-height:350px; padding:22px; }
  .age-card h3 { font-size:32px; }
  .product-card { flex-basis:82vw; }
  .development-section { padding:80px 20px; }
  .development-card { grid-template-columns:30px 1fr auto; }
  .skill-photo-grid { grid-template-columns:1fr; gap:38px; }
  .philosophy { text-align:left; padding:95px 20px; }
  .philosophy>p:not(.eyebrow) { margin-left:0; }
  .story-image { min-height:360px; }
  .story-copy { padding:70px 22px; }
  .principles { grid-template-columns:1fr; }
  .principles article,.principles article:not(:first-child) { border-right:0; border-top:1px solid var(--line); padding:25px 0; min-height:155px; }
  .principles article:first-child { border-top:0; }
  .principles h3 { margin-top:25px; }
  .review-placeholders { display:block; }
  .review-placeholders article:nth-child(2) { display:none; }
  .community-collage { min-height:420px; }
  .retention-section { padding:75px 20px; }
  .retention-section form { grid-template-columns:1fr; }
  .retention-section label,.retention-section small { grid-column:1; }
  .retention-section button { margin-top:12px; }
  footer { padding:65px 22px 24px; gap:42px 25px; }
  .footer-bottom { flex-direction:column; gap:14px; }
  .product-breadcrumb { white-space:nowrap; overflow:hidden; }
  .product-detail-hero { padding:0 16px 80px; }
  .product-gallery { gap:5px; }
  .product-gallery .product-gallery-main { aspect-ratio:1; }
  .product-gallery figure { aspect-ratio:.9; }
  .product-summary h1 { font-size:50px; }
  .product-price { font-size:27px; }
  .purchase-panel { grid-template-columns:92px 1fr; }
  .product-editorial,.product-information { padding:80px 20px; }
  .product-specs-list div { grid-template-columns:1fr; gap:6px; }
  .product-benefits>div:last-child { padding:75px 20px; }
  .benefit-image { min-height:380px; }
  .product-seo-copy { padding:80px 20px; text-align:left; }
  .product-seo-copy>div { flex-direction:column; align-items:flex-start; gap:18px; }
  .commerce-panel { padding:22px; }
  .commerce-panel-header h2 { font-size:34px; }
  .cart-items article { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
