/* Editorial storefront and production photo-story presentation. */
:root { --ink:#293d36; --ink-soft:#6c7168; --paper:#fdfbf6; --cream:#f1ece3; --line:#dedfd5; --radius:6px; }
body { font-size:15px; }
main:focus { outline:none; }
svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.provider-button svg { stroke:none; }
.button-dark { color:white; background:var(--ink); }
.button-dark:hover { background:var(--teal-deep); }
.button-light { border-color:var(--line); background:transparent; }
.button-teal { background:var(--teal-deep); color:white; }
.full { width:100%; }
.small { min-height:37px; padding:9px 14px; }
.tiny { font-size:11px; line-height:1.8; }
.cinema-hero { background:#f1ece2; overflow:hidden; }
.cinema-hero-inner { display:grid; grid-template-columns:1.05fr 1fr; gap:45px; align-items:center; min-height:650px; }
.cinema-hero-copy { padding:64px 0; position:relative; z-index:1; }
.cinema-hero-copy .eyebrow { font-size:9px; letter-spacing:.18em; margin-bottom:28px; }
.cinema-hero h1 { font-size:clamp(45px,5.25vw,73px); line-height:1.09; letter-spacing:-.055em; }
.cinema-hero h1 em { color:#9c684e; font-weight:500; }
.cinema-hero-copy > p { margin:26px 0 30px; font-size:14px; line-height:1.9; }
.cinema-hero .buttons { gap:25px; }
.cinema-hero .button { min-height:49px; }
.hero-proof { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:65px; padding-top:22px; border-top:1px solid #bfb7a65c; font-size:9px; letter-spacing:.1em; }
.hero-proof button { background:transparent; font-size:10px; padding:7px 0; }
.hero-proof button span { margin-left:12px; }
.cinema-hero-art { height:570px; position:relative; margin-block:34px; }
.workspace-image { width:100%; height:100%; object-fit:cover; object-position:67% center; border-radius:180px 6px 6px 6px; }
.hero-image-caption { position:absolute; bottom:0; left:0; right:0; padding:55px 30px 30px; color:white; background:linear-gradient(transparent,#1c211cc7); border-radius:0 0 6px 6px; }
.hero-image-caption span { font-size:8px; letter-spacing:.18em; }
.hero-image-caption b { display:block; font-family:'Playfair Display',Georgia,serif; font-weight:500; font-size:27px; line-height:1.2; margin-top:12px; }
.floating-thread { position:absolute; font-size:85px; line-height:1; color:#b69458; top:25px; left:-27px; animation:thread-float 8s ease-in-out infinite; }
@keyframes thread-float { 50% { transform:translateY(-10px) rotate(20deg); } }
.brand-ribbon { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:40px; padding:21px; border-bottom:1px solid var(--line); font-size:10px; letter-spacing:.13em; text-transform:uppercase; }
.brand-ribbon i { color:#b29462; font-size:16px; font-style:normal; }
.product-info h3 { min-height:44px; }
.product-photo { border-radius:8px; box-shadow:0 5px 18px #283d3508; }
.product-photo img { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.product-info .price { font-size:17px; font-weight:600; }
.price-row small { font-size:10px; color:var(--ink-soft); }
.product-source { display:block; font-size:9px; color:var(--ink-soft); margin:8px 0 14px; }
.card-actions { display:flex; gap:8px; }
.card-actions button { flex:1; min-height:39px; border:1px solid #c5cfc5; border-radius:4px; background:transparent; font-size:10px; font-weight:600; transition:background .2s; }
.card-actions .card-add { background:var(--ink); color:#fff; border-color:var(--ink); }
.card-actions button:hover { background:#e1e8df; color:var(--ink); }
.badge-99 { background:#f7e6d9; color:#7d4430; }
.nav-99 { color:#a05d3c; }
.store-switch { display:block; margin:20px 0; font-size:12px; color:#8b5338; }
.collection-tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:19px; }
.collection-tile { position:relative; overflow:hidden; aspect-ratio:3/4; border-radius:7px; background:#dedacf; }
.collection-tile img { height:100%; width:100%; object-fit:cover; transition:transform .7s; }
.collection-tile:hover img { transform:scale(1.04); }
.collection-tile > div { position:absolute; inset:0; display:flex; justify-content:flex-end; flex-direction:column; padding:24px; background:linear-gradient(transparent 25%,#14271edf); color:white; }
.collection-tile span { font-size:8px; letter-spacing:.14em; text-transform:uppercase; }
.collection-tile h3 { font-family:'Playfair Display',serif; font-size:26px; font-weight:500; margin:12px 0 18px; }
.collection-tile b { font-size:10px; font-weight:500; }
.ninety-nine-feature { background:#edece1; padding:80px 0; }
.ninety-nine-grid { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:80px; }
.ninety-nine-grid > .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ninety-nine-copy h2 { font-size:80px; line-height:1; }
.ninety-nine-copy h2 em { font-weight:500; color:#967143; }
.ninety-nine-copy p { margin:26px 0; font-size:13px; line-height:1.9; }
.maker-note { text-align:center; padding:100px 0; background:#f2eee6; }
.maker-note .eyebrow { justify-content:center; }
.maker-note h2 { font-size:52px; line-height:1.22; }
.maker-note h2 em { color:#9c684e; }
.maker-note p { margin:25px auto; font-size:13px; line-height:1.9; }
.journey-heading { padding-top:50px; padding-bottom:65px; text-align:center; }
.journey-heading .eyebrow { justify-content:center; }
.journey-heading h2 { font-size:60px; }
.journey-heading h2 em { color:#9c684e; }
.journey-heading p { margin:24px 0 8px; font-size:13px; }
.journey-heading small { font-size:10px; color:#6e7569; }
.craft-chapter { height:220vh; position:relative; background:#eae4d8; }
.craft-chapter.emerald { background:#dbe4d7; }
.craft-chapter.lotus { background:#f1e1d8; }
.chapter-pin { position:sticky; top:88px; height:calc(100svh - 88px); min-height:560px; max-width:1440px; margin:auto; padding:25px 60px 22px; display:flex; flex-direction:column; }
.chapter-top,.chapter-bottom { display:flex; align-items:center; gap:25px; justify-content:space-between; font-size:9px; letter-spacing:.14em; }
.chapter-top button,.chapter-bottom button { background:transparent; border-bottom:1px solid #798675; font-size:10px; letter-spacing:0; padding:6px 0; }
.chapter-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:65px; align-items:center; flex:1; min-height:0; padding:20px 0; }
.chapter-copy h2 { font-size:clamp(35px,4.2vw,61px); line-height:1.08; }
.chapter-copy > p { font-size:13px; line-height:1.9; margin:24px 0; max-width:340px; }
.chapter-product { padding-top:22px; border-top:1px solid #8c978a5c; opacity:calc(.6 + var(--reveal,0)*.4); }
.chapter-product > span { font-size:8px; letter-spacing:.15em; }
.chapter-product h3 { margin:10px 0 4px; font-family:'Playfair Display',serif; font-size:23px; font-weight:500; }
.chapter-product strong { display:block; font-size:16px; margin-bottom:16px; }
.chapter-product .text-link { font-size:12px; }
.chapter-visual { height:100%; min-height:0; padding:15px 0 20px; }
.chapter-image-window { overflow:hidden; position:relative; height:100%; border-radius:150px 6px 6px 6px; background:#e5ded0; }
.chapter-photo { width:100%; height:100%; object-fit:cover; transform:translateY(var(--photo-shift,0)) scale(var(--photo-scale,1)); will-change:transform; }
.chapter-film { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.photo-corner { position:absolute; bottom:20px; left:20px; background:#fffdf4e8; padding:7px 11px; font-size:8px; letter-spacing:.12em; }
.chapter-detail { display:block; padding-top:7px; font-size:9px; color:var(--ink-soft); text-align:right; }
.chapter-track { flex:1; height:1px; background:#73866d4a; }
.chapter-track i { display:block; width:100%; height:2px; background:#45583c; transform-origin:left; transform:scaleX(var(--story-progress,0)); }
.chapter-motion { white-space:nowrap; }
.motion-reduced .craft-chapter { height:auto; }
.motion-reduced .chapter-pin { position:relative; top:auto; height:auto; min-height:650px; }
.motion-reduced .chapter-motion,.motion-reduced .chapter-track { display:none; }
.motion-reduced .chapter-image-window { height:500px; }
/* Align the customer dashboard with the shared storefront component language. */
.account-avatar { display:flex; align-items:center; gap:12px; padding:0 0 24px; border-bottom:1px solid var(--line); margin-bottom:12px; }
.account-avatar .avatar { width:43px; height:43px; border-radius:50%; display:grid; place-items:center; background:#dfe9dd; font-size:20px; flex-shrink:0; }
.account-avatar b { font-size:12px; }
.account-avatar small { display:block; font-size:10px; color:var(--ink-soft); margin-top:4px; }
.account-banner { display:flex; align-items:center; gap:14px; padding:18px; margin-bottom:25px; border:1px solid #dce4d4; border-radius:6px; background:#f1f4e9; font-size:11px; }
.account-banner > span { flex:1; }
.account-banner button { flex-shrink:0; }
.account-title h2 { font-size:34px; }
.account-section-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:35px 0 20px; }
.account-section-head h3 { font-family:'Playfair Display',serif; font-size:25px; font-weight:500; }
.welcome-card > span { position:absolute; top:15px; right:25px; font-size:110px; color:#b4c4ab; opacity:.45; pointer-events:none; }
.welcome-card > div { position:relative; z-index:1; }
.welcome-card .text-link { margin-top:24px; }
.stat { text-align:left; }
.stats .stat b { display:block; margin-bottom:11px; }
.stats .stat span { font-size:11px; }
.form-field { display:flex; flex-direction:column; gap:7px; font-size:12px; }
.form-field.full { grid-column:1/-1; }
.form-field input,.form-field textarea { padding:12px; width:100%; border:1px solid #ccd5c7; border-radius:5px; background:#fffef9; color:var(--ink); font-size:14px; }
.form-field textarea { resize:vertical; }
.form-field input[readonly] { background:#f0f1e8; color:#737b70; }
.form-field.checkbox-label { flex-direction:row; align-items:flex-start; font-size:11px; }
.form-field.checkbox-label input { width:16px; height:16px; margin-top:3px; }
.address-card .buttons { margin-top:18px; }
.empty-state > .empty-icon { display:grid; place-items:center; margin-bottom:14px; }
.empty-icon svg { width:32px; height:32px; }
.product-grid > .empty-state { grid-column:1/-1; }
.modal-logo { width:65px; height:65px; margin-bottom:25px; }
#modalContent > p { font-size:12px; margin-bottom:24px; line-height:1.8; }
#modalContent .auth-footer { font-size:10px; margin-top:20px; text-align:center; }
.auth-notice { margin-bottom:18px; }
.auth-footer a { text-decoration:underline; }
.bag-line > a { flex:0 0 83px; }
.bag-line-info { min-width:0; flex:1; }
.bag-line-info h3 { font-family:'Playfair Display',serif; font-weight:500; font-size:19px; margin:2px 0 7px; }
.bag-line-info p { font-size:11px; }
.bag-total { display:flex; justify-content:space-between; gap:20px; font-size:14px; margin-bottom:16px; }
.bag-content-note { font-size:11px; line-height:1.8; margin-bottom:18px; }
.checkout-steps { display:flex; gap:25px; margin-bottom:24px; font-size:10px; color:var(--ink-soft); }
.checkout-steps .active { color:var(--teal-deep); font-weight:700; }
.checkout-summary .summary-line { justify-content:space-between; font-size:12px; }
.checkout-summary .bag-line h3 { font-size:16px; }
.checkout-summary .bag-line img { height:88px; width:68px; }
.checkout-summary .bag-line > a { flex-basis:68px; }
.delivery-option { display:flex; gap:12px; padding:16px; border:1px solid var(--line); margin-bottom:14px; border-radius:5px; font-size:12px; }
.delivery-option small { display:block; margin-top:5px; }
.info-box { font-size:12px; padding:20px; line-height:1.8; background:#f1efe5; border-radius:5px; margin:24px 0; }
.detail-image { position:relative; }
.detail-price { margin:25px 0; }
.detail-price strong { font-size:29px; font-weight:500; }
.detail-price p { font-size:11px; margin-top:8px; }
.swatches { display:flex; gap:8px; margin-bottom:25px; flex-wrap:wrap; }
.swatches span { font-size:10px; padding:6px 11px; border:1px solid var(--line); border-radius:20px; }
.detail-info > .tiny { margin-top:17px; }
.detail-facts dd { margin:0; }
.detail-facts dt { font-weight:600; }
.founder-photo { width:100%; height:530px; object-fit:cover; object-position:center 20%; border-radius:130px 130px 6px 6px; }
.founder-caption { margin:20px 0; font-size:12px; }
.story-values { display:grid; grid-template-columns:repeat(3,1fr); gap:35px; }
.story-values article { border-top:1px solid var(--line); padding-top:25px; }
.story-values h3 { font-family:'Playfair Display',serif; font-size:25px; font-weight:500; margin:15px 0; }
.story-values p { font-size:12px; }
.footer-grid > div > h3 { font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:#dfc99b; margin-bottom:18px; }
.footer-grid > div > a:not(.brand) { display:block; font-size:11px; color:#d0dcd0; margin:10px 0; }
.footer-grid > div > p { font-size:12px; color:#b5c5b7; margin-top:20px; }
.loading-page { padding:100px; text-align:center; }
.loading-page img { margin:0 auto 20px; }
@media(max-width:1100px) {
  .desktop-nav { gap:16px; }
  .desktop-nav a { font-size:11px; }
  .cinema-hero-inner { gap:25px; min-height:590px; }
  .cinema-hero-art { height:510px; }
  .hero-proof { margin-top:45px; }
  .ninety-nine-grid { gap:45px; }
  .chapter-pin { padding-inline:35px; }
  .chapter-layout { gap:35px; }
}
@media(max-width:850px) {
  .filter-sidebar .filter-note { display:none; }
  .collection-section .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cinema-hero h1 { font-size:49px; }
  .cinema-hero-copy > p br { display:none; }
  .cinema-hero .buttons { gap:16px; }
  .cinema-hero-art { height:490px; }
  .hero-proof { font-size:8px; flex-wrap:wrap; gap:10px; }
  .brand-ribbon { gap:18px; font-size:9px; }
  .collection-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .collection-tile { aspect-ratio:1/1.1; }
  .ninety-nine-copy h2 { font-size:65px; }
  .account-nav { display:flex; flex-wrap:wrap; overflow:visible; }
  .account-avatar { width:100%; border:none; margin:0; padding-bottom:12px; }
  .chapter-pin { top:76px; height:calc(100svh - 76px); padding-inline:25px; }
  .chapter-layout { gap:25px; }
  .chapter-copy h2 { font-size:38px; }
  .chapter-product h3 { font-size:21px; }
  .chapter-visual { padding-block:25px; }
  .chapter-image-window { border-top-left-radius:90px; }
}
@media(max-width:600px) {
  .shell { padding-inline:20px; }
  .header-inner { gap:8px; }
  .header-actions { gap:2px; }
  .header-actions > button[data-action="search"] { display:none; }
  .brand { font-size:19px; gap:6px; }
  .brand img { width:40px; height:40px; }
  .brand small { font-size:6px; letter-spacing:.09em; }
  .sign-in-button { min-height:34px; padding:8px 10px; margin-left:2px; font-size:10px; }
  .header-actions .icon-button { width:32px; flex-basis:32px; }
  .cinema-hero-inner { grid-template-columns:1fr; gap:0; }
  .cinema-hero-copy { padding:45px 0 20px; }
  .cinema-hero h1 { font-size:clamp(41px,10.8vw,60px); }
  .cinema-hero-copy .eyebrow { font-size:8px; margin-bottom:23px; }
  .cinema-hero-copy > p { font-size:12px; margin:22px 0; max-width:300px; }
  .cinema-hero .text-link { font-size:11px; }
  .hero-proof { margin-top:28px; padding-top:16px; flex-wrap:nowrap; }
  .cinema-hero-art { height:350px; margin:12px 0 28px; }
  .workspace-image { border-top-left-radius:110px; }
  .hero-image-caption { padding:50px 24px 24px; }
  .hero-image-caption b { font-size:25px; }
  .floating-thread { font-size:65px; left:-10px; top:15px; }
  .brand-ribbon { gap:13px; font-size:7px; letter-spacing:.04em; padding:17px 12px; }
  .brand-ribbon > span:nth-of-type(3),.brand-ribbon > i:nth-of-type(3) { display:none; }
  .section-head { flex-wrap:wrap; }
  .product-info h3 { min-height:40px; font-size:17px; }
  .product-info .price { font-size:16px; }
  .price-row small { font-size:9px; }
  .product-source { font-size:8px; }
  .card-actions { gap:5px; }
  .card-actions button { font-size:9px; min-height:38px; padding:5px; }
  .product-badge { font-size:7px; }
  .save-button { width:33px; height:33px; }
  .collection-tiles { gap:12px; }
  .collection-tile > div { padding:16px; }
  .collection-tile h3 { font-size:22px; margin:10px 0 15px; }
  .collection-tile span { font-size:7px; }
  .ninety-nine-feature { padding:50px 0; }
  .ninety-nine-grid { grid-template-columns:1fr; gap:35px; }
  .ninety-nine-copy h2 { font-size:66px; }
  .ninety-nine-copy h2 br { display:none; }
  .ninety-nine-copy p { font-size:12px; margin:20px 0; }
  .maker-note { padding:65px 0; }
  .maker-note h2 { font-size:36px; }
  .maker-note p { font-size:12px; }
  .journey-heading { padding-top:15px; padding-bottom:40px; }
  .journey-heading h2 { font-size:44px; }
  .journey-heading p { font-size:12px; }
  .craft-chapter { height:175vh; }
  .chapter-pin { padding:17px 20px; top:68px; height:calc(100svh - 68px); min-height:570px; }
  .chapter-top { gap:12px; font-size:7px; }
  .chapter-top button { font-size:9px; }
  .chapter-layout { grid-template-columns:1fr; gap:15px; align-items:start; padding:18px 0; }
  .chapter-copy .eyebrow { display:none; }
  .chapter-copy h2 { font-size:32px; }
  .chapter-copy h2 br { display:none; }
  .chapter-copy > p { display:none; }
  .chapter-product { padding-top:10px; margin-top:10px; display:grid; grid-template-columns:1fr auto; gap:4px 14px; }
  .chapter-product > span { font-size:7px; grid-column:1/-1; }
  .chapter-product h3 { font-size:18px; margin:3px 0; }
  .chapter-product strong { font-size:14px; margin:3px 0; }
  .chapter-product .text-link { font-size:10px; grid-column:1/-1; }
  .chapter-visual { height:100%; min-height:240px; padding:0 0 14px; }
  .chapter-image-window { min-height:240px; border-top-left-radius:70px; }
  .chapter-layout { grid-template-rows:auto 1fr; }
  .chapter-detail { font-size:8px; }
  .chapter-bottom { gap:12px; font-size:8px; padding-right:45px; }
  .chapter-instruction { max-width:90px; font-size:8px; letter-spacing:0; }
  .chapter-count { display:none; }
  .chapter-bottom button { font-size:9px; }
  .account-title h2 { font-size:28px; }
  .account-banner { flex-wrap:wrap; padding:16px; font-size:10px; }
  .account-banner > span { min-width:200px; }
  .account-banner button { margin-left:35px; }
  .account-section-head h3 { font-size:22px; }
  .account-section-head .text-link { font-size:10px; white-space:nowrap; }
  .stats .stat { padding:16px 11px; }
  .stats .stat span { font-size:9px; }
  .form-field input,.form-field textarea { font-size:16px; }
  .footer-grid > div:first-child { grid-column:1/-1; }
  .story-values { grid-template-columns:1fr; }
  .founder-photo { height:470px; }
  .bag-line-info h3 { font-size:17px; }
  .checkout-steps { gap:20px; font-size:9px; }
  .checkout-grid { grid-template-columns:1fr; }
  .checkout-summary { position:static; }
  .summary-line { font-size:11px; }
  .motion-reduced .chapter-image-window { height:350px; }
  .motion-reduced .chapter-pin { min-height:600px; }
  .help-fab { width:37px; height:37px; padding:0; justify-content:center; border-radius:50%; bottom:14px; right:13px; }
  .help-fab b { display:none; }
}
@media(prefers-reduced-motion:reduce) { .floating-thread { animation:none; } .chapter-photo { transform:none; will-change:auto; } }