/* sdp.css — Segredos de Perfumaria · webshop reskin
   Apothecary palette + Clássico typography (single approved direction).
   Tokens live in sdp-tokens.css (loaded ahead of this file).
   Breakpoint: 880px (single).
*/

/* ─── RESET / BASE ───
   The old overlay theme wrapped content in `.sdp-scope`; the rebuild
   replaces (not overlays) the base theme, so we target `body` directly.
   Box-sizing and image defaults are inherited from the stock theme so
   we only set what the design system actually needs. */
body { background: var(--sdp-bg); color: var(--sdp-ink); font-family: var(--sdp-font-body); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
body a { color: inherit; text-decoration: none; }

/* ─────────────────────────── TYPE ─────────────────────────── */
.sdp-h1,.sdp-h2,.sdp-h3,.sdp-h4{ font-family: var(--sdp-font-heading); font-weight: 400; line-height: 1.12; margin: 0; color: var(--sdp-ink); }
.sdp-h1{ font-size: 64px; letter-spacing: -0.01em; }
.sdp-h1--italic{ font-style: italic; }
.sdp-h1--xl{ font-size: 88px; font-style: italic; line-height: 1.08; }
.sdp-h2{ font-size: 42px; }
.sdp-h2--italic{ font-style: italic; }
.sdp-h3{ font-size: 26px; }
.sdp-h4{ font-size: 20px; letter-spacing: 0.01em; }
.sdp-body{ font-family: var(--sdp-font-body); font-size: 16px; line-height: 1.6; color: var(--sdp-ink); margin: 0; }
.sdp-body--lg{ font-size: 17px; max-width: 60ch; }
.sdp-eyebrow{ font-family: var(--sdp-font-body); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sdp-ink-soft); }
.sdp-num{ font-family: var(--sdp-font-heading); font-style: italic; font-weight: 500; font-feature-settings: "lnum"; }
.sdp-muted{ color: var(--sdp-ink-soft); font-size: 13px; }
.sdp-italic{ font-style: italic; }

