/*
Theme Name: LangSoul
Theme URI: https://langsoul.com
Author: LangSoul
Description: Editorial theme for LangSoul — Vietnamese craft-village works for an international audience. Built from the langsoul-design package: rice-paper ground, Cormorant Garamond and Be Vietnam Pro, hairline rules, quiet commerce.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.1
License: Proprietary
Text Domain: langsoul
*/

/* =========================================================================
   1. Tokens
   ====================================================================== */
:root{
  --paper:#F3EEE4; --ink:#1E1A16; --ink-soft:#3A342E; --muted:#5E5750; --accent:#A8302A;
  --indigo:#2C3A55; --indigo-muted:#B9C1D1; --indigo-text:#DCD5C7; --brass:#9A7B4F; --cream:#CFC7B8;
  --rule:rgba(30,26,22,.18); --rule-soft:rgba(30,26,22,.14); --rule-mid:rgba(30,26,22,.25); --rule-strong:rgba(30,26,22,.3);
  --rule-light:rgba(243,238,228,.16); --rule-light-mid:rgba(243,238,228,.25); --rule-light-strong:rgba(243,238,228,.35);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif; --sans:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:clamp(16px,4.2vw,60px); --wrap:1440px;
  --sec:72px; --sec-l:120px;
}
@media (min-width:720px){:root{--sec:120px}}

/* =========================================================================
   2. Base
   ====================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column}
body.on-ink{background:var(--ink);color:var(--paper)}
main{flex:1 0 auto}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}
.on-ink a,.band-indigo a{color:var(--paper)}
.on-ink a:hover{color:var(--cream)}
.band-indigo a:hover{color:#fff}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote,fieldset{margin:0}
ul,ol{padding:0;list-style:none}
fieldset{border:0;padding:0;min-width:0}
legend{padding:0}
button{font:inherit;color:inherit}
input,select,textarea,button{font-family:var(--sans)}
::selection{background:var(--accent);color:var(--paper)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:-1px!important;border:0!important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--paper);padding:10px 16px;z-index:200}
.skip:focus{left:8px}
strong{font-weight:500}
em{font-style:italic}

/* =========================================================================
   3. Typography
   ====================================================================== */
.serif{font-family:var(--serif)}
.serif-i{font-family:var(--serif);font-style:italic}
.eyebrow{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:400;line-height:1.5}
.eyebrow--rule{display:flex;align-items:center;gap:12px}
.eyebrow--rule::before{content:"";display:inline-block;width:22px;height:1px;background:var(--accent);flex:0 0 auto}
.eyebrow--sm{font-size:11px;letter-spacing:.16em}
.on-ink .eyebrow,.band-indigo .eyebrow{color:var(--cream)}
.band-indigo .eyebrow{color:var(--indigo-muted)}
@media (min-width:720px){.eyebrow{font-size:12.5px}.eyebrow--rule{gap:14px}.eyebrow--rule::before{width:28px}.eyebrow--sm{font-size:12px}}

