
[data-theme="studio"] :has(>.kit-heart:not([data-inline])){position:relative}
[data-theme="studio"] .kit-heart{position:absolute;inset-block-start:8px;inset-inline-end:8px;z-index:3;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:999px;background:#fff;color:#1a1a1a;box-shadow:0 1px 4px rgb(0 0 0 / .18);cursor:pointer}
[data-theme="studio"] .kit-heart[data-inline]{position:static;flex:none;box-shadow:0 0 0 1px rgb(0 0 0 / .14)}
[data-theme="studio"] .kit-heart[aria-pressed="true"]{color:#d11a2a}
[data-theme="studio"] .kit-heart[aria-pressed="true"] path{fill:currentColor}
[data-theme="studio"] .kit-heart:focus-visible{outline:2px solid currentColor;outline-offset:2px}
[data-theme="studio"] .kit-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
[data-theme="studio"] .kit-title-row>h1{flex:1;min-width:0}

[data-theme="studio"] .st-dock{position:fixed;inset-inline:0;bottom:0;z-index:39;display:flex;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:var(--st-bg);box-shadow:0 -1px 0 var(--st-line,rgb(0 0 0 / .12)),0 -10px 24px rgb(0 0 0 / .08)}
:root:has([data-v2-part="tabBar"]) [data-theme="studio"] .st-dock{bottom:calc(var(--v2-tab-bar-h,64px) + env(safe-area-inset-bottom,0px));padding-bottom:10px}
[data-theme="studio"] .st-dock-price{display:grid;margin:0;font-weight:700;line-height:1.2}
[data-theme="studio"] .st-dock>button{flex:1;width:auto}
@media (min-width:900px){[data-theme="studio"] .st-dock{display:none}}

[data-theme="studio"]{
  --st-bg:var(--theme-background,#F7F3EE);
  --st-ink:var(--theme-ink,#1C1A17);
  --st-accent:var(--theme-accent,#9C4F2E);
  --st-accent-ink:var(--theme-accentInk,var(--st-accent));
  --st-on-accent:var(--theme-onAccent,#FFFFFF);
  --st-radius:calc(var(--theme-radius,10) * 1px);
  --st-density:1;
  --st-space:calc(var(--theme-spacing,88) * var(--st-density) * 1px);
  --st-card-ratio:var(--theme-cardRatio,125);
  --st-card-frame:var(--theme-cardFrame,0);
  --st-sale:var(--theme-sale,#A8321C);
  --st-on-sale:var(--theme-onSale,#FFFFFF);
  --st-button:var(--theme-button,var(--st-ink));
  --st-on-button:var(--theme-onButton,var(--st-bg));
  /* Muted TEXT: 66% ink holds WCAG AA (4.5:1) on the page and on --st-soft in every palette (theme/3c). Faint is for
     decorative glyphs and lines only, never text (about 2.5:1). */
  --st-muted:color-mix(in srgb,var(--st-ink) 66%,var(--st-bg));
  --st-faint:color-mix(in srgb,var(--st-ink) 40%,var(--st-bg));
  --st-line:color-mix(in srgb,var(--st-ink) 12%,transparent);
  --st-soft:color-mix(in srgb,var(--st-ink) 5%,var(--st-bg));
  --st-accent-soft:color-mix(in srgb,var(--st-accent) 12%,var(--st-bg));
  --st-display:var(--theme-font-heading,var(--font-playfair),Georgia,"Times New Roman",serif);
  --st-body:var(--theme-font-body,var(--font-inter),ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif);
  --st-display-weight:500;
  --st-display-tracking:-0.02em;
  background:var(--st-bg);color:var(--st-ink);font-family:var(--st-body);
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
[data-theme="studio"][data-font-pair="modern"] .st-section{--st-display-weight:600;--st-display-tracking:-0.035em}
[data-theme="studio"][data-font-pair="classic"] .st-section{--st-display-weight:600;--st-display-tracking:-0.01em}
/* Arabic: faces come from the font pair; only the weight and tracking are tuned (Arabic script has no letter-spacing). */
[data-theme="studio"]:lang(ar) .st-section{--st-display-weight:700;--st-display-tracking:0}
[data-theme="studio"] *,[data-theme="studio"] *::before,[data-theme="studio"] *::after{box-sizing:border-box}
[data-theme="studio"] :where(h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd){margin:0}
[data-theme="studio"] :where(ul,ol){padding:0;list-style:none}
[data-theme="studio"] :where(a){color:inherit;text-decoration:none}
[data-theme="studio"] :where(img){display:block;max-width:100%;height:auto}
[data-theme="studio"] :where(button){font:inherit;color:inherit}
/* Every icon: a fixed 20px box unless a contextual rule sizes it (attributes too, so it never stretches). */
.st-icon{width:20px;height:20px;flex:none}
/* Touch: no grey tap flash, and a long-press on a card/tile/banner never selects it (the storefront's brand-colored
   ::selection then stayed painted over the image on iOS) nor lifts its image into a callout. */
[data-theme="studio"]{-webkit-tap-highlight-color:transparent}
.st-card,.st-card-slot,.st-tile,.st-banner,.st-split__media,.st-quick-add,.st-collection__banner{-webkit-user-select:none;user-select:none}
:is(.st-card,.st-tile,.st-banner,.st-split__media,.st-collection__banner) img{-webkit-touch-callout:none}
[data-theme="studio"] :focus-visible{outline:2px solid var(--st-accent-ink);outline-offset:3px;border-radius:4px}

.st-section{container-type:inline-size;font-family:var(--st-body);position:relative}
/* page width: a design setting in px (--theme-pageWidth); full-bleed media ignores it */
.st-wrap{width:100%;max-width:calc(var(--theme-pageWidth,1320) * 1px);margin-inline:auto;padding-inline:clamp(16px,4.5cqi,48px)}
.st-pad{padding-block:calc(var(--st-space) * .62)}
@container (min-width:720px){.st-pad{padding-block:var(--st-space)}}

.st-eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--st-accent-ink)}
:lang(ar) .st-eyebrow{letter-spacing:0;font-size:13px}
.st-display{font-family:var(--st-display);font-weight:var(--st-display-weight);letter-spacing:var(--st-display-tracking);line-height:1.04;text-wrap:balance}
[data-theme="studio"]:lang(ar) .st-display{line-height:1.2}
.st-h2{font-size:clamp(26px,5.4cqi,44px)}
.st-lead{color:var(--st-muted);font-size:clamp(15px,2.2cqi,18px);max-width:58ch;text-wrap:pretty}
.st-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin-block-end:clamp(20px,4cqi,40px)}
.st-head__text{display:grid;gap:10px}
.st-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;border-block-end:1px solid currentColor;padding-block-end:2px}
.st-link svg{width:14px;height:14px}
[dir="rtl"] .st-flip{transform:scaleX(-1)}

.st-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border-radius:min(var(--st-radius),24px);
  font-weight:600;font-size:15px;border:1px solid transparent;cursor:pointer;transition:transform .2s ease,background-color .2s ease,color .2s ease}
@media (hover:hover) and (pointer:fine){.st-btn:hover{transform:translateY(-1px)}}
.st-btn--primary{background:var(--st-button);color:var(--st-on-button)}
.st-btn--accent{background:var(--st-accent);color:var(--st-on-accent)}
.st-btn--ghost{border-color:currentColor;background:transparent}
.st-btn--light{background:#FFFFFF;color:#111111}
.st-btn[disabled],.st-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none}
.st-btn svg{width:16px;height:16px}
.st-btn[data-state="added"]{gap:8px}
/* button style and shape (design settings, Contracts v1.8 root attributes): solid | outline, rounded | pill | square.
   Outline keeps the ink for its text (always readable on the page) and the button color for its border. */
[data-design-button-shape="pill"] .st-btn{border-radius:999px}
[data-design-button-shape="square"] .st-btn{border-radius:0}
[data-design-button-style="outline"] .st-btn--primary,[data-design-button-style="outline"] .st-btn--accent{background:transparent;color:var(--st-ink);border-color:var(--st-button);border-width:2px}
[data-design-button-style="outline"] .st-hero[data-variant="overlay"]:not([data-tone="dark"]) .st-btn--primary{background:transparent;color:#FFFFFF;border-color:#FFFFFF}

/* announcement: merchant colors arrive as checked hex custom properties; scroll mode loops two copies of the list */
.st-announce{background:var(--st-announce-bg,var(--st-ink));color:var(--st-announce-ink,var(--st-bg));font-size:13px;letter-spacing:.02em;overflow:hidden}
:lang(ar) .st-announce{letter-spacing:0}
.st-announce__inner{display:flex;justify-content:center;align-items:center;min-height:38px;text-align:center}
.st-announce__list{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 28px}
.st-announce li{display:inline-flex;align-items:center;gap:28px}
.st-announce[data-mode="static"] li+li::before{content:"";width:4px;height:4px;border-radius:999px;background:currentColor;opacity:.5;margin-inline-end:0;order:-1}
.st-announce a{text-decoration:underline;text-underline-offset:3px}
.st-announce__marquee{display:flex;min-height:38px;align-items:center}
.st-announce__track{display:flex;flex:none;animation:st-marquee var(--ann-duration,var(--st-announce-duration,30s)) linear infinite}
.st-announce[data-mode="scroll"] .st-announce__list{flex-wrap:nowrap;padding-inline-end:28px;white-space:nowrap}
.st-announce__marquee:has(:focus-visible) .st-announce__track{animation-play-state:paused}
@media (hover:hover) and (pointer:fine){.st-announce__marquee:hover .st-announce__track{animation-play-state:paused}}
@keyframes st-marquee{to{transform:translateX(var(--ann-shift,-50%))}}
[dir="rtl"] .st-announce__track{animation-name:st-marquee-rtl}
@keyframes st-marquee-rtl{to{transform:translateX(var(--ann-shift,50%))}}
@media (prefers-reduced-motion:reduce){.st-announce__track{animation:none}.st-announce__list[aria-hidden="true"]{display:none}.st-announce[data-mode="scroll"] .st-announce__list{flex-wrap:wrap;white-space:normal;justify-content:center;width:100%}.st-announce__track{flex:1}}
/* M0 motion contract: the store's level on the root (data-motion). "subtle" and "off" never move the bar (the reduced-motion layout). */
:is([data-motion="subtle"],[data-motion="off"]) .st-announce__track{animation:none;flex:1}
:is([data-motion="subtle"],[data-motion="off"]) .st-announce__list[aria-hidden="true"]{display:none}
:is([data-motion="subtle"],[data-motion="off"]) .st-announce[data-mode="scroll"] .st-announce__list{flex-wrap:wrap;white-space:normal;justify-content:center;width:100%}

/* header */
.st-header{background:var(--st-bg);border-block-end:1px solid var(--st-line);position:relative;z-index:20}
/* sticky: always | scroll-up (the host tucks it away while scrolling down: a transform, no layout shift; back on keyboard focus) | off.
   The safe-area inset only matters under viewport-fit=cover (0 otherwise). */
.st-header:is([data-sticky="always"],[data-sticky="scroll-up"]){position:sticky;top:0;padding-block-start:env(safe-area-inset-top,0px)}
.st-header[data-sticky="scroll-up"]{transition:transform .25s ease,box-shadow .25s ease}
.st-header[data-theme-header-hidden]:not(:has(:focus-visible)){transform:translateY(-100%);box-shadow:none}
@media (prefers-reduced-motion:reduce){.st-header[data-sticky="scroll-up"]{transition:none}}
/* The side columns never shrink below their buttons; a long name truncates in the middle column. */
.st-header__bar{display:grid;grid-template-columns:minmax(max-content,1fr) minmax(0,auto) minmax(max-content,1fr);align-items:center;min-height:64px;gap:12px}
.st-logo{font-family:var(--st-display);font-weight:var(--st-display-weight);letter-spacing:var(--st-display-tracking);font-size:22px;line-height:1;display:inline-flex;align-items:center;justify-self:center}
.st-logo{gap:10px;min-width:0;max-width:100%}
/* Theme polish: the store name takes up to two lines at its size; a name too long for two lines at 320 px ("data-long",
   set by the header from its length) is one size smaller on phones; past that the second line ends in an ellipsis. */
.st-header .st-logo span{min-width:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;white-space:normal;overflow-wrap:break-word;text-overflow:ellipsis;padding-block:2px;line-height:1.15;text-align:start}
@media (max-width:767.98px){.st-header .st-logo span[data-long]{font-size:18px}}
.st-logo img{max-height:var(--st-logo-height,36px);width:auto}
.st-header__nav{display:none}
.st-header__nav a{font-size:14px;font-weight:500;color:var(--st-muted);transition:color .2s}
@media (hover:hover) and (pointer:fine){.st-header__nav a:hover{color:var(--st-ink)}}
.st-header__icons{display:flex;justify-content:flex-end;gap:4px}
.st-icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:999px;color:var(--st-ink)}
@media (hover:hover) and (pointer:fine){.st-icon-btn:hover{background:var(--st-soft)}}
.st-icon-btn svg{width:20px;height:20px}
.st-header__drawer svg{width:18px;height:18px}
/* header cart count badge: on the bag's inline-end top corner (logical, so it mirrors in RTL) */
.st-cart-link{position:relative}
.st-cart-count{position:absolute;inset-block-start:2px;inset-inline-end:0;min-width:18px;height:18px;padding-inline:5px;border-radius:999px;
  display:grid;place-items:center;font-size:11px;font-weight:700;line-height:1;background:var(--st-button);color:var(--st-on-button);font-variant-numeric:tabular-nums}
.st-header__menu{justify-self:start}
/* phone menu: a native <dialog> drawer (top layer, so the header's container never clips it) from the start edge */
.st-menu{margin:0;padding:0;border:0;inset-block:0;inset-inline:0 auto;width:min(86vw,360px);max-width:none;height:100dvh;max-height:none;
  background:var(--st-bg);color:var(--st-ink);font-family:var(--st-body);box-shadow:0 0 48px rgba(0,0,0,.2);overscroll-behavior:contain;--st-menu-from:-100%}
[dir="rtl"] .st-menu{--st-menu-from:100%}
.st-menu[open]{display:flex;flex-direction:column;animation:st-menu-in .3s cubic-bezier(.2,.8,.2,1)}
.st-menu::backdrop{background:rgba(0,0,0,.4)}
@keyframes st-menu-in{from{transform:translateX(var(--st-menu-from))}}
@media (prefers-reduced-motion:reduce){.st-menu[open]{animation:none}}
.st-menu__head{display:flex;justify-content:flex-end;padding:12px 12px 0}
.st-header__drawer{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px 24px max(24px,env(safe-area-inset-bottom))}
.st-header__drawer a{display:flex;justify-content:space-between;padding:14px 0;border-block-end:1px solid var(--st-line);font-family:var(--st-display);font-size:20px}
.st-header__drawer li:last-child a{border:0}
.st-header__icon-hide{display:none}
@container (min-width:880px){
  .st-header__bar{grid-template-columns:auto 1fr auto;min-height:76px;gap:32px}
  .st-logo{justify-self:start;font-size:26px}
  .st-header__nav{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:center}
  .st-header__menu{display:none}
  .st-header__icon-hide{display:inline-grid}
  .st-header[data-variant="centered"] .st-header__bar{grid-template-columns:1fr auto 1fr;grid-template-areas:"pad logo icons" "nav nav nav";padding-block:14px 0;row-gap:10px}
  .st-header[data-variant="centered"] .st-logo{grid-area:logo;justify-self:center;font-size:30px}
  .st-header[data-variant="centered"] .st-header__nav{grid-area:nav;padding-block:10px 14px;border-block-start:1px solid var(--st-line)}
  .st-header[data-variant="centered"] .st-header__icons{grid-area:icons}
}

/* hero */
.st-hero{overflow:hidden}
.st-hero__grid{display:grid;gap:28px;align-items:center}
.st-hero__copy{display:grid;gap:18px;align-content:center;justify-items:start}
.st-hero__title{font-size:clamp(40px,11cqi,96px)}
.st-hero__subtitle{color:var(--st-muted);font-size:clamp(16px,2.4cqi,20px);max-width:44ch;text-wrap:pretty}
.st-hero__ctas{display:flex;flex-wrap:wrap;gap:12px;margin-block-start:8px}
.st-hero__media{position:relative;aspect-ratio:4/5;border-radius:var(--st-radius);overflow:hidden;background:var(--st-accent-soft)}
.st-hero__media img,.st-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* A hero video sits over its poster; Save-Data (the host's data-save-data on the root) shows the poster only. */
[data-save-data] .st-hero__video{display:none}
/* M0: an autoplaying video is motion; "subtle" and "off" show the poster only (reduced motion never matches a source). */
:is([data-motion="subtle"],[data-motion="off"]) .st-hero__video{display:none}
.st-hero__art{position:absolute;inset:0;background:
  radial-gradient(120% 90% at 85% 10%,color-mix(in srgb,var(--st-accent) 55%,transparent),transparent 60%),
  radial-gradient(80% 70% at 10% 90%,color-mix(in srgb,var(--st-accent) 30%,var(--st-bg)),transparent 70%),
  linear-gradient(160deg,var(--st-accent-soft),var(--st-soft))}
.st-hero__art::after{content:"";position:absolute;inset:18%;border-radius:999px;border:1px solid color-mix(in srgb,var(--st-ink) 18%,transparent)}
.st-hero__badge{position:absolute;inset-block-end:16px;inset-inline-start:16px;background:color-mix(in srgb,var(--st-bg) 88%,transparent);backdrop-filter:blur(8px);
  border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;display:flex;gap:8px;align-items:center;max-width:calc(100% - 32px)}
.st-hero__badge span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.st-hero__badge svg{width:16px;height:16px;flex:none}
@container (min-width:820px){
  .st-hero[data-variant="split"] .st-hero__grid{grid-template-columns:1.05fr .95fr;gap:clamp(32px,6cqi,96px)}
  .st-hero[data-height="tall"] .st-hero__media{aspect-ratio:4/5;max-height:760px}
  .st-hero[data-height="medium"] .st-hero__media{aspect-ratio:1/1}
  .st-hero[data-height="full"] .st-hero__media{aspect-ratio:3/4}
}
.st-hero[data-variant="centered"] .st-hero__copy{justify-items:center;text-align:center;max-width:920px;margin-inline:auto}
.st-hero[data-variant="centered"] .st-hero__media{aspect-ratio:16/9;margin-block-start:clamp(24px,5cqi,56px)}
.st-hero[data-variant="centered"] .st-hero__subtitle{margin-inline:auto}
.st-hero[data-variant="overlay"]{padding:0}
.st-hero[data-variant="overlay"] .st-hero__overlay{position:relative;min-height:clamp(520px,70cqi,820px);display:grid;align-items:end;color:#FFFFFF;isolation:isolate}
.st-hero[data-height="medium"][data-variant="overlay"] .st-hero__overlay{min-height:clamp(440px,52cqi,620px)}
.st-hero[data-variant="overlay"] .st-hero__media{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;z-index:-1}
.st-hero[data-variant="overlay"] .st-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,calc(var(--st-overlay,.5) * 1.24)),rgba(0,0,0,calc(var(--st-overlay,.5) * .16)) 60%)}
.st-hero[data-variant="overlay"] .st-hero__subtitle{color:rgba(255,255,255,.86)}
.st-hero[data-variant="overlay"] .st-eyebrow{color:#FFFFFF}
.st-hero[data-variant="overlay"] .st-hero__copy{padding-block:clamp(40px,8cqi,96px)}
.st-hero[data-variant="overlay"] .st-btn--primary{background:#FFFFFF;color:#111111}
.st-hero[data-variant="overlay"] .st-btn--ghost{color:#FFFFFF}
/* hero text tone and alignment (merchant choices; "auto" keeps each layout's own colors) */
.st-hero[data-tone="light"] .st-hero__copy{color:#FFFFFF}
.st-hero[data-tone="light"] .st-hero__subtitle{color:rgba(255,255,255,.86)}
.st-hero[data-tone="light"] .st-eyebrow{color:#FFFFFF}
.st-hero[data-tone="dark"] .st-hero__copy{color:var(--st-ink)}
.st-hero[data-tone="dark"] .st-hero__subtitle{color:var(--st-muted)}
.st-hero[data-tone="dark"] .st-eyebrow{color:var(--st-accent)}
.st-hero[data-tone="dark"][data-variant="overlay"] .st-btn--primary{background:var(--st-ink);color:var(--st-bg)}
.st-hero[data-tone="dark"][data-variant="overlay"] .st-btn--ghost{color:var(--st-ink)}
.st-hero[data-tone="dark"][data-variant="overlay"] .st-hero__media::after{background:linear-gradient(to top,color-mix(in srgb,var(--st-bg) calc(var(--st-overlay,.5) * 124%),transparent),color-mix(in srgb,var(--st-bg) calc(var(--st-overlay,.5) * 16%),transparent) 60%)}
/* Contracts v1.20: text over each slide's image (data-ink: the color picked for contrast; data-veil: a light overlay) */
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="light"] :is(.st-hero__copy,.st-eyebrow){color:#FFFFFF}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="light"] .st-hero__subtitle{color:rgba(255,255,255,.86)}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="dark"] :is(.st-hero__copy,.st-eyebrow){color:#111111}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="dark"] .st-hero__subtitle{color:rgba(17,17,17,.82)}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="dark"] .st-btn--primary{background:#111111;color:#FFFFFF}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="dark"] .st-btn--ghost{color:#111111}
[data-design-button-style="outline"] .st-hero[data-variant="overlay"] .st-hero__overlay[data-ink="dark"] .st-btn--primary{background:transparent;color:#111111;border-color:#111111}
.st-hero[data-variant="overlay"] .st-hero__overlay[data-veil="light"] .st-hero__media::after{background:linear-gradient(to top,rgba(255,255,255,calc(var(--st-overlay,.5) * 1.24)),rgba(255,255,255,calc(var(--st-overlay,.5) * .16)) 60%)}
.st-hero[data-align="center"] .st-hero__copy{justify-items:center;text-align:center}
.st-hero[data-align="end"] .st-hero__copy{justify-items:end;text-align:end}
.st-hero[data-align="center"] .st-hero__ctas{justify-content:center}
.st-hero[data-align="end"] .st-hero__ctas{justify-content:flex-end}
/* slideshow: CSS scroll snap, swipe or scroll; no script */
.st-slides{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.st-slides::-webkit-scrollbar{display:none}
.st-slide{scroll-snap-align:start;min-width:0;position:relative;scroll-margin-block-start:96px}
.st-slides,.st-banners[data-variant="slideshow"]{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){.st-slides,.st-banners[data-variant="slideshow"]{scroll-behavior:auto}}
:is([data-motion="subtle"],[data-motion="off"]) :is(.st-slides,.st-banners[data-variant="slideshow"]){scroll-behavior:auto}
/* M0 "off": Studio's whole composition without motion (sheets and menus appear at once, hovers change instantly). */
[data-theme="studio"][data-motion="off"] *,[data-theme="studio"][data-motion="off"] *::before,[data-theme="studio"][data-motion="off"] *::after{animation:none !important;transition:none !important}
.st-dots{display:flex;justify-content:center;gap:4px;padding-block:14px 0}
.st-hero[data-variant="overlay"] .st-dots{padding-block:14px}
.st-dot{display:grid;place-items:center;width:28px;height:28px;border-radius:999px}
.st-dot::before{content:"";width:9px;height:9px;border-radius:999px;background:currentColor;opacity:.35;transition:opacity .2s,transform .2s}
.st-dot:focus-visible::before{opacity:1;transform:scale(1.2)}
@media (hover:hover) and (pointer:fine){.st-dot:hover::before{opacity:1;transform:scale(1.2)}}
.st-dot[aria-current="true"]::before{opacity:1;transform:scale(1.25)}
.st-slide-position{position:absolute;inset-block-start:14px;inset-inline-end:14px;background:color-mix(in srgb,var(--st-bg) 88%,transparent);color:var(--st-ink);
  border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;letter-spacing:.04em;font-variant-numeric:tabular-nums}

/* product cards and grids */
.st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 14px}
.st-grid[data-columns-mobile="1"]{grid-template-columns:minmax(0,1fr)}
@container (min-width:760px){.st-grid,.st-grid[data-columns-mobile="1"]{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 22px}}
@container (min-width:1080px){.st-grid[data-columns="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}.st-grid[data-columns="5"]{grid-template-columns:repeat(5,minmax(0,1fr));gap:36px 18px}}
.st-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,72%);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-block-end:8px;scrollbar-width:thin}
.st-section:has(.st-rail:empty){display:none}
.st-rail>*{scroll-snap-align:start}
@container (min-width:760px){.st-rail{grid-auto-columns:minmax(240px,31%)}}
@container (min-width:1080px){.st-rail{grid-auto-columns:minmax(260px,23.5%)}}
/* The one shared card. Its theme settings are numbers: the image height in % of the width, and the frame as 1/0 (it
   scales the padding, border and tint, so no style query is needed). Positioned, so its screen-reader-only text stays inside
   a rail's scroll box (a sold-out card has no slot around it). */
.st-card{position:relative;display:grid;gap:12px;align-content:start;padding:calc(var(--st-card-frame) * 10px);border-radius:calc(var(--st-radius) + var(--st-card-frame) * 6px);
  border:calc(var(--st-card-frame) * 1px) solid var(--st-line);background:color-mix(in srgb,var(--st-soft) calc(var(--st-card-frame) * 100%),transparent)}
.st-card__body{padding-inline:calc(var(--st-card-frame) * 4px);padding-block-end:calc(var(--st-card-frame) * 6px)}
.st-card__media{position:relative;aspect-ratio:100/var(--st-card-ratio);border-radius:var(--st-radius);overflow:hidden;background:var(--st-soft)}
.st-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s ease,transform .7s ease}
/* photo fit (design setting): contain shows the whole packshot on the soft ground, inset so a bottle never touches the edge;
   the product page gallery and the quick-add sheet follow it */
[data-design-card-image-fit="contain"] :is(.st-card__media,.st-gallery__main,.st-gallery__stack figure,.st-thumb,.st-sheet__media) img{object-fit:contain;padding:7%}
[data-design-card-image-fit="contain"] .st-thumb img{padding:4%}
.st-card__media .st-card__hover{opacity:0}
@media (hover:hover) and (pointer:fine){.st-card:hover .st-card__hover{opacity:1}}
@media (hover:hover) and (pointer:fine){.st-card:hover .st-card__media img:first-child{transform:scale(1.03)}}
.st-card__placeholder{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--st-display);font-size:40px;color:var(--st-faint)}
.st-card__badges{position:absolute;inset-block-start:10px;inset-inline-start:10px;display:flex;gap:6px}
.st-badge{background:var(--st-bg);color:var(--st-ink);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 10px}
:lang(ar) .st-badge{letter-spacing:0}
.st-badge--sale{background:var(--st-sale);color:var(--st-on-sale)}
.st-badge--new{background:var(--st-accent);color:var(--st-on-accent)}
/* color dots: decorative inside the card link (the names are read as text) */
.st-swatches{display:flex;align-items:center;min-height:16px;margin-block:2px}
.st-swatches__dots{display:inline-flex;align-items:center;gap:5px}
.st-swatches__dot{width:12px;height:12px;border-radius:999px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--st-ink) 22%,transparent)}
.st-swatches__more{font-size:12px;color:var(--st-muted);margin-inline-start:2px;font-variant-numeric:tabular-nums}
.st-card[data-style="centered"] .st-swatches{justify-content:center}
.st-card__body{display:grid;gap:4px}
.st-card__brand{font-size:12px;color:var(--st-muted);letter-spacing:.08em;text-transform:uppercase}
:lang(ar) .st-card__brand{letter-spacing:0}
.st-card__name{font-size:15px;font-weight:500;line-height:1.35}
/* quick add (every card, legacy storefront product card parity): a small round button at the end of the card's text, beside the
   price; a sibling of the card link (never inside it), so the text keeps room for it */
.st-card-slot{position:relative;display:grid}
.st-card-slot .st-card__body{padding-inline-end:calc(var(--st-card-frame) * 4px + 46px)}
.st-card-slot .st-card[data-style="centered"] .st-card__body{padding-inline-start:calc(var(--st-card-frame) * 4px + 46px)}
.st-quick-add{position:absolute;inset-block-end:calc(var(--st-card-frame) * 16px);inset-inline-end:calc(var(--st-card-frame) * 14px);z-index:1;
  display:grid;place-items:center;width:36px;height:36px;border-radius:999px;border:1px solid color-mix(in srgb,var(--st-ink) 15%,transparent);
  color:var(--st-ink);background:transparent;transition:background-color .2s,border-color .2s,color .2s,transform .2s}
.st-quick-add svg{width:16px;height:16px}
@media (hover:hover) and (pointer:fine){.st-quick-add:hover{background:var(--st-button);border-color:var(--st-button);color:var(--st-on-button)}}
.st-quick-add:active{transform:scale(.9)}
.st-quick-add:disabled,.st-quick-add[aria-busy="true"]{opacity:.6}
.st-quick-add[data-state="added"]{background:var(--st-button);border-color:var(--st-button);color:var(--st-on-button)}
.st-quick-add:focus-visible{outline:2px solid var(--st-ink);outline-offset:2px}
.st-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* collection pager (q.productPage) */
.st-pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-block-start:44px}
.st-pager__status{font-size:14px;color:var(--st-muted);min-width:9ch;text-align:center}
.st-pager__link{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid var(--st-line);color:var(--st-ink)}
.st-pager__link[data-end]{opacity:.35}
.st-pager__link svg{width:20px;height:20px}
.st-pager__back{transform:scaleX(-1)}
[dir="rtl"] .st-pager__back{transform:none}
/* card styles (theme-level design setting): classic is the base above */
.st-card[data-style="centered"] .st-card__body{justify-items:center;text-align:center}
.st-card[data-style="centered"] .st-price{justify-content:center}
.st-card[data-style="minimal"]{gap:10px}
.st-card[data-style="minimal"] .st-card__media{border-radius:0}
.st-card[data-style="minimal"] .st-card__body{gap:2px}
.st-card[data-style="minimal"] .st-card__name{font-size:14px;font-weight:400;color:var(--st-muted)}
.st-card[data-style="minimal"] .st-badge{border-radius:0}
.st-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;font-size:15px;font-weight:600}
.st-price--sale{color:var(--st-sale)}
.st-price__compare{color:var(--st-muted);font-weight:400;text-decoration:line-through;font-size:14px}
.st-price__from{color:var(--st-muted);font-weight:400;font-size:13px}
.st-rating{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--st-muted)}
.st-rating svg{width:13px;height:13px;color:var(--st-accent-ink)}
.st-empty{border:1px dashed var(--st-line);border-radius:var(--st-radius);padding:40px 20px;text-align:center;color:var(--st-muted);font-size:15px}

/* theme blocks */
.st-blocks{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:inherit;width:100%}
.st-blocks>:not(.st-btn){flex-basis:100%}
.st-block-text[data-size="small"]{font-size:14px}
.st-block-text[data-size="large"]{font-size:clamp(18px,2.6cqi,22px);color:inherit}
.st-block-image{position:relative;border-radius:var(--st-radius);overflow:hidden;background:var(--st-soft);margin:0}
.st-block-image[data-ratio="square"]{aspect-ratio:1/1}
.st-block-image[data-ratio="portrait"]{aspect-ratio:4/5}
.st-block-image[data-ratio="landscape"]{aspect-ratio:16/9}
.st-block-image:not([data-ratio="auto"]) img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-promo .st-block-text{color:inherit;opacity:.82}

/* banners */
.st-banners{display:grid;gap:12px}
@container (min-width:760px){.st-banners[data-variant="grid"]{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}}
.st-banners[data-variant="slideshow"]{grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.st-banners[data-variant="slideshow"]::-webkit-scrollbar{display:none}
.st-banners[data-variant="slideshow"]>*{scroll-snap-align:start;scroll-margin-block-start:96px}
.st-banner{position:relative;display:grid;align-items:end;min-height:clamp(220px,40cqi,340px);border-radius:var(--st-radius);overflow:hidden;background:var(--st-accent-soft);color:#FFFFFF;isolation:isolate}
.st-banners[data-height="short"] .st-banner{min-height:clamp(180px,28cqi,240px)}
.st-banners[data-height="tall"] .st-banner{min-height:clamp(360px,60cqi,620px)}
.st-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s ease}
@media (hover:hover) and (pointer:fine){.st-banner:hover img{transform:scale(1.03)}}
.st-banner::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,calc(var(--st-overlay,.4) * 1.5)),rgba(0,0,0,calc(var(--st-overlay,.4) * .2)) 70%)}
.st-banner[data-ink="dark"]{color:#111111}
.st-banner[data-veil="light"]::after{background:linear-gradient(to top,rgba(255,255,255,calc(var(--st-overlay,.4) * 1.5)),rgba(255,255,255,calc(var(--st-overlay,.4) * .2)) 70%)}
.st-banner[data-empty="true"]{color:var(--st-ink)}
.st-banner[data-empty="true"]::after{display:none}
/* Mobile height (≤ 768 px, the mobile image breakpoint): short crop, Studio's medium crop (no rule), or the photo's own
   proportions from --st-media-w/--st-media-h (mobile rendition first; unknown dimensions keep the medium crop). */
@container (max-width:768px){
  .st-hero[data-mobile-height="short"] .st-hero__media{aspect-ratio:4/3}
  .st-hero[data-mobile-height="short"][data-variant="overlay"] .st-hero__overlay{min-height:clamp(360px,96cqi,440px)}
  .st-hero[data-mobile-height="natural"] .st-hero__media{aspect-ratio:var(--st-media-w,4)/var(--st-media-h,5)}
  .st-hero[data-mobile-height="natural"][data-variant="overlay"] .st-hero__overlay[style*="--st-media-w"]{min-height:auto;aspect-ratio:var(--st-media-w)/var(--st-media-h)}
  .st-hero[data-mobile-height="natural"][data-variant="overlay"] .st-hero__media{aspect-ratio:auto}
  .st-banners[data-mobile-height="short"] .st-banner{min-height:clamp(160px,44cqi,200px)}
  .st-banners[data-mobile-height="natural"] .st-banner[style*="--st-media-w"]{min-height:auto;aspect-ratio:var(--st-media-w)/var(--st-media-h)}
}
.st-banner__copy{display:grid;gap:8px;padding:clamp(20px,4cqi,40px);justify-items:start}
.st-banner__title{font-size:clamp(24px,4.4cqi,40px)}
.st-banner__subtitle{opacity:.86;max-width:46ch}
.st-banner .st-link{color:inherit}

/* collections */
.st-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@container (min-width:760px){.st-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}}
.st-tile{position:relative;display:block;aspect-ratio:3/4;border-radius:var(--st-radius);overflow:hidden;background:var(--st-accent-soft);color:#FFFFFF;isolation:isolate}
.st-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s ease}
@media (hover:hover) and (pointer:fine){.st-tile:hover img{transform:scale(1.04)}}
.st-tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 55%)}
.st-tile[data-empty="true"]{color:var(--st-ink)}
.st-tile[data-empty="true"]::after{display:none}
.st-tile__label{position:absolute;inset-inline:16px;inset-block-end:16px;display:grid;gap:2px}
.st-tile__name{font-family:var(--st-display);font-weight:var(--st-display-weight);font-size:clamp(20px,3.4cqi,28px);line-height:1.1}
.st-tile__count{font-size:13px;opacity:.85}
.st-tile__mark{position:absolute;inset-block-start:16px;inset-inline-start:16px;font-family:var(--st-display);font-size:64px;line-height:1;opacity:.25}
.st-index{border-block-start:1px solid var(--st-line)}
.st-index a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:clamp(16px,2.6cqi,24px);border-block-end:1px solid var(--st-line);
  font-family:var(--st-display);font-weight:var(--st-display-weight);letter-spacing:var(--st-display-tracking);font-size:clamp(24px,5cqi,48px);line-height:1.1;transition:color .2s,padding .3s}
