:root{
    --paper:#F7F3EA;
    --paper-2:#EFE8DA;
    --card:#FFFDF8;
    --ink:#1B1916;
    --ink-soft:#5C5448;
    --ink-faint:#8A8173;
    --line:#DDD3C2;
    --line-soft:#E7DECF;
    --coral:#EDA92E;
    --coral-deep:#CF8C18;
    --gold-ink:#9A6608;
    --gold-display:#CE9016;
    --display:"Fraunces", Georgia, serif;
    --body:"Hanken Grotesk", system-ui, -apple-system, sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--body);
    font-size:16px;line-height:1.65;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{display:block;max-width:100%;height:auto;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;}

  /* paper grain */
  body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;
    opacity:.035;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  .wrap{max-width:1240px;margin:0 auto;padding:0 40px;}

  /* palette dots motif */
  .dots{display:inline-flex;gap:5px;align-items:center;}
  .dots i{width:7px;height:7px;border-radius:50%;display:block;}
  .d1{background:#CE4322;}.d2{background:#E6A537;}.d3{background:#4FA39C;}
  .d4{background:#6F7E37;}.d5{background:#C65C8C;}.d6{background:#54669F;}

  /* ===== announcement ===== */
  .announce{background:var(--ink);color:var(--paper);text-align:center;
    font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;padding:10px 16px;}
  .announce b{color:#E6A537;font-weight:600;}

  /* ===== header ===== */
  header{position:sticky;top:0;z-index:100;background:rgba(247,243,234,.85);
    backdrop-filter:blur(14px);border-bottom:1px solid var(--line);}
  .nav{display:flex;align-items:center;justify-content:space-between;
    max-width:1240px;margin:0 auto;padding:18px 40px;}
  .brand{line-height:1;}
  .brand .mark{font-family:var(--display);font-size:23px;font-weight:600;letter-spacing:.04em;}
  .brand .sub{font-size:10px;letter-spacing:.34em;text-transform:uppercase;
    color:var(--ink-faint);margin-top:5px;display:flex;align-items:center;gap:9px;}
  .nav-links{display:flex;gap:32px;}
  .nav-links a{font-size:13.5px;letter-spacing:.06em;color:var(--ink-soft);
    position:relative;padding:5px 0;transition:color .25s;text-transform:uppercase;}
  .nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:2.5px;
    width:0;background:var(--coral);transition:width .3s ease;}
  .nav-links a:hover{color:var(--ink);}
  .nav-links a.active{color:var(--ink);}
  .nav-links a.active::after{width:100%;}
  .nav-right{display:flex;align-items:center;gap:20px;}
  .cart{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);}
  .cart .num{background:var(--coral);color:var(--ink);font-size:10.5px;font-weight:700;
    width:18px;height:18px;border-radius:50%;display:grid;place-items:center;}
  .cart .num[hidden]{display:none;}
  .menu-btn{display:none;}

  /* ===== views ===== */
  
  
  @keyframes fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

  /* fade-up util */
  .fu{opacity:0;transform:translateY(20px);animation:fu .8s cubic-bezier(.2,.7,.2,1) forwards;}
  @keyframes fu{to{opacity:1;transform:none;}}

  /* ===== section header ===== */
  .sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:38px;}
  .sec-head .idx{font-family:var(--display);font-size:14px;color:var(--gold-ink);font-weight:500;}
  .sec-head h2{font-family:var(--display);font-size:clamp(30px,4vw,46px);
    font-weight:500;letter-spacing:-.01em;line-height:1.02;}
  .sec-head .line{flex:1;height:1px;background:var(--line);align-self:center;}

  /* ===== hero ===== */
  .hero{padding-top:78px;padding-bottom:90px;position:relative;}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;}
  .hero-eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;
    color:var(--gold-ink);margin-bottom:24px;display:flex;align-items:center;gap:12px;}
  .hero h1{font-family:var(--display);font-weight:500;font-size:clamp(44px,6.4vw,82px);
    line-height:.98;letter-spacing:-.02em;margin-bottom:26px;}
  .hero h1 em{font-style:italic;color:var(--gold-display);}
  .hero p.lede{font-size:18px;color:var(--ink-soft);max-width:30em;margin-bottom:36px;}
  .hero-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}

  .btn{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;letter-spacing:.04em;
    padding:14px 26px;border-radius:2px;transition:.25s;font-weight:500;text-transform:uppercase;}
  .btn-primary{background:var(--coral);color:var(--ink);font-weight:600;}
  .btn-primary:hover{background:var(--coral-deep);transform:translateY(-2px);}
  .btn-ghost{color:var(--ink);border:1px solid var(--ink);}
  .btn-ghost:hover{background:var(--ink);color:var(--paper);}
  .btn-arrow{font-size:15px;}

  .hero-art{position:relative;}
  .frame{background:var(--card);padding:20px;border:1px solid var(--line);
    box-shadow:0 2px 4px rgba(0,0,0,.04),0 34px 60px -34px rgba(40,28,16,.4);
    position:relative;}
  .frame img{width:100%;}
  .hero-art .frame{transform:rotate(-1.4deg);}
  .hero-tag{position:absolute;bottom:-22px;right:-14px;background:var(--ink);color:var(--paper);
    font-family:var(--display);font-size:13px;font-style:italic;padding:11px 18px;
    box-shadow:0 16px 30px -16px rgba(0,0,0,.5);transform:rotate(1.5deg);}
  .hero-tag b{font-style:normal;letter-spacing:.04em;}

  /* marquee strip */
  .strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
    padding:20px 0;margin-top:8px;overflow:hidden;}
  .strip-inner{display:flex;white-space:nowrap;font-family:var(--display);
    font-size:18px;color:var(--ink-soft);align-items:center;animation:scroll 26s linear infinite;width:max-content;}
  .strip-inner span{display:inline-flex;align-items:center;gap:48px;padding-right:48px;}
  .strip .sep{color:var(--gold-ink);}
  @keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ===== featured works ===== */
  section.block{padding-top:84px;padding-bottom:84px;}
  .works{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 32px;}
  .work{cursor:pointer;}
  .work .shot{background:var(--card);padding:16px;border:1px solid var(--line);overflow:hidden;
    box-shadow:0 1px 2px rgba(0,0,0,.03),0 16px 30px -26px rgba(40,28,16,.35);transition:.4s;}
  .work .shot .imgwrap{overflow:hidden;}
  .work .shot img{width:100%;transition:transform .7s cubic-bezier(.2,.7,.2,1);}
  .work:hover .shot{transform:translateY(-6px);box-shadow:0 8px 14px rgba(0,0,0,.05),0 30px 50px -28px rgba(40,28,16,.45);}
  .work:hover .shot img{transform:scale(1.045);}
  .work .meta{display:flex;justify-content:space-between;align-items:flex-start;margin-top:16px;gap:12px;}
  .work .meta h3{font-family:var(--display);font-size:20px;font-weight:500;line-height:1.1;}
  .work .meta .price{font-size:15px;color:var(--ink);white-space:nowrap;}
  .work .meta .medium{font-size:12.5px;color:var(--ink-faint);margin-top:3px;}
  .tag{display:inline-block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
    padding:4px 9px;border-radius:2px;margin-bottom:11px;font-weight:600;}
  .tag-orig{background:var(--coral);color:var(--ink);}
  .tag-print{background:transparent;color:var(--ink-soft);border:1px solid var(--line);}

  /* ===== philosophy band (warm dark gradient) ===== */
  .philo{position:relative;overflow:hidden;padding:100px 0;margin:0;color:#F6EEE0;
    background:
      radial-gradient(46% 56% at 87% 16%,rgba(84,102,159,.13),transparent 62%),
      linear-gradient(135deg,#2c1d13 0%,#1e1611 52%,#261a12 100%);}
  .philo .wrap{position:relative;z-index:3;text-align:center;}
  .philo .dots{margin-bottom:30px;}
  .philo blockquote{font-family:var(--display);font-style:italic;font-weight:400;
    font-size:clamp(26px,4vw,44px);line-height:1.18;max-width:18em;margin:0 auto 28px;letter-spacing:-.01em;}
  .philo cite{font-style:normal;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#F2B84A;}
  /* warm palette blooms */
  .philo .glow{position:absolute;width:580px;height:580px;border-radius:50%;z-index:0;filter:blur(26px);
    background:radial-gradient(circle,rgba(214,86,38,.5),transparent 64%);top:-180px;left:-140px;}
  .philo .glow.two{background:radial-gradient(circle,rgba(237,169,46,.44),transparent 64%);
    bottom:-210px;right:-160px;top:auto;left:auto;}

  /* ===== messy manifesto (warm dark gradient) ===== */
  .manifesto{position:relative;overflow:hidden;text-align:center;padding:112px 0 104px;color:#F6EEE0;
    background:
      radial-gradient(50% 60% at 15% 20%,rgba(214,86,38,.42),transparent 62%),
      radial-gradient(54% 64% at 87% 84%,rgba(237,169,46,.4),transparent 62%),
      radial-gradient(46% 56% at 88% 14%,rgba(84,102,159,.13),transparent 62%),
      linear-gradient(135deg,#2c1d13 0%,#1e1611 52%,#261a12 100%);}
  .m-line{font-family:var(--display);font-weight:500;font-size:clamp(40px,7.4vw,90px);
    line-height:1.0;letter-spacing:-.025em;color:#F7EFE2;}
  .m-line em{font-style:italic;color:#F3B945;}
  .m-resolve{font-family:var(--display);font-style:italic;font-weight:400;
    font-size:clamp(21px,3vw,33px);color:rgba(246,238,224,.74);margin-top:30px;max-width:20em;
    margin-left:auto;margin-right:auto;line-height:1.3;}
  .m-attr{font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(246,238,224,.5);
    margin-top:28px;display:flex;align-items:center;justify-content:center;gap:12px;}

  /* ===== framework triptych ===== */
  .framework{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .fcard{background:var(--card);border:1px solid var(--line);padding:32px 28px;border-radius:3px;
    position:relative;overflow:hidden;transition:.35s;}
  .fcard:hover{transform:translateY(-4px);box-shadow:0 22px 40px -28px rgba(40,28,16,.4);}
  .fcard::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;}
  .fcard.c1::before{background:#CE4322;}.fcard.c2::before{background:#4FA39C;}.fcard.c3::before{background:#E6A537;}
  .fcard .lab{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:14px;}
  .fcard h3{font-family:var(--display);font-size:27px;font-weight:500;margin-bottom:12px;line-height:1.05;}
  .fcard h3 em{font-style:italic;color:var(--gold-display);}
  .fcard p{font-size:15px;color:var(--ink-soft);}

  /* ===== podcast callout ===== */
  .podcast{background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:38px;
    display:grid;grid-template-columns:auto 1fr auto;gap:34px;align-items:center;}
  .pcover{width:124px;height:124px;border-radius:10px;display:grid;place-items:center;text-align:center;
    padding:14px;color:var(--paper);background:linear-gradient(140deg,#211C18,#4a4036);
    box-shadow:0 20px 34px -18px rgba(0,0,0,.55);}
  .pcover b{font-family:var(--display);font-style:italic;font-size:21px;line-height:1;}
  .pcover span{font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;margin-top:9px;opacity:.7;}
  .pinfo h3{font-family:var(--display);font-size:25px;font-weight:500;margin-bottom:8px;}
  .pinfo p{color:var(--ink-soft);font-size:15px;max-width:42em;}
  .listen{display:flex;gap:10px;flex-wrap:wrap;}
  .listen a{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;letter-spacing:.03em;
    padding:11px 17px;border:1px solid var(--ink);border-radius:40px;transition:.2s;white-space:nowrap;}
  .listen a:hover{background:var(--ink);color:var(--paper);}

  /* ===== about ===== */
  .about-hero{padding-top:70px;padding-bottom:30px;}
  .about-hero h1{font-family:var(--display);font-weight:500;font-size:clamp(40px,6vw,72px);
    line-height:1;letter-spacing:-.02em;max-width:11em;}
  .about-hero h1 em{font-style:italic;color:var(--gold-display);}
  .about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;padding:30px 0 40px;align-items:start;}
  .about-copy p{margin-bottom:20px;color:var(--ink-soft);font-size:16.5px;}
  .about-copy p.first::first-letter{font-family:var(--display);font-size:62px;float:left;
    line-height:.7;padding:6px 12px 0 0;color:var(--gold-display);font-weight:500;}
  .about-copy strong{color:var(--ink);font-weight:600;}
  .about-photo{position:sticky;top:120px;}
  .about-photo .frame{transform:rotate(1.4deg);}
  .about-photo .cap{font-size:12.5px;color:var(--ink-faint);margin-top:18px;text-align:center;font-style:italic;}
  .pull{font-family:var(--display);font-style:italic;font-size:27px;line-height:1.25;
    color:var(--ink);border-left:2px solid var(--gold-ink);padding:6px 0 6px 24px;margin:34px 0;}
  .about-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:30px;
    border-top:1px solid var(--line);padding-top:34px;}
  .about-facts .f .n{font-family:var(--display);font-size:34px;color:var(--gold-display);line-height:1;}
  .about-facts .f .l{font-size:13px;color:var(--ink-soft);margin-top:8px;}

  /* ===== shop ===== */
  .shop-head{padding:62px 0 26px;}
  .filters{display:flex;gap:10px;margin-bottom:42px;flex-wrap:wrap;}
  .filters button{font-size:13px;letter-spacing:.05em;padding:9px 20px;border:1px solid var(--line);
    border-radius:40px;color:var(--ink-soft);transition:.2s;text-transform:uppercase;}
  .filters button:hover{border-color:var(--ink);color:var(--ink);}
  .filters button.on{background:var(--ink);color:var(--paper);border-color:var(--ink);}
  .shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 32px;}
  .add{display:block;box-sizing:border-box;text-align:center;margin-top:14px;width:100%;border:1px solid var(--ink);color:var(--ink);
    padding:11px;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;transition:.2s;border-radius:2px;}
  .add:hover{background:var(--ink);color:var(--paper);}

  /* ===== FAQ ===== */
  .faq-wrap{max-width:840px;margin:0 auto;padding-top:62px;padding-bottom:30px;}
  .faq{border-bottom:1px solid var(--line);}
  .faq button.q{width:100%;text-align:left;display:flex;justify-content:space-between;
    align-items:center;gap:20px;padding:26px 0;font-family:var(--display);font-size:21px;
    font-weight:500;color:var(--ink);}
  .faq .plus{font-size:24px;color:var(--gold-ink);transition:transform .3s;flex-shrink:0;line-height:1;}
  .faq.open .plus{transform:rotate(45deg);}
  .faq .a{max-height:0;overflow:hidden;transition:max-height .4s ease;}
  .faq .a p{padding-bottom:26px;color:var(--ink-soft);max-width:62ch;}
  .faq.open .a{max-height:340px;}

  /* ===== contact ===== */
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-top:62px;padding-bottom:40px;align-items:start;}
  .contact-info h1{font-family:var(--display);font-weight:500;font-size:clamp(36px,5vw,58px);
    line-height:1.02;letter-spacing:-.02em;margin-bottom:22px;}
  .contact-info p{color:var(--ink-soft);margin-bottom:30px;max-width:34em;}
  .ci{border-top:1px solid var(--line);padding:20px 0;}
  .ci .k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:6px;}
  .ci .v{font-size:17px;}
  .form label{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
    color:var(--ink-soft);margin:0 0 8px;}
  .form .field{margin-bottom:22px;}
  .form input,.form select,.form textarea{width:100%;background:var(--card);border:1px solid var(--line);
    padding:13px 15px;font-family:inherit;font-size:15px;color:var(--ink);border-radius:2px;transition:.2s;}
  .form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--gold-ink);}
  .form textarea{resize:vertical;min-height:130px;}
  .form .ok{display:none;background:#EDF3EC;border:1px solid #B9D2B4;color:#3B5E36;
    padding:13px 16px;border-radius:2px;font-size:14.5px;margin-bottom:18px;}
  .form .ok.show{display:block;}

  /* ===== footer ===== */
  footer{position:relative;z-index:1;background:var(--paper-2);border-top:1px solid var(--line);margin-top:0;padding:64px 0 34px;}
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:46px;}
  footer .mark{font-family:var(--display);font-size:26px;font-weight:600;letter-spacing:.03em;}
  footer .ftag{color:var(--ink-soft);font-size:14.5px;margin-top:14px;max-width:26em;}
  footer h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:16px;}
  footer ul{list-style:none;}
  footer ul li{margin-bottom:11px;}
  footer ul button,footer ul a{font-size:14.5px;color:var(--ink-soft);transition:.2s;}
  footer ul button:hover,footer ul a:hover{color:var(--gold-ink);}
  .foot-base{border-top:1px solid var(--line);padding-top:26px;display:flex;
    justify-content:space-between;align-items:center;font-size:12.5px;color:var(--ink-faint);flex-wrap:wrap;gap:12px;}

  /* ===== responsive ===== */
  @media(max-width:920px){
    .hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr;gap:48px;}
    .about-photo{position:static;}
    .works,.shop-grid{grid-template-columns:repeat(2,1fr);}
    .foot-grid{grid-template-columns:1fr 1fr;}
    .framework{grid-template-columns:1fr;}
    .podcast{grid-template-columns:1fr;text-align:center;justify-items:center;}
  }
  @media(max-width:640px){
    .wrap{padding:0 22px;}
    .nav{padding:16px 22px;}
    .nav-links{display:none;}
    .nav-links.open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--paper);
      flex-direction:column;gap:0;padding:8px 22px 18px;border-bottom:1px solid var(--line);}
    .nav-links.open button{padding:13px 0;border-bottom:1px solid var(--line-soft);text-align:left;}
    .menu-btn{display:block;font-size:22px;}
    .works,.shop-grid,.foot-grid,.about-facts{grid-template-columns:1fr;}
    .hero-art .frame{transform:none;}
    .cart span.lbl{display:none;}
  }