.h1{font-family:var(--serif);font-weight:400;font-size:44px;line-height:.98;letter-spacing:-.01em}
.h1 em{font-weight:400}
.h1--lg{font-size:50px}
.h1--xl{font-size:76px;line-height:.92;letter-spacing:-.015em}
.h1--artisan{font-size:58px;line-height:.95;letter-spacing:-.015em}
.h1--md{font-size:44px;line-height:1}
.h1--sm{font-size:40px;line-height:1}
.h1--ctr{font-size:44px;line-height:1.02}
@media (min-width:720px){
  .h1{font-size:clamp(54px,6.2vw,88px)}
  .h1--lg{font-size:clamp(54px,6.6vw,96px)}
  .h1--xl{font-size:clamp(64px,8vw,120px)}
  .h1--artisan{font-size:clamp(56px,6.4vw,92px)}
  .h1--md{font-size:clamp(44px,4.6vw,64px)}
  .h1--sm{font-size:clamp(40px,4.2vw,56px)}
  .h1--ctr{font-size:clamp(48px,5.6vw,80px)}
}
.h2{font-family:var(--serif);font-weight:400;font-size:42px;line-height:1.02}
.h2 em{font-weight:400}
.h2--md{font-size:36px}
.h2--sm{font-size:34px;line-height:1.05}
.h2--quote{font-size:32px;line-height:1.18}
.h2--box{font-size:30px;line-height:1.1}
.h2--card{font-size:30px;line-height:1.05}
.h2--list{font-size:28px;line-height:1.05}
@media (min-width:720px){
  .h2{font-size:clamp(40px,4.2vw,60px)}
  .h2--md{font-size:clamp(36px,3.8vw,54px)}
  .h2--sm{font-size:clamp(32px,3.2vw,44px)}
  .h2--quote{font-size:clamp(34px,3.6vw,50px)}
  .h2--box{font-size:clamp(32px,3vw,42px)}
  .h2--card{font-size:30px}
  .h2--list{font-size:34px}
}
.h3{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.1}
.h3--lg{font-size:24px}
.h3--xl{font-size:26px}
.h3--letter{font-size:25px;line-height:1.15}
@media (min-width:720px){.h3{font-size:24px}.h3--lg{font-size:26px}.h3--xl{font-size:28px}.h3--letter{font-size:27px}}
.lede{font-size:16px;line-height:1.65;font-weight:300;color:var(--ink-soft)}
.lede--lg{font-size:17px}
@media (min-width:720px){.lede{font-size:17px}.lede--lg{font-size:18px}}
.body,.prose{font-size:15.5px;line-height:1.75;font-weight:300;color:var(--ink-soft)}
.prose>*+*{margin-top:16px}
.prose p+p{margin-top:16px}
@media (min-width:720px){.body,.prose{font-size:17px}.prose>*+*{margin-top:22px}.prose p+p{margin-top:22px}}
.body--sm{font-size:14.5px;line-height:1.7}
.body--md{font-size:15px;line-height:1.7}
.body--lg{font-size:16px;line-height:1.7}
@media (min-width:720px){.body--md{font-size:16px}}
.small{font-size:13px;line-height:1.6;color:var(--muted)}
.small--300{font-weight:300}
.caption{font-size:12.5px;letter-spacing:.06em;color:var(--muted);line-height:1.5}
.caption--xs{font-size:12px}
.meta{font-size:13px;color:var(--muted);line-height:1.45}
.meta--sm{font-size:12.5px}
.meta--xs{font-size:12px}
.quote{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--ink-soft);line-height:1.3}
.quote--lg{font-size:24px;line-height:1.25}
.quote--md{font-size:19px}
.quote--sm{font-size:17px;line-height:1.35}
@media (min-width:720px){.quote--lg{font-size:clamp(26px,2.6vw,34px)}.quote--md{font-size:22px}.quote--sm{font-size:19px}}
.on-ink .quote,.band-indigo .quote{color:var(--paper)}
.band-indigo .quote--soft{color:var(--indigo-text)}
.lede-serif{font-family:var(--serif);font-size:23px;line-height:1.3;font-weight:400;color:var(--ink)}
@media (min-width:720px){.lede-serif{font-size:30px}}
.vi-line{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--muted);line-height:1.3}
.vi-line span{font-style:normal;font-size:14px;font-family:var(--sans)}
@media (min-width:720px){.vi-line{font-size:20px}.vi-line span{font-size:15px}}
.numeral{font-family:var(--serif);font-size:32px;line-height:1;color:var(--accent)}
.numeral--sm{font-size:11px;letter-spacing:.2em;font-family:var(--sans)}
.numeral--xl{font-size:56px}
@media (min-width:720px){.numeral{font-size:40px}.numeral--sm{font-size:11.5px}}
.muted{color:var(--muted)}
.ink{color:var(--ink)}
.accent{color:var(--accent)}
.brass{color:var(--brass)}
.cream{color:var(--cream)}
.indigo-text{color:var(--indigo-text)}
.indigo-muted{color:var(--indigo-muted)}
.nowrap{white-space:nowrap}
.tac{text-align:center}
.tar{text-align:right}
.price{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1}
.price--sm{font-size:21px}
.price--md{font-size:24px}
.price--lg{font-size:28px}
@media (min-width:720px){.price{font-size:30px}.price--sm{font-size:24px}.price--md{font-size:24px}.price--lg{font-size:28px}}
.price-quiet{font-size:13px;color:var(--muted);white-space:nowrap}
.unique{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
@media (min-width:720px){.unique{font-size:11.5px}}
.count{font-family:var(--serif);font-size:20px;color:var(--ink);font-weight:500}
@media (min-width:720px){.count{font-size:22px}}

/* =========================================================================
   4. Layout
   ====================================================================== */
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);width:100%}
.wrap--narrow{max-width:1000px}
.sec{padding-bottom:var(--sec)}
.sec--top{padding-top:var(--sec)}
.sec--top-md{padding-top:48px}
.sec--top-lg{padding-top:56px}
@media (min-width:720px){.sec--top-md{padding-top:88px}.sec--top-lg{padding-top:112px}}
.sec--bottom-0{padding-bottom:0}
.sec-head{border-top:1px solid var(--ink);padding-top:22px;display:flex;flex-direction:column;gap:14px}
.sec-head--rule{border-top-color:var(--rule)}
.sec-head__t{display:flex;flex-direction:column;gap:8px}
.sec-head__r{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.sec-head__r p{max-width:520px}
@media (min-width:720px){
  .sec-head{padding-top:28px;gap:40px}
  .sec-head--split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));align-items:end}
  .sec-head--split .sec-head__r{justify-self:end}
  .sec-head--row{flex-direction:row;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:32px}
  .sec-head--base{align-items:baseline}
}
.stack{display:flex;flex-direction:column}
.stack>*+*{margin-top:var(--g,16px)}
.g-4{--g:4px}.g-6{--g:6px}.g-8{--g:8px}.g-10{--g:10px}.g-12{--g:12px}.g-14{--g:14px}.g-16{--g:16px}.g-18{--g:18px}.g-20{--g:20px}.g-22{--g:22px}.g-24{--g:24px}.g-28{--g:28px}.g-32{--g:32px}.g-40{--g:40px}.g-48{--g:48px}.g-56{--g:56px}
@media (min-width:720px){.g-md-8{--g:8px}.g-md-12{--g:12px}.g-md-14{--g:14px}.g-md-16{--g:16px}.g-md-18{--g:18px}.g-md-20{--g:20px}.g-md-24{--g:24px}.g-md-28{--g:28px}.g-md-32{--g:32px}.g-md-48{--g:48px}.g-md-56{--g:56px}.g-md-64{--g:64px}}
.row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.row--between{justify-content:space-between}
.row--base{align-items:baseline}
.row--start{align-items:flex-start}
.row--end{align-items:flex-end}
.row--28{gap:28px}
.row--20{gap:20px}
.row--12{gap:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min,300px)),1fr));gap:var(--gy,28px) var(--gx,16px)}
@media (min-width:720px){.grid{gap:var(--gy-md,40px) var(--gx-md,32px)}}
.grid--2m{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:720px){.grid--2m{grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min,280px)),1fr))}}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--split{--min:520px;--gy:24px;--gy-md:48px;--gx-md:48px;align-items:end}
.grid--split-64{--min:520px;--gy:24px;--gy-md:64px;--gx-md:64px;align-items:start}
.grid--story{--min:420px;--gy:24px;--gy-md:64px;--gx-md:64px;align-items:start}
.grid--center{align-items:center}
.grid--start{align-items:start}
.max-460{max-width:460px}.max-480{max-width:480px}.max-520{max-width:520px}.max-560{max-width:560px}.max-600{max-width:600px}.max-640{max-width:640px}.max-680{max-width:680px}.max-720{max-width:720px}.max-760{max-width:760px}.max-860{max-width:860px}.max-960{max-width:960px}.max-1000{max-width:1000px}
.self-end{justify-self:end}
.self-start{align-self:flex-start}
.self-center{align-self:center}
.w-full{width:100%}
.hide-m{display:none}
@media (min-width:720px){.hide-m{display:revert}.hide-d{display:none!important}}
/* Below 720px nothing marked desktop-only may show, whatever display a component sets later in this file */
@media (max-width:719px){.hide-m{display:none!important}}
@media (min-width:1024px){.hide-lg{display:none!important}}
/* Hidden below 1024px whatever display a component sets later in this file */
@media (max-width:1023px){.show-lg{display:none!important}}
.sticky{position:sticky;top:32px}
@media (max-width:719px){.sticky{position:static}}
.rule-t{border-top:1px solid var(--rule)}
.rule-t-ink{border-top:1px solid var(--ink)}
.rule-b{border-bottom:1px solid var(--rule)}
.pt-8{padding-top:8px}.pt-12{padding-top:12px}.pt-16{padding-top:16px}.pt-20{padding-top:20px}.pt-24{padding-top:24px}.pt-28{padding-top:28px}.pt-32{padding-top:32px}
.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-40{margin-top:40px}.mt-48{margin-top:48px}.mt-56{margin-top:56px}
@media (min-width:720px){.mt-md-96{margin-top:96px}.mt-md-112{margin-top:112px}.mt-md-120{margin-top:120px}}
.band-indigo{background:var(--indigo);color:var(--paper)}
.band-indigo .h2,.band-indigo .h3{color:var(--paper)}
.band-indigo .body,.band-indigo .prose{color:var(--indigo-text)}
.band-indigo .meta,.band-indigo .small{color:var(--indigo-muted)}
.band-indigo .rule-t{border-top-color:var(--rule-light-mid)}
.on-ink .meta,.on-ink .small,.on-ink .caption{color:var(--cream)}
.on-ink .body,.on-ink .prose,.on-ink .lede{color:var(--indigo-text)}
.box{border:1px solid var(--rule);padding:22px 18px}
.box--ink{border-color:var(--ink)}
.box--light{border-color:var(--rule-light-mid)}
.box--pad{padding:22px 18px}
@media (min-width:720px){.box{padding:28px 32px}.box--pad{padding:clamp(24px,3vw,40px)}.box--xl{padding:clamp(32px,4vw,64px)}.box--aside{padding:36px}}

/* =========================================================================
   5. Placeholders & images
   ====================================================================== */
.ph{position:relative;overflow:hidden;display:block;width:100%;background-image:repeating-linear-gradient(135deg,rgba(30,26,22,.07) 0 1.5px,transparent 1.5px 9px)}
.ph>span{position:absolute;left:10px;bottom:8px;font:400 10px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(30,26,22,.6);pointer-events:none}
.ph.dark>span{color:rgba(243,238,228,.7)}
.on-ink .ph{background-image:repeating-linear-gradient(135deg,rgba(243,238,228,.06) 0 1.5px,transparent 1.5px 9px)}
.on-ink .ph>span{color:rgba(243,238,228,.6)}
@media (min-width:720px){.ph>span{left:14px;bottom:12px;font-size:11px}}
.ph.has-img{background-image:none}
.ph-img,.ph.has-img img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.ph-cap{position:absolute;left:10px;bottom:8px;font:400 10px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(243,238,228,.85);text-shadow:0 0 12px rgba(0,0,0,.4)}
.ph--round{border-radius:50%}
.ph--thumb{width:88px;height:88px;flex:0 0 auto;aspect-ratio:1/1!important}
.ph--fixed{flex:0 0 auto}
a.ph{text-decoration:none}

