/* Spa Daniel, the boutique. The main site's own world (IBM Plex Sans Hebrew, the dark ground, violet light and the
   gold that is kept for the name, prices and the one main action), arranged as a store: by the coat, in vitrines of
   dark glass under one warm light, with a workbench for what is made by hand. */

/* ---------- the family: four weights, Hebrew and Latin cut apart ---------- */
@font-face { font-family: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-300-hebrew.woff2) format("woff2"); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-300-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: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-400-hebrew.woff2) format("woff2"); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-400-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: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-500-hebrew.woff2) format("woff2"); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-500-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: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-600-hebrew.woff2) format("woff2"); unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: "IBM Plex Sans Hebrew"; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/IBMPlexSansHebrew-600-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 {
  --bg: #050308;
  --text: #f4f1fa;
  --soft: #cdc5dc;
  --mute: #a69fba;
  --violet: #8e5cff;
  --magenta: #ff4fd8;
  --lilac: #cdbcff;
  --rose: #ffb3c4;
  --line: rgba(255, 255, 255, .1);
  --f: "IBM Plex Sans Hebrew", "Heebo", "Arial Hebrew", system-ui, sans-serif;
  --pad: clamp(16px, 3vw, 48px);
  --gl: max(var(--pad), env(safe-area-inset-left, 0px));
  --gr: max(var(--pad), env(safe-area-inset-right, 0px));
  --ease: cubic-bezier(.16, 1, .3, 1);
  --hdr-h: 58px;
  --hdr-top: calc(12px + env(safe-area-inset-top, 0px));
  --strand: linear-gradient(270deg, #fff, var(--violet) 55%, var(--magenta));
  /* gold: kept for light, the name, prices and the one main action, so it always means something */
  --gold: #e3c48c;
  --gold-hi: #fff1cf;
  --gold-lo: #a77d3c;
  --gold-line: rgba(227, 196, 140, .26);
  --leaf: linear-gradient(100deg, #a77d3c 0%, #e3c48c 22%, #fff3d4 40%, #e8c98e 56%, #b88d4a 76%, #f0d8a6 100%);
  --strand-gold: linear-gradient(270deg, #fff3d4, var(--gold) 55%, var(--gold-lo));
  /* the glass of a vitrine: near black, a warm light from above */
  --vit: radial-gradient(70% 46% at 50% -4%, rgba(255, 226, 170, .13), rgba(255, 226, 170, 0) 72%), linear-gradient(180deg, #0d0812, #050308 86%);
  color-scheme: dark;
}

/* ---------- ground ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); scroll-padding-top: calc(var(--hdr-h) + 32px); scrollbar-gutter: stable; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* a dialog is open (the phone menu, the search, the drawer): the page behind it stays still */
html.is-locked, html.is-locked body { overflow: hidden; }
body { margin: 0; min-height: 100svh; background: var(--bg); color: var(--text); font-family: var(--f); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
/* a light field over the top of every page: violet from the far side, a little gold from where reading starts */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: 100svh; z-index: 0; pointer-events: none; background: radial-gradient(48% 56% at 14% 4%, rgba(142, 92, 255, .14), rgba(142, 92, 255, 0) 70%), radial-gradient(36% 40% at 88% 0%, rgba(227, 196, 140, .07), rgba(227, 196, 140, 0) 70%); }
body::after { content: ""; position: fixed; inset: 0; z-index: 60; pointer-events: none; opacity: .06; mix-blend-mode: overlay; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p, figure, blockquote, dl, dd { margin: 0; }
h1, h2, h3, h4 { font-weight: 500; text-wrap: balance; }
p { text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
img, video, canvas, svg { max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }
::selection { background: rgba(227, 196, 140, .9); color: #1c1307; }
.sr, .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; top: 12px; inset-inline-start: -9999px; z-index: 99; padding: 10px 14px; background: #fff; color: #000; border-radius: 8px; }
.skip:focus { inset-inline-start: 12px; }
bdi[dir="ltr"] { unicode-bidi: isolate; }
.main { position: relative; z-index: 2; display: block; padding-top: calc(var(--hdr-top) + var(--hdr-h) + 14px); min-height: 70svh; }
.main:focus { outline: none; }
.is-entrance .main { padding-top: 0; }
.wrap { width: 100%; max-width: calc(1240px + var(--gl) + var(--gr)); margin-inline: auto; padding-left: var(--gl); padding-right: var(--gr); }
.eyebrow { display: flex; align-items: center; gap: 12px; font-size: 13px; letter-spacing: .06em; color: var(--gold); }
.eyebrow::after { content: ""; width: 26px; height: 1px; background: var(--gold-line); }
.leaf { background: var(--leaf); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- buttons ---------- */
.btn, .woocommerce-MyAccount-content .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 22px; border-radius: 12px; font-weight: 500; font-size: 15.5px; white-space: nowrap; cursor: pointer; border: 0; font-family: inherit; text-decoration: none; transition: box-shadow .4s var(--ease), background .3s, transform .4s var(--ease), opacity .3s; }
.btn:active, .woocommerce-MyAccount-content .button:active { transform: scale(.98); }
.btn--wide { width: 100%; }
.btn--glow, .woocommerce-MyAccount-content button.button[type="submit"] { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, #fbecc6 0%, #e8c98e 52%, #d2a961 100%); color: #1c1307; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -1px 0 rgba(122, 82, 24, .35), 0 0 0 1px rgba(255, 230, 176, .5), 0 6px 26px rgba(214, 168, 90, .34), 0 0 56px rgba(142, 92, 255, .26); }
/* a sheen crosses the gold, from the side where reading starts, when the button is approached */
.btn--glow::after, .woocommerce-MyAccount-content button.button[type="submit"]::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(255deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, .72) 48%, rgba(255, 255, 255, 0) 64%); transform: translateX(110%); transition: transform 0s .9s; pointer-events: none; }
.btn--glow:hover::after, .woocommerce-MyAccount-content button.button[type="submit"]:hover::after { transform: translateX(-110%); transition: transform .9s var(--ease); }
.btn--glow:hover, .woocommerce-MyAccount-content button.button[type="submit"]:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), inset 0 -1px 0 rgba(122, 82, 24, .35), 0 0 0 1px rgba(255, 238, 196, .8), 0 8px 34px rgba(226, 184, 104, .55), 0 0 80px rgba(142, 92, 255, .36); }
.btn--glow:focus-visible, .woocommerce-MyAccount-content button.button[type="submit"]:focus-visible { outline-color: var(--gold-hi); }
.btn--glass, .woocommerce-MyAccount-content .button { color: var(--text); background: rgba(255, 255, 255, .1); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .24); }
.btn--glass:hover, .woocommerce-MyAccount-content .button:hover { background: rgba(255, 255, 255, .17); }
.btn--line { color: var(--soft); background: transparent; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.btn--line:hover { color: var(--text); box-shadow: inset 0 0 0 1px var(--gold-line), 0 0 24px rgba(227, 196, 140, .1); }
.btn[disabled], .woocommerce-MyAccount-content .button:disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }
/* a button that waits for a choice still answers a click: it says what is missing */
.btn.disabled { opacity: .5; cursor: not-allowed; }
.btn .ico { width: 18px; height: 18px; }
.ico { width: 18px; height: 18px; flex: none; }
.ico--out { width: 13px; height: 13px; opacity: .75; }
.ico--back { width: 14px; height: 14px; }
.chev { width: 12px; height: 12px; flex: none; transition: transform .4s var(--ease); }
.icon-btn { all: unset; box-sizing: border-box; cursor: pointer; width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 11px; color: var(--text); background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); transition: background .3s, box-shadow .3s; }
.icon-btn:hover { background: rgba(255, 255, 255, .14); }
.icon-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.icon-btn svg { width: 18px; height: 18px; }

/* chips choose a coat, pills choose a department; the one that is chosen takes the gold */
.chip, .pill, .woocommerce-MyAccount-navigation a { display: inline-flex; align-items: center; gap: 8px; flex: none; min-height: 38px; padding: 6px 15px; border-radius: 999px; font-size: 14px; line-height: 1.4; white-space: nowrap; color: var(--soft); background: rgba(255, 255, 255, .055); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .15); transition: color .35s var(--ease), background .35s var(--ease), box-shadow .35s var(--ease); }
.chip:hover, .pill:hover, .woocommerce-MyAccount-navigation a:hover { color: var(--text); background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .36); }
.chip.is-on, .pill.is-on, .woocommerce-MyAccount-navigation .is-active a { color: #1c1307; font-weight: 500; background: linear-gradient(180deg, #fbecc6, #e3c48c 60%, #d2a961); box-shadow: 0 0 0 1px rgba(255, 230, 176, .6), 0 6px 22px rgba(214, 168, 90, .28); }
.pill { min-height: 34px; padding: 4px 13px; font-size: 13.5px; border-radius: 10px; }
.pill.is-on { font-weight: 500; }
/* a coat's swatch: its strands of light, in its own colours */
.sw { position: relative; flex: none; width: 18px; height: 18px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25), 0 0 10px rgba(142, 92, 255, .35); overflow: hidden; }
.sw--short { background: radial-gradient(circle at 34% 28%, #ece4ff 0 8%, #b088ff 34%, #6d40e0 80%); }
.sw--double { background: conic-gradient(from 210deg, #8e5cff, #c456ff 25%, #ff4fd8 45%, #f0ce8e 70%, #8e5cff); }
.sw--long { background: repeating-linear-gradient(104deg, #cdbcff 0 2px, #f0ebff 2px 3.5px, #a985ff 3.5px 5.5px); }
.sw--curly { background: radial-gradient(circle at 30% 32%, #ff79e2 0 22%, transparent 24%), radial-gradient(circle at 70% 40%, #f89cac 0 20%, transparent 22%), radial-gradient(circle at 46% 74%, #c456ff 0 22%, transparent 24%), #3a1d48; }
.sw--wire { background: repeating-linear-gradient(58deg, #f0ce8e 0 1.6px, #c08a4c 1.6px 3.2px, #8e5cff 3.2px 4.2px); }
.sw--cat { background: radial-gradient(circle at 50% 36%, #dfe4ff 0 10%, #9a8cff 46%, #5a47e6 86%); }
.chip.is-on .sw { box-shadow: inset 0 0 0 1px rgba(28, 19, 7, .3); }
.badge { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 8px; font-size: 12px; font-weight: 500; line-height: 1; white-space: nowrap; color: var(--gold-hi); background: rgba(8, 5, 12, .66); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .42); }
.badge--out { color: var(--soft); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); }
.badge--sale { color: #1c1307; background: linear-gradient(180deg, #fbecc6, #e3c48c); box-shadow: none; }
.badge--used { color: var(--lilac); box-shadow: inset 0 0 0 1px rgba(205, 188, 255, .4); }

/* ---------- header ---------- */
.hdr { position: fixed; z-index: 40; top: var(--hdr-top); left: 0; right: 0; margin: 0 auto; width: min(1240px, calc(100% - 2 * var(--pad))); height: var(--hdr-h); display: flex; align-items: center; gap: 18px; padding: 0 8px; padding-inline-start: 12px; border-radius: 16px; transition: transform .7s var(--ease); }
/* the glass lives on a layer of its own: a blur on the header itself would stop the menu below from blurring the page */
.hdr::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: rgba(16, 11, 24, .66); -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .16), 0 10px 40px rgba(0, 0, 0, .35); transition: background .4s; pointer-events: none; }
.hdr.is-hidden { transform: translateY(calc(-100% - 24px)); }
.hdr.is-open::before { background: rgba(16, 11, 24, .86); }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: none; }
.brand:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; border-radius: 10px; }
.brand__name { font-weight: 600; font-size: 17px; direction: ltr; unicode-bidi: isolate; white-space: nowrap; background: var(--leaf); background-size: 240% 100%; background-position: 0% 0; -webkit-background-clip: text; background-clip: text; color: transparent; transition: background-position 1.4s var(--ease); }
.brand:hover .brand__name { background-position: 100% 0; }
.brand__sub { padding-inline-start: 11px; border-inline-start: 1px solid var(--gold-line); font-size: 14px; color: var(--soft); white-space: nowrap; }
/* the crest: the logo exactly as drawn, a neon light behind it and a gleam that only touches the logo's own pixels */
.crest { --crest-h: 46px; position: relative; isolation: isolate; flex: none; width: calc(var(--crest-h) * 1.1832); height: var(--crest-h); }
.crest > img { position: absolute; display: block; max-width: none; pointer-events: none; }
.crest__img { inset: 0; width: 100%; height: 100%; }
.crest__light { z-index: -1; top: -30%; left: -30%; width: 160%; height: 160%; clip-path: inset(3.125% 8.51% 1.875% 11.17%); opacity: .5; transition: opacity .7s var(--ease); }
.brand:hover .crest__light { opacity: .95; }
.crest__lit, .ftr__lit { position: absolute; inset: 0; overflow: hidden; pointer-events: none; mix-blend-mode: screen; mix-blend-mode: plus-lighter; }
.crest__lit { -webkit-mask: url(../media/brand/crest-46@2x.webp) center / 100% 100% no-repeat; mask: url(../media/brand/crest-46@2x.webp) center / 100% 100% no-repeat; }
.crest__lit > i, .ftr__lit > i { position: absolute; top: 0; bottom: 0; left: -50%; width: 200%; background: linear-gradient(100deg, rgba(255, 243, 212, 0) 42%, rgba(255, 243, 212, .3) 50%, rgba(255, 243, 212, 0) 58%); transform: translateX(60%); }
@media (min-width: 1000px) {
  .hdr .crest { --crest-h: 50px; }
  .hdr .crest__lit { -webkit-mask-image: url(../media/brand/crest-50@2x.webp); mask-image: url(../media/brand/crest-50@2x.webp); }
}
.nav { display: flex; align-items: center; gap: 2px; margin-inline-start: auto; font-size: 14.5px; color: #cfc8de; }
.nav > a, .nav__btn { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border-radius: 10px; transition: color .25s, background .25s; }
.nav__btn { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border-radius: 10px; cursor: pointer; transition: color .25s, background .25s; }
.nav__btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.nav > a:hover, .nav__btn:hover, .nav__btn[aria-expanded="true"] { color: var(--text); background: rgba(255, 255, 255, .06); }
.nav > a[aria-current="page"] { color: var(--text); box-shadow: inset 0 -1px 0 var(--gold-line); }
.nav__btn[aria-expanded="true"] .chev { transform: rotate(180deg); }
.nav__out { color: var(--mute); }
.hdr__end { display: flex; align-items: center; gap: 8px; }
.cartbtn { position: relative; display: inline-flex; align-items: center; gap: 9px; height: 40px; padding-inline: 13px 9px; border-radius: 11px; font-size: 14.5px; color: var(--text); background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); transition: background .3s, box-shadow .4s var(--ease); }
.cartbtn:hover, .cartbtn[aria-expanded="true"] { background: rgba(255, 255, 255, .13); box-shadow: inset 0 0 0 1px var(--gold-line); }
.cartbtn__n { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 7px; font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; color: #1c1307; background: linear-gradient(180deg, #fbecc6, #e3c48c); box-shadow: 0 0 14px rgba(227, 196, 140, .45); transition: transform .5s var(--ease); }
.cartbtn__n.is-empty { color: var(--mute); background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
.cartbtn.is-bump .cartbtn__n { animation: bump .7s var(--ease); }
@keyframes bump { 30% { transform: scale(1.32); box-shadow: 0 0 26px rgba(255, 236, 196, .9); } }
.menu-btn { all: unset; box-sizing: border-box; cursor: pointer; display: none; align-items: center; gap: 10px; height: 44px; padding: 0 14px; border-radius: 12px; font-size: 15px; color: var(--text); background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16); }
.menu-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.menu-btn__lines { display: grid; gap: 5px; width: 18px; }
.menu-btn__lines i { display: block; height: 1.5px; border-radius: 2px; background: currentColor; }
.menu-btn__lines i:last-child { width: 12px; }

/* the coats menu: the six coats on one side, their strands of light and the salon's advice on the other */
.mega { position: absolute; top: calc(100% + 10px); left: 0; right: 0; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); height: min(420px, calc(100svh - var(--hdr-h) - 52px)); border-radius: 18px; overflow: hidden; background: rgba(14, 10, 22, .93); -webkit-backdrop-filter: blur(28px) saturate(160%); backdrop-filter: blur(28px) saturate(160%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 40px 120px rgba(0, 0, 0, .6), 0 0 120px rgba(142, 92, 255, .2); visibility: hidden; opacity: 0; transform: translateY(-10px) scale(.985); transform-origin: top center; transition: opacity .3s var(--ease), transform .5s var(--ease), visibility 0s .5s; }
.mega.is-open { visibility: visible; opacity: 1; transform: none; transition: opacity .35s var(--ease), transform .55s var(--ease); }
.mega__list { padding: 10px; display: grid; align-content: start; gap: 2px; overflow: auto; border-inline-end: 1px solid var(--line); scrollbar-width: none; }
.mega__list::-webkit-scrollbar { display: none; }
.mega__sec { font-size: 12.5px; color: var(--gold); letter-spacing: .02em; padding: 6px 12px 8px; }
.mrow { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 10px; font-size: 16px; transition: background .25s, box-shadow .25s; }
.mrow__sub { font-size: 12.5px; color: var(--mute); }
.mrow.is-on { background: rgba(142, 92, 255, .18); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .38); }
.mrow:focus-visible { outline-offset: -2px; }
.mrow[aria-current="page"] .mrow__name { text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 6px; }
.mrow--all { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--line); border-radius: 0 0 10px 10px; color: var(--soft); align-items: center; }
.mpv { position: relative; overflow: hidden; background: radial-gradient(64% 90% at 50% 80%, rgba(142, 92, 255, .22), rgba(142, 92, 255, 0) 70%), radial-gradient(40% 50% at 20% 100%, rgba(255, 79, 216, .1), rgba(255, 79, 216, 0) 70%), #07050c; }
.mpv__fur { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.mpv::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(8, 5, 14, .9) 0%, rgba(8, 5, 14, .5) 34%, rgba(8, 5, 14, 0) 62%); }
.mpv__txt { position: absolute; z-index: 2; inset: auto 0 0; height: 100%; }
.mpv__item { position: absolute; inset: auto 0 0; display: grid; gap: 8px; justify-items: start; padding: 18px 24px 22px; opacity: 0; transform: translateY(8px); transition: opacity .45s var(--ease), transform .6s var(--ease); }
.mpv__item.on { opacity: 1; transform: none; }
.mpv__item h3 { font-size: 24px; font-weight: 500; letter-spacing: -.015em; line-height: 1.2; }
.mpv__item p { font-size: 14.5px; color: #e2dcef; line-height: 1.55; max-width: 44ch; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chips span { font-size: 12.5px; line-height: 1.4; padding: 4px 10px; border-radius: 8px; color: #ece5f5; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .3); }

/* ---------- the phone menu ---------- */
.menu { position: fixed; inset: 0; z-index: 80; display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; padding: calc(10px + env(safe-area-inset-top, 0px)) var(--gr) calc(14px + env(safe-area-inset-bottom, 0px)) var(--gl); background: rgba(7, 4, 12, .96); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); }
.menu { opacity: 0; transition: opacity .4s var(--ease); }
.menu.is-open { opacity: 1; }
.menu__body, .menu__foot { translate: 0 14px; transition: translate .7s var(--ease); }
.menu.is-open .menu__body, .menu.is-open .menu__foot { translate: 0 0; }
.menu__top { display: flex; align-items: center; justify-content: space-between; height: 56px; }
.menu__top .icon-btn { width: 44px; height: 44px; border-radius: 12px; }
.menu__search { position: relative; display: flex; align-items: center; margin: 8px 0 4px; }
.menu__search svg { position: absolute; inset-inline-start: 14px; width: 18px; height: 18px; color: var(--mute); pointer-events: none; }
.menu__search input { width: 100%; height: 48px; padding-inline: 44px 14px; border: 0; border-radius: 13px; font-size: 16px; color: var(--text); background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13); outline: none; }
.menu__search input:focus { box-shadow: inset 0 0 0 1.5px var(--violet), 0 0 0 4px rgba(142, 92, 255, .2); }
.menu__body { overflow: auto; overscroll-behavior: contain; padding: 6px 0 18px; }
.menu__link { display: flex; align-items: center; min-height: 58px; font-size: 22px; font-weight: 500; letter-spacing: -.01em; border-bottom: 1px solid var(--line); }
.acc { border-bottom: 1px solid var(--line); }
.acc__h { margin: 0; font: inherit; }
.acc__h button { all: unset; box-sizing: border-box; width: 100%; min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 22px; font-weight: 500; letter-spacing: -.01em; cursor: pointer; }
.acc__h button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 8px; }
.acc__h .chev { width: 16px; height: 16px; color: var(--mute); }
.acc__h button[aria-expanded="true"] .chev { transform: rotate(180deg); }
.acc__p { overflow: hidden; }
.acc__in { display: grid; padding: 0 0 12px; }
.acc__in a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; font-size: 16.5px; color: #e4ddf0; }
.acc__in a[aria-current="page"] { color: #fff; font-weight: 500; }
.acc__in small { color: var(--mute); font-size: 13px; }
.menu__foot { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.menu__foot .btn { height: 50px; border-radius: 14px; }
.menu__fine { grid-column: 1 / -1; margin-top: 4px; font-size: 13.5px; line-height: 1.6; color: var(--mute); }
@media (min-width: 1000px) { .menu { display: none !important; } }

/* ---------- the search (named "seek": WordPress puts the class "search" on the body of every search results page) ---------- */
.seek { position: fixed; inset: 0; z-index: 85; display: grid; align-content: start; justify-items: center; padding: calc(var(--hdr-top) + 4px) var(--gr) 24px var(--gl); }
.seek__scrim { position: absolute; inset: 0; background: rgba(4, 2, 8, .7); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; transition: opacity .4s var(--ease); }
.seek__panel { position: relative; width: min(760px, 100%); display: grid; gap: 14px; padding: 12px; border-radius: 18px; background: rgba(16, 11, 24, .94); -webkit-backdrop-filter: blur(24px) saturate(150%); backdrop-filter: blur(24px) saturate(150%); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .2), 0 40px 120px rgba(0, 0, 0, .6), 0 0 100px rgba(142, 92, 255, .18); opacity: 0; transform: translateY(-12px) scale(.985); transition: opacity .35s var(--ease), transform .55s var(--ease); }
.seek.is-open .seek__scrim, .seek.is-open .seek__panel { opacity: 1; transform: none; }
.seek__row { display: flex; align-items: center; gap: 10px; padding-inline-start: 10px; }
.seek__row > svg { width: 20px; height: 20px; flex: none; color: var(--gold); }
.seek__row input { flex: 1; min-width: 0; height: 50px; border: 0; background: none; font-size: 19px; color: var(--text); outline: none; }
.seek__row input::placeholder { color: var(--mute); }
.seek__row input::-webkit-search-cancel-button { display: none; }
.seek__hint { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 10px 4px; border-top: 1px solid var(--line); font-size: 13px; color: var(--mute); }
.seek__hint span { margin-inline-end: 4px; }
.seek__hint a { padding: 4px 11px; border-radius: 9px; font-size: 13.5px; color: var(--soft); background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); transition: color .25s, box-shadow .25s; }
.seek__hint a:hover { color: var(--text); box-shadow: inset 0 0 0 1px var(--gold-line); }

/* ---------- the cart drawer: it slides in from the far side, the page dims behind it ---------- */
.drawer { position: fixed; inset: 0; z-index: 86; }
.drawer__scrim { position: absolute; inset: 0; background: rgba(4, 2, 8, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .45s var(--ease); }
.drawer__panel { position: absolute; top: 0; bottom: 0; inset-inline-end: 0; width: min(440px, 100%); display: flex; flex-direction: column; padding: calc(14px + env(safe-area-inset-top, 0px)) 20px calc(16px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(180deg, rgba(22, 15, 33, .97), rgba(10, 7, 16, .98)); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); box-shadow: inset -1px 0 0 rgba(227, 196, 140, .18), 30px 0 90px rgba(0, 0, 0, .55); transform: translateX(-104%); transition: transform .65s var(--ease); }
.drawer.is-open .drawer__scrim { opacity: 1; }
.drawer.is-open .drawer__panel { transform: none; }
.drawer__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 52px; }
.drawer__top h2 { font-size: 22px; font-weight: 500; letter-spacing: -.01em; }
.drawer__note { min-height: 0; font-size: 14px; color: var(--gold-hi); }
.drawer__note:not(:empty) { margin: 2px 0 6px; padding: 9px 12px; border-radius: 11px; background: rgba(227, 196, 140, .08); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .3); }
.drawer__note.is-err { color: var(--rose); background: rgba(255, 122, 154, .08); box-shadow: inset 0 0 0 1px rgba(255, 122, 154, .35); }
.drawer .widget_shopping_cart_content { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mc { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; list-style: none; margin: 4px -6px 0; padding: 0 6px; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .2) transparent; }
.mc__item { display: grid; grid-template-columns: 76px minmax(0, 1fr); grid-template-areas: "img txt" "img ctl"; column-gap: 14px; row-gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--line); transition: opacity .3s; }
.mc__item.is-busy { opacity: .45; pointer-events: none; }
.mc__img { grid-area: img; display: block; aspect-ratio: 3 / 4; border-radius: 11px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.mc__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mc__txt { grid-area: txt; display: grid; gap: 3px; align-content: start; }
.mc__name { font-size: 15.5px; line-height: 1.4; }
.mc__name:hover { text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.mc__price { color: var(--gold); font-size: 15px; font-weight: 500; }
.mc__ctl { grid-area: ctl; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mc__one { font-size: 13px; color: var(--mute); }
.mc__rm { font-size: 13.5px; color: var(--mute); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .22); text-underline-offset: 4px; padding: 6px 0; }
.mc__rm:hover { color: var(--text); }
.mc__foot { display: grid; gap: 10px; padding-top: 14px; border-top: 1px solid var(--gold-line); }
.mc__sub { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 15px; color: var(--soft); }
.mc__sub b { font-size: 20px; font-weight: 500; color: var(--gold); }
.mc__fine { font-size: 13px; color: var(--mute); }
.mc__btns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 10px; margin-top: 4px; }
.mc__btns .btn { height: 50px; border-radius: 13px; padding: 0 12px; }
.mc__empty { flex: 1; display: grid; align-content: center; justify-items: center; gap: 18px; text-align: center; font-size: 17px; color: var(--soft); }
.wc-item-meta, dl.variation { display: grid; grid-template-columns: auto 1fr; gap: 0 6px; margin: 0; font-size: 13px; color: var(--mute); }
dl.variation dt, dl.variation dd { margin: 0; }
dl.variation dd p { margin: 0; }
.wc-item-meta { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr; }

/* quantity: a number between a minus and a plus, always read left to right */
.quantity { display: inline-flex; }
.quantity--fixed { display: none; }
.qty { display: inline-flex; align-items: center; height: 48px; padding: 4px; border-radius: 13px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .15); }
.qty__b { all: unset; box-sizing: border-box; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; cursor: pointer; color: var(--soft); transition: background .25s, color .25s; }
.qty__b svg { width: 16px; height: 16px; }
.qty__b:hover { color: var(--text); background: rgba(255, 255, 255, .09); }
.qty__b:focus-visible { outline: 2px solid var(--gold); outline-offset: 0; }
.qty__b[disabled], .qty__b[aria-disabled="true"] { opacity: .35; cursor: default; background: none; }
.qty__in, .qty__n { width: 44px; height: 40px; border: 0; padding: 0; text-align: center; font-size: 17px; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--text); background: none; outline: none; -moz-appearance: textfield; appearance: textfield; display: grid; place-items: center; }
.qty__in::-webkit-outer-spin-button, .qty__in::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty__in:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 8px; }
.qty--sm { height: 40px; padding: 3px; border-radius: 11px; }
.qty--sm .qty__b { width: 34px; height: 34px; border-radius: 9px; }
.qty--sm .qty__n { width: 32px; height: 34px; font-size: 15px; }