/* ===== sticky + frosted header (survives Shopify's section wrapper) ===== */
/* Header/announcement live in the 'header-group' section group; Shopify wraps each
   in a <div> whose height equals its child, which would break the header's
   position:sticky. display:contents removes those wrapper boxes from layout so the
   <header> flows as a body-level child and sticks as it did pre-refactor. */
.shopify-section-group-header-group{display:contents;}
header{
  position:sticky;top:0;z-index:1000;
  background:rgba(247,243,234,.82);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
}
/* fallback for browsers without backdrop-filter: a more opaque bar */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  header{background:rgba(247,243,234,.97);}
}
/* keep the page from clipping the sticky context */
main#main-content{overflow:visible;}
.strip{overflow:hidden;}

/* ===== shop / collection page ===== */
.collection-head{padding-top:62px;padding-bottom:26px;}
.pagination{display:flex;gap:14px;justify-content:center;margin-top:50px;}
.pagination a,.pagination span{font-size:13px;color:var(--ink-soft);padding:8px 14px;border:1px solid var(--line);border-radius:40px;}
.pagination .current{background:var(--ink);color:var(--paper);border-color:var(--ink);}

/* ===== product page ===== */
.product-page{padding-top:42px;padding-bottom:96px;}
.back-link{display:inline-block;font-size:13px;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:26px;}
.back-link:hover{color:var(--coral);}
.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
.product-gallery .frame{background:var(--card);padding:20px;border:1px solid var(--line);
  box-shadow:0 2px 4px rgba(0,0,0,.04),0 30px 56px -34px rgba(40,28,16,.4);}