/* Seal */
.seal{width:56px;height:56px;background:var(--accent);display:flex;align-items:center;justify-content:center;transform:rotate(-4deg);flex:0 0 auto}
.seal svg{width:68%;height:68%}
.seal--sm{width:46px;height:46px}
.seal--md{width:52px;height:52px}
.seal--lg{width:72px;height:72px}
@media (min-width:720px){.seal{width:64px;height:64px}.seal--sm{width:52px;height:52px}.seal--md{width:56px;height:56px}.seal--lg{width:88px;height:88px}.seal--hero{width:72px;height:72px}}
.seal--corner{position:absolute;right:-6px;bottom:-10px}
@media (min-width:720px){.seal--corner{right:-14px;bottom:-14px;width:72px;height:72px}}
.seal--in{position:absolute;right:12px;top:12px}
@media (min-width:720px){.seal--in{right:16px;top:16px}}
.drum{color:var(--brass);width:48px;height:48px;flex:0 0 auto}
@media (min-width:720px){.drum{width:56px;height:56px}}
.drum--sm{width:34px;height:34px}
@media (min-width:720px){.drum--sm{width:40px;height:40px}}
.drum--xl{width:min(320px,100%);height:auto}
.logo{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.logo svg{width:26px;height:26px;flex:0 0 auto}
.logo__word{font-family:var(--serif);font-size:22px;letter-spacing:.16em;font-weight:500;line-height:1}
@media (min-width:720px){.logo{gap:14px}.logo svg{width:30px;height:30px}.logo__word{font-size:27px}}
.logo--sm svg{width:24px;height:24px}
.logo--sm .logo__word{font-size:22px}
@media (min-width:720px){.logo--sm svg{width:26px;height:26px}.logo--sm .logo__word{font-size:24px}}
.logo--xs svg{width:22px;height:22px}
.logo--xs .logo__word{font-size:20px}

/* =========================================================================
   6. Buttons, links, forms
   ====================================================================== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);padding:0 24px;min-height:52px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;text-decoration:none;text-align:center;transition:background .15s,color .15s}
.btn:hover{background:#2E2823;color:var(--paper)}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.btn--full{display:flex;width:100%}
.btn--light{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--light:hover{background:#fff;color:var(--ink)}
.btn--lg{min-height:54px;padding:0 32px}
.btn--md{min-height:48px;padding:0 22px;font-size:12.5px;letter-spacing:.14em}
.btn[disabled],.btn.is-busy{opacity:.55;cursor:default}
@media (min-width:720px){.btn{padding:0 28px;min-height:48px}.btn--lg{min-height:54px;padding:0 32px}.btn--xl{min-height:56px}}
.link-u{display:inline-block;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;border-bottom:1px solid var(--accent);padding:6px 0;text-decoration:none;color:var(--ink);line-height:1.3}
.link-u:hover{color:var(--accent)}
.link-u--brass{border-bottom-color:var(--brass);color:var(--paper)}
.link-u--brass:hover{color:var(--cream)}
.link-u--sm{font-size:12px}
.link-u--xs{font-size:12px;padding:4px 0}
@media (min-width:720px){.link-u{font-size:13px}.link-u--sm{font-size:12.5px}.link-u--xs{font-size:12.5px}}
.link-q{background:none;border:0;padding:8px 0;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);cursor:pointer;border-bottom:1px solid var(--rule-mid);line-height:1.2}
@media (min-width:720px){.link-q{padding:6px 0;font-size:12.5px}}
.link-plain{color:var(--muted);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule-mid)}
.link-plain:hover{color:var(--accent)}
.arrow{width:18px;height:18px;flex:0 0 auto}
.f{display:flex;flex-direction:column;gap:6px}
.f label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.f label .opt{text-transform:none;letter-spacing:0;color:var(--brass)}
.f input,.f select,.f textarea{font-family:var(--sans);font-size:16px;color:var(--ink);background:transparent;border:1px solid var(--rule-strong);min-height:50px;padding:0 14px;width:100%;border-radius:0;appearance:none;-webkit-appearance:none}
.f select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231E1A16' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
.f textarea{padding:14px;min-height:110px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--ink)}
.f input::placeholder,.f textarea::placeholder{color:rgba(94,87,80,.7)}
.f.is-error input,.f.is-error select,.f.is-error textarea{border-color:var(--accent)}
@media (min-width:720px){.f{gap:8px}.f label{font-size:11.5px}.f input,.f select,.f textarea{font-size:15px}}
.f-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.f-row--3{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:720px){.f-row{gap:16px}.f-row--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.check{display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--ink-soft);cursor:pointer}
.check input{width:18px;height:18px;margin:0;accent-color:var(--ink);flex:0 0 auto}
@media (min-width:720px){.check{font-size:14px}}
.form-note{font-size:12.5px;line-height:1.6;color:var(--muted);font-weight:300}
.form-msg{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--ink);line-height:1.35}
.form-msg.is-error{color:var(--accent)}
.legend{font-family:var(--serif);font-size:23px;font-weight:500;padding:0 0 12px;border-bottom:1px solid var(--ink);width:100%;margin-bottom:16px}
@media (min-width:720px){.legend{font-size:26px;padding-bottom:16px;margin-bottom:20px}}
.radios{display:flex;flex-direction:column;border:1px solid var(--rule-strong)}
.radios label{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--rule);font-size:14px;cursor:pointer}
.radios label:last-child{border-bottom:0}
.radios label.is-on{background:rgba(30,26,22,.04)}
.radios input{width:18px;height:18px;margin:0;accent-color:var(--ink)}
.radios .hint{margin-left:auto;font-size:12px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
@media (min-width:720px){.radios label{padding:16px 18px;font-size:14.5px;gap:14px}}
.inline-form{display:flex;flex-direction:column;gap:12px}
.inline-form input{min-height:52px;padding:0 16px;border:1px solid var(--ink);background:transparent;font-size:16px;color:var(--ink);width:100%;border-radius:0}
.inline-form button{min-height:52px;padding:0 24px}
@media (min-width:720px){.inline-form{flex-direction:row;gap:0;align-items:stretch;flex-wrap:wrap}.inline-form input{flex:1 1 240px;width:auto;border-right:0;font-size:15px;padding:0 18px}.inline-form button{padding:0 28px}}
.select-q{font-family:inherit;font-size:13px;min-height:44px;padding:0 36px 0 12px;border:1px solid var(--rule-mid);background:transparent;color:var(--ink);border-radius:0;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231E1A16' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.select-xs{min-height:40px;font-size:14px;padding:0 30px 0 10px}

/* Tabs & chips */
.tabs{display:flex;gap:8px}
.tab{font-family:inherit;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:0 16px;min-height:44px;border:1px solid var(--rule-mid);background:transparent;color:var(--ink);cursor:pointer;white-space:nowrap;flex:0 0 auto;text-decoration:none;display:inline-flex;align-items:center}
.tab.is-on{border-color:var(--ink);background:var(--ink);color:var(--paper)}
@media (min-width:720px){.tabs{gap:2px;flex-wrap:wrap}.tab{font-size:12.5px;border-color:transparent}.tab:hover{border-color:var(--rule-mid)}.tab.is-on{border-color:var(--ink)}}
.chips{display:flex;gap:8px}
.chip{font-family:inherit;font-size:13px;padding:0 16px;min-height:44px;border:1px solid var(--rule-mid);border-radius:999px;background:transparent;color:var(--ink-soft);cursor:pointer;white-space:nowrap;flex:0 0 auto;display:inline-flex;align-items:center;text-decoration:none}
.chip.is-on{border-color:var(--ink);background:var(--paper);color:var(--ink)}
.chip:hover{color:var(--ink);border-color:var(--ink)}
@media (min-width:720px){.chips{gap:10px;flex-wrap:wrap}.chip{min-height:40px}}
.scroll{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.scroll::-webkit-scrollbar{display:none}
.scroll>*{flex:0 0 auto}
.scroll--bleed{margin-left:calc(-1 * var(--gutter));margin-right:calc(-1 * var(--gutter));padding-left:var(--gutter);padding-right:var(--gutter)}
.scroll--snap{scroll-snap-type:x mandatory}
.scroll--snap>*{scroll-snap-align:start}
@media (min-width:720px){.scroll--wrap{flex-wrap:wrap;overflow:visible;margin:0;padding:0}}

/* =========================================================================
   7. Header, menu, footer
   ====================================================================== */
.site-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px var(--gutter);border-bottom:1px solid var(--rule-soft);position:relative;z-index:20;background:var(--paper)}
.on-ink .site-head{background:var(--ink);border-bottom-color:var(--rule-light)}
@media (min-width:720px){.site-head{padding:22px var(--gutter);gap:24px;flex-wrap:wrap}}
/* Small phones (360px): back + logo + bag + menu must fit on one line */
@media (max-width:389px){.site-head{gap:8px}.site-head .logo{gap:8px;min-width:0}.site-head .logo__word{font-size:19px;letter-spacing:.12em}.site-head .icon-btn{padding:8px}.icon-btn--menu{margin-right:-8px}}
.site-head__nav{display:none;gap:36px;flex-wrap:wrap;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.site-head__nav a{padding:6px 0;text-decoration:none;border-bottom:1px solid transparent}
.site-head__nav a.is-on,.site-head__nav a[aria-current=page]{border-bottom-color:var(--accent)}
@media (min-width:1024px){.site-head__nav{display:flex}}
.site-head__tools{display:flex;align-items:center;gap:6px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
@media (min-width:1024px){.site-head__tools{gap:26px}}
.site-head__tools .collection{display:none;padding:6px 0;border-bottom:1px solid transparent}
.site-head__tools .collection.is-on{border-bottom-color:var(--accent)}
@media (min-width:1024px){.site-head__tools .collection{display:inline-block}}
.icon-btn{display:flex;align-items:center;gap:6px;padding:10px;background:none;border:0;cursor:pointer;color:var(--ink);text-decoration:none;font-size:12.5px;font-weight:500;letter-spacing:.16em}
.icon-btn svg{width:20px;height:20px}
.icon-btn--menu svg{width:22px;height:22px}
.icon-btn--menu{margin-right:-10px}
@media (min-width:1024px){.icon-btn{padding:10px;margin:-10px}.icon-btn--menu{display:none}.icon-btn--bag{margin:0;padding:6px 0}}
.icon-btn--back{margin-left:-10px}
@media (min-width:1024px){.icon-btn--back{display:none}}
.bag-count.is-empty{opacity:.75}
.steps-nav{list-style:none;display:flex;gap:28px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--muted);flex-wrap:wrap}
.steps-nav li.is-on{color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:4px}
.steps-nav a{color:var(--muted)}
.steps-nav--m{display:flex;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);align-items:center;gap:6px}
.steps-nav--m svg{width:14px;height:14px}
.secure{display:flex;align-items:center;gap:8px;font-size:12.5px;letter-spacing:.06em;color:var(--muted)}
.secure svg{width:16px;height:16px}

/* Full-screen menu (ink) */
.menu{position:fixed;inset:0;background:var(--ink);color:var(--paper);z-index:100;display:none;flex-direction:column;overflow-y:auto}
.menu.is-open{display:flex}
body.menu-open{overflow:hidden}
.menu__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px var(--gutter);border-bottom:1px solid var(--rule-light)}
.menu__head .icon-btn{color:var(--paper)}
.menu__search{padding:20px var(--gutter) 0}
.menu__search div{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--rule-light-strong);padding:8px 0}
.menu__search svg{width:18px;height:18px;color:var(--cream);flex:0 0 auto}
.menu__search input{flex:1 1 auto;min-height:40px;border:0;background:transparent;font-family:var(--sans);font-size:16px;color:var(--paper);outline:none}
.menu__search input::placeholder{color:rgba(207,199,184,.7)}
.menu__nav{padding:28px var(--gutter) 0;display:flex;flex-direction:column;gap:2px;flex:1 0 auto;max-width:720px;width:100%}
.menu__nav>a{display:flex;justify-content:space-between;align-items:center;text-decoration:none;font-family:var(--serif);font-size:40px;font-weight:400;line-height:1;padding:12px 0;min-height:48px;color:var(--paper)}
.menu__nav>a svg{width:20px;height:20px;color:var(--cream)}
@media (min-width:720px){.menu__nav>a{font-size:52px}}
.menu__sub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;padding-top:28px;margin-top:20px;border-top:1px solid var(--rule-light);font-size:14px}
.menu__sub a{color:var(--cream);padding:8px 0}
.menu__foot{padding:24px var(--gutter) 28px;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--rule-light)}
.menu__foot .quote{font-size:17px;color:var(--cream)}
.menu__foot .caption{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}