/* ---------- footer: a band of light passes over the name on the way down ---------- */
.ftr { position: relative; z-index: 2; overflow: hidden; margin-top: clamp(64px, 12vh, 140px); background: var(--bg); border-top: 1px solid var(--line); padding: clamp(48px, 10vh, 100px) var(--gr) calc(40px + env(safe-area-inset-bottom, 0px)) var(--gl); }
.ftr__in { width: min(1344px, 100%); margin: 0 auto; }
.ftr__mark { direction: ltr; text-align: center; font-weight: 600; font-size: clamp(60px, 15vw, 228px); line-height: .92; letter-spacing: -.05em; background: linear-gradient(100deg, #463a5e 0%, #463a5e 30%, #9a7438 38%, #f0d8a6 44%, #fff6de 48%, #e3c48c 53%, #a77d3c 60%, #463a5e 70%, #463a5e 100%); background-size: 300% 100%; background-position: 50% 0; -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-user-select: none; user-select: none; }
.ftr__crest { position: relative; isolation: isolate; width: 96px; aspect-ratio: 1634 / 1381; margin: 44px auto 0; }
.ftr__crest img { position: absolute; display: block; max-width: none; pointer-events: none; }
.ftr__logo { inset: 0; width: 100%; height: 100%; }
.ftr__rim, .ftr__aura { z-index: -1; top: -30%; left: -30%; width: 160%; height: 160%; opacity: 0; }
.ftr__crest.is-lit .ftr__rim { opacity: .8; }
.ftr__crest.is-lit .ftr__aura { opacity: .5; }
.ftr__crest.is-lit .ftr__lit { -webkit-mask: url(../media/brand/crest-f120@3x.webp) center / 100% 100% no-repeat; mask: url(../media/brand/crest-f120@3x.webp) center / 100% 100% no-repeat; }
@media (min-width: 1000px) { .ftr__crest { width: 120px; margin-top: 56px; } }
.ftr__grid { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(4, minmax(0, 1fr)); gap: 32px 36px; margin-top: clamp(32px, 7vh, 64px); padding-top: 30px; border-top: 1px solid var(--line); font-size: 14.5px; color: var(--mute); }
.ftr__first { display: grid; gap: 18px; align-content: start; justify-items: start; }
.ftr__lead { color: var(--text); font-size: 17px; line-height: 1.5; max-width: 28ch; }
.ftr h2 { margin: 0 0 4px; font-size: 13px; font-weight: 500; color: rgba(166, 159, 186, .8); }
.ftr nav, .ftr__col { display: grid; gap: 9px; align-content: start; justify-items: start; }
.ftr nav a, .ftr__col a { display: inline-flex; align-items: center; gap: 8px; min-height: 24px; }
.ftr__legal > a { display: inline-flex; align-items: center; min-height: 24px; }
.ftr a:hover { color: var(--text); }
.ftr__col a.ftr__mail { flex-direction: column; align-items: flex-start; gap: 1px; }
.ftr__mail small { font-size: 12.5px; color: rgba(166, 159, 186, .8); }
.ftr__nw { white-space: nowrap; }
.ftr__legal { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 40px; padding-top: 22px; border-top: 1px solid var(--line); font-size: 13px; color: rgba(166, 159, 186, .85); }
.ftr__still { display: inline-flex; align-items: center; gap: 9px; margin-inline-start: auto; padding: 6px 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.ftr__still i { position: relative; flex: none; width: 28px; height: 16px; border-radius: 99px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); transition: background .35s var(--ease), box-shadow .35s var(--ease); }
.ftr__still i::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 10px; height: 10px; border-radius: 50%; background: var(--mute); transition: inset-inline-start .35s var(--ease), background .35s var(--ease); }
.ftr__still[aria-pressed="true"] { color: var(--soft); }
.ftr__still[aria-pressed="true"] i { background: rgba(227, 196, 140, .14); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .55); }
.ftr__still[aria-pressed="true"] i::after { inset-inline-start: 15px; background: var(--gold); }
@media (hover: hover) { .ftr__still:hover { color: var(--text); } }