/* ─────────────────────────── LAYOUT ─────────────────────────── */
.sdp-container{ max-width: var(--sdp-container); margin: 0 auto; padding: 0 48px; }
.sdp-container--narrow{ max-width: var(--sdp-container-narrow); }
.sdp-section{ padding: 80px 0; border-top: 1px solid var(--sdp-rule); }
.sdp-section--alt{ background: var(--sdp-surface-alt); }
.sdp-section--dark{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-section--dark .sdp-eyebrow{ color: rgba(255,255,255,0.6); }
.sdp-section--dark .sdp-h2{ color: var(--sdp-bg); }
.sdp-section--no-rule{ border-top: 0; }
.sdp-section__head{ margin-bottom: 36px; }
.sdp-section__head--row{ display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }

/* ─────────────────────────── ANNOUNCEMENT + HEADER ─────────────────────────── */
.sdp-announcement{ background: var(--sdp-ink); color: var(--sdp-bg); text-align: center; padding: 9px 20px; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; }
.sdp-header{ background: var(--sdp-bg); border-bottom: 1px solid var(--sdp-rule); position: sticky; top: 0; z-index: 50; transition: box-shadow .2s; }
.sdp-header.is-scrolled{ box-shadow: 0 1px 0 rgba(0,0,0,0.04); }
.sdp-header__inner{ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 22px 48px; gap: 24px; }
.sdp-header__group{ display: flex; align-items: center; gap: 24px; min-width: 0; }
.sdp-header__group--right{ justify-content: flex-end; }
.sdp-nav{ display: flex; gap: 28px; font-size: 14px; }
.sdp-nav--right{ justify-content: flex-end; }
.sdp-nav--mobile{ display: none; }
.sdp-nav a{ color: var(--sdp-ink); transition: color .15s; }
.sdp-nav a:hover, .sdp-nav a:focus-visible{ color: var(--sdp-accent); }
.sdp-header .sdp-hamburger{ background: transparent; border: 0; padding: 8px; margin: 0; min-width: 0; width: auto; box-shadow: none; outline: none; }
.sdp-header .sdp-hamburger:focus-visible{ outline: 2px solid var(--sdp-accent); outline-offset: 2px; }
.sdp-cart-link{ position: relative; display: inline-flex; align-items: center; gap: 6px; }
.sdp-cart-badge{ background: var(--sdp-accent); color: var(--sdp-bg); padding: 1px 7px; font-size: 11px; min-width: 18px; text-align: center; }
.sdp-logo{ display: inline-flex; flex-direction: column; align-items: center; line-height: 1; color: var(--sdp-ink); text-align: center; }
.sdp-logo__sm{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 14px; letter-spacing: 0.02em; }
.sdp-logo__lg{ font-family: var(--sdp-font-heading); font-size: 22px; letter-spacing: 0.18em; margin-top: 2px; }
.sdp-logo--inverse{ color: var(--sdp-bg); }
.sdp-nav .sdp-nav-btn{ display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 0; padding: 0; margin: 0; font: inherit; color: var(--sdp-ink); cursor: pointer; transition: color .15s; }
.sdp-nav .sdp-nav-btn:hover, .sdp-nav .sdp-nav-btn:focus-visible{ color: var(--sdp-accent); outline: none; }
.sdp-visually-hidden{ position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.sdp-search-overlay{ background: var(--sdp-bg); border-bottom: 1px solid var(--sdp-rule); padding: 28px 48px 32px; }
.sdp-search-overlay__form{ display: flex; align-items: center; gap: 18px; max-width: 880px; margin: 0 auto; border-bottom: 1px solid var(--sdp-ink); padding: 0 4px 2px; background: transparent; }
.sdp-search-overlay__icon{ width: 20px; height: 20px; color: var(--sdp-ink-soft); flex: 0 0 auto; }
.sdp-search-overlay__input{ flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; padding: 14px 0; font-family: var(--sdp-font-heading); font-style: italic; font-size: 22px; color: var(--sdp-ink); letter-spacing: 0; }
.sdp-search-overlay__input::placeholder{ color: var(--sdp-ink-soft); font-style: italic; opacity: 0.7; }
.sdp-search-overlay__submit{ background: transparent; color: var(--sdp-ink); border: 0; padding: 10px 4px; font-family: var(--sdp-font-body); font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; cursor: pointer; transition: color .15s; flex: 0 0 auto; }
.sdp-search-overlay__submit:hover, .sdp-search-overlay__submit:focus-visible{ color: var(--sdp-accent); outline: none; }
.sdp-search-overlay__close{ background: transparent; border: 0; padding: 8px; margin-left: 4px; color: var(--sdp-ink-soft); cursor: pointer; display: inline-flex; align-items: center; flex: 0 0 auto; transition: color .15s; }
.sdp-search-overlay__close:hover, .sdp-search-overlay__close:focus-visible{ color: var(--sdp-ink); outline: none; }
.sdp-search-overlay__close .sdp-icon{ width: 18px; height: 18px; }

/* ─────────────────────────── BUTTONS ─────────────────────────── */
.sdp-btn{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 15px 28px; border: 1px solid var(--sdp-ink); background: transparent; color: var(--sdp-ink); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; font-family: var(--sdp-font-body); cursor: pointer; transition: opacity .15s, background .15s, color .15s; }
.sdp-btn--primary{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-btn--primary:hover, .sdp-btn--primary:focus-visible{ opacity: 0.86; }
.sdp-btn--primary:active{ opacity: 1; transform: translateY(1px); }
.sdp-btn--ghost{ background: transparent; color: var(--sdp-ink); }
.sdp-btn--ghost:hover, .sdp-btn--ghost:focus-visible{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-btn--light{ background: transparent; border-color: var(--sdp-bg); color: var(--sdp-bg); }
.sdp-btn--light:hover{ background: var(--sdp-bg); color: var(--sdp-ink); }
.sdp-btn--light:focus-visible{ background: var(--sdp-bg); color: var(--sdp-ink); outline: 1px solid var(--sdp-bg); outline-offset: 3px; }
.sdp-btn--block{ width: 100%; }
.sdp-btn--sm{ padding: 10px 20px; font-size: 11px; }
.sdp-btn[disabled]{ opacity: 0.4; cursor: not-allowed; }

.sdp-link-arrow{ font-size: 13px; color: var(--sdp-ink); text-decoration: underline; text-underline-offset: 6px; }
.sdp-link-arrow:hover{ color: var(--sdp-accent); }
.sdp-link-muted{ color: var(--sdp-ink-soft); font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }

/* ─────────────────────────── HERO ─────────────────────────── */
.sdp-hero{ position: relative; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0, 1fr); height: clamp(520px, calc(100svh - 180px), 600px); min-height: 0; overflow: hidden; border-bottom: 1px solid var(--sdp-rule); }
.sdp-hero__slide{ display: contents; }
.sdp-hero__slide:not(.is-active){ display: none; }
.sdp-hero__media, .sdp-hero__body{ min-height: 0; }
.sdp-hero__media{ position: relative; background: var(--sdp-surface-alt); overflow: hidden; }
.sdp-hero__media img{ width: 100%; height: 100%; object-fit: cover; }
.sdp-hero__num{ position: absolute; top: 24px; left: 24px; background: var(--sdp-bg); border: 1px solid var(--sdp-ink); padding: 6px 14px; }
.sdp-hero__num .sdp-num{ font-size: 18px; }
.sdp-hero__body{ padding: 52px 64px 64px; display: flex; flex-direction: column; justify-content: center; background: var(--sdp-bg); }
.sdp-hero__body .sdp-h1--xl{ margin-top: 12px; font-size: clamp(56px, 5vw, 76px); }
.sdp-hero__body .sdp-body{ margin-top: 24px; max-width: 440px; }
.sdp-hero__body .sdp-btn{ margin-top: 28px; align-self: flex-start; }
.sdp-hero__dots{ position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 2; }
.sdp-hero__dot{ width: 8px; height: 8px; background: var(--sdp-rule); border: 0; padding: 0; transition: width .25s, background .25s; }
.sdp-hero__dot.is-active{ width: 32px; background: var(--sdp-ink); }

/* ─────────────────────────── CATEGORY GRID ─────────────────────────── */
.sdp-cat-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sdp-cat-grid--6{ grid-template-columns: repeat(6, 1fr); }
.sdp-cat{ background: var(--sdp-surface); border: 1px solid var(--sdp-rule); padding: 28px 24px; display: flex; flex-direction: column; gap: 14px; transition: transform .15s, border-color .15s; color: inherit; }
.sdp-cat:hover{ transform: translateY(-3px); border-color: var(--sdp-ink); }
.sdp-cat__swatch{ width: 34px; height: 34px; border-radius: 50%; display: block; }
.sdp-cat__name{ font-family: var(--sdp-font-heading); font-size: 22px; font-style: italic; line-height: 1.15; }
.sdp-cat__count{ font-size: 12px; color: var(--sdp-ink-soft); letter-spacing: 0.05em; }

/* ─────────────────────────── PRODUCT CARD ─────────────────────────── */
.sdp-product-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.sdp-product-grid--3{ grid-template-columns: repeat(3, 1fr); gap: 32px; }
.sdp-product-grid--2{ grid-template-columns: repeat(2, 1fr); }
.sdp-card{ display: block; background: var(--sdp-surface); border: 1px solid var(--sdp-rule); color: inherit; transition: transform .15s, border-color .15s; }
.sdp-card:hover, .sdp-card:focus-within{ transform: translateY(-3px); border-color: var(--sdp-ink); }
.sdp-card__media{ position: relative; aspect-ratio: 4/5; background: var(--sdp-surface-alt); overflow: hidden; }
.sdp-card__media img{ width: 100%; height: 100%; object-fit: cover; }
.sdp-card__placeholder{ position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--sdp-ink-soft); }
.sdp-card__num{ position: absolute; top: 14px; left: 14px; background: var(--sdp-bg); border: 1px solid var(--sdp-ink); padding: 4px 10px; }
.sdp-card__num .sdp-num{ font-size: 16px; }
.sdp-card__badge{ position: absolute; top: 14px; right: 14px; background: var(--sdp-accent); color: var(--sdp-bg); padding: 4px 10px; font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase; }
.sdp-card__badge--sold{ background: var(--sdp-ink-soft); }
.sdp-card__body{ padding: 20px 22px 22px; }
.sdp-card__cats{ display: flex; flex-wrap: wrap; gap: 6px; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--sdp-ink-soft); margin-bottom: 10px; }
.sdp-card__sep{ color: var(--sdp-rule); }
.sdp-card__name{ font-family: var(--sdp-font-heading); font-size: 20px; line-height: 1.15; }
.sdp-card__meta{ margin-top: 6px; font-size: 13px; color: var(--sdp-ink-soft); }
.sdp-card__price{ margin-top: 12px; display: flex; align-items: baseline; gap: 10px; }
.sdp-card__price .sdp-num{ font-size: 17px; }
.sdp-price-old{ text-decoration: line-through; opacity: 0.55; font-size: 13px; }

/* ─────────────────────────── PDP ─────────────────────────── */
.sdp-pdp{ padding: 32px 0 80px; }
.sdp-breadcrumb{ font-size: 12px; color: var(--sdp-ink-soft); margin-bottom: 32px; letter-spacing: 0.05em; }
.sdp-breadcrumb a:hover{ color: var(--sdp-ink); text-decoration: underline; }
.sdp-pdp__main{ display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; }
.sdp-pdp__media{ position: relative; }
.sdp-pdp__hero{ position: relative; background: var(--sdp-surface-alt); aspect-ratio: 1; overflow: hidden; }
.sdp-pdp__hero img{ width: 100%; height: 100%; object-fit: cover; }
.sdp-pdp__hero .sdp-pdp-gallery{ height: 100%; margin: 0; }
.sdp-pdp__hero .sdp-pdp-gallery > .col,
.sdp-pdp__hero .sdp-pdp-gallery > .col-md-auto{ height: 100%; padding: 0; }
.sdp-pdp__hero .sdp-pdp-gallery > .col{ min-width: 0; }
.sdp-pdp__hero .product-thumbs-container{ width: 88px; height: 100%; display: flex; flex-direction: column; }
.sdp-pdp__hero .swiper-product-thumb{ flex: 1 1 auto; height: auto; min-height: 0; overflow: hidden; }
.sdp-pdp__hero .swiper-product-thumb .swiper-slide{ width: 88px; }
.sdp-pdp__hero .product-thumb{ width: 88px; height: 88px; padding-bottom: 0 !important; margin: 0 0 8px !important; border: 1px solid var(--sdp-rule); background: var(--sdp-surface); overflow: hidden; }
.sdp-pdp__hero .product-thumb.selected{ border-color: var(--sdp-ink); }
.sdp-pdp__hero .product-thumb img{ display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.sdp-pdp__hero .product-detail-slider,
.sdp-pdp__hero .product-detail-slider .swiper-wrapper,
.sdp-pdp__hero .product-detail-slider .swiper-slide,
.sdp-pdp__hero .js-product-slide-link{ height: 100% !important; }
.sdp-pdp__hero .js-product-slide-link{ padding-bottom: 0 !important; overflow: hidden; }
.sdp-pdp__hero .product-slider-image{ top: 0; left: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; transform: none; }
.sdp-pdp__num{ position: absolute; top: 24px; left: 24px; background: var(--sdp-bg); border: 1px solid var(--sdp-ink); padding: 6px 14px; }
.sdp-pdp__num .sdp-num{ font-size: 22px; }
.sdp-pdp__thumbs{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 8px; }
.sdp-pdp__thumb{ aspect-ratio: 1; background: var(--sdp-surface); border: 1px solid var(--sdp-rule); padding: 0; overflow: hidden; cursor: pointer; }
.sdp-pdp__thumb.is-active{ border-color: var(--sdp-ink); border-width: 2px; }
.sdp-pdp__thumb img{ width: 100%; height: 100%; object-fit: cover; }
.sdp-pdp__info .sdp-eyebrow{ display: block; }
.sdp-pdp__cats{ display: flex; flex-wrap: wrap; gap: 8px; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--sdp-ink-soft); margin-top: 8px; }
.sdp-pdp__info .sdp-h1{ font-size: 52px; font-style: italic; margin-top: 14px; line-height: 1.1; }
.sdp-pdp__price{ display: flex; align-items: baseline; gap: 14px; margin-top: 24px; padding-bottom: 24px; border-bottom: 1px solid var(--sdp-rule); flex-wrap: wrap; }
.sdp-pdp__price-value{ font-size: 36px; }
.sdp-pdp__price-sub{ font-size: 13px; color: var(--sdp-ink-soft); width: 100%; }

/* Hide the stock variant select + the duplicate product name inside the
   SDP product form shell — visible UI is the SDP format pills + H1 above;
   the form's DOM stays intact so submission carries the right values. */
.sdp-pdp__form-shell .js-product-variants{ position: absolute !important; left: -9999px !important; top: auto !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.sdp-pdp__form-shell .js-product-name,
.sdp-pdp__form-shell h1,
.sdp-pdp__form-shell h2.h4{ position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.sdp-format-selector{ border: 0; padding: 32px 0 0; margin: 0; }
.sdp-format-selector legend{ margin: 0 0 14px; padding: 0; }
.sdp-format-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sdp-format{ display: block; background: var(--sdp-surface); border: 1px solid var(--sdp-ink); padding: 16px; cursor: pointer; position: relative; transition: background .15s, color .15s; }
.sdp-format input{ position: absolute; opacity: 0; pointer-events: none; }
.sdp-format:hover{ background: var(--sdp-surface-alt); }
.sdp-format.is-active{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-format.is-sold{ opacity: 0.55; cursor: not-allowed; }
.sdp-format__name{ display: block; font-family: var(--sdp-font-heading); font-size: 17px; font-style: italic; }
.sdp-format__vol{ display: block; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.7; margin-top: 4px; }
.sdp-format__price{ display: block; font-size: 14px; margin-top: 10px; font-weight: 500; }
.sdp-format__soldout{ position: absolute; top: 8px; right: 8px; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sdp-error); }

.sdp-pdp__info .sdp-format{ color: var(--sdp-ink) !important; text-align: center; }
.sdp-pdp__info .sdp-format, .sdp-pdp__info .sdp-format *{ -webkit-text-fill-color: var(--sdp-ink) !important; }
.sdp-pdp__info .sdp-format .sdp-format__name{ color: inherit !important; -webkit-text-fill-color: inherit !important; }
.sdp-pdp__info .sdp-format:hover, .sdp-pdp__info .sdp-format:focus-visible{ background: var(--sdp-surface-alt); border-color: var(--sdp-ink-warm); color: var(--sdp-ink); outline: none; }
.sdp-pdp__info .sdp-format.is-active{ background: var(--sdp-ink); border-color: var(--sdp-ink); color: var(--sdp-bg) !important; }
.sdp-pdp__info .sdp-format.is-active, .sdp-pdp__info .sdp-format.is-active *{ -webkit-text-fill-color: var(--sdp-bg) !important; }
.sdp-pdp__form-shell .price-container{ padding-top: 28px; }
.sdp-pdp__form-shell #price_display{ font-family: var(--sdp-font-heading); font-weight: 500; font-size: 34px; line-height: 1.1; color: var(--sdp-ink); letter-spacing: 0; }
.sdp-pdp__form-shell .js-price-container{ margin-bottom: 18px !important; }
.sdp-pdp__form-shell .js-product-payments-container, .sdp-pdp__form-shell .js-product-payments-container *, .sdp-pdp__form-shell .js-product-payments-container .text-accent{ color: var(--sdp-ink-warm) !important; }
.sdp-pdp__form-shell .js-last-product{ color: var(--sdp-accent) !important; }
.sdp-pdp__form-shell #btn-installments{ color: var(--sdp-ink); }

.sdp-pdp__cta{ display: flex; flex-direction: column; gap: 12px; margin-top: 28px; }
.sdp-pdp__trust{ list-style: none; padding: 24px 0 0; margin: 24px 0 0; display: flex; flex-direction: column; gap: 10px; font-size: 13px; color: var(--sdp-ink-soft); border-top: 1px solid var(--sdp-rule); }
.sdp-pdp__trust li{ position: relative; padding-left: 16px; }
.sdp-pdp__trust li:before{ content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: var(--sdp-accent); border-radius: 50%; }

.sdp-pdp__about{ margin-top: 80px; padding: 80px 0 16px; border-top: 1px solid var(--sdp-rule); }
.sdp-pdp__about-grid{ display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 96px; align-items: start; }
.sdp-pdp__about-grid--single{ grid-template-columns: minmax(0, 65ch); }
.sdp-pdp__story .sdp-eyebrow{ display: inline-block; margin-bottom: 6px; }
.sdp-pdp__story-text{ margin-top: 18px; font-size: 16px; line-height: 1.75; color: var(--sdp-ink); }
.sdp-pdp__story-text p{ margin: 0 0 18px; }
.sdp-pdp__story-text p:last-child{ margin-bottom: 0; }
.sdp-pdp__story-text strong{ font-weight: 500; }
.sdp-pdp__pyramid{ position: sticky; top: 96px; background: var(--sdp-surface); border: 1px solid var(--sdp-rule); padding: 36px 36px 32px; }
.sdp-pdp__pyramid h3{ font-family: var(--sdp-font-heading); font-style: italic; font-weight: 400; font-size: 32px; line-height: 1.1; margin: 6px 0 28px; color: var(--sdp-ink); }
.sdp-pyramid{ margin: 0; padding: 0; }
.sdp-pyramid__layer{ display: grid; grid-template-columns: 28px 1fr; gap: 18px; padding: 20px 0; border-top: 1px solid var(--sdp-rule); }
.sdp-pyramid__layer:first-of-type{ border-top: 0; padding-top: 4px; }
.sdp-pyramid__layer:last-of-type{ padding-bottom: 4px; }
.sdp-pyramid__num{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 22px; color: var(--sdp-accent); line-height: 1; }
.sdp-pyramid dt{ font-family: var(--sdp-font-body); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sdp-ink-soft); margin-bottom: 6px; }
.sdp-pyramid dd{ margin: 0; font-family: var(--sdp-font-heading); font-style: italic; font-size: 22px; line-height: 1.3; color: var(--sdp-ink); }

/* ─────────────────────────── LISTING ─────────────────────────── */
.sdp-listing{ padding: 32px 0 80px; }
.sdp-listing__head{ max-width: 720px; margin-bottom: 36px; }
.sdp-listing__head .sdp-h1{ font-size: 64px; font-style: italic; margin-top: 8px; }
.sdp-filterbar{ position: sticky; top: 90px; background: var(--sdp-bg); z-index: 10; padding: 14px 0; border-top: 1px solid var(--sdp-rule); border-bottom: 1px solid var(--sdp-rule); margin-bottom: 32px; }
.sdp-chips, .sdp-chip-row{ display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 32px; }
.sdp-chip-row{ padding-bottom: 16px; border-bottom: 1px solid var(--sdp-rule); }
.sdp-category{ padding: 32px 0 64px; }
.sdp-category__head{ margin-bottom: 32px; }
.sdp-category__desc{ color: var(--sdp-ink-soft); font-size: 14px; margin: 12px 0 0; max-width: 640px; }
.sdp-listing__layout{ display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 56px; align-items: start; margin-top: 40px; }
.sdp-listing__layout--full{ grid-template-columns: minmax(0, 1fr); }
.sdp-listing__results{ min-width: 0; }
.sdp-filter-toggle{ position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; pointer-events: none; }
.sdp-filter-toggle:not(:checked) ~ .sdp-listing__layout{ grid-template-columns: minmax(0, 1fr); }
.sdp-filter-toggle:not(:checked) ~ .sdp-listing__layout .sdp-sidebar{ display: none; }
.sdp-filter-toggle__button{ display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 38px; padding: 10px 16px 10px 14px; border: 1px solid var(--sdp-ink); color: var(--sdp-ink); background: var(--sdp-bg); font-family: var(--sdp-font-body); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: background .2s, color .2s; }
.sdp-filter-toggle__button:hover{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-filter-toggle:checked ~ .sdp-results-bar .sdp-filter-toggle__button{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-filter-toggle__icon{ width: 14px; height: 14px; flex-shrink: 0; }
.sdp-filter-toggle__count{ display: inline-grid; place-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--sdp-ink); color: var(--sdp-bg); font-size: 11px; letter-spacing: 0; font-family: var(--sdp-font-sans); transition: background .2s, color .2s; }
.sdp-filter-toggle__button:hover .sdp-filter-toggle__count,
.sdp-filter-toggle:checked ~ .sdp-results-bar .sdp-filter-toggle__count{ background: var(--sdp-bg); color: var(--sdp-ink); }
.sdp-sidebar{ position: sticky; top: 96px; }
.sdp-sidebar__group{ border-top: 1px solid var(--sdp-rule); padding: 24px 0; }
.sdp-sidebar__group:first-child{ border-top: 0; padding-top: 0; }
.sdp-sidebar__title{ font-family: var(--sdp-font-sans); text-transform: uppercase; letter-spacing: 0.14em; font-size: 11px; color: var(--sdp-ink-soft); margin: 0 0 14px; font-weight: 500; }
.sdp-sidebar__list{ list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.sdp-sidebar__check,
.sdp-sidebar__link{ display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--sdp-ink); cursor: pointer; user-select: none; text-decoration: none; }
.sdp-sidebar__link{ justify-content: space-between; }
.sdp-sidebar__link:hover{ color: var(--sdp-accent); }
.sdp-sidebar__check input{ appearance: none; width: 16px; height: 16px; border: 1px solid var(--sdp-ink-soft); background: var(--sdp-bg); cursor: pointer; display: inline-grid; place-content: center; flex-shrink: 0; margin: 0; }
.sdp-sidebar__check input:checked{ background: var(--sdp-ink); border-color: var(--sdp-ink); }
.sdp-sidebar__check input:checked::after{ content: ''; width: 8px; height: 4px; border-left: 1.5px solid var(--sdp-bg); border-bottom: 1.5px solid var(--sdp-bg); transform: rotate(-45deg) translate(1px, -1px); }
.sdp-sidebar__check-label{ flex: 1; min-width: 0; }
.sdp-sidebar__check__count{ margin-left: auto; font-size: 12px; color: var(--sdp-ink-soft); font-family: var(--sdp-font-sans); }
.sdp-sidebar__swatch{ width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; border: 1px solid rgba(42,31,17,0.12); }
.sdp-sidebar__actions{ display: flex; gap: 8px; margin-top: 20px; }
.sdp-sidebar__price-filter .filter-input-price-container{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sdp-sidebar__price-filter label{ display: block; margin: 0 0 6px; font-size: 12px; color: var(--sdp-ink-soft); }
.sdp-sidebar__price-filter .filter-input-price,
.sdp-sidebar__price-filter input{ width: 100%; padding: 8px 10px; border: 1px solid var(--sdp-rule); background: var(--sdp-bg); font-family: var(--sdp-font-sans); font-size: 13px; color: var(--sdp-ink); }
.sdp-sidebar__price-filter button,
.sdp-sidebar__price-filter .sdp-btn{ margin-top: 10px; }
.sdp-sidebar__price-filter button[disabled],
.sdp-sidebar__price-filter button:disabled,
.sdp-sidebar__price-filter .sdp-btn[disabled],
.sdp-sidebar__price-filter .btn[disabled]{ opacity: 1; background: var(--sdp-surface-alt); border-color: var(--sdp-rule); color: var(--sdp-ink-soft); cursor: not-allowed; }
.sdp-results-bar{ display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--sdp-rule); margin-bottom: 24px; }
.sdp-results-bar__left{ display: flex; align-items: center; gap: 18px; flex-wrap: wrap; min-width: 0; }
.sdp-results-bar__count{ font-size: 13px; color: var(--sdp-ink-soft); letter-spacing: 0.02em; }
.sdp-results-bar__count strong{ color: var(--sdp-ink); font-weight: 500; }
.sdp-active-chips{ display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.sdp-active-chip{ display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--sdp-rule); background: var(--sdp-surface); font-size: 12px; color: var(--sdp-ink); font-family: var(--sdp-font-sans); letter-spacing: 0.02em; cursor: pointer; }
.sdp-active-chip__close{ color: var(--sdp-ink-soft); font-size: 14px; line-height: 1; margin-left: 2px; }
.sdp-active-chip:hover .sdp-active-chip__close{ color: var(--sdp-ink); }
.sdp-active-clear{ font-size: 12px; color: var(--sdp-accent); text-decoration: underline; text-underline-offset: 4px; font-family: var(--sdp-font-sans); letter-spacing: 0.02em; }
.sdp-active-clear:hover{ color: var(--sdp-ink); }
.sdp-results-bar__controls{ display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex-shrink: 0; }
.sdp-results-bar__sort{ display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--sdp-ink-soft); flex-shrink: 0; }
.sdp-results-bar__sort select,
.sdp-results-bar__sort .form-control{ min-width: 160px; background: transparent; border: 1px solid var(--sdp-rule); color: var(--sdp-ink); font-family: inherit; font-size: 13px; padding: 8px 28px 8px 10px; height: auto; }
.sdp-h1--italic{ font-style: italic; }
.sdp-chip__x{ margin-left: 8px; font-size: 14px; line-height: 1; }
.sdp-pagination{ display: flex; align-items: center; justify-content: center; gap: 24px; margin: 48px 0 0; font-size: 13px; letter-spacing: 0.05em; }
.sdp-pagination--load-more{ flex-direction: column; }
.sdp-pagination__arrow{ color: var(--sdp-ink); text-decoration: none; padding: 8px 12px; border-bottom: 1px solid transparent; transition: border-color .15s; }
.sdp-pagination__arrow:hover{ border-bottom-color: var(--sdp-ink); }
.sdp-pagination__arrow.is-disabled{ opacity: 0.3; pointer-events: none; }
.sdp-pagination__count{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 18px; color: var(--sdp-ink); }
.sdp-pagination__sep{ margin: 0 6px; opacity: 0.5; }

/* ─────── Cart ─────── */
.sdp-cart{ padding: 32px 0 80px; }
.sdp-cart__head{ margin-bottom: 32px; }
.sdp-cart__layout{ display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
.sdp-cart__items{ display: flex; flex-direction: column; gap: 0; }
.sdp-cart__side{ display: flex; flex-direction: column; gap: 16px; position: sticky; top: 96px; }
.sdp-cart__shipping, .sdp-cart__totals{ background: var(--sdp-surface); padding: 24px; border: 1px solid var(--sdp-rule); }
.sdp-cart__empty{ text-align: center; padding: 80px 20px; }
.sdp-cart__empty .sdp-body{ margin: 0 0 24px; color: var(--sdp-ink-soft); }
.sdp-cart__empty-cta{ display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.sdp-alert{ padding: 12px 16px; margin-bottom: 16px; font-size: 14px; }
.sdp-alert--warning{ background: rgba(181,83,42,0.1); color: var(--sdp-error); border: 1px solid var(--sdp-error); }
.sdp-link{ color: var(--sdp-accent); text-decoration: underline; }
@media (max-width: 880px){
    .sdp-cart__layout{ grid-template-columns: 1fr; }
    .sdp-cart__side{ position: static; }
}
.sdp-breadcrumb__sep{ margin: 0 6px; opacity: 0.5; }
.sdp-chip{ display: inline-flex; align-items: center; padding: 8px 16px; background: var(--sdp-surface); color: var(--sdp-ink); border: 1px solid var(--sdp-ink); font-size: 12px; letter-spacing: 0.05em; cursor: pointer; font-family: inherit; transition: background .15s, color .15s; }
.sdp-chip:hover{ background: var(--sdp-surface-alt); }
.sdp-chip.is-active{ background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-chip__close{ margin-left: 6px; opacity: 0.7; }
.sdp-filterbar__meta{ display: flex; justify-content: space-between; align-items: center; margin-top: 12px; font-size: 13px; flex-wrap: wrap; gap: 12px; }
.sdp-sort select{ font-family: inherit; background: transparent; border: 0; font-size: 13px; color: var(--sdp-ink); cursor: pointer; padding: 4px 0; }
.sdp-empty{ padding: 64px; text-align: center; color: var(--sdp-ink-soft); grid-column: 1/-1; background: var(--sdp-surface); border: 1px dashed var(--sdp-rule); }
.sdp-pagination{ display: flex; justify-content: center; gap: 8px; margin-top: 48px; font-size: 13px; flex-wrap: wrap; }
.sdp-pagination a, .sdp-pagination span{ padding: 8px 12px; border: 1px solid var(--sdp-rule); }
.sdp-pagination .is-current{ background: var(--sdp-ink); color: var(--sdp-bg); border-color: var(--sdp-ink); }
.sdp-pagination a:hover{ border-color: var(--sdp-ink); }

/* ─── CART (stock markup overrides) ───
   The stock `cart-item-ajax.tpl` and `cart-totals.tpl` render Bootstrap
   row/col markup. We don't rewrite those templates (they wire into the
   AJAX cart, shipping calculator, totals JS). Instead we patch the
   visual on top so the layout reads on-brand.

   Critical: do not add `.sdp-cart__totals > div` flex rules — the stock
   totals template emits many block-level <div> siblings (sticky module,
   hidden price helpers, the Total row, the CTA wrapper). Flattening
   those into a single flex row breaks the layout. */

/* Bootstrap's `.hidden` is not present in Bootstrap 4+; the stock theme
   relies on it for currency/subtotal helpers. Provide it ourselves. */
.hidden{ display: none !important; }

/* Cart item row — keep stock Bootstrap grid intact, polish the type
   and spacing only. */
.sdp-cart__items .cart-item{ padding: 20px 0; border-bottom: 1px solid var(--sdp-rule); margin-bottom: 0 !important; align-items: center; }
.sdp-cart__items .cart-item:first-child{ border-top: 1px solid var(--sdp-rule); }
.sdp-cart__items .cart-item-image{ width: 88px; height: auto; border: 1px solid var(--sdp-rule); }
.sdp-cart__items .cart-item-image-md{ width: 100px; }
.sdp-cart__items .cart-item a{ color: var(--sdp-ink); font-family: var(--sdp-font-heading); font-size: 18px; line-height: 1.2; }
.sdp-cart__items .cart-item small{ font-family: var(--sdp-font-body); font-size: 12px; color: var(--sdp-ink-soft); letter-spacing: 0.04em; display: block; margin-top: 4px; }
.sdp-cart__items .js-cart-item-unit-price,
.sdp-cart__items .js-cart-item-subtotal{ font-family: var(--sdp-font-heading); font-size: 16px; color: var(--sdp-ink); }
.sdp-cart__items .btn-link{ color: var(--sdp-ink-soft); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: underline; font-family: var(--sdp-font-body); }
.sdp-cart__items .btn-link:hover{ color: var(--sdp-ink); }

/* Quantity controls — force the +/- to sit on the sides of the input. */
.sdp-cart__items .cart-item-quantity{ max-width: 130px; }
.sdp-cart__items .cart-item-quantity .form-row{ display: flex !important; flex-wrap: nowrap !important; align-items: center !important; border: 1px solid var(--sdp-rule); background: var(--sdp-surface); }
.sdp-cart__items .cart-item-quantity .form-quantity-icon{ display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; cursor: pointer; color: var(--sdp-ink); }
.sdp-cart__items .cart-item-quantity .form-quantity-icon:hover{ background: var(--sdp-surface-alt); }
.sdp-cart__items .cart-item-quantity input{ flex: 1; min-width: 40px; text-align: center; border: 0 !important; background: transparent !important; padding: 8px 4px !important; height: auto !important; font-family: var(--sdp-font-body) !important; }

/* Cart-totals sidebar — stock template wraps everything in
   `#cart-sticky-summary.cart-page-totals`. Style by row pattern. */
.sdp-cart__totals .cart-page-totals{ display: flex; flex-direction: column; gap: 14px; }
.sdp-cart__totals .row{ display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; margin: 0; font-size: 14px; color: var(--sdp-ink); }
.sdp-cart__totals .row > .col,
.sdp-cart__totals .row > .col-auto{ flex: 0 0 auto; padding: 0; max-width: none; }
.sdp-cart__totals .row > .col.text-right,
.sdp-cart__totals .row > [class*="col"].text-right{ flex: 1 1 auto; text-align: right; }
.sdp-cart__totals .h5{ font-family: var(--sdp-font-body); font-size: 14px; font-weight: 500; margin: 0; }
.sdp-cart__totals .h2{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 28px; color: var(--sdp-ink); margin: 12px 0 4px; padding-top: 14px; border-top: 1px solid var(--sdp-rule); }
.sdp-cart__totals .h2 .col-auto,
.sdp-cart__totals .h2 .col{ font-size: 28px; }
.sdp-cart__totals .font-small{ font-size: 12px; color: var(--sdp-ink-soft); }
.sdp-cart__totals #go-to-checkout{
    width: 100%;
    margin-top: 12px;
    background: var(--sdp-ink);
    color: var(--sdp-bg);
    border: 0;
    padding: 16px 24px;
    font-family: var(--sdp-font-body);
    font-size: 12px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s;
}
.sdp-cart__totals #go-to-checkout:hover{ background: var(--sdp-accent); }

/* Ship-bar (free shipping progress) — keep what was here */
.sdp-ship-bar{ font-size: 13px; color: var(--sdp-ink-soft); }
.sdp-ship-bar__progress{ height: 4px; background: var(--sdp-rule); margin-top: 10px; position: relative; max-width: 480px; }
.sdp-ship-bar__progress > span{ position: absolute; left: 0; top: 0; bottom: 0; background: var(--sdp-accent); transition: width .3s; }

/* ─────────────────────────── SEARCH ─────────────────────────── */
.sdp-search{ padding: 48px 0 80px; }
.sdp-search__form{ display: flex; border: 1px solid var(--sdp-ink); max-width: 640px; }
.sdp-search__form input{ flex: 1; background: var(--sdp-surface); border: 0; padding: 16px 20px; font-size: 15px; color: var(--sdp-ink); font-family: inherit; outline: 0; }
.sdp-search__form button{ background: var(--sdp-ink); color: var(--sdp-bg); border: 0; padding: 0 28px; font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; cursor: pointer; font-family: inherit; }
.sdp-search__form button:hover{ opacity: 0.86; }
.sdp-search__head{ margin-bottom: 36px; }
.sdp-search__count{ color: var(--sdp-ink-soft); font-size: 13px; margin: 8px 0 0; letter-spacing: 0.05em; }
.sdp-search__hint{ color: var(--sdp-ink-soft); font-size: 14px; margin: 12px 0 0; max-width: 540px; }
.sdp-search__empty{ padding: 32px 0 80px; }
.sdp-search__empty .sdp-search__form{ margin-bottom: 56px; }
.sdp-search__suggest{ max-width: 640px; }
.sdp-search__suggest .sdp-eyebrow{ display: block; margin-bottom: 16px; color: var(--sdp-ink-soft); }
.sdp-search__links{ list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sdp-search__links a{ display: inline-block; padding: 10px 18px; border: 1px solid var(--sdp-rule); font-size: 13px; letter-spacing: 0.04em; transition: border-color .15s, color .15s; }
.sdp-search__links a:hover{ border-color: var(--sdp-ink); }
.sdp-search__tags{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; justify-content: center; }

/* ─────────────────────────── 404 ─────────────────────────── */
.sdp-404{ padding: 96px 0 80px; text-align: center; }
.sdp-404 .sdp-h1{ font-size: 64px; font-style: italic; margin: 14px 0 18px; }
.sdp-404__lede{ color: var(--sdp-ink-soft); max-width: 520px; margin: 0 auto; }
.sdp-404__cta{ display: flex; gap: 12px; justify-content: center; margin-top: 36px; flex-wrap: wrap; }
.sdp-404__related{ margin-top: 96px; text-align: left; }
.sdp-404__related .sdp-eyebrow{ display: block; margin-bottom: 24px; text-align: center; color: var(--sdp-ink-soft); }
.sdp-grid{ display: grid; gap: 24px; }
.sdp-grid--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 768px){
    .sdp-grid--4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ─────────────────────────── FOOTER ─────────────────────────── */
.sdp-footer{ background: var(--sdp-ink); color: var(--sdp-bg); padding: 72px 48px 32px; margin-top: 80px; }
.sdp-footer__grid{ max-width: var(--sdp-container); margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.sdp-footer__brand p{ margin-top: 18px; font-size: 14px; line-height: 1.65; opacity: 0.78; max-width: 320px; }
.sdp-footer__col .sdp-eyebrow{ opacity: 0.55; margin-bottom: 16px; display: block; color: var(--sdp-bg); }
.sdp-footer__col ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.sdp-footer__col li a{ opacity: 0.85; transition: opacity .15s; }
.sdp-footer__col li a:hover{ opacity: 1; }
.sdp-footer__rich{ padding: 0; }
.sdp-footer__rich a{ display: inline-flex; flex-direction: column; gap: 4px; text-decoration: none; opacity: 1; }
.sdp-footer__rich__main{ display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: var(--sdp-bg); opacity: 0.95; line-height: 1.3; transition: opacity .15s, color .15s; }
.sdp-footer__rich__sub{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 14px; color: var(--sdp-bg); opacity: 0.5; line-height: 1.3; }
.sdp-footer__rich a:hover .sdp-footer__rich__main{ color: #E8C58F; opacity: 1; }
.sdp-footer__rich__icon{ width: 14px; height: 14px; flex-shrink: 0; display: inline-block; opacity: 0.55; transition: opacity .15s; }
.sdp-footer__rich__icon img{ width: 14px; height: 14px; display: block; }
.sdp-footer__rich a:hover .sdp-footer__rich__icon{ opacity: 1; }
.sdp-footer__rule{ max-width: var(--sdp-container); margin: 24px auto; border: 0; border-top: 1px solid rgba(255,255,255,0.12); }
.sdp-footer__legal{ max-width: var(--sdp-container); margin: 0 auto; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 12px; opacity: 0.55; }

/* ─────────────────────────── WHATSAPP FLOAT ─────────────────────────── */
.sdp-wa-float{ position: fixed; bottom: 24px; right: 24px; width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #FFFFFF; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(0,0,0,0.18); z-index: 80; transition: transform .15s, background .15s; }
.sdp-wa-float:hover{ transform: scale(1.06); background: #1FB855; }

/* ─────────────────────────── TESTIMONIALS ─────────────────────────── */
.sdp-testi{ padding: 96px 0 88px; background: var(--sdp-ink); color: var(--sdp-bg); }
.sdp-testi .sdp-section__head--center{ text-align: center; margin-bottom: 56px; }
.sdp-testi .sdp-h2{ font-size: 46px; color: var(--sdp-bg); margin-top: 8px; }
.sdp-testi .sdp-eyebrow{ color: rgba(241,232,208,0.55); }
.sdp-testi__stage{ position: relative; display: grid; grid-template-columns: 52px 1fr 52px; gap: 32px; align-items: center; }
.sdp-testi__viewport{ overflow: hidden; position: relative; }
.sdp-testi__track{ display: flex; gap: 24px; transition: transform .55s cubic-bezier(.4,0,.2,1); will-change: transform; }
.sdp-testi__arrow{ width: 52px; height: 52px; border: 1px solid rgba(241,232,208,0.3); background: transparent; color: var(--sdp-bg); display: grid; place-items: center; cursor: pointer; transition: background .2s, color .2s, border-color .2s, opacity .2s; }
.sdp-testi__arrow:hover{ background: var(--sdp-bg); color: var(--sdp-ink); border-color: var(--sdp-bg); }
.sdp-testi__arrow:focus-visible{ outline: 2px solid #E8C58F; outline-offset: 2px; }
.sdp-testi__arrow[aria-disabled="true"]{ opacity: 0.35; pointer-events: none; }
.sdp-testi__arrow svg{ width: 20px; height: 20px; }
.sdp-testi__card{ flex: 0 0 calc((100% - 48px) / 3); padding: 36px 32px 32px; background: rgba(241,232,208,0.04); border: 1px solid rgba(241,232,208,0.14); display: flex; flex-direction: column; opacity: 0.45; transition: opacity .4s, border-color .4s, background .4s, transform .4s; }
.sdp-testi__card.is-active{ opacity: 1; background: rgba(232,197,143,0.08); border-color: rgba(232,197,143,0.4); transform: translateY(-4px); }
.sdp-testi__quote-mark{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 48px; line-height: 0.6; color: #E8C58F; opacity: 0.6; margin-bottom: 14px; }
.sdp-testi__card blockquote{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 20px; line-height: 1.45; color: var(--sdp-bg); margin: 0 0 28px; flex: 1; }
.sdp-testi__attr{ border-top: 1px solid rgba(241,232,208,0.18); padding-top: 18px; display: flex; flex-direction: column; gap: 4px; }
.sdp-testi__name{ font-size: 13px; text-transform: uppercase; color: var(--sdp-bg); opacity: 0.92; }
.sdp-testi__sub{ font-family: var(--sdp-font-heading); font-style: italic; font-size: 13px; color: #E8C58F; opacity: 0.85; }
.sdp-testi__dots{ display: flex; gap: 10px; justify-content: center; margin-top: 40px; }
.sdp-testi__dot{ width: 8px; height: 8px; background: rgba(241,232,208,0.25); border: 0; padding: 0; cursor: pointer; transition: width .25s, background .25s; }
.sdp-testi__dot.is-active{ width: 32px; background: #E8C58F; }
.sdp-testi__dot:hover:not(.is-active){ background: rgba(241,232,208,0.5); }
.sdp-testi__dot:focus-visible{ outline: 2px solid #E8C58F; outline-offset: 4px; }

/* ─────────────────────────── BLOG (DIÁRIO) ─────────────────────────── */
.sdp-posts{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.sdp-post{ display: block; color: inherit; }
.sdp-post__media{ aspect-ratio: 16/10; background: var(--sdp-surface-alt); overflow: hidden; border: 1px solid var(--sdp-rule); }
.sdp-post__media img{ width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.sdp-post:hover .sdp-post__media img{ transform: scale(1.03); }
.sdp-post__body{ padding-top: 18px; }
.sdp-post__title{ font-family: var(--sdp-font-heading); font-size: 22px; line-height: 1.2; margin: 6px 0 8px; }
.sdp-post__excerpt{ font-size: 14px; color: var(--sdp-ink-soft); line-height: 1.55; }

/* ─────────────────────────── NEWSLETTER ─────────────────────────── */
.sdp-newsletter{ text-align: center; max-width: 540px; margin: 0 auto; }
.sdp-newsletter form{ display: flex; gap: 0; border: 1px solid var(--sdp-ink); margin-top: 24px; }
.sdp-newsletter input{ flex: 1; padding: 16px 18px; border: 0; background: var(--sdp-surface); font-family: inherit; font-size: 14px; color: var(--sdp-ink); outline: 0; }
.sdp-newsletter button{ background: var(--sdp-ink); color: var(--sdp-bg); padding: 0 24px; border: 0; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; font-family: inherit; cursor: pointer; }

/* ─────────────────────────── MINI CART DRAWER ─────────────────────────── */
.sdp-drawer-backdrop{ position: fixed; inset: 0; background: rgba(42,31,17,0.4); z-index: 90; opacity: 0; pointer-events: none; transition: opacity .28s; }
.sdp-drawer-backdrop.is-open{ opacity: 1; pointer-events: auto; }
.sdp-drawer{ position: fixed; top: 0; right: 0; width: 420px; max-width: 100%; height: 100vh; background: var(--sdp-bg); z-index: 91; transform: translateX(100%); transition: transform .28s cubic-bezier(0.2, 0.9, 0.3, 1); display: flex; flex-direction: column; }
.sdp-drawer.is-open{ transform: translateX(0); }
.sdp-drawer__head{ padding: 22px 24px; border-bottom: 1px solid var(--sdp-rule); display: flex; justify-content: space-between; align-items: center; }
.sdp-drawer__body{ flex: 1; overflow-y: auto; padding: 16px 24px; }
.sdp-drawer__foot{ padding: 20px 24px; border-top: 1px solid var(--sdp-rule); background: var(--sdp-surface-alt); }
.sdp-drawer__close{ background: 0; border: 0; cursor: pointer; padding: 4px; font-size: 22px; line-height: 1; color: var(--sdp-ink); }

/* ─────────────────────────── MOBILE NAV DRAWER (hamburger) ─────────────────────────── */
.sdp-hamburger{ display: none; background: 0; border: 0; padding: 8px; margin: 0 -8px 0 0; cursor: pointer; color: var(--sdp-ink); }
.sdp-hamburger svg{ display: block; }
.sdp-mobile-menu{ position: fixed; top: 0; left: 0; width: 88%; max-width: 360px; height: 100vh; background: var(--sdp-bg); z-index: 91; transform: translateX(-100%); transition: transform .28s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; box-shadow: 0 0 0 transparent; }
.sdp-mobile-menu.is-open{ transform: translateX(0); box-shadow: 0 20px 60px rgba(42,31,17,0.25); }
.sdp-mobile-menu__head{ display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--sdp-rule); }
.sdp-mobile-menu__head .sdp-logo__lg{ font-size: 18px; letter-spacing: 0.22em; }
.sdp-mobile-menu__head .sdp-logo__sm{ font-size: 9px; }
.sdp-mobile-menu__close{ background: 0; border: 0; cursor: pointer; padding: 4px; font-size: 24px; line-height: 1; color: var(--sdp-ink); }
.sdp-mobile-menu__body{ flex: 1; overflow-y: auto; padding: 8px 0 24px; }
.sdp-mobile-menu__group{ padding: 18px 22px 6px; }
.sdp-mobile-menu__group .sdp-eyebrow{ display: block; color: var(--sdp-ink-soft); margin-bottom: 12px; }
.sdp-mobile-menu__list{ list-style: none; padding: 0; margin: 0; }
.sdp-mobile-menu__list li + li{ border-top: 1px solid var(--sdp-rule); }
.sdp-mobile-menu__list a{ display: flex; align-items: center; justify-content: space-between; padding: 14px 22px; color: var(--sdp-ink); text-decoration: none; font-family: var(--sdp-font-heading); font-style: italic; font-size: 22px; }
.sdp-mobile-menu__list a:hover{ background: var(--sdp-surface-alt); }
.sdp-mobile-menu__list a .sdp-num{ font-style: normal; font-size: 12px; color: var(--sdp-ink-soft); letter-spacing: 0.06em; }
.sdp-mobile-menu__sub{ list-style: none; padding: 0; margin: 0; }
.sdp-mobile-menu__sub a{ padding: 10px 22px; font-family: var(--sdp-font-sans); font-style: normal; font-size: 14px; color: var(--sdp-ink-soft); border-top: 1px solid var(--sdp-rule); }
.sdp-mobile-menu__foot{ padding: 20px 22px; border-top: 1px solid var(--sdp-rule); background: var(--sdp-surface-alt); display: grid; gap: 10px; font-size: 13px; }
.sdp-mobile-menu__foot a{ color: var(--sdp-ink); text-decoration: none; display: flex; align-items: center; gap: 10px; }
.sdp-mobile-menu__foot a svg{ width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.5; fill: none; }

/* ─────────────────────────── ICONS ─────────────────────────── */
.sdp-icon{ width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.5; fill: none; vertical-align: middle; }
.sdp-icon--lg{ width: 24px; height: 24px; }

/* ─────────────────────────── WELCOME POPUP (C3) ─────────────────────────── */
.sdp-welcome[hidden]{ display: none; }
.sdp-welcome{
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: sdp-welcome-fade .25s ease-out;
}
.sdp-welcome__scrim{
  position: absolute;
  inset: 0;
  background: rgba(42,31,17,0.55);
  cursor: pointer;
}
.sdp-welcome__modal{
  position: relative;
  width: 780px;
  max-width: 100%;
  max-height: calc(100vh - 48px);
  background: var(--sdp-bg);
  border: 1px solid var(--sdp-rule);
  box-shadow: 0 30px 80px rgba(0,0,0,0.45);
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  overflow-y: auto;
  animation: sdp-welcome-rise .35s cubic-bezier(.2,.8,.2,1);
}
@keyframes sdp-welcome-fade{ from{ opacity: 0; } to{ opacity: 1; } }
@keyframes sdp-welcome-rise{ from{ transform: translateY(12px); opacity: 0; } to{ transform: none; opacity: 1; } }
.sdp-welcome__close{
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: var(--sdp-ink-soft);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color .2s;
}
.sdp-welcome__close:hover{ color: var(--sdp-ink); }
.sdp-welcome__close:focus-visible{ color: var(--sdp-ink); outline: 1px solid currentColor; outline-offset: 3px; }
.sdp-welcome__close svg{ width: 14px; height: 14px; }
.sdp-welcome__main,
.sdp-welcome__side{ display: flex; flex-direction: column; }
.sdp-welcome__main{
  min-height: 430px;
  padding: 56px 48px 40px;
  background: var(--sdp-ink);
  color: var(--sdp-bg);
}
.sdp-welcome__side{
  padding: 56px 36px 40px;
  background: var(--sdp-surface);
  border-left: 1px solid var(--sdp-rule);
}
.sdp-welcome__eyebrow{
  display: block;
  margin-bottom: 14px;
  color: var(--sdp-accent);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.sdp-welcome__eyebrow--amber{ color: var(--sdp-amber); }
.sdp-welcome__title{
  margin: 0 0 14px;
  color: var(--sdp-ink);
  font-family: var(--sdp-font-heading);
  font-style: italic;
  font-size: 40px;
  line-height: 1.05;
}
.sdp-welcome__main .sdp-welcome__title{ color: var(--sdp-bg); }
.sdp-welcome__title--side{ font-size: 28px; }
.sdp-welcome__body{
  margin: 0 0 24px;
  font-size: 14.5px;
  line-height: 1.65;
}
.sdp-welcome__main .sdp-welcome__body{ color: rgba(241,232,208,0.85); font-size: 15px; }
.sdp-welcome__body--side{ margin-bottom: 20px; font-size: 13.5px; }
.sdp-welcome__actions{
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sdp-welcome__link{
  align-self: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(241,232,208,0.65);
  cursor: pointer;
  font-family: var(--sdp-font-body);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.sdp-welcome__link:hover{ color: var(--sdp-bg); }
.sdp-welcome__link:focus-visible{ color: var(--sdp-bg); outline: 1px solid currentColor; outline-offset: 4px; }
.sdp-welcome__coupon{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin-bottom: 20px;
  padding: 18px;
  background: var(--sdp-bg);
  border: 1px dashed var(--sdp-ink);
  text-align: center;
}
.sdp-welcome__coupon-label{
  color: var(--sdp-ink-soft);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.sdp-welcome__coupon-code{
  color: var(--sdp-ink);
  font-family: var(--sdp-font-mono);
  font-size: 20px;
  letter-spacing: 0.16em;
}
.sdp-welcome__coupon-copy{
  margin-top: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--sdp-accent);
  cursor: pointer;
  font-family: var(--sdp-font-body);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-decoration: underline;
  text-transform: uppercase;
  text-underline-offset: 3px;
}
.sdp-welcome__coupon-copy:focus-visible{ outline: 1px solid var(--sdp-accent); outline-offset: 3px; }
.sdp-welcome__sub{
  margin: 0;
  color: var(--sdp-ink-soft);
  font-family: var(--sdp-font-heading);
  font-size: 13px;
  font-style: italic;
  text-align: center;
}
@media (max-width: 760px){
  .sdp-welcome{
    align-items: flex-start;
    height: 100vh;
    height: 100dvh;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
    overflow-y: auto;
  }
  .sdp-welcome__modal{ grid-template-columns: 1fr; max-width: 420px; max-height: none; }
  .sdp-welcome__main{ min-height: 0; padding: 28px 22px 24px; }
  .sdp-welcome__side{ padding: 26px 22px 24px; border-left: 0; border-top: 1px solid var(--sdp-rule); }
  .sdp-welcome__eyebrow{ margin-bottom: 10px; font-size: 10px; letter-spacing: 0.2em; }
  .sdp-welcome__main .sdp-welcome__title{ font-size: 27px; margin-bottom: 10px; }
  .sdp-welcome__title--side{ font-size: 22px; margin-bottom: 10px; }
  .sdp-welcome__body{ line-height: 1.5; margin-bottom: 18px; }
  .sdp-welcome__main .sdp-welcome__body{ font-size: 13.5px; }
  .sdp-welcome__body--side{ font-size: 13px; margin-bottom: 14px; }
  .sdp-welcome__actions{ gap: 10px; }
  .sdp-welcome__main .sdp-btn{ padding: 12px 16px; font-size: 11px; letter-spacing: 0.16em; }
  .sdp-welcome__link{ font-size: 11.5px; }
  .sdp-welcome__close{ top: 12px; right: 12px; width: 28px; height: 28px; color: rgba(241,232,208,0.72); }
  .sdp-welcome__close:hover,
  .sdp-welcome__close:focus-visible{ color: var(--sdp-bg); }
  .sdp-welcome__coupon{ padding: 12px; margin-bottom: 12px; }
  .sdp-welcome__coupon-code{ font-size: 17px; }
  .sdp-welcome__coupon-copy{ margin-top: 6px; }
  .sdp-welcome__sub{ font-size: 12px; }
}

/* ─────────────────────────── RESPONSIVE ─────────────────────────── */
@media (max-width: 880px){
  .sdp-container{ padding-left: 20px; padding-right: 20px; }
  .sdp-section{ padding: 48px 0; }
  .sdp-h1{ font-size: 36px; }
  .sdp-h1--xl{ font-size: 40px; }
  .sdp-h2{ font-size: 28px; }
  .sdp-h3{ font-size: 22px; }
  .sdp-hero{ grid-template-columns: 1fr; height: auto; min-height: auto; }
  .sdp-hero__media{ aspect-ratio: 4/3; }
  .sdp-hero__body{ padding: 32px 20px 48px; }
  .sdp-hero__body .sdp-h1--xl{ font-size: 36px; }
  .sdp-hero__dots{ bottom: 16px; }
  .sdp-header__inner{ grid-template-columns: auto 1fr auto; padding: 14px 20px; }
  .sdp-nav--left, .sdp-nav--right{ display: none; }
  .sdp-nav--mobile{ display: flex; gap: 16px; justify-content: flex-end; align-items: center; }
  .sdp-search-overlay{ padding: 18px 20px 22px; }
  .sdp-search-overlay__form{ gap: 12px; }
  .sdp-search-overlay__input{ font-size: 18px; padding: 10px 0; }
  .sdp-search-overlay__submit{ font-size: 11px; letter-spacing: 0.16em; }
  .sdp-hamburger{ display: inline-flex; }
  .sdp-cat-grid, .sdp-cat-grid--6{ grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .sdp-cat{ padding: 18px 14px; }
  .sdp-cat__name{ font-size: 17px; }
  .sdp-listing__layout{ grid-template-columns: 1fr; gap: 24px; margin-top: 28px; }
  .sdp-sidebar{ position: static; }
  .sdp-results-bar{ align-items: flex-start; flex-direction: column; }
  .sdp-results-bar__left{ width: 100%; flex-direction: column; align-items: stretch; gap: 12px; }
  .sdp-results-bar__controls{ width: 100%; flex-direction: column; align-items: stretch; }
  .sdp-filter-toggle__button{ width: 100%; }
  .sdp-results-bar__sort{ justify-content: flex-start; }
  .sdp-results-bar__sort,
  .sdp-results-bar__sort select,
  .sdp-results-bar__sort .form-control{ width: 100%; }
  .sdp-product-grid, .sdp-product-grid--3{ grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .sdp-card__body{ padding: 14px 14px 18px; }
  .sdp-card__name{ font-size: 16px; }
  .sdp-pdp__main{ grid-template-columns: 1fr; gap: 32px; }
  .sdp-pdp__info .sdp-h1{ font-size: 36px; }
  .sdp-pdp__about{ margin-top: 56px; padding: 56px 0 16px; }
  .sdp-pdp__about-grid{ grid-template-columns: 1fr; gap: 56px; }
  .sdp-pdp__pyramid{ position: static; }
  .sdp-cart__totals{ padding: 20px; }
  .sdp-footer{ padding: 56px 20px 24px; }
  .sdp-footer__grid{ grid-template-columns: 1fr 1fr; gap: 32px; }
  .sdp-posts{ grid-template-columns: 1fr; }
  .sdp-testi{ padding: 56px 0; }
  .sdp-testi .sdp-section__head--center{ margin-bottom: 28px; }
  .sdp-testi .sdp-h2{ font-size: 30px; }
  .sdp-testi__stage{ grid-template-columns: 40px 1fr 40px; gap: 12px; }
  .sdp-testi__arrow{ width: 40px; height: 40px; }
  .sdp-testi__arrow svg{ width: 16px; height: 16px; }
  .sdp-testi__track{ gap: 16px; }
  .sdp-testi__card{ flex-basis: 100%; opacity: 1; transform: none; background: rgba(232,197,143,0.06); border-color: rgba(232,197,143,0.25); padding: 28px 24px; }
  .sdp-testi__card.is-active{ transform: none; }
  .sdp-testi__card blockquote{ font-size: 19px; margin-bottom: 20px; }
  .sdp-testi__quote-mark{ font-size: 36px; margin-bottom: 10px; }
  .sdp-testi__dots{ margin-top: 20px; gap: 6px; }
  .sdp-testi__dot{ width: 6px; height: 6px; }
  .sdp-testi__dot.is-active{ width: 24px; }
  .sdp-section__head--row{ flex-direction: column; align-items: flex-start; }
  .sdp-wa-float{ width: 52px; height: 52px; bottom: 16px; right: 16px; }
}

@media (max-width: 480px){
  .sdp-hero__body{ padding: 24px 16px 36px; }
  .sdp-pdp__info .sdp-h1{ font-size: 32px; }
  .sdp-pdp__pyramid{ padding: 28px 24px; }
  .sdp-pdp__pyramid h3{ font-size: 28px; }
  .sdp-h1--xl{ font-size: 32px; }
  .sdp-format-grid{ grid-template-columns: 1fr; }
}

/* ─── RELATED / COMPLEMENTARY (PDP + 404) ─── */
.sdp-related{ padding: 64px 0 32px; }
.sdp-related__head{ margin-bottom: 24px; }
.sdp-related__head .sdp-h3{ font-family: var(--sdp-font-heading); font-style: italic; }
.sdp-related__rail{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}
@media (max-width: 880px){
    .sdp-related{ padding: 48px 0 16px; }
    .sdp-related__rail{
        display: flex;
        gap: 16px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 16px;
        scrollbar-width: none;
    }
    .sdp-related__rail::-webkit-scrollbar{ display: none; }
    .sdp-related__rail > *{
        flex: 0 0 70%;
        max-width: 280px;
        scroll-snap-align: start;
    }
}

/* ─── STOCK FORM OVERRIDES (account, contact, password) ───
   The stock theme renders Bootstrap-based login/contact/password forms
   we don't want to rewrite (rewriting risks breaking submit handlers).
   Recolor the primary CTA + inputs so they read on-brand. */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled){
    background-color: var(--sdp-ink) !important;
    border-color: var(--sdp-ink) !important;
    color: var(--sdp-bg) !important;
    font-family: var(--sdp-font-sans) !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    border-radius: 0 !important;
    padding: 16px 24px !important;
    font-weight: 500 !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):hover,
.btn-primary:not(:disabled):not(.disabled):focus{
    background-color: var(--sdp-accent) !important;
    border-color: var(--sdp-accent) !important;
    color: var(--sdp-bg) !important;
}
.form-control{
    background-color: var(--sdp-surface) !important;
    border: 1px solid var(--sdp-rule) !important;
    border-radius: 0 !important;
    color: var(--sdp-ink) !important;
    font-family: inherit !important;
    padding: 14px 16px !important;
    height: auto !important;
}
.form-control:focus{
    border-color: var(--sdp-ink) !important;
    box-shadow: none !important;
    background-color: var(--sdp-bg) !important;
}

/* Pickup-point info — revealed when the option's radio is checked */
.sdp-pickup-info{
    display: none;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--sdp-rule);
    font-family: var(--sdp-font-body);
    color: var(--sdp-ink);
}
.js-shipping-list-item:has(.js-shipping-method:checked) .sdp-pickup-info{
    display: block;
}
.sdp-pickup-info-text{
    margin: 0 0 10px;
    font-size: 13px;
    color: var(--sdp-ink-warm);
}
.sdp-pickup-info-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.sdp-pickup-info-btn{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--sdp-ink);
    background: transparent;
    color: var(--sdp-ink);
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.sdp-pickup-info-btn:hover,
.sdp-pickup-info-btn:focus-visible{
    background: var(--sdp-ink);
    color: var(--sdp-bg);
    text-decoration: none;
    outline: none;
}

/* ─── Shipping calculator: hide PDP-side warnings ───
   The PDP shipping estimator lives inside #product-shipping-container; the
   cart/checkout shipping picker lives inside #cart-shipping-container. We
   want shipping warnings (store-wide emergency banner + per-option pickup
   notices) to surface only at checkout, not on the PDP estimator where the
   customer is still browsing options. The XHR-rendered shipping_options.tpl
   doesn't have product_detail in scope, so we scope by container in CSS. */
#product-shipping-container .js-shipping-calculator-response .alert-warning {
    display: none;
}