/* Footer */
.site-foot{background:var(--ink);color:var(--paper);margin-top:auto}
.site-foot a{color:var(--paper)}
.site-foot a:hover{color:var(--cream)}
.site-foot__in{padding:56px var(--gutter) 32px;display:flex;flex-direction:column;gap:40px;max-width:var(--wrap);margin:0 auto}
@media (min-width:720px){.site-foot__in{padding:80px var(--gutter) 40px;gap:64px}}
.site-foot__brand{display:flex;flex-direction:column;gap:14px}
.site-foot__brandcol{grid-column:1/-1}
@media (min-width:720px){.site-foot__brandcol{grid-column:auto}}
.site-foot__brand .quote{font-size:18px;color:var(--cream);max-width:280px}
@media (min-width:720px){.site-foot__brand{gap:18px}.site-foot__brand .quote{font-size:19px}}
.site-foot__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px;font-size:14px}
@media (min-width:720px){.site-foot__cols{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:40px}}
.site-foot__col{display:flex;flex-direction:column;gap:10px}
.site-foot__col a{padding:4px 0}
.site-foot__col .eyebrow{font-size:11px;color:var(--brass);margin-bottom:4px}
.site-foot__col p{color:var(--cream);line-height:1.6}
@media (min-width:720px){.site-foot__col{gap:12px}.site-foot__col a{padding:3px 0}.site-foot__col .eyebrow{font-size:11.5px;margin-bottom:6px}}
.site-foot__legal{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--rule-light);padding-top:20px;font-size:12px;letter-spacing:.06em;color:var(--cream)}
.site-foot__legal a{color:var(--cream)}
@media (min-width:720px){.site-foot__legal{flex-direction:row;justify-content:space-between;flex-wrap:wrap;gap:20px;padding-top:24px;font-size:12.5px}}
.site-foot__legal .links{display:flex;gap:20px}
.site-foot--slim .site-foot__in{padding:40px var(--gutter);flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;font-size:12.5px;letter-spacing:.06em;color:var(--cream)}
.site-foot--slim .links{display:flex;gap:24px;flex-wrap:wrap}
.site-foot--slim a{color:var(--cream)}
.site-foot--quiet{background:transparent;color:var(--muted);border-top:1px solid var(--rule-soft);margin-top:48px}
.site-foot--quiet .site-foot__in{padding:20px var(--gutter) 28px;flex-direction:row;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12px;letter-spacing:.06em}
.site-foot--quiet a{color:var(--muted)}
.site-foot--ink{background:transparent;border-top:1px solid var(--rule-light)}
.site-foot--ink .site-foot__in{padding:20px var(--gutter) 28px;flex-direction:row;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:11.5px;letter-spacing:.06em;color:var(--cream);line-height:1.6}