.toast { position: fixed; z-index: 95; left: 50%; bottom: calc(26px + env(safe-area-inset-bottom, 0px)); width: max-content; max-width: min(520px, calc(100% - 32px)); padding: 12px 18px; border-radius: 14px; font-size: 14.5px; line-height: 1.5; text-align: center; color: var(--text); background: rgba(20, 14, 31, .92); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 16px 40px rgba(0, 0, 0, .45); opacity: 0; transform: translate(-50%, 16px); pointer-events: none; transition: opacity .35s, transform .5s var(--ease); }
.toast.on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- the way here ---------- */
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 9px; font-size: 13.5px; color: var(--mute); }
.crumbs a { transition: color .25s; }
.crumbs a:hover { color: var(--text); }
.crumbs span { color: var(--gold-lo); }

/* ---------- the shelves: a title, the coats, the departments ---------- */
.shophead { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(26px, 6vh, 64px) clamp(18px, 3.5vh, 34px); }
.shophead__fur { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; display: block; -webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, .14) 0%, rgba(0, 0, 0, .3) 38%, #000 82%); mask-image: linear-gradient(to left, rgba(0, 0, 0, .14) 0%, rgba(0, 0, 0, .3) 38%, #000 82%); }
.shophead__in { display: grid; gap: 14px; justify-items: start; }
.shophead__title { font-weight: 400; font-size: clamp(38px, min(6vw, 12vh), 82px); line-height: 1.02; letter-spacing: -.028em; max-width: 16ch; }
.shophead__line { max-width: 52ch; font-size: clamp(15.5px, 1.25vw, 18px); line-height: 1.65; color: var(--soft); }
.shophead__salon { font-size: 14px; color: var(--mute); }
.shophead__salon a, .item__salon a { display: inline-flex; align-items: center; gap: 6px; color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 5px; transition: color .25s, text-decoration-color .25s; }
.shophead__salon a:hover, .item__salon a:hover { color: var(--gold-hi); text-decoration-color: var(--gold); }
.shopbar { position: relative; z-index: 3; padding-block: 6px 26px; }
.shopbar__in { display: grid; gap: 14px; }
.filt { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); align-items: center; gap: 12px; }
.filt__h { font-size: 13px; color: var(--mute); }
/* the row scrolls sideways on a phone; its ends fade where more chips wait */
.filt__row { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.shopbar__meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.shopbar__n { font-size: 14px; color: var(--mute); font-variant-numeric: tabular-nums; }
.sort { position: relative; }
.sort__btn { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 12px; border-radius: 10px; cursor: pointer; font-size: 14px; color: var(--soft); transition: background .25s, color .25s; }
.sort__btn:hover, .sort__btn[aria-expanded="true"] { color: var(--text); background: rgba(255, 255, 255, .06); }
.sort__btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.sort__k { color: var(--mute); }
.sort__btn[aria-expanded="true"] .chev { transform: rotate(180deg); }
.sort__list { list-style: none; display: grid; gap: 2px; min-width: 220px; padding: 6px; border-radius: 14px; background: rgba(16, 11, 24, .96); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 24px 60px rgba(0, 0, 0, .55); }
.js .sort__list { position: absolute; z-index: 5; top: calc(100% + 6px); inset-inline-end: 0; visibility: hidden; opacity: 0; transform: translateY(-6px); transition: opacity .25s var(--ease), transform .4s var(--ease), visibility 0s .4s; }
.js .sort.is-open .sort__list { visibility: visible; opacity: 1; transform: none; transition: opacity .25s var(--ease), transform .4s var(--ease); }
.sort__list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 9px; font-size: 14.5px; color: var(--soft); }
.sort__list a:hover { color: var(--text); background: rgba(255, 255, 255, .06); }
.sort__list a[aria-current="true"] { color: var(--text); }
.sort__list a[aria-current="true"]::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px rgba(227, 196, 140, .8); }

/* ---------- a shelf of vitrines ---------- */
.shop { position: relative; z-index: 2; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 14px; list-style: none; }
.card { min-width: 0; }
.card__link { display: grid; gap: 14px; border-radius: 18px; }
.card__link:focus-visible { outline-offset: 6px; }
.card__vit { position: relative; isolation: isolate; display: block; aspect-ratio: 3 / 4; border-radius: 18px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07), 0 30px 60px -36px rgba(0, 0, 0, .9); transition: box-shadow .6s var(--ease); }
.card__img { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease), opacity .7s var(--ease); }
.card__img--2 { opacity: 0; }
/* as a hand reaches for the card, a warm light comes up from above */
.card__cone { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: conic-gradient(from 180deg at 50% -8%, rgba(255, 232, 190, 0) 0deg 163deg, rgba(255, 232, 190, .16) 172deg 188deg, rgba(255, 232, 190, 0) 197deg 360deg); filter: blur(7px); mix-blend-mode: screen; opacity: 0; transition: opacity .8s var(--ease); }
.card__badges { position: absolute; z-index: 2; top: 12px; inset-inline-start: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.card__txt { display: grid; gap: 3px; padding-inline: 2px; }
.card__dept { font-size: 12.5px; color: var(--mute); letter-spacing: .01em; }
.card__name { font-size: 16px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-wrap: pretty; }
.card__price { margin-top: 3px; font-size: 15.5px; font-weight: 500; color: var(--gold); }
.card__price del { color: var(--mute); font-weight: 400; font-size: 13.5px; margin-inline-end: 6px; }
.card__price ins { text-decoration: none; }
.card__price--quote { font-weight: 400; font-size: 14px; color: var(--soft); }
@media (hover: hover) {
  .card__link:hover .card__vit { box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .3), 0 34px 70px -34px rgba(0, 0, 0, .95), 0 0 60px -20px rgba(227, 196, 140, .18); }
  .card__link:hover .card__cone { opacity: 1; }
  .card__link:hover .card__img { transform: scale(1.035); }
  .card__link:hover .card__img--2 { opacity: 1; }
  .card__link:hover .card__name { text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 5px; }
}
.pages { margin-top: clamp(40px, 7vh, 72px); display: flex; justify-content: center; }
.pages ul { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; list-style: none; }
.pages .page-numbers { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 8px; border-radius: 12px; font-size: 15px; font-variant-numeric: tabular-nums; color: var(--soft); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); transition: color .25s, box-shadow .25s, background .25s; }
.pages a.page-numbers:hover { color: var(--text); box-shadow: inset 0 0 0 1px var(--gold-line); }
.pages .page-numbers.current { color: #1c1307; font-weight: 600; background: linear-gradient(180deg, #fbecc6, #e3c48c); box-shadow: none; }
.pages .page-numbers.dots { box-shadow: none; min-width: 20px; }
.pages .next .ico--back { transform: none; }
.pages .prev .ico--back { transform: scaleX(-1); }

/* an empty shelf, said plainly */
.empty { display: grid; justify-items: center; gap: 14px; max-width: 560px; margin: clamp(16px, 4vh, 40px) auto 0; padding: clamp(28px, 5vw, 48px) 24px; text-align: center; border-radius: 26px; background: radial-gradient(60% 50% at 50% 0%, rgba(255, 226, 170, .08), rgba(255, 226, 170, 0) 72%), rgba(255, 255, 255, .02); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07); }
.empty__vit { width: 132px; height: auto; margin-bottom: 6px; opacity: .95; }
.empty__h { font-weight: 400; font-size: clamp(24px, 2.6vw, 32px); line-height: 1.2; letter-spacing: -.015em; }
.empty__p { max-width: 44ch; color: var(--soft); font-size: 16px; line-height: 1.7; }
.empty__go { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }

