/* ~store.css */
/* CODOS store pages (collections, pages, contact, search). Uses the colors and fonts of
   the theme through CSS variables, with safe fallbacks for themes that don't define them. */
.cd-page{max-width:var(--page-width,1200px);margin:0 auto;padding:32px 16px 48px;color:var(--ink,#0f172a)}
.cd-page-head{margin-bottom:20px}
.cd-page h1{font-family:var(--font-heading,inherit);font-size:clamp(1.5rem,4vw,2.2rem);margin:0 0 6px;text-align:start}
.cd-page-sub{color:var(--muted,#64748b);margin:0 0 6px;max-width:70ch}
.cd-count{color:var(--muted,#64748b);font-size:.9rem;margin:0}
.cd-empty{padding:48px 0;text-align:center;color:var(--muted,#64748b)}

.cd-grid{display:grid;gap:var(--cd-row-gap,var(--cd-gap-m,16px)) var(--cd-gap-m,16px);grid-template-columns:repeat(var(--cd-cols-m,2),minmax(0,1fr))}
@media(min-width:760px){.cd-grid{grid-template-columns:repeat(var(--cd-cols,4),minmax(0,1fr));gap:var(--cd-row-gap,var(--cd-gap,24px)) var(--cd-gap,24px)}}

.cd-card{display:block;background:var(--card,#fff);border-radius:var(--radius,12px);overflow:hidden;border:1px solid var(--line,#e5e7eb);text-decoration:none;color:inherit}
.cd-card-media{position:relative;display:block;aspect-ratio:1/1;background:var(--soft,#f6f7f9);overflow:hidden}
.cd-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.cd-card:hover .cd-card-media img{transform:scale(1.04)}
.cd-card-blank{display:block;width:100%;height:100%;background:linear-gradient(135deg,var(--soft,#f1f5f9),var(--line,#e5e7eb))}
.cd-card-body{display:block;padding:12px 12px 14px}
.cd-card-title{display:block;font-weight:600;line-height:1.35;color:inherit;text-decoration:none;margin-bottom:4px}
.cd-card-price{margin:0;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cd-card-price s{color:var(--muted,#64748b);font-size:.9em}
.cd-from{color:var(--muted,#64748b);font-size:.85em}
.cd-badge{position:absolute;top:10px;inset-inline-start:10px;background:var(--brand,#111);color:var(--on-brand,#fff);font-size:12px;font-weight:700;padding:3px 8px;border-radius:999px}
.cd-badge-muted{background:#0f172a;opacity:.75;inset-inline-start:auto;inset-inline-end:10px}
.cd-quick-add{margin-top:10px;width:100%;border:1px solid var(--line,#e5e7eb);background:transparent;color:inherit;border-radius:var(--btn-radius,10px);padding:8px 10px;font:inherit;font-weight:600;cursor:pointer}
.cd-quick-add:hover{background:var(--soft,#f6f7f9)}
.cd-collection-card .cd-card-media{aspect-ratio:4/3}

.cd-toolbar{position:relative;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:18px 0 22px;padding:10px 0;border-block:1px solid var(--line,#e5e7eb)}
.cd-filter{position:static}
.cd-filter-toggle{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-weight:600;list-style:none;padding:8px 2px;min-height:40px}
.cd-filter-toggle::-webkit-details-marker{display:none}
.cd-dot{width:8px;height:8px;border-radius:50%;background:var(--brand,#111)}
.cd-filter-panel{position:absolute;z-index:30;inset-inline-start:0;top:100%;margin-top:6px;width:min(340px,100%);display:flex;flex-direction:column;gap:14px;padding:16px;background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--radius,12px);box-shadow:0 16px 40px -18px rgba(15,23,42,.35)}
.cd-filter-price{display:flex;flex-wrap:wrap;align-items:end;gap:10px}
.cd-filter-label{flex-basis:100%;font-weight:600;font-size:.9rem}
.cd-filter-actions{display:flex;align-items:center;gap:14px}
.cd-sort{display:inline-flex;align-items:center;gap:8px;font-size:.9rem;color:var(--muted,#64748b)}
.cd-sort select{font:inherit;color:var(--ink,#0f172a);background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--field-radius,10px);padding:8px 10px;min-height:40px;max-width:60vw}
.cd-field{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted,#64748b)}
.cd-field select,.cd-field input,.cd-form input,.cd-form textarea{font:inherit;color:var(--ink,#0f172a);background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--field-radius,10px);padding:9px 11px;min-height:40px}
.cd-field-sm input{width:96px}
.cd-check{display:flex;align-items:center;gap:6px;font-size:.9rem;min-height:40px}
.cd-clear{align-self:center;color:var(--muted,#64748b);font-size:.9rem}
.cd-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--brand,#111);color:var(--on-brand,#fff);border:0;border-radius:var(--btn-radius,10px);padding:10px 18px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;min-height:42px}
.cd-btn-sm{padding:8px 14px;min-height:40px}
.cd-btn-outline{background:transparent;color:inherit;border:1px solid var(--line,#e5e7eb)}
.cd-pagination{display:flex;gap:16px;align-items:center;justify-content:center;margin-top:28px;color:var(--muted,#64748b)}
.cd-pagination a{color:inherit;font-weight:600;text-decoration:none}

.cd-search-form{display:flex;gap:8px;margin-top:14px;max-width:520px}
.cd-search-form input{flex:1;font:inherit;border:1px solid var(--line,#e5e7eb);border-radius:var(--field-radius,10px);padding:10px 12px;min-height:42px;background:var(--card,#fff);color:inherit}

.cd-prose{max-width:72ch;line-height:1.75}
.cd-prose h2,.cd-prose h3,.cd-form h2{text-align:start}
.cd-prose h2{font-size:1.4rem;margin:28px 0 10px}
.cd-prose h3{font-size:1.15rem;margin:22px 0 8px}
.cd-prose p{margin:0 0 14px}
.cd-prose img{border-radius:var(--image-radius,12px);width:100%;height:auto}
.cd-prose figure{margin:20px 0}
.cd-prose figcaption{color:var(--muted,#64748b);font-size:.9rem;margin-top:6px;text-align:center}
.cd-prose blockquote{margin:20px 0;padding:14px 18px;border-inline-start:3px solid var(--brand,#111);background:var(--soft,#f6f7f9);border-radius:var(--radius,12px)}
.cd-prose blockquote cite{display:block;margin-top:8px;color:var(--muted,#64748b);font-style:normal}
.cd-prose ul,.cd-prose ol{margin:0 0 14px;padding-inline-start:22px}
.cd-prose hr{border:0;border-top:1px solid var(--line,#e5e7eb);margin:28px 0}
.cd-text-link{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:opacity .15s ease}
.cd-text-link:hover{opacity:.7}
.cd-faq details{border-bottom:1px solid var(--line,#e5e7eb);padding:12px 0}
.cd-faq summary{cursor:pointer;font-weight:600}

.cd-contact-grid{display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:860px){.cd-contact-grid{grid-template-columns:1.4fr 1fr;gap:48px}}
.cd-form{display:flex;flex-direction:column;gap:14px;max-width:560px}
.cd-form h2{margin:0}
.cd-form .cd-field span{font-size:.85rem}
.cd-form-error{color:#dc2626;margin:0}
.cd-form-done{color:#15803d;margin:0;font-weight:600}
.cd-contact-info{color:var(--muted,#64748b);line-height:1.7}
.cd-contact-info strong{color:var(--ink,#0f172a)}
.cd-contact-info a{color:inherit}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}

/* Product page */
.cd-product-grid{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.cd-product-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start}}
.cd-gallery{position:sticky;top:16px}
@media(max-width:899px){.cd-gallery{position:relative}}
.cd-gallery-main{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:var(--image-radius,14px);background:var(--soft,#f6f7f9);scrollbar-width:none}
.cd-gallery-main::-webkit-scrollbar{display:none}
.cd-gallery-slide{flex:0 0 100%;width:100%;min-width:0;scroll-snap-align:center;border:0;padding:0;background:none;cursor:zoom-in}
@media(min-width:900px){.cd-gallery-main{display:block;overflow:visible}.cd-gallery-slide{display:none}.cd-gallery-slide.is-active{display:block}}
.cd-gallery-slide img{display:block;width:100%;max-width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--image-radius,14px)}
.cd-gallery-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}
@media(min-width:900px){.cd-gallery-dots{display:none}}
.cd-dot{width:7px;height:7px;border-radius:999px;background:var(--line,#d8dce3)}
.cd-dot.is-active{background:var(--brand,#111)}
.cd-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.cd-thumbs::-webkit-scrollbar{display:none}
.cd-thumb{flex:0 0 68px;height:68px;padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;background:var(--soft,#f6f7f9);cursor:pointer}
.cd-thumb.is-active{border-color:var(--brand,#111)}
.cd-thumb img{width:100%;height:100%;object-fit:cover}
.cd-gallery-side{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;align-items:start}
.cd-gallery-side .cd-thumbs{flex-direction:column;margin:0;order:-1;max-height:520px;overflow-y:auto}
.cd-lightbox{position:fixed;inset:0;z-index:2147483100;background:rgba(15,23,42,.9);display:flex;align-items:center;justify-content:center;padding:24px;cursor:zoom-out}
.cd-lightbox img{max-width:100%;max-height:100%;border-radius:12px}

.cd-product-info{display:flex;flex-direction:column;gap:14px}
.cd-product-kicker{margin:0;color:var(--muted,#64748b);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em}
.cd-product-title{margin:0;font-size:clamp(1.5rem,3vw,2rem);text-align:start}
.cd-product-rating{margin:0;color:var(--muted,#64748b);font-size:.9rem}
.cd-product-rating .stars{color:var(--accent,#f59e0b)}
.cd-product-price{margin:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:1.35rem}
.cd-product-price s{color:var(--muted,#64748b);font-size:1rem}
.cd-save{background:var(--brand,#111);color:var(--on-brand,#fff);border-radius:999px;padding:2px 9px;font-size:.8rem;font-weight:700}
.cd-highlights{margin:0;padding-inline-start:18px;color:var(--ink,#0f172a);line-height:1.8}
.cd-options{display:flex;flex-direction:column;gap:14px}
.cd-option{border:0;padding:0;margin:0}
.cd-option legend{padding:0;font-size:.85rem;font-weight:600;color:var(--muted,#64748b);margin-bottom:6px}
.cd-option-values{display:flex;flex-wrap:wrap;gap:8px}
.cd-option-value{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line,#e5e7eb);border-radius:var(--btn-radius,10px);padding:8px 12px;cursor:pointer;font-size:.9rem;background:var(--card,#fff)}
.cd-option-value input{position:absolute;opacity:0;width:0;height:0}
.cd-option-value.is-selected{border-color:var(--brand,#111);box-shadow:inset 0 0 0 1px var(--brand,#111)}
.cd-swatch{width:18px;height:18px;border-radius:999px;border:1px solid rgba(15,23,42,.15)}
.cd-assurances{margin:0;padding:12px 14px;list-style:none;background:var(--soft,#f6f7f9);border-radius:var(--radius,12px);color:var(--muted,#64748b);font-size:.9rem;line-height:1.9}
.cd-tabs details{border-top:1px solid var(--line,#e5e7eb);padding:12px 0}
.cd-tabs summary{cursor:pointer;font-weight:600}
.cd-tabs .cd-prose{max-width:none;padding-top:8px}

.cd-sticky-buy[hidden]{display:none}
.cd-sticky-buy{position:fixed;inset-inline:0;bottom:0;z-index:40;display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--card,#fff);border-top:1px solid var(--line,#e5e7eb);box-shadow:0 -6px 20px rgba(15,23,42,.08)}
.cd-sticky-info{display:flex;min-width:0;flex:1;flex-direction:column}
.cd-sticky-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-sticky-info span{color:var(--muted,#64748b);font-size:.9rem}
.cd-related,.cd-recent{padding-top:8px}
.cd-related h2,.cd-recent h2{text-align:start;font-size:1.25rem;margin:0}

body.has-sticky-buy{padding-bottom:72px}
.cd-recent[hidden]{display:none}

/* Header */
.cd-header{background:var(--card,#fff);border-bottom:1px solid var(--line,#e5e7eb)}
.cd-header.is-sticky{position:sticky;top:0;z-index:45}
.cd-header-inner{max-width:var(--page-width,1200px);margin:0 auto;display:flex;align-items:center;gap:14px;padding:12px 16px}
.cd-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.05rem;color:inherit;text-decoration:none;white-space:nowrap}
.cd-logo{display:block;width:auto}
.cd-logo.logo-sm{height:26px}.cd-logo.logo-md{height:34px}.cd-logo.logo-lg{height:46px}
.cd-nav{display:none;flex:1;gap:20px;align-items:center}
@media(min-width:860px){.cd-nav{display:flex}.cd-menu-toggle{display:none}}
.cd-nav-item{position:relative}
.cd-nav-item>a{color:inherit;text-decoration:none;font-weight:600;font-size:.95rem;padding:8px 0;display:inline-block}
.cd-nav-item>a:hover{opacity:.7}
.cd-dropdown{position:absolute;inset-inline-start:0;top:100%;min-width:190px;background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--radius,12px);box-shadow:0 12px 30px rgba(15,23,42,.1);padding:8px;display:none;z-index:5}
.cd-nav-item.has-children:hover .cd-dropdown,.cd-nav-item.has-children:focus-within .cd-dropdown{display:block}
.cd-dropdown a{display:block;padding:8px 10px;border-radius:8px;color:inherit;text-decoration:none;font-size:.92rem}
.cd-dropdown a:hover{background:var(--soft,#f6f7f9)}
.cd-header-actions{margin-inline-start:auto;display:flex;align-items:center;gap:4px}
.cd-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;background:none;color:inherit;cursor:pointer;border-radius:10px;position:relative;text-decoration:none}
.cd-icon-btn:hover{background:var(--soft,#f6f7f9)}
.cd-cart-count{position:absolute;top:4px;inset-inline-end:4px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:var(--brand,#111);color:var(--on-brand,#fff);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.cd-cart-count[hidden]{display:none}
/* Menu button is only for phones */
@media(min-width:860px){.cd-menu-toggle{display:none}}
.cd-search-bar{display:flex;gap:8px;max-width:var(--page-width,1200px);margin:0 auto;padding:0 16px 12px}
.cd-search-bar[hidden]{display:none}
.cd-search-bar input{flex:1;font:inherit;border:1px solid var(--line,#e5e7eb);border-radius:var(--field-radius,10px);padding:9px 12px;min-height:42px;background:var(--card,#fff);color:inherit}
/* Phone menu: a list under the header, a panel from the side, or the whole screen. */
.cd-drawer[hidden]{display:none}
@media(min-width:860px){.cd-drawer{display:none!important}}
.cd-drawer-link{display:block;padding:12px 0;color:inherit;text-decoration:none;font-weight:600;border-bottom:1px solid color-mix(in srgb,currentColor 10%,transparent)}
.cd-drawer-child{padding-inline-start:14px;font-weight:500;opacity:.8}
.cd-drawer--dropdown{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.2,.8,.2,1)}
.cd-drawer--dropdown.is-open{grid-template-rows:1fr}
.cd-drawer--dropdown .cd-drawer-panel{min-height:0;overflow:hidden;background:var(--hdr-bg,var(--card,#fff));color:var(--hdr-fg,var(--ink,#111));border-top:1px solid var(--line,#e5e7eb)}
.cd-drawer--dropdown nav{padding:4px 16px 14px}
.cd-drawer--drawer,.cd-drawer--full{position:fixed;inset:0;z-index:2147483300}
.cd-drawer-backdrop{position:absolute;inset:0;background:rgba(15,15,20,.45);opacity:0;transition:opacity .35s ease}
.cd-drawer.is-open .cd-drawer-backdrop{opacity:1}
.cd-drawer--drawer .cd-drawer-panel,.cd-drawer--full .cd-drawer-panel{position:absolute;inset-block:0;inset-inline-start:0;display:flex;flex-direction:column;background:var(--hdr-bg,var(--card,#fff));color:var(--hdr-fg,var(--ink,#111));overflow-y:auto;overscroll-behavior:contain}
.cd-drawer--drawer .cd-drawer-panel{width:min(86vw,360px);box-shadow:0 0 40px rgba(0,0,0,.18);transform:translateX(-100%);transition:transform .38s cubic-bezier(.2,.8,.2,1)}
[dir=rtl] .cd-drawer--drawer .cd-drawer-panel{transform:translateX(100%)}
.cd-drawer--drawer.is-open .cd-drawer-panel{transform:none}
.cd-drawer--full .cd-drawer-panel{inset-inline-end:0;opacity:0;transform:translateY(-12px);transition:opacity .3s ease,transform .38s cubic-bezier(.2,.8,.2,1)}
.cd-drawer--full.is-open .cd-drawer-panel{opacity:1;transform:none}
.cd-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 20px;border-bottom:1px solid color-mix(in srgb,currentColor 10%,transparent)}
[dir=rtl] .cd-drawer-head{padding:10px 20px 10px 10px}
.cd-drawer-title{font-weight:700;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-drawer--drawer nav,.cd-drawer--full nav{padding:8px 20px 28px}
.cd-drawer--full .cd-drawer-link{font-size:22px;padding:14px 0}
.cd-drawer .cd-drawer-link{opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .3s ease;transition-delay:calc(var(--i,0) * 35ms + 60ms)}
.cd-drawer.is-open .cd-drawer-link{opacity:1;transform:none}
html.cd-menu-lock{overflow:hidden}
.cd-menu-toggle.is-word{width:auto;padding:0 8px}
.cd-menu-word{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.cd-search-bar{opacity:0;transform:translateY(-6px);transition:opacity .25s ease,transform .3s ease}
.cd-search-bar.is-open{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.cd-drawer,.cd-drawer *,.cd-search-bar{transition:none!important}}

/* Footer */
/* No built-in gap above the footer: the last section's own spacing decides, so a full-width
   picture can meet the footer (the gap used to read as an empty, unselectable section). */
.cd-footer{background:var(--soft,#f6f7f9);border-top:1px solid var(--line,#e5e7eb)}
/* Themes' base.css still gives <main> the old landing page's bottom padding and a full-screen
   min-height, which left a blank band before the footer. Short pages keep the footer at the
   bottom by stretching <main> instead; sticky buy bars pad the body themselves. */
body:has(> main#MainContent){display:flex;flex-direction:column;min-height:100vh}
body > main#MainContent.page{flex:1 0 auto;width:100%;box-sizing:border-box;min-height:0;padding-bottom:0}
.cd-footer-inner{max-width:var(--page-width,1200px);margin:0 auto;display:flex;flex-wrap:wrap;gap:28px 40px;padding:40px 16px}
.cd-footer-inner>*{flex:1 1 100%}
@media(min-width:760px){.cd-footer-inner>*{flex:1 1 150px}.cd-footer-inner>.cd-footer-about{flex:1.6 1 240px}}
.cd-footer-brand{display:block;font-size:1.05rem;margin-bottom:8px}
.cd-footer-about p{margin:0 0 8px;color:var(--muted,#64748b);max-width:40ch}
.cd-footer-cod{font-weight:600}
.cd-footer-col{display:flex;flex-direction:column;gap:8px;font-size:.93rem}
.cd-footer-col strong{margin-bottom:2px}
.cd-footer-col a,.cd-footer-col span{color:var(--muted,#64748b);text-decoration:none}
.cd-footer-col a:hover{color:var(--ink,#0f172a)}
.cd-footer-bottom{border-top:1px solid var(--line,#e5e7eb);padding:14px 16px;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;max-width:var(--page-width,1200px);margin:0 auto;color:var(--muted,#64748b);font-size:.85rem}
.cd-footer-social{display:flex;gap:14px}
.cd-footer-social a{color:inherit;text-decoration:none}

/* Hero */
.cd-hero{position:relative;display:flex;align-items:center;justify-content:center;min-height:340px;padding:48px 16px;background:var(--soft,#f6f7f9);color:var(--ink,#0f172a);text-align:center}
.cd-hero.is-short{min-height:240px}
.cd-hero.is-tall{min-height:min(78vh,640px)}
.cd-hero.has-image{background-image:var(--cd-hero-image);background-size:cover;background-position:center;color:#fff}
.cd-hero.has-image::before{content:"";position:absolute;inset:0;background:rgba(15,23,42,var(--cd-hero-overlay,.35))}
.cd-hero-inner{position:relative;max-width:640px;display:flex;flex-direction:column;gap:14px;align-items:center}
.cd-hero-inner.cd-align-start{align-items:flex-start;text-align:start;margin-inline-end:auto}
.cd-hero-inner.cd-align-end{align-items:flex-end;text-align:end;margin-inline-start:auto}
.cd-hero-kicker{margin:0;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;opacity:.85}
.cd-hero-title{margin:0;font-size:clamp(1.8rem,5vw,3rem);line-height:1.15;font-family:var(--font-heading,inherit)}
.cd-hero-text{margin:0;font-size:1.05rem;opacity:.92;max-width:48ch}
.cd-hero-btn{margin-top:4px}

/* Home sections */
.cd-featured-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px}
.cd-featured-head h2,.cd-rich h2{margin:0;font-size:clamp(1.25rem,2.5vw,1.6rem);text-align:start;font-family:var(--font-heading,inherit)}
.cd-link{color:inherit;font-weight:600;text-decoration:none;white-space:nowrap}
.cd-rich{display:flex;flex-direction:column;gap:12px;max-width:760px}
.cd-rich.cd-align-center{margin-inline:auto;text-align:center;align-items:center}
.cd-rich.cd-align-center h2{text-align:center}
.cd-rich p{margin:0;color:var(--muted,#64748b);line-height:1.8}
.cd-columns-grid{gap:20px}
.cd-column{text-align:center;display:flex;flex-direction:column;gap:8px;align-items:center}
.cd-column h3{margin:0;font-size:1.05rem}
.cd-column p{margin:0;color:var(--muted,#64748b)}
.cd-column-icon{font-size:2rem;line-height:1}
.cd-column-image{width:100%;max-width:220px;border-radius:var(--image-radius,12px);aspect-ratio:1/1;object-fit:cover}
.cd-cta-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;background:var(--soft,#f6f7f9);border-radius:var(--radius,16px);padding:26px 24px}
.cd-cta-inner h2{margin:0 0 6px;text-align:start;font-size:1.3rem}
.cd-cta-inner p{margin:0;color:var(--muted,#64748b);max-width:52ch}
[dir="rtl"] .cd-arrow{display:inline-block;transform:scaleX(-1)}

/* Option pickers: swatch styles (Variant Swatches app) and sold-out choices */
.cd-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cd-option legend{display:flex;gap:6px;align-items:baseline}
.cd-option-chosen{color:var(--muted,#64748b);font-weight:400}
.cd-option-value{position:relative}
.cd-style-swatch .cd-option-value{padding:3px;border-radius:999px}
.cd-style-swatch .cd-swatch{width:30px;height:30px}
/* A colour's edge is its own colour, a little darker so white and light colours still show; picked, a
   dark shade of the same colour rings it. Beats theme and swatch-design borders (two ids). */
html body .cd-style-swatch .cd-option-value.is-swatch:not(#cd):not(#swd){border:1px solid transparent;box-shadow:none!important}
html body .cd-style-swatch .cd-option-value.is-swatch:not(#cd):not(#swd) .cd-swatch{border:1px solid color-mix(in srgb,var(--swc) 80%,#000)}
html body .cd-style-swatch .cd-option-value.is-swatch:is(.is-selected,:has(input:checked)):not(#cd):not(#swd){border-color:color-mix(in srgb,var(--swc) 50%,#000)}
.cd-style-image .cd-option-value{padding:3px;border-radius:var(--radius,10px)}
.cd-swatch-img{width:56px;height:56px;object-fit:cover;border-radius:calc(var(--radius,10px) - 3px);display:block}
.cd-sw-sm .cd-style-swatch .cd-swatch{width:22px;height:22px}.cd-sw-sm .cd-swatch-img{width:44px;height:44px}
.cd-sw-lg .cd-style-swatch .cd-swatch{width:38px;height:38px}.cd-sw-lg .cd-swatch-img{width:72px;height:72px}
.cd-sw-lg .cd-style-button .cd-option-value{padding:11px 16px;font-size:1rem}
.cd-option-value.is-unavailable{color:var(--muted,#64748b);background:var(--soft,#f6f7f9)}
.cd-option-value.is-unavailable>span:last-child,.cd-option-value.is-unavailable .cd-swatch{text-decoration:line-through}
/* Sold out: one clear line from corner to corner across the whole choice — a size like "L" is one
   letter, and striking only the letter was barely visible. Any shape (chip, button, colour circle,
   picture), in the choice's own text colour, so it reads in every theme and scheme. */
:is(.cd-option-value.is-unavailable,.cd-quick-opt.is-sold-out,.cd-qv-opt.is-sold-out)::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(to top right,transparent calc(50% - 1px),currentColor calc(50% - 1px),currentColor calc(50% + 1px),transparent calc(50% + 1px));opacity:.6}
.cd-option-value.is-hidden{display:none}
.cd-option-select{display:flex;flex-direction:column;gap:6px}
.cd-option-select select{font:inherit;color:var(--ink,#0f172a);background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--field-radius,10px);padding:10px 12px;min-height:44px;max-width:320px}

/* Colour dots on product cards */
.cd-card-dots{display:flex;gap:6px;align-items:center;margin:6px 0 2px}
.cd-card-dot{width:14px;height:14px;border-radius:999px;border:1px solid rgba(15,23,42,.18);background-size:cover;background-position:center}
.cd-card-dot.is-out{opacity:.35}
.cd-card-more{font-size:.78rem;color:var(--muted,#64748b)}

/* COD Order Form app */
/* Cash-on-delivery form (same for every theme; buttons and colours come from the theme) */
.cod-title{font-family:var(--font-heading,inherit);font-size:1.3rem;font-weight:700;margin:0 0 14px;text-align:center}
.cod-box.no-summary .summary,.cod-dialog.no-summary .summary{display:none}
.cod-inline{border:1px solid var(--line,#e5e7eb);border-radius:14px;padding:18px;margin:6px 0 14px;background:var(--card,#fff)}
/* The COD button or form next to the cart buttons: never glued to them */
.buy-box + .cod-box,.cod-box + .buy-box,.cod-box + .cod-sticky + .buy-box{margin-top:12px}
.cod-box > .cod-open{width:100%}
.cod-popup{position:fixed;inset:0;z-index:2147483100;background:rgba(15,23,42,.55);display:flex;align-items:flex-end;justify-content:center;padding:0}
.cod-popup[hidden]{display:none}
.cod-dialog{position:relative;background:var(--card,#fff);color:var(--ink,#0f172a);width:100%;max-width:700px;max-height:94vh;overflow:auto;border-radius:16px 16px 0 0;padding:0 22px 22px;box-shadow:0 -12px 40px rgba(15,23,42,.25)}
@media(min-width:720px){.cod-popup{align-items:center;padding:24px}.cod-dialog{border-radius:14px}}
.cod-dialog-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:center;min-height:62px;background:inherit;border-bottom:1px solid var(--line,#e5e7eb);margin:0 -22px 0;padding:0 56px}
.cod-dialog-head .cod-title{margin:0;font-size:1.35rem}
.cod-close{position:absolute;top:50%;inset-inline-end:14px;transform:translateY(-50%);display:flex;border:0;background:transparent;cursor:pointer;color:inherit;padding:6px;border-radius:8px}
.cod-close:hover{background:var(--soft,#f6f7f9)}

.order-form.cod2{display:flex;flex-direction:column;gap:14px}
.cod2-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--line,#e5e7eb)}
.cod-inline .cod2-item{padding-top:0}
.cod2-thumb{position:relative;width:68px;height:68px;border-radius:10px;background:var(--soft,#f6f7f9);border:1px solid var(--line,#e5e7eb)}
.cod2-thumb img{width:100%;height:100%;object-fit:cover;border-radius:9px}
.cod2-badge{position:absolute;top:-9px;inset-inline-end:-9px;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:#6b7280;color:#fff;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.cod2-item-info{min-width:0;display:flex;flex-direction:column;gap:2px}
.cod2-item-info strong{font-size:1.05rem;line-height:1.3}
.cod2-item-info small{color:var(--muted,#64748b);font-size:.9rem}
.cod2-item-price{font-weight:600;font-size:1.05rem;white-space:nowrap}
.cod2-row{display:grid;grid-template-columns:1fr;gap:6px;align-items:center;margin:0}
@media(min-width:560px){.cod2-row{grid-template-columns:160px minmax(0,1fr);gap:14px}.cod2-row-top{align-items:start}.cod2-row-top .cod2-label{padding-top:12px}}
.cod2-label{font-weight:600;font-size:1rem;color:var(--ink,#0f172a)}
.cod2-label em{color:#dc2626;font-style:normal;margin-inline-start:2px}
.cod2-label small{font-weight:400;color:var(--muted,#64748b);font-size:.82rem}
.cod2-field{display:flex;align-items:stretch;min-height:52px;border:1px solid var(--line,#cbd5e1);border-radius:6px;overflow:hidden;background:var(--card,#fff);transition:border-color .15s,box-shadow .15s}
.cod2-field:focus-within{border-color:var(--ink,#0f172a);box-shadow:0 0 0 1px var(--ink,#0f172a)}
.cod2-icon{display:flex;align-items:center;justify-content:center;width:52px;flex-shrink:0;background:var(--soft,#eef0f3);border-inline-end:1px solid var(--line,#cbd5e1);color:var(--ink,#1f2937)}
.cod2 .cod2-field input,.cod2 .cod2-field select,.cod2 .cod2-field textarea{flex:1;min-width:0;border:0;border-radius:0;background:transparent;color:var(--ink,#0f172a);font:inherit;font-size:16px;padding:12px 14px;box-shadow:none;outline:none;width:100%}
.cod2 .cod2-field textarea{resize:vertical;min-height:52px}
.cod2 .cod2-field input::placeholder,.cod2 .cod2-field textarea::placeholder{color:#94a3b8}
.cod2 input.invalid{background:#fef2f2}
.cod2-field:has(input.invalid),.cod2-field:has(select.invalid){border-color:#dc2626}
.cod2 .cod2-select{font:inherit;font-size:16px;padding:12px 14px;border:1px solid #cbd5e1;border-radius:6px;background:var(--card,#fff);color:inherit;min-height:52px;width:100%}
.cod2-stepper{display:inline-flex;align-items:center;border:1px solid #cbd5e1;border-radius:6px;overflow:hidden;width:max-content}
.cod2-stepper button{width:44px;height:48px;border:0;background:transparent;font-size:20px;cursor:pointer;color:inherit}
.cod2-stepper button:hover{background:var(--soft,#f6f7f9)}
.cod2-stepper input{width:48px;height:48px;border:0;text-align:center;font:inherit;font-size:16px;background:transparent;color:inherit;-moz-appearance:textfield}
.cod2-stepper input::-webkit-outer-spin-button,.cod2-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cod2-rates{border:0;padding:0;margin:0;display:grid;gap:8px}
.order-form.cod2 .cod2-summary{display:grid;gap:10px;border:1px solid var(--line,#d1d5db);border-radius:6px;background:var(--soft,#f8f9fa);color:var(--ink,#0f172a);padding:14px 16px;margin-top:4px}
.cod2-summary .summary-row{display:flex;justify-content:space-between;font-size:1.02rem;color:var(--ink,#0f172a)}
.cod2-summary .summary-row span:last-child{font-weight:600}
.order-form.cod2 .cod2-total{display:flex;justify-content:space-between;align-items:baseline;text-align:start;border-top:1px solid #d1d5db;padding-top:10px;font-size:1.08rem;font-weight:700}
.order-form.cod2 .cod2-total strong{color:inherit;font-size:1.4rem}
.cod2-submit{min-height:58px;font-size:1.15rem;gap:10px}
/* "Order on WhatsApp" (COD Order Form app). Beside the form's button: the theme's text colour in a green outline. Alone ("WhatsApp only"): filled. While it says Notify me or Sold out it is the theme's own button again. */
.btn.cod-wa{gap:10px}
.btn.cod-wa:not(.cod-wa-main){margin-top:10px}
.btn.cod-wa:not(.is-notify):not(:disabled):not(#cd){background:transparent!important;color:var(--ink,#0f172a)!important;border:1.5px solid #1da851!important;box-shadow:none!important;transition:background-color .18s ease,color .18s ease,border-color .18s ease}
.btn.cod-wa:not(.is-notify):not(:disabled) svg{color:#1da851;flex:none;transition:color .18s ease}
.btn.cod-wa:not(.is-notify):not(:disabled):not(#cd):hover,.btn.cod-wa.cod-wa-main:not(.is-notify):not(:disabled):not(#cd){background:#1da851!important;color:#fff!important}
.btn.cod-wa:not(.is-notify):not(:disabled):hover svg,.btn.cod-wa.cod-wa-main:not(.is-notify):not(:disabled) svg{color:#fff}
.btn.cod-wa.cod-wa-main:not(.is-notify):not(:disabled):not(#cd):hover{background:#17924a!important;border-color:#17924a!important}
.btn.cod-wa.cod-wa-main{min-height:58px;font-size:1.1rem}
.btn.cod-wa.is-notify svg,.btn.cod-wa:disabled svg{display:none}
.btn.cod-wa[hidden]{display:none!important}
.cod2 .form-error{color:#dc2626;font-weight:600;margin:0}
body.cod-open-lock{overflow:hidden}
.cod-sticky{position:fixed;inset-inline:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:var(--card,#fff);border-top:1px solid var(--line,#e5e7eb);box-shadow:0 -8px 24px -12px rgba(15,23,42,.3)}
.cod-sticky[hidden]{display:none}
@media(min-width:900px){.cod-sticky{display:none!important}}
.cd-cod-section-inner{max-width:560px}

/* The page already has a quantity picker next to Add to cart: the pop-up uses it. */
.cod-with-cart .cod2-row:has(.cod2-stepper){display:none}

/* Header: logo in the middle, menu under it (on computers) */
@media(min-width:860px){
  .cd-header--center .cd-header-inner{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:". brand actions" "nav nav nav";row-gap:6px}
  .cd-header--center .cd-brand{grid-area:brand;justify-self:center}
  .cd-header--center .cd-header-actions{grid-area:actions;justify-self:end}
  .cd-header--center .cd-nav{grid-area:nav;justify-content:center}
  .cd-header--center .cd-menu-toggle{display:none}
}

/* Header layouts on computers: split (menu | logo | icons) and right (menu | icons | logo) */
.cd-cart-icon-img{display:block;width:21px;height:21px;object-fit:contain}
@media(min-width:860px){
  .cd-header--split .cd-header-inner{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"nav brand actions"}
  .cd-header--split .cd-brand{grid-area:brand;justify-self:center}
  .cd-header--split .cd-nav{grid-area:nav;justify-content:flex-start}
  .cd-header--split .cd-header-actions{grid-area:actions;justify-self:end;margin:0}
  .cd-header--split .cd-menu-toggle{display:none}
  .cd-header--right .cd-brand{order:3}
  .cd-header--right .cd-nav{order:1}
  .cd-header--right .cd-header-actions{order:2}
  .cd-header--right .cd-menu-toggle{display:none}
}
/* Phones: the logo in the middle for the centred layouts */
@media(max-width:859px){
  .cd-header--center .cd-header-inner,.cd-header--split .cd-header-inner{display:grid;grid-template-columns:1fr auto 1fr}
  .cd-header--center .cd-brand,.cd-header--split .cd-brand{justify-self:center}
  .cd-header--center .cd-header-actions,.cd-header--split .cd-header-actions{justify-self:end}
  .cd-header--right .cd-brand{order:3;margin-inline-start:8px}
  .cd-header--right .cd-header-actions{order:2}
}

/* ── Product page blocks (main-product with blocks) ── */
.cd-product-info>.pb+.pb,.cd-product-info>.pb+.cb,.cd-product-info>.cb+.pb{margin-top:14px}
/* Own space between details (main-product › spacing_custom): one --pb-gap replaces the column gap,
   the block margins, the buy form's gap and the app boxes' own margins. :not(#cd) beats theme CSS. */
.cd-product.pb-gap .cd-product-info:not(#cd),.cd-product.pb-gap .order-form.cod2:not(#cd){gap:var(--pb-gap)}
.cd-product.pb-gap .cd-product-info>*:not(#cd),.cd-product.pb-gap .order-form.cod2>*:not(#cd){margin-block:0}
.cd-product.pb-gap .cd-product-info>.pb>:first-child:not(#cd){margin-top:0}
.cd-product.pb-gap .cd-product-info>.pb>:last-child:not(#cd){margin-bottom:0}
.cd-product.pb-gap .cd-product-info :is(.pa,.fl-timer,.de,.sv-strip,.fbt):not(#cd){margin-block:0}
.cd-product.pb-gap .cd-product-info .pb>:is(.pa,.fl-timer,.de,.sv-strip,.fbt,.wl-save)+*:not(#cd),.cd-product.pb-gap .cd-product-info .pb>*+:is(.pa,.fl-timer,.de,.sv-strip,.fbt,.wl-save):not(#cd){margin-top:var(--pb-gap)}
/* A page section placed among the product details: it fits the column, no page gutters of its own
   (its own Spacing › Custom still applies). */
.pb-section>.s-wrap:not(#cd){width:100%;max-width:none;margin-inline:0}
.pb-section>.s-wrap:not(.s-pad-custom):not(#cd),.pb-section>.s-wrap:not(.s-pad-custom)>*:not(#cd){padding:0}
.pb-section>.s-wrap>*:not(#cd),.pb-section>.s-wrap>*>:is(.container,.page-width,.wrap,.inner):not(#cd){max-width:none;margin-inline:0}
.pb-title .cd-product-title{font-size:var(--pb-title-size,clamp(1.5rem,3vw,2rem));font-weight:var(--pb-title-weight,inherit);color:var(--pb-title-color,inherit)}
.pb-title .cd-product-title.is-upper{text-transform:uppercase;letter-spacing:.04em}
.pb-price .cd-product-price{font-size:var(--pb-price-size,1.35rem)}
.pb-price .cd-product-price strong{font-weight:var(--pb-price-weight,700);color:var(--pb-price-color,inherit)}
.pb-price .cd-product-price s{color:var(--pb-compare-color,var(--muted,#64748b))}
.pb-price .cd-save{background:var(--pb-save-bg,var(--brand,#111));color:var(--pb-save-color,var(--on-brand,#fff))}
.pb-price.no-save .cd-save{display:none!important}
/* Price › custom colours: only when the merchant set them (the block then carries the variable), and
   then above the theme's own price styles — which otherwise won and the colours never showed. */
.pb-price[style*="--pb-price-color"] .cd-product-price strong:not(#cd){color:var(--pb-price-color)}
.pb-price[style*="--pb-compare-color"] .cd-product-price s:not(#cd){color:var(--pb-compare-color)}
.pb-price[style*="--pb-save-bg"] .cd-save:not(#cd){background:var(--pb-save-bg);color:var(--pb-save-color)}

/* ── Content blocks (platform/snippets/content-block.liquid) ── */
.cb{display:block}
.cb-align-center{text-align:center}.cb-align-end{text-align:end}.cb-align-start{text-align:start}
.cb-heading{margin-inline:0;line-height:1.2}
.cb-text>:first-child{margin-top:0}.cb-text>:last-child{margin-bottom:0}
.cb-box{display:flex;gap:10px;align-items:flex-start}
.cb-box.cb-align-center{justify-content:center}
.cb-box-icon{flex:0 0 auto;display:flex;margin-top:1px}
.cb-box-text>:first-child{margin-top:0}.cb-box-text>:last-child{margin-bottom:0}
.cb-icon-text{display:flex;gap:12px;align-items:center}
.cb-icon-text.cb-stack{flex-direction:column;text-align:center;gap:8px}
.cb-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}
.cb-icon :is(svg,img){width:100%;height:100%;object-fit:contain}
.cb-icon-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.cb-icon-body span{color:var(--muted,#64748b);font-size:.92em}
.cb-image{margin-inline:0;max-width:100%}
.cb-image.cb-align-center{margin-inline:auto}.cb-image.cb-align-end{margin-inline-start:auto}
.cb-image img{display:block;width:100%;height:auto}
.cb-image img[style*="aspect-ratio:auto"]{height:auto}
.cb-divider{margin-inline:auto}
.cb-divider-text{display:flex;align-items:center;gap:12px;font-size:.9em}
.cb-divider-text span{flex:1;height:0}
.cb-divider-text em{font-style:normal;white-space:nowrap}
.cb-btn-outline{background:transparent!important;color:var(--brand,#111)!important;border:2px solid var(--brand,#111)!important}
.cb-btn-link{background:none!important;color:var(--brand,#111)!important;padding:0!important;min-height:0!important;box-shadow:none!important;text-decoration:underline}
.cb-btn-full{display:flex;width:100%;justify-content:center}
.cb-collapsible{border-top:1px solid var(--line,#e5e7eb);border-bottom:1px solid var(--line,#e5e7eb)}
.cb-collapsible+.cb-collapsible{border-top:0}
.cb-collapsible summary{display:flex;align-items:center;gap:10px;padding:14px 0;cursor:pointer;font-weight:600;list-style:none}
.cb-collapsible summary::-webkit-details-marker{display:none}
.cb-collapsible summary::after{content:"+";margin-inline-start:auto;font-size:1.2em;transition:transform .2s}
.cb-collapsible[open] summary::after{transform:rotate(45deg)}
.cb-collapsible .cd-prose{padding-bottom:14px}
.cb-spacer{height:var(--cb-h,24px)}
@media(max-width:749px){.cb-spacer{height:var(--cb-hm,16px)}}
.cd-cblocks{padding-inline:16px}
.cd-cblocks-inner{margin:0 auto;max-width:720px}
.cd-cblocks--page .cd-cblocks-inner{max-width:var(--page-width,1200px)}
.cd-cblocks--full{padding-inline:0}.cd-cblocks--full .cd-cblocks-inner{max-width:none}
.cd-column-svg{display:inline-flex;color:var(--brand,#111)}

/* ── Hero banner / slideshow (store-slideshow + hero-slide) ── */
.cd-hero2{display:block;position:relative;padding:0;min-height:0;background:var(--hero-bg,var(--soft,#f6f7f9));overflow:hidden;color:var(--ink,#0f172a)}
.cd-hero2.is-page{width:calc(100% - 32px);max-width:var(--page-width,1200px);margin:16px auto 0;border-radius:var(--radius,16px)}
.cd-hero2-track{display:flex;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cd-hero2.fx-fade .cd-hero2-track{display:grid}
.cd-hero2.fx-fade .cd-hero2-slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s}
.cd-hero2.fx-fade .cd-hero2-slide.is-active{opacity:1;visibility:visible}
.cd-hero2-slide{position:relative;flex:0 0 100%;min-width:0;display:grid;color:var(--hero-text,inherit)}
.cd-hero2-slide.has-image{color:var(--hero-text,#fff)}
.cd-hero2.is-short .cd-hero2-slide{min-height:260px}
.cd-hero2.is-medium .cd-hero2-slide{min-height:380px}
.cd-hero2.is-tall .cd-hero2-slide{min-height:min(78vh,640px)}
.cd-hero2.is-screen .cd-hero2-slide{min-height:calc(100svh - var(--cd-header-h,64px))}
.cd-hero2-media{position:absolute;inset:0;display:block}
.cd-hero2-media img{display:block;width:100%;height:100%;object-fit:cover}
.cd-hero2.fit-contain .cd-hero2-media img{object-fit:contain}
.cd-hero2.is-image .cd-hero2-media{position:relative;inset:auto;grid-area:1/1}
.cd-hero2.is-image .cd-hero2-media img{height:auto}
.cd-hero2-overlay{position:absolute;inset:0;z-index:1;background:var(--hero-overlay)}
.cd-hero2-content{grid-area:1/1;position:relative;z-index:2;display:flex;box-sizing:border-box;width:100%;max-width:var(--page-width,1200px);margin:0 auto;padding:48px 24px}
.cd-hero2-content.cd-v-top{align-items:flex-start}.cd-hero2-content.cd-v-middle{align-items:center}.cd-hero2-content.cd-v-bottom{align-items:flex-end}
.cd-hero2-content.cd-h-start{justify-content:flex-start}.cd-hero2-content.cd-h-center{justify-content:center}.cd-hero2-content.cd-h-end{justify-content:flex-end}
.cd-hero2 .cd-hero-inner{margin:0}
.cd-hero2 .cd-hero-inner.has-box{background:var(--hero-box);color:var(--hero-text,var(--ink,#0f172a));padding:24px 28px;border-radius:var(--radius,14px)}
.cd-hero2[style*="--hero-title-size"] .cd-hero-title:not(#cd){font-size:var(--hero-title-size)}
.cd-hero-btn--outline{background:transparent!important;color:inherit!important;border:2px solid currentColor!important;box-shadow:none!important}
.cd-hero-btn--white{background:#fff!important;color:#111!important;border-color:#fff!important}
.cd-hero2-arrow{position:absolute;top:50%;z-index:3;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:999px;background:rgba(255,255,255,.88);color:#111;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px -8px rgba(0,0,0,.4)}
.cd-hero2-arrow.is-prev{inset-inline-start:14px}.cd-hero2-arrow.is-next{inset-inline-end:14px}
[dir="rtl"] .cd-hero2-arrow svg{transform:scaleX(-1)}
.cd-hero2-dots{position:absolute;inset-inline:0;bottom:14px;z-index:3;display:flex;justify-content:center;gap:8px}
.cd-hero2-dot{width:9px;height:9px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.55);cursor:pointer;transition:width .3s,background .3s}
.cd-hero2-dot.is-active{width:24px;background:#fff}
@media(max-width:749px){.cd-hero2-arrow{display:none}.cd-hero2-content{padding:36px 18px}.cd-hero2.is-medium .cd-hero2-slide{min-height:320px}}
@media(prefers-reduced-motion:reduce){.cd-hero2-track,.cd-hero2-slide{transition:none!important}}

/* ── Product carousel (Featured products, layout: carousel) ── */
.cd-featured.is-carousel .cd-grid{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - (var(--cd-cols-m,2) - 1) * var(--cd-gap-m,16px)) / var(--cd-cols-m,2) - 8px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;scroll-behavior:smooth}
.cd-featured.is-carousel .cd-grid::-webkit-scrollbar{display:none}
.cd-featured.is-carousel .cd-grid>*{scroll-snap-align:start}
@media(min-width:760px){.cd-featured.is-carousel .cd-grid{grid-auto-columns:calc((100% - (var(--cd-cols,4) - 1) * var(--cd-gap,24px)) / var(--cd-cols,4))}}
.cd-carousel-nav{display:inline-flex;gap:6px;margin-inline-start:12px}
.cd-carousel-btn{width:36px;height:36px;border:1px solid var(--line,#e5e7eb);border-radius:999px;background:var(--card,#fff);color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.cd-carousel-btn:disabled{opacity:.35;cursor:default}
[dir="rtl"] .cd-carousel-btn svg{transform:scaleX(-1)}
@media(max-width:759px){.cd-carousel-nav{display:none}}
.cd-featured.is-carousel .cd-featured-head>.cd-link{margin-inline-start:auto}

/* ── COD Order Form app › Look (.codf + --codf-* from the app settings) ── */
.codf:not(#cd){font-size:var(--codf-size)}
.cod-box.codf:not(#cd),.cod-dialog.codf:not(#cd){background:var(--codf-bg);border:1px solid var(--codf-border);border-radius:var(--codf-radius);box-shadow:var(--codf-shadow)}
.cod-box.codf .order-form.cod2:not(#cd),.cod-dialog.codf .order-form.cod2:not(#cd){background:transparent;border:0;box-shadow:none}
.codf .cod-title:not(#cd){font-size:var(--codf-title-size);color:var(--codf-title-color);text-align:var(--codf-title-align)}
.codf .cod2-label:not(#cd){color:var(--codf-label)}
.codf .cod2-field:not(#cd){min-height:var(--codf-input-h);border-radius:var(--codf-input-radius);border-color:var(--codf-input-border);background:var(--codf-input-bg)}
.codf .cod2-field:focus-within:not(#cd){border-color:var(--codf-input-focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--codf-input-focus) 18%,transparent)}
.codf .cod2-field input:not(#cd),.codf .cod2-select:not(#cd){min-height:calc(var(--codf-input-h) - 2px);background:transparent}
.codf .cod2-select:not(#cd){border-radius:var(--codf-input-radius);border-color:var(--codf-input-border);background:var(--codf-input-bg)}
.codf .cod2-icon:not(#cd){background:var(--codf-icon-bg)}
.codf.codf-no-icons .cod2-icon:not(#cd){display:none}
.codf .cod2-summary:not(#cd){background:var(--codf-summary-bg)}
.codf.codf-labels-above .cod2-row:not(#cd){display:flex;flex-direction:column;align-items:stretch;gap:6px}
.codf.codf-labels-above .cod2-row .cod2-field:not(#cd){width:100%}
.codf.codf-labels-hidden .cod2-row>.cod2-label:not(#cd){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.codf.codf-labels-hidden .cod2-row:not(#cd){grid-template-columns:1fr}
.codf .cod2-submit:not(#cd){background:var(--codf-btn-bg);color:var(--codf-btn-color);border-color:var(--codf-btn-bg);min-height:var(--codf-btn-h);border-radius:var(--codf-btn-radius);font-size:var(--codf-btn-size);font-weight:var(--codf-btn-weight);position:relative;overflow:hidden}
.codf .cod2-submit .cd-icon:not(#cd){flex:0 0 auto}
.codf-anim-pulse .cod2-submit:not(#cd){animation:codf-pulse 2.4s ease-in-out infinite}
.codf-anim-shake .cod2-submit:not(#cd){animation:codf-shake 4s ease-in-out infinite}
.codf-anim-bounce .cod2-submit:not(#cd){animation:codf-bounce 2.6s ease-in-out infinite}
.codf-anim-shine .cod2-submit:not(#cd)::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);animation:codf-shine 3s ease-in-out infinite}
@keyframes codf-pulse{0%,70%,100%{transform:scale(1)}80%{transform:scale(1.04)}90%{transform:scale(.99)}}
@keyframes codf-shake{0%,86%,100%{transform:translateX(0)}88%,92%,96%{transform:translateX(-4px)}90%,94%,98%{transform:translateX(4px)}}
@keyframes codf-bounce{0%,70%,100%{transform:translateY(0)}78%{transform:translateY(-5px)}86%{transform:translateY(0)}92%{transform:translateY(-2px)}}
@keyframes codf-shine{0%,60%{left:-60%}100%{left:130%}}
@media(prefers-reduced-motion:reduce){.codf .cod2-submit,.codf .cod2-submit::after{animation:none!important}}
.cd-product-info>.pb:not(:has(*)){display:none}

/* ── Quantity offers in the COD form (Quantity Offers app › Store offers) ── */
.qo{display:grid;gap:10px;margin:4px 0}
.qo-tiles{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
.qo-tier{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border:2px solid var(--line,#e5e7eb);border-radius:var(--qo-radius,12px);background:var(--qo-card,var(--card,#fff));cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.qo-tier:hover{border-color:color-mix(in srgb,var(--qo-selected,var(--brand,#111)) 45%,var(--line,#e5e7eb))}
.qo-tier input{position:absolute;opacity:0;pointer-events:none}
.qo-tier.selected{border-color:var(--qo-selected,var(--brand,#111));box-shadow:0 0 0 1px var(--qo-selected,var(--brand,#111));background:color-mix(in srgb,var(--qo-selected,var(--brand,#111)) 5%,var(--qo-card,var(--card,#fff)))}
.qo-tier:has(input:focus-visible){outline:2px solid var(--qo-selected,var(--brand,#111));outline-offset:2px}
.qo-img{position:relative;flex:0 0 auto;width:52px;height:52px;border-radius:8px;overflow:hidden;background:var(--soft,#f3f4f6)}
.qo-img img{width:100%;height:100%;object-fit:cover}
.qo-count{position:absolute;inset-inline-end:2px;bottom:2px;min-width:22px;padding:1px 5px;border-radius:999px;background:rgba(17,17,17,.85);color:#fff;font-size:11px;font-weight:700;text-align:center}
.qo-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.qo-text small{color:#16a34a;font-weight:600}
.qo-price{font-weight:800;white-space:nowrap}
.qo-badge{position:absolute;top:-10px;inset-inline-end:12px;padding:2px 9px;border-radius:999px;background:var(--qo-badge-bg,#dc2626);color:var(--qo-badge-color,#fff);font-size:11px;font-weight:800;letter-spacing:.02em}
.qo-tiles .qo-tier{flex-direction:column;text-align:center;padding:16px 10px 12px}
.qo-tiles .qo-text{align-items:center}
.qo-anim-pulse .qo-badge{animation:qo-pulse 1.8s ease-in-out infinite}
.qo-anim-glow .qo-tier.selected{animation:qo-glow 2s ease-in-out infinite}
@keyframes qo-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes qo-glow{0%,100%{box-shadow:0 0 0 1px var(--qo-selected,var(--brand,#111))}50%{box-shadow:0 0 0 1px var(--qo-selected,var(--brand,#111)),0 0 18px color-mix(in srgb,var(--qo-selected,var(--brand,#111)) 40%,transparent)}}
@media(prefers-reduced-motion:reduce){.qo-badge,.qo-tier{animation:none!important}}
.qo-bundle-imgs{display:flex;flex:0 0 auto}
.qo-bundle-imgs img,.qo-bundle-blank{width:44px;height:44px;border-radius:8px;object-fit:cover;border:2px solid var(--card,#fff);background:var(--soft,#f3f4f6)}
.qo-bundle-imgs>*+*{margin-inline-start:-14px}
.qo-bundle-items{color:var(--muted,#64748b)!important;font-weight:500!important;overflow:hidden;text-overflow:ellipsis}
.qo-price s{color:var(--muted,#94a3b8);font-weight:500;font-size:.85em;margin-inline-end:4px}
.qo-tiles .qo-bundle-imgs{justify-content:center}

/* One option per piece (quantity offers, bundles): the chosen offer's choices slide open */
.qo-picks{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .3s ease,opacity .25s ease}
.qo-picks.is-open{grid-template-rows:1fr;opacity:1}
.qo-picks-in{overflow:hidden;min-height:0}
/* Inside the chosen offer: the panel takes the card's full width, under its name and price */
.qo-tier:has(.qo-picks.is-inside){flex-wrap:wrap}
.qo-picks.is-inside{flex:0 0 100%;width:100%;text-align:start;cursor:default}
.offers .offer .qo-picks.is-inside{grid-column:1/-1}
.qo-picks.is-inside.is-open .qo-picks-in{margin-top:4px;background:color-mix(in srgb,var(--qo-selected,var(--brand,#111)) 5%,transparent)}
.qo-picks.is-open .qo-picks-in{margin-top:10px;padding:12px;border-radius:12px;background:var(--soft,#f6f7f9);display:grid;gap:8px}
.qo-picks-title{margin:0;font-size:.85em;font-weight:600;color:var(--muted,#64748b)}
.qo-pick{display:grid;grid-template-columns:minmax(72px,auto) 1fr;align-items:center;gap:10px;font-size:.9em}
.qo-pick-n{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:14em}
.qo-pick .cod2-select{width:100%;min-width:0}
.cod2 .cod2-row:has(select[name="variantId"]){max-height:240px;transition:max-height .3s ease,opacity .25s ease,margin .3s ease,padding .3s ease}
.buy-box .field:has([data-buy-variant]){max-height:240px;transition:max-height .3s ease,opacity .25s ease,margin .3s ease}
.buy-box .field.is-picked{max-height:0;opacity:0;overflow:hidden;margin-block:0;pointer-events:none}
.cod2 .cod2-row.is-picked{max-height:0;opacity:0;overflow:hidden;margin-block:0;padding-block:0;border-width:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.qo-picks,.cod2 .cod2-row:has(select[name="variantId"]){transition:none}}

/* App looks: Variant Swatches, Bundles, Order Bump (own colors when chosen in the app) */
.cd-sw-custom .cd-style-button .cd-option-value,.cd-sw-custom .cd-style-chip .cd-option-value{background:var(--sw-bg);color:var(--sw-text);border-radius:var(--sw-radius)}
.cd-sw-custom .cd-option-value.is-selected{border-color:var(--sw-selected);box-shadow:inset 0 0 0 1px var(--sw-selected)}
.qo-bundle .qo-price{color:var(--qo-price,inherit)}
.bump-custom{background:var(--bump-bg);border:2px var(--bump-border-style) var(--bump-border);border-radius:var(--bump-radius)}.bump-custom .bump-text strong{color:var(--bump-title)}.bump-custom .bump-price{color:var(--bump-price)}.bump-custom input{accent-color:var(--bump-price)}.bump-anim-pulse{animation:bump-pulse 2.4s ease-in-out infinite}.bump-anim-shake{animation:bump-shake 4s ease-in-out infinite}@keyframes bump-pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--bump-border) 0%,transparent)}50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--bump-border) 22%,transparent)}}@keyframes bump-shake{0%,86%,100%{transform:none}88%,92%,96%{transform:translateX(-3px)}90%,94%,98%{transform:translateX(3px)}}@media(prefers-reduced-motion:reduce){.bump-custom{animation:none!important}}

/* ── Password page (every theme): logo-only header and footer, message, sign-up, door ── */
.cd-pw-header{padding:20px 16px}
.cd-pw-header-inner{max-width:var(--page-width,1200px);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.cd-pw-align-center .cd-pw-header-inner{justify-content:center;position:relative}
.cd-pw-align-center .cd-pw-enter{position:absolute;inset-inline-end:0}
.cd-pw-brand{display:inline-flex;align-items:center;gap:10px;color:inherit}
.cd-pw-brand img{display:block;max-width:100%}
.cd-pw-name{font-family:var(--font-heading,inherit);font-weight:800;font-size:20px;letter-spacing:-.01em}
.cd-pw-enter,.cd-pw-link{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:inherit;font:inherit;font-size:14px;cursor:pointer;opacity:.8;padding:6px 4px;transition:opacity .15s}
.cd-pw-enter:hover,.cd-pw-link:hover{opacity:1;text-decoration:underline}
@media (max-width:560px){.cd-pw-align-center .cd-pw-enter span{display:none}}
.cd-pw-message{position:relative;display:flex;align-items:center;overflow:hidden;padding:48px 16px}
.cd-pw-h-short{min-height:30vh}.cd-pw-h-medium{min-height:50vh}.cd-pw-h-tall{min-height:70vh}.cd-pw-h-screen{min-height:calc(100vh - 180px)}
.cd-pw-message-inner{position:relative;z-index:1;width:100%;max-width:var(--page-width,1200px);margin:0 auto}
.cd-pw-copy{max-width:640px}
.cd-pw-text-center .cd-pw-copy,.cd-pw-text-center.cd-signup-inner{margin-inline:auto;text-align:center}
.cd-pw-kicker{margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.cd-pw-title{margin:0 0 14px;font-family:var(--font-heading,inherit);font-size:clamp(32px,6vw,60px);line-height:1.05;letter-spacing:-.02em}
.cd-pw-lead{margin:0;font-size:17px;line-height:1.65;opacity:.85;white-space:pre-line}
.cd-pw-layout-cover{color:#fff}
.cd-pw-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cd-pw-shade{position:absolute;inset:0;background:#000}
.cd-pw-layout-split .cd-pw-message-inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.cd-pw-split-media img{width:100%;height:auto;border-radius:var(--image-radius,16px);display:block}
@media (max-width:760px){.cd-pw-layout-split .cd-pw-message-inner{grid-template-columns:1fr}}
.cd-pw-countdown{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.cd-pw-text-center .cd-pw-countdown{justify-content:center}
.cd-pw-countdown span{min-width:72px;padding:12px 8px;border-radius:var(--radius,12px);background:rgba(127,127,127,.14);text-align:center;backdrop-filter:blur(6px)}
.cd-pw-countdown b{display:block;font-family:var(--font-heading,inherit);font-size:30px;line-height:1;font-variant-numeric:tabular-nums}
.cd-pw-countdown small{display:block;margin-top:6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.cd-pw-countdown.is-done{opacity:.5}
.cd-pw-footer{padding:28px 16px 32px;border-top:1px solid var(--line,rgba(127,127,127,.2))}
.cd-pw-footer-inner{max-width:var(--page-width,1200px);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.cd-pw-footer-logo{display:block}
.cd-pw-footer-text{margin:0;font-size:14px;opacity:.8;max-width:560px}
.cd-pw-footer-small{margin:0;display:flex;gap:14px;flex-wrap:wrap;justify-content:center;align-items:center;font-size:13px;opacity:.7}
/* Sign-up form (password page or anywhere) */
.cd-signup-inner{max-width:560px}
.cd-signup-card .cd-signup-inner{background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:var(--radius,16px);padding:28px 24px;box-shadow:0 10px 30px -18px rgba(0,0,0,.35)}
.cd-signup-title{margin:0 0 8px;font-family:var(--font-heading,inherit);font-size:26px;line-height:1.2}
.cd-signup-text{margin:0 0 18px;color:var(--muted,#64748b);line-height:1.6}
.cd-signup-form{display:flex;flex-direction:column;gap:10px}
.cd-signup-switch{display:inline-flex;align-self:center;padding:3px;border-radius:999px;background:var(--soft,rgba(127,127,127,.12));gap:2px}
.cd-pw-text-start .cd-signup-switch{align-self:flex-start}
.cd-signup-switch button{border:0;background:none;color:inherit;font:inherit;font-size:13px;font-weight:600;padding:6px 16px;border-radius:999px;cursor:pointer;opacity:.7;transition:background .2s,opacity .2s}
.cd-signup-switch button[aria-selected="true"]{background:var(--card,#fff);opacity:1;box-shadow:0 1px 3px rgba(0,0,0,.12);color:var(--ink,#0f172a)}
.cd-signup-row{display:flex;flex-direction:column;gap:10px}
.cd-signup-inline .cd-signup-row{flex-direction:row;flex-wrap:wrap}
.cd-signup-inline .cd-signup-row>.cd-signup-input,.cd-signup-inline .cd-signup-phone{flex:1 1 220px}
.cd-signup-input,.cd-signup-dial{height:48px;border:1px solid var(--line,#d1d5db);border-radius:var(--field-radius,10px);padding:0 14px;font:inherit;font-size:15px;background:var(--card,#fff);color:var(--ink,#0f172a);width:100%;box-sizing:border-box}
.cd-signup-input:focus,.cd-signup-dial:focus{outline:2px solid var(--brand,#111);outline-offset:1px}
.cd-signup-phone{display:flex;gap:8px}
.cd-signup-phone[hidden],.cd-signup-input[hidden]{display:none}
.cd-signup-dial{width:auto;flex:0 0 auto;padding:0 8px}
.cd-signup-btn{height:48px;padding:0 22px}
.cd-signup-consent{margin:0;font-size:12px;color:var(--muted,#64748b)}
.cd-signup-status{margin:4px 0 0;font-size:14px;font-weight:600;animation:cd-pw-in .25s ease-out}
.cd-signup-status.is-ok{color:#15803d}.cd-signup-status.is-bad{color:#b42318}
.cd-signup-form.is-done .cd-signup-row{opacity:.55}
@keyframes cd-pw-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
/* The door dialog */
.cd-door{border:0;padding:0;background:transparent;max-width:420px;width:calc(100% - 32px);color:var(--ink,#0f172a)}
.cd-door::backdrop{background:rgba(15,23,42,.45);backdrop-filter:blur(2px);animation:cd-door-fade .2s ease-out}
.cd-door[open]{animation:cd-door-rise .22s cubic-bezier(.2,.8,.2,1)}
.cd-door.is-closing{animation:cd-door-sink .18s ease-in forwards}
.cd-door.is-closing::backdrop{animation:cd-door-fade .18s ease-in reverse forwards}
.cd-door-card{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--card,#fff);border-radius:16px;padding:28px 24px;box-shadow:0 30px 60px -20px rgba(0,0,0,.45)}
.cd-door-card h2{margin:0 0 6px;font-family:var(--font-heading,inherit);font-size:20px}
.cd-door-card label{font-size:13px;font-weight:600}
.cd-door-card input{height:46px;border:1px solid var(--line,#d1d5db);border-radius:10px;padding:0 12px;font:inherit;font-size:15px}
.cd-door-x{position:absolute;inset-inline-end:10px;top:10px;border:0;background:none;color:inherit;opacity:.6;cursor:pointer;padding:6px;border-radius:8px}
.cd-door-x:hover{opacity:1;background:rgba(127,127,127,.12)}
.cd-door-error{margin:0;color:#b42318;font-size:13px}
@keyframes cd-door-rise{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes cd-door-sink{to{opacity:0;transform:translateY(8px) scale(.98)}}
@keyframes cd-door-fade{from{opacity:0}to{opacity:1}}

/* ── Store header options: colours, height, edge, menu type, glass, transparent, hide on scroll ── */
.cd-header{color:var(--hdr-fg,inherit);transition:background-color .3s,color .3s,border-color .3s,box-shadow .3s,transform .3s}
.cd-header.has-colors:not(#cd){background:var(--hdr-bg)}
.cd-header.cd-h-compact .cd-header-inner{padding-block:6px}
.cd-header.cd-h-tall .cd-header-inner{padding-block:22px}
.cd-header.cd-hb-shadow{border-bottom-color:transparent;box-shadow:0 6px 20px -12px rgba(0,0,0,.35)}
.cd-header.cd-hb-none{border-bottom-color:transparent}
.cd-header .cd-nav-item>a{font-size:var(--menu-size,15px);font-weight:var(--menu-weight,600);letter-spacing:var(--menu-spacing,0)}
.cd-header.menu-upper .cd-nav-item>a,.cd-header.menu-upper .cd-drawer-link,.cd-drawer.menu-upper .cd-drawer-link{text-transform:uppercase}
.cd-header.is-glass{background:color-mix(in srgb,var(--hdr-bg,var(--card,#fff)) 72%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px)}
.cd-logo-alt{display:none}
/* See-through: sits on the first section until the page scrolls */
.codos-section:has(>.cd-header.is-transparent){position:relative;z-index:46}
.cd-header.is-transparent{position:absolute;inset-inline:0;background:transparent;border-bottom-color:transparent;box-shadow:none;color:var(--hdr-t-fg,#fff)}
.cd-header.is-transparent:not(.is-scrolled) .cd-cart-count{box-shadow:0 0 0 2px rgba(0,0,0,.15)}
.cd-header.is-transparent.has-alt-logo:not(.is-scrolled) .cd-logo:not(.cd-logo-alt){display:none}
.cd-header.is-transparent.has-alt-logo:not(.is-scrolled) .cd-logo-alt{display:block}
.cd-header.is-transparent.is-scrolled{position:fixed;top:0;color:var(--hdr-fg,var(--ink,#111));background:var(--hdr-bg,var(--card,#fff));border-bottom-color:var(--line,#e5e7eb);animation:cd-hdr-in .3s ease-out}
.cd-header.is-transparent.is-scrolled.is-glass{background:color-mix(in srgb,var(--hdr-bg,var(--card,#fff)) 72%,transparent)}
.cd-header.is-transparent:not(.is-sticky).is-scrolled{position:absolute;color:var(--hdr-t-fg,#fff);background:transparent;animation:none}
.cd-header.hides-on-scroll.is-hidden{transform:translateY(-110%)}
@keyframes cd-hdr-in{from{transform:translateY(-100%)}to{transform:none}}
/* Announcement line above the header */
.cd-announce{background:var(--ann-bg,#111);color:var(--ann-fg,#fff);text-align:center;font-size:13px;font-weight:600;padding:8px 16px;letter-spacing:.02em}
.cd-announce a{color:inherit;text-decoration:none}
.cd-announce a:hover{text-decoration:underline}

/* ── Store footer options ── */
/* Own header / footer colours beat a theme's own header and footer colours (Hearth, Stride, Summit painted over them). */
.cd-footer.has-colors:not(#cd){background:var(--ftr-bg);color:var(--ftr-fg);border-top-color:transparent}
.cd-footer.has-colors .cd-footer-col a,.cd-footer.has-colors .cd-footer-col span,.cd-footer.has-colors .cd-footer-about p,.cd-footer.has-colors .cd-footer-bottom{color:color-mix(in srgb,var(--ftr-fg) 72%,transparent)}
.cd-footer.has-colors .cd-footer-col a:hover{color:var(--ftr-fg)}
.cd-footer.has-colors .cd-footer-bottom{border-top-color:color-mix(in srgb,var(--ftr-fg) 16%,transparent)}
.cd-footer-logo{display:block;margin-bottom:10px}
.cd-footer--centered .cd-footer-inner{flex-direction:column;align-items:center;text-align:center}
.cd-footer--centered .cd-footer-inner>*{flex:0 0 auto}
.cd-footer--centered .cd-footer-about p{margin-inline:auto}
.cd-footer--centered .cd-footer-col{align-items:center;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:8px 18px}
.cd-footer--centered .cd-footer-col strong{display:none}
.cd-footer--centered .cd-footer-bottom{justify-content:center;flex-direction:column;align-items:center}
.cd-footer--minimal .cd-footer-inner{display:none}
.cd-footer-social{display:inline-flex;gap:14px;align-items:center}
.cd-footer-social a{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;opacity:.85;transition:opacity .15s,transform .15s}
.cd-footer-social a:hover{opacity:1;transform:translateY(-1px)}
.cd-social-icons .cd-footer-social a span,.cd-footer-social.cd-social-icons a span{display:none}
.cd-footer-social.cd-social-text svg{display:none}
.cd-footer-signup{max-width:var(--page-width,1200px);margin:0 auto;padding:32px 16px 8px;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between}
.cd-footer-signup-title{display:block;font-family:var(--font-heading,inherit);font-size:1.25rem;margin-bottom:4px}
.cd-footer-signup p{margin:0;opacity:.75}
.cd-footer-signup-form{flex:1 1 320px;max-width:460px}
.cd-footer-signup-form .cd-signup-row{flex-direction:row}
.cd-footer-signup-form .cd-signup-input{flex:1}
.cd-header.is-transparent:not(.is-scrolled){-webkit-backdrop-filter:none;backdrop-filter:none}

/* ── Placeholders: each theme's own pictures until the merchant adds real ones.
   The SVGs are masks, so the drawing takes this theme's (and this style's) colours. ── */
.cd-card-blank{position:relative;overflow:hidden;aspect-ratio:1/1;background:linear-gradient(160deg,var(--soft,#f1f5f9),color-mix(in srgb,var(--line,#e5e7eb) 70%,var(--soft,#f1f5f9)))}
.cd-card-blank::before{content:"";position:absolute;inset:14%;background:linear-gradient(150deg,var(--brand,#16a34a),var(--muted,#64748b));opacity:.55;
  -webkit-mask:var(--ph-product,url(/assets/placeholders/product.svg)) center/contain no-repeat;mask:var(--ph-product,url(/assets/placeholders/product.svg)) center/contain no-repeat}
.cd-hero2-slide:not(.has-image)::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(120deg,var(--brand,#16a34a),var(--muted,#64748b));opacity:.22;
  -webkit-mask:var(--ph-hero,url(/assets/placeholders/hero.svg)) center/cover no-repeat;mask:var(--ph-hero,url(/assets/placeholders/hero.svg)) center/cover no-repeat}
@media(max-width:749px){.cd-hero2-slide:not(.has-image)::before{-webkit-mask-position:70% center;mask-position:70% center;opacity:.16}}
/* Button block: styles, sizes and widths */
.cb-btn-white{background:#fff!important;color:#111!important;border:1px solid rgba(0,0,0,.08)!important}
.cb-btn-sm{min-height:34px;padding:6px 14px;font-size:.88rem}
.cb-btn-lg{min-height:52px;padding:14px 28px;font-size:1.05rem}
.cb-wd-full{display:flex;width:100%;justify-content:center}
.cb-wd-custom{display:inline-flex;width:min(100%,var(--cb-w,240px));justify-content:center}
@media(max-width:749px){.cb-wm-full{display:flex;width:100%;justify-content:center}.cb-wm-fit.cb-wd-full,.cb-wm-fit.cb-wd-custom{display:inline-flex;width:auto}}

/* Questions & answers: an arrow or a plus that turns, three looks (boxes, lines, soft cards). */
details.cd-acc>summary{list-style:none;cursor:pointer}
details.cd-acc>summary::-webkit-details-marker{display:none}
:is(.cd-faq-list details.faq,.cd-faq details,.cd-tabs details)>summary{display:flex;align-items:center;justify-content:space-between;gap:14px}
:is(.cd-faq-list details.faq,.cd-faq details,.cd-tabs details)>summary::after{content:"";flex:none;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .32s cubic-bezier(.2,.8,.2,1);opacity:.6}
:is(.cd-faq-list details.faq,.cd-faq details,.cd-tabs details)[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.cd-faq-list.faq-icon-plus details.faq>summary::after{width:13px;height:13px;border:0;background:linear-gradient(currentColor,currentColor) center/100% 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 100% no-repeat;transform:none}
.cd-faq-list.faq-icon-plus details.faq[open]>summary::after{transform:rotate(135deg)}
.cd-faq-list.faq-icon-none details.faq>summary::after{display:none}
.cd-faq-list .faq-body>p{margin:10px 0 0}
.cd-faq-list.faq-look-lines .faq{border:0;border-radius:0;border-bottom:1px solid var(--line,#e5e7eb);padding:16px 2px;margin:0}
.cd-faq-list.faq-look-cards .faq{border:0;border-radius:14px;background:color-mix(in srgb,currentColor 5%,transparent);padding:16px 18px;margin-bottom:10px}
.cd-faq-list .faq>summary{transition:opacity .2s}
.cd-faq-list .faq>summary:hover{opacity:.78}

/* Collection title position */
.cd-page-head.cd-head-center{text-align:center}
.cd-page-head.cd-head-end{text-align:end}
.cd-page-head.cd-head-center .cd-page-sub{margin-inline:auto}
.cd-page-head.cd-head-end .cd-page-sub{margin-inline-start:auto}

/* Buy buttons: the merchant's colors and corners (Product page › Buy buttons). Looks only. */
/* Buy buttons › Customize buttons: the merchant's own colours beat the theme's button rules and the
   store's !important outline button (commerce.css), or they never showed. */
.has-buy-style :is([data-buy-now],[data-sold-out-buy],.cod2-submit,.cod-open,[data-cod-sticky-action],[data-sticky-action],[data-upsell-accept]):not(#cd){background:var(--buy-bg)!important;color:var(--buy-fg)!important;border-color:var(--buy-bg)!important;border-radius:var(--buy-radius)!important}
.has-buy-style :is([data-add-to-cart],[data-sold-out-cart]):not(#cd){background:var(--cart-bg)!important;color:var(--cart-fg)!important;border:1px solid var(--cart-line)!important;box-shadow:none!important;border-radius:var(--buy-radius)!important}

/* Sold out: the buttons stay in place, switched off. */
:is(.btn,.cd-btn,.cd-quick-add,.cd-quick-opt,.cod2-submit)[disabled]:not(.is-loading),.buy-box.is-sold-out .btn:not(.is-notify):not(.is-preorder){opacity:.5;cursor:not-allowed;filter:saturate(.4);box-shadow:none;transform:none}
/* The quantity beside a sold-out choice is switched off too, and looks it. */
.buy-qty:has(input:disabled):not(#cd){opacity:.45;cursor:not-allowed}.buy-qty :disabled:not(#cd){cursor:not-allowed}
.cd-quick-add.is-sold-out:not(.is-notify):not(.is-preorder){opacity:.55}
/* Back in Stock's "Notify me" and "Pre-order" are live buttons, never the faded "Sold out" one. */
:is(.btn,.cd-btn,.cd-quick-add,.cod2-submit):is(.is-notify,.is-preorder):not([disabled]){opacity:1;filter:none;cursor:pointer}
/* Quick add: a spinner while the server checks, then the answer on the button. */
/* The text is hidden but keeps its colour, so the spinner is drawn in the button's own text colour
   (the page ink vanished on dark buttons). */
:is(.cd-quick-add,.cd-quick-opt,.cd-qv-add,.cd-qv-buy).is-loading{position:relative;-webkit-text-fill-color:transparent;pointer-events:none}
:is(.cd-quick-add,.cd-quick-opt,.cd-qv-add,.cd-qv-buy).is-loading::after{content:"";position:absolute;inset:0;margin:auto;width:16px;height:16px;box-sizing:border-box;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;opacity:.85;animation:cd-spin .7s linear infinite}
/* Added: a drawn check beside the word, the same size in every font. */
.is-added{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.cd-added-check{width:1.15em;height:1.15em;flex:none}
.cd-added-check path{stroke-dasharray:24;stroke-dashoffset:24;animation:cd-check-draw .35s ease-out forwards}
@keyframes cd-check-draw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.cd-added-check path{animation:none;stroke-dashoffset:0}}
@keyframes cd-spin{to{transform:rotate(360deg)}}
.cd-quick-choose{position:relative}
.cd-quick-choose .cd-quick-add{width:100%}
.cd-quick-options{position:absolute;inset-inline:0;bottom:calc(100% + 6px);z-index:6;display:flex;flex-wrap:wrap;gap:6px;padding:8px;background:var(--card,#fff);color:var(--ink,#111);border:1px solid var(--line,#e5e7eb);border-radius:12px;box-shadow:0 12px 30px -12px rgba(0,0,0,.25);opacity:0;transform:translateY(6px);transition:opacity .2s ease,transform .25s cubic-bezier(.2,.8,.2,1)}
.cd-quick-options.is-open{opacity:1;transform:none}
.cd-quick-options[hidden]{display:none}
.cd-quick-opt{flex:1 1 auto;min-width:44px;min-height:34px;padding:6px 10px;border:1px solid var(--line,#e5e7eb);border-radius:9px;background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.cd-quick-opt:hover{border-color:currentColor}
.buy-msg{margin:10px 0 0;padding:9px 12px;border-radius:10px;background:color-mix(in srgb,#dc2626 9%,transparent);color:#b91c1c;font-size:14px;font-weight:600;text-align:center;animation:cd-rise .2s ease-out}
.buy-msg[hidden]{display:none}
@keyframes cd-rise{from{opacity:0;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.cd-quick-options,.buy-msg{transition:none;animation:none}}
/* Bundle pictures in an offer list (Bundles app) */
.offer-imgs{display:flex;flex:0 0 auto}
.offer-imgs img,.offer-img-blank{width:40px;height:40px;border-radius:8px;object-fit:cover;border:2px solid var(--card,#fff);background:var(--soft,#f3f4f6)}
.offer-imgs>*+*{margin-inline-start:-12px}

/* The store's blog (/blog, /blog/<handle>): a grid of posts, and one post at reading width. */
.cd-blog-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.cd-blog-tags a{padding:6px 12px;border-radius:999px;border:1px solid var(--line,#e5e7eb);color:var(--ink,#0f172a);text-decoration:none;font-size:.85rem;transition:background .2s,color .2s,border-color .2s}
.cd-blog-tags a:hover,.cd-blog-tags a[aria-current=page]{background:var(--ink,#0f172a);border-color:var(--ink,#0f172a);color:var(--card,#fff)}
.cd-blog-grid{display:grid;gap:28px;grid-template-columns:minmax(0,1fr)}
@media(min-width:640px){.cd-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:960px){.cd-blog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cd-post-card{display:flex;flex-direction:column;gap:8px}
.cd-post-cover{display:block;aspect-ratio:16/10;overflow:hidden;border-radius:var(--image-radius,var(--radius,14px));background:var(--soft,#f1f5f9)}
.cd-post-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.32,.72,0,1)}
.cd-post-card:hover .cd-post-cover img{transform:scale(1.04)}
.cd-post-cover .cd-card-blank{display:block;width:100%;height:100%}
.cd-post-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin:4px 0 0;color:var(--muted,#64748b);font-size:.82rem}
.cd-post-meta>*+*::before{content:"·";margin-inline-end:12px}
.cd-post-title{font-family:var(--font-heading,inherit);font-size:1.15rem;line-height:1.3;margin:0;text-align:start}
.cd-post-title a{color:inherit;text-decoration:none}
.cd-post-title a:hover{text-decoration:underline;text-underline-offset:3px}
.cd-post-excerpt{margin:0;color:var(--muted,#64748b);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cd-post-more{margin-top:auto;padding-top:4px;color:var(--brand,var(--ink,#0f172a));font-weight:600;font-size:.9rem;text-decoration:none}
[dir=rtl] .cd-post-more .cd-arrow,[dir=rtl] .cd-article-back .cd-arrow{display:inline-block;transform:scaleX(-1)}
.cd-article{max-width:860px}
.cd-article-head{margin-bottom:24px}
.cd-article-back{display:inline-flex;gap:6px;margin-bottom:18px;color:var(--muted,#64748b);font-size:.88rem;text-decoration:none}
.cd-article-back:hover{color:var(--ink,#0f172a)}
.cd-article h1{font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.15;text-align:start}
.cd-article-lead{margin:14px 0 0;font-size:1.12rem;line-height:1.6;color:var(--muted,#64748b)}
.cd-article-cover{margin:0 0 28px;border-radius:var(--image-radius,var(--radius,14px));overflow:hidden;background:var(--soft,#f1f5f9)}
.cd-article-cover img{display:block;width:100%;height:auto}
.cd-article-body{font-size:1.06rem;line-height:1.75}
.cd-article-tags{margin-top:28px}
.cd-article-more{padding-top:0}
.cd-article-more h2{text-align:start;font-family:var(--font-heading,inherit);font-size:1.4rem;margin:0 0 18px;padding-top:32px;border-top:1px solid var(--line,#e5e7eb)}
@media(prefers-reduced-motion:reduce){.cd-post-cover img,.cd-blog-tags a{transition:none}.cd-post-card:hover .cd-post-cover img{transform:none}}

/* ── Pictures while they load: no alt text in link colours, a soft shimmer instead ── */
img{color:transparent}
img.cd-img-loading{background-color:color-mix(in srgb,var(--ink,#0f172a) 6%,transparent);background-image:linear-gradient(100deg,transparent 30%,color-mix(in srgb,var(--card,#fff) 45%,transparent) 50%,transparent 70%);background-size:220% 100%;animation:cd-shimmer 1.4s linear infinite}
img.cd-img-fade{opacity:0;transition:opacity .45s ease}
img.cd-img-fade.cd-img-in{opacity:1}
@keyframes cd-shimmer{from{background-position:120% 0}to{background-position:-120% 0}}
@media(prefers-reduced-motion:reduce){img.cd-img-loading{animation:none}img.cd-img-fade{opacity:1;transition:none}}

/* ── Own picture size and spacing (main-product › Pictures): each one changed wins over every page design ── */
.cd-product.g-rg .cd-product-grid:not(#cd):not(#cd){row-gap:var(--g-row-gap,24px)}
.cd-product:is(.g-pad,.g-bg) .cd-gallery:not(#cd){padding:var(--g-pad,0px);box-sizing:border-box}
.cd-product.g-bg .cd-gallery:not(#cd){background:var(--g-bg);border-radius:var(--g-radius,var(--image-radius,14px))}
.cd-product.g-bg .cd-gallery-main:not(#cd){background:none}
@media(max-width:899px){
  .cd-product.g-sm .cd-gallery:not(#cd):not(#cd){margin-inline:calc(var(--g-side,16px) - var(--s-px,16px))}
}
@media(min-width:900px){
  .cd-product.g-cg .cd-product-grid:not(#cd):not(#cd){column-gap:var(--g-col-gap,48px)}
  .cd-product.g-w .cd-product-grid:not(#cd):not(#cd){grid-template-columns:minmax(0,var(--g-media)) minmax(0,1fr)}
  /* One-column designs: the pictures take that share of the page, centred. */
}

/* ── Product information (main-product › Product information): each one changed wins over every page design ── */
.cd-product.i-bg .cd-product-info:not(#cd){background:var(--i-bg);border-radius:var(--i-r,12px);padding:clamp(16px,2.4vw,26px)}
.cd-product.i-pt .cd-product-info:not(#cd){padding-top:var(--i-pt)}
.cd-product.i-pb .cd-product-info:not(#cd){padding-bottom:var(--i-pb)}
.cd-product.i-px .cd-product-info:not(#cd){padding-inline:min(var(--i-px),20px)}
.cd-product.i-a-start .cd-product-info:not(#cd){align-items:stretch;text-align:start}
.cd-product.i-a-start .cd-product-info:not(#cd) :is(.cd-product-title,.cd-assurances){text-align:start}
.cd-product.i-a-start .cd-product-info:not(#cd) :is(.cd-product-price,.cd-option-values){justify-content:flex-start}
.cd-product.i-a-start .cd-product-info:not(#cd) .cd-option legend{margin-inline:0}
.cd-product.i-a-center .cd-product-info:not(#cd){align-items:center;text-align:center}
.cd-product.i-a-center .cd-product-info>*:not(#cd){width:100%}
.cd-product.i-a-center .cd-product-info:not(#cd) .cd-product-title{text-align:center}
.cd-product.i-a-center .cd-product-info:not(#cd) :is(.cd-product-price,.cd-option-values,.cd-thumbs){justify-content:center}
.cd-product.i-a-center .cd-product-info:not(#cd) .cd-option legend{margin-inline:auto}
.cd-product.i-a-center .cd-product-info:not(#cd) .cd-tabs{text-align:start}
@media(min-width:900px){
  .cd-product.i-w .cd-product-info:not(#cd){width:100%;max-width:var(--i-w)}
  .cd-product.i-w.i-a-center .cd-product-info:not(#cd){margin-inline:auto}
  .cd-product.i-px .cd-product-info:not(#cd){padding-inline:var(--i-px)}
  .cd-product.i-v-top .cd-product-info:not(#cd){align-self:start}
  .cd-product.i-v-center .cd-product-info:not(#cd){align-self:center}
  .cd-product.i-sticky .cd-product-info:not(#cd){position:sticky;top:20px;align-self:start}
  .cd-product.i-static .cd-product-info:not(#cd){position:static}
}

/* ── Section box: side space and width for CODOS pages (product, collection…) ── */
.s-pad-custom[style*="--s-px"]>.block,.s-pad-custom[style*="--s-px"]>section{padding-inline:var(--s-px)}
.s-pad-custom>.cd-page{padding-top:var(--s-pt,32px);padding-bottom:var(--s-pb,48px)}
@media(max-width:899px){.s-pad-custom>.cd-page{padding-top:calc(var(--s-pt,32px) * .6);padding-bottom:calc(var(--s-pb,48px) * .6)}}
.s-w-narrow>.cd-page{max-width:760px}.s-w-wide>.cd-page{max-width:1440px}.s-w-full>.cd-page{max-width:none}

/* ── Bundle and quantity choices (landing offers): the name gets the room, the badge sits on the edge ── */
.offers:has(.offer .badge){gap:16px;padding-top:6px}
.offers .offer{position:relative;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;column-gap:12px}
.offers .offer>input{grid-column:1}
.offers .offer>.offer-imgs{grid-column:2}
.offers .offer>.offer-label{grid-column:3;min-width:0;line-height:1.3;overflow-wrap:anywhere}
.offers .offer:not(:has(.offer-imgs))>.offer-label{grid-column:2/4}
.offers .offer>.offer-price{grid-column:4;white-space:nowrap;text-align:end}
.offers .offer>.badge{position:absolute;top:0;inset-inline-end:14px;transform:translateY(-55%);margin:0;padding:2px 10px;border-radius:999px;font-size:11px;line-height:1.5;white-space:nowrap;box-shadow:0 2px 6px -2px rgba(0,0,0,.25)}
.offers .offer-items,.qo-bundle-items{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:3px;line-height:1.35;overflow-wrap:anywhere}
.offers .offer-imgs img,.offers .offer-img-blank{width:44px;height:44px}
@media(max-width:420px){.offers .offer{column-gap:9px;padding:12px}.offers .offer-imgs img,.offers .offer-img-blank{width:36px;height:36px}.offers .offer-imgs>*+*{margin-inline-start:-16px}}
.qo-bundle .qo-text{min-width:0}
.qo-bundle .qo-text strong{overflow-wrap:anywhere}

/* ── Product pictures (Product page › Pictures) ── */
.cd-product{--g-gap:8px;--g-media:52%}
.cd-gallery-main{gap:var(--g-gap)}
.cd-product.g-radius .cd-gallery-slide:not(#cd) img,.cd-product.g-radius .cd-gallery-main:not(#cd){border-radius:var(--g-radius)}
.cd-product.g-radius .cd-thumb:not(#cd){border-radius:min(var(--g-radius),10px)}
.cd-product.g-r-square .cd-gallery-slide:not(#cd) img{aspect-ratio:1/1;height:auto}
.cd-product.g-r-portrait .cd-gallery-slide:not(#cd) img{aspect-ratio:4/5;height:auto}
.cd-product.g-r-tall .cd-gallery-slide:not(#cd) img{aspect-ratio:3/4;height:auto}
.cd-product.g-r-landscape .cd-gallery-slide:not(#cd) img{aspect-ratio:4/3;height:auto}
.cd-product.g-r-natural .cd-gallery-slide:not(#cd) img{aspect-ratio:auto;height:auto}
.cd-product.g-fit-contain .cd-gallery-slide:not(#cd) img{object-fit:contain}
.cd-product.g-no-zoom .cd-gallery-slide{cursor:default}
.cd-product.g-thumbs-none .cd-thumbs{display:none}
@media(max-width:899px){
  .cd-product.g-peek .cd-gallery-slide{flex-basis:86%}
  .cd-product.g-edge{padding-top:0}
  .cd-product.g-edge .cd-gallery{margin-inline:-16px}
  .s-pad-custom[style*="--s-px"]>.cd-product.g-edge .cd-gallery{margin-inline:calc(var(--s-px) * -1)}
  .cd-product.g-edge .cd-gallery-main:not(#cd),.cd-product.g-edge .cd-gallery-slide:not(#cd) img{border-radius:0}
  .cd-product.g-edge .cd-thumbs,.cd-product.g-edge .cd-gallery-dots{padding-inline:16px}
  .cd-product.g-edge.g-peek .cd-gallery-main{scroll-padding-inline:16px;padding-inline:16px}
}
@media(min-width:900px){
  .cd-product .cd-product-grid{grid-template-columns:minmax(0,var(--g-media)) minmax(0,1fr)}
  .cd-product.g-media-right .cd-gallery{order:2}
  .cd-product.g-no-sticky .cd-gallery{position:static}
  /* every picture on the page: one under another, or in a grid */
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-gallery-main{display:grid;gap:var(--g-gap);overflow:visible;background:none;border-radius:0}
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-gallery-slide{display:block}
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-thumbs,.cd-product:is(.g-stack,.g-grid,.g-feature) .cd-gallery-dots{display:none}
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-gallery{position:static}
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-product-info{position:sticky;top:16px}
  .cd-product:is(.g-stack,.g-grid,.g-feature).g-no-sticky .cd-product-info{position:static}
  .cd-product:is(.g-grid,.g-feature) .cd-gallery-main{grid-template-columns:1fr 1fr}
  .cd-product.g-feature .cd-gallery-slide:first-child{grid-column:1/-1}
  .cd-product:is(.g-stack,.g-grid,.g-feature) .cd-gallery-slide img{background:var(--soft,#f6f7f9)}
  /* a carousel you scroll sideways, the next picture peeking in */
  .cd-product.g-carousel .cd-gallery-main{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;background:none}
  .cd-product.g-carousel .cd-gallery-slide{display:block;flex:0 0 82%}
  .cd-product.g-carousel .cd-gallery-dots{display:flex}
}

/* ── Product cards: the second picture when pointed at ── */
.cd-card-media .cd-card-alt{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.cd-card-media.is-alt-ready:hover .cd-card-alt,.cd-card-media.is-alt-ready:focus-visible .cd-card-alt{opacity:1}
/* The second picture replaces the first: once it has faded in, the first goes, so a see-through or
   smaller second picture never shows the first one behind it. It comes back at once on leaving. */
.cd-card-media.is-alt-ready:hover>img:not(.cd-card-alt),.cd-card-media.is-alt-ready:focus-visible>img:not(.cd-card-alt),.tc.tc:hover .tc-img:has(~.tc-img-2){opacity:0;transition:opacity .15s ease}

/* ── Hero: video, several pictures, movement, time bar, phone height ── */
.cd-hero2-media.is-video{overflow:hidden}
.cd-hero2-media.is-video>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cd-hero2.fit-contain .cd-hero2-media.is-video>*{object-fit:contain}
.cd-hero2-video{opacity:0;transition:opacity .8s ease}
.cd-hero2-video.is-playing{opacity:1}
.cd-hero2.is-image .cd-hero2-media.is-video{position:relative;aspect-ratio:16/9}
.cd-collage{display:grid;gap:4px;overflow:hidden}
.cd-collage-item{position:relative;display:block;min-height:0;overflow:hidden;background:rgba(0,0,0,.06)}
.cd-collage-item img{display:block;width:100%;height:100%;object-fit:cover}
.cd-collage-mosaic{grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr}
.cd-collage-mosaic .cd-collage-item:first-child{grid-row:1/-1}
.cd-collage-mosaic.cd-collage-n1{grid-template-columns:1fr;grid-template-rows:1fr}
.cd-collage-mosaic.cd-collage-n2{grid-template-columns:1fr 1fr;grid-template-rows:1fr}
.cd-collage-mosaic.cd-collage-n3{grid-template-columns:2fr 1fr}
.cd-collage-mosaic.cd-collage-n4 .cd-collage-item:last-child{grid-column:2/-1}
.cd-collage-columns{grid-auto-flow:column;grid-auto-columns:1fr}
.cd-collage-strip{display:block}
.cd-collage-track{display:flex;gap:4px;height:100%;width:max-content;animation:cd-strip 40s linear infinite}
.cd-collage-strip .cd-collage-item{height:100%;aspect-ratio:3/4;flex:0 0 auto}
[dir="rtl"] .cd-collage-track{animation-direction:reverse}
@keyframes cd-strip{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:749px){
  .cd-collage-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:2fr 1fr}
  .cd-collage-mosaic .cd-collage-item:first-child{grid-column:1/-1;grid-row:auto}
  .cd-collage-mosaic .cd-collage-item:nth-child(n+4){display:none}
  .cd-collage-columns .cd-collage-item:nth-child(n+3){display:none}
}
.cd-hero2.mo-zoom .cd-hero2-slide.is-active .cd-hero2-media img,.cd-hero2.mo-zoom .cd-hero2-slide.is-active .cd-hero2-video{animation:cd-kenburns 14s ease-out both}
@keyframes cd-kenburns{from{transform:scale(1)}to{transform:scale(1.1)}}
.cd-hero2-progress{position:absolute;inset-inline:0;bottom:0;z-index:3;height:3px;background:rgba(255,255,255,.25)}
.cd-hero2-progress>span{display:block;height:100%;width:0;background:#fff}
[dir="rtl"] .cd-hero2-progress>span{margin-inline-start:auto}
.cd-hero-btn+.cd-hero-btn{margin-inline-start:10px}
@media(max-width:749px){
  .cd-hero2.m-short .cd-hero2-slide{min-height:240px}
  .cd-hero2.m-medium .cd-hero2-slide{min-height:340px}
  .cd-hero2.m-tall .cd-hero2-slide{min-height:72svh}
  .cd-hero2.m-screen .cd-hero2-slide{min-height:calc(100svh - var(--cd-header-h,64px))}
  .cd-hero-btn+.cd-hero-btn{margin-inline-start:0;margin-top:10px}
}
@media(prefers-reduced-motion:reduce){.cd-collage-track,.cd-hero2.mo-zoom .cd-hero2-media img,.cd-hero2.mo-zoom .cd-hero2-video{animation:none!important}.cd-hero2-video{transition:none}}

/* Never wider than the phone: whatever a theme or a section draws, the page never scrolls sideways
   (clip, not hidden: sticky headers and product columns keep working). The body is clipped too and
   never "hidden": with html clipped, a body set to hidden becomes its own scroll box, and every
   sticky element inside it (themes set body{overflow-x:hidden}) stopped sticking. */
@supports (overflow:clip){html,html body{overflow-x:clip}}
@supports not (overflow:clip){body{overflow-x:hidden}}

/* The store takes no payments for the moment (Settings › Payments): said plainly where the buy buttons were. */
.cd-payments-off{margin:16px 0;padding:14px 16px;border:1px solid color-mix(in srgb,currentColor 18%,transparent);border-radius:12px;font-size:14px;line-height:1.5;text-align:center}

/* ── Product page layouts (Product page › Page layout). Classic keeps the rules above. ── */
/* One picture: it always fills the gallery, never a thumbnail-sized corner. */
.cd-product.g-single .cd-gallery{display:block}
.cd-product.g-single .cd-gallery-main{display:block;grid-template-columns:none}
.cd-product.g-single .cd-gallery-slide{display:block;width:100%;flex-basis:100%;grid-column:auto}
.cd-product.g-single .cd-gallery-slide img{width:100%}
@media(min-width:900px){
  /* Split and wide: the pictures run to the screen edge, the details keep their own margin. */
  .cd-product:is(.pl-edge,.pl-edge_wide){max-width:none;margin:0;padding:0}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-product-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:start}
  .cd-product.pl-edge_wide .cd-product-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-gallery{top:0}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-gallery-main,.cd-product:is(.pl-edge,.pl-edge_wide) .cd-gallery-slide img{border-radius:0}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-gallery-slide img{width:100%;min-height:min(100svh,900px);max-height:none;height:auto;object-fit:cover}
  .cd-product:is(.pl-edge,.pl-edge_wide):is(.g-stack,.g-grid,.g-feature) .cd-gallery-slide img{min-height:0}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-thumbs{padding:12px clamp(16px,2vw,32px)}
  .cd-product:is(.pl-edge,.pl-edge_wide) .cd-product-info{width:100%;max-width:620px;margin-inline:auto;padding:clamp(32px,5vw,88px) clamp(24px,4vw,72px);position:sticky;top:0}
  .cd-product:is(.pl-edge,.pl-edge_wide).g-no-sticky .cd-product-info{position:static}
  /* Centred: the pictures across the page, the details in a narrower column under them. */
}

/* ── Product page designs (Product page › Page design). Structure only: type, colours and
   buttons stay the theme's. Every design is one column on phones. ── */

/* Editorial: big pictures one under another, slim details that follow the scroll */
.cd-product.pd-editorial .cd-product-title{font-size:clamp(1.9rem,3.4vw,3rem);line-height:1.02;letter-spacing:-.02em}
.cd-product.pd-editorial .cd-product-price{font-size:1.1rem}
.cd-product.pd-editorial .cd-product-price strong{font-weight:500}
.cd-product.pd-editorial .cd-tabs details{border-top:1px solid var(--line,#e5e7eb);padding:16px 0}
.cd-product.pd-editorial .cd-tabs summary{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.cd-product.pd-editorial .cd-assurances{background:none;padding:0;border-radius:0}
@media(min-width:900px){
  .cd-product.pd-editorial .cd-product-grid:not(#cd){grid-template-columns:minmax(0,62%) minmax(0,1fr);gap:clamp(32px,5vw,88px)}
  .cd-product.pd-editorial .cd-product-info{position:sticky;top:24px;padding-block:12px;max-width:440px}
  .cd-product.pd-editorial.g-media-right .cd-gallery{order:2}
}

/* Showcase: the product on a panel, the details in a card with a big name */
.cd-product.pd-showcase .cd-product-title{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1;letter-spacing:-.03em}
.cd-product.pd-showcase .cd-gallery-main:not(#cd){background:var(--soft,#f4f4f2);border-radius:var(--image-radius,18px)}
.cd-product.pd-showcase .cd-gallery-slide:not(#cd) img{object-fit:contain;background:transparent;padding:clamp(8px,4%,40px);box-sizing:border-box}
.cd-product.pd-showcase:is(.g-stack,.g-grid,.g-feature) .cd-gallery-main:not(#cd){background:none;border-radius:0}
.cd-product.pd-showcase:is(.g-stack,.g-grid,.g-feature) .cd-gallery-slide:not(#cd) img{background:var(--soft,#f4f4f2);border-radius:var(--image-radius,18px)}
.cd-product.pd-showcase .cd-product-info{border:1px solid var(--line,#e5e7eb);border-radius:var(--radius,16px);padding:clamp(18px,2.4vw,28px);background:var(--card,#fff)}
@media(min-width:900px){
  .cd-product.pd-showcase .cd-product-grid:not(#cd){grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:28px}
  .cd-product.pd-showcase .cd-product-info{position:sticky;top:20px}
}

/* Lookbook: tall pictures beside the details, a big name, the story read like a page */
.cd-product.pd-lookbook .cd-gallery-slide:not(#cd) img{aspect-ratio:3/4;height:auto}
.cd-product.pd-lookbook .cd-product-title{font-size:clamp(2rem,3.6vw,3.2rem);line-height:1;letter-spacing:-.03em}
.cd-product.pd-lookbook .cd-prose{font-size:1.02rem;line-height:1.75}
@media(min-width:900px){
  .cd-product.pd-lookbook .cd-product-grid:not(#cd){grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,5vw,80px)}
}

/* Boutique: quiet, narrow details beside the pictures */
.cd-product.pd-boutique .cd-product-title{font-weight:400;letter-spacing:.01em}
.cd-product.pd-boutique .cd-assurances{background:none;border-top:1px solid var(--line,#e5e7eb);border-bottom:1px solid var(--line,#e5e7eb);border-radius:0}
@media(min-width:900px){
  .cd-product.pd-boutique .cd-product-grid:not(#cd){grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(32px,5vw,72px)}
  .cd-product.pd-boutique .cd-product-info{max-width:480px}
}

/* Market: the buy box in a card, price and promises stand out */
.cd-product.pd-market .cd-product-info{background:var(--soft,#f6f7f9);border-radius:var(--radius,16px);padding:clamp(16px,2.4vw,26px)}
.cd-product.pd-market .cd-product-title{font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:700}
.cd-product.pd-market .cd-product-price{font-size:1.7rem}
.cd-product.pd-market .cd-product-price strong{color:var(--pb-price-color,var(--brand,#111));font-weight:800}
.cd-product.pd-market .cd-save{font-size:.9rem;padding:3px 10px}
.cd-product.pd-market .cd-assurances{display:flex;flex-wrap:wrap;gap:8px;padding:0;background:none}
.cd-product.pd-market .cd-assurances li{background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);border-radius:999px;padding:4px 12px;line-height:1.6;font-size:.85rem;color:var(--ink,#0f172a)}
.cd-product.pd-market .cd-option-value{background:var(--card,#fff)}
@media(min-width:900px){
  .cd-product.pd-market .cd-product-grid:not(#cd){grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
  .cd-product.pd-market .cd-product-info{position:sticky;top:20px}
}

/* ── Footer layouts: split, stacked, wordmark ── */
.cd-footer--split:not(.has-colors){background:var(--ink,#111);color:var(--bg,#fff);border-top:0}
.cd-footer--split:not(.has-colors) :is(.cd-footer-col a,.cd-footer-col span,.cd-footer-about p,.cd-footer-bottom){color:color-mix(in srgb,var(--bg,#fff) 70%,transparent)}
.cd-footer--split:not(.has-colors) .cd-footer-col a:hover{color:var(--bg,#fff)}
.cd-footer--split:not(.has-colors) .cd-footer-bottom{border-top-color:color-mix(in srgb,var(--bg,#fff) 16%,transparent)}
.cd-footer--split .cd-footer-inner{padding-block:clamp(40px,7vw,88px)}
.cd-footer--split .cd-footer-brand{font-family:var(--font-heading,inherit);font-size:clamp(1.8rem,4vw,3rem);line-height:1.05;letter-spacing:-.02em;font-weight:500}
.cd-footer--split .cd-footer-about p{font-size:1.02rem;max-width:44ch}
@media(min-width:760px){.cd-footer--split .cd-footer-inner>.cd-footer-about{flex:2.4 1 360px;margin-inline-end:auto}}
.cd-footer--stacked .cd-footer-inner{padding-block:clamp(36px,6vw,72px)}
.cd-footer--stacked .cd-footer-col{gap:4px}
.cd-footer--stacked .cd-footer-col strong{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted,#64748b);font-weight:600;margin-bottom:10px}
.cd-footer--stacked .cd-footer-col a{font-family:var(--font-heading,inherit);font-size:clamp(1.25rem,2.2vw,1.7rem);line-height:1.25;color:var(--ink,#0f172a);letter-spacing:-.01em;transition:opacity .2s}
.cd-footer--stacked .cd-footer-col a:hover{opacity:.6}
.cd-footer--stacked.has-colors .cd-footer-col a{color:var(--ftr-fg)}
.cd-footer--wordmark{overflow:hidden}
.cd-footer-mark{font-family:var(--font-heading,inherit);font-weight:700;font-size:clamp(3.4rem,15.5vw,15rem);line-height:.8;letter-spacing:-.05em;text-align:center;white-space:nowrap;padding:8px 8px 0;margin-bottom:-.12em;opacity:.95;overflow:hidden;text-overflow:clip}

/* ── Collection page top: banner (name over the collection picture) and split ── */
.cd-chead-banner{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--image-radius,16px);min-height:clamp(200px,32vw,380px);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(20px,4vw,48px);color:#fff;margin-bottom:24px}
.cd-chead-banner .cd-chead-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.cd-chead-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.05) 70%)}
.cd-chead-banner h1{color:#fff;font-size:clamp(2rem,5vw,3.6rem);line-height:1}
.cd-chead-banner :is(.cd-page-sub,.cd-count){color:rgba(255,255,255,.85)}
.cd-chead-split h1{font-size:clamp(2.4rem,7vw,5.6rem);line-height:.92;letter-spacing:-.04em}
@media(min-width:900px){.cd-chead-split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:12px 48px;text-align:start}.cd-chead-split h1{grid-row:span 2}}

/* ── Sections that sell (platform: every theme) ───────────────────────────────
   Product spotlight, Limited offer, Testimonial slider, Us vs others, Guarantee, How to order,
   Scrolling promises, Shop the look. Colours and radii come from the theme's variables. */
.cd-stars{--v:50;display:inline-block;width:5.4em;height:1em;font-size:16px;background:linear-gradient(90deg,var(--star,#f5a524) calc(var(--v) * 2%),var(--line,#e5e7eb) 0);-webkit-mask:var(--cd-star-mask) 0 0/100% 100% no-repeat;mask:var(--cd-star-mask) 0 0/100% 100% no-repeat;vertical-align:-2px}
:root{--cd-star-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 108 20'%3E%3Cpath d='M10 1l2.7 5.6 6.1.9-4.4 4.3 1 6.1L10 15l-5.4 2.9 1-6.1L1.2 7.5l6.1-.9zM32 1l2.7 5.6 6.1.9-4.4 4.3 1 6.1L32 15l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9zM54 1l2.7 5.6 6.1.9-4.4 4.3 1 6.1L54 15l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9zM76 1l2.7 5.6 6.1.9-4.4 4.3 1 6.1L76 15l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9zM98 1l2.7 5.6 6.1.9-4.4 4.3 1 6.1L98 15l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z'/%3E%3C/svg%3E")}

/* Product spotlight */
.cd-spot{display:grid;gap:28px;align-items:center}
@media(min-width:860px){.cd-spot{grid-template-columns:1.05fr 1fr;gap:56px}.cd-spot--right .cd-spot-media{order:2}}
.cd-spot--stacked{grid-template-columns:1fr!important}
.cd-spot-media{position:relative;aspect-ratio:1/1;border-radius:var(--image-radius,var(--radius,16px));overflow:hidden;background:var(--soft,#f6f7f9)}
.cd-spot--stacked .cd-spot-media{aspect-ratio:16/9}
.cd-spot-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.cd-spot-media .cd-spot-alt{opacity:0}
.cd-spot-media:hover img:first-child{transform:scale(1.03)}
.cd-spot-media:hover .cd-spot-alt{opacity:1}
.cd-spot-save{position:absolute;top:14px;inset-inline-start:14px;background:var(--danger,#dc2626);color:#fff;font-weight:800;font-size:14px;padding:6px 12px;border-radius:999px;box-shadow:0 8px 20px -8px rgba(0,0,0,.4)}
.cd-spot-eyebrow{margin:0 0 10px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brand,#111)}
.cd-spot-title{margin:0;text-align:start;font-family:var(--font-heading,inherit);font-size:clamp(1.6rem,3.6vw,2.6rem);line-height:1.1}
.cd-spot-title a{color:inherit;text-decoration:none}
.cd-spot-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin:16px 0 0;font-size:1.5rem}
.cd-spot-price s{font-size:1rem;color:var(--muted,#64748b)}
.cd-spot-you-save{font-size:.8rem;font-weight:700;color:var(--danger,#dc2626);background:color-mix(in srgb,var(--danger,#dc2626) 10%,transparent);padding:3px 9px;border-radius:999px}
.cd-spot-points{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px}
.cd-spot-points li{display:flex;gap:10px;align-items:flex-start;line-height:1.45}
.cd-spot-tick{flex:none;display:inline-flex;width:22px;height:22px;border-radius:999px;align-items:center;justify-content:center;background:color-mix(in srgb,var(--brand,#111) 12%,transparent);color:var(--brand,#111)}
.cd-spot-desc{margin:18px 0 0;color:var(--muted,#64748b);line-height:1.6}
.cd-spot-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.cd-spot-actions .cd-btn{min-height:50px;padding-inline:26px;font-size:1rem;transition:transform .2s ease,box-shadow .2s ease}
.cd-spot-buy{flex:1 1 220px;box-shadow:0 14px 30px -14px var(--brand,#111)}
.cd-spot-actions .cd-btn:hover{transform:translateY(-1px)}
.cd-spot-actions .is-disabled{opacity:.6;cursor:default}
.cd-spot-note{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:.9rem;color:var(--muted,#64748b)}

/* Limited offer */
.cd-offer{display:grid;gap:24px;align-items:center;border-radius:var(--radius,18px);padding:32px 24px;margin-block:12px;max-width:calc(var(--page-width,1200px) - 32px)}
@media(min-width:860px){.cd-offer{grid-template-columns:1.3fr 1fr;padding:44px 48px}}
.cd-offer--bold{background:var(--brand,#111);color:var(--on-brand,#fff)}
.cd-offer--soft{background:var(--soft,#f6f7f9)}
.cd-offer--outline{border:2px dashed var(--brand,#111)}
.cd-offer.is-done{display:none}
.cd-offer-eyebrow{display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.cd-offer-title{margin:0;text-align:start;font-family:var(--font-heading,inherit);font-size:clamp(1.5rem,3.4vw,2.4rem);line-height:1.1;color:inherit}
.cd-offer-text{margin:12px 0 0;opacity:.8;line-height:1.55;max-width:56ch}
.cd-offer-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;align-items:center}
.cd-offer--bold .cd-offer-btn{background:var(--on-brand,#fff);color:var(--brand,#111)}
.cd-offer-code{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:8px 14px;border:1.5px dashed currentColor;border-radius:var(--btn-radius,10px);background:transparent;color:inherit;font:inherit;cursor:pointer;transition:background .2s ease}
.cd-offer-code:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.cd-offer-code b{letter-spacing:.08em;transition:opacity .2s ease}
.cd-offer-code-label{font-size:.8rem;opacity:.75}
.cd-offer-code.is-copied b{opacity:.55}
.cd-offer-clock-label{margin:0 0 10px;font-size:.85rem;font-weight:700;opacity:.8}
.cd-offer-cells{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cd-offer-cell{display:flex;flex-direction:column;align-items:center;padding:14px 4px;border-radius:calc(var(--radius,14px) * .8);background:color-mix(in srgb,currentColor 10%,transparent)}
.cd-offer-cell b{font-size:clamp(1.5rem,4vw,2.2rem);line-height:1;font-variant-numeric:tabular-nums}
.cd-offer-cell small{margin-top:6px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.75}

/* Testimonial slider */
.cd-testi-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.cd-testi-head h2{margin:0}
.cd-testi-avg{display:flex;align-items:center;gap:8px;margin:8px 0 0;color:var(--muted,#64748b)}
.cd-testi-avg b{color:var(--ink,#0f172a)}
.cd-testi-card{margin:0;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:var(--radius,14px);background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);transition:transform .25s ease,box-shadow .25s ease}
.cd-testi-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -26px rgba(15,23,42,.45)}
.cd-testi--plain .cd-testi-card{background:transparent;border:0;padding:6px 0}
.cd-testi--quote .cd-testi-card blockquote{font-family:var(--font-heading,inherit);font-size:1.2rem}
.cd-testi--quote .cd-testi-card blockquote::before{content:"\201C";display:block;font-size:3rem;line-height:.6;color:var(--brand,#111);margin-bottom:6px}
.cd-testi-card blockquote{margin:0;line-height:1.6;flex:1}
.cd-testi-headline{margin:0;font-weight:700}
.cd-testi-card figcaption{display:flex;align-items:center;gap:10px}
.cd-testi-card figcaption small{display:block;color:var(--muted,#64748b);font-size:.82rem}
.cd-testi-avatar,.cd-testi-initial{width:40px;height:40px;border-radius:999px;object-fit:cover;flex:none}
.cd-testi-initial{display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--brand,#111) 14%,transparent);color:var(--brand,#111);font-weight:800}
.cd-testi-photo-big{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:calc(var(--radius,14px) * .7)}
.cd-testi.is-carousel .cd-grid{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:86%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 10px;scroll-behavior:smooth}
.cd-testi.is-carousel .cd-grid::-webkit-scrollbar{display:none}
.cd-testi.is-carousel .cd-grid>*{scroll-snap-align:start}
@media(min-width:760px){.cd-testi.is-carousel .cd-grid{grid-auto-columns:calc((100% - (var(--cd-cols,3) - 1) * 24px) / var(--cd-cols,3))}}

/* Us vs others */
.cd-vs-table{max-width:760px;margin:0 auto;border-radius:var(--radius,16px);overflow:hidden;border:1px solid var(--line,#e5e7eb);background:var(--card,#fff)}
.cd-vs-row{display:grid;grid-template-columns:1.6fr 1fr 1fr;align-items:center}
.cd-vs-row+.cd-vs-row{border-top:1px solid var(--line,#e5e7eb)}
.cd-vs-row>span{padding:14px 12px;text-align:center}
.cd-vs-row>.cd-vs-label{text-align:start;font-weight:600;padding-inline-start:18px}
.cd-vs-headrow{font-weight:800}
.cd-vs-headrow>span{padding-block:18px}
.cd-vs-us{align-self:stretch;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--brand,#111) 8%,transparent);font-weight:700}
.cd-vs-them{align-self:stretch;display:flex;align-items:center;justify-content:center;color:var(--muted,#64748b)}
.cd-vs-headrow .cd-vs-us{background:var(--brand,#111);color:var(--on-brand,#fff);flex-direction:column;gap:6px}
.cd-vs-headrow .cd-vs-us img{width:44px;height:44px;border-radius:10px;object-fit:cover}
.cd-vs-yes,.cd-vs-no{display:inline-flex;width:28px;height:28px;border-radius:999px;align-items:center;justify-content:center}
.cd-vs-yes{background:var(--brand,#16a34a);color:var(--on-brand,#fff)}
.cd-vs-yes.is-muted{background:var(--line,#e5e7eb);color:var(--ink,#0f172a)}
.cd-vs-no{background:color-mix(in srgb,var(--danger,#dc2626) 12%,transparent);color:var(--danger,#dc2626)}
.cd-vs-cta,.cd-steps-cta{text-align:center;margin:26px 0 0}
@media(max-width:520px){.cd-vs-row{grid-template-columns:1.3fr 1fr 1fr;font-size:.9rem}.cd-vs-row>span{padding:12px 6px}}

/* Guarantee */
.cd-guar-box{display:grid;gap:24px;align-items:center;justify-items:center;text-align:center;padding:28px 20px;border-radius:var(--radius,18px)}
@media(min-width:760px){.cd-guar-box{grid-template-columns:auto 1fr;justify-items:start;text-align:start;gap:44px;padding:40px 48px}}
.cd-guar--card .cd-guar-box{background:var(--card,#fff);border:1px solid var(--line,#e5e7eb);box-shadow:0 24px 50px -36px rgba(15,23,42,.45)}
.cd-guar--brand .cd-guar-box{background:var(--brand,#111);color:var(--on-brand,#fff)}
.cd-guar--brand .cd-page-sub{color:inherit;opacity:.8}
.cd-guar-seal{position:relative;width:170px;height:170px;flex:none;color:var(--brand,#111)}
.cd-guar--brand .cd-guar-seal{color:var(--on-brand,#fff)}
.cd-guar-seal img{width:100%;height:100%;object-fit:contain}
.cd-guar-ring{position:absolute;inset:0;width:100%;height:100%;animation:cd-spin 24s linear infinite}
.cd-guar-ring text{font-size:14px;font-weight:800;letter-spacing:2px;fill:currentColor}
[dir="rtl"] .cd-guar-ring text{letter-spacing:0;font-size:15px}
.cd-guar-core{position:absolute;inset:34px;border-radius:999px;border:2px solid currentColor;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.cd-guar-core b{font-size:1.7rem;line-height:1;font-weight:900}
.cd-guar-copy h2{margin:0 0 8px;text-align:inherit}
.cd-guar-points{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center}
@media(min-width:760px){.cd-guar-points{justify-content:flex-start}}
.cd-guar-points li{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.cd-guar-points li>span{display:inline-flex;color:var(--brand,#111)}
.cd-guar--brand .cd-guar-points li>span{color:inherit}
@keyframes cd-spin{to{transform:rotate(360deg)}}

/* How to order */
.cd-steps-list{list-style:none;margin:0;padding:0;display:grid;gap:22px}
@media(min-width:760px){.cd-steps-list{grid-template-columns:repeat(var(--cd-steps,4),minmax(0,1fr));gap:24px}}
.cd-step{position:relative;text-align:center;padding:4px 8px}
.cd-steps--cards .cd-step{padding:24px 18px;border-radius:var(--radius,14px);background:var(--card,#fff);border:1px solid var(--line,#e5e7eb)}
.cd-step h3{margin:14px 0 6px;font-size:1.05rem}
.cd-step p{margin:0;color:var(--muted,#64748b);line-height:1.55;font-size:.95rem}
.cd-step-badge{position:relative;z-index:1;display:inline-flex;width:64px;height:64px;border-radius:999px;align-items:center;justify-content:center;background:var(--brand,#111);color:var(--on-brand,#fff);box-shadow:0 0 0 8px var(--bg,#fff)}
.cd-step-badge b{position:absolute;top:-4px;inset-inline-end:-4px;width:24px;height:24px;border-radius:999px;background:var(--ink,#0f172a);color:var(--bg,#fff);font-size:12px;display:flex;align-items:center;justify-content:center}
@media(min-width:760px){.cd-steps--line .cd-step:not(:last-child)::after{content:"";position:absolute;top:36px;inset-inline-start:calc(50% + 40px);width:calc(100% - 56px);border-top:2px dashed color-mix(in srgb,var(--brand,#111) 45%,transparent)}}

/* Scrolling promises */
.cd-marquee{overflow:hidden;padding:14px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.cd-marquee--brand{background:var(--brand,#111);color:var(--on-brand,#fff);-webkit-mask:none;mask:none}
.cd-marquee--dark{background:var(--ink,#0f172a);color:var(--bg,#fff);-webkit-mask:none;mask:none}
.cd-marquee--soft{background:var(--soft,#f6f7f9)}
.cd-marquee-track{display:flex;width:max-content;animation:cd-marquee var(--cd-mq-speed,30s) linear infinite}
.cd-marquee.is-reverse .cd-marquee-track{animation-direction:reverse}
.cd-marquee:hover .cd-marquee-track{animation-play-state:paused}
[dir="rtl"] .cd-marquee-track{animation-name:cd-marquee-rtl}
.cd-marquee-list{display:flex;list-style:none;margin:0;padding:0}
.cd-marquee-list li{display:inline-flex;align-items:center;gap:10px;padding-inline:28px;white-space:nowrap;font-weight:700;letter-spacing:.02em}
.cd-marquee-list li::after{content:"";width:6px;height:6px;border-radius:999px;background:currentColor;opacity:.4;margin-inline-start:28px;margin-inline-end:-28px}
.cd-marquee--big{padding:22px 0}
.cd-marquee--big .cd-marquee-list li{font-family:var(--font-heading,inherit);font-size:clamp(1.4rem,4vw,2.6rem);text-transform:uppercase}
.cd-marquee-icon{display:inline-flex;opacity:.9}
@keyframes cd-marquee{to{transform:translateX(-50%)}}
@keyframes cd-marquee-rtl{to{transform:translateX(50%)}}

/* Shop the look */
.cd-look-grid{display:grid;gap:24px;align-items:center}
@media(min-width:860px){.cd-look-grid{grid-template-columns:1.4fr 1fr;gap:40px}.cd-look.is-flipped .cd-look-media{order:2}}
.cd-look-media{position:relative;border-radius:var(--image-radius,var(--radius,16px));background:var(--soft,#f6f7f9);aspect-ratio:4/3}
.cd-look-media>img,.cd-look-collage{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;overflow:hidden}
.cd-look-collage{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.cd-look-collage>*{width:100%;height:100%;min-height:0;object-fit:cover}
.cd-look-spot{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:2}
.cd-look-dot{position:relative;width:30px;height:30px;border-radius:999px;border:0;padding:0;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.3);cursor:pointer;display:flex;align-items:center;justify-content:center}
.cd-look-dot span{width:10px;height:10px;border-radius:999px;background:var(--brand,#111);transition:transform .2s ease}
.cd-look-dot::before{content:"";position:absolute;inset:-6px;border-radius:999px;border:2px solid #fff;opacity:.8;animation:cd-look-ping 2.4s ease-out infinite}
.cd-look-dot[aria-expanded="true"] span{transform:scale(1.5)}
@keyframes cd-look-ping{0%{transform:scale(.7);opacity:.9}80%,100%{transform:scale(1.6);opacity:0}}
.cd-look-pop{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);display:flex;gap:10px;align-items:center;width:max-content;max-width:240px;padding:8px 12px 8px 8px;border-radius:12px;background:var(--card,#fff);color:var(--ink,#0f172a);box-shadow:0 18px 40px -16px rgba(0,0,0,.45);animation:cd-pop-in .2s ease both}
.cd-look-pop[hidden]{display:none}
.cd-look-pop img{width:48px;height:48px;border-radius:8px;object-fit:cover}
.cd-look-pop span{display:flex;flex-direction:column;font-size:.85rem;gap:2px}
.cd-look-pop a{color:inherit;font-weight:600;text-decoration:none}
.cd-look-pop s{color:var(--muted,#64748b);font-size:.8em}
@keyframes cd-pop-in{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
.cd-look-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.cd-look-item{display:flex;align-items:center;gap:14px;padding:10px;border-radius:var(--radius,14px);border:1px solid var(--line,#e5e7eb);background:var(--card,#fff);transition:border-color .2s ease}
.cd-look-item:hover{border-color:var(--brand,#111)}
.cd-look-thumb{position:relative;flex:none;width:72px;height:72px;border-radius:10px;overflow:hidden;display:block}
.cd-look-thumb img,.cd-look-thumb .cd-card-blank{width:100%;height:100%;object-fit:cover}
.cd-look-num{position:absolute;top:4px;inset-inline-start:4px;width:20px;height:20px;border-radius:999px;background:var(--brand,#111);color:var(--on-brand,#fff);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.cd-look-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.cd-look-info a{color:inherit;font-weight:600;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-look-info s{color:var(--muted,#64748b);font-size:.85em}
.cd-look-add{flex:none;width:40px;height:40px;border-radius:999px;border:1px solid var(--line,#e5e7eb);background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s ease,color .2s ease}
.cd-look-add:hover{background:var(--brand,#111);color:var(--on-brand,#fff);border-color:transparent}
[dir="rtl"] a.cd-look-add svg{transform:scaleX(-1)}

@media(prefers-reduced-motion:reduce){.cd-marquee-track,.cd-guar-ring,.cd-look-dot::before{animation:none}.cd-marquee{overflow-x:auto}}

/* ── Language & Currency app: the shopper's picker (added to every theme's header/footer) ── */
.cd-loc-slot{display:inline-flex;align-items:center}
.cd-loc-slot-footer{display:flex;justify-content:center;padding:12px 16px}
.cd-loc{position:relative;font-size:12px;line-height:1}
.cd-loc>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 8px;border-radius:999px;color:inherit;font-weight:600;letter-spacing:.02em;white-space:nowrap;opacity:.85;transition:opacity .15s,background-color .15s;-webkit-user-select:none;user-select:none}
.cd-loc>summary::-webkit-details-marker{display:none}
.cd-loc>summary:hover,.cd-loc[open]>summary{opacity:1;background:color-mix(in srgb,currentColor 9%,transparent)}
.cd-loc>summary:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.cd-loc-panel{position:absolute;top:calc(100% + 8px);inset-inline-end:0;z-index:60;width:240px;display:grid;gap:10px;padding:14px;border-radius:14px;background:#fff;color:#111;border:1px solid rgba(0,0,0,.08);box-shadow:0 16px 40px -12px rgba(0,0,0,.28);text-align:start;font-size:13px;transform-origin:top right;animation:cd-loc-in .16s ease-out}
[dir=rtl] .cd-loc-panel{transform-origin:top left}
.cd-loc-slot-footer .cd-loc-panel{top:auto;bottom:calc(100% + 8px);inset-inline-end:auto;inset-inline-start:50%;transform:translateX(-50%);transform-origin:bottom center;animation-name:cd-loc-up}
[dir=rtl] .cd-loc-slot-footer .cd-loc-panel{transform:translateX(50%)}
@keyframes cd-loc-in{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:none}}
@keyframes cd-loc-up{from{opacity:0;transform:translate(-50%,4px)}to{opacity:1;transform:translateX(-50%)}}
.cd-loc-field{display:grid;gap:5px;font-weight:600;color:#555;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.cd-loc-field select{appearance:none;-webkit-appearance:none;width:100%;height:38px;padding:0 30px 0 10px;border:1px solid #d9d9d9;border-radius:10px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;color:#111;font:inherit;font-size:14px;font-weight:500;text-transform:none;letter-spacing:0}
[dir=rtl] .cd-loc-field select{padding:0 10px 0 30px;background-position:left 10px center}
.cd-loc-field select:focus{outline:2px solid #111;outline-offset:1px}
.cd-loc-go{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 14px;border:0;border-radius:10px;background:#111;color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:opacity .15s}
.cd-loc-go:hover{opacity:.88}
/* First-visit suggestion: a small card at the bottom, never a blocking pop-up. */
.cd-loc-suggest{position:fixed;inset-inline-start:16px;bottom:16px;z-index:70;max-width:320px;padding:14px 16px;border-radius:14px;background:#fff;color:#111;border:1px solid rgba(0,0,0,.08);box-shadow:0 16px 40px -12px rgba(0,0,0,.3);font-size:13px;animation:cd-loc-rise .35s cubic-bezier(.32,.72,0,1) .8s both}
.cd-loc-suggest p{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-weight:600}
.cd-loc-suggest-actions{display:flex;gap:8px;align-items:center}
.cd-loc-stay{color:#555;text-decoration:none;font-weight:500;padding:0 8px}
.cd-loc-stay:hover{color:#111}
@keyframes cd-loc-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:600px){.cd-loc-suggest{inset-inline:12px;bottom:12px;max-width:none}.cd-loc>summary span{display:none}.cd-loc>summary{padding:0 6px}}
@media (prefers-reduced-motion:reduce){.cd-loc-panel,.cd-loc-suggest{animation:none}}
.cd-loc-panel.is-busy{opacity:.6;pointer-events:none;transition:opacity .15s}
/* City hints under the order form's city box (app.js) */
.city-hint{font-size:13px;line-height:1.5;color:#5c5c5c;margin:-2px 0 4px;animation:city-hint-in .18s ease-out}
.city-hint b{color:var(--ink,#0f172a);font-weight:600}
.city-hint-use{font:inherit;font-weight:600;color:var(--brand,var(--ink,#0f172a));background:none;border:0;padding:2px 4px;margin-inline-start:6px;cursor:pointer;text-decoration:underline;text-underline-offset:2px;border-radius:4px}
.city-hint-use:focus-visible{outline:2px solid currentColor;outline-offset:1px}
@keyframes city-hint-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.city-hint{animation:none}}

/* ── Quick view (store.js, body.cd-qv or Theme settings › Product cards › Choose options opens) ──
   The frame settles in the middle, then the picture column rises in, then the details. */
.cd-qv-wrap{position:fixed;inset:0;z-index:2147483300;display:grid;place-items:center;padding:clamp(0px,3vh,40px) clamp(0px,3vw,48px)}
.cd-qv-backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--ink,#111) 42%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .3s ease}
.cd-qv-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:min(1200px,100%);height:min(88vh,860px);background:var(--card,#fff);color:var(--ink,#111);overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.45);opacity:0;transform:scale(.965);transition:opacity .25s ease,transform .4s cubic-bezier(.2,.8,.2,1)}
.cd-qv-media,.cd-qv-info{opacity:0;transform:translateY(28px);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.cd-qv-wrap.is-open .cd-qv-backdrop{opacity:1}
.cd-qv-wrap.is-open .cd-qv-panel{opacity:1;transform:none}
.cd-qv-wrap.is-open .cd-qv-media{opacity:1;transform:none;transition-delay:.12s}
.cd-qv-wrap.is-open .cd-qv-info{opacity:1;transform:none;transition-delay:.24s}
.cd-qv-wrap.is-closing .cd-qv-panel{transform:scale(.98)}
.cd-qv-media{position:relative;background:var(--soft,#f6f7f9);overflow:hidden}
.cd-qv-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.cd-qv-media img.is-on{opacity:1}
.cd-qv-nav{position:absolute;inset-inline-end:0;bottom:0;display:flex;align-items:center;background:var(--card,#fff)}
.cd-qv-nav button{width:52px;height:46px;display:grid;place-items:center;border:0;background:none;color:var(--ink,#111);cursor:pointer;font:inherit}
.cd-qv-nav button+button{border-inline-start:1px solid var(--line,#e5e7eb)}
.cd-qv-nav button:hover{background:var(--soft,#f6f7f9)}
[dir="rtl"] .cd-qv-nav svg{transform:scaleX(-1)}
.cd-qv-info{display:flex;flex-direction:column;gap:14px;padding:clamp(28px,4vw,56px) clamp(22px,3.4vw,52px);overflow-y:auto}
.cd-qv-brand{margin:0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted,#6b7280)}
.cd-qv-title{margin:0;text-align:start;font-family:var(--font-heading,inherit);font-weight:400;font-size:clamp(1.35rem,2.2vw,1.9rem);line-height:1.2}
.cd-qv-price{margin:0;display:flex;align-items:baseline;gap:10px;font-size:1.15rem}
.cd-qv-price s{color:var(--muted,#6b7280);font-size:.9rem}
.cd-qv-label{margin:8px 0 0;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.cd-qv-opts{display:flex;flex-wrap:wrap;gap:8px}
.cd-qv-opt{min-width:54px;padding:11px 12px;border:1px solid var(--line,#e5e7eb);background:transparent;color:var(--ink,#111);font:inherit;font-size:.88rem;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.cd-qv-opt:hover{border-color:var(--ink,#111)}
.cd-qv-opt[aria-pressed="true"]{background:var(--ink,#111);color:var(--bg,#fff);border-color:var(--ink,#111)}
.cd-qv-opts.is-shake,.cd-qv-groups.is-shake{animation:cd-qv-shake .4s ease}
/* Quick view with sizes and colours: a row per option, the chosen value beside its name. */
.cd-qv-groups{display:flex;flex-direction:column;gap:10px}
.cd-qv-groups .cd-qv-label{margin:4px 0 0}
.cd-qv-chosen{color:var(--muted,#6b7280);text-transform:none;letter-spacing:0}
.cd-qv-opt.has-swatch{display:inline-flex;align-items:center;gap:8px}
.cd-qv-swatch{width:16px;height:16px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink,#111) 18%,transparent)}
/* Sold out in the chosen colour: crossed out, but it can be chosen (the buttons then say Sold out). */
.cd-qv-groups .cd-qv-opt.is-sold-out:not(#cd){cursor:pointer}
.cd-qv-groups .cd-qv-opt.is-sold-out[aria-pressed="true"]:not(#cd){border-color:var(--ink,#111);color:var(--ink,#111)}
.cd-qv-groups .cd-qv-opt.is-sold-out .cd-qv-swatch{opacity:.45}
/* A sold-out size or colour stays in the list (cards' Choose options, quick view): the product page's
   sold-out look, in the theme's own colours — greyed, struck through, not clickable. */
:is(.cd-quick-opt,.cd-qv-opt).is-sold-out:not(#cd){position:relative;color:var(--muted,#64748b);background:var(--soft,#f6f7f9);border-color:var(--line,#e5e7eb);text-decoration:line-through;text-decoration-thickness:1px;cursor:not-allowed;opacity:1;filter:none;box-shadow:none;transform:none}
:is(.cd-quick-opt,.cd-qv-opt).is-sold-out:not(#cd):hover{border-color:var(--line,#e5e7eb)}
@keyframes cd-qv-shake{20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
.cd-qv-msg{margin:0;font-size:.85rem;color:#b42318}
.cd-qv-add,.cd-qv-buy{width:100%;padding:16px 18px;font:inherit;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.cd-qv-add{margin-top:10px}
.cd-qv-more{align-self:flex-start;margin-top:4px;color:var(--ink,#111);font-size:.85rem;text-underline-offset:4px}
.cd-qv-close{position:absolute;top:16px;inset-inline-end:16px;z-index:3;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:0;background:color-mix(in srgb,var(--card,#fff) 80%,transparent);color:var(--ink,#111);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 6px 18px -8px rgba(0,0,0,.3);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.cd-qv-close:hover{transform:rotate(90deg)}
html.cd-qv-lock{overflow:hidden}
.cd-qv-actions{display:grid;gap:10px;margin-top:10px}
.cd-qv-actions .cd-qv-add{margin-top:0}
.cd-qv-dots,.cd-qv-grab{display:none}
/* Phones: a sheet from the bottom. Pictures swipe with dots, the details scroll, and the two
   buttons stay pinned at the bottom of the sheet, side by side. */
@media(max-width:760px){
  .cd-qv-wrap{place-items:end stretch;padding:0}
  .cd-qv-panel{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);width:100%;height:auto;max-height:92dvh;max-height:92vh;border-radius:18px 18px 0 0;transform:translateY(100%);transition:opacity .2s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
  .cd-qv-wrap.is-open .cd-qv-panel{transform:none}
  .cd-qv-wrap.is-closing .cd-qv-panel{transform:translateY(100%)}
  .cd-qv-grab{display:block;position:absolute;top:8px;left:50%;z-index:4;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:color-mix(in srgb,var(--card,#fff) 85%,transparent);box-shadow:0 1px 3px rgba(0,0,0,.25)}
  .cd-qv-close{top:12px;width:38px;height:38px}
  .cd-qv-media{display:flex;height:min(48vh,440px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
  .cd-qv-media::-webkit-scrollbar{display:none}
  .cd-qv-media img{position:static;flex:0 0 100%;height:100%;opacity:1;scroll-snap-align:center}
  .cd-qv-nav{display:none}
  .cd-qv-dots{display:flex;gap:6px;position:absolute;left:0;right:0;top:calc(min(48vh,440px) - 20px);z-index:3;justify-content:center;pointer-events:none}
  .cd-qv-dots span{width:6px;height:6px;border-radius:6px;background:color-mix(in srgb,var(--ink,#111) 25%,transparent);transition:width .3s ease,background-color .3s}
  .cd-qv-dots span.is-on{width:18px;background:var(--ink,#111)}
  .cd-qv-info{gap:10px;padding:18px 16px 0;overflow-y:auto;overscroll-behavior:contain}
  .cd-qv-title{font-size:1.25rem}
  .cd-qv-price{font-size:1.05rem}
  .cd-qv-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:6px}
  .cd-qv-opt{min-width:0;padding:10px 4px}
  .cd-qv-more{margin:2px 0 0;font-size:.8rem}
  .cd-qv-actions{position:sticky;bottom:0;grid-template-columns:1fr 1fr;gap:8px;margin:6px -16px 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--card,#fff);border-top:1px solid var(--line,#e5e7eb)}
  .cd-qv-add,.cd-qv-buy{padding:14px 8px;font-size:11px;letter-spacing:.12em}
}
/* The two buttons, plain by default; a theme restyles them like its own buttons. */
.cd-qv-add{background:transparent;color:var(--ink,#111);border:1px solid var(--ink,#111);border-radius:var(--btn-radius,0)}
.cd-qv-buy{background:var(--brand,var(--ink,#111));color:var(--on-brand,var(--bg,#fff));border:1px solid transparent;border-radius:var(--btn-radius,0)}
:is(.cd-qv-add,.cd-qv-buy):disabled:not(.is-loading){opacity:.5;cursor:not-allowed}
/* Quick view › Back in Stock: when a pre-order ships, and the "Notify me" form, in the theme's look. */
.cd-qv-note{margin:0;padding:9px 12px;border-radius:var(--radius,8px);background:var(--bis-pre-bg,#fff7ed);color:var(--bis-pre-color,#9a3412);font-size:.85rem;font-weight:600}
.cd-qv-notify{display:grid;gap:10px;padding:16px;border:1px solid var(--line,#e5e7eb);border-radius:var(--radius,10px);background:var(--soft,#f6f7f9);animation:cd-qv-rise .35s cubic-bezier(.2,.8,.2,1) both}
.cd-qv-notify[hidden]{display:none}
.cd-qv-notify-title{margin:0;font-family:var(--font-heading,inherit);font-size:1.05rem;font-weight:600}
.cd-qv-notify-text{margin:-4px 0 0;font-size:.85rem;color:var(--muted,#6b7280)}
.cd-qv-notify-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cd-qv-notify-row[hidden],.cd-qv-notify-send[hidden],.cd-qv-notify-done[hidden]{display:none}
.cd-qv-notify-input{flex:1 1 160px;min-width:0;height:46px;padding:0 14px;border:1px solid var(--line,#d1d5db);border-radius:calc(var(--radius,10px) * .6);background:var(--bg,#fff);color:var(--ink,#111);font:inherit;font-size:16px}
.cd-qv-notify-input:focus{outline:2px solid var(--brand,var(--ink,#111));outline-offset:1px}
.cd-qv-notify-or{font-size:.8rem;color:var(--muted,#6b7280)}
.cd-qv-notify-done{margin:0;padding:10px 12px;border-radius:calc(var(--radius,10px) * .6);background:color-mix(in srgb,#15803d 10%,transparent);color:#15803d;font-weight:600;text-align:center}
@keyframes cd-qv-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.cd-qv-notify{animation:none}}
/* Back in Stock: a sold-out size that can still be pre-ordered stays crossed out, with a small
   "Pre-order" tag on its corner (product page and quick view), and the quick view's picture says it. */
.cd-preorder-tag{position:absolute;top:-9px;left:50%;transform:translateX(-50%);z-index:2;padding:1px 6px;border-radius:999px;background:var(--bis-pre-color,#9a3412);color:#fff;
  font-size:9.5px;font-weight:700;line-height:1.5;letter-spacing:.02em;text-transform:none;text-decoration:none!important;white-space:nowrap;pointer-events:none}
.cd-preorder-tag[hidden]{display:none}
.cd-option-value.is-preorder:not(#cd),.cd-qv-opt:has(> .cd-preorder-tag:not([hidden])):not(#cd){cursor:pointer;overflow:visible}
.cd-option-value{position:relative}
.cd-qv-badge{position:absolute;top:14px;inset-inline-start:14px;z-index:2;padding:4px 10px;border-radius:999px;background:var(--bis-pre-color,#9a3412);color:#fff;font-size:.75rem;font-weight:700;animation:cd-qv-rise .3s ease both}
.cd-qv-badge[hidden]{display:none}
.cd-card-media.is-alt-ready:hover .cd-card-alt,.cd-card-media.is-alt-ready:focus-visible .cd-card-alt,.tc.tc:hover .tc-img.tc-img-2{transition:opacity .15s ease}
/* Collection filters by size, colour…: chips that read as chosen, the count beside each. */
.cd-filter-opt{display:flex;flex-direction:column;gap:8px}
.cd-filter-values{display:flex;flex-wrap:wrap;gap:6px}
.cd-filter-chip{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 11px;border:1px solid var(--line,#e5e7eb);border-radius:var(--btn-radius,999px);font-size:.85rem;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease}
.cd-filter-chip:hover{border-color:currentColor}
.cd-filter-chip input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.cd-filter-chip:has(input:checked){border-color:var(--ink,#111);background:var(--ink,#111);color:var(--bg,#fff)}
.cd-filter-chip:has(input:focus-visible){outline:2px solid var(--ink,#111);outline-offset:2px}
.cd-filter-sw{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.cd-filter-chip:has(input:checked) .cd-filter-sw{box-shadow:0 0 0 1.5px rgba(255,255,255,.75)}
.cd-filter-n{font-size:.75rem;opacity:.55}

/* Product details blocks: a value the seller set wins over the theme's own product title / price
   styles (themes write .x .cd-product-title{…}); unset, the theme's look stays. */
.pb-title[style*="--pb-title-size"] .cd-product-title:not(#cd):not(#pb){font-size:var(--pb-title-size)}
.pb-title[style*="--pb-title-weight"] .cd-product-title:not(#cd):not(#pb){font-weight:var(--pb-title-weight)}
.pb-title[style*="--pb-title-color"] .cd-product-title:not(#cd):not(#pb){color:var(--pb-title-color)}
.pb-title .cd-product-title.is-upper:not(#cd):not(#pb){text-transform:uppercase;letter-spacing:.04em}
.pb-price[style*="--pb-price-size"] .cd-product-price:not(#cd):not(#pb){font-size:var(--pb-price-size)}
.pb-price[style*="--pb-price-size"] .cd-product-price strong:not(#cd):not(#pb){font-size:inherit}
/* 700 is the default weight: only a weight the seller changed overrides the theme. */
.pb-price:is([style*="--pb-price-weight:4"],[style*="--pb-price-weight:5"],[style*="--pb-price-weight:6"],[style*="--pb-price-weight:8"]) .cd-product-price strong:not(#cd):not(#pb){font-weight:var(--pb-price-weight)}
.pb-price[style*="--pb-price-color"] .cd-product-price strong:not(#cd):not(#pb){color:var(--pb-price-color)}
.pb-price[style*="--pb-compare-color"] .cd-product-price s:not(#cd):not(#pb){color:var(--pb-compare-color)}
.pb-price[style*="--pb-save-bg"] .cd-save:not(#cd):not(#pb){background:var(--pb-save-bg)}
.pb-price[style*="--pb-save-color"] .cd-save:not(#cd):not(#pb){color:var(--pb-save-color)}
/* A shop with no products yet: the note in place of the buy buttons on its theme's sample products */
.sample-note{margin:14px 0;padding:14px 16px;border:1px dashed color-mix(in srgb,currentColor 30%,transparent);border-radius:var(--field-radius,10px);background:color-mix(in srgb,currentColor 4%,transparent);font-size:14px;line-height:1.5;opacity:.85}
/* Sample products (an empty shop) can't be added: every theme's card button, hidden */
[data-quick-add][data-product-id^="demo-"]{display:none!important}

/* base.css */
/* CODOS Pages — base styles. Themes (themes/<key>.css) override the tokens below
   and a few signature details; sections only use tokens, so every section works in
   every theme. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --brand:#16a34a;--font:system-ui,sans-serif;--font-heading:var(--font);
  --ink:#0f172a;--muted:#64748b;--line:#e2e8f0;
  --bg:#f8fafc;--card:#ffffff;--soft:#f8fafc;
  --radius:12px;--btn-radius:12px;--field-radius:10px;
  --shadow:0 6px 16px -6px var(--brand);
  --heading-weight:800;--heading-transform:none;--heading-spacing:0;
  --on-brand:#ffffff;--accent:#f59e0b;--danger:#dc2626;
}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,iframe{max-width:100%;display:block}
.page{max-width:560px;margin:0 auto;background:var(--card);min-height:100vh;padding-bottom:88px}
.block{padding:20px 18px}
.center{text-align:center}
.empty{padding:80px 20px}
h1,h2,h3{line-height:1.3;margin:0 0 12px;font-family:var(--font-heading);font-weight:var(--heading-weight);text-transform:var(--heading-transform);letter-spacing:var(--heading-spacing)}
h2{font-size:1.3rem;text-align:center}
h3{font-size:1.05rem}
.preview-bar{position:sticky;top:0;z-index:50;background:#0f172a;color:#fff;text-align:center;font-size:13px;padding:6px}

/* Store header */
.store-announcement{background:var(--brand);color:var(--on-brand);text-align:center;font-size:14px;font-weight:600;padding:8px 14px}
.store-announcement a{color:inherit;text-decoration:none}
.store-header{background:var(--card);border-bottom:1px solid var(--line)}
.store-header.is-sticky{position:sticky;top:0;z-index:45}
.store-header-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;max-width:560px;margin:0 auto;padding:10px 16px}
.store-brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-family:var(--font-heading);font-weight:var(--heading-weight);font-size:1.15rem}
.store-logo{width:auto;object-fit:contain}
.logo-sm{height:28px}.logo-md{height:38px}.logo-lg{height:52px}
.store-menu{display:flex;gap:4px 16px;overflow-x:auto;max-width:100%;scrollbar-width:none}
.store-menu a{color:var(--ink);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap;padding:4px 0}
.store-menu a:hover{color:var(--brand)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:var(--on-brand);font-weight:700;font-size:1.05rem;border:0;border-radius:var(--btn-radius);padding:14px 22px;text-decoration:none;cursor:pointer;font-family:inherit;box-shadow:var(--shadow);transition:transform .1s}
.btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.6;cursor:wait}
.btn-block{width:100%}
.btn-whatsapp{background:#25d366;box-shadow:0 6px 16px -6px #25d366}

/* Hero */
.hero-img{width:100%;aspect-ratio:1/1;object-fit:cover}
.hero-title{font-size:1.6rem}
.hero-sub{color:var(--muted);margin:0 0 12px}
.price-row{margin-bottom:14px}
.price{font-size:1.7rem;font-weight:800;color:var(--brand)}
.hero .btn{width:100%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}

/* Lists & cards */
.gallery{display:grid;gap:10px}
.gallery img{border-radius:var(--radius);width:100%}
.benefits{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.benefits li{display:flex;gap:10px;align-items:center;background:var(--soft);border-radius:var(--field-radius);padding:10px 12px;font-weight:600}
.check{display:inline-flex;width:24px;height:24px;flex-shrink:0;align-items:center;justify-content:center;border-radius:50%;background:var(--brand);color:var(--on-brand);font-size:14px}

/* Offers */
.offers{display:grid;gap:10px;margin-bottom:14px}
.offer{display:flex;align-items:center;gap:10px;width:100%;border:2px solid var(--line);border-radius:var(--radius);padding:12px 14px;background:var(--card);cursor:pointer;font:inherit;color:inherit;text-align:start}
.offer.selected{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--card))}
.offer input{accent-color:var(--brand);width:18px;height:18px;margin:0}
.offer-label{flex:1;font-weight:700}
.offer-price{font-weight:800;color:var(--brand)}
.badge{background:var(--accent);color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:2px 8px}

/* Order form */
.order{background:color-mix(in srgb,var(--brand) 5%,var(--card));border-top:3px solid var(--brand)}
.order-form{display:grid;gap:12px}
.field{display:grid;gap:4px;font-size:14px;font-weight:600}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:16px;padding:12px;border:1.5px solid var(--line);border-radius:var(--field-radius);background:var(--card);color:var(--ink)}
.field textarea{resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 20%,transparent)}
.field input.invalid{border-color:var(--danger)}
.field small{font-weight:400;color:var(--muted)}
.field[hidden]{display:none}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.summary{display:grid;gap:6px;border-top:1px dashed var(--line);padding-top:10px}
.summary-row{display:flex;justify-content:space-between;font-size:14px}
.summary-row.free span:last-child{color:var(--brand);font-weight:700}
.summary-row.muted{color:var(--muted)}
.total{text-align:center;font-size:1.05rem}
.total strong{color:var(--brand);font-size:1.3rem}
.form-error{color:var(--danger);text-align:center;margin:0;font-weight:600}
.sold-out{text-align:center;font-weight:700;color:var(--danger)}
.thanks{text-align:center;padding:20px 0}
.thanks-icon{width:64px;height:64px;margin:0 auto 12px;border-radius:50%;background:var(--brand);color:var(--on-brand);font-size:34px;display:flex;align-items:center;justify-content:center}
.thanks p{font-size:1.1rem;font-weight:600}

/* Reviews, FAQ, text */
.reviews{display:grid;gap:10px}
.review{margin:0;background:var(--soft);border-radius:var(--radius);padding:12px 14px}
.review blockquote{margin:4px 0}
.review figcaption{color:var(--muted);font-size:14px;font-weight:600}
.stars{color:var(--accent);letter-spacing:2px}
.faq{border:1px solid var(--line);border-radius:var(--field-radius);padding:10px 14px;margin-bottom:8px}
.faq summary{font-weight:700;cursor:pointer}
.faq p{margin:8px 0 0;color:var(--muted)}
.text{white-space:pre-line}

/* Countdown, sticky, announcement */
.countdown{background:var(--danger);color:#fff;text-align:center;padding:10px;font-weight:700}
.countdown strong{font-size:1.2rem;margin-inline-start:6px}
.sticky-buy{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);width:calc(100% - 24px);max-width:536px;z-index:40}
.sticky-buy[hidden]{display:none}
.announcement{background:var(--ink);color:var(--card);text-align:center;font-size:14px;font-weight:600;padding:8px 14px}
.announcement.brand{background:var(--brand);color:var(--on-brand)}

/* Trust badges & features */
.badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.trust-badge{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:13px;font-weight:700;background:var(--soft);border-radius:var(--radius);padding:12px 8px}
.icon-bubble{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:50%;background:color-mix(in srgb,var(--brand) 14%,var(--card));color:var(--brand)}
.icon-bubble svg{width:22px;height:22px}
.features{display:grid;gap:12px}
.feature{display:flex;gap:12px;align-items:flex-start}
.feature h3{margin:0 0 2px}
.feature p{margin:0;color:var(--muted);font-size:14px}

/* Image with text */
.image-text{display:grid;gap:14px}
.image-text img{width:100%;border-radius:var(--radius);object-fit:cover}
.image-text .btn{margin-top:4px}

/* Video */
.video-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:#000}
.video-frame.vertical{aspect-ratio:9/16;max-width:340px;margin:0 auto}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Before / after */
.before-after{position:relative;overflow:hidden;border-radius:var(--radius);aspect-ratio:1/1;touch-action:pan-y;user-select:none}
.before-after img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.before-after .ba-after{clip-path:inset(0 0 0 var(--ba,50%))}
.before-after .ba-handle{position:absolute;top:0;bottom:0;left:var(--ba,50%);width:3px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.4);transform:translateX(-50%)}
.before-after .ba-handle::after{content:'⇆';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:50%;background:#fff;color:#0f172a;display:flex;align-items:center;justify-content:center;font-size:18px}
.before-after .ba-label{position:absolute;top:10px;background:rgba(15,23,42,.7);color:#fff;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px}
.before-after .ba-label.start{left:10px}.before-after .ba-label.end{right:10px}
.before-after input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}

/* Tables: comparison, size guide, delivery */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius)}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:center}
.table th{background:var(--soft);font-weight:700}
.table td:first-child,.table th:first-child{text-align:start;font-weight:600}
.table tr:last-child td{border-bottom:0}
.table .us{background:color-mix(in srgb,var(--brand) 8%,var(--card))}
.yes{color:var(--brand);font-weight:800}.no{color:var(--danger);font-weight:800}

/* Spacer */
.spacer-sm{height:12px}.spacer-md{height:28px}.spacer-lg{height:56px}
.divider{height:1px;background:var(--line);margin:0 18px}

/* Section styling (per section) */
.s-soft{background:var(--soft)}
.s-brand{background:color-mix(in srgb,var(--brand) 9%,var(--card))}
.s-dark{background:var(--ink);color:var(--card)}
.s-dark .hero-sub,.s-dark .feature p,.s-dark .faq p{color:color-mix(in srgb,var(--card) 75%,transparent)}
.s-center{text-align:center}
.s-pad-lg>.block,.s-pad-lg.block{padding-top:36px;padding-bottom:36px}
.s-pad-sm>.block,.s-pad-sm.block{padding-top:10px;padding-bottom:10px}
@media (max-width:640px){.hide-mobile{display:none!important}}
@media (min-width:641px){.hide-desktop{display:none!important}}

/* Footer & floating WhatsApp */
.footer{max-width:560px;margin:0 auto;text-align:center;color:var(--muted);font-size:13px;padding:18px 16px 96px;background:var(--card);border-top:1px solid var(--line)}
.footer-inner{max-width:1140px;margin:0 auto}
.footer-text{white-space:pre-line;color:var(--ink)}
.footer-social{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:6px 0;font-weight:700}
.footer p{margin:8px 0 0}
.footer a{color:inherit}
.footer-contact,.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin-bottom:6px}
.footer-links a{text-decoration:underline;text-underline-offset:2px}
.wa-float{position:fixed;bottom:76px;inset-inline-end:14px;width:52px;height:52px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px -6px rgba(0,0,0,.35);z-index:41}
.policy h1{font-size:1.5rem}
.policy p{white-space:pre-line;color:color-mix(in srgb,var(--ink) 80%,transparent)}
.back-link{display:inline-block;margin-bottom:12px;color:var(--muted);text-decoration:none;font-size:14px}

@media (prefers-reduced-motion:reduce){.hero .btn{animation:none}html{scroll-behavior:auto}}

/* Store home: product catalog */
.shop-header{padding-top:32px}
.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.product-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);color:inherit;text-decoration:none;transition:transform .15s}
.product-card:active{transform:scale(.98)}
.product-card img,.product-card-empty{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--soft);display:block}
.product-card-body{display:grid;gap:2px;padding:10px 12px}
.product-card-title{font-weight:700;font-size:14px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-card .price{font-size:1.05rem}

/* Bundles, order bump, post-order upsell */
.offer-items{display:block;font-weight:500;font-size:12px;color:var(--muted)}
.bump{display:flex;align-items:center;gap:10px;border:2px dashed var(--accent);border-radius:var(--radius);padding:10px 12px;background:color-mix(in srgb,var(--accent) 8%,var(--card));cursor:pointer}
.bump input{width:20px;height:20px;accent-color:var(--brand);flex-shrink:0;margin:0}
.bump img{width:44px;height:44px;border-radius:8px;object-fit:cover;flex-shrink:0}
.bump-text{display:grid;gap:2px;font-size:14px}
.bump-text small{color:var(--muted);font-weight:400}
.bump-price{color:var(--brand);white-space:nowrap}
.upsell{margin-top:16px;border:2px solid var(--brand);border-radius:var(--radius);padding:14px;text-align:start;background:var(--card)}
.upsell-kicker{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--accent);display:flex;justify-content:space-between;gap:8px}
.upsell-card{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.upsell-card img{width:72px;height:72px;border-radius:10px;object-fit:cover;flex-shrink:0}
.upsell-card div{display:grid;gap:2px}
.upsell-card small{color:var(--muted)}
.upsell-skip{display:block;width:100%;margin-top:8px;background:none;border:0;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;text-decoration:underline}
.upsell-done{color:var(--brand);font-weight:700}

/* Reviews app & Urgency app */
.rating-summary{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}
.rating-summary strong{font-size:1.6rem}
.rating-count{color:var(--muted);font-size:14px}
.review-photos{display:flex;gap:6px;margin:6px 0}
.review-photos img{width:64px;height:64px;object-fit:cover;border-radius:8px}
.stock-bar p{margin:0 0 6px;font-weight:700;color:var(--danger);text-align:center}
.stock-track{height:10px;border-radius:999px;background:var(--soft);overflow:hidden;border:1px solid var(--line)}
.stock-track span{display:block;height:100%;background:var(--danger);border-radius:999px}
.recent-toast{position:fixed;bottom:84px;inset-inline-start:12px;max-width:min(320px,calc(100% - 90px));background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600;box-shadow:0 10px 24px -10px rgba(15,23,42,.35);z-index:42;animation:toast-in .3s ease-out}
.recent-toast[hidden]{display:none}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ── Desktop: a real store layout (phones keep the single column above) ── */
@media (min-width:900px){
  .page{max-width:none;padding-bottom:40px}
  .block{max-width:1140px;margin-inline:auto;padding:36px 32px}
  h2{font-size:1.75rem;margin-bottom:20px}
  .store-header-inner{max-width:1140px;padding:14px 32px}
  .footer{max-width:none;padding:32px 32px 40px}
  .hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center;max-width:1140px;margin:0 auto;padding:40px 32px}
  .hero-img{border-radius:var(--radius)}
  .hero .block{padding:0;max-width:none}
  .hero-title{font-size:2.5rem}
  .hero .btn{width:auto;min-width:280px}
  .gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .gallery img{aspect-ratio:1/1;object-fit:cover;height:100%}
  .benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .features{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  .reviews{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .badges{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
  .image-text{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:center}
  .image-text .btn-block{width:auto;min-width:240px}
  .text,.faq,.policy p{max-width:760px;margin-inline:auto}
  .faq{margin-bottom:10px}
  .order{max-width:640px;margin:32px auto;border:1px solid var(--line);border-top:3px solid var(--brand);border-radius:var(--radius)}
  .offers:not(.compact){max-width:640px;margin-inline:auto}
  .video-frame{max-width:860px;margin:0 auto}
  .before-after{max-width:600px;margin:0 auto}
  .table-wrap{max-width:900px;margin:0 auto}
  .stock-bar{max-width:640px}
  .product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
  .sticky-buy{display:none!important}
  .wa-float{bottom:28px}
  .recent-toast{bottom:28px}
}
@media (min-width:900px) and (prefers-reduced-motion:no-preference){
  .product-card:hover{transform:translateY(-2px)}
}

/* ── Design controls (theme settings + standard section controls) ── */
body{font-size:var(--body-size,16px)}
h2{font-size:calc(1.3rem * var(--heading-scale,1))}
.hero-title{font-size:calc(1.6rem * var(--heading-scale,1))}
.block{padding-inline:var(--mobile-padding,18px)}
.btn-outline{background:transparent;color:var(--brand);border:2px solid var(--brand);box-shadow:none}
.btn-secondary{background:transparent;color:inherit;border:2px solid currentColor;box-shadow:none;animation:none!important}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px}
.hero-actions .btn{flex:1 1 auto}
.no-pulse .hero .btn{animation:none}
.gallery img,.image-text img{border-radius:var(--image-radius,var(--radius))}
.gallery,.benefits,.reviews,.features{grid-template-columns:repeat(var(--cols-m,1),minmax(0,1fr))}
.product-grid{grid-template-columns:repeat(var(--cols-m,2),minmax(0,1fr))}
.img-square img,.img-square.hero-img{aspect-ratio:1/1}
.img-portrait img,.img-portrait.hero-img{aspect-ratio:4/5}
.img-landscape img,.img-landscape.hero-img{aspect-ratio:16/10}
.img-original img{aspect-ratio:auto}
.img-default-square .img-theme img{aspect-ratio:1/1}
.img-default-portrait .img-theme img{aspect-ratio:4/5}
.img-default-landscape .img-theme img{aspect-ratio:16/10}
.fit-cover img,img.fit-cover{object-fit:cover}
.fit-contain img,img.fit-contain{object-fit:contain;background:var(--soft)}
.hero-background.has-bg{position:relative;background:var(--hero-bg) center/cover no-repeat;color:#fff;min-height:420px;display:flex;align-items:center}
.hero-background.has-bg::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.45)}
.hero-background.has-bg .block{position:relative}
.hero-background.has-bg .hero-sub,.hero-background.has-bg .price{color:#fff}
/* Section wrapper controls */
.s-w-narrow>.block,.s-w-narrow>section>.block,.s-w-narrow .block{max-width:760px;margin-inline:auto}
.s-pad-custom>.block,.s-pad-custom>section{padding-top:calc(var(--s-pt) * .6);padding-bottom:calc(var(--s-pb) * .6)}
.s-minh-small{min-height:35vh}.s-minh-medium{min-height:55vh}.s-minh-large{min-height:75vh}.s-minh-screen{min-height:100vh}
[class*="s-minh-"]{display:flex;flex-direction:column;justify-content:center}
.s-bg-custom{background:var(--s-bg)}
.s-bg-image{position:relative;background:var(--s-bg) var(--s-img) center/cover no-repeat;isolation:isolate}
.s-bg-image::before{content:'';position:absolute;inset:0;background:#000;opacity:var(--s-overlay,.4);z-index:-1}
.s-fg-light{color:#fff}.s-fg-light .hero-sub,.s-fg-light .feature p,.s-fg-light .faq p,.s-fg-light .rating-count{color:rgba(255,255,255,.8)}
.s-fg-dark{color:#0f172a}
.s-fg-custom{color:var(--s-fg)}
.s-h-small h2{font-size:calc(1.1rem * var(--heading-scale,1))}.s-h-large h2{font-size:calc(1.6rem * var(--heading-scale,1))}.s-h-xlarge h2{font-size:calc(2rem * var(--heading-scale,1))}
.s-h-large .hero-title{font-size:calc(2rem * var(--heading-scale,1))}.s-h-xlarge .hero-title{font-size:calc(2.4rem * var(--heading-scale,1))}
@media (min-width:900px){
  .block{max-width:var(--page-width,1140px);padding:var(--section-spacing,36px) 32px}
  .store-header-inner,.hero,.footer-inner{max-width:var(--page-width,1140px)}
  h2{font-size:calc(1.75rem * var(--heading-scale,1))}
  .hero-title{font-size:calc(2.5rem * var(--heading-scale,1))}
  .hero-image_last .hero-img{order:2}
  .hero-background.has-bg{min-height:560px;max-width:none;display:flex}
  .hero-background.has-bg .block{max-width:var(--page-width,1140px);margin-inline:auto;width:100%}
  .hero-actions .btn{flex:0 0 auto}
  .gallery,.reviews,.features{grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))}
  .benefits{grid-template-columns:repeat(var(--cols,2),minmax(0,1fr))}
  .product-grid{grid-template-columns:repeat(var(--cols,4),minmax(0,1fr))}
  .s-w-narrow .block,.s-w-narrow .hero{max-width:760px}
  .s-w-wide .block,.s-w-wide .hero{max-width:1440px}
  .s-w-full .block,.s-w-full .hero{max-width:none}
  .s-pad-custom>.block,.s-pad-custom>section{padding-top:var(--s-pt);padding-bottom:var(--s-pb)}
  .s-h-small h2{font-size:calc(1.35rem * var(--heading-scale,1))}.s-h-large h2{font-size:calc(2.25rem * var(--heading-scale,1))}.s-h-xlarge h2{font-size:calc(3rem * var(--heading-scale,1))}
  .s-h-large .hero-title{font-size:calc(3.1rem * var(--heading-scale,1))}.s-h-xlarge .hero-title{font-size:calc(3.8rem * var(--heading-scale,1))}
}