.product-gallery .thumbs{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap;}
.product-gallery .thumbs img{width:74px;height:74px;object-fit:cover;border:1px solid var(--line);background:var(--card);cursor:pointer;}
.product-info{position:sticky;top:120px;}
.product-info h1{font-family:var(--display);font-size:clamp(30px,4vw,48px);font-weight:500;line-height:1.04;letter-spacing:-.01em;margin:14px 0 10px;}
.product-info .medium{color:var(--ink-faint);font-size:14px;margin-bottom:18px;}
.product-info .price{font-family:var(--display);font-size:27px;margin-bottom:28px;}
.product-form{margin-bottom:24px;}
.product-form .field{margin-bottom:18px;}
.product-form label{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px;}
.product-form select{width:100%;background:var(--card);border:1px solid var(--line);padding:13px 15px;font-family:inherit;font-size:15px;border-radius:2px;}
.oneofone{font-size:13.5px;color:var(--ink-faint);font-style:italic;margin-top:14px;}
.sold{display:inline-block;border:1px solid var(--line);color:var(--ink-soft);padding:13px 18px;border-radius:2px;margin-bottom:24px;}
.product-desc{color:var(--ink-soft);max-width:46em;border-top:1px solid var(--line);padding-top:24px;margin-top:8px;}
.product-desc p{margin-bottom:14px;}