@media (hover:hover) and (pointer:fine){.st-index a:hover{color:var(--st-accent-ink);padding-inline-start:10px}}
.st-index svg{width:clamp(20px,3cqi,32px);height:clamp(20px,3cqi,32px);flex:none}

/* story / spotlight */
.st-split{display:grid;gap:28px;align-items:center}
@container (min-width:820px){.st-split{grid-template-columns:1fr 1fr;gap:clamp(40px,7cqi,112px)}.st-split[data-variant="media-right"] .st-split__media{order:2}}
.st-split__media{position:relative;aspect-ratio:5/6;border-radius:var(--st-radius);overflow:hidden;background:var(--st-accent-soft)}
.st-split__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-split__mono{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--st-display);font-size:clamp(96px,22cqi,220px);color:color-mix(in srgb,var(--st-accent) 40%,transparent);line-height:1}
.st-split__copy{display:grid;gap:18px;justify-items:start}
.st-rich{color:var(--st-muted);font-size:clamp(15px,2cqi,17px);display:grid;gap:12px;max-width:60ch}
.st-rich a{color:var(--st-ink);text-decoration:underline;text-underline-offset:3px}
.st-rich ul{list-style:disc;padding-inline-start:20px}
.st-rich ol{list-style:decimal;padding-inline-start:20px}
.st-rich blockquote{border-inline-start:2px solid var(--st-accent);padding-inline-start:16px;font-style:italic}