/* =========================================================================
   8. Components
   ====================================================================== */
/* Breadcrumb */
.crumbs{display:flex;gap:12px;flex-wrap:wrap;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:24px}
.crumbs a{color:var(--muted)}
.crumbs .cur{color:var(--ink)}

/* Ticker */
.ticker{border-top:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);padding:14px var(--gutter);display:flex;gap:28px;white-space:nowrap;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ticker em{color:var(--accent);font-style:normal}
@media (min-width:720px){.ticker{gap:40px;flex-wrap:wrap;justify-content:center;padding:18px var(--gutter);font-size:12.5px;overflow:visible}}

/* Work card */
.card{display:flex;flex-direction:column;gap:10px;color:var(--ink);text-decoration:none}
.card:hover{color:var(--ink)}
.card:hover .h3{color:var(--accent)}
@media (min-width:720px){.card{gap:16px}}
.card__meta{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.card__meta>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.card__meta .h3{overflow-wrap:break-word}
/* Two cards per row on a phone: the price goes under the title instead of squeezing it */
@media (max-width:519px){.card__meta{flex-direction:column;gap:4px}.card__meta .price-quiet{order:2}}
.card--craft{gap:12px}
.card--craft .h3{font-size:22px}
.card--craft .vi{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--muted)}
.card--craft .meta{font-size:12px}
@media (min-width:720px){.card--craft{gap:18px}.card--craft .h3{font-size:28px}.card--craft .vi{font-size:18px}.card--craft .meta{font-size:13px;letter-spacing:.06em;margin-top:4px}}
.card--craft>div{display:flex;flex-direction:column;gap:6px}
.card--letter{gap:14px}
@media (min-width:720px){.card--letter{gap:18px}}
.card--artisan{gap:8px}
.card--artisan .name{font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.1}
.card--artisan .meta{font-size:12px}
@media (min-width:720px){.card--artisan{gap:12px}.card--artisan .name{font-size:23px}.card--artisan .meta{font-size:12.5px}}
.card--village{gap:8px}
.card--village .name{font-family:var(--serif);font-size:19px;font-weight:500}
.card--village .meta{font-size:12px}
@media (min-width:720px){.card--village{gap:10px}.card--village .name{font-size:22px}.card--village .meta{font-size:12.5px}}
.card--m-list{display:flex;flex-direction:row;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.card--m-list>div{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px}
.card--m-list .h3{font-size:21px}
/* Work feature (home) */
.feature{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,560px),1fr));gap:18px;align-items:center}
@media (min-width:720px){.feature{gap:56px}.feature>div{padding-left:clamp(0px,2vw,24px)}}
/* Village list rows */
.vrow{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:16px 0;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none}
.vrow:hover{background:rgba(30,26,22,.04)}
.vrow .name{font-family:var(--serif);font-size:23px;font-weight:500;display:block}
.vrow .craft{font-size:13px;color:var(--muted)}
.vrow .dist{font-size:12px;letter-spacing:.06em;color:var(--muted);white-space:nowrap}
.vrow>span:first-child{display:flex;flex-direction:column;gap:3px}
@media (min-width:720px){.vrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px 24px;padding:22px 0}.vrow .name{font-size:26px}.vrow .craft{font-size:14px}.vrow .dist{font-size:13px;text-align:right}.vrow>span:first-child{display:contents}.vrow .where{font-size:14px;color:var(--muted)}}
.vrow .where{display:none}
@media (min-width:720px){.vrow .where{display:block}}
/* Atlas rows */
.arow{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none}
.arow>span:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.arow .name{display:flex;align-items:baseline;gap:8px}
.arow .name b{font-family:var(--serif);font-size:22px;font-weight:500;line-height:1.1}
.arow .name svg{width:14px;height:14px;flex:0 0 auto;transform:translateY(1px)}
.arow .craft{font-size:13.5px}
.arow .craft em{font-family:var(--serif);font-size:15px;color:var(--muted)}
.arow .prov{font-size:12.5px;color:var(--muted)}
.arow .note{display:none}
.arow .arrow{color:var(--muted);margin-top:6px}
a.arow:hover{background:rgba(30,26,22,.04)}
span.arow .arrow{visibility:hidden}
@media (min-width:720px){
  .arow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px 24px;align-items:baseline;padding:18px 8px;margin:0 -8px}
  .arow>span:first-child{display:contents}
  .arow .name{gap:10px}.arow .name b{font-size:24px}.arow .name svg{width:16px;height:16px}
  .arow .craft{display:flex;flex-direction:column;gap:2px;font-size:14px}.arow .craft em{display:block}
  .arow .prov{font-size:13.5px}
  .arow .note{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:right}
  .arow .arrow{display:none}
}
.agroup__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--ink)}
.agroup__head .n{font-size:12px;letter-spacing:.06em;color:var(--muted);white-space:nowrap}
@media (min-width:720px){.agroup__head{padding-bottom:14px}.agroup__head .n{font-size:12.5px}}
.map-legend{display:flex;flex-direction:column;gap:10px;font-size:12.5px;color:var(--muted)}
.map-legend span{display:inline-flex;align-items:center;gap:8px}
.map-legend i{width:9px;height:9px;border-radius:50%;background:var(--accent);display:inline-block;flex:0 0 auto}
.map-legend i.rec{width:7px;height:7px;background:var(--muted)}
.map-legend i.city{width:9px;height:9px;background:transparent;border:1px solid var(--ink);box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 4px var(--ink)}
@media (min-width:720px){.map-legend{flex-direction:row;flex-wrap:wrap;gap:20px;align-items:center}}
.map-m{display:flex;gap:16px;align-items:center}
.map-m svg{width:124px;flex:0 0 auto}
.map-d{display:none}
@media (min-width:720px){.map-m{display:none}.map-d{display:flex;flex-direction:column;gap:16px;max-width:420px}}