/* ===== generic page / utility ===== */
.page-h1{font-family:var(--display);font-weight:500;font-size:clamp(34px,5vw,56px);line-height:1.02;letter-spacing:-.02em;margin-bottom:24px;}
.richtext{color:var(--ink-soft);max-width:60ch;}
.richtext h2{font-family:var(--display);font-weight:500;color:var(--ink);font-size:1.6em;margin:1.2em 0 .4em;}
.richtext p{margin-bottom:1em;}
.richtext a{color:var(--gold-ink);text-decoration:underline;}
.ulink{color:var(--gold-ink);text-decoration:underline;}

/* ===== cart ===== */
.cart-table{width:100%;border-collapse:collapse;margin-bottom:30px;}
.cart-table td,.cart-table th{border-bottom:1px solid var(--line);padding:16px 8px;text-align:left;vertical-align:middle;font-size:15px;}
.cart-table img{width:70px;border:1px solid var(--line);background:var(--card);}
.cart-foot{display:flex;justify-content:flex-end;align-items:center;gap:24px;font-family:var(--display);font-size:20px;}

@media(max-width:920px){
  .product-grid{grid-template-columns:1fr;gap:36px;}
  .product-info{position:static;}
}

/* ===== cart drawer ===== */
html.cart-open{overflow:hidden;}
.cart-drawer{position:fixed;inset:0;z-index:10000;visibility:hidden;pointer-events:none;}
.cart-drawer.is-open{visibility:visible;pointer-events:auto;}
.cart-drawer__overlay{position:absolute;inset:0;background:rgba(27,25,22,.45);opacity:0;transition:opacity .3s ease;}
.cart-drawer.is-open .cart-drawer__overlay{opacity:1;}
.cart-drawer__panel{position:absolute;top:0;right:0;height:100%;width:420px;max-width:90vw;
  background:var(--paper);border-left:1px solid var(--line);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .32s cubic-bezier(.4,.0,.2,1);box-shadow:-18px 0 50px rgba(27,25,22,.12);}