/* features */
.st-features{display:grid;gap:12px}
@container (min-width:720px){.st-features{grid-template-columns:repeat(var(--st-cols,3),minmax(0,1fr));gap:20px}}
.st-feature{display:grid;gap:10px;align-content:start;padding:clamp(20px,3cqi,32px);border-radius:var(--st-radius)}
.st-features[data-variant="cards"] .st-feature{background:var(--st-soft)}
.st-features[data-variant="columns"] .st-feature{padding-inline:0;border-block-start:1px solid var(--st-line);border-radius:0}
.st-feature__icon{width:44px;height:44px;border-radius:999px;display:grid;place-items:center;background:var(--icon-tile,var(--st-accent-soft));color:var(--icon-glyph,var(--st-accent))}
.st-feature__icon svg{width:22px;height:22px}
.st-feature__title{font-weight:600;font-size:17px}
.st-feature__body{color:var(--st-muted);font-size:15px}

/* testimonials */
.st-quotes{display:grid;gap:16px}
@container (min-width:760px){.st-quotes{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}
.st-quote{display:grid;gap:18px;align-content:space-between;padding:clamp(22px,3cqi,32px);border-radius:var(--st-radius);background:var(--st-bg);border:1px solid var(--st-line)}
.st-quote blockquote{font-family:var(--st-display);font-size:clamp(18px,2.4cqi,22px);line-height:1.35;letter-spacing:var(--st-display-tracking)}
.st-quote figcaption{font-size:14px;color:var(--st-muted);display:flex;align-items:center;gap:12px}
.st-quote__avatar{flex:none;width:44px;height:44px;border-radius:999px;object-fit:cover;background:var(--st-accent-soft)}
.st-quote__initial{display:grid;place-items:center;font-family:var(--st-display);font-size:18px;color:var(--st-accent-ink)}
.st-quote__who{display:grid;gap:2px;min-width:0;text-align:start}
.st-quote__author{color:var(--st-ink);font-weight:600}
.st-quote__detail{font-size:13px;color:var(--st-muted)}
.st-quotes[data-variant="single"]{grid-template-columns:1fr}
.st-quotes[data-variant="single"] .st-quote{border:0;background:transparent;text-align:center;justify-items:center;max-width:900px;margin-inline:auto}
.st-quotes[data-variant="single"] blockquote{font-size:clamp(24px,4.4cqi,40px)}
.st-tinted{background:var(--st-soft)}

/* promo */
.st-promo{border-radius:var(--st-radius);padding:clamp(28px,6cqi,72px);display:grid;gap:16px;justify-items:start;position:relative;overflow:hidden}
@container (min-width:820px){.st-promo{grid-template-columns:1fr auto;align-items:end}}
.st-promo[data-variant="accent"]{background:var(--st-accent);color:var(--st-on-accent)}
.st-promo[data-variant="dark"]{background:var(--st-ink);color:var(--st-bg)}
.st-promo[data-variant="outline"]{border:1px solid var(--st-line)}
.st-promo__title{font-size:clamp(28px,6cqi,56px)}
.st-promo__body{opacity:.82;max-width:52ch}
.st-promo[data-variant="accent"] .st-btn--primary,.st-promo[data-variant="dark"] .st-btn--primary{background:var(--st-bg);color:var(--st-ink)}

/* product page */
.st-pdp{display:grid;gap:28px;align-items:start}
@container (min-width:900px){.st-pdp{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(40px,6cqi,88px)}}
.st-gallery{display:grid;gap:12px}
.st-gallery__main{position:relative;aspect-ratio:4/5;border-radius:var(--st-radius);overflow:hidden;background:var(--st-soft)}
.st-gallery__main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-gallery__thumbs{display:flex;gap:8px;overflow-x:auto;padding-block-end:4px}
.st-thumb{flex:none;width:68px;aspect-ratio:4/5;border-radius:calc(var(--st-radius) * .6);overflow:hidden;border:1px solid var(--st-line);padding:0;background:var(--st-soft);cursor:pointer;position:relative}
.st-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-thumb::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.st-thumb[aria-current="true"]{border-color:var(--st-ink)}
.st-thumb[aria-current="true"]::after{box-shadow:inset 0 0 0 1px var(--st-ink)}
[data-theme="studio"] .st-thumb:focus-visible{outline:none}
[data-theme="studio"] .st-thumb:focus-visible::after{box-shadow:inset 0 0 0 2px var(--st-accent)}
.st-gallery[data-layout="stack"] .st-gallery__thumbs{display:none}
@container (min-width:900px){
  .st-gallery[data-layout="stack"] .st-gallery__stack{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  /* Contracts v1.10: below the header, from the host's --v2-header-h (72px until it is known). */
  .st-pdp__info{position:sticky;top:calc(var(--v2-header-h,72px) + 24px)}
}
.st-gallery__stack{display:none}
.st-gallery__stack figure{position:relative;aspect-ratio:4/5;border-radius:var(--st-radius);overflow:hidden;background:var(--st-soft)}
.st-gallery__stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@container (min-width:900px){.st-gallery[data-layout="stack"] .st-gallery__main{display:none}}
.st-pdp__info{display:grid;gap:20px;align-content:start}
.st-pdp__title{font-size:clamp(30px,5cqi,48px)}
.st-pdp__meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:14px;color:var(--st-muted)}
.st-pdp__price .st-price{font-size:22px}
.st-pdp__short{color:var(--st-muted)}
.st-option{display:grid;gap:10px;border:0;padding:0;margin:0}
.st-option legend{font-size:13px;font-weight:600;padding:0;margin-block-end:10px}
.st-option legend span{color:var(--st-muted);font-weight:400}
.st-values{display:flex;flex-wrap:wrap;gap:8px}
.st-value{min-height:42px;min-width:48px;padding:0 16px;border-radius:min(var(--st-radius),22px);border:1px solid var(--st-line);background:var(--st-bg);cursor:pointer;font-size:14px;display:inline-flex;align-items:center;gap:8px}
.st-value[aria-pressed="true"]{border-color:var(--st-ink);box-shadow:inset 0 0 0 1px var(--st-ink)}
.st-value[data-unavailable="true"]{color:var(--st-muted);text-decoration:line-through}
.st-swatch{width:18px;height:18px;border-radius:999px;border:1px solid var(--st-line)}
.st-buy{display:grid;gap:10px}
.st-buy__row{display:grid;grid-template-columns:auto 1fr;gap:10px}
.st-qty{display:inline-flex;align-items:center;border:1px solid var(--st-line);border-radius:min(var(--st-radius),24px);height:48px}
.st-qty button{width:42px;height:100%;border:0;background:transparent;cursor:pointer;font-size:18px}
.st-qty output{min-width:28px;text-align:center;font-weight:600}
.st-buy__status{font-size:14px;min-height:20px;color:var(--st-muted)}
.st-buy__status[data-tone="ok"]{color:var(--st-accent-ink)}
.st-pdp__mto{font-size:14px;font-weight:600;color:var(--st-ink)}
.st-gallery__main video,.st-gallery__stack video,.st-thumb--video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-thumb__play{position:absolute;inset:0;margin:auto;width:22px;height:22px;padding:4px;border-radius:50%;color:#fff;background:rgb(0 0 0 / .55)}
.st-sizechart{border:1px solid var(--st-line,rgb(0 0 0/.1));border-radius:var(--st-radius);padding:0 16px}
.st-sizechart summary{cursor:pointer;padding:14px 0;font-weight:600;font-size:14px}
.st-sizechart__scroll{overflow-x:auto;padding-bottom:8px}
.st-sizechart table{width:100%;border-collapse:collapse;font-size:14px}
.st-sizechart th,.st-sizechart td{padding:8px 10px;text-align:start;white-space:nowrap;border-bottom:1px solid var(--st-line,rgb(0 0 0/.08))}
.st-sizechart__note{font-size:12px;color:var(--st-muted);padding-bottom:12px}
.st-note{display:flex;gap:10px;align-items:center;font-size:14px;color:var(--st-muted);padding:14px 16px;border-radius:var(--st-radius);background:var(--st-soft)}
.st-note svg{width:18px;height:18px;flex:none;color:var(--st-accent-ink)}
.st-preview-flag{font-size:12px;color:var(--st-muted)}
.st-accordion{border-block-start:1px solid var(--st-line);max-width:880px}
.st-accordion details{border-block-end:1px solid var(--st-line)}
.st-accordion summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding-block:20px;font-weight:600;font-size:17px}
.st-accordion summary::-webkit-details-marker{display:none}
.st-accordion summary svg{width:18px;height:18px;transition:transform .25s}
.st-accordion details[open] summary svg{transform:rotate(45deg)}
.st-accordion__body{padding-block-end:22px;color:var(--st-muted);display:grid;gap:10px;white-space:pre-line}
.st-specs{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:10px 24px;white-space:normal}
.st-specs dt{color:var(--st-ink);font-weight:500}
.st-reviews{display:grid;gap:16px}
@container (min-width:760px){.st-reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
.st-review{display:grid;gap:10px;padding:22px;border-radius:var(--st-radius);border:1px solid var(--st-line)}
.st-review__head{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--st-muted)}
.st-review__title{font-weight:600}
.st-stars{display:inline-flex;gap:2px;color:var(--st-accent-ink)}
.st-stars svg{width:14px;height:14px}
.st-summary{display:flex;align-items:baseline;gap:12px}
.st-summary strong{font-family:var(--st-display);font-size:48px;line-height:1}

/* collection header */
.st-collection{display:grid;gap:18px}
.st-collection__banner{position:relative;aspect-ratio:21/9;border-radius:var(--st-radius);overflow:hidden;background:var(--st-accent-soft)}
.st-collection__banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-collection__title{font-size:clamp(36px,8cqi,80px)}

/* quick-add sheet (a card's "+" on a product with options): a native <dialog>; a bottom sheet on phones, a panel from 720px.
   Viewport media queries: the dialog is in the top layer, sized against the screen. */
.st-sheet{margin:0;padding:0;border:0;inset:auto 0 0;width:100%;max-width:none;max-height:min(92dvh,760px);border-radius:calc(var(--st-radius) + 8px) calc(var(--st-radius) + 8px) 0 0;
  background:var(--st-bg);color:var(--st-ink);font-family:var(--st-body);box-shadow:0 -12px 48px rgba(0,0,0,.18);overscroll-behavior:contain;overflow-y:auto}
.st-sheet[open]{display:block;animation:st-sheet-up .3s cubic-bezier(.2,.8,.2,1)}
.st-sheet::backdrop{background:rgba(0,0,0,.4)}
@keyframes st-sheet-up{from{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){.st-sheet[open],.st-search[open]{animation:none}}
.st-sheet__panel{position:relative;padding:20px clamp(16px,4vw,28px) max(24px,env(safe-area-inset-bottom))}
.st-sheet__head{position:absolute;inset-block-start:8px;inset-inline-end:8px;z-index:1}
.st-sheet__body{display:grid;gap:18px}
.st-sheet__media{position:relative;aspect-ratio:1/1;width:min(100%,280px);margin-inline:auto;border-radius:var(--st-radius);overflow:hidden;background:var(--st-soft)}
.st-sheet__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-sheet__info{display:grid;gap:14px;align-content:start}
.st-sheet__title{font-size:clamp(22px,4vw,28px);padding-inline-end:40px}
.st-sheet__add{width:100%}
.st-sheet__state{display:grid;gap:12px;justify-items:start;padding-block:28px 8px;color:var(--st-muted)}
@media (min-width:720px){
  .st-sheet{inset:0;margin:auto;width:min(760px,calc(100vw - 48px));border-radius:calc(var(--st-radius) + 8px);box-shadow:0 24px 64px rgba(0,0,0,.22)}
  .st-sheet[open]{animation-name:st-fade-in}
  .st-sheet__body{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:28px}
  .st-sheet__media{width:100%}
}
@keyframes st-fade-in{from{opacity:0;transform:translateY(8px)}}

/* search overlay (header): a native <dialog> from the top edge, results as you type */
.st-search{margin:0;padding:0;border:0;inset:0 0 auto;width:100%;max-width:none;max-height:100dvh;background:var(--st-bg);color:var(--st-ink);
  font-family:var(--st-body);box-shadow:0 18px 48px rgba(0,0,0,.18);overscroll-behavior:contain;overflow-y:auto}
.st-search[open]{display:block;animation:st-search-in .25s ease}
.st-search::backdrop{background:rgba(0,0,0,.4)}
@keyframes st-search-in{from{transform:translateY(-16px);opacity:0}}
.st-search__inner{width:100%;max-width:calc(var(--theme-pageWidth,1320) * 1px);margin-inline:auto;padding:14px clamp(16px,4vw,48px) max(20px,env(safe-area-inset-bottom))}
.st-search__bar{display:flex;align-items:center;gap:8px;border-block-end:1px solid var(--st-line);padding-block-end:10px}
.st-search__bar svg{width:20px;height:20px;flex:none;color:var(--st-muted)}
/* 16px: iOS does not zoom the page when the field is focused */
.st-search__input{flex:1;min-width:0;min-height:48px;border:0;background:transparent;color:inherit;font:inherit;font-size:18px;outline:none}
.st-search__input::placeholder{color:var(--st-muted)}
.st-search__input::-webkit-search-cancel-button{display:none}
.st-search__status{font-size:14px;color:var(--st-muted);padding-block:14px 4px;min-height:20px}
.st-search__groups{display:grid;gap:22px;padding-block:8px 4px}
.st-search__group h2{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted);margin-block-end:8px}
:lang(ar) .st-search__group h2{letter-spacing:0}
.st-search__product{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;padding:8px;border-radius:var(--st-radius)}
.st-search__product:focus-visible{outline-offset:0}
@media (hover:hover) and (pointer:fine){.st-search__product:hover,.st-search__collection:hover{background:var(--st-soft)}}
.st-search__thumb{position:relative;width:56px;aspect-ratio:1/1;border-radius:calc(var(--st-radius) * .6);overflow:hidden;background:var(--st-soft)}
.st-search__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[data-design-card-image-fit="contain"] .st-search__thumb img{object-fit:contain;padding:6%}
.st-search__name{font-size:15px;font-weight:500;line-height:1.35}
.st-search__product .st-price{font-size:14px}
.st-search__collections{display:flex;flex-wrap:wrap;gap:8px}
.st-search__collection{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--st-line);font-size:14px}
.st-search__all{margin-block-start:18px}
@media (min-width:880px){.st-search__groups{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:40px}}