/* ---------- the vitrine ---------- */
.item__top { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(28px, 4.4vw, 72px); align-items: start; padding-block: clamp(8px, 2vh, 20px) clamp(40px, 8vh, 80px); }
.vit { position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 18px); display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.vit__stage { position: relative; isolation: isolate; width: min(100%, calc((100svh - var(--hdr-top) - var(--hdr-h) - 52px) * .75)); aspect-ratio: 3 / 4; margin-inline: auto; border-radius: 24px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 140px -70px rgba(142, 92, 255, .4); }
.vit__cone { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: conic-gradient(from 180deg at 50% -7%, rgba(255, 232, 190, 0) 0deg 164deg, rgba(255, 232, 190, .1) 173deg 187deg, rgba(255, 232, 190, 0) 196deg 360deg); filter: blur(8px); mix-blend-mode: screen; }
.vit__track { position: absolute; inset: 0; z-index: 1; display: flex; list-style: none; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.vit__track::-webkit-scrollbar { display: none; }
.vit__slide { flex: 0 0 100%; height: 100%; scroll-snap-align: center; scroll-snap-stop: always; }
.vit__zoom { all: unset; box-sizing: border-box; display: block; width: 100%; height: 100%; cursor: zoom-in; }
.vit__zoom:focus-visible { outline: 2px solid var(--gold); outline-offset: -4px; border-radius: 22px; }
.vit__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vit__none { position: absolute; inset: 0; display: grid; place-items: center; }
.vit__none .vit__img { width: 56%; height: auto; object-fit: contain; opacity: .9; }
.vit__shelf { display: none; }
.vit__none ~ .vit__shelf { display: block; position: absolute; z-index: 2; inset-inline: 9%; bottom: 14%; height: 1px; background: linear-gradient(90deg, rgba(255, 238, 206, 0), rgba(255, 238, 206, .4), rgba(255, 238, 206, 0)); }
.vit__badges { position: absolute; z-index: 3; top: 14px; inset-inline-start: 14px; display: flex; flex-wrap: wrap; gap: 6px; }
.vit__n { position: absolute; z-index: 3; bottom: 14px; inset-inline-end: 14px; display: inline-flex; gap: 4px; padding: 3px 10px; border-radius: 9px; font-size: 12.5px; font-variant-numeric: tabular-nums; direction: ltr; color: var(--soft); background: rgba(8, 5, 12, .62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
.vit__n b { font-weight: 500; color: var(--text); }
.vit__n span { color: var(--mute); }
.vit__thumbs { display: flex; justify-content: center; gap: 8px; }
.vit__th { all: unset; box-sizing: border-box; position: relative; width: 56px; aspect-ratio: 3 / 4; border-radius: 10px; overflow: hidden; cursor: pointer; background: var(--vit); opacity: .55; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); transition: opacity .35s var(--ease), box-shadow .35s var(--ease); }
.vit__th img { display: block; width: 100%; height: 100%; object-fit: cover; }
.vit__th:hover { opacity: .85; }
.vit__th.is-on { opacity: 1; box-shadow: 0 0 0 1.5px var(--gold), 0 0 18px rgba(227, 196, 140, .35); }
.vit__th:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.item__info { display: grid; gap: 18px; align-content: start; padding-top: clamp(0px, 2vh, 20px); }
.item__name { font-weight: 400; font-size: clamp(30px, min(3.4vw, 7vh), 48px); line-height: 1.08; letter-spacing: -.022em; }
.item__price { font-size: 23px; font-weight: 500; color: var(--gold); margin-top: -4px; }
.item__price del { margin-inline-end: 10px; font-size: 17px; font-weight: 400; color: var(--mute); }
.item__price ins { text-decoration: none; }
.item__price--quote { font-size: 17px; font-weight: 400; color: var(--soft); }
.item__lead { display: grid; gap: 10px; max-width: 54ch; font-size: 16.5px; line-height: 1.75; color: var(--soft); }
.item__k { margin-bottom: 8px; font-size: 13px; color: var(--mute); }
.item__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.item__chips .chip { min-height: 34px; padding: 4px 13px; font-size: 13.5px; }
.item__cond { padding: 14px 16px; border-radius: 14px; background: rgba(205, 188, 255, .05); box-shadow: inset 0 0 0 1px rgba(205, 188, 255, .2); }
.item__cond p:last-child { color: var(--soft); font-size: 15.5px; line-height: 1.65; }
.item__buy { padding-top: 18px; border-top: 1px solid var(--line); }
.item__salon { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 14px; color: var(--mute); }

/* the add to cart form: the options, how many, the button */
.buy { display: grid; gap: 16px; }
.buy__row { display: flex; gap: 10px; }
.buy__btn { flex: 1; height: 52px; border-radius: 14px; font-size: 16.5px; }
.buy__btn.is-busy { pointer-events: none; }
.buy__btn.is-busy span { opacity: .55; }
.buy__btn.wc-variation-selection-needed, .buy__btn.disabled { opacity: .55; cursor: not-allowed; }
.buy__msg:empty { display: none; }
.buy__msg { font-size: 14px; color: var(--rose); }
.stock { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 14px; color: var(--soft); }
.stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #9fe0b5; box-shadow: 0 0 10px rgba(159, 224, 181, .7); }
.stock.out-of-stock { color: var(--mute); }
.stock.out-of-stock::before { background: var(--mute); box-shadow: none; }
.stock.available-on-backorder::before { background: var(--gold); box-shadow: 0 0 10px rgba(227, 196, 140, .7); }
.opts { display: grid; gap: 16px; }
.opt { position: relative; margin: 0; padding: 0; border: 0; min-width: 0; }
.opt__h { display: flex; align-items: baseline; gap: 8px; padding: 0; margin-bottom: 10px; font-size: 13.5px; color: var(--mute); }
.opt__v { color: var(--text); }
.opt__pills { display: flex; flex-wrap: wrap; gap: 8px; }
.opt__pill { position: relative; cursor: pointer; }
.opt__pill input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.opt__pill span { display: inline-flex; align-items: center; min-height: 42px; padding: 6px 16px; border-radius: 12px; font-size: 15px; color: var(--soft); background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .15); transition: color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease); }
.opt__pill:hover span { color: var(--text); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .4); }
.opt__pill input:checked + span { color: var(--text); background: rgba(227, 196, 140, .1); box-shadow: inset 0 0 0 1.5px var(--gold), 0 0 20px rgba(227, 196, 140, .18); }
.opt__pill input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 3px; }
.opt__pill input:disabled + span { opacity: .38; text-decoration: line-through; text-decoration-color: rgba(255, 255, 255, .35); cursor: not-allowed; }
/* not with what is already chosen: still in reach, and choosing it clears the rest */
.opt__pill.is-off span { color: var(--mute); text-decoration: line-through; text-decoration-color: rgba(255, 255, 255, .28); }
.opt__pill.is-off:hover span { color: var(--soft); }
.opt__sel { display: none; }
.opt__reset { visibility: hidden; display: inline-block; margin-top: 10px; font-size: 13.5px; color: var(--mute); text-decoration: underline; text-underline-offset: 4px; }
.opt__reset:hover { color: var(--text); }
.single_variation_wrap { display: grid; gap: 14px; }
.woocommerce-variation:empty { display: none; }
.woocommerce-variation-price .price { font-size: 19px; font-weight: 500; color: var(--gold); }
.woocommerce-variation-description { font-size: 14.5px; color: var(--soft); }
.woocommerce-variation-availability .stock { margin: 0; }
.variations_button { display: grid; gap: 12px; }
.facts { list-style: none; display: grid; gap: 9px; font-size: 14.5px; color: var(--soft); }
.facts li { display: flex; align-items: center; gap: 12px; }
.facts__ico { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px rgba(227, 196, 140, .7); }
.facts a { color: var(--soft); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.facts a:hover { color: var(--text); }
/* the details: opened one at a time, each with its own words */
.item__more { display: grid; border-top: 1px solid var(--line); }
.det { border-bottom: 1px solid var(--line); }
.det summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 58px; padding: 12px 0; font-size: 17px; font-weight: 500; }
.det summary::-webkit-details-marker { display: none; }
.det summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 8px; }
.det summary .chev { width: 14px; height: 14px; color: var(--mute); }
.det[open] summary .chev { transform: rotate(180deg); color: var(--gold); }
.det__in { padding: 0 0 20px; }
.det__in.prose { color: var(--soft); }
.det__link { display: inline-flex; margin-top: 12px; font-size: 14.5px; color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.det__links { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.det__links .det__link { margin-top: 0; }
.specs { display: grid; gap: 0; }
.specs > div { display: grid; grid-template-columns: 8em minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px dashed rgba(255, 255, 255, .08); font-size: 15px; }
.specs dt { color: var(--mute); }
.specs dd { color: var(--text); }
.prose { font-size: 16px; line-height: 1.75; max-width: 66ch; }
.prose > * + * { margin-top: 1em; }
.prose a { color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.prose ul, .prose ol { padding-inline-start: 1.3em; }
.prose li + li { margin-top: .35em; }
.prose h2, .prose h3 { color: var(--text); font-weight: 500; line-height: 1.25; letter-spacing: -.012em; }
.prose h2 { font-size: clamp(22px, 2vw, 28px); margin-top: 1.6em; }
.prose h3 { font-size: 19px; margin-top: 1.4em; }
.prose strong { color: var(--text); font-weight: 500; }

/* more from the same shelf */
.more { padding-block: clamp(40px, 8vh, 80px) 0; border-top: 1px solid var(--line); }
.more__h { margin-bottom: clamp(22px, 4vh, 36px); font-weight: 400; font-size: clamp(26px, 3vw, 40px); letter-spacing: -.02em; }

/* the zoom: the photo at its full size, over everything */
.zoom { position: fixed; inset: 0; z-index: 90; display: grid; background: rgba(3, 2, 5, .96); opacity: 0; transition: opacity .35s var(--ease); touch-action: none; }
.zoom.is-open { opacity: 1; }
.zoom__pane { position: absolute; inset: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: calc(72px + env(safe-area-inset-top, 0px)) clamp(16px, 7vw, 96px) calc(28px + env(safe-area-inset-bottom, 0px)); cursor: zoom-in; }
.zoom__pane.is-in { cursor: zoom-out; }
.zoom__img { flex: none; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; transform-origin: 0 0; transition: transform .45s var(--ease); will-change: transform; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }
.zoom__pane.is-drag .zoom__img { transition: none; }
.zoom__bar { position: absolute; z-index: 2; top: calc(14px + env(safe-area-inset-top, 0px)); inset-inline: var(--gr) var(--gl); display: flex; align-items: center; justify-content: space-between; gap: 12px; pointer-events: none; }
.zoom__bar > * { pointer-events: auto; }
.zoom__n { padding: 4px 12px; border-radius: 10px; font-size: 13.5px; direction: ltr; color: var(--soft); background: rgba(16, 11, 24, .7); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.zoom__go { position: absolute; z-index: 2; top: 50%; translate: 0 -50%; }
.zoom__go--prev { inset-inline-start: var(--gr); }
.zoom__go--next { inset-inline-end: var(--gl); }
.zoom__go svg { width: 18px; height: 18px; }
.zoom__go--next svg { transform: none; }
.zoom__go--prev svg { transform: scaleX(-1); }
.zoom .icon-btn { width: 46px; height: 46px; border-radius: 13px; background: rgba(16, 11, 24, .7); }

/* ---------- the bench: what is made by hand, seen from above ---------- */
.bench { position: relative; padding-block: clamp(56px, 11vh, 130px) 0; }
.bench__head { display: grid; gap: 16px; justify-items: start; }
.bench__h { font-weight: 400; font-size: clamp(32px, 4.2vw, 62px); line-height: 1.06; letter-spacing: -.025em; max-width: 15ch; }
.bench__lead { max-width: 56ch; font-size: clamp(15.5px, 1.25vw, 18px); line-height: 1.78; color: var(--soft); }
/* the frame stays in view while the page runs past it, and the item opens as it goes */
.bench__pin { --fh: calc(100svh - var(--hdr-top) - var(--hdr-h) - 28px); position: relative; height: calc(var(--fh) + max(520px, 105svh)); margin-top: clamp(20px, 4vh, 44px); }
.bench__frame { position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 14px); height: var(--fh); }
.bench__grid { height: 100%; display: grid; grid-template-columns: minmax(250px, .56fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); grid-template-areas: "side cell"; gap: clamp(24px, 4vw, 72px); }
.bench__cell { grid-area: cell; min-height: 0; container-type: size; display: grid; place-items: center; }
.bench__stage { --e: 0; position: relative; width: min(100cqw, 100cqh * var(--ar)); aspect-ratio: var(--ar); }
.bench__view { position: absolute; inset: 0; border-radius: 22px; overflow: hidden; background: #0b0810; box-shadow: 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 140px -70px rgba(142, 92, 255, .38); }
.bench__view::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09); }
/* both photos come from the same place over the bench, so only the things on it change; the view draws back a little as it opens */
.bench__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(calc(1.06 - .06 * var(--e))); }
.bench__img--parts { opacity: var(--e); }
.bench__mark { position: absolute; z-index: 3; top: calc(var(--y) * 100%); left: calc(var(--x) * 100%); display: flex; align-items: center; opacity: 0; pointer-events: none; transition: opacity .5s var(--ease); }
.bench__mark--r { flex-direction: row-reverse; translate: -11px -50%; }
.bench__mark--l { translate: calc(11px - 100%) -50%; }
.bench__mark i { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-style: normal; font-size: 11px; font-weight: 600; line-height: 1; color: #1c1307; background: var(--gold); box-shadow: 0 0 0 3px rgba(227, 196, 140, .2), 0 0 18px rgba(227, 196, 140, .55); font-variant-numeric: tabular-nums; transition: box-shadow .3s; }
.bench__mark s { flex: none; width: 0; height: 1px; background: rgba(227, 196, 140, .7); }
.bench__mark b { display: none; padding: 3px 9px; border-radius: 8px; font-weight: 500; font-size: 12.5px; white-space: nowrap; color: var(--gold-hi); background: rgba(8, 5, 12, .74); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .3); }
.bench__stage.is-roomy .bench__mark s { width: 14px; }
.bench__stage.is-roomy .bench__mark b { display: block; }
.bench__stage.is-open .bench__mark { opacity: 1; pointer-events: auto; transition-delay: calc(var(--i) * 70ms); }
.bench__mark.is-hot i { box-shadow: 0 0 0 5px rgba(227, 196, 140, .32), 0 0 26px rgba(227, 196, 140, .9); }
.bench__side { grid-area: side; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.bench__k { font-size: 13px; letter-spacing: .06em; color: var(--gold); }
.bench__legend { list-style: none; display: grid; }
.bench__legend li { display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: 15.5px; color: var(--mute); border-bottom: 1px solid var(--line); transition: color .5s var(--ease); }
.bench__legend li i { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-style: normal; font-size: 11px; font-weight: 600; line-height: 1; color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold-line); font-variant-numeric: tabular-nums; transition: background .5s var(--ease), color .5s var(--ease), box-shadow .5s; }
.bench__legend li.is-out { color: var(--text); transition-delay: calc(var(--i) * 70ms); }
.bench__legend li.is-out i { color: #1c1307; background: var(--gold); box-shadow: 0 0 14px rgba(227, 196, 140, .45); transition-delay: calc(var(--i) * 70ms); }
.bench__legend li.is-hot { color: var(--gold-hi); }
.bench__scrub { display: grid; gap: 6px; margin-top: 4px; }
.bench__range { --p: 0%; width: 100%; height: 30px; margin: 0; background: transparent; cursor: pointer; -webkit-appearance: none; appearance: none; }
.bench__range::-webkit-slider-runnable-track { height: 2px; border-radius: 2px; background: linear-gradient(to left, var(--gold) var(--p), rgba(255, 255, 255, .16) var(--p)); }
.bench__range::-webkit-slider-thumb { width: 20px; height: 20px; margin-top: -9px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #fff3d4, var(--gold) 58%, var(--gold-lo)); box-shadow: 0 0 0 4px rgba(227, 196, 140, .16), 0 0 20px rgba(227, 196, 140, .5); -webkit-appearance: none; appearance: none; }
.bench__range::-moz-range-track { height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .16); }
.bench__range::-moz-range-progress { height: 2px; border-radius: 2px; background: var(--gold); }
.bench__range::-moz-range-thumb { width: 20px; height: 20px; border: 0; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #fff3d4, var(--gold) 58%, var(--gold-lo)); box-shadow: 0 0 0 4px rgba(227, 196, 140, .16), 0 0 20px rgba(227, 196, 140, .5); }
.bench__range:focus-visible { outline: none; }
.bench__range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 3px #050308, 0 0 0 5px var(--gold); }
.bench__range:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 3px #050308, 0 0 0 5px var(--gold); }
.bench__ends { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; color: var(--mute); }
.bench__hint { display: none; margin-top: 6px; font-size: 13px; color: var(--mute); }
.bench.is-pinned .bench__hint { display: block; }
/* without the script: the parts, numbered, beside their list */
html:not(.js) .bench__pin { height: auto; }
html:not(.js) .bench__frame { position: relative; top: auto; height: min(86svh, 860px); }
html:not(.js) .bench__stage { --e: 1; }
html:not(.js) .bench__mark { opacity: 1; }
html:not(.js) .bench__scrub { display: none; }
/* less motion: the frame does not stay, and the slider alone opens the item */
html.still .bench__pin { height: auto; }
html.still .bench__frame { position: relative; top: auto; height: min(86svh, 860px); }
.bench__choose { display: grid; gap: 26px; padding-top: clamp(56px, 10vh, 120px); scroll-margin-top: calc(var(--hdr-h) + 24px); }
.bench__sub { display: grid; gap: 10px; max-width: 60ch; }
.bench__h3 { font-weight: 400; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.15; letter-spacing: -.015em; }
.bench__sub p { font-size: 16px; line-height: 1.7; color: var(--soft); }
.picks { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(44%, 170px), 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.pick { position: relative; }
.pick__box { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.pick__in { display: grid; gap: 10px; cursor: pointer; }
.pick__ph { position: relative; display: block; aspect-ratio: 1; border-radius: 18px; overflow: hidden; background: #0b0810; box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .9); transition: box-shadow .4s var(--ease); }
.pick__ph::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); transition: box-shadow .35s var(--ease); }
.pick__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.pick__tick { position: absolute; z-index: 1; top: 10px; inset-inline-start: 10px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: transparent; background: rgba(8, 5, 12, .6); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .32); transition: background .3s, color .3s, box-shadow .3s; }
.pick__tick svg { width: 16px; height: 16px; }
.pick__name { font-size: 15px; color: var(--soft); transition: color .3s; }
.pick__box:checked + .pick__in .pick__ph { box-shadow: 0 0 0 4px rgba(227, 196, 140, .14), 0 30px 70px -40px rgba(227, 196, 140, .5); }
.pick__box:checked + .pick__in .pick__ph::after { box-shadow: inset 0 0 0 2px var(--gold); }
.pick__box:checked + .pick__in .pick__tick { color: #1c1307; background: var(--gold); box-shadow: 0 0 16px rgba(227, 196, 140, .6); }
.pick__box:checked + .pick__in .pick__name { color: var(--gold-hi); }
.pick__box:focus-visible + .pick__in .pick__ph { outline: 2px solid var(--gold); outline-offset: 3px; }
@media (hover: hover) {
  .pick__in:hover .pick__img { transform: scale(1.045); }
  .pick__in:hover .pick__name { color: var(--text); }
}
.bench__go { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 15px; color: var(--soft); }
.bench__go a { display: inline-flex; align-items: center; gap: 6px; color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 5px; }
.bench__go .ico--back { width: 14px; height: 14px; rotate: -90deg; }
.bench__make { display: grid; gap: clamp(28px, 5vw, 80px); padding-top: clamp(56px, 10vh, 120px); }
.bench__make--hands { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); align-items: start; }
.bench__way { display: grid; gap: 22px; }
.steps { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 1px; border-radius: 22px; overflow: hidden; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.step { display: grid; align-content: start; gap: 8px; padding: clamp(18px, 2vw, 26px); background: #08060c; }
.step__n { font-size: 12.5px; letter-spacing: .08em; color: var(--gold); font-variant-numeric: tabular-nums; }
.step__h { font-size: 17.5px; font-weight: 500; line-height: 1.3; }
.step p { font-size: 14.5px; line-height: 1.7; color: var(--soft); }
.times { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.times div { display: grid; gap: 4px; align-content: start; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.times dt { font-size: 13px; color: var(--mute); }
.times dd { font-size: 17px; color: var(--gold-hi); }
.times__note { max-width: 70ch; font-size: 13.5px; line-height: 1.7; color: var(--mute); }
.bench__hands { position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 24px); display: grid; gap: 10px; }
.bench__hands-img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 22px; box-shadow: 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 0 1px rgba(255, 255, 255, .08); }
.bench__hands figcaption { font-size: 13px; color: var(--mute); }
.bench__make--solo { justify-items: center; }
.bench__make--solo .bench__hands { position: static; width: min(100%, 480px); }

/* ---------- forms: the quote request, the checkout ---------- */
.quote { padding-block: clamp(48px, 10vh, 110px) 0; scroll-margin-top: calc(var(--hdr-h) + 24px); }
.quote__in { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.quote__intro { display: grid; gap: 14px; justify-items: start; position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 24px); }
.quote__h { font-weight: 400; font-size: clamp(32px, 4vw, 56px); line-height: 1.05; letter-spacing: -.025em; }
.quote__intro > p { max-width: 42ch; color: var(--soft); font-size: 16.5px; line-height: 1.7; }
.quote__wa { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 15px; color: var(--soft); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 5px; }
.quote__wa:hover { color: var(--text); }
.form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; padding: clamp(20px, 3vw, 34px); border-radius: 24px; background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .02)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), inset 0 1px 0 rgba(255, 255, 255, .12), 0 40px 110px rgba(0, 0, 0, .5), 0 0 120px rgba(142, 92, 255, .14); }
.form > .btn { justify-self: start; grid-column: 1 / -1; }
.form > .lawnote, .form__status { grid-column: 1 / -1; }
.field { display: grid; gap: 7px; align-content: start; font-size: 13.5px; color: #d3cce2; }
.field--textarea, .field--email { grid-column: 1 / -1; }
.field__opt { color: var(--mute); }
.field input, .field textarea, .form-row .input-text, .form-row select, .form-row textarea, .coupon input { width: 100%; font: inherit; font-size: 16px; line-height: 1.4; color: var(--text); background: rgba(255, 255, 255, .05); border: 0; border-radius: 12px; padding: 12px 14px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); outline: none; transition: box-shadow .25s, background .25s; }
.field textarea, .form-row textarea { min-height: 112px; resize: vertical; }
.field input:focus, .field textarea:focus, .form-row .input-text:focus, .form-row select:focus, .form-row textarea:focus, .coupon input:focus { background: rgba(255, 255, 255, .07); box-shadow: inset 0 0 0 1.5px var(--violet), 0 0 0 4px rgba(142, 92, 255, .2); }
.field input[dir="ltr"], .form-row input[type="tel"], .form-row input[type="email"] { text-align: right; }
.field input[dir="ltr"]::placeholder { text-align: right; }
.field--trap { position: absolute !important; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__status { padding: 12px 14px; border-radius: 12px; font-size: 15px; line-height: 1.55; outline: none; }
.form__status--ok { color: var(--gold-hi); background: rgba(227, 196, 140, .08); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .4); }
.form__status--err { color: var(--rose); background: rgba(255, 122, 154, .07); box-shadow: inset 0 0 0 1px rgba(255, 122, 154, .38); }
/* the notice the law asks for, beside every button that sends personal details */
.lawnote { padding: 12px 14px; border-radius: 12px; font-size: 13px; line-height: 1.65; color: var(--mute); background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07); }
.lawnote a { color: var(--soft); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- the pages of the store: a title and its text ---------- */
.pagehead { padding-block: clamp(26px, 6vh, 60px) clamp(20px, 4vh, 36px); }
.pagehead__in { display: grid; gap: 12px; justify-items: start; }
.pagehead__title { font-weight: 400; font-size: clamp(36px, min(5.2vw, 11vh), 72px); line-height: 1.04; letter-spacing: -.026em; }
.pagehead__line { max-width: 52ch; color: var(--soft); font-size: clamp(15.5px, 1.2vw, 18px); line-height: 1.65; }
.page__body { padding-bottom: 20px; }
.page__body > .prose { margin-inline: 0; }

/* ---------- WooCommerce's own words in the store's shape: notices ---------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-notices-wrapper { display: grid; gap: 10px; margin-bottom: 22px; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-notice { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 18px; margin: 0 0 18px; padding: 14px 18px; padding-inline-start: 22px; border-radius: 14px; list-style: none; font-size: 15px; line-height: 1.6; color: var(--text); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); outline: none; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { content: ""; position: absolute; inset-block: 12px; inset-inline-start: 10px; width: 2px; border-radius: 2px; background: var(--violet); box-shadow: 0 0 10px rgba(142, 92, 255, .7); }
.woocommerce-message { background: rgba(227, 196, 140, .06); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .32); }
.woocommerce-message::before { background: var(--gold); box-shadow: 0 0 10px rgba(227, 196, 140, .8); }
.woocommerce-error { display: grid; gap: 4px; color: #ffd6df; background: rgba(255, 122, 154, .06); box-shadow: inset 0 0 0 1px rgba(255, 122, 154, .34); }
.woocommerce-error::before { background: #ff7a9a; box-shadow: 0 0 10px rgba(255, 122, 154, .7); }
.woocommerce-error li { list-style: none; }
.woocommerce-message a:not(.button), .woocommerce-info a:not(.button), .woocommerce-error a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.woocommerce-message .button, .woocommerce-info .button { order: 2; display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 10px; font-size: 14px; color: var(--text); background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); }
.woocommerce-message .button:hover, .woocommerce-info .button:hover { background: rgba(255, 255, 255, .16); }

/* ---------- the full cart ---------- */
.is-form .pagehead { padding-bottom: clamp(16px, 3vh, 28px); }
.cartpage { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.lines { list-style: none; display: grid; border-top: 1px solid var(--line); }
.line { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto; grid-template-areas: "img txt qty sum" "img rm rm rm"; column-gap: 18px; row-gap: 6px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line); }
.line__img { grid-area: img; align-self: start; display: block; aspect-ratio: 3 / 4; border-radius: 13px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.line__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.line__txt { grid-area: txt; display: grid; gap: 4px; min-width: 0; }
.line__name { font-size: 17px; line-height: 1.4; }
.line__name:hover { text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 5px; }
.line__unit { font-size: 13.5px; color: var(--mute); }
.line__unit small { font-size: inherit; }
.line__qty { grid-area: qty; }
.line__sum { grid-area: sum; min-width: 6em; text-align: end; font-size: 17px; font-weight: 500; color: var(--gold); }
.line__rm { grid-area: rm; justify-self: start; }
.line__rm a { font-size: 13.5px; color: var(--mute); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .22); text-underline-offset: 4px; }
.line__rm a:hover { color: var(--text); }
.cartpage__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; padding-top: 18px; }
.cartpage__update { height: 40px; font-size: 14px; }
.js .cartpage__update { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.coupon summary { list-style: none; cursor: pointer; display: inline-flex; font-size: 14.5px; color: var(--soft); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 5px; }
.coupon summary::-webkit-details-marker { display: none; }
.coupon__row { display: flex; gap: 8px; margin-top: 12px; }
.coupon__row input { width: 200px; text-align: right; }
.coupon__row .btn { height: 46px; font-size: 14px; }
.cartpage__side { position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 18px); }
.cart_totals, .co__side { padding: clamp(20px, 2.4vw, 28px); border-radius: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), inset 0 1px 0 rgba(255, 255, 255, .1), 0 40px 100px -50px rgba(0, 0, 0, .9); }
.cart_totals > h2 { margin-bottom: 8px; font-size: 19px; font-weight: 500; }
.cart_totals > h2, .co__side > h2 { letter-spacing: -.01em; }
/* the totals: plain rows, the last one in gold */
.shop_table { width: 100%; border-collapse: collapse; font-size: 15px; }
.shop_table th, .shop_table td { padding: 12px 0; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); font-weight: 400; }
.shop_table th { color: var(--mute); padding-inline-end: 14px; }
.shop_table td { text-align: end; }
.shop_table tr:last-child th, .shop_table tr:last-child td { border-bottom: 0; }
.shop_table .order-total th { color: var(--text); font-size: 16px; }
.shop_table .order-total td { font-size: 22px; font-weight: 500; color: var(--gold); }
.shop_table .order-total td strong { font-weight: 500; }
.shop_table .includes_tax { display: block; font-size: 12.5px; color: var(--mute); }
.cart_totals .shop_table td[data-title] { text-align: end; }
.wc-proceed-to-checkout { margin-top: 18px; }
.wc-proceed-to-checkout .btn { height: 54px; border-radius: 14px; font-size: 16.5px; }
/* the ways to get the order: each one a card, the chosen one in gold */
.woocommerce-shipping-methods { list-style: none; display: grid; gap: 8px; text-align: start; }
.woocommerce-shipping-methods li { position: relative; }
.woocommerce-shipping-methods input[type="radio"] { position: absolute; opacity: 0; inset-inline-start: 14px; top: 16px; margin: 0; }
.woocommerce-shipping-methods label { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 12px 14px; padding-inline-start: 42px; border-radius: 13px; cursor: pointer; font-size: 15px; color: var(--soft); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13); transition: color .3s, background .3s, box-shadow .3s; }
.woocommerce-shipping-methods label::before { content: ""; position: absolute; inset-inline-start: 14px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .35); transition: box-shadow .3s; }
.woocommerce-shipping-methods input:checked + label { color: var(--text); background: rgba(227, 196, 140, .08); box-shadow: inset 0 0 0 1.5px var(--gold); }
.woocommerce-shipping-methods input:checked + label::before { box-shadow: inset 0 0 0 5px var(--gold); }
.woocommerce-shipping-methods input:focus-visible + label { outline: 2px solid var(--gold); outline-offset: 3px; }
.woocommerce-shipping-methods li:only-child label { padding-inline-start: 14px; }
.woocommerce-shipping-methods li:only-child label::before { display: none; }
.woocommerce-shipping-methods .amount { color: var(--gold); font-weight: 500; }
.woocommerce-shipping-totals th { display: none; }
.woocommerce-shipping-totals td { padding-top: 14px; }
.woocommerce-shipping-totals td::before { content: attr(data-title); display: block; margin-bottom: 10px; font-size: 13.5px; color: var(--mute); text-align: start; }
.woocommerce-shipping-destination, .shipping-calculator-button, .woocommerce-shipping-calculator { display: none; }