/* Facts dl (artisan / village / provenance) */
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;border-top:1px solid var(--ink)}
.facts>div{padding:16px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:6px}
.facts dt{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.facts dd{font-family:var(--serif);font-size:21px;font-weight:500;line-height:1.15}
.facts dd em{font-size:17px;font-weight:400;color:var(--muted);display:block}
@media (min-width:720px){
  .facts{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:0 32px;border-bottom:1px solid var(--rule)}
  .facts>div{padding:24px 0;border-bottom:0;gap:8px}.facts dt{font-size:11.5px}.facts dd{font-size:26px;line-height:1.1}.facts dd em{font-size:20px}
}
.on-ink .facts{border-top-color:var(--paper)}
.on-ink .facts>div{border-bottom-color:var(--rule-light)}
.on-ink .facts dt{color:var(--cream)}
.on-ink .facts dd em{color:var(--cream)}
@media (min-width:720px){.on-ink .facts{border-bottom-color:var(--rule-light)}.on-ink .facts>div{padding:26px 0}}
/* Spec dl (work) */
.spec{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.spec>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:13px 0;border-bottom:1px solid var(--rule)}
.spec dt{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.spec dd{font-size:13.5px}
@media (min-width:720px){.spec>div{padding:14px 0}.spec dt{font-size:12px}.spec dd{font-size:14.5px}}
.spec--sm>div{padding:12px 0}
/* Steps (roman numerals) */
.steps{display:flex;flex-direction:column}
.step{display:flex;gap:18px;border-top:1px solid var(--rule);padding:18px 0}
.step:last-child{border-bottom:1px solid var(--rule)}
.step .numeral{width:40px;flex:0 0 auto}
.step>div{display:flex;flex-direction:column;gap:6px}
.step .h3{font-size:23px}
.step p{font-size:14px;line-height:1.65;font-weight:300;color:var(--ink-soft)}
@media (min-width:720px){
  .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:40px 32px}
  .steps--4{--min:240px}.steps--260{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
  .step{flex-direction:column;gap:14px;padding:20px 0 0}.step:last-child{border-bottom:0}
  .step .numeral{width:auto}.step .h3{font-size:26px}.step p{font-size:14.5px;line-height:1.7}
}
/* Promises (house) */
.promise{display:flex;flex-direction:column;gap:14px;padding:28px 0;border-top:1px solid var(--rule)}
.promise:last-child{border-bottom:1px solid var(--rule)}
.promise .h3{font-size:26px;line-height:1.1}
.promise p{font-size:15px;line-height:1.7;font-weight:300;color:var(--ink-soft)}
@media (min-width:720px){
  .promise{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:24px 40px;padding:32px 0;align-items:start}
  .promise .h3{font-size:32px}.promise p{font-size:15.5px}
  /* numeral | promise | why — fixed columns so the heading never drops beside the wrong paragraph */
  .promise{grid-template-columns:96px minmax(0,1fr) minmax(0,1.35fr)}
}
/* Glossary */
.gloss{display:flex;flex-direction:column;gap:18px}
.gloss>div{display:flex;flex-direction:column;gap:4px}
.gloss .term{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.1}
.gloss .def{font-size:13.5px;line-height:1.6;font-weight:300;color:var(--ink-soft)}
@media (min-width:720px){.gloss{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:28px 40px;align-items:start}.gloss .eyebrow{grid-column:1/-1}.gloss>div{gap:6px}.gloss .term{font-size:24px}.gloss .def{font-size:14px}}
/* Artisan row (work page) */
.maker-row{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:14px 0}
.maker-row>div{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.maker-row .name{font-size:14.5px;font-weight:500;color:var(--ink)}
.maker-row .meta{font-size:12px}
.maker-row .ph{width:48px;height:48px;flex:0 0 auto}
.maker-row .arrow{margin-left:auto}
@media (min-width:720px){.maker-row{gap:16px;padding:16px 0}.maker-row .name{font-size:15px}.maker-row .meta{font-size:13px;letter-spacing:.04em}.maker-row .ph{width:56px;height:56px}}
/* Gallery */
.gallery{display:flex;flex-direction:column;gap:16px}
.gallery__main{position:relative}
.gallery__thumbs{display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.gallery__thumbs button{padding:0;border:1px solid transparent;cursor:pointer;background:transparent;aspect-ratio:1/1;display:block;width:100%}
.gallery__thumbs button.is-on{border-color:var(--ink)}
.gallery__thumbs .ph{height:100%}
.gallery__thumbs .ph>span{left:8px;bottom:6px}
.gallery__swipe{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gallery__swipe::-webkit-scrollbar{display:none}
.gallery__swipe>*{flex:0 0 100%;scroll-snap-align:start;position:relative}
.gallery__dots{display:flex;gap:6px;justify-content:center;padding-top:12px}
.gallery__dots span{width:18px;height:2px;background:rgba(30,26,22,.2)}
.gallery__dots span.is-on{background:var(--ink)}
@media (min-width:720px){.gallery__swipe,.gallery__dots{display:none}.gallery__thumbs{display:grid}.gallery__main{display:block}}
@media (max-width:719px){.gallery__main--d{display:none}}
/* Timeline (confirmation) */
.timeline{display:flex;flex-direction:column}
.timeline li{display:flex;gap:16px;padding:14px 0;border-top:1px solid var(--rule);color:var(--muted)}
.timeline li:first-child{border-top:2px solid var(--ink);color:var(--ink)}
.timeline li:last-child{border-bottom:1px solid var(--rule)}
.timeline li.is-done{color:var(--ink)}
.timeline .when{font-size:11px;letter-spacing:.16em;text-transform:uppercase;width:92px;flex:0 0 auto;padding-top:4px}
.timeline .what{font-family:var(--serif);font-size:20px;line-height:1.15}
@media (min-width:720px){
  .timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr));gap:24px 16px}
  .timeline li{flex-direction:column;gap:10px;padding:12px 0 0;border-top:2px solid rgba(30,26,22,.2)}
  .timeline li:first-child,.timeline li.is-done{border-top-color:var(--ink)}.timeline li:last-child{border-bottom:0}
  .timeline .when{width:auto;font-size:11.5px;letter-spacing:.2em;padding:0}.timeline .what{font-size:21px;font-weight:500;line-height:1.1}
}
/* Journey (provenance) */
.journey{display:flex;flex-direction:column;border-top:1px solid var(--rule-light)}
.journey li{display:flex;flex-direction:column;gap:4px;padding:14px 0;border-bottom:1px solid var(--rule-light)}
.journey .d{font-size:11px;letter-spacing:.1em;color:var(--cream)}
.journey .e{font-family:var(--serif);font-size:19px;line-height:1.2}
.journey li.is-pending{color:var(--cream)}
.journey li.is-pending .e{font-style:italic}
@media (min-width:720px){.journey li{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:18px 0}.journey .d{font-size:12.5px;padding-top:4px}.journey .e{font-size:22px}}
/* Bag items */
.bag-item{display:flex;gap:16px;padding:20px 0;border-bottom:1px solid var(--rule);align-items:flex-start}
.bag-item .ph{width:96px;flex:0 0 auto}
.bag-item>div{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-width:0}
.bag-item .h3{font-size:22px}
.bag-item .meta{line-height:1.45}
.bag-item .price{align-self:flex-end}
@media (min-width:720px){.bag-item{gap:24px;padding:28px 0}.bag-item .ph{width:140px}.bag-item>div{gap:8px}.bag-item .h3{font-size:28px}.bag-item .meta{font-size:13.5px}.bag-item .price{align-self:flex-start;padding-top:2px}}
.summary{border:1px solid var(--ink);padding:22px 18px;display:flex;flex-direction:column;gap:18px}
@media (min-width:720px){.summary{padding:36px;gap:24px;position:sticky;top:32px;max-width:460px;justify-self:end;width:100%}}
.summary dl{display:flex;flex-direction:column;gap:12px;font-size:14px}
@media (min-width:720px){.summary dl{gap:14px;font-size:14.5px}}
.summary dl>div{display:flex;justify-content:space-between;gap:16px}
.summary dt{color:var(--muted)}
.summary dl>div.total{border-top:1px solid var(--rule);padding-top:12px}
.summary dl>div.total dt{font-weight:500;color:var(--ink)}
.summary .assur{display:flex;flex-direction:column;gap:8px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--rule);padding-top:14px}
.summary .assur p{display:flex;align-items:center;gap:10px}
.summary .assur svg{width:16px;height:16px;flex:0 0 auto}
@media (min-width:720px){.summary .assur{border-top:0;padding-top:4px}}
.sum-item{display:flex;gap:16px;align-items:center}
.sum-item .ph{width:64px;height:80px;flex:0 0 auto}
.sum-item>div{display:flex;flex-direction:column;gap:3px;flex:1 1 auto;min-width:0}
.sum-item .t{font-family:var(--serif);font-size:20px;font-weight:500;line-height:1.1}
.sum-item .p{font-size:14px;white-space:nowrap}
.sticky-bar{position:fixed;left:0;right:0;bottom:0;background:var(--paper);border-top:1px solid var(--rule);padding:12px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:30}
.sticky-bar>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.sticky-bar .t{font-family:var(--serif);font-size:17px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky-bar .m{font-size:12.5px;color:var(--muted)}
.sticky-bar .l{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.sticky-bar .price{font-size:22px}
@media (min-width:720px){.sticky-bar{display:none}}
body.has-sticky main{padding-bottom:84px}
@media (min-width:720px){body.has-sticky main{padding-bottom:0}}
details.sum-m{border-bottom:1px solid var(--rule)}
details.sum-m summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0;cursor:pointer;font-size:13px}
details.sum-m summary::-webkit-details-marker{display:none}
details.sum-m .stackph{display:flex}
details.sum-m .stackph .ph{width:28px;height:36px;display:inline-block}
details.sum-m .stackph .ph+.ph{margin-left:-8px;border-left:1px solid var(--paper)}
details.sum-m dl{display:flex;flex-direction:column;gap:10px;font-size:13.5px;padding:0 0 18px}
details.sum-m dl>div{display:flex;justify-content:space-between;gap:16px}
details.sum-m dt{color:var(--muted)}
@media (min-width:720px){details.sum-m{display:none}}
.info-box{border:1px solid var(--rule);padding:14px 16px;display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.info-box svg{width:18px;height:18px;flex:0 0 auto;margin-top:2px;color:var(--brass)}
@media (min-width:720px){.info-box{padding:18px 20px;gap:16px;font-size:13.5px}.info-box svg{width:20px;height:20px}}
/* Table */
.table{border-collapse:collapse;width:100%;font-size:14.5px}
.table th{text-align:left;padding:14px 0;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500}
.table thead tr{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.table td{padding:16px 0;vertical-align:top}
.table tbody tr{border-bottom:1px solid var(--rule)}
.table td:first-child{font-family:var(--serif);font-size:20px;font-weight:500}
@media (min-width:720px){.table td:first-child{font-size:22px}}
/* Trade list */
.tlist{display:flex;flex-direction:column;border-top:1px solid var(--rule-light-mid)}
.tlist li{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:8px 24px;padding:18px 0;border-bottom:1px solid var(--rule-light-mid)}
.tlist .t{font-family:var(--serif);font-size:22px;font-weight:500}
.tlist .d{font-size:14px;color:var(--indigo-text);font-weight:300}
/* Article */
.article .h1{max-width:960px}
.article__std{font-family:var(--serif);font-size:22px;line-height:1.4;color:var(--ink-soft);max-width:760px}
@media (min-width:720px){.article__std{font-size:clamp(22px,2.2vw,28px)}}
.article__body{max-width:720px}
.article__body p{font-size:16.5px;line-height:1.8;font-weight:300;color:var(--ink-soft)}
.article__body p+p,.article__body p+figure,.article__body figure+p,.article__body ul+p,.article__body p+ul{margin-top:20px}
.article__body h2{margin:48px 0 18px;font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.05}
.article__body h2 .n{color:var(--accent)}
.article__body h3{margin:36px 0 12px;font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.1}
.article__body blockquote{margin:32px 0;padding:0 0 0 20px;border-left:2px solid var(--accent);font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.3;color:var(--ink)}
.article__body figure{margin:32px 0}
.article__body figure img{width:100%}
.article__body figcaption{font-size:12.5px;color:var(--muted);letter-spacing:.06em;padding-top:8px}
.article__body ul{list-style:disc;padding-left:22px}
.article__body li{font-size:16.5px;line-height:1.8;font-weight:300;color:var(--ink-soft)}
.article__body a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--accent)}
.article__body .dropcap::first-letter{font-family:var(--serif);font-size:72px;line-height:.8;float:left;margin:6px 10px 0 0;color:var(--accent)}
.article__body .wp-block-image,.article__body .wp-block-gallery{margin:32px 0}
.article__body .grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:40px 0}
@media (min-width:720px){
  .article__body p,.article__body li{font-size:18px}.article__body p+p{margin-top:24px}
  .article__body h2{margin:56px 0 20px;font-size:40px}.article__body blockquote{margin:40px 0;padding-left:28px;font-size:30px}
  .article__body figure{margin:40px 0}.article__body .dropcap::first-letter{font-size:84px;margin:8px 12px 0 0}
}
.article__aside{display:flex;flex-direction:column;gap:24px}
.toc{display:flex;flex-direction:column;border-top:1px solid var(--rule);font-family:var(--serif);font-size:19px}
.toc li{padding:10px 0;border-bottom:1px solid var(--rule)}
.toc a{text-decoration:none}
.work-in{display:flex;flex-direction:column;gap:12px;border:1px solid var(--rule);padding:20px}
.work-in a{display:flex;gap:14px;align-items:center;color:var(--ink)}
.work-in .ph{width:56px;height:70px;flex:0 0 auto}
.work-in .t{font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.1;display:block}
.work-in .m{font-size:12.5px;color:var(--muted);display:block;margin-top:3px}
@media (min-width:720px){.article__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:64px;align-items:start}.article__aside{grid-column:span 1;position:sticky;top:32px}.article__body{grid-column:span 2}}
/* Page (generic) */
.page-body{max-width:720px}
.page-body p,.page-body li{font-size:16px;line-height:1.75;font-weight:300;color:var(--ink-soft)}
.page-body>*+*{margin-top:18px}
.page-body h2{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.05;margin-top:40px}
.page-body h3{font-family:var(--serif);font-weight:500;font-size:24px;margin-top:28px}
.page-body ul{list-style:disc;padding-left:22px}
.page-body a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--accent)}
/* Search results */
.result{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--rule);color:var(--ink)}
.result .ph{width:72px;height:72px;flex:0 0 auto}
.result>div{display:flex;flex-direction:column;gap:4px}
/* Newsletter box */
.news{border:1px solid var(--ink);padding:28px 20px;display:flex;flex-direction:column;gap:20px}
@media (min-width:720px){.news{padding:clamp(32px,4vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px;align-items:center}}
.news .h2{font-size:30px;line-height:1.1}
@media (min-width:720px){.news .h2{font-size:clamp(32px,3vw,42px)}}
/* Craft intro pane (collection) */
.hero-copy{display:flex;flex-direction:column;gap:14px}
@media (min-width:720px){.hero-copy{gap:20px}}
.hero-right{display:flex;flex-direction:column;gap:14px}
@media (min-width:720px){.hero-right{justify-self:end;max-width:520px;padding-bottom:12px;gap:16px}}
.vert-label{display:none}
@media (min-width:1024px){.vert-label{display:block;position:absolute;left:-52px;top:48px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}}
.hero-quote{display:flex;gap:16px;align-items:center;border:1px solid var(--rule);padding:14px 16px;margin-top:-28px;margin-right:24px;background:var(--paper);position:relative}
@media (min-width:720px){.hero-quote{position:absolute;left:clamp(16px,3vw,40px);bottom:-28px;margin:0;padding:16px 22px;gap:28px;flex-wrap:wrap;max-width:calc(100% - 32px)}}
.is-hidden{display:none!important}
.empty{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--muted);line-height:1.3}
@media (min-width:720px){.empty{font-size:26px}}
.no-js .needs-js{display:none}