.cart-drawer.is-open .cart-drawer__panel{transform:translateX(0);}
.cart-drawer__panel:focus{outline:none;}
.cart-drawer.is-busy .cart-drawer__body{opacity:.55;pointer-events:none;}

.cart-drawer__head{display:flex;align-items:center;justify-content:space-between;
  padding:22px 24px 16px;border-bottom:1px solid var(--line);}
.cart-drawer__head h2{font-family:var(--display);font-size:24px;font-weight:500;display:flex;align-items:center;gap:10px;}
.cart-drawer__close{font-size:30px;line-height:1;color:var(--ink-soft);background:none;border:0;cursor:pointer;padding:0 4px;transition:color .2s;}
.cart-drawer__close:hover{color:var(--ink);}

.cart-drawer__ship{padding:14px 24px;border-bottom:1px solid var(--line-soft);background:var(--paper-2);}
.cart-drawer__ship-msg{font-size:13px;color:var(--ink-soft);margin-bottom:8px;}
.cart-drawer__ship-msg b{color:var(--gold-ink);font-weight:600;}
.cart-drawer__bar{height:6px;border-radius:99px;background:var(--line);overflow:hidden;}
.cart-drawer__bar span{display:block;height:100%;width:0;background:var(--coral);border-radius:99px;transition:width .4s ease;}