/* ---------- the checkout ---------- */
.co { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.co__h { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; letter-spacing: -.012em; }
.co__n { display: grid; place-items: center; width: 30px; height: 30px; flex: none; border-radius: 50%; font-size: 13.5px; font-weight: 600; color: var(--gold); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .55), 0 0 16px rgba(227, 196, 140, .18); }
.co__side { position: sticky; top: calc(var(--hdr-top) + var(--hdr-h) + 18px); }
.woocommerce-billing-fields > h3, .woocommerce-additional-fields > h3 { display: none; }
.woocommerce-billing-fields__field-wrapper, .woocommerce-additional-fields__field-wrapper, .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.woocommerce-additional-fields { margin-top: 14px; }
.form-row { display: grid; gap: 7px; align-content: start; grid-column: 1 / -1; margin: 0; font-size: 13.5px; color: #d3cce2; }
.form-row-half, .form-row-first, .form-row-last { grid-column: auto; }
.form-row label { font-size: 13.5px; color: #d3cce2; }
.form-row label .required { color: var(--gold); text-decoration: none; border: 0; }
.form-row label .optional { color: var(--mute); }
.form-row .woocommerce-input-wrapper { display: grid; gap: 6px; }
.form-row .description { font-size: 12.5px; color: var(--mute); }
.form-row.woocommerce-invalid .input-text, .form-row.woocommerce-invalid select { box-shadow: inset 0 0 0 1.5px #ff7a9a; }
.form-row .checkbox, .woocommerce-form__label-for-checkbox { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; color: var(--soft); cursor: pointer; }
.form-row input[type="checkbox"], .woocommerce-form__input-checkbox { flex: none; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--gold); }
.form-row select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%23a69fba' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left 14px center; background-size: 12px; padding-left: 36px; }
.sdb-hidden { display: none !important; }
.woocommerce-checkout-review-order-table thead { display: none; }
.woocommerce-checkout-review-order-table .cart_item td { padding-block: 10px; }
.woocommerce-checkout-review-order-table .product-name { text-align: start; color: var(--text); }
.woocommerce-checkout-review-order-table .product-quantity { font-weight: 400; color: var(--mute); }
.woocommerce-checkout-review-order-table .product-total { color: var(--soft); white-space: nowrap; }
.woocommerce-checkout-review-order-table tfoot th { text-align: start; }
#payment { margin-top: 18px; display: grid; gap: 16px; }
.wc_payment_methods { list-style: none; display: grid; gap: 8px; }
.wc_payment_method { position: relative; border-radius: 13px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13); }
.wc_payment_method > input { position: absolute; opacity: 0; }
.wc_payment_method > label { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 14px; padding-inline-start: 42px; cursor: pointer; font-size: 15px; }
.wc_payment_method > label::before { content: ""; position: absolute; inset-inline-start: 14px; top: 18px; width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .35); transition: box-shadow .3s; }
.wc_payment_method > input:checked + label::before { box-shadow: inset 0 0 0 5px var(--gold); }
.wc_payment_method > input:focus-visible + label { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 12px; }
.wc_payment_method:only-child > label { padding-inline-start: 14px; }
.wc_payment_method:only-child > label::before { display: none; }
.wc_payment_method img { max-height: 24px; width: auto; }
.payment_box { padding: 0 14px 14px; font-size: 14px; color: var(--soft); }
.payment_box p { margin: 0; }
.wc_payment_methods .woocommerce-info, .wc_payment_methods .woocommerce-notice { margin: 0; font-size: 14.5px; }
.place-order { display: grid; gap: 14px; margin: 0; padding: 0; }
.woocommerce-terms-and-conditions-wrapper { display: grid; gap: 10px; }
.woocommerce-terms-and-conditions-wrapper:empty { display: none; }
.woocommerce-terms-and-conditions { max-height: 220px; overflow: auto; padding: 12px; border-radius: 12px; font-size: 13.5px; color: var(--soft); box-shadow: inset 0 0 0 1px var(--line); }
#place_order { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; width: 100%; height: 56px; border: 0; border-radius: 15px; cursor: pointer; font: inherit; font-size: 17px; font-weight: 500; color: #1c1307; background: linear-gradient(180deg, #fbecc6 0%, #e8c98e 52%, #d2a961 100%); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -1px 0 rgba(122, 82, 24, .35), 0 0 0 1px rgba(255, 230, 176, .5), 0 6px 26px rgba(214, 168, 90, .34), 0 0 56px rgba(142, 92, 255, .26); transition: box-shadow .4s var(--ease), transform .4s var(--ease), opacity .3s; }
#place_order:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), inset 0 -1px 0 rgba(122, 82, 24, .35), 0 0 0 1px rgba(255, 238, 196, .8), 0 8px 34px rgba(226, 184, 104, .55), 0 0 80px rgba(142, 92, 255, .36); }
#place_order:active { transform: scale(.985); }
#place_order:disabled { opacity: .5; cursor: not-allowed; }
.processing, .blockUI.blockOverlay { position: relative; }
.blockUI.blockOverlay { background: rgba(5, 3, 8, .55) !important; opacity: 1 !important; border-radius: inherit; }
.woocommerce-form-coupon-toggle .woocommerce-info { font-size: 14.5px; }
.checkout_coupon { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; margin-bottom: 22px; padding: 16px; border-radius: 16px; box-shadow: inset 0 0 0 1px var(--line); }
.checkout_coupon p { margin: 0; }
.checkout_coupon .button { height: 46px; padding: 0 16px; border: 0; border-radius: 12px; color: var(--text); background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .24); cursor: pointer; }