/* newsletter (the platform's subscribe action) */
.st-newsletter__box{display:grid;gap:14px;justify-items:start;padding:clamp(28px,6cqi,64px) clamp(20px,5cqi,64px);border-radius:var(--st-radius);background:var(--st-accent-soft)}
.st-newsletter[data-variant="band"] .st-newsletter__box{background:transparent;padding-inline:0;border-block:1px solid var(--st-line);border-radius:0}
.st-newsletter[data-align="center"] .st-newsletter__box{justify-items:center;text-align:center}
.st-newsletter__title{font-size:clamp(26px,5cqi,40px)}
.st-newsletter__body{color:var(--st-muted);max-width:52ch}
.st-newsletter__form{display:flex;flex-wrap:wrap;gap:10px;width:min(100%,520px);margin-block-start:6px}
.st-newsletter__input{flex:1 1 220px;min-width:0;height:48px;padding:0 16px;border:1px solid color-mix(in srgb,var(--st-ink) 22%,transparent);border-radius:min(var(--st-radius),24px);background:var(--st-bg);color:var(--st-ink);font:inherit;font-size:16px}
.st-newsletter__input:focus-visible{outline:2px solid var(--st-accent-ink);outline-offset:2px}
[data-design-button-shape="pill"] .st-newsletter__input{border-radius:999px}
[data-design-button-shape="square"] .st-newsletter__input{border-radius:0}
.st-newsletter__status{flex-basis:100%;font-size:14px;min-height:20px;color:var(--st-muted)}
.st-newsletter__status[data-tone="ok"]{color:var(--st-ink);font-weight:600}
.st-newsletter__status[data-tone="error"]{color:var(--st-sale)}

