/* Florist shop base: the skin (palette and type: a designed template, so a design seed never repaints it) and the landing sections around the shop (nav, hero, trust, collections, story, reviews, newsletter, footer). */

:root{--bg:#FBF7F2;--surface:#FFFDFB;--sunk-0:#F6E7E8;--line-0:#E9DCD6;--edge:#9A8A86;--ink:#2B2024;--ink-2:#6B5A5F;
--good:#356842;--warn:#9A5B00;--bad:#B3261E;--on-accent:#FFF8F6;
--serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
--page:1180px;--r:999px;--r-card:18px}
[data-accent=rose]{--a-l:#B84A62;--a-d:#E58BA0}
h1,h2,h3{font-weight:500;letter-spacing:-.01em}
:root{--glow:#F9E3E6;--band1:#3B2530;--band2:#5A3441;--star:#C9923A}
/* Florist base on the shop engine: landing sections around the working shop. House tokens + theme.css only. */
html{scroll-behavior:smooth;scroll-padding-top:76px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
em{font-style:italic;color:var(--accent)}
.eyebrow{margin:0;font:600 var(--t-xs)/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.announce{margin:0;max-width:none;padding:8px var(--gutter);background:var(--band1,#3B2530);color:#F7E9EA;text-align:center;font:500 var(--t-xs)/1.4 var(--sans);letter-spacing:.04em}
.nav{height:69px;border-bottom:1px solid var(--line);background:var(--bg)}
.navin{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:68px}
.logo{margin:0;font:600 1.7rem/1 var(--serif);color:var(--ink);text-decoration:none;letter-spacing:.01em}
.logo::first-letter{color:var(--accent)}
.links{display:none;gap:var(--s-6)}.links a{color:var(--ink);text-decoration:none;font:500 var(--t-sm)/1 var(--sans)}.links a:hover{color:var(--accent)}
@media (min-width:820px){.links{display:flex}}
.arch.round img{border-radius:36px;aspect-ratio:5/6}
.hero{padding-block:var(--s-7) var(--s-8);background:radial-gradient(900px 500px at 85% 0,var(--glow) 0,transparent 70%),var(--bg)}
.herogrid{display:grid;gap:var(--s-7);align-items:center}
@media (min-width:900px){.herogrid{grid-template-columns:1.2fr .8fr}}
.herotext{display:grid;gap:var(--s-5);justify-items:start}
.herotext h1{font-size:clamp(2.7rem,1.3rem + 4.6vw,4.7rem);line-height:1.02;font-weight:500;max-width:15ch}
.herotext h1 em{font-weight:500}
.lede{margin:0;font-size:1.125rem;color:var(--ink-2);max-width:44ch}
.heroacts{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.rating{margin:0;font-size:var(--t-sm);color:var(--ink-2)}.rating span{color:var(--star);letter-spacing:2px;margin-right:6px}
.arch{position:relative;justify-self:center;width:min(100%,460px)}
.arch img{display:block;width:100%;height:auto;aspect-ratio:5/6;object-fit:cover;border-radius:999px 999px 28px 28px;background:var(--sunk);box-shadow:0 30px 60px -24px rgb(120 40 60/.35)}
.badge{position:absolute;left:-18px;bottom:36px;display:grid;gap:2px;margin:0;padding:12px 18px;border-radius:16px;background:var(--surface);box-shadow:0 14px 34px -10px rgb(60 20 30/.28);font-size:var(--t-sm)}
.badge span{color:var(--ink-2);font-size:var(--t-xs)}
@media (max-width:520px){.badge{left:8px}}
.trust{background:var(--sunk-0)}
.trustgrid{list-style:none;margin-block:0;padding-block:var(--s-6);display:grid;gap:var(--s-5);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:820px){.trustgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.trustgrid li{display:grid;justify-items:center;gap:2px;text-align:center}
.trustgrid svg{width:30px;height:30px;margin-bottom:6px;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.trustgrid b{font:600 var(--t-sm)/1.3 var(--sans)}.trustgrid span{font-size:var(--t-xs);color:var(--ink-2)}
.sec{padding-block:var(--s-9)}
.sechead{display:grid;gap:var(--s-2);justify-items:center;text-align:center;margin-bottom:var(--s-7)}
.sechead h2{font-size:clamp(2.2rem,1.4rem + 2.6vw,3.4rem);line-height:1.05}
.occs{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:820px){.occs{grid-template-columns:repeat(5,minmax(0,1fr))}}
.occ{position:relative;display:block;width:100%;aspect-ratio:3/4;padding:0;border:0;border-radius:var(--r-card);overflow:hidden;cursor:pointer;background:#3A2229;text-align:left;color:#fff}
.occ img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.occ:hover img{transform:scale(1.05)}
.occ::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgb(30 12 18/.72),transparent 55%)}
.occ span{position:absolute;z-index:1;left:16px;right:16px;bottom:14px;display:grid;gap:2px}
.occ b{font:500 1.7rem/1 var(--serif)}.occ small{font-size:var(--t-xs);opacity:.88}
.shopsec{background:#FFFDFB;border-block:1px solid var(--line)}
.pills{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-2);flex:1 1 100%}
.pill{min-height:40px;padding:0 var(--s-5);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font:500 var(--t-sm)/1 var(--sans);cursor:pointer}
.pill:hover{border-color:var(--accent)}
.pill[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.f-q{flex:0 1 320px}.f-sort{flex:0 1 220px}.f-q label,.f-sort label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* the cart: a drawer */
/* story */
.storygrid{display:grid;gap:var(--s-7);align-items:center}
@media (min-width:900px){.storygrid{grid-template-columns:1fr 1fr}}
.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-4);align-items:end}
.pair img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r-card);background:var(--sunk)}
.pair img+img{margin-bottom:var(--s-7)}
.storytext{display:grid;gap:var(--s-4);justify-items:start}
.storytext h2{font-size:clamp(2.2rem,1.4rem + 2.6vw,3.4rem)}
.storytext p{margin:0;color:var(--ink-2)}
.stats{display:flex;flex-wrap:wrap;gap:var(--s-6);margin:var(--s-2) 0}
.stats div{display:grid;gap:2px}.stats dt{font:500 2.6rem/1 var(--serif);color:var(--accent)}.stats dd{margin:0;font-size:var(--t-xs);color:var(--ink-2);text-transform:uppercase;letter-spacing:.08em}
.proof{background:var(--sunk-0)}
.quotes{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-5)}
@media (min-width:820px){.quotes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.quotes li{display:grid;gap:var(--s-3);align-content:start;padding:var(--s-6);border-radius:var(--r-card);background:var(--surface);box-shadow:0 10px 30px -18px rgb(90 30 50/.3)}
.stars{margin:0;color:var(--star);letter-spacing:3px}
blockquote{margin:0;font:500 1.3rem/1.4 var(--serif)}
.who{margin:0;font-size:var(--t-sm);color:var(--ink-2)}.who b{color:var(--ink);margin-right:8px}
.news{padding-block:var(--s-9)}
.newsbox{display:grid;gap:var(--s-3);justify-items:center;text-align:center;padding:var(--s-8) var(--s-5);border-radius:28px;background:linear-gradient(135deg,var(--band1),var(--band2));color:#fff}
.newsbox h2{font-size:clamp(2rem,1.3rem + 2.4vw,3rem);color:#fff}
.newsbox p{margin:0;color:#EBD8DC}
.newsform{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-3);width:min(520px,100%);margin-top:var(--s-3)}
.newsform input{flex:1 1 240px;color:var(--ink)}
.newsbox .note{color:#F6D7DE;min-height:1.4em}
.foot{padding-block:var(--s-8) var(--s-6);background:var(--surface);border-top:1px solid var(--line)}
.footgrid{display:grid;gap:var(--s-6);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:820px){.footgrid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}}
.footgrid>div:first-child{grid-column:1/-1}@media (min-width:820px){.footgrid>div:first-child{grid-column:auto}}
.footgrid h3{font:600 var(--t-sm)/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--s-3)}
.footgrid nav{display:grid;gap:var(--s-2);align-content:start}.footgrid a{color:var(--ink-2);text-decoration:none;font-size:var(--t-sm)}.footgrid a:hover{color:var(--accent)}
.footgrid p,.footgrid address{margin:0;color:var(--ink-2);font-size:var(--t-sm);font-style:normal;line-height:1.7}
.credits{margin-top:var(--s-6);padding-top:var(--s-4);border-top:1px solid var(--line);font-size:var(--t-xs);color:var(--ink-2);max-width:var(--page)}
.credits a{color:var(--ink-2)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* compact hero: the shop is on the first screen */
.hero{padding-block:var(--s-5) var(--s-6)}
.herogrid{gap:var(--s-6)}
.herotext{gap:var(--s-4)}
.herogrid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center}
.herotext h1{font-size:clamp(2.1rem,1.3rem + 2.6vw,3.3rem);line-height:1.1;max-width:15ch}
.lede{font-size:1.05rem;line-height:1.65;max-width:44ch}
.arch{width:100%}
.arch img{aspect-ratio:5/4;height:auto;max-height:45vh;width:100%;object-fit:cover}
body{line-height:1.6}
h2{font-size:clamp(1.8rem,1.3rem + 1.5vw,2.5rem);line-height:1.15}
.sec{padding-block:clamp(3.5rem,6vw,5.5rem)}
.sechead{margin-bottom:clamp(2rem,3.5vw,3rem)}
.trustgrid{padding-block:var(--s-6)}
.products{gap:clamp(1.25rem,2.4vw,2rem)}
@media(max-width:760px){.herogrid{grid-template-columns:1fr}.herotext h1{max-width:none}}
.footgrid nav>div,#foot-shop,#foot-help{display:grid;gap:var(--s-2);align-content:start}

@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .shopsec{background:var(--surface)}}:root[data-theme=dark] .shopsec{background:var(--surface)} 
/* variety tokens (html[data-pal] / html[data-fp] set by applyVariety; unset = the spec palette and type) */
html[data-pal="1"][data-accent]{--a-l:#B84A62;--a-d:#E58BA0}
@media (prefers-color-scheme:light){html[data-pal="1"]:not([data-theme=dark]){--bg:#FBF7F2;--surface:#FFFDFB;--sunk-0:#F6E7E8;--line-0:#E9DCD6;--edge:#9A8A86;--ink:#2B2024;--ink-2:#6B5A5F;--on-accent:#FFF8F6;--glow:#F9E3E6;--band1:#3B2530;--band2:#5A3441;--star:#C9923A}}
html[data-pal="2"][data-accent]{--a-l:#2F6B45;--a-d:#8CCB9E}
@media (prefers-color-scheme:light){html[data-pal="2"]:not([data-theme=dark]){--bg:#F4F6F0;--surface:#FCFDF9;--sunk-0:#E3EBDD;--line-0:#D3DCCB;--edge:#76866D;--ink:#1F2A22;--ink-2:#4F6054;--on-accent:#F7FBF5;--glow:#E4EFDD;--band1:#1F3326;--band2:#33503B;--star:#B98A2E}}
html[data-pal="3"][data-accent]{--a-l:#B5472D;--a-d:#F0A58E}
@media (prefers-color-scheme:light){html[data-pal="3"]:not([data-theme=dark]){--bg:#FFF6EE;--surface:#FFFCF8;--sunk-0:#FBE6D6;--line-0:#EDD5C2;--edge:#9A8070;--ink:#35241C;--ink-2:#6F5445;--on-accent:#FFF9F5;--glow:#FCE3D2;--band1:#43271C;--band2:#6B3E2C;--star:#C98A2E}}
html[data-pal="4"][data-accent]{--a-l:#6240A0;--a-d:#BBA3EA}
@media (prefers-color-scheme:light){html[data-pal="4"]:not([data-theme=dark]){--bg:#F7F5FB;--surface:#FFFFFF;--sunk-0:#E9E4F4;--line-0:#DAD3EA;--edge:#7F789C;--ink:#231F33;--ink-2:#575071;--on-accent:#FBF9FF;--glow:#E8E1F6;--band1:#2B2342;--band2:#463A6B;--star:#C79B3B}}
html[data-pal="5"][data-accent]{--a-l:#7A5700;--a-d:#E8C45A}
@media (prefers-color-scheme:light){html[data-pal="5"]:not([data-theme=dark]){--bg:#FFFAEB;--surface:#FFFEF8;--sunk-0:#FBEFC6;--line-0:#EBDFB0;--edge:#8C8056;--ink:#2E2812;--ink-2:#625830;--on-accent:#FFFBEB;--glow:#FBEFC0;--band1:#3A3010;--band2:#5A4C18;--star:#B87A0A}}
html[data-pal="6"][data-accent]{--a-l:#A93428;--a-d:#E88C82}
@media (prefers-color-scheme:light){html[data-pal="6"]:not([data-theme=dark]){--bg:#F2EFEA;--surface:#FBFAF7;--sunk-0:#E4DFD7;--line-0:#D3CDC2;--edge:#827B6F;--ink:#1B1B1A;--ink-2:#4F4B44;--on-accent:#FFF8F6;--glow:#EEDFD9;--band1:#1B1B1A;--band2:#34312C;--star:#B8862B}}

@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--on-accent:#17131C}}:root[data-theme=dark]{--on-accent:#17131C}
html[data-fp="1"]{--serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;--sans:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html[data-fp="1"] h1,html[data-fp="1"] h2,html[data-fp="1"] h3{font-weight:500}
html[data-fp="2"]{--serif:"Fraunces",Georgia,"Times New Roman",serif;--sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html[data-fp="2"] h1,html[data-fp="2"] h2,html[data-fp="2"] h3{font-weight:500}
html[data-fp="3"]{--serif:"Playfair Display",Georgia,"Times New Roman",serif;--sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html[data-fp="3"] h1,html[data-fp="3"] h2,html[data-fp="3"] h3{font-weight:500}
html[data-fp="4"]{--serif:"DM Serif Display",Georgia,"Times New Roman",serif;--sans:"Work Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html[data-fp="4"] h1,html[data-fp="4"] h2,html[data-fp="4"] h3{font-weight:400}
/* HERO SLIDESHOW (F0103): the stage sits behind the hero text; the old single photo is hidden */
.hero.has-ks{position:relative;isolation:isolate;display:grid;align-items:end;min-height:min(86vh,800px);padding-block:var(--s-8) var(--s-7);background:#1c1815;color:#fff}
.hero.has-ks>.ks-stage{position:absolute;inset:0;z-index:0;aspect-ratio:auto;min-height:0;border-radius:0}
.hero.has-ks .herogrid{position:relative;z-index:5;grid-template-columns:1fr;width:100%}
.hero.has-ks [data-hero-media]{display:none!important}
.hero.has-ks .herotext{max-width:min(100%,760px);pointer-events:none}.hero.has-ks .herotext :is(a,button){pointer-events:auto}
.hero.has-ks .herotext :is(h1,.lede,.eyebrow,.rating){color:#fff;text-shadow:0 1px 18px rgba(0,0,0,.35)}
.hero.has-ks .herotext h1{max-width:14ch}
.hero.has-ks .herotext h1 em{color:#fff;font-style:italic}
.hero.has-ks .heroacts .btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.75)}
@media (max-width:640px){.hero.has-ks{min-height:84vh;padding-block:var(--s-7) 0!important}.hero.has-ks .herogrid{padding-bottom:84px}}
/* EDITORIAL MODE (CONFIG.editorial = true; founder idea 10-14: numbered chapters, tracked small caps, italic accents) */
html[data-editorial] .links{counter-reset:ch}
html[data-editorial] .links a::before{counter-increment:ch;content:counter(ch,decimal-leading-zero);font-size:.68em;letter-spacing:.12em;opacity:.55;margin-right:.45em}
html[data-editorial] main{counter-reset:sec}
html[data-editorial] .sechead .eyebrow::before{counter-increment:sec;content:"0" counter(sec) " \2014  "}
html[data-editorial] .eyebrow{letter-spacing:.2em;text-transform:uppercase;font-size:.72rem}
html[data-editorial] :is(h1,h2) em{font-style:italic;font-weight:500}

/* F0231: the first-screen "overlay" layout gives the hero text a LIGHT card, but a slideshow hero forces WHITE text (1.24:1). With a slideshow the card is dark glass: background and text colour are chosen together. */
html .hero.has-ks [data-hero-text],html .hero.has-ks .herotext{background:rgba(22,18,15,.66)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
/* phone fit (growth G1FLOR): an occasion name shrinks to its tile (Condolences in a wide display face overflowed at 390), and a product card stacks each option label over its select so a value like Crimson is not cut */
.occs .occ{container-type:inline-size}
.occs .occ b{font-size:min(1.7rem,calc((100cqi - 32px)/6.4));overflow-wrap:break-word;hyphens:auto}
@media (max-width:600px){.prod .field{grid-template-columns:minmax(0,1fr);gap:4px}}
/* F0340 (growth G4FLOR): toasts read in both themes (the pill took a near-white --ink); on a phone one toast at the top, never over Check out; the checkout buttons stay in view while errors lengthen the form */
.toasts .toast{background:#24181d;color:#fff}
@media (max-width:600px){.toasts{top:12px;bottom:auto}.toasts .toast:not(:last-child){display:none}#co .field{grid-template-columns:minmax(0,1fr);gap:4px}#co .field .error{margin:0}}
#co .acts{position:sticky;bottom:calc(-1*var(--s-5));z-index:1;padding:12px 0 var(--s-5);background:var(--surface)}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks){background:var(--band1);background:light-dark(var(--band1),var(--sunk-0))}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks) .herotext h1{color:#FBF5F2}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks) .herotext :is(.lede,.rating){color:rgb(251 245 242/.78)}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks) .herotext :is(.eyebrow,em){color:var(--a-d)}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks) .btn-primary{background:var(--a-d);border-color:var(--a-d);color:#17131C}
html:not([data-l-fs=overlay],[data-l-hero=full]) .hero:not(.has-ks) .heroacts .btn-secondary{background:none;color:#FBF5F2;border-color:rgb(251 245 242/.5)}
.hero .herotext h1{font-size:clamp(2.3rem,1rem + 4.4vw,5.2rem);line-height:.98;letter-spacing:-.025em}
html:is([data-l-fs=story],[data-l-fs=catalogue],[data-l-fs=minimal])[lang] .hero .herotext h1{font-size:clamp(2.3rem,1rem + 4.4vw,5.2rem);line-height:.98;letter-spacing:-.025em}
.hero .lede{font-size:1rem;line-height:1.6}
html[data-l-fs] .hero .arch img,.hero .arch img{max-height:62vh}
.hero .badge{background:light-dark(#FBEAEA,var(--surface));color:var(--ink)}
.sechead h2,.storytext h2{font-size:clamp(2.4rem,1.2rem + 3.4vw,4.2rem);line-height:1}
.trust,.proof{background:light-dark(#F6E3E1,var(--sunk-0))}
@media (min-width:600px){.price{margin-left:-10px;padding:3px 10px;border-radius:999px;background:#F8DCDD;color:#24181C;background:light-dark(#F8DCDD,color-mix(in srgb,var(--accent) 16%,var(--surface)));color:light-dark(#24181C,var(--ink))}}
.prod .tag{color:color-mix(in srgb,var(--accent) 72%,var(--ink))}
:root{--r:3px;--r-pill:3px;--r-card:6px}
html .announce[data-announce]:not(:empty){display:block;padding-block:10px;background:var(--band2);color:#FBF5F2;font:italic 500 1.05rem/1.3 var(--serif);letter-spacing:.01em}
:is(.hero,.pic,.pair,.occ) img{filter:sepia(.16) saturate(.84) contrast(.9) brightness(1.04)}
html:not([data-l-fs]) .hero:not(.has-ks),html:is([data-l-fs=story],[data-l-fs=catalogue]) .hero:not(.has-ks){padding:0;background:light-dark(var(--band1),var(--sunk-0))}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] [data-sec=hero]:not(.has-ks) .herogrid{display:grid;grid-template-columns:minmax(0,1fr);gap:0;max-width:none;padding:0;align-items:stretch}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) [data-hero-media]{order:-1;width:100%;margin:0}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .arch img{height:100%;max-height:56vh;aspect-ratio:4/3;border-radius:0;box-shadow:none}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .herotext[data-hero-text]{display:grid;grid-template-columns:minmax(0,1fr);align-content:center;justify-items:start;gap:var(--s-4);max-width:none;margin:0;padding:28px var(--gutter,16px) 40px}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .herotext[data-hero-text]>*{grid-column:1;grid-row:auto}
.hero .arch .badge{left:auto;right:16px;bottom:20px;z-index:2}
@media (min-width:900px){
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] [data-sec=hero]:not(.has-ks) .herogrid{grid-template-columns:1.15fr 1fr;min-height:min(78vh,680px)}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .arch img{max-height:none;aspect-ratio:auto}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .herotext[data-hero-text]{padding:clamp(40px,5vw,88px);gap:var(--s-5)}
:is(html:not([data-l-fs]),html:is([data-l-fs=story],[data-l-fs=catalogue]))[lang] .hero:not(.has-ks) .arch .badge{right:-28px;bottom:56px}
html[lang] [data-main]>[data-sec=stats]{order:0}
}
html[data-l-fs=story][lang] [data-main]>[data-sec=story]{order:5}
.prod .tag{top:12px;left:12px;padding:4px 10px;border-radius:3px;clip-path:none;background:#F8DCDD;color:#3A1F28;font:italic 500 .9rem/1.1 var(--serif);letter-spacing:0;text-transform:none}
.btn{min-height:48px;padding-inline:26px;letter-spacing:.02em}

.prod .tag,.hero .badge{z-index:3}
.pill{min-height:44px;padding:0 6px;margin-inline:8px;border:0;border-bottom:1px solid transparent;border-radius:0;background:none;font:italic 500 1.2rem/1 var(--serif)}
.pill[aria-pressed=true]{background:none;color:var(--accent);border-color:currentColor}
select{appearance:none;padding-right:40px;background-image:linear-gradient(45deg,transparent 50%,var(--ink-2) 0),linear-gradient(135deg,var(--ink-2) 50%,transparent 0);background-position:calc(100% - 22px) 52%,calc(100% - 17px) 52%;background-size:5px 5px;background-repeat:no-repeat}
html[data-pal="4"][data-accent]{--a-l:#7A2E52;--a-d:#E7A6C3}
@media (prefers-color-scheme:light){html[data-pal="4"]:not([data-theme=dark]){--bg:#FAF4F3;--surface:#FFFDFC;--sunk-0:#F3E2E5;--line-0:#E6D2D7;--edge:#8C7880;--ink:#2A1B22;--ink-2:#624D56;--glow:#F6E1E6;--band1:#3A1F2E;--band2:#5A2E45}
html:is([data-l-fs=type],[data-l-fs=minimal])[data-theme=dark]{color-scheme:light;--bg:#FAF4F3;--surface:#FFFDFC;--sunk:#F3E2E5;--sunk-0:#F3E2E5;--line:#E6D2D7;--line-0:#E6D2D7;--edge:#8C7880;--ink:#2A1B22;--ink-2:#624D56;--accent:var(--a-l);--on-accent:#fff;--good:#356842;--warn:#8A5000;--bad:#B3261E}
html:is([data-l-fs=type],[data-l-fs=minimal])[data-theme=dark][lang] [data-sec=hero]{background:var(--band1)}
html[data-l-fs=type] [data-sec=hero]::after{border-color:rgb(251 245 242/.3)}}
@media (min-width:901px){html[data-l-list=bento][lang] [data-item]:first-child{display:flex;flex-direction:column}html[data-l-list=bento][lang] [data-item]:first-child [data-item-media]{flex:1 1 auto;aspect-ratio:auto;min-height:320px}}
html [data-main]>#shop{background:light-dark(color-mix(in srgb,var(--a-l) 8%,var(--bg)),var(--surface))}
html .ks .ks-btn{border-radius:2px;background:rgb(20 14 12/.35);border-color:rgb(251 245 242/.55);backdrop-filter:none}
.ks-count{text-shadow:0 1px 8px rgb(0 0 0/.6);margin-right:auto;font:italic 500 1.15rem/1 var(--serif);letter-spacing:0}
html .ks .ks-dash{background:linear-gradient(rgb(251 245 242/.5) 0 0) center/100% 2px no-repeat}
html .ks .ks-dash::after{inset:calc(50% - 1px) 0}
@media (max-width:640px){html .ks .ks-ui{flex-wrap:wrap;row-gap:4px}html .ks .ks-dashes{order:9;width:100%;gap:0;justify-content:center}html .ks .ks-dash{width:44px;background-size:28px 2px}html .ks .ks-dash::after{inset:calc(50% - 1px) 8px}html .hero.has-ks .herogrid{padding-bottom:136px}}
.footgrid :is(#foot-shop,#foot-help) a{min-height:44px}
@media (max-width:819px){.nav{height:auto}.navin{flex-wrap:wrap;row-gap:0}.navin .logo{display:inline-flex;align-items:center;min-height:44px;font-size:clamp(1.15rem,5.4vw,1.7rem)}.navin:not(:has(.kn-toggle))>.links{display:flex;order:3;width:100%;justify-content:center;flex-wrap:wrap;gap:0 10px}.navin>.links a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font:italic 500 1.1rem/1 var(--serif)}}
.kn-toggle{min-width:44px;min-height:44px;border:1px solid var(--edge);border-radius:2px;background:none;color:var(--ink)}
.kn-panel{background:var(--surface);border-top:1px solid var(--line)}
.kn-panel a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font:italic 500 1.3rem/1 var(--serif)}
html[lang] .hero.has-ks{background:#1c1815}
html[lang] .hero.has-ks .herotext[data-hero-text]{background:rgb(16 11 9/.3)!important;box-shadow:0 0 80px 56px rgb(16 11 9/.3);border-radius:48px;backdrop-filter:none;-webkit-backdrop-filter:none;padding-inline:0}
html[lang] .hero.has-ks .herotext :is(h1,.lede,.eyebrow){text-shadow:0 2px 24px rgb(0 0 0/.55)}
html[data-l-fs=type] .hero{padding-top:clamp(2.5rem,6vw,4.5rem)}
html[data-l-fs=type] .hero .arch img{border-radius:var(--r-card);aspect-ratio:16/9;max-height:70vh}
html[data-l-list=rows][lang] [data-item]{grid-template-columns:clamp(120px,26vw,300px) minmax(0,1fr)}
html[data-l-list=rows] .prod h3{font-size:clamp(1.4rem,1rem + 1.2vw,2rem)}
html[data-l-fs=block][lang] .hero:not(.has-ks) .herotext :is(h1,.lede,.eyebrow,em,.rating){color:var(--on-accent)}
html[lang] .hero.has-ks .herotext :is(h1,.lede,.eyebrow,em,.rating){color:#fff}
html[lang] .hero.has-ks .herotext .btn-primary{background:var(--a-d);border-color:var(--a-d);color:#17131C}
html[lang] .hero.has-ks .herotext .btn-secondary{background:none;border-color:rgb(255 255 255/.7);color:#fff}
html[data-l-fs=block][lang] .hero:not(.has-ks) .heroacts .btn-secondary{color:var(--on-accent);border-color:var(--on-accent)}
html[lang] .hero.has-ks .ks::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,rgb(16 11 9/.36),rgb(16 11 9/.14) 40%,transparent 62%),linear-gradient(0deg,rgb(16 11 9/.24),transparent 26%)}
@media (max-width:640px){html[lang] .hero.has-ks .ks::after{background:linear-gradient(0deg,rgb(16 11 9/.7),rgb(16 11 9/.45) 52%,transparent 80%)}html[lang] .hero.has-ks{min-height:0}html[lang] .hero.has-ks .herogrid{padding-top:150px;padding-bottom:20px}html[lang] .hero.has-ks .ks .ks-ui{top:10px;bottom:auto}html[lang] .hero.has-ks h1{font-size:2.05rem}html[lang] .hero.has-ks .lede{font-size:.95rem;line-height:1.5}}
html:not([data-l-list=rows]) .products>.prod{display:flex;flex-direction:column}
html:not([data-l-list=rows]) .products>.prod>.btn:last-child{margin-top:auto}
html[data-l-fs=block][lang] .hero.has-ks .herotext[data-hero-text]{padding-inline:var(--gutter,24px)}

/* v5e: slideshow controls stay clickable; the hero text grid never eats clicks outside its own controls */
html .hero.has-ks .herogrid{pointer-events:none}
html .hero.has-ks .herogrid :is(a,button,input,select,textarea,label,summary,[tabindex],[role=button]){pointer-events:auto}
html .hero.has-ks .ks .ks-ui{z-index:5;pointer-events:auto}
html .hero.has-ks .ks img{filter:sepia(.05) brightness(1.13) saturate(1.12) contrast(.98)}
.hero .eyebrow{max-width:60ch;text-wrap:balance}

@media (min-width:641px){html .ks .ks-dash{height:24px}}
html[lang] main[data-main]{display:flex;flex-direction:column}
html[lang] [data-main]>[data-sec=hero]:not(#_){order:-2}
html[lang] [data-main]>section.trust[data-sec=stats]:not(#_){order:-1;position:relative;z-index:6;width:min(1120px,calc(100% - 24px));margin:-34px auto 0;padding-inline:32px;background:var(--band2);color:#FBF5F2;border-radius:6px;box-shadow:0 22px 44px -26px rgb(0 0 0/.5)}
.trust .trustgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 28px;padding-block:16px}
.trust .trustgrid span{font-size:.72rem}
.trust .trustgrid li{display:flex;align-items:baseline;gap:8px;text-align:left}
.trust .trustgrid svg{width:18px;height:18px;margin:0;align-self:center;stroke:var(--a-d)}
.trust .trustgrid b{font:italic 500 1.12rem/1.2 var(--serif);color:#FBF5F2}
.trust .trustgrid span{color:rgb(251 245 242/.78)}
@media (max-width:640px){html[lang] [data-main]>section.trust[data-sec=stats]:not(#_){margin-top:-22px;padding-inline:18px}.trust .trustgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;padding-block:12px}.trust .trustgrid li{display:grid;gap:0}.trust .trustgrid svg{width:16px;height:16px}.trust .trustgrid b{font-size:1rem}.trust .trustgrid span{font-size:.72rem;line-height:1.3}
html .ks .ks-btn{border:0;background:none;filter:drop-shadow(0 1px 3px rgb(0 0 0/.6))}html .ks .ks-btn svg{width:16px;height:16px}html .ks .ks-count{font-size:.85rem}
html[data-l-nav] [data-sec=nav]{padding-inline:0;top:0}html[data-l-nav] [data-sec=nav]>.navin{border-radius:0;border-inline:0;border-top:0;box-shadow:none;padding:6px 16px 0}.navin:not(:has(.kn-toggle))>.links{flex-wrap:nowrap;justify-content:space-between;gap:0;margin-top:4px;border-top:1px solid var(--line)}.navin>.links a{min-width:44px;padding-inline:4px;font:500 .8rem/1 var(--sans);letter-spacing:.06em}}
@media (max-width:520px){html[lang] .products[data-list]{display:grid;grid-template-columns:minmax(0,1fr);columns:auto;gap:var(--s-6)}html[lang] .products>.prod[data-item]{display:flex;flex-direction:column;gap:6px;padding:0 0 16px;overflow:hidden}html[lang] .products>.prod>:not(.pic){margin-inline:16px}html[lang] .products>.prod>.pic[data-item-media]{aspect-ratio:4/3;margin:0 0 8px;border-radius:var(--r-card) var(--r-card) 0 0}html[lang] .products>.prod>h3{font-size:1.45rem;margin:0}html[lang] .products>.prod>.blurb{display:block;-webkit-line-clamp:unset;overflow:visible}html[lang] .products>.prod>.btn{margin-top:4px}}
@media (min-width:521px){html[data-l-list=masonry][lang] .products[data-list]{display:grid;columns:auto;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:clamp(20px,2.5vw,32px);align-items:stretch}html[data-l-list=masonry][lang] .products>.prod[data-item]{margin:0}html[data-l-list=masonry][lang] .products>.prod>.pic[data-item-media]{aspect-ratio:4/5}}
@media (max-width:640px){.pills{flex-wrap:wrap;justify-content:center;gap:0}.pills .pill{min-width:44px;margin-inline:0;padding:0 7px;font-size:1rem}.sec{padding-block:2.6rem}.sechead{margin-bottom:1.4rem}.news{padding-block:2.6rem}}
html:not([data-l-list=rows])[lang] .products>.prod[data-item]{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:14px;row-gap:6px;align-content:start;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
html:not([data-l-list=rows])[lang] .products>.prod[data-item]>*{grid-column:1/-1;margin:0}
html:not([data-l-list=rows])[lang] .products>.prod[data-item]>h3{grid-column:1;margin-top:6px;font-size:1.45rem;line-height:1.15}
html:not([data-l-list=rows])[lang] .products>.prod[data-item]>.row{grid-column:2;margin-top:8px;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
html:not([data-l-list=rows])[lang] .products>.prod[data-item]>.pic[data-item-media]{aspect-ratio:4/5;border-radius:4px;margin-bottom:6px}
html[data-l-list=bento][lang] .products>.prod[data-item]:first-child{grid-template-rows:1fr}
html[data-l-list=bento][lang] .products>.prod[data-item]:first-child>.pic[data-item-media]{aspect-ratio:auto;min-height:320px}
html[data-l-list=rows][lang] .products>.prod[data-item]{background:none;box-shadow:none;border-radius:0;padding-inline:0}
html[lang] .products .prod .price{margin:0;padding:0;background:none;font-size:1.05rem}
html[lang] .products .prod .blurb{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;color:var(--ink-2)}
html[lang] .products .prod .field select{min-height:44px;border:0;border-bottom:1px solid var(--edge);border-radius:0;background-color:transparent;padding-left:2px}
html[lang] .products .prod>.btn.btn-secondary{justify-self:start;width:auto;min-height:44px;padding:0 2px;border:0;border-radius:0;background:none;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:6px;letter-spacing:.02em}
html[lang] .products .prod>.btn.btn-secondary:hover:not(:disabled){background:none;color:var(--accent);text-decoration-thickness:2px}
html:not(#_)[lang] .products[data-list]{gap:clamp(40px,4.5vw,64px) clamp(20px,2.4vw,32px)}
html[lang] [data-main]>section.trust[data-sec=stats]:not(#_){width:auto;margin:0;padding-inline:0;border-radius:0;box-shadow:none}
.trust .trustgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 32px;padding-block:30px}
.trust .trustgrid li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:baseline;text-align:left}
.trust .trustgrid li>:not(svg){grid-column:2}
.trust .trustgrid svg{grid-row:1/3;align-self:start;margin-top:4px}
.trust .trustgrid b{font-size:1.2rem}
.trust .trustgrid span{font-size:.95rem;line-height:1.45}
html .ks .ks-btn{border:0;background:none;opacity:.6;filter:drop-shadow(0 1px 3px rgb(0 0 0/.6))}
html .ks .ks-btn:is(:hover,:focus-visible){opacity:1}
html .ks .ks-btn svg{width:15px;height:15px}
@media (max-width:640px){.trust .trustgrid{grid-template-columns:1fr 1fr;gap:16px 18px;padding-block:22px}.trust .trustgrid b{font-size:1.05rem}.trust .trustgrid span{font-size:.94rem}html .ks .ks-btn{opacity:.85}}
@media (max-width:520px){html:not(#_)[lang] .products[data-list]{gap:40px}html:not([data-l-list=rows])[lang] .products>.prod[data-item]>.pic[data-item-media]{aspect-ratio:1;border-radius:4px}html[lang] .products .prod .blurb{-webkit-line-clamp:4}}

/* v5o: phone grid is one column for every list layout (bento's spanning first card made an implicit 2nd column, so half the cards were 0px wide) */
@media (max-width:520px){html[lang] .products[data-list]>.prod[data-item]{grid-column:auto;grid-row:auto}}
/* v5o: desktop bento with 4n products leaves one empty cell; the last card fills it */
@media (min-width:901px){html[data-l-list=bento][lang] .products[data-list]>.prod[data-item]:last-child:nth-child(4n){grid-column:span 2}}
/* v5o: the header stays reachable (cart) while scrolling */
html[lang] header.nav{position:sticky;top:0;z-index:40}