/* ---------- after the payment ---------- */
.done { display: grid; gap: clamp(28px, 5vh, 48px); max-width: 860px; margin-inline: auto; }
.done__head { position: relative; display: grid; justify-items: center; gap: 16px; padding: clamp(28px, 5vw, 56px) clamp(20px, 4vw, 48px); text-align: center; border-radius: 28px; background: radial-gradient(60% 60% at 50% 0%, rgba(255, 226, 170, .1), rgba(255, 226, 170, 0) 72%), rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .24), 0 40px 110px -50px rgba(0, 0, 0, .9); }
.done__seal { width: 64px; height: 64px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 241, 207, .9) 0 18%, rgba(227, 196, 140, .5) 19% 22%, rgba(227, 196, 140, 0) 23%), radial-gradient(circle, rgba(227, 196, 140, .18), rgba(227, 196, 140, 0) 70%); box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .6), 0 0 40px rgba(227, 196, 140, .25); }
.done__h { font-weight: 400; font-size: clamp(30px, 3.6vw, 48px); letter-spacing: -.024em; line-height: 1.1; }
.done__p { max-width: 52ch; color: var(--soft); font-size: 16.5px; line-height: 1.7; }
.done__p a { color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.done__facts { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; width: 100%; margin-top: 8px; border-radius: 16px; overflow: hidden; background: var(--line); box-shadow: inset 0 0 0 1px var(--line); }
.done__facts li { display: grid; gap: 2px; padding: 14px 12px; background: #0b0710; }
.done__facts span { font-size: 12.5px; color: var(--mute); }
.done__facts b { font-weight: 500; font-size: 15.5px; color: var(--text); }
.done__facts li:nth-child(3) b { color: var(--gold); }
.done__go { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.done__head--fail { box-shadow: inset 0 0 0 1px rgba(255, 122, 154, .3); }
.done__head--fail .woocommerce-notice { justify-content: center; margin: 0; padding: 0; background: none; box-shadow: none; color: var(--soft); }
.woocommerce-order-details, .woocommerce-customer-details { padding: clamp(20px, 3vw, 30px); border-radius: 22px; box-shadow: inset 0 0 0 1px var(--line); }
.woocommerce-order-details__title, .woocommerce-column__title, .woocommerce-customer-details > h2 { margin-bottom: 10px; font-size: 19px; font-weight: 500; }
.order_details thead th { font-size: 13px; }
.order_details thead th:last-child { text-align: end; }
.order_details .product-name { text-align: start; }
.order_details .product-name a { text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; }
.woocommerce-customer-details address { font-style: normal; line-height: 1.8; color: var(--soft); }
.woocommerce-customer-details address p { margin: 0; }
.woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }

/* ---------- the account: the way in, and the pages behind it ---------- */
/* the way in: one card, and beside it a word for whoever came looking for an order */
.gate { display: grid; grid-template-columns: minmax(0, 480px); gap: clamp(24px, 4vw, 56px); align-items: start; }
.gate--note { grid-template-columns: minmax(0, 480px) minmax(0, 380px); }
.gate__card { display: grid; gap: 16px; padding: clamp(22px, 3vw, 34px); border-radius: 24px; background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), inset 0 1px 0 rgba(255, 255, 255, .1), 0 40px 100px -50px rgba(0, 0, 0, .9); }
.gate__h { font-size: clamp(22px, 2vw, 26px); font-weight: 500; line-height: 1.25; letter-spacing: -.012em; }
.gate__p { margin-top: -4px; font-size: 15px; line-height: 1.65; color: var(--soft); }
.gate__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.gate__link { font-size: 14px; color: var(--soft); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 4px; transition: color .25s, text-decoration-color .25s; }
.gate__link:hover { color: var(--text); text-decoration-color: var(--gold-line); }
.gate__card .btn { height: 52px; margin-top: 4px; border-radius: 14px; font-size: 16px; }
.gate__back { text-align: center; }
.gate__note { display: grid; gap: 10px; justify-items: start; padding-block: clamp(22px, 3vw, 34px); padding-inline-start: clamp(22px, 3vw, 44px); border-inline-start: 1px solid var(--line); font-size: 15px; line-height: 1.7; color: var(--soft); }
.gate__nh { font-size: 19px; font-weight: 500; color: var(--text); }
.gate__note .btn { margin-top: 8px; }
/* the eye beside a password shows what was typed */
.password-input { position: relative; display: block; }
.password-input .input-text { padding-inline-end: 52px; }
.show-password-input { --eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); position: absolute; top: 50%; inset-inline-end: 6px; width: 40px; height: 40px; margin-top: -20px; padding: 0; border: 0; border-radius: 10px; background: none; color: var(--mute); cursor: pointer; transition: color .25s; }
.show-password-input::before { content: ""; position: absolute; inset: 10px; background: currentColor; -webkit-mask: var(--eye) center / contain no-repeat; mask: var(--eye) center / contain no-repeat; }
.show-password-input.display-password { --eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7c2 0 3.8.7 5.2 1.6M22 12s-3.6 7-10 7c-2 0-3.8-.7-5.2-1.6'/%3E%3Cpath d='M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3Cpath d='M3 3l18 18'/%3E%3C/svg%3E"); color: var(--gold); }
.show-password-input:hover { color: var(--text); }
.show-password-input:focus-visible { outline: 2px solid var(--gold); outline-offset: -3px; }
.woocommerce-password-strength { margin-top: 8px; padding: 8px 12px; border-radius: 10px; font-size: 13px; color: var(--soft); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); }
.woocommerce-password-strength.short, .woocommerce-password-strength.bad { color: #ffd6df; box-shadow: inset 0 0 0 1px rgba(255, 122, 154, .34); }
.woocommerce-password-strength.good, .woocommerce-password-strength.strong { color: var(--gold-hi); box-shadow: inset 0 0 0 1px var(--gold-line); }
.woocommerce-password-hint { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.6; color: var(--mute); }
/* signed in: the pages of the account as a row of chips, the page below */
.woocommerce-MyAccount-navigation ul { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.woocommerce-MyAccount-navigation-link--customer-logout { margin-inline-start: auto; }
.woocommerce-MyAccount-navigation-link--customer-logout a { background: none; box-shadow: none; color: var(--mute); }
.woocommerce-MyAccount-content { margin-top: clamp(24px, 4vh, 36px); }
.woocommerce-MyAccount-content > h2, .woocommerce-MyAccount-content form > h2 { margin-bottom: 16px; font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; letter-spacing: -.012em; }
.woocommerce-MyAccount-content mark { padding: 0; background: none; font-weight: 500; color: var(--text); }
.acct { display: grid; gap: 20px; }
.acct__hi { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.25; letter-spacing: -.014em; }
.acct__ways { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.acct__way { display: grid; align-content: start; gap: 6px; height: 100%; padding: 20px 22px 22px; border-radius: 20px; background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), inset 0 1px 0 rgba(255, 255, 255, .1); transition: box-shadow .4s var(--ease); }
.acct__way:hover { box-shadow: inset 0 0 0 1px var(--gold-line), inset 0 1px 0 rgba(255, 255, 255, .1), 0 0 34px rgba(227, 196, 140, .08); }
.acct__way:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.acct__wh { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 18px; font-weight: 500; color: var(--text); }
.acct__wh .ico { width: 16px; height: 16px; color: var(--gold); transition: translate .4s var(--ease); }
.acct__way:hover .ico { translate: -4px 0; }
.acct__wp { font-size: 14.5px; line-height: 1.6; color: var(--mute); }
.acct__out { font-size: 14px; color: var(--mute); }
.acct__out a { color: var(--soft); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 4px; }
.acct__out a:hover { color: var(--text); }
/* the orders: a quiet table, each order's number in gold */
.woocommerce-orders-table thead th { padding: 0 0 10px; font-size: 13px; text-align: start; }
.woocommerce-orders-table tbody th, .woocommerce-orders-table tbody td { padding: 14px 0; padding-inline-end: 14px; text-align: start; vertical-align: middle; color: var(--soft); }
.woocommerce-orders-table__cell-order-number a { font-weight: 500; color: var(--gold); }
.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions { padding-inline-end: 0; text-align: end; white-space: nowrap; }
.woocommerce-orders-table .button { height: 36px; padding: 0 14px; border-radius: 10px; font-size: 14px; }
.woocommerce-orders-table .button + .button { margin-inline-start: 6px; }
.woocommerce-MyAccount-content .woocommerce-pagination { display: flex; justify-content: space-between; gap: 10px; margin-top: 18px; }
.woocommerce-MyAccount-content > h2 { margin-top: 30px; }
.woocommerce-MyAccount-content > h2:first-child { margin-top: 0; }
.woocommerce-OrderUpdates { list-style: none; display: grid; gap: 10px; margin-bottom: 22px; }
.woocommerce-OrderUpdate { padding: 14px 16px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); }
.woocommerce-OrderUpdate-meta { font-size: 13px; color: var(--mute); }
.woocommerce-MyAccount-content .woocommerce-order-details, .woocommerce-MyAccount-content .woocommerce-customer-details { margin-top: 22px; }
/* the address: one card, and the way to change it */
.addr { display: grid; gap: 12px; justify-items: start; max-width: 560px; padding: clamp(20px, 3vw, 30px); border-radius: 22px; box-shadow: inset 0 0 0 1px var(--line); }
.addr__h { font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; letter-spacing: -.012em; }
.addr__p { font-size: 15px; line-height: 1.65; color: var(--soft); }
.addr__a { font-style: normal; line-height: 1.8; color: var(--text); }
.addr__none { font-size: 15px; color: var(--mute); }
.addr .btn { margin-top: 6px; }
/* the forms of the account: the address, the details and the password */
.woocommerce-MyAccount-content form { max-width: 760px; }
.woocommerce-address-fields { display: grid; gap: 22px; }
.woocommerce-EditAccountForm { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.woocommerce-EditAccountForm .clear { display: none; }
.woocommerce-EditAccountForm fieldset { grid-column: 1 / -1; display: grid; gap: 14px; min-width: 0; margin: 14px 0 0; padding: 22px 0 0; border: 0; border-top: 1px solid var(--line); }
/* floated, the legend leaves the border and reads as the heading of the part below it */
.woocommerce-EditAccountForm legend { float: left; width: 100%; padding: 0; font-size: 18px; font-weight: 500; color: var(--text); }
.woocommerce-EditAccountForm > p:not(.form-row) { grid-column: 1 / -1; margin-top: 8px; }
#account_display_name_description { font-size: 12.5px; color: var(--mute); }
#account_display_name_description em { font-style: normal; }

/* ---------- the entrance: the night window ---------- */
.win { position: relative; isolation: isolate; height: min(100svh, 980px); min-height: 480px; overflow: hidden; touch-action: pan-y; -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 140px), rgba(0, 0, 0, 0)); mask-image: linear-gradient(180deg, #000 calc(100% - 140px), rgba(0, 0, 0, 0)); background: radial-gradient(30% 50% at 28% 50%, rgba(255, 210, 160, .16), rgba(255, 210, 160, 0) 72%), radial-gradient(16% 34% at 14% 16%, rgba(255, 232, 196, .13), rgba(255, 232, 196, 0) 70%), radial-gradient(16% 34% at 42% 16%, rgba(255, 232, 196, .12), rgba(255, 232, 196, 0) 70%), radial-gradient(46% 60% at 8% 96%, rgba(142, 92, 255, .14), rgba(142, 92, 255, 0) 72%), linear-gradient(180deg, #120c15, #07040a 78%); }
.win__scene { position: absolute; z-index: 1; top: 0; left: 0; display: block; }
.win__fog { position: absolute; z-index: 2; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
/* two faint streaks of reflected light on the glass, and the side where reading starts a little darker for the words */
.win__glass { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: linear-gradient(112deg, rgba(255, 255, 255, 0) 24%, rgba(255, 255, 255, .045) 31%, rgba(255, 255, 255, 0) 38%), linear-gradient(112deg, rgba(255, 255, 255, 0) 44%, rgba(255, 255, 255, .03) 47%, rgba(255, 255, 255, 0) 50%), linear-gradient(to left, rgba(5, 3, 8, .62), rgba(5, 3, 8, .2) 44%, rgba(5, 3, 8, 0) 60%); }
.win__copy { position: absolute; inset: 0; z-index: 6; display: flex; align-items: center; padding-block: calc(var(--hdr-top) + var(--hdr-h) + 12px) 56px; pointer-events: none; }
.win__in { position: relative; width: min(46%, 560px); display: grid; gap: 18px; justify-items: start; pointer-events: auto; }
.win__h { font-weight: 400; font-size: clamp(38px, min(4.7vw, 9.6vh), 76px); line-height: 1.04; letter-spacing: -.026em; }
.win__h .leaf { background-size: 220% 100%; background-position: 0% 0; }
.win__lead { max-width: 42ch; font-size: clamp(15.5px, 1.2vw, 18px); line-height: 1.72; color: var(--soft); }
.win__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.hint { position: absolute; z-index: 7; bottom: 30px; left: var(--gl); display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: rgba(244, 241, 250, .82); pointer-events: none; opacity: 0; transform: translateY(6px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.hint.is-on { opacity: 1; transform: none; }
.hint i { position: relative; flex: none; width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(227, 196, 140, .7); }
.hint i::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--gold); animation: pulse 2.4s var(--ease) infinite; }
@keyframes pulse { 0%, 100% { transform: scale(.7); opacity: .6; } 50% { transform: scale(1); opacity: 1; } }
.hint__touch { display: none; }
@media (hover: none), (pointer: coarse) { .hint__fine { display: none; } .hint__touch { display: inline; } }

/* ---------- the entrance: by the coat ---------- */
.coats { position: relative; padding-block: clamp(64px, 11vh, 132px) clamp(36px, 6vh, 72px); }
.coats__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); gap: clamp(28px, 5vw, 84px); align-items: center; }
.coats__head { display: grid; gap: 18px; justify-items: start; }
.coats__h { font-weight: 400; font-size: clamp(36px, 4.4vw, 68px); line-height: 1.04; letter-spacing: -.026em; max-width: 12ch; }
.coats__line { max-width: 44ch; font-size: clamp(15.5px, 1.2vw, 18px); line-height: 1.72; color: var(--soft); }
.coats__pick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
/* the pelt: the chosen coat as strands of light, parted where a hand passes */
.pelt { position: relative; isolation: isolate; height: clamp(340px, 62vh, 580px); border-radius: 28px; overflow: hidden; touch-action: pan-y; background: radial-gradient(64% 90% at 50% 80%, rgba(142, 92, 255, .22), rgba(142, 92, 255, 0) 70%), radial-gradient(40% 50% at 20% 100%, rgba(255, 79, 216, .1), rgba(255, 79, 216, 0) 70%), #07050c; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 140px -70px rgba(142, 92, 255, .45); }
.pelt__fur { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.pelt::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(8, 5, 14, .86) 0%, rgba(8, 5, 14, .3) 28%, rgba(8, 5, 14, 0) 50%); }
.pelt__name { position: absolute; z-index: 2; inset: auto 0 0; padding: 22px 26px; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.2; letter-spacing: -.012em; opacity: 0; transform: translateY(10px); transition: opacity .5s var(--ease), transform .7s var(--ease); pointer-events: none; }
.pelt__name.on { opacity: 1; transform: none; transition-delay: .25s; }
/* the shelf of the chosen coat */
.cpanel { margin-top: clamp(40px, 7vh, 72px); }
.cpanel__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "k salon" "advice salon"; align-items: end; gap: 6px 32px; padding-bottom: 22px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.cpanel__k { grid-area: k; font-size: 13px; font-weight: 500; letter-spacing: .04em; color: var(--gold); }
.cpanel__advice { grid-area: advice; max-width: 60ch; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; }
.cpanel__salon { grid-area: salon; font-size: 14px; color: var(--mute); }
.cpanel__salon a { display: inline-flex; align-items: center; gap: 6px; color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 5px; transition: color .25s, text-decoration-color .25s; }
.cpanel__salon a:hover { color: var(--gold-hi); text-decoration-color: var(--gold); }
.cpanel__foot { display: flex; justify-content: center; margin-top: clamp(28px, 5vh, 44px); }
.cpanel__empty { display: grid; justify-items: start; gap: 16px; max-width: 640px; padding: 26px 28px; border-radius: 20px; font-size: 16px; line-height: 1.7; color: var(--soft); background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px var(--line); }

/* ---------- the entrance: the departments ---------- */
.depts { padding-block: clamp(56px, 10vh, 120px) clamp(48px, 8vh, 96px); }
.depts__head { display: grid; gap: 14px; justify-items: start; margin-bottom: clamp(26px, 4.5vh, 48px); }
.depts__h { font-weight: 400; font-size: clamp(30px, 3.4vw, 52px); line-height: 1.08; letter-spacing: -.022em; max-width: 18ch; }
.depts__body { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 88px); align-items: start; }
.depts__list { list-style: none; border-top: 1px solid var(--line); }
.drow { position: relative; display: grid; grid-template-columns: 2.4em minmax(0, 1fr) auto 6.5em; align-items: baseline; gap: 18px; padding: clamp(14px, 2.2vh, 20px) 6px; border-bottom: 1px solid var(--line); }
.drow__i { font-size: 12.5px; letter-spacing: .04em; color: var(--gold-lo); font-variant-numeric: tabular-nums; }
.drow__name { font-size: clamp(20px, 2vw, 28px); line-height: 1.25; letter-spacing: -.012em; transition: color .4s var(--ease), translate .6s var(--ease); }
.drow__en { direction: ltr; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.drow__n { font-size: 13.5px; text-align: end; color: var(--mute); font-variant-numeric: tabular-nums; }
.drow__th { display: none; }
/* a line of gold runs under the department a hand rests on, from where reading starts */
.drow::after { content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: 1px; background: linear-gradient(to left, var(--gold), rgba(227, 196, 140, 0)); transform: scaleX(0); transform-origin: right; transition: transform .7s var(--ease); }
.drow:focus-visible { outline-offset: -2px; }
@media (hover: hover) {
  .drow:hover .drow__name, .drow.is-on .drow__name { color: var(--gold-hi); translate: -6px 0; }
  .drow:hover::after, .drow.is-on::after { transform: scaleX(1); }
}
.depts__stage { position: sticky; justify-self: center; width: 100%; top: calc(var(--hdr-top) + var(--hdr-h) + 24px); aspect-ratio: 4 / 5; max-height: calc(100svh - var(--hdr-top) - var(--hdr-h) - 48px); border-radius: 26px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07), 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 140px -70px rgba(142, 92, 255, .35); }
.dvit { position: absolute; inset: 0; margin: 0; opacity: 0; scale: 1.035; transition: opacity .8s var(--ease), scale 1.4s var(--ease); }
.dvit.on { opacity: 1; scale: 1; }
.dvit__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dvit--none .dvit__img { width: 52%; height: auto; margin: 16% auto 0; object-fit: contain; }
.dvit__cone { position: absolute; inset: 0; pointer-events: none; background: conic-gradient(from 180deg at 50% -8%, rgba(255, 232, 190, 0) 0deg 163deg, rgba(255, 232, 190, .14) 172deg 188deg, rgba(255, 232, 190, 0) 197deg 360deg); filter: blur(7px); mix-blend-mode: screen; }
.dvit figcaption { position: absolute; inset: auto 0 0; padding: 56px 24px 22px; font-size: 14.5px; line-height: 1.6; color: #e6e0f0; background: linear-gradient(0deg, rgba(5, 3, 8, .9), rgba(5, 3, 8, 0)); }

/* ---------- the entrance: made by hand ---------- */
.made { padding-block: clamp(56px, 10vh, 120px); }
.made__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: clamp(32px, 6vw, 104px); align-items: center; }
.made__txt { display: grid; gap: 18px; justify-items: start; }
.made__h { font-weight: 400; font-size: clamp(30px, 3.4vw, 52px); line-height: 1.1; letter-spacing: -.022em; max-width: 17ch; }
.made__p { max-width: 52ch; font-size: clamp(15.5px, 1.2vw, 17.5px); line-height: 1.78; color: var(--soft); }
.made__facts { list-style: none; display: grid; gap: 10px; margin-top: 4px; font-size: 15px; color: var(--soft); }
.made__facts li { display: flex; align-items: center; gap: 12px; }
.made__facts li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px rgba(227, 196, 140, .7); }
.made__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.made__vit { position: relative; isolation: isolate; justify-self: center; width: min(100%, 520px); aspect-ratio: 4 / 5; max-height: max(440px, calc(100svh - var(--hdr-top) - var(--hdr-h) - 40px)); border-radius: 28px; overflow: hidden; touch-action: pan-y; background: radial-gradient(36% 56% at 50% 0%, rgba(255, 226, 170, .2), rgba(255, 226, 170, 0) 72%), linear-gradient(180deg, #0b0710, #040206); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 50px 100px -50px rgba(0, 0, 0, .95), 0 0 140px -70px rgba(142, 92, 255, .4); }
.made__vit canvas { position: absolute; display: block; -webkit-box-reflect: below 0 linear-gradient(transparent 58%, rgba(255, 255, 255, .2)); }
.made__cone { position: absolute; inset: 0; pointer-events: none; background: conic-gradient(from 180deg at 50% -6%, rgba(255, 232, 190, 0) 0deg 166deg, rgba(255, 232, 190, .1) 173deg 187deg, rgba(255, 232, 190, 0) 194deg 360deg); filter: blur(8px); }
.made__shelf { position: absolute; inset-inline: 7%; top: 84%; height: 16%; pointer-events: none; background: radial-gradient(60% 100% at 50% 0%, rgba(255, 240, 214, .09), rgba(255, 240, 214, 0) 70%); }
.made__shelf::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, rgba(255, 238, 206, 0), rgba(255, 238, 206, .42) 50%, rgba(255, 238, 206, 0)); }
.made__illus { position: absolute; z-index: 5; bottom: 14px; inset-inline-end: 14px; padding: 2px 9px; border-radius: 7px; font-size: 11.5px; color: var(--mute); background: rgba(5, 3, 8, .66); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }

