/* Maison Dorcin: site styles */
/* Self-hosted fonts (SIL OFL, see ../fonts/OFL.txt). Variable woff2 files: one file per subset covers every weight used.
   latin covers é è ë ò and the punctuation used on the site; latin-ext is only fetched if a page needs those glyphs. */
@font-face{font-family:"Cinzel";font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/cinzel-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Cinzel";font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/cinzel-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Jost";font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/jost-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Jost";font-style:normal;font-weight:300 500;font-display:swap;src:url(../fonts/jost-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  --black:#0b0b0b; --ink:#16130f; --ink-2:#1d1913;
  --ivory:#f6f1e7; --sand:#ece3d2; --marble:#e4d9c3; --line:#d9ccb2;
  --gold-1:#b8893b; --gold-2:#e9c97a; --gold-3:#a87a2f;
  --gold-text:#e3c47f;         /* light gold: small text on black */
  --gold-deep:#7a5719;         /* dark gold: small text on ivory */
  --text:#1c1812; --muted:#6b6254;
  --gold-grad:linear-gradient(120deg,#b8893b 0%,#e9c97a 48%,#a87a2f 100%);
  --serif:"Cinzel","Cormorant Garamond",Georgia,serif;
  --sans:"Jost","Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --radius:4px; --ease:cubic-bezier(.22,.7,.2,1);
  --wrap:1280px; --gut:20px; --hdr-h:60px;
}
@media(min-width:900px){:root{--gut:40px;--hdr-h:72px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--sans);font-size:16px;line-height:1.6;color:var(--text);background:var(--ivory);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.no-scroll{overflow:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.15;margin:0;letter-spacing:.04em}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px;border-radius:2px}
.on-ivory :focus-visible,.ivory :focus-visible{outline-color:var(--gold-deep)}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold-2);color:#000;padding:10px 16px;z-index:300}
.skip:focus{left:8px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.section{padding:72px 0}
@media(min-width:900px){.section{padding:112px 0}}
.dark{background:var(--black);color:var(--ivory)}
.ivory{background:var(--ivory)}
.sand{background:var(--sand)}

/* typography */
.eyebrow{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 14px}
.dark .eyebrow{color:var(--gold-text)}
.h-xl{font-size:clamp(34px,6.2vw,68px);letter-spacing:.05em;line-height:1.08}
.h-lg{font-size:clamp(28px,4.2vw,46px)}
.h-md{font-size:clamp(20px,2.4vw,26px)}
.lead{font-size:clamp(16px,1.6vw,19px);font-weight:300;color:var(--muted);max-width:56ch}
.dark .lead{color:#cfc5b2}
.gold-text{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.center{text-align:center}.center .lead{margin-inline:auto}
.sec-head{margin-bottom:48px}
.sec-head--row{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:flex-end;justify-content:space-between}
.link-arrow{font-size:12px;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:4px;color:var(--gold-deep)}
.dark .link-arrow{color:var(--gold-text)}
.link-arrow:hover{color:var(--text)}.dark .link-arrow:hover{color:#fff}
.kreyol{font-family:var(--serif);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-text)}

/* ornament */
.orn{display:flex;align-items:center;gap:14px;max-width:360px;margin:22px 0}
.orn::before,.orn::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,#c9a24f)}
.orn::after{transform:scaleX(-1)}
.orn i{width:34px;height:12px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 12' fill='none' stroke='%23d6b369' stroke-width='1'%3E%3Cpath d='M1 6C7 0 11 0 15 6M19 6C23 12 27 12 33 6'/%3E%3Cpath d='M17 2.5 19.5 6 17 9.5 14.5 6Z' fill='%23d6b369'/%3E%3C/svg%3E") center/contain no-repeat}
.orn--center{margin-inline:auto}
.orn--tight{margin:14px 0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 30px;border:1px solid transparent;border-radius:var(--radius);font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;transition:background .3s,color .3s,border-color .3s,transform .3s,box-shadow .3s;white-space:nowrap}
.btn--gold{background:var(--gold-grad);background-size:140% 100%;color:#14100a;box-shadow:0 6px 24px -10px rgba(233,201,122,.6)}
.btn--gold:hover{background-position:100% 0;transform:translateY(-1px)}
.btn--ghost{border-color:rgba(233,201,122,.55);color:var(--gold-text);background:transparent}
.btn--ghost:hover{background:rgba(233,201,122,.12);border-color:var(--gold-2)}
.btn--dark{background:var(--black);color:var(--ivory)}
.btn--dark:hover{background:#2a241b}
.btn--line{border-color:var(--text);color:var(--text)}
.btn--line:hover{background:var(--text);color:var(--ivory)}
.btn--wa{background:#1f7a4a;color:#fff}
.btn--wa:hover{background:#25905a}
.btn--block{display:flex;width:100%}
.btn--sm{min-height:40px;padding:0 20px;font-size:11px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.ico{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ico--fill{fill:currentColor;stroke:none}
.btn .ico{width:18px;height:18px}

/* announcement */
.announce{background:linear-gradient(90deg,#0b0b0b,#1c1710 50%,#0b0b0b);color:var(--gold-text);font-size:12px;letter-spacing:.22em;text-transform:uppercase;text-align:center;height:38px;position:relative;overflow:hidden;border-bottom:1px solid rgba(233,201,122,.14)}
.announce__msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s;padding:0 44px;white-space:nowrap}
.announce__msg.is-on{opacity:1;transform:none}
.announce__btn{position:absolute;top:0;bottom:0;width:40px;background:none;border:0;color:var(--gold-text);display:flex;align-items:center;justify-content:center;z-index:2}
.announce__btn--prev{left:0}.announce__btn--next{right:0}
.announce__btn .ico{width:14px;height:14px}
@media(max-width:480px){.announce{font-size:10.5px;letter-spacing:.16em}}

/* header */
.hdr{position:sticky;top:0;z-index:60;background:rgba(11,11,11,.97);backdrop-filter:blur(10px);color:var(--ivory);border-bottom:1px solid rgba(233,201,122,.2);transition:box-shadow .3s}
.hdr.is-scrolled{box-shadow:0 10px 30px -18px rgba(0,0,0,.9)}
.hdr__row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--hdr-h);transition:height .3s}
.hdr__side{display:flex;align-items:center;gap:2px}
.hdr__side--r{justify-content:flex-end}
.icon-btn{position:relative;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;color:var(--ivory);border-radius:50%;transition:color .2s,background .2s}
.icon-btn:hover{color:var(--gold-2);background:rgba(233,201,122,.08)}
.icon-btn .ico{width:22px;height:22px}
.bag-count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--gold-grad);color:#14100a;font-size:11px;font-weight:600;line-height:18px;text-align:center}
.bag-count[hidden]{display:none}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ivory)}
.brand img{width:26px;height:auto}
.brand__txt{display:flex;flex-direction:column;align-items:center;line-height:1}
.brand__name{white-space:nowrap;font-family:var(--serif);font-size:16px;letter-spacing:.16em;font-weight:500;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-left:.2em}
.brand__sub{font-size:8px;letter-spacing:.46em;text-transform:uppercase;color:var(--gold-text);margin-top:6px;padding-left:.5em}
@media(min-width:900px){.brand img{width:40px}.brand__name{font-size:24px}.brand__sub{font-size:9.5px}.hdr.is-scrolled .brand img{width:32px}}
.hdr__menu{display:inline-flex}
.hdr__nav{display:none}
@media(min-width:900px){
  .hdr__menu{display:none}
  .hdr__nav{display:block;border-top:1px solid rgba(233,201,122,.12)}
}
.nav{display:flex;justify-content:center;gap:clamp(18px,3vw,44px)}
.nav>li{position:static}
.nav a,.nav button{display:inline-flex;align-items:center;gap:6px;height:46px;background:none;border:0;padding:0;font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:#e9e0cd;position:relative;transition:color .2s}
.nav a::after,.nav button::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1px;background:var(--gold-2);transform:scaleX(0);transition:transform .3s var(--ease)}
.nav a:hover,.nav button:hover,.nav a[aria-current],.nav button[aria-expanded=true]{color:var(--gold-2)}
.nav a:hover::after,.nav button:hover::after,.nav a[aria-current]::after,.nav button[aria-expanded=true]::after{transform:scaleX(1)}
.nav .chev{width:10px;height:10px;transition:transform .3s}
.nav button[aria-expanded=true] .chev{transform:rotate(180deg)}
.mega{position:absolute;left:0;right:0;top:100%;background:#0f0e0c;border-top:1px solid rgba(233,201,122,.2);border-bottom:1px solid rgba(233,201,122,.2);box-shadow:0 30px 50px -20px rgba(0,0,0,.8);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .25s,visibility .25s}
.mega.is-open{opacity:1;visibility:visible;transform:none}
.mega__in{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:48px;padding:40px var(--gut) 44px;max-width:var(--wrap);margin:0 auto}
.mega h4{font-family:var(--sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-text);margin-bottom:14px;font-weight:500}
.mega li a{height:auto;padding:7px 0;font-size:14px;letter-spacing:.04em;text-transform:none;font-weight:300;color:#ddd3bf}
.mega li a::after{display:none}
.mega__feat{display:flex;gap:20px;align-items:center;text-decoration:none;background:var(--ink-2);border:1px solid rgba(233,201,122,.18);padding:16px}
.mega .mega__feat{height:auto;text-transform:none;letter-spacing:0;color:var(--ivory)}
.mega__feat .arch{width:96px;flex:none}
.mega__feat strong{font-family:var(--serif);font-weight:500;font-size:17px;letter-spacing:.06em;display:block;margin-bottom:6px;color:var(--ivory)}
.mega__feat span{font-size:13px;color:#bdb29e;font-weight:300;display:block;text-transform:none;letter-spacing:.02em;white-space:normal}

/* arch frames */
.arch{border-radius:999px 999px 0 0;overflow:hidden;position:relative;background:#111}
.arch img,.arch svg{width:100%;height:100%;object-fit:cover}
.arch--sm{aspect-ratio:4/5}

/* search panel */
.search{position:fixed;left:0;right:0;top:0;z-index:120;background:var(--black);color:var(--ivory);padding:18px var(--gut) 26px;transform:translateY(-102%);visibility:hidden;transition:transform .35s var(--ease),visibility .35s;border-bottom:1px solid rgba(233,201,122,.3);max-height:100vh;overflow:auto}
.search.is-open{transform:none;visibility:visible}
.search__in{max-width:760px;margin:0 auto}
.search__form{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--gold-1);padding:4px 0}
.search__form input{flex:1;background:none;border:0;font-size:20px;font-weight:300;padding:12px 0;color:var(--ivory);min-width:0}
.search__form input:focus{outline:0}
.search__form input::placeholder{color:#8f8672}
.search__res{margin-top:12px}
.search__res a{display:flex;gap:14px;align-items:center;padding:10px 4px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.07)}
.search__res a:hover{background:rgba(233,201,122,.08)}
.search__res .arch{width:44px;flex:none}
.search__res small{display:block;color:var(--gold-text);letter-spacing:.14em;text-transform:uppercase;font-size:11px}
.search__hint{color:#a89f8b;font-size:14px;margin:14px 0 0}
.search__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}

/* overlay + drawers */
.overlay{position:fixed;inset:0;background:rgba(5,4,3,.6);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;z-index:100}
.overlay.is-on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;bottom:0;right:0;width:min(440px,100vw);max-width:100vw;background:var(--ivory);color:var(--text);z-index:110;display:flex;flex-direction:column;transform:translateX(102%);visibility:hidden;transition:transform .4s var(--ease),visibility .4s;box-shadow:-20px 0 60px -20px rgba(0,0,0,.6)}
.drawer--left{right:auto;left:0;transform:translateX(-102%);box-shadow:20px 0 60px -20px rgba(0,0,0,.6)}
.drawer.is-open{transform:none;visibility:visible}
.drawer--dark{background:var(--black);color:var(--ivory)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line);flex:none}
.drawer--dark .drawer__head{border-color:rgba(233,201,122,.2)}
.drawer__title{font-size:15px;letter-spacing:.24em;text-transform:uppercase}
.drawer__body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.drawer__foot{flex:none;border-top:1px solid var(--line);padding:18px 22px calc(18px + env(safe-area-inset-bottom));background:#fbf8f1}

/* mobile nav drawer */
.mnav{padding:8px 0 24px}
.mnav a,.mnav summary{display:flex;align-items:center;justify-content:space-between;padding:17px 24px;font-family:var(--serif);font-size:17px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(233,201,122,.12);list-style:none;cursor:pointer;min-height:56px}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary .chev{width:14px;height:14px;transition:transform .3s}
.mnav details[open] summary .chev{transform:rotate(180deg)}
.mnav details[open] summary{color:var(--gold-2)}
.mnav .sub{background:#12100d;padding:6px 0 10px}
.mnav .sub a{font-family:var(--sans);font-size:15px;letter-spacing:.06em;text-transform:none;font-weight:300;border:0;padding:12px 24px 12px 40px;min-height:46px;color:#d9cfbb}
.mnav .sub a:active,.mnav .sub a:hover,.mnav a:hover{color:var(--gold-2)}
.mnav__foot{padding:22px 24px calc(28px + env(safe-area-inset-bottom));display:grid;gap:12px}
.socials{display:flex;gap:10px}
.socials a{width:44px;height:44px;border:1px solid rgba(233,201,122,.4);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--gold-text);transition:all .25s}
.socials a:hover{background:var(--gold-2);color:#000}
.socials .ico{width:19px;height:19px}

/* bag */
.bag__empty{padding:64px 28px;text-align:center}
.bag__empty .arch{width:110px;margin:0 auto 24px}
.bag__list{padding:6px 22px}
.bag-item{display:grid;grid-template-columns:76px 1fr auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.bag-item .arch{aspect-ratio:4/5}
.bag-item h4{font-size:14px;letter-spacing:.06em;margin-bottom:4px;line-height:1.3}
.bag-item h4 a{text-decoration:none}
.bag-item__opts{font-size:13px;color:var(--muted);margin-bottom:10px;line-height:1.4}
.bag-item__price{font-weight:500;font-size:15px;text-align:right}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.qty button{width:38px;height:38px;border:0;background:none;font-size:18px;line-height:1}
.qty button:hover{background:var(--sand)}
.qty input{width:38px;height:38px;border:0;text-align:center;background:none;-moz-appearance:textfield;font-size:15px}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.link-btn{background:none;border:0;padding:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.link-btn:hover{color:var(--text)}
.bag-item__row{display:flex;align-items:center;gap:16px}
.subtotal{display:flex;justify-content:space-between;align-items:baseline;font-size:15px;margin-bottom:6px}
.subtotal strong{font-family:var(--serif);font-size:22px;font-weight:500}
.note{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 14px}
.locpick{border:0;padding:0;margin:0 0 14px}
.locpick legend{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);padding:0;margin-bottom:8px;font-weight:500}
.locpick__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.locpick label{display:block;position:relative}
.locpick input{position:absolute;opacity:0;inset:0;cursor:pointer;width:100%;height:100%;margin:0}
.locpick label>span{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;font-size:14px;line-height:1.25;background:#fff;transition:all .2s}
.locpick small{display:block;font-size:11px;color:var(--muted);letter-spacing:.02em}
.locpick input:checked+span{border-color:var(--gold-1);background:#fffaf0;box-shadow:inset 0 0 0 1px var(--gold-1)}
.locpick input:focus-visible+span{outline:2px solid var(--gold-deep);outline-offset:2px}
.foot-links{display:flex;justify-content:center;margin-top:12px}

/* sheet (quick add) */
.sheet{position:fixed;z-index:130;left:50%;top:50%;width:min(880px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;background:var(--ivory);transform:translate(-50%,-46%);opacity:0;visibility:hidden;transition:all .35s var(--ease);display:grid;grid-template-columns:1fr;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);border-radius:4px}
.sheet.is-open{opacity:1;visibility:visible;transform:translate(-50%,-50%)}
.sheet__media{display:none}
.sheet__body{padding:28px 24px 26px}
.sheet__close{position:absolute;top:8px;right:8px;z-index:2}
@media(min-width:760px){.sheet{grid-template-columns:.8fr 1.2fr}.sheet__media{display:block;background:var(--black);padding:28px}}
@media(max-width:759px){.sheet{top:auto;bottom:0;left:0;width:100%;max-height:92dvh;transform:translateY(102%);border-radius:14px 14px 0 0}.sheet.is-open{transform:none}}

/* option chips */
.opt{margin:0 0 20px;border:0;padding:0}
.opt legend,.opt__label{display:flex;justify-content:space-between;width:100%;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:10px;font-weight:500;padding:0}
.opt__label b{color:var(--text);letter-spacing:.08em;font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border:1px solid var(--line);border-radius:999px;font-size:14px;background:#fff;transition:all .2s;white-space:nowrap}
.chip:hover span{border-color:var(--gold-1)}
.chip input:checked+span{background:var(--black);border-color:var(--black);color:var(--gold-text)}
.chip input:focus-visible+span{outline:2px solid var(--gold-deep);outline-offset:2px}
.chip--sq span{border-radius:var(--radius);min-width:52px;justify-content:center;padding:0 10px}
.price-big{font-family:var(--serif);font-size:28px;letter-spacing:.04em;margin:0 0 4px}
.price-big small{font-family:var(--sans);font-size:12px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin-right:6px}

/* hero */
.hero{position:relative;background:radial-gradient(1000px 520px at 78% 38%,rgba(184,137,59,.22),transparent 62%),radial-gradient(700px 400px at 5% 0%,rgba(233,201,122,.07),transparent 60%),var(--black);color:var(--ivory);overflow:hidden}
.hero__in{display:grid;gap:36px;padding-block:44px 64px;align-items:center}
@media(min-width:900px){.hero__in{grid-template-columns:1.1fr .9fr;gap:64px;padding-block:76px 96px;min-height:640px}}
.hero h1{margin:0 0 6px}
.hero .lead{margin:0 0 30px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px}
.hero__cta{flex-wrap:nowrap}.hero__cta .btn{flex:1 1 0;padding:0 12px;letter-spacing:.18em}
@media(min-width:600px){.hero__cta .btn{flex:0 0 auto;padding:0 30px;letter-spacing:.24em}}
.hero__frame{position:relative;width:min(320px,76%);margin:0 auto;aspect-ratio:3/4.1}
@media(min-width:900px){.hero__frame{width:min(380px,100%);margin:0 0 0 auto;aspect-ratio:3/4.15}}
.hero__frame .arch{height:100%;box-shadow:0 40px 80px -30px #000}
.hero__frame::before{content:"";position:absolute;inset:-12px -12px 0;border:1px solid rgba(233,201,122,.55);border-bottom:0;border-radius:999px 999px 0 0}
.hero__frame::after{content:"";position:absolute;inset:-24px -24px 0;border:1px solid rgba(233,201,122,.2);border-bottom:0;border-radius:999px 999px 0 0}
.hero__frame .arch img{object-position:50% 12%}
.hero__tag{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);background:var(--black);border:1px solid rgba(233,201,122,.6);padding:10px 20px;text-align:center;white-space:nowrap;z-index:2}
.hero__tag span{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-text)}
.hero__tag b{display:block;font-family:var(--serif);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-top:2px}
.hero__word{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.hero__rule{display:flex;gap:18px;flex-wrap:wrap;color:#bdb29e;font-size:13px;letter-spacing:.06em;margin-top:30px}

/* trust strip */
.trust{background:var(--ink);color:var(--ivory);border-top:1px solid rgba(233,201,122,.2);border-bottom:1px solid rgba(233,201,122,.2)}
.trust__grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
@media(min-width:900px){.trust__grid{grid-template-columns:repeat(4,1fr)}}
.trust__it{padding:22px 14px;text-align:center;border-right:1px solid rgba(233,201,122,.12);border-bottom:1px solid rgba(233,201,122,.12)}
@media(min-width:900px){.trust__it{border-bottom:0}.trust__it:last-child{border-right:0}}
.trust__it:nth-child(2n){border-right:0}
@media(min-width:900px){.trust__it:nth-child(2n){border-right:1px solid rgba(233,201,122,.12)}}
.trust__it .ico{margin:0 auto 10px;color:var(--gold-2);width:26px;height:26px}
.trust__it b{display:block;font-family:var(--serif);font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.trust__it span{display:block;font-size:13px;color:#b9ae9a;font-weight:300;margin-top:2px}

/* texture tiles */
.tex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(min-width:700px){.tex-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}
.tex-tile{display:block;position:relative;text-decoration:none;color:var(--ivory)}
.tex-tile .arch{aspect-ratio:4/5;transition:transform .6s var(--ease)}
.tex-tile .arch svg{position:absolute;inset:0}
.tex-tile--all .arch{position:relative}
.tex-tile .arch svg{transition:transform .8s var(--ease)}
.tex-tile:hover .arch svg{transform:scale(1.05)}
.tex-tile__cap{display:flex;justify-content:space-between;align-items:center;padding:14px 4px 0;color:var(--text)}
.tex-tile__cap b{font-family:var(--serif);font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase}
.tex-tile__cap span{font-size:12px;color:var(--muted);letter-spacing:.08em}
.tex-tile--all{display:flex}
.tex-tile--all .arch{aspect-ratio:4/5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;background:var(--black);border:1px solid rgba(233,201,122,.5);border-bottom:0;text-align:center;padding:20px}
.tex-tile--all b{font-family:var(--serif);font-weight:500;letter-spacing:.16em;text-transform:uppercase;font-size:15px}

/* product grid / cards */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 14px}
@media(min-width:760px){.grid{grid-template-columns:repeat(3,1fr);gap:40px 22px}}
@media(min-width:1180px){.grid--4{grid-template-columns:repeat(4,1fr)}}
.card{position:relative;display:flex;flex-direction:column}
.card__img{position:relative}
.card__media{display:block;position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--black);border-radius:2px}
.card__media .art{position:absolute;inset:0;width:100%;height:100%;transition:opacity .6s var(--ease),transform 1s var(--ease)}
.card__media .art--ivory,.card__media img+img{opacity:0}
.card__media>.card__hov{position:absolute;inset:0;opacity:0;transition:opacity .6s var(--ease)}
.card__media>.card__hov svg,.card__media>.card__hov img{width:100%;height:100%;object-fit:cover}
@media(hover:hover){.card:hover .card__hov{opacity:1}.card:hover .card__main svg{transform:scale(1.04)}}
.card__main svg,.card__main img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.card__main{position:absolute;inset:0}
.card .art{position:static}
.card__badge{position:absolute;top:10px;left:10px;z-index:2;background:var(--ivory);color:#14100a;font-size:10px;letter-spacing:.2em;text-transform:uppercase;padding:5px 10px 4px;font-weight:500;border-radius:1px}
.card__badge--new{background:var(--gold-grad)}
.card__quick{position:absolute;z-index:3;left:10px;right:10px;bottom:10px;height:44px;background:rgba(11,11,11,.92);color:var(--gold-text);border:1px solid rgba(233,201,122,.5);font-size:11px;letter-spacing:.24em;text-transform:uppercase;transform:translateY(60px);opacity:0;transition:transform .4s var(--ease),opacity .3s,background .2s}
.card__quick:hover{background:var(--gold-2);color:#000}
@media(hover:hover){.card:hover .card__quick,.card__quick:focus-visible{transform:none;opacity:1}}
@media(hover:none){.card__quick{left:auto;right:8px;bottom:8px;width:42px;height:42px;padding:0;transform:none;opacity:1;border-radius:50%;font-size:0;display:flex;align-items:center;justify-content:center}.card__quick .ico{width:18px;height:18px}}
.card__quick .ico{display:none}
@media(hover:none){.card__quick .ico{display:block}}
.card__body{padding:14px 2px 0;flex:1;display:flex;flex-direction:column}
.card__meta{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 4px}
.card__title{font-size:14px;letter-spacing:.07em;line-height:1.35;margin:0 0 6px;font-weight:500}
.card__title a{text-decoration:none}
.card__title a::after{content:"";position:absolute;inset:0;z-index:1}
.card__quick{z-index:3}
.rating{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin-bottom:6px}
.stars{position:relative;display:inline-block;font-size:13px;letter-spacing:2px;line-height:1;color:#d6cbb4;white-space:nowrap}
.stars i{position:absolute;left:0;top:0;overflow:hidden;color:var(--gold-3);font-style:normal;white-space:nowrap}
.price{font-size:15px;font-weight:500;margin:auto 0 0}
.price small{font-weight:300;color:var(--muted);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-right:4px}
.dark .card__title,.dark .price{color:var(--ivory)}
.dark .card__meta{color:var(--gold-text)}
.dark .rating{color:#aea48f}
.dark .stars{color:#4a4235}.dark .stars i{color:var(--gold-2)}
.dark .price small{color:#aea48f}

/* scroll rows */
.hscroll{scroll-padding-inline:var(--gut);display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,64%);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;margin:0 calc(var(--gut) * -1);padding-inline:var(--gut);scrollbar-width:thin;scrollbar-color:var(--gold-1) transparent}
.hscroll>*{scroll-snap-align:start}
@media(min-width:760px){.hscroll{grid-auto-columns:calc((100% - 66px)/4);margin:0;padding-inline:0;scroll-padding-inline:0}}

/* story */
.story{display:grid;gap:44px;align-items:center}
@media(min-width:900px){.story{grid-template-columns:.9fr 1.1fr;gap:96px}}
.story__media{position:relative;width:min(340px,80%);margin:0 auto}
.story__media .arch{aspect-ratio:4/5.4;box-shadow:0 30px 60px -30px #000}
.story__media::before{content:"";position:absolute;inset:-12px -12px 0;border:1px solid rgba(233,201,122,.5);border-bottom:0;border-radius:999px 999px 0 0}
.story__bag{position:absolute;right:-18%;bottom:-8%;width:46%;border:5px solid var(--black);box-shadow:0 20px 40px -10px #000;aspect-ratio:3/4;overflow:hidden}
.story__bag img{width:100%;height:100%;object-fit:cover}
.story__routes{display:flex;align-items:center;gap:14px;margin:26px 0 0;font-family:var(--serif);letter-spacing:.2em;font-size:13px;text-transform:uppercase;flex-wrap:wrap;color:var(--gold-text)}
.story__routes i{width:56px;height:1px;background:linear-gradient(90deg,var(--gold-1),var(--gold-2))}
.story p{color:#cfc5b2;font-weight:300}

/* salon */
.salon{display:grid;gap:40px;align-items:center}
@media(min-width:900px){.salon{grid-template-columns:1.05fr .95fr;gap:88px}}
.salon__media{width:min(380px,86%);position:relative}
.salon__media .arch{aspect-ratio:3/4.1}
.salon__media img{object-position:30% 50%}
.salon__media::after{content:"";position:absolute;inset:-12px -12px 0;border:1px solid var(--gold-1);border-bottom:0;border-radius:999px 999px 0 0;pointer-events:none;opacity:.7}
@media(min-width:900px){.salon__media{margin-left:auto}}
.salon__list{margin:26px 0 30px;display:grid;gap:12px}
.salon__list li{display:flex;gap:14px;align-items:flex-start;font-weight:300}
.salon__list .ico{color:var(--gold-deep);margin-top:3px}
.salon p{color:var(--muted)}

/* wholesale */
.whole{position:relative;background:linear-gradient(120deg,rgba(11,11,11,.95),rgba(11,11,11,.78)),url("../img/showroom.webp") center/cover;color:var(--ivory);overflow:hidden}
.whole__in{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.whole__in{grid-template-columns:1.2fr .8fr;gap:80px}}
.whole__panel{border:1px solid rgba(233,201,122,.45);padding:34px 28px;background:rgba(11,11,11,.7);backdrop-filter:blur(4px);text-align:center}
.whole__panel .kreyol{display:block;font-size:18px;margin-bottom:6px;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.whole__panel p{color:#cfc5b2;font-size:14px;font-weight:300}
.whole__list{margin:24px 0 32px;display:grid;gap:10px;font-weight:300;color:#d9cfbb}
.whole__list li{display:flex;gap:12px;align-items:flex-start}
.whole__list .ico{color:var(--gold-2);margin-top:3px}
.whole__btns{display:flex;flex-wrap:wrap;gap:12px}

/* testimonials */
.quote-grid{display:grid;gap:20px}
@media(min-width:800px){.quote-grid{grid-template-columns:repeat(3,1fr);gap:28px}}
.quote{background:#fff;border:1px solid var(--line);padding:32px 28px;position:relative}
.quote::before{content:"\201C";font-family:var(--serif);font-size:56px;line-height:.5;height:26px;color:var(--gold-1);display:block;margin-bottom:10px}
.quote p{font-size:17px;font-weight:300;line-height:1.55;margin-bottom:20px}
.quote cite{font-style:normal;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-deep);font-weight:500}

/* locations */
.loc-grid{display:grid;gap:16px}
@media(min-width:640px){.loc-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.loc-grid{grid-template-columns:repeat(4,1fr)}}
.loc{background:var(--ink-2);border:1px solid rgba(233,201,122,.22);padding:28px 24px;display:flex;flex-direction:column;gap:6px}
.loc h3{font-size:18px;letter-spacing:.14em;text-transform:uppercase}
.loc__tel{font-size:19px;font-weight:300;letter-spacing:.04em;text-decoration:none;color:var(--ivory);margin:6px 0 2px;display:inline-block}
.loc__tel:hover{color:var(--gold-2)}
.loc small{color:#b9ae9a;font-size:13px;line-height:1.5;display:block;min-height:40px;font-weight:300}
.loc__btns{display:grid;gap:8px;margin-top:auto;padding-top:14px}
.loc--ivory{background:#fff;border-color:var(--line)}
.loc--ivory h3,.loc--ivory .loc__tel{color:var(--text)}
.loc--ivory small{color:var(--muted)}

/* page hero (inner pages) */
.phero{background:radial-gradient(800px 300px at 50% 0,rgba(184,137,59,.2),transparent 70%),var(--black);color:var(--ivory);padding:52px 0 48px;text-align:center}
.phero h1{font-size:clamp(28px,5vw,48px);letter-spacing:.1em;text-transform:uppercase}
.phero .orn{margin-inline:auto}
.phero p{color:#cfc5b2;max-width:56ch;margin:0 auto;font-weight:300}
.crumbs{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:20px 0 0}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--text)}
.crumbs span{margin:0 8px;color:var(--line)}

/* shop */
.shop{display:grid;gap:0;padding:28px 0 90px}
@media(min-width:900px){.shop{grid-template-columns:260px 1fr;gap:56px;padding-top:44px}}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 18px;border-bottom:1px solid var(--line);margin-bottom:20px;flex-wrap:wrap}
.toolbar__count{font-size:14px;color:var(--muted);letter-spacing:.04em}
.toolbar__count b{color:var(--text);font-weight:500}
.sort{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.sort select{appearance:none;-webkit-appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%237a5719' stroke-width='1.5'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E") right 12px center/11px no-repeat;border:1px solid var(--line);border-radius:var(--radius);padding:0 34px 0 14px;height:44px;font-size:14px;letter-spacing:.02em;text-transform:none;color:var(--text)}
.filter-btn{display:inline-flex}
@media(min-width:900px){.filter-btn{display:none}}
.active{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.active:empty{display:none}
.tag{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 6px 0 14px;border:1px solid var(--gold-1);border-radius:999px;background:#fffaf0;font-size:13px}
.tag button{width:26px;height:26px;border-radius:50%;border:0;background:var(--sand);display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1}
.tag button:hover{background:var(--gold-2)}
.filters{background:var(--ivory)}
.filters__head{display:none}
.fgroup{border-bottom:1px solid var(--line);padding:18px 0}
.fgroup:first-of-type{padding-top:0}
.fgroup h3{font-family:var(--sans);font-size:11px;letter-spacing:.28em;text-transform:uppercase;font-weight:500;color:var(--gold-deep);margin-bottom:14px}
.fchecks{display:grid;gap:2px}
.fcheck{display:flex;align-items:center;gap:12px;min-height:40px;cursor:pointer;font-size:15px;position:relative}
.fcheck input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.fcheck i{width:18px;height:18px;border:1px solid #b5a78a;border-radius:2px;background:#fff;flex:none;position:relative;transition:all .2s}
.fcheck input:checked+i{background:var(--black);border-color:var(--black)}
.fcheck input:checked+i::after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid var(--gold-2);border-width:0 2px 2px 0;transform:rotate(45deg)}
.fcheck input:focus-visible+i{outline:2px solid var(--gold-deep);outline-offset:2px}
.fcheck em{margin-left:auto;font-style:normal;font-size:12px;color:var(--muted)}
.clear-all{margin-top:16px}
@media(max-width:899px){
  .filters{position:fixed;top:0;bottom:0;left:0;width:min(400px,100vw);z-index:110;display:flex;flex-direction:column;transform:translateX(-102%);visibility:hidden;transition:transform .4s var(--ease),visibility .4s;box-shadow:20px 0 60px -20px rgba(0,0,0,.6)}
  .filters.is-open{transform:none;visibility:visible}
  .filters__head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line);flex:none}
  .filters__scroll{flex:1;overflow-y:auto;padding:6px 22px 20px;overscroll-behavior:contain}
  .filters__foot{display:flex;gap:10px;padding:14px 22px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fbf8f1;flex:none}
  .filters__foot .btn{flex:1;padding:0 14px}
  .fgroup:first-of-type{padding-top:18px}
}
@media(min-width:900px){.filters__foot{display:none}.filters{position:sticky;top:130px;align-self:start;max-height:calc(100vh - 150px);overflow:auto;padding-right:6px;scrollbar-width:thin}}
.empty{text-align:center;padding:70px 20px;border:1px dashed var(--line)}

/* product page */
.pdp{display:grid;gap:30px;padding:20px 0 70px}
@media(min-width:900px){.pdp{grid-template-columns:1.05fr .95fr;gap:72px;padding-top:30px}}
.gallery{display:grid;gap:14px;align-content:start}
@media(min-width:900px){.gallery{grid-template-columns:78px 1fr;position:sticky;top:130px}.gallery__thumbs{order:-1;flex-direction:column}}
.gallery__main{aspect-ratio:4/5;position:relative;background:var(--black);overflow:hidden;border-radius:2px}
.gallery__main>div{position:absolute;inset:0;opacity:0;transition:opacity .45s}
.gallery__main>div.is-on{opacity:1}
.gallery__main svg,.gallery__main img{width:100%;height:100%;object-fit:cover}
.gallery__thumbs{display:flex;gap:10px;align-self:start}
.gallery__thumbs button{width:68px;aspect-ratio:4/5;padding:0;border:1px solid var(--line);background:var(--black);overflow:hidden;opacity:.7;transition:all .2s;flex:none}
.gallery__thumbs button svg,.gallery__thumbs button img{width:100%;height:100%;object-fit:cover}
.gallery__thumbs button[aria-pressed=true]{opacity:1;border-color:var(--gold-1);box-shadow:0 0 0 1px var(--gold-1)}
.pdp__info h1{font-size:clamp(24px,3.4vw,34px);letter-spacing:.07em;text-transform:uppercase;margin:6px 0 12px}
.pdp__rate{margin-bottom:18px}
.pdp__desc{color:var(--muted);font-weight:300;margin-bottom:24px}
.buyrow{display:flex;gap:12px;align-items:stretch;margin:6px 0 14px}
.buyrow .btn{flex:1}
.buyrow .qty button,.buyrow .qty input{height:50px}
.pdp__perks{display:grid;gap:8px;margin:22px 0;font-size:14px;color:var(--muted)}
.pdp__perks li{display:flex;gap:10px;align-items:center}
.pdp__perks .ico{color:var(--gold-deep);width:18px;height:18px}
.acc{border-top:1px solid var(--line);margin-top:24px}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 2px;font-family:var(--serif);font-size:14px;letter-spacing:.16em;text-transform:uppercase;min-height:56px}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-family:var(--sans);font-size:22px;color:var(--gold-deep);font-weight:300;transition:transform .3s}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc .acc__b{padding:0 2px 22px;color:var(--muted);font-weight:300}
.acc .acc__b ul{list-style:disc;padding-left:20px;display:grid;gap:6px}
.review{padding:14px 0;border-top:1px solid var(--line)}
.review:first-of-type{border:0;padding-top:0}
.review b{display:block;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--text);font-weight:500}
.review p{margin:6px 0 0}
.sticky-add{display:none}
@media(max-width:899px){
  .sticky-add{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(11,11,11,.97);padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));align-items:center;gap:14px;border-top:1px solid rgba(233,201,122,.3);transform:translateY(110%);transition:transform .35s var(--ease)}
  .sticky-add.is-on{transform:none}
  .sticky-add b{font-family:var(--serif);font-weight:500;color:var(--gold-text);font-size:18px;letter-spacing:.05em}
  .sticky-add .btn{flex:1}
  body.has-sticky{padding-bottom:70px}
}

/* contact */
.contact-grid{display:grid;gap:44px}
@media(min-width:900px){.contact-grid{grid-template-columns:1.3fr .7fr;gap:72px}}
.form{display:grid;gap:16px}
.field label{display:block;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:8px;font-weight:500}
.field input,.field select,.field textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:13px 14px;min-height:48px;font-weight:300}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--gold-1);outline-offset:0;border-color:var(--gold-1)}
.card-box{background:#fff;border:1px solid var(--line);padding:28px 26px}
.card-box h3{font-size:16px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
.card-box p{color:var(--muted);font-weight:300}
.card-box .socials a{color:var(--gold-deep);border-color:var(--gold-1)}
.card-box .socials a:hover{background:var(--black);color:var(--gold-2)}
.sidebox{display:grid;gap:20px;align-content:start}

/* footer */
.foot{background:var(--black);color:#cfc5b2;border-top:1px solid rgba(233,201,122,.3)}
.foot__news{border-bottom:1px solid rgba(233,201,122,.16);padding:56px 0}
.foot__news-in{display:grid;gap:26px;align-items:center}
@media(min-width:900px){.foot__news-in{grid-template-columns:1fr 1fr;gap:80px}}
.foot__wa{justify-self:start}
.foot__grid{display:grid;gap:40px 28px;padding:56px 0 40px;grid-template-columns:1fr 1fr}
@media(min-width:900px){.foot__grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}}
.foot__brand{grid-column:1/-1}
@media(min-width:900px){.foot__brand{grid-column:auto}}
.foot h4{font-family:var(--sans);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-text);margin-bottom:16px;font-weight:500}
.foot li{margin-bottom:2px}
.foot li a{text-decoration:none;font-weight:300;display:inline-block;padding:5px 0;font-size:15px}
.foot li a:hover{color:var(--gold-2)}
.foot__brand img{width:64px;margin-bottom:14px}
.foot__brand p{font-weight:300;max-width:34ch}
.foot__bar{border-top:1px solid rgba(233,201,122,.14);padding:22px 0 30px;font-size:13px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;color:#9a917d}
.foot .socials{margin-top:18px}

/* toast */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:var(--black);color:var(--ivory);border:1px solid var(--gold-1);padding:14px 22px;font-size:14px;z-index:200;opacity:0;pointer-events:none;transition:all .35s var(--ease);max-width:calc(100vw - 32px);text-align:center}
.toast.is-on{opacity:1;transform:translate(-50%,0)}

/* reveal */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
}

/* 404 */
.nf{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:60px var(--gut);background:radial-gradient(600px 400px at 50% 30%,rgba(184,137,59,.18),transparent 70%),var(--black);color:var(--ivory)}
.nf img{width:100px;margin:0 auto 20px}
.nf h1{font-size:clamp(56px,14vw,120px);letter-spacing:.12em;margin-bottom:6px}
.nf .orn{margin-inline:auto}
.nf p{color:#cfc5b2;margin-bottom:28px}
.nf__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.hero .lead,.whole .lead{color:#d8cebb}
.nowrap{white-space:nowrap}
.socials .ico{width:21px;height:21px}
.mega a{text-decoration:none}.mega li a:hover{color:var(--gold-2)}
@media(max-width:899px){.foot__grid>div:last-child{grid-column:1/-1}}
@media(max-width:899px){.toolbar__count{order:-1;flex-basis:100%}.sort{margin-left:auto}.sort select{height:40px}.filter-btn{min-height:40px}}

/* ===== Mobile fixes (v2) ===== */
/* Header: the 1fr/auto/1fr grid made each side column at least as wide as its
   widest content, so wordmark + 2 side columns needed ~383px. Let the sides size
   to their content and give the wordmark a fluid size on narrow phones. */
@media(max-width:899px){
  .hdr__row{grid-template-columns:auto minmax(0,1fr) auto;column-gap:4px}
  .brand{justify-self:center;min-height:44px;min-width:0;gap:10px}
  .brand__name{font-size:clamp(12px,4.1vw,16px);letter-spacing:.12em}
  .brand__sub{font-size:11px;letter-spacing:.3em;margin-top:5px}
}
@media(max-width:359px){
  :root{--gut:16px}
  .hdr__row{column-gap:0}
  .icon-btn{width:40px;height:40px}
  .hdr__row .icon-btn{width:42px;height:44px;border-radius:0}
  .hdr__row .brand>img{display:none}
  .brand__name{font-size:13px;letter-spacing:.1em}
  .brand__sub{letter-spacing:.24em}
}
@media(max-width:899px){
  /* iOS zooms into any control under 16px: keep real text controls at 16px+ */
  .sort select,.qty input,.fcheck input,.locpick input,.chip input,
  .field input,.field select,.field textarea{font-size:16px}
  /* tap targets */
  .loc__tel{display:flex;align-items:center;min-height:44px;margin:2px 0}
  .loc .btn--sm,.btn--sm{min-height:44px}
  .card__title a{display:block;padding:13px 0;margin:-13px 0}
  .crumbs a{display:inline-block;padding:13px 2px;margin:-13px -2px}
  .link-arrow{display:inline-block;padding:13px 0 17px;margin:-13px 0 -13px;border-bottom:0;background:linear-gradient(currentColor,currentColor) no-repeat 0 calc(100% - 13px)/100% 1px}
  .foot li a{padding:11px 0}
  .tag button{width:36px;height:36px}
  .tag{padding-right:4px}
  .link-btn{min-height:44px;padding:0 4px}
  .bag-item .link-btn{margin:-8px 0}
  .qty button{width:44px;height:44px}
  .qty input{width:40px;height:44px}
  .filter-btn,.sort select{min-height:44px;height:44px}
  /* small print */
  .announce{font-size:11px}
  .card__badge,.hero__tag span{font-size:11px}
}
@media(max-width:480px){.announce{font-size:11px;letter-spacing:.12em}}
/* Root cause of the 383px overflow: single-column grids declared as `1fr` (or the
   implicit `auto` track) have a min-content floor, so nowrap buttons / letter-spaced
   labels / the 4:5 art inside widened the whole column past the viewport. */
@media(max-width:899px){
  .hero__in,.story,.salon,.whole__in,.pdp,.contact-grid,.foot__news-in,.shop,.quote-grid,.loc-grid,.gallery,.form,.sidebox,.sec-head,.whole__list,.salon__list{grid-template-columns:minmax(0,1fr)}
  .grid,.foot__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero__in>*,.story>*,.salon>*,.whole__in>*,.pdp>*,.contact-grid>*,.foot__news-in>*,.shop>*,.grid>*,.foot__grid>*,.gallery>*,.form>*{min-width:0}
  .btn{white-space:normal;text-align:center}
}
@media(min-width:640px) and (max-width:899px){.loc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:800px) and (max-width:899px){.quote-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:899px){
  .bag-item{grid-template-columns:76px minmax(0,1fr) auto}
  .bag-item__row{flex-wrap:wrap;gap:6px 12px}
  .filters__foot .btn{min-width:0;padding:0 8px;letter-spacing:.14em}
}
@media(max-width:899px){.hero__tag{white-space:normal;width:max-content;max-width:min(288px,calc(100vw - 32px))}.hero__tag span{letter-spacing:.2em}}
/* final safety net only (real fixes above). `clip` does not create a scroll container, so sticky header/gallery keep working */
@supports(overflow:clip){html,body{overflow-x:clip}}

/* ===== Review fixes (v3) ===== */
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none}
input[type=search]::-ms-clear{display:none}
input[type=search]{-webkit-appearance:none;appearance:none;border-radius:0}

/* no-JS fallback */
.noscript{background:var(--black);color:var(--ivory);padding:18px var(--gut);text-align:center;font-size:15px;border-bottom:1px solid rgba(233,201,122,.4)}
.noscript p{margin:0 0 8px}.noscript ul{display:grid;gap:4px}
.noscript a{color:var(--gold-text);text-underline-offset:3px}

/* ordering model made explicit */
.pdp__order{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.45;color:var(--muted);margin:0 0 14px}
.pdp__order .ico{width:16px;height:16px;margin-top:2px;color:var(--gold-deep)}
.buyrow{flex-wrap:wrap}
.buyrow .btn{flex:1 1 170px;white-space:nowrap;min-width:0;padding:0 14px}
.steps{display:flex;gap:6px;margin:0 0 10px;padding:0;list-style:none;font-size:11px;line-height:1.25;color:var(--muted)}
.steps li{flex:1 1 0;display:flex;align-items:center;gap:6px;min-width:0}
.steps b{flex:none;width:18px;height:18px;border-radius:50%;background:var(--black);color:var(--gold-text);font:500 11px/18px var(--sans);text-align:center}
.note--tight{margin:0 0 10px;font-size:12px}
.locpick{margin:0 0 10px}
.locpick legend{margin-bottom:6px}
.locpick legend span{letter-spacing:.04em;text-transform:none;color:var(--muted);font-weight:400;margin-left:6px}
.locpick__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.locpick label>span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:4px 2px;font-size:12.5px}
.drawer__foot{padding:14px 20px calc(14px + env(safe-area-inset-bottom))}
.foot-links{margin-top:4px}
.subtotal{margin-bottom:2px}
@media(max-width:359px){.locpick__grid{gap:4px}.locpick label>span{font-size:12px;padding:4px 1px}}
@media(max-height:700px){.note--tight{display:none}}

/* footer WhatsApp updates */
.foot__news{padding:44px 0}
.load-err{grid-column:1/-1;text-align:center;padding:40px 12px}
.best__err{grid-column:1/-1;margin:0;padding:24px 0}

/* active-filter "Clear all" + panel clear: on-brand outline pills */
.clear-pill{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border:1px solid var(--text);border-radius:999px;background:transparent;color:var(--text);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;transition:background .25s,color .25s}
.clear-pill:hover{background:var(--text);color:var(--ivory)}
.clear-all.clear-pill{margin-top:16px}
.filter-btn{gap:8px;background:transparent}
.filter-btn .ico{width:16px;height:16px}

@media(max-width:899px){
  /* product page: title + price + options start in the first screen */
  .pdp{gap:16px;padding-top:12px}
  .gallery__main{aspect-ratio:4/5;height:min(100vw,62vh);width:auto;max-width:100%;margin:0 auto}
  .gallery{justify-items:center}
  .bag-item{grid-template-columns:64px minmax(0,1fr) auto;gap:12px;padding:12px 0}
  .bag-item__row{flex-wrap:nowrap;gap:6px}
  .bag-item .link-btn{letter-spacing:.06em;font-size:11px;padding:0 2px}
  .bag-item__opts{margin-bottom:6px}
  .bag-item h4{font-size:13px}
  .pdp__info h1{margin:4px 0 8px}
  .price-big{margin-bottom:8px}
  .pdp__desc{margin-bottom:16px}
  .opt{margin-bottom:16px}
  .crumbs{padding-top:12px}
  .sticky-add .btn{white-space:nowrap;letter-spacing:.14em;padding:0 12px}
  /* shop: compact top */
  .phero--shop{padding:16px 0 14px}
  .phero--shop .orn,.phero--shop #shop-sub{display:none}
  .phero--shop .eyebrow{margin-bottom:4px;font-size:11px}
  .phero--shop h1{font-size:clamp(24px,7vw,30px)}
  .shop{padding-top:12px}
  .toolbar{flex-wrap:nowrap;gap:8px;padding-bottom:12px;margin-bottom:14px}
  .toolbar__count{order:0;flex:1 1 0;flex-basis:0;min-width:0;text-align:center;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sort{margin-left:0;flex:none}
  .sort>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .sort select{width:134px;text-overflow:ellipsis;padding:0 28px 0 10px;font-size:16px}
  .filter-btn{flex:none;padding:0 14px;letter-spacing:.14em}
  .clear-pill{min-height:44px}
  .tag{min-height:44px}
  .active{margin-bottom:14px}
  /* buttons that must not wrap */
  .hero__cta .btn{white-space:nowrap}
  .foot__news{padding:36px 0}
  .foot__wa{width:100%}
  .drawer__foot .btn--block{min-height:48px}
  .foot-links .link-btn{min-height:36px}
}
@media(max-width:480px){
  .hero__cta .btn{font-size:11.5px;letter-spacing:.1em;padding:0 10px}
  .buyrow .btn{letter-spacing:.07em;padding:0 8px;font-size:12px}
  .foot__wa{letter-spacing:.12em;padding:0 12px}
  .steps{font-size:10.5px}
  .whole__btns .btn{flex:1 1 100%}
}
@media(max-width:359px){
  .toolbar__unit{display:none}
  .sort select{width:112px}
  .filter-btn{padding:0 10px;letter-spacing:.08em}
  .hero__cta{flex-wrap:wrap}.hero__cta .btn{flex:1 1 100%}
}

@media(min-width:900px){.gallery--single{grid-template-columns:minmax(0,1fr)}}
@media(max-width:480px){.buyrow--long .btn{flex-basis:100%}}
@media(max-width:480px){.drawer__foot .btn--block{letter-spacing:.14em;padding:0 10px}}
@media(max-width:359px){.drawer__foot .btn--block{letter-spacing:.08em;font-size:11.5px;gap:8px}}