.cart-drawer__body{flex:1;overflow-y:auto;padding:8px 24px;transition:opacity .2s;}
.cart-drawer__loading,.cart-drawer__empty{padding:48px 0;text-align:center;color:var(--ink-soft);}
.cart-drawer__empty{display:flex;flex-direction:column;align-items:center;gap:18px;}

.cart-line{display:grid;grid-template-columns:64px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--line-soft);}
.cart-line__media{display:block;}
.cart-line__media img,.cart-line__noimg{width:64px;height:64px;object-fit:cover;border:1px solid var(--line);background:var(--card);display:block;}
.cart-line__title{font-family:var(--display);font-size:16px;color:var(--ink);line-height:1.3;display:block;}
.cart-line__title:hover{color:var(--gold-ink);}
.cart-line__variant{font-size:12.5px;color:var(--ink-faint);margin-top:3px;}
.cart-line__price{font-size:14px;color:var(--ink-soft);margin-top:6px;}
.cart-line__controls{display:flex;align-items:center;justify-content:space-between;margin-top:10px;}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:99px;overflow:hidden;}
.qty__btn{width:30px;height:30px;background:none;border:0;cursor:pointer;font-size:16px;color:var(--ink);line-height:1;transition:background .2s;}
.qty__btn:hover{background:var(--paper-2);}
.qty__num{min-width:30px;text-align:center;font-size:14px;}
.cart-line__remove{background:none;border:0;cursor:pointer;font-size:12px;letter-spacing:.04em;color:var(--ink-faint);text-decoration:underline;text-underline-offset:3px;transition:color .2s;}
.cart-line__remove:hover{color:var(--ink);}

.cart-drawer__foot{padding:18px 24px 24px;border-top:1px solid var(--line);background:var(--card);}
.cart-drawer__subtotal{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--display);font-size:20px;margin-bottom:6px;}
.cart-drawer__note{font-size:12px;color:var(--ink-faint);margin-bottom:16px;}
.cart-drawer__checkout{width:100%;justify-content:center;}
.cart-drawer__checkout.is-loading{opacity:.7;}
.cart-drawer__view{display:block;text-align:center;margin-top:14px;font-size:13px;}
.btn.is-loading{opacity:.7;pointer-events:none;}

@media(max-width:480px){
  .cart-drawer__panel{width:100%;max-width:100vw;}
}
@media(prefers-reduced-motion:reduce){
  .cart-drawer__panel,.cart-drawer__overlay,.cart-drawer__bar span{transition:none;}
}