/* =========================================================================
   WooCommerce — checkout, notices, payment methods. WooCommerce's own CSS is not loaded;
   its markup is drawn here with the same tokens as the house forms (.f, .legend, .radios).
   ========================================================================= */
.ls-checkout .woocommerce-billing-fields>h3,.ls-checkout .woocommerce-additional-fields>h3,.ls-checkout .woocommerce-shipping-fields{display:none}
.ls-checkout .woocommerce-billing-fields__field-wrapper,.ls-checkout .woocommerce-additional-fields__field-wrapper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
@media (min-width:720px){.ls-checkout .woocommerce-billing-fields__field-wrapper{gap:20px 16px}}
.ls-checkout .form-row{display:flex;flex-direction:column;gap:6px;margin:0;grid-column:1/-1}
.ls-checkout .form-row-first{grid-column:1}.ls-checkout .form-row-last{grid-column:2}
.ls-checkout .form-row label:not(.check):not(.checkbox){font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.ls-checkout .form-row label .optional{text-transform:none;letter-spacing:0;color:var(--brass)}
.ls-checkout .form-row abbr.required,.ls-checkout .form-row label .required{display:none}
.ls-checkout .woocommerce-input-wrapper{display:block}
.ls-checkout .form-row input.input-text,.ls-checkout .form-row select,.ls-checkout .form-row textarea{font-family:var(--sans);font-size:16px;color:var(--ink);background:transparent;border:1px solid var(--rule-strong);min-height:50px;padding:0 14px;width:100%;border-radius:0;appearance:none;-webkit-appearance:none;box-sizing:border-box}
.ls-checkout .form-row select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231E1A16' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
.ls-checkout .form-row textarea{padding:14px;min-height:110px;resize:vertical}
.ls-checkout .form-row input:focus,.ls-checkout .form-row select:focus,.ls-checkout .form-row textarea:focus{outline:none;border-color:var(--ink)}
.ls-checkout .form-row.woocommerce-invalid input.input-text,.ls-checkout .form-row.woocommerce-invalid select{border-color:var(--accent)}
.ls-checkout .form-row .checkout-inline-error-message{font-size:12.5px;color:var(--accent);margin-top:2px}
@media (min-width:720px){.ls-checkout .form-row{gap:8px}.ls-checkout .form-row label:not(.check):not(.checkbox){font-size:11.5px}.ls-checkout .form-row input.input-text,.ls-checkout .form-row select,.ls-checkout .form-row textarea{font-size:15px}}
@media (max-width:519px){.ls-checkout .form-row-first,.ls-checkout .form-row-last{grid-column:1/-1}}
.ls-checkout .ls-news{margin-top:4px}
/* Payment methods: WooCommerce markup kept intact for the gateways, drawn like .radios */
.ls-checkout #payment{display:flex;flex-direction:column;gap:20px}
.ls-checkout .wc_payment_methods{list-style:none;margin:0;padding:0;border:1px solid var(--rule-strong)}
.ls-checkout .wc_payment_method{border-bottom:1px solid var(--rule);padding:14px 16px;font-size:14px}
.ls-checkout .wc_payment_method:last-child{border-bottom:0}
.ls-checkout .wc_payment_method>input{width:18px;height:18px;margin:0 12px 0 0;accent-color:var(--ink);vertical-align:middle}
.ls-checkout .wc_payment_method>label{cursor:pointer;display:inline-flex;align-items:center;gap:10px;vertical-align:middle}
.ls-checkout .wc_payment_method>label img{max-height:22px;width:auto}
.ls-checkout .payment_box{margin-top:12px;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.ls-checkout .payment_box p{margin:0}
.ls-checkout .payment_box fieldset{border:0;padding:0;margin:8px 0 0}
.ls-checkout .place-order{display:flex;flex-direction:column;gap:14px}
.ls-checkout .woocommerce-terms-and-conditions-wrapper{font-size:13px;color:var(--ink-soft);line-height:1.6}
.ls-checkout .woocommerce-terms-and-conditions-wrapper a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.ls-checkout .woocommerce-form__label-for-checkbox{display:flex;align-items:flex-start;gap:12px;font-size:13.5px;color:var(--ink-soft);cursor:pointer;margin-top:8px}
.ls-checkout .woocommerce-form__label-for-checkbox input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--ink);flex:0 0 auto}
.ls-checkout .woocommerce-terms-and-conditions{display:none!important}
.ls-checkout #place_order{display:inline-flex;align-items:center;justify-content:center;background:var(--ink);color:var(--paper);border:1px solid var(--ink);padding:0 40px;min-height:60px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;align-self:flex-start}
.ls-checkout #place_order:hover{background:var(--accent);border-color:var(--accent)}
@media (max-width:719px){.ls-checkout #place_order{width:100%}}
.ls-checkout .blockUI.blockOverlay{background:rgba(243,238,228,.6)!important}
.ls-checkout .ls-review .sum-item .ph{width:56px;height:70px}
@media (max-width:719px){.ls-checkout__sum{order:-1}}
/* Notices (cart, checkout) */
.woocommerce-error,.woocommerce-message,.woocommerce-info,.wc-block-components-notice-banner{list-style:none;margin:0 0 8px;padding:14px 16px;border:1px solid var(--rule);font-size:14px;line-height:1.55;color:var(--ink-soft)}
.woocommerce-error,.wc-block-components-notice-banner.is-error{border-color:var(--accent);color:var(--accent)}
.woocommerce-error li{margin:0}.woocommerce-error li+li{margin-top:6px}
.woocommerce-message .button,.woocommerce-info .button{margin-left:10px;color:var(--ink);text-decoration:underline;text-underline-offset:3px;background:none;border:0;font:inherit;padding:0}
.woocommerce-NoticeGroup{grid-column:1/-1}
/* Thank-you: bank transfer details from WooCommerce */
.ls-pay-box h2,.ls-pay-box .wc-bacs-bank-details-heading{font-family:var(--serif);font-size:22px;font-weight:500;margin:0 0 8px}
.ls-pay-box h3{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:14px 0 6px}
.ls-pay-box ul{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px}
.ls-pay-box p{font-size:14px;line-height:1.6;color:var(--ink-soft)}
.acquire{display:contents}

/* Touch: text links, the logo and footer links get a ~44px invisible hit area; nothing moves visually */
@media (pointer:coarse){
  .link-u,.logo{position:relative}
  .link-u::after,.logo::after{content:"";position:absolute;left:-6px;right:-6px;top:-9px;bottom:-9px}
  .site-foot nav[aria-label="Footer"]{row-gap:0!important}
  .site-foot nav[aria-label="Footer"] a,.site-foot__legal a{display:inline-block;padding:10px 0}
  .site-foot__col a{padding:10px 0}
  .site-foot__col{gap:0}
}
/* Phones: the smallest labels up half a point */
@media (max-width:719px){.ph-cap{font-size:11px}.unique{font-size:11px}}

/* Footer: the operator line (legal identity) runs the full width under the links */
.site-foot__operator{flex-basis:100%;line-height:1.6;color:var(--cream);opacity:.85}
.site-foot__operator a,.site-foot--slim a,.site-foot--quiet a,.site-foot--ink a{color:var(--cream);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rule-light)}
/* The house: team cards without a portrait get a quiet rule instead of an empty frame */
.team-card:not(:has(figure)){border-top:1px solid var(--rule-light);padding-top:18px}