/* footer */
.st-footer{background:var(--st-ink);color:var(--st-bg)}
.st-footer__grid{display:grid;gap:32px;padding-block:clamp(48px,8cqi,88px) 32px}
@container (min-width:820px){.st-footer__grid{grid-template-columns:1.4fr repeat(auto-fit,minmax(150px,1fr))}}
.st-footer__brand{display:grid;gap:14px;align-content:start}
.st-footer__name{font-family:var(--st-display);font-weight:var(--st-display-weight);font-size:clamp(28px,5cqi,44px);line-height:1}
.st-footer__tagline{opacity:.7;max-width:36ch}
.st-footer h3{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.6;margin-block-end:14px;font-weight:600}
:lang(ar) .st-footer h3{letter-spacing:0}
.st-footer li+li{margin-block-start:10px}
.st-footer a{opacity:.86}
@media (hover:hover) and (pointer:fine){.st-footer a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}}
.st-footer__policy{opacity:.7;font-size:14px;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.st-footer__policy-block+.st-footer__policy-block{margin-block-start:18px}
.st-social{display:flex;flex-wrap:wrap;gap:4px;margin-inline-start:-10px}
.st-footer .st-social li+li{margin-block-start:0}
.st-footer .st-icon-btn{color:var(--st-bg)}
@media (hover:hover) and (pointer:fine){.st-footer .st-icon-btn:hover{background:color-mix(in srgb,var(--st-bg) 12%,transparent);text-decoration:none}}
.st-payments{display:flex;flex-wrap:wrap;gap:6px}
.st-footer .st-payments li+li{margin-block-start:0}
/* Theme polish: the search field's text box grows with its text (no fixed height): padding above and below and a line box
   taller than the font's Arabic ascent + descent (1.9 in Arabic: Cairo declares 1.875em), so descenders and dots are never cut; a placeholder too
   long for a narrow field ends in an ellipsis. */
[data-theme="studio"] input[type="search"][name="q"]{box-sizing:border-box;height:auto;padding-block:6px;line-height:1.5;text-overflow:ellipsis}
[data-theme="studio"] input[type="search"][name="q"]:lang(ar){line-height:1.9}
/* Contracts v1.23: payment marks. Small cards of one size on white with a hairline (readable on dark and light footers):
   the logo file (a 38x24 card icon, unmodified, docs/themes/payment-marks.md) filling the card, or the mark's name as a
   text card. 38x24, 32x20 on phones; one row, wrapping when it runs out of room. */
.st-payment{box-sizing:border-box;display:grid;place-items:center;width:38px;height:24px;padding:1px 2px;overflow:hidden;border-radius:3px;outline:1px solid rgba(17,17,17,.14);outline-offset:-1px;background:#fff;color:#1b1b1b;font-size:7px;font-weight:700;line-height:1.05;letter-spacing:0;text-transform:none;text-align:center;overflow-wrap:normal}
.st-payment:has(>img){padding:0}
.st-payment img{display:block;width:100%;height:100%;object-fit:contain}
@media (max-width:767.98px){.st-payment{width:32px;height:20px;font-size:6px}}
.st-footer__base{border-block-start:1px solid color-mix(in srgb,var(--st-bg) 18%,transparent);padding-block:20px;font-size:13px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.st-footer__base>span{opacity:.6}
/* Cart page (Contracts v1.11): lines + summary; logical properties only (RTL mirrors). */
.st-cart{display:grid;gap:24px}
.st-cart__title{font-size:clamp(30px,4vw,44px)}
.st-cart__empty{display:grid;gap:16px;justify-items:start}
.st-cart__layout{display:grid;gap:32px}
@media (min-width:900px){.st-cart__layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start}.st-cart__summary{position:sticky;top:calc(var(--v2-header-h,0px) + 16px)}}
.st-cart__lines{list-style:none;margin:0;padding:0;display:grid}
.st-cart__line{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:16px;padding-block:20px;border-block-end:1px solid var(--st-line)}
.st-cart__line:first-child{border-block-start:1px solid var(--st-line)}
.st-cart__image{display:block;aspect-ratio:4/5;border-radius:var(--st-radius);background:var(--st-soft);overflow:hidden}
.st-cart__image img{width:100%;height:100%;object-fit:var(--theme-cardImageFit,cover)}
.st-cart__info{display:grid;gap:6px;align-content:start;min-width:0}
.st-cart__name{font-weight:600;color:inherit;text-decoration:none}
@media (hover:hover) and (pointer:fine){.st-cart__name:hover{text-decoration:underline}}
.st-cart__variant,.st-cart__unit,.st-cart__fine{margin:0;color:var(--st-muted);font-size:14px}
.st-cart__mto{margin:0;color:var(--st-ink);font-size:13px;font-weight:600}
.st-cart__unit s{margin-inline-start:8px}
.st-cart__problem{margin:0;color:var(--st-sale);font-size:14px;font-weight:600}
.st-cart__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-block-start:6px}
.st-cart__line-total{margin:0;font-weight:600;white-space:nowrap}
.st-cart__line[data-problem="unavailable"] .st-cart__image{opacity:.5}
.st-link-btn{border:0;background:none;padding:4px 0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;font-size:14px}
.st-link-btn:disabled{opacity:.5;cursor:default}
.st-cart__summary{display:grid;gap:16px;padding:24px;border-radius:var(--st-radius);background:var(--st-soft)}
.st-cart__code{display:grid;gap:10px}
.st-cart__code p{margin:0;font-size:14px}
.st-cart__code-label{display:grid;gap:6px;font-size:14px}
.st-cart__code-label input{height:48px;padding-inline:14px;border:1px solid var(--st-line);border-radius:min(var(--st-radius),24px);background:var(--st-bg);font:inherit}
.st-cart__totals{margin:0;display:grid;gap:10px}
.st-cart__totals div{display:flex;justify-content:space-between;gap:12px}
.st-cart__totals dt,.st-cart__totals dd{margin:0}
.st-cart__total{padding-block-start:10px;border-block-start:1px solid var(--st-line);font-weight:700;font-size:18px}
.st-cart__checkout{width:100%;justify-content:center}
.st-cart__checkout[aria-disabled="true"]{opacity:.45;pointer-events:none}
.st-cart__status:empty{display:none}
.st-cart__status{margin:0;font-size:14px;color:var(--st-muted)}
@media (max-width:520px){.st-cart__line{grid-template-columns:72px minmax(0,1fr)}.st-cart__line-total{grid-column:2}}
/* Search page (Contracts v1.12). */
.st-search-page__title{font-size:clamp(28px,4vw,42px);overflow-wrap:anywhere}
.st-search-page__form{display:flex;gap:10px;margin-block:20px 12px;max-width:640px}
.st-search-page__field{position:relative;flex:1;min-width:0;display:flex;align-items:center}
.st-search-page__field svg{position:absolute;inset-inline-start:14px;width:20px;height:20px;color:var(--st-muted);pointer-events:none}
.st-search-page__field input{width:100%;min-height:48px;padding-inline:44px 14px;border:1px solid var(--st-line);border-radius:min(var(--st-radius),24px);background:var(--st-bg);color:inherit;font:inherit;font-size:16px}
.st-search-page__count{margin:8px 0 16px;color:var(--st-muted)}
.st-search-page__collections{display:flex;flex-wrap:wrap;gap:8px;margin-block-end:24px}
.st-chip{display:inline-flex;align-items:center;min-height:40px;padding-inline:16px;border:1px solid var(--st-line);border-radius:999px;color:inherit;text-decoration:none;font-size:14px}
@media (hover:hover) and (pointer:fine){.st-chip:hover{border-color:var(--st-ink)}}
/* Filters (Contracts v1.13): a panel of links (no script); swatches for color-like options; logical properties only. */
.st-filters{display:grid;gap:12px;margin-block-end:24px}
.st-filters__panel>summary{list-style:none;cursor:pointer;width:max-content}
.st-filters__panel>summary::-webkit-details-marker{display:none}
.st-filters__groups{position:relative;display:grid;gap:4px;margin-block-start:12px;padding:0 16px 8px;overflow:hidden;border:1px solid var(--st-line);border-radius:var(--st-radius)}
@media (min-width:900px){.st-filters__groups{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px 24px}}
/* One rule above every group, across the whole box (a row of columns reads as one line); the box clips the first row's.
   The rule sits where the group's padding starts (-10px), not where its content does. */
.st-filter{margin-block-start:-1px;padding-block:10px}
.st-filter::before{content:"";position:absolute;inset-inline:0;margin-block-start:-10px;border-block-start:1px solid var(--st-line)}
.st-filter>summary{cursor:pointer;font-weight:600;font-size:15px}
.st-filter ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:2px}
.st-filter ul[data-swatches]{display:flex;flex-wrap:wrap;gap:6px}
.st-filter__choice{display:flex;align-items:center;gap:10px;min-height:40px;color:inherit;text-decoration:none;font-size:14px}
.st-filter__box{flex:none;width:18px;height:18px;border:1.5px solid var(--st-ink);border-radius:4px;display:inline-grid;place-items:center}
.st-filter__box[data-selected]{background:var(--st-ink);box-shadow:inset 0 0 0 3px var(--st-bg)}
.st-filter ul[data-swatches] .st-filter__box{width:28px;height:28px;border-radius:50%;border-color:var(--st-line)}
.st-filter ul[data-swatches] .st-filter__box[data-selected]{box-shadow:0 0 0 2px var(--st-bg),0 0 0 4px var(--st-ink)}
.st-filter ul[data-swatches] .st-filter__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.st-filter__count{margin-inline-start:auto;color:var(--st-muted);font-size:13px}
.st-filter__price{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:10px;max-width:420px;margin-block-start:8px}
.st-filter__price label{display:grid;gap:4px;font-size:13px;min-width:0}
.st-filter__price button{grid-column:1/-1}
.st-filter__price input{width:100%;min-width:0;height:42px;padding-inline:10px;border:1px solid var(--st-line);border-radius:min(var(--st-radius),21px);background:var(--st-bg);color:inherit;font:inherit}
.st-filters__chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.st-filters__chips .st-chip{gap:6px}
.st-filters__chips .st-chip svg{width:14px;height:14px}
@media (hover:hover) and (pointer:fine){.st-filter__choice:hover .st-filter__label{text-decoration:underline}}
/* Contracts v1.19: the "page not found" page. A framed card on the page itself (no tint: the large numeral is accent text,
   held to the accent's 3:1 floor against the page), centered; the search form reuses the search page's field. */