/* ---------- the entrance: how an order reaches its owner ---------- */
.ways { padding-block: clamp(24px, 4vh, 48px) clamp(64px, 11vh, 128px); }
.ways__list { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1px; border-radius: 22px; overflow: hidden; background: var(--line); box-shadow: inset 0 0 0 1px var(--line); }
.way { display: grid; align-content: start; gap: 8px; padding: 24px 24px 26px; background: #08060c; }
.way .ico { width: 22px; height: 22px; margin-bottom: 6px; color: var(--gold); }
.way .ico--line { width: 27px; height: 27px; margin-block: -2px 4px; margin-inline-start: -2px; }
.way h3 { font-size: 16.5px; font-weight: 500; }
.way p { font-size: 14.5px; line-height: 1.65; color: var(--soft); }
.way a { color: var(--gold); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 4px; transition: color .25s; }
.way a:hover { color: var(--gold-hi); }

/* ---------- arriving: the first second runs on the style sheet ---------- */
.arrive { position: fixed; z-index: 70; top: 0; left: 0; right: 0; height: 1px; pointer-events: none; background: linear-gradient(90deg, rgba(227, 196, 140, 0), var(--gold) 28%, var(--gold-hi) 50%, var(--gold) 72%, rgba(227, 196, 140, 0)); box-shadow: 0 0 12px rgba(240, 198, 120, .8); opacity: 0; }
@keyframes arrive { 0% { transform: scaleX(0); opacity: 1; } 55% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }
@keyframes leaf { from { background-position: 100% 0; } to { background-position: 0% 0; } }
@keyframes sd-up { from { opacity: 0; translate: 0 var(--up, 22px); } }
@keyframes sd-rise { from { translate: 0 var(--rise, 108%); } }
@keyframes sd-fade { from { opacity: 0; } }
@keyframes crest-on { 0% { opacity: 0; } 9% { opacity: .9; } 13% { opacity: .1; } 21% { opacity: .8; } 25% { opacity: .25; } 40% { opacity: 1; } 100% { opacity: .5; } }
@keyframes neon-on { 0% { opacity: 0; } 7% { opacity: .85; } 10% { opacity: .05; } 17% { opacity: .7; } 20% { opacity: .15; } 34% { opacity: 1; } 100% { opacity: .8; } }
@keyframes neon-hum { from { opacity: .8; } to { opacity: .58; } }
@keyframes aura-on { from { opacity: 0; scale: .86; } }
@keyframes crest-sweep { from { transform: translateX(60%); } to { transform: translateX(-60%); } }
/* a title is touched by light once, from where reading starts */
@keyframes gild { from { background-position: 0% 0; } to { background-position: 100% 0; } }
.gild { background-image: linear-gradient(90deg, var(--text) 0%, var(--text) 40%, #e3c48c 46%, #fff3d4 50%, #e3c48c 54%, var(--text) 60%, var(--text) 100%); background-size: 300% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
/* reveals: a card rises a little as it comes into view (the script marks it; without the script all stays put) */
.js .rv { opacity: 0; translate: 0 22px; transition: opacity 1s var(--ease), translate 1.1s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
.js .rv.is-in { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: no-preference) {
  .hdr { --up: -18px; animation: sd-up 1.1s var(--ease) .2s backwards; }
  .brand__name { animation: leaf 2.8s var(--ease) .3s backwards; }
  .crest__light { animation: crest-on 2.4s linear var(--crest-at, .5s) backwards; }
  .crest__lit > i { animation: crest-sweep 1.7s var(--ease) calc(var(--crest-at, .5s) + .55s) backwards; }
  .menu .crest { --crest-at: .2s; }
  .ftr__crest.is-lit .ftr__rim { animation: neon-on 2s linear backwards, neon-hum 3.8s ease-in-out 2s infinite alternate; }
  .ftr__crest.is-lit:not(.is-on) .ftr__rim { animation-play-state: running, paused; }
  .ftr__crest.is-lit .ftr__aura { animation: aura-on 3s var(--ease) .2s backwards; }
  .ftr__crest.is-lit .ftr__lit > i { animation: crest-sweep 2.2s var(--ease) 1.15s backwards; }
  .arrive { animation: arrive 1.9s var(--ease) .1s both; }
  .shophead__title, .pagehead__title, .item__name { animation: sd-up 1.1s var(--ease) .15s backwards; }
  .shophead__line, .shophead__salon, .pagehead__line { animation: sd-up 1.1s var(--ease) .3s backwards; }
  .shophead__title.gild, .pagehead__title.gild { animation: sd-up 1.1s var(--ease) .15s backwards, gild 2.6s cubic-bezier(.45, 0, .2, 1) .7s both; }
  .shopbar { animation: sd-up 1.1s var(--ease) .42s backwards; }
  .vit__stage { animation: sd-fade 1.2s var(--ease) .1s backwards; }
  .win__fog, .win__glass { animation: sd-fade 1.8s var(--ease) backwards; }
  .win__in > * { animation: sd-up 1.2s var(--ease) backwards; }
  .win__eyebrow { animation-delay: .35s; }
  .win__h { animation-delay: .45s; }
  .win__h .leaf { animation: leaf 3.4s var(--ease) .8s backwards; }
  .win__lead { animation-delay: .6s; }
  .win__acts { animation-delay: .75s; }
  .cpanel.is-in .cpanel__head { animation: sd-fade .7s var(--ease) backwards; }
  .cpanel.is-in .card { animation: sd-up .9s var(--ease) backwards; animation-delay: calc(var(--i, 0) * 70ms + 80ms); }
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: none; mix-blend-mode: normal; }
  ::view-transition-new(root) { animation: vt-in .5s var(--ease) both; mix-blend-mode: normal; }
}
@keyframes vt-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .js .rv { opacity: 1; translate: none; transition: none; }
  .card__img, .card__cone, .vit__track { transition: none; scroll-behavior: auto; }
  .hint i::after { animation: none; }
  .hint, .pelt__name, .dvit, .drow__name, .drow::after { transition: none; }
  .bench__pin { height: auto; }
  .bench__frame { position: relative; top: auto; height: min(86svh, 860px); }
  .bench__img { transform: none; }
  .bench__mark, .bench__legend li, .bench__legend li i, .pick__img { transition: none; }
}
/* motion stopped from the footer switch: nothing moves on its own */
html.still::view-transition-old(root), html.still::view-transition-new(root) { animation: none !important; }
html.still *, html.still *::before, html.still *::after { animation-duration: .001ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }

/* ---------- sizes ---------- */
@media (min-width: 760px) {
  .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 22px; }
}
@media (min-width: 1100px) {
  .grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* three to a row between a phone and a wide screen, so a coat's shelf keeps one full row */
@media (min-width: 760px) and (max-width: 1099px) {
  .cpanel__grid > :nth-child(4) { display: none; }
}
@media (max-width: 899px) {
  .coats__top, .made__in { grid-template-columns: minmax(0, 1fr); }
  .pelt { height: clamp(300px, 72vw, 440px); }
  .depts__body { grid-template-columns: minmax(0, 1fr); }
  .depts__stage { display: none; }
  .drow { grid-template-columns: minmax(0, 1fr) auto 52px; align-items: center; gap: 14px; padding: 12px 2px; }
  .drow__i, .drow__en { display: none; }
  .drow__name { font-size: 19px; }
  .drow__th { display: block; width: 52px; aspect-ratio: 3 / 4; border-radius: 10px; overflow: hidden; background: var(--vit); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
  .drow__th img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .made__vit { order: -1; width: min(100%, 460px); }
  /* the bench on a phone: the photo above, the parts and the slider under it, all in the frame that stays */
  .bench__grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; grid-template-areas: "cell" "side"; gap: 14px; }
  .bench__side { justify-content: flex-start; gap: 8px; }
  .bench__k, .bench__hint { display: none !important; }
  .bench__legend { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  .bench__legend li { gap: 8px; padding: 4px 0; font-size: 13.5px; border: 0; }
  .bench__legend li i { width: 18px; height: 18px; font-size: 10px; }
  .bench__mark i { width: 20px; height: 20px; font-size: 10px; }
  .bench__make--hands { grid-template-columns: minmax(0, 1fr); }
  .bench__hands { position: static; }
}
@media (max-width: 999px) {
  .nav { display: none; }
  .menu-btn { display: inline-flex; }
  .hdr { justify-content: space-between; height: 56px; padding-inline-start: 10px; padding-inline-end: 6px; gap: 8px; }
  .hdr__end { gap: 6px; }
  .hdr__search { width: 44px; height: 44px; border-radius: 12px; }
  .cartbtn { height: 44px; border-radius: 12px; }
  .menu-btn__txt { display: none; }
  .menu-btn { width: 44px; padding: 0; justify-content: center; }
  .mega { display: none; }
  .item__top { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .vit { position: relative; top: 0; }
  .vit__stage { width: 100%; }
  .vit__thumbs { display: none; }
  .cartpage, .co, .quote__in { grid-template-columns: minmax(0, 1fr); }
  .cartpage__side, .co__side, .quote__intro { position: static; }
  .ftr { padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px)); }
  .ftr__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ftr__first { grid-column: 1 / -1; }
}
@media (max-width: 759px) {
  .gate--note { grid-template-columns: minmax(0, 1fr); }
  .gate__note { padding: 24px 0 0; border-inline-start: 0; border-top: 1px solid var(--line); }
  .acct__ways { grid-template-columns: minmax(0, 1fr); }
  .woocommerce-EditAccountForm { grid-template-columns: minmax(0, 1fr); }
  /* the orders: each one a short list of what it is */
  .woocommerce-orders-table thead { display: none; }
  .woocommerce-orders-table tbody tr { display: grid; gap: 7px; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .woocommerce-orders-table tbody th, .woocommerce-orders-table tbody td { display: block; padding: 0; border: 0; text-align: end; }
  .woocommerce-orders-table tbody [data-title]::before { content: attr(data-title); float: right; margin-inline-end: 12px; font-size: 13.5px; color: var(--mute); }
  .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions { margin-top: 6px; text-align: start; }
  .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions::before { display: none; }
  /* the night window on a phone: the rack above, the words below it on the dark of the glass */
  .win { height: 100svh; min-height: 600px; max-height: 940px; }
  .win__copy { align-items: flex-end; padding-bottom: 30px; }
  .win__copy::before { content: ""; position: absolute; z-index: -1; inset: auto 0 0; height: 64%; background: linear-gradient(0deg, rgba(5, 3, 8, .96) 0%, rgba(5, 3, 8, .86) 55%, rgba(5, 3, 8, 0)); }
  .win__in { width: 100%; gap: 14px; }
  .win__h { font-size: clamp(34px, 10vw, 44px); }
  .win__lead { font-size: 15.5px; line-height: 1.68; }
  .win .btn { padding: 0 18px; font-size: 15px; }
  .win__glass { background: linear-gradient(112deg, rgba(255, 255, 255, 0) 24%, rgba(255, 255, 255, .045) 31%, rgba(255, 255, 255, 0) 38%); }
  .hint { top: calc(var(--hdr-top) + var(--hdr-h) + 9px); bottom: auto; font-size: 12.5px; }
  .coats__pick .chip { gap: 7px; padding-inline: 12px; font-size: 13.5px; }
  .cpanel__head { grid-template-columns: minmax(0, 1fr); grid-template-areas: "k" "advice" "salon"; }
  .cpanel__salon { margin-top: 6px; }
  .brand__sub { display: none; }
  .crest { --crest-h: 40px; }
  .brand__name { font-size: 16px; }
  .filt { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .filt__row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gr) * -1) calc(var(--gl) * -1); padding-inline: var(--gr) var(--gl); padding-block: 2px; -webkit-mask-image: linear-gradient(to left, transparent 0, #000 var(--gr), #000 calc(100% - var(--gl)), transparent 100%); mask-image: linear-gradient(to left, transparent 0, #000 var(--gr), #000 calc(100% - var(--gl)), transparent 100%); }
  .filt__row::-webkit-scrollbar { display: none; }
  .vit__stage { border-radius: 20px; }
  .line { grid-template-columns: 84px minmax(0, 1fr) auto; grid-template-areas: "img txt txt" "img qty sum" "img rm rm"; row-gap: 10px; column-gap: 14px; }
  .line__sum { min-width: 0; align-self: center; }
  .woocommerce-billing-fields__field-wrapper, .woocommerce-address-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }
  .form-row-half, .form-row-first, .form-row-last { grid-column: 1 / -1; }
  .form { grid-template-columns: minmax(0, 1fr); }
  .done__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .specs > div { grid-template-columns: 6.5em minmax(0, 1fr); }
  .times { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .times div { grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; padding: 12px 14px; }
  .bench__view { border-radius: 18px; }
}
/* a phone held sideways: no room for a frame that stays */
@media (max-height: 480px) {
  .bench__pin { height: auto; }
  .bench__frame { position: relative; top: auto; height: max(340px, 90svh); }
}
@media (max-width: 560px) {
  .ftr__grid { grid-template-columns: minmax(0, 1fr); }
  .ftr__still { margin-inline-start: 0; }
  .mc__btns { grid-template-columns: minmax(0, 1fr); }
  .cartbtn__txt { display: none; }
  .cartbtn { padding-inline: 10px; }
  .cartbtn::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 8.5h13l-1 11h-11zM9 8.5V7a3 3 0 0 1 6 0v1.5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 8.5h13l-1 11h-11zM9 8.5V7a3 3 0 0 1 6 0v1.5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
}
@media (max-height: 600px) and (min-width: 900px) {
  .bench__side { gap: 10px; }
  .bench__legend li { padding: 5px 0; font-size: 14.5px; }
}
@media (max-height: 560px) and (min-width: 1000px) {
  .hdr { --hdr-h: 48px; }
  :root { --hdr-top: calc(8px + env(safe-area-inset-top, 0px)); }
  .hdr .crest { --crest-h: 40px; }
}

/* ---------- a page that is not here ---------- */
.lost { position: relative; display: flex; align-items: center; gap: 10px; max-width: 620px; padding: 6px; padding-inline-start: 44px; border-radius: 16px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13); }
.lost > svg { position: absolute; inset-inline-start: 14px; width: 19px; height: 19px; color: var(--gold); }
.lost input { flex: 1; min-width: 0; height: 46px; border: 0; background: none; font-size: 17px; color: var(--text); outline: none; }
.lost:focus-within { box-shadow: inset 0 0 0 1.5px var(--violet), 0 0 0 4px rgba(142, 92, 255, .2); }
.lost__coats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.lost__go { margin-top: 30px; }
/* beside the ways on, an empty vitrine: its lamp flickers on once, over nothing */
.lostpage { display: grid; grid-template-columns: minmax(0, 1fr); padding-bottom: 20px; }
.lostpage__vit { display: none; }
@media (min-width: 900px) {
  .lostpage { grid-template-columns: minmax(0, 1fr) clamp(220px, 24vw, 320px); grid-template-areas: "head vit" "body vit"; column-gap: clamp(40px, 7vw, 120px); align-items: start; }
  .lostpage__head { grid-area: head; }
  .lostpage__body { grid-area: body; }
  .lostpage__vit { grid-area: vit; align-self: center; position: relative; display: block; margin-top: clamp(26px, 6vh, 60px); border-radius: 26px; overflow: hidden; box-shadow: 0 40px 100px -40px rgba(0, 0, 0, .9), 0 0 120px -30px rgba(227, 196, 140, .2); }
  .lostpage__vit::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); pointer-events: none; }
  .lostpage__vit img { display: block; width: 100%; height: auto; }
}
@media (prefers-reduced-motion: no-preference) {
  .lostpage__vit img { animation: lamp 1.5s steps(1, end) .6s both; }
}
@keyframes lamp { 0% { filter: brightness(.22); } 14% { filter: brightness(1); } 20% { filter: brightness(.3); } 30% { filter: brightness(1.06); } 37% { filter: brightness(.55); } 46%, 100% { filter: brightness(1); } }