.st-lost__card{display:grid;justify-items:center;gap:14px;max-width:720px;margin-inline:auto;padding:clamp(32px,7cqi,72px) clamp(20px,5cqi,56px);border:1px solid var(--st-line);border-radius:var(--st-radius);text-align:center}
.st-lost__code{font-size:clamp(88px,22cqi,168px);line-height:.9;color:var(--st-accent-ink);font-variant-numeric:lining-nums}
.st-lost__title{font-size:clamp(28px,5cqi,44px);overflow-wrap:anywhere}
.st-lost__text{max-width:52ch;color:var(--st-muted);font-size:16px;overflow-wrap:anywhere}
.st-lost__search{width:100%;margin-block:8px 0;margin-inline:auto}
.st-lost__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 28px;margin-block-start:8px}
/* Small labels stay muted text (4.5:1 in every palette), never the accent, whose floor is 3:1. */
:is(.st-lost,.st-page) .st-eyebrow{color:var(--st-muted)}
/* Contracts v1.19: a static page (policies, contact). Plain text that keeps the merchant's line breaks; contact cards. */
.st-page__body{max-width:760px}
.st-page__body[data-width="wide"]{max-width:none}
.st-page__title{font-size:clamp(32px,5.5cqi,56px);margin-block-end:clamp(20px,4cqi,36px);overflow-wrap:anywhere}
.st-page__text{display:grid;gap:1.1em;font-size:17px;line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}
.st-page__contacts{display:grid;gap:12px;margin-block-start:28px}
@container (min-width:640px){.st-page__contacts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.st-page__body[data-width="wide"] .st-page__contacts{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.st-page__contact{display:grid;align-content:start;gap:8px;height:100%;padding:22px;border:1px solid var(--st-line);border-radius:var(--st-radius);transition:border-color .2s ease}
.st-page__value{justify-self:start;font-size:18px;overflow-wrap:anywhere}
@media (hover:hover) and (pointer:fine){a.st-page__contact:hover{border-color:var(--st-ink)}}
/* Contracts v1.14: a section's color scheme. "default" is the page itself (nothing changes); another scheme repaints the
   section and re-points Studio's own colors inside it, so every child (muted text, rules, buttons) follows. */
[data-theme="studio"] .st-section[data-scheme]:not([data-scheme="default"]){
  --st-bg:var(--scheme-background);--st-ink:var(--scheme-text);
  --st-accent-ink:var(--st-accent);
  --st-accent:var(--scheme-accent,var(--scheme-text));--st-on-accent:var(--scheme-onAccent,var(--scheme-background));
  --st-button:var(--scheme-accent,var(--scheme-text));--st-on-button:var(--scheme-onAccent,var(--scheme-background));
  --st-muted:var(--scheme-muted,color-mix(in srgb,var(--st-ink) 66%,var(--st-bg)));--st-faint:color-mix(in srgb,var(--st-ink) 40%,var(--st-bg));
  --st-line:color-mix(in srgb,var(--st-ink) 12%,transparent);--st-soft:color-mix(in srgb,var(--st-ink) 5%,var(--st-bg));
  background:var(--st-bg);color:var(--st-ink)}
/* Design baseline (Contracts v1.24). Every rule is keyed on a root attribute whose default value draws nothing new.
   Spacing: the section spacing setting scaled. */
[data-theme="studio"][data-design-density="compact"]{--st-density:.7}
[data-theme="studio"][data-design-density="airy"]{--st-density:1.35}
/* Logo center: the centered header on wide screens (phones already center it). Drawer: the menu button on every screen. */
@container (min-width:880px){
  [data-theme="studio"][data-design-header-logo="center"] .st-header .st-header__bar{grid-template-columns:1fr auto 1fr;grid-template-areas:"pad logo icons" "nav nav nav";padding-block:14px 0;row-gap:10px}
  [data-theme="studio"][data-design-header-logo="center"] .st-header .st-logo{grid-area:logo;justify-self:center;font-size:30px}
  [data-theme="studio"][data-design-header-logo="center"] .st-header .st-header__nav{grid-area:nav;padding-block:10px 14px;border-block-start:1px solid var(--st-line)}
  [data-theme="studio"][data-design-header-logo="center"] .st-header .st-header__icons{grid-area:icons}
  [data-theme="studio"][data-design-header-menu="drawer"] .st-header .st-header__menu{display:inline-grid;grid-area:auto}
  [data-theme="studio"][data-design-header-menu="drawer"] .st-header .st-header__nav{display:none}
  [data-theme="studio"][data-design-header-menu="drawer"] .st-header .st-header__bar{grid-template-columns:auto 1fr auto}
  [data-theme="studio"][data-design-header-menu="drawer"][data-design-header-logo="center"] .st-header .st-header__bar{grid-template-columns:1fr auto 1fr;grid-template-areas:"pad logo icons";padding-block:0;row-gap:0}
  [data-theme="studio"][data-design-header-menu="drawer"][data-design-header-logo="center"] .st-header .st-header__menu{grid-area:pad;justify-self:start}
}
/* The light scheme is the page's own colors: the brand color as text keeps its readable shade. Fills keep the color exactly as picked. */
[data-theme="studio"] .st-section[data-scheme="light"]:not([data-scheme="default"]){--st-accent-ink:var(--theme-accentInk,var(--st-accent))}
/* Footer centered: one column, centered. */
[data-theme="studio"][data-design-footer-layout="centered"] .st-footer__grid{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
[data-theme="studio"][data-design-footer-layout="centered"] .st-footer__tagline{margin-inline:auto}
[data-theme="studio"][data-design-footer-layout="centered"] :is(.st-social,.st-payments){justify-content:center;margin-inline:0}
[data-theme="studio"][data-design-footer-layout="centered"] .st-footer__base{flex-direction:column;justify-content:center}
[data-theme="studio"] .rf{margin-block-start:24px}
[data-theme="studio"] .rf-open,[data-theme="studio"] .rf-send{min-height:44px;padding-inline:24px;border-radius:var(--st-radius);font:inherit;font-weight:600;cursor:pointer}
[data-theme="studio"] .rf-open{background:transparent;color:inherit;border:1px solid var(--st-line)}
[data-theme="studio"] .rf-send{justify-self:start;background:var(--st-button);color:var(--st-on-button);border:0}
[data-theme="studio"] .rf-send[disabled]{opacity:.6;cursor:default}
[data-theme="studio"] .rf-form{display:grid;gap:14px;max-width:560px;outline:none}
[data-theme="studio"] .rf-field{display:grid;gap:6px;font-size:.92rem;font-weight:500}
[data-theme="studio"] .rf-input{width:100%;min-height:44px;padding:10px 14px;border:1px solid var(--st-line);border-radius:var(--st-radius);background:transparent;color:inherit;font:inherit;font-size:16px;font-weight:400}
[data-theme="studio"] .rf-stars{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0;border:0}
[data-theme="studio"] .rf-stars legend{margin-block-end:6px;padding:0;font-size:.92rem;font-weight:500}
[data-theme="studio"] .rf-star{width:44px;height:44px;padding:0;background:none;border:0;color:inherit;opacity:.3;font-size:1.6rem;line-height:1;cursor:pointer}
[data-theme="studio"] .rf-star[aria-pressed="true"]{color:var(--st-button);opacity:1}
[data-theme="studio"] .rf-note{margin:0;font-size:.92rem}