/* ---------- before the store opens: the crest, a few words, and the name with its band of light ---------- */
.soon { position: relative; z-index: 2; display: grid; grid-template-rows: 1fr auto; min-height: 100svh; overflow: hidden; padding: 0 var(--gr) 0 var(--gl); }
.soon__in { align-self: center; display: grid; justify-items: center; gap: 16px; width: min(660px, 100%); margin: 0 auto; padding-block: clamp(36px, 8vh, 96px) clamp(20px, 4vh, 44px); text-align: center; }
.soon__crest { width: clamp(108px, 15vh, 156px); margin: 0 0 clamp(6px, 2vh, 18px); }
.soon__eyebrow::before { content: ""; width: 26px; height: 1px; background: var(--gold-line); }
.soon__h { font-weight: 400; font-size: clamp(38px, min(6.2vw, 9.5vh), 78px); line-height: 1.04; letter-spacing: -.028em; text-wrap: balance; }
.soon__p { max-width: 48ch; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.75; color: var(--soft); text-wrap: pretty; }
.soon__go { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 10px; }
.soon__visit { display: grid; gap: 2px; margin-top: 12px; font-size: 14px; line-height: 1.6; color: var(--mute); }
/* the name stands at the foot of the page, cut by its edge, and a band of light crosses it now and then */
.soon__mark { margin: 0 auto; font-size: clamp(64px, 17vw, 260px); translate: 0 16%; }
@media (prefers-reduced-motion: no-preference) {
  .soon__in > * { animation: sd-up 1.2s var(--ease) backwards; }
  .soon__crest { animation: none; }
  .soon__eyebrow { animation-delay: .5s; }
  .soon__h { animation: sd-up 1.2s var(--ease) .6s backwards, gild 2.6s cubic-bezier(.45, 0, .2, 1) 1.3s both; }
  .soon__p { animation-delay: .75s; }
  .soon__go { animation-delay: .9s; }
  .soon__visit { animation-delay: 1.05s; }
  .soon__mark { animation: sd-fade 2s var(--ease) .4s backwards, band 11s cubic-bezier(.45, 0, .2, 1) 2.2s infinite; }
}
@keyframes band { 0% { background-position: 0% 0; } 42%, 100% { background-position: 100% 0; } }