/* ===== Svarnadhara — Luxury Heritage theme ===== */

:root {
  --sd-gold: #C9973F;
  --sd-gold-bright: #E7C67A;
  --sd-gold-dark: #8C6E3A;
  --sd-brown: #120D07;
  --sd-brown-soft: #1D160D;
  --sd-cream: #F7EFDC;
  --sd-cream-soft: #D9CCAC;
  --sd-green: #164A2E;
  --sd-green-soft: #2C6B45;
  --sd-serif: "Cormorant Garamond", serif;
  /* Light theme surfaces — replaces the old dark-card "Luxury Heritage"
     look. --sd-brown / --sd-brown-soft are kept above (still used as
     dark TEXT and for the gold-button label color) but no longer used
     as large background fills anywhere in this file. */
  --sd-page-bg: #FBF6EC;
  --sd-surface: #FFFFFF;
  --sd-ink: #2B2016;
  --sd-ink-soft: #6B5A44;
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
}

body { font-family: "Poppins", "Segoe UI", Arial, sans-serif; }

body.sd-page-dark {
  font-weight: 300;
  background: var(--sd-page-bg);
  color: var(--sd-ink);
}
.sd-page-dark h1, .sd-page-dark h2, .sd-page-dark h3, .sd-page-dark h4 {
  font-family: var(--sd-serif); font-weight: 600; letter-spacing: 0;
}

/* PROMO BAR */
.sd-promo-bar {
  /* background: var(--sd-brown); */
  background: #044400ed;
  color: var(--sd-gold-bright);
  text-align: center;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  padding: 9px 16px;
}

/* NAV */
.sd-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  /* background: rgba(18,13,7,0.96); */
  background: #d9ccac57;
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(231,198,122,0.18);
}

/* Homepage only: nav floats fixed over the hero carousel as a solid
   blurred bar with dark text at all times (same look whether at the
   top of the page or scrolled), so it stays legible over any part of
   the hero art instead of scrolling away or turning transparent. */
.sd-hero-nav-wrap { position: relative; }
body.sd-page-home .sd-hero-nav-wrap #nav-placeholder {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
}
body.sd-page-home .sd-hero-nav-wrap .sd-promo-bar {
  transition: background 0.2s ease;
}
body.sd-page-home .sd-hero-nav-wrap .sd-nav {
  /* backdrop-filter creates a new containing block, which breaks the
     mobile dropdown's `position: absolute; top: 100%` (it would
     position against #nav-placeholder instead of this bar). Keep this
     positioned so it stays the dropdown's actual anchor. */
  position: relative;
  background: #d9ccac57;
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(231,198,122,0.18);
  box-shadow: 0 2px 12px rgba(43,32,22,0.08);
}
body.sd-page-home .sd-hero-nav-wrap .sd-nav-brand-text,
body.sd-page-home .sd-hero-nav-wrap .sd-nav-links a,
body.sd-page-home .sd-hero-nav-wrap .sd-nav-user-trigger,
body.sd-page-home .sd-hero-nav-wrap .sd-nav-user-caret,
body.sd-page-home .sd-hero-nav-wrap .sd-lang-toggle button,
body.sd-page-home .sd-hero-nav-wrap .sd-nav-toggle span {
  color: #3a2900;
}
body.sd-page-home .sd-hero-nav-wrap .sd-nav-toggle span { background: #3a2900; }
body.sd-page-home .sd-hero-nav-wrap .sd-lang-toggle { border-color: rgba(58,41,0,0.3); }
body.sd-page-home .sd-hero-nav-wrap .sd-nav-search {
  background: rgba(58,41,0,0.06);
  border-color: rgba(58,41,0,0.18);
}
body.sd-page-home .sd-hero-nav-wrap .sd-nav-search input { color: #3a2900; }
body.sd-page-home .sd-hero-nav-wrap .sd-nav-search input::placeholder { color: rgba(58,41,0,0.45); }
body.sd-page-home .sd-hero-nav-wrap .sd-nav-search button { color: #3a2900; }

/* Push page content down by the fixed nav's height, since it's no longer
   in normal flow to reserve that space itself. The nav floats over the
   hero photo by design, but still needs enough clearance that it
   doesn't crowd the headline baked into the top of the slide art. */
body.sd-page-home .sd-carousel { margin-top: 0; }
@media (min-width: 901px) {
  body.sd-page-home .sd-carousel { margin-top: 115px; }
}
@media (max-width: 900px) {
  /* Below the nav breakpoint the nav no longer overlays the hero as a
     transparent bar (there's no photo content it needs to sit over
     once the carousel switches to object-fit: contain), so let it sit
     in normal flow above the carousel instead of floating fixed. */
  body.sd-page-home .sd-hero-nav-wrap #nav-placeholder { position: static; }
  body.sd-page-home .sd-carousel { margin-top: 0; }
}
@media (max-width: 980px) {
  /* Below the nav breakpoint the mobile menu panel needs a solid
     background of its own, since it's no longer implicitly opaque. */
  body.sd-page-home .sd-hero-nav-wrap .sd-nav-links { background: #1e5012; }
  body.sd-page-home .sd-hero-nav-wrap .sd-nav-links a { color: var(--sd-cream); }
  /* The hero photo already shows the full Svarndhara logo and wordmark
     large and centered — showing the nav's own logo here collides with it. */
  body.sd-page-home .sd-hero-nav-wrap .sd-nav-brand { visibility: hidden; }
}
.sd-nav-inner {
  display: flex;
  align-items: center;
  gap: 32px;
  max-width: 1600px;
  margin: 0 auto;
  padding: 14px 40px;
}
.sd-nav-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}
.sd-nav-logo { height: 70px; width: auto; display: block; }
.sd-nav-brand-text {
  font-family: var(--sd-serif);
  font-style: italic;
  font-weight: 600;
  /* color: var(--sd-gold-bright); */
  color: #3a2900;
  font-size: 1.9rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.sd-nav-links {
  display: flex;
  align-items: center;
  gap: 26px;
  flex: 1;
  justify-content: center;
  flex-wrap: nowrap;
}
.sd-nav-links a {
  /* color: var(--sd-cream-soft); */
  color: #3a2900;
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
  transition: color 0.15s ease;
}
.sd-nav-links a:hover {
   color: var(--sd-gold-bright);
   }
.sd-nav-search {
  display: flex;
  align-items: center;
  background: rgba(58,41,0,0.06);
  border: 1px solid rgba(58,41,0,0.18);
  border-radius: 999px;
  padding: 4px 4px 4px 14px;
  max-width: 220px;
  flex-shrink: 1;
}
.sd-nav-search input {
  border: none;
  background: transparent;
  font-size: 0.82rem;
  color: #3a2900;
  width: 100%;
  outline: none;
  padding: 6px 0;
}
.sd-nav-search input::placeholder { color: rgba(58,41,0,0.45); }
.sd-nav-search button {
  border: none;
  background: transparent;
  color: #3a2900;
  cursor: pointer;
  padding: 6px;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.sd-nav-search svg { width: 16px; height: 16px; }
@media (max-width: 1100px) { .sd-nav-search { display: none; } }

.sd-nav-right {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-shrink: 0;
  margin-left: auto;
}
.sd-nav-user-dropdown { position: relative; }
.sd-nav-user-trigger {
  display: flex;
  align-items: center;
  gap: 7px;
  background: none;
  border: none;
  color: #3a2900;
  font-size: 0.85rem;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  letter-spacing: 0.02em;
  white-space: nowrap;
  cursor: pointer;
  padding: 6px 2px;
}
.sd-nav-user-caret { color: #3a2900; transition: transform 0.15s ease; flex-shrink: 0; }
.sd-nav-user-dropdown.sd-nav-user-open .sd-nav-user-caret { transform: rotate(180deg); }
.sd-nav-user-menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 160px;
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.25);
  border-radius: 8px;
  box-shadow: 0 16px 34px rgba(43,32,22,0.18);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
}
.sd-nav-user-dropdown.sd-nav-user-open .sd-nav-user-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.sd-nav-user-menu-item {
  display: block;
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  color: var(--sd-ink-soft);
  font-size: 0.78rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-family: inherit;
  padding: 13px 18px;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}
.sd-nav-user-menu-item:hover { color: var(--sd-gold-bright); background: rgba(231,198,122,0.1); }
.sd-nav-cta {
  padding: 10px 22px;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.sd-lang-toggle {
  display: flex;
  align-items: center;
  border: 1px solid rgba(58,41,0,0.3);
  border-radius: 999px;
  padding: 3px;
  gap: 2px;
  flex-shrink: 0;
}
.sd-lang-toggle button {
  background: none;
  border: none;
  color: #3a2900;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 5px 11px;
  border-radius: 999px;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  transition: background 0.15s ease, color 0.15s ease;
}
.sd-lang-toggle button.active {
  background: var(--sd-gold-bright);
  color: var(--sd-brown);
}
.sd-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 34px;
  height: 34px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.sd-nav-toggle span {
  display: block;
  height: 2px;
  width: 100%;
  background: #3a2900;
  border-radius: 2px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.sd-nav-toggle-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sd-nav-toggle-open span:nth-child(2) { opacity: 0; }
.sd-nav-toggle-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Medium desktop / laptop band: full nav still shows in one row, but
   more tightly packed so it doesn't outgrow common 1024-1300px laptop
   viewports (below 980px the hamburger menu takes over instead). */
@media (max-width: 1300px) and (min-width: 981px) {
  .sd-nav-inner { padding: 5px 11px; gap: 16px; }
  .sd-nav-logo { height: 50px; }
  .sd-nav-brand-text { font-size: 1.4rem; }
  .sd-nav-links { gap: 14px; }
  .sd-nav-links a { font-size: 0.76rem; letter-spacing: 0.03em; }
  .sd-nav-right { gap: 10px; }
  .sd-nav-user-trigger { font-size: 0.76rem; }
  .sd-nav-cta { padding: 8px 14px; font-size: 0.7rem; }
  .sd-lang-toggle button { padding: 4px 8px; font-size: 0.68rem; }
}

@media (max-width: 980px) {
  .sd-nav-inner { padding: 5px 11px;  gap: 16px; }
  .sd-nav-logo { height: 50px; }
  .sd-nav-brand-text { font-size: 1.5rem; }
  .sd-nav-links {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    background: var(--sd-surface);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
    border-bottom: 1px solid rgba(201,151,63,0.2);
  }
  .sd-nav-links.sd-nav-open { max-height: 80vh; overflow-y: auto; }
  .sd-nav-links a {
    padding: 10px 18px;
    border-top: 1px solid rgba(201,151,63,0.12);
    width: 100%;
    text-align: left;
    color: var(--sd-ink-soft);
  }
  .sd-nav-right { gap: 10px; }
  .sd-nav-user-dropdown { display: none; }
  .sd-nav-cta { display: none; }
  .sd-nav-toggle { display: flex; }
  .sd-nav-mobile-user {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 24px;
    border-top: 1px solid rgba(201,151,63,0.15);
  }
  .sd-nav-mobile-user .sd-nav-user-name {
    color: var(--sd-ink-soft);
    font-size: 0.85rem;
    font-weight: 600;
  }
  .sd-nav-mobile-user .sd-nav-user-menu-item {
    width: auto;
    padding: 8px 16px;
    border: 1px solid rgba(201,151,63,0.4);
    border-radius: 999px;
    color: var(--sd-gold-dark);
  }
}

@media (min-width: 981px) {
  .sd-nav-mobile-user { display: none; }
}

/* Very narrow phones (iPhone SE and similar ~320px) — the standard
   mobile bar above is still a touch too wide, so trim it further. */
@media (max-width: 360px) {
  .sd-nav-inner { padding: 5px 11px; gap: 10px; }
  .sd-nav-brand { gap: 8px; }
  .sd-nav-logo { height: 38px; }
  .sd-nav-brand-text { font-size: 1.15rem; }
  .sd-nav-right { gap: 6px; }
  .sd-lang-toggle { padding: 2px; }
  .sd-lang-toggle button { padding: 4px 6px; font-size: 0.64rem; }
  .sd-nav-toggle { width: 28px; height: 28px; }
}

/* HERO CAROUSEL — real designed slide images, full-bleed on desktop
   where the container matches the source's own 2048x768 banner ratio
   (so nothing is cropped). On narrower screens the container can't
   stay that wide without going too short to read the headline, so we
   switch to object-fit: contain — the whole image (headline, icons,
   button, right-side art) always stays fully visible, letterboxed on
   a plain background instead of having any of it cropped off. */
.sd-carousel {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 2048 / 768;
  max-height: 82vh;
  background: var(--sd-page-bg);
}
.sd-carousel-track {
  position: relative;
  width: 100%;
  height: 100%;
}
.sd-carousel-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.7s ease;
}
.sd-carousel-slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.sd-carousel-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 900px) {
  .sd-carousel { max-height: none; background: var(--sd-page-bg); }
  .sd-carousel-photo { object-fit: contain; object-position: center; }
}
.sd-carousel-hitzone {
  position: absolute;
  left: 10%;
  bottom: 19%;
  width: 22%;
  height: 8%;
  z-index: 2;
  cursor: pointer;
}
.sd-carousel-hitzone-2 {
  bottom: 16.5%;
}
.sd-carousel-hitzone-3 {
  bottom: 23.3%;
}

.sd-carousel-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.85);
  color: var(--sd-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(43,32,22,0.15);
  transition: background 0.15s ease, transform 0.15s ease;
}
.sd-carousel-arrow:hover { background: var(--sd-surface); transform: translateY(-50%) scale(1.06); }
.sd-carousel-arrow svg { width: 20px; height: 20px; }
.sd-carousel-arrow-prev { left: 20px; }
.sd-carousel-arrow-next { right: 20px; }
@media (max-width: 640px) {
  .sd-carousel-arrow { width: 34px; height: 34px; z-index: 4; }
  .sd-carousel-arrow svg { width: 16px; height: 16px; }
  .sd-carousel-arrow-prev { left: 10px; }
  .sd-carousel-arrow-next { right: 10px; }
}

.sd-carousel-dots {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 8px;
}
.sd-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(43,32,22,0.25);
  cursor: pointer;
  padding: 0;
  transition: background 0.15s ease, transform 0.15s ease;
}
.sd-carousel-dot.is-active { background: var(--sd-gold-dark); transform: scale(1.3); }

.sd-carousel-badges {
  position: relative;
  z-index: 2;
  background: var(--sd-surface);
  border-top: 1px solid rgba(140,110,58,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  padding: 18px 20px;
}
.sd-carousel-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--sd-ink-soft);
  font-size: 0.8rem;
  font-weight: 500;
}
.sd-carousel-badge svg { width: 18px; height: 18px; color: var(--sd-gold-dark); flex-shrink: 0; }
.sd-carousel-badge-sep { width: 1px; height: 16px; background: rgba(140,110,58,0.25); }
@media (max-width: 900px) { .sd-carousel-badge-sep:nth-of-type(6) { display: none; } .sd-carousel-badge:nth-of-type(4) { display: none; } }
@media (max-width: 640px) { .sd-carousel-badges { gap: 10px; } .sd-carousel-badge-sep { display: none; } }

.btn {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  background: linear-gradient(135deg, var(--sd-gold-bright), var(--sd-gold));
  color: var(--sd-brown);
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(201,151,63,0.25);
  font-size: 18px;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(201,151,63,0.35); }

.btn-outline {
  background: transparent;
  /* border: 1px solid rgba(231,198,122,0.6);
  color: var(--sd-gold-bright); */
  border: 1px solid rgb(44 125 14 / 60%);
    color: #3c871b;
  box-shadow: none;
}
.btn-outline:hover { background: rgba(231,198,122,0.1); color: var(--sd-gold-bright); transform: translateY(-2px); box-shadow: none; }

/* WAVE DIVIDERS */
.sd-wave { line-height: 0; margin-top: -1px; }
.sd-wave svg { width: 100%; height: 60px; display: block; }
.sd-wave svg path { 
  /* fill: var(--sd-brown-soft);  */
  fill: #694900;

}
.sd-wave-flip { transform: scaleY(-1); }

/* TRUST ROW — integrated into hero bottom, not a separate section */
.sd-hero-trustrow {
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(231,198,122,0.18);
}
.sd-hero-trustrow-inner {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
  padding: 18px 20px;
}
@media (max-width: 900px) { .sd-hero-trustrow-inner { gap: 20px 28px; } }
.sd-trust-item {
  font-size: 0.98rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sd-cream-soft);
  display: flex;
  align-items: center;
  gap: 8px;
  transition: transform 0.15s ease, color 0.15s ease;
}
.sd-trust-item:hover { transform: translateY(-2px); color: var(--sd-gold-bright); }
.sd-trust-icon { width: 20px; height: 20px; flex-shrink: 0; }

/* QUICK CATEGORY NAV */
.sd-quicknav {
  background: var(--sd-surface);
  border-bottom: 1px solid rgba(201,151,63,0.2);
}
.sd-quicknav-inner {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 14px 20px;
}
.sd-quicknav-item {
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid rgba(201,151,63,0.3);
  color: var(--sd-ink-soft);
  font-size: 0.85rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.sd-quicknav-item:hover { border-color: var(--sd-gold-dark); color: var(--sd-ink); }
.sd-quicknav-item.active {
  background: linear-gradient(135deg, var(--sd-gold-bright), var(--sd-gold));
  border-color: transparent;
  color: var(--sd-brown);
}
@media (max-width: 700px) {
  .sd-quicknav-inner { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* CERTIFICATION STRIP */
.sd-cert-strip {
  background: var(--sd-surface);
  border-top: 1px solid rgba(201,151,63,0.2);
  border-bottom: 1px solid rgba(201,151,63,0.2);
}
.sd-cert-strip-inner {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 36px 48px;
  padding: 26px 20px;
}
.sd-cert-item {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--sd-ink-soft);
  font-size: 0.85rem;
  font-weight: 500;
}
.sd-cert-item svg { width: 22px; height: 22px; color: var(--sd-gold-dark); flex-shrink: 0; }

/* STATS BAND */
.sd-stats-band {
  background: #3a2900;
  padding: 70px 0;
}
.sd-stats-band-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 56px;
  align-items: center;
}
.sd-stats-band-media {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,0.35);
}
.sd-stats-band-media img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4 / 3; }
.sd-stats-band-text .sd-eyebrow { color: var(--sd-gold-bright); }
.sd-stats-band-text h2 {
  font-family: var(--sd-serif);
  font-style: italic;
  color: var(--sd-cream);
  font-size: 2rem;
  margin: 0 0 16px;
}
.sd-stats-band-text > p.muted {
  color: var(--sd-cream-soft) !important;
  opacity: 0.85;
  margin-bottom: 32px;
  max-width: 480px;
}
.sd-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px 20px;
}
.sd-stats-item { display: flex; align-items: flex-start; gap: 12px; }
.sd-stats-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(231,198,122,0.12);
  color: var(--sd-gold-bright);
}
.sd-stats-icon svg { width: 18px; height: 18px; }
.sd-stats-item div { display: flex; flex-direction: column; }
.sd-stats-item strong { color: var(--sd-cream); font-size: 0.9rem; font-weight: 600; }
.sd-stats-item span { color: #b8a888; font-size: 0.78rem; margin-top: 2px; }
@media (max-width: 900px) {
  .sd-stats-band-grid { grid-template-columns: 1fr; }
  .sd-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .sd-stats-band { padding: 50px 20px; }
}

/* PROMISE BLOCK */
.sd-promise {
  max-width: 720px;
  margin: 64px auto;
  text-align: center;
  padding: 0 20px;
}
.sd-promise h2 {
  font-style: italic;
  /* color: var(--sd-cream); */
  color: #3a2900;
  font-size: 2rem;
  margin-bottom: 18px;
}
.sd-promise p { 
  /* color: var(--sd-cream-soft); */
  color: #3a2900;
   font-size: 1.02rem; font-weight: 300; line-height: 1.85; }

/* ORGANIC / SECTION WRAPPER */
.sd-organic-band {
  position: relative;
  background: var(--sd-page-bg);
  overflow: hidden;
}
.sd-leaf { position: absolute; font-size: 4rem; opacity: 0.08; pointer-events: none; }
.sd-leaf-1 { top: 10%; left: -20px; transform: rotate(-15deg); }
.sd-leaf-2 { bottom: 5%; right: -10px; transform: rotate(200deg); font-size: 5rem; }

.sd-point-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(201,151,63,0.1);
  border: 1px solid rgba(201,151,63,0.3);
  color: var(--sd-gold-dark);
  margin-bottom: 14px;
}
.sd-point-icon svg { width: 20px; height: 20px; }

/* SECTIONS */
.sd-section {
  margin: 40px auto;
  max-width: 900px;
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.2);
  box-shadow: 0 12px 34px rgba(43,32,22,0.08);
  border-radius: 14px;
}
.sd-section h2 { font-style: italic; color: var(--sd-ink); margin-top: 0; }
.sd-section-sub { max-width: 560px; margin-bottom: 32px; color: #3e2c00 !important; }
.card.sd-section .sd-section-sub { color: var(--sd-ink-soft) !important; opacity: 0.9; }

.sd-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.sd-point {
  padding: 18px;
  border-radius: 10px;
  transition: background 0.15s ease, transform 0.15s ease;
}
.sd-point:hover { background: rgba(201,151,63,0.06); transform: translateY(-3px); }
.sd-point h3 { font-family: "Poppins", sans-serif; font-weight: 600; color: var(--sd-gold-dark); margin-bottom: 8px; font-size: 1rem; }
.sd-point p.muted { color: var(--sd-ink-soft) !important; }

/* VIDEO SECTION (See the Goodness in the Making) */
.sd-video-section {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 56px;
  align-items: center;
  padding: 70px 0 50px;
}
.sd-video-section-text h2 {
  font-style: italic;
  color: #3a2900;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  margin: 10px 0 16px;
}
.sd-video-section-text > p.muted { color: #3a2900 !important; opacity: 0.75; margin-bottom: 26px; }
.sd-video-section-points { display: flex; flex-direction: column; gap: 16px; margin-bottom: 30px; }
.sd-video-point { display: flex; align-items: center; gap: 12px; font-weight: 600; color: var(--sd-ink); font-size: 0.92rem; }
.sd-video-point-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(201,151,63,0.1);
  border: 1px solid rgba(201,151,63,0.3);
  color: var(--sd-gold-dark);
  flex-shrink: 0;
}
.sd-video-point-icon svg { width: 18px; height: 18px; }
.sd-video-watch-btn { display: inline-flex; align-items: center; gap: 10px; }
.sd-video-watch-btn svg { width: 18px; height: 18px; }

.sd-process-video {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 12px 34px rgba(43,32,22,0.15);
  border: 1px solid rgba(201,151,63,0.25);
}
.sd-process-video video { width: 100%; display: block; max-height: 520px; background: #000; }
.sd-video-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: none;
  background: var(--sd-green);
  color: var(--sd-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
  transition: transform 0.15s ease, background 0.15s ease;
}
.sd-video-play-btn svg { width: 26px; height: 26px; margin-left: 3px; }
.sd-video-play-btn:hover { transform: translate(-50%, -50%) scale(1.08); background: var(--sd-green-soft); }
.sd-process-video.is-playing .sd-video-play-btn { display: none; }
.sd-process-video.is-playing video { max-height: none; }

.sd-process-steps-card { margin-top: 10px; }

@media (max-width: 900px) {
  .sd-video-section { grid-template-columns: 1fr; padding: 44px 0 30px; gap: 30px; }
}

.sd-process { list-style: none; margin: 0; padding: 0; }
.sd-process li {
  display: flex;
  gap: 22px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(201,151,63,0.16);
}
.sd-process li:last-child { border-bottom: none; }
.sd-step-num {
  font-family: var(--sd-serif);
  font-style: italic;
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--sd-gold-dark);
  min-width: 44px;
}
.sd-process h3 { font-family: "Poppins", sans-serif; font-weight: 600; margin: 0 0 4px; color: var(--sd-ink); font-size: 1rem; }
.sd-process p.muted { color: var(--sd-ink-soft) !important; }

/* CTA */
.sd-cta {
  text-align: center;
  padding: 56px 40px;
  margin: 40px auto 60px;
  max-width: 900px;
  background: linear-gradient(135deg, #F3E4C2, #EAD6A6);
  border: 1px solid rgba(201,151,63,0.3);
  border-radius: 14px;
}
.sd-cta h2 { font-style: italic; color: #3a2900; }
.sd-cta p.muted { color: #3a2900 !important; opacity: 0.8; }

/* CTA BAND — full-bleed photo band (index-v2 "Good Food, Brighter Tomorrows") */
.sd-cta-band {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  display: flex;
  align-items: center;
}
.sd-cta-band-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}
.sd-cta-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(251,246,236,0.94) 0%, rgba(251,246,236,0.55) 45%, rgba(251,246,236,0.15) 75%);
}
.sd-cta-band-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  padding: 40px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.sd-cta-band-text h2 {
  font-style: italic;
  color: var(--sd-green);
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  line-height: 1.15;
  margin: 0 0 10px;
}
.sd-cta-band-text p {
  color: var(--sd-ink-soft);
  font-size: 0.98rem;
  margin: 0 0 22px;
}
.sd-cta-band-btn { display: inline-flex; }
.sd-cta-band-script {
  font-family: var(--sd-serif);
  font-style: italic;
  color: var(--sd-ink-soft);
  opacity: 0.7;
  font-size: 1.05rem;
  text-align: right;
  line-height: 1.4;
  margin: 0;
  flex-shrink: 0;
}
@media (max-width: 700px) {
  .sd-cta-band-inner { flex-direction: column; align-items: flex-start; padding: 32px 24px; }
  .sd-cta-band-script { text-align: left; }
  .sd-cta-band::before { background: linear-gradient(180deg, rgba(251,246,236,0.94) 0%, rgba(251,246,236,0.75) 60%, rgba(251,246,236,0.55) 100%); }
}

/* WHATSAPP FAB */
.sd-whatsapp-fab {
  position: fixed;
  z-index: 60;
  bottom: 22px;
  right: 22px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 26px rgba(0,0,0,0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.sd-whatsapp-fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 14px 30px rgba(0,0,0,0.4); }
.sd-whatsapp-fab svg { width: 28px; height: 28px; }
@media (max-width: 600px) {
  .sd-whatsapp-fab { width: 50px; height: 50px; bottom: 16px; right: 16px; }
  .sd-whatsapp-fab svg { width: 25px; height: 25px; }
}

/* FOOTER */
.sd-footer {
  /* background: #4a2900; */
  /* background: #164604eb; */
  background: #153c06ed;
  /* color: var(--sd-cream-soft); */
  color: white;
  margin-top: 40px;
  border-top: 1px solid rgba(231,198,122,0.12);
}
.sd-footer-newsletter {
  /* background: #2b541a; */
  background: #2b541a;
  border-bottom: 1px solid rgba(231,198,122,0.12);
}
.sd-footer-newsletter-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  padding: 32px 20px;
}
.sd-footer-newsletter-inner h3 {
  font-family: var(--sd-serif);
  font-style: italic;
  /* color: var(--sd-cream); */
  color: white;
  font-size: 1.4rem;
  margin: 0 0 6px;
}
.sd-footer-newsletter-inner p.muted {color: white; opacity: 0.85; margin: 0; }
.sd-footer-newsletter-cta { white-space: nowrap; }
.sd-footer-address a { color: #9C8C6C; text-decoration: none; }
.sd-footer-address a:hover { color: var(--sd-gold-bright); }
.sd-footer-links .sd-footer-address { margin: 0 0 12px; }
.sd-footer-inner {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 40px;
  padding: 56px 20px 40px;
}
.sd-footer-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.footer-logo-img { height: 70px; width: auto; display: block; }
.sd-logo-text { font-family: var(--sd-serif); font-style: italic; font-size: 1.9rem; font-weight: 600; 
  color: #e3b447; }
.sd-footer-tagline { max-width: 320px; margin-bottom: 16px; 
  /* color: var(--sd-cream-soft) !important; */
  color: white !important;
 }
.sd-footer-address { font-size: 0.88rem; line-height: 1.8; 
  color: white
 }

.sd-footer h4 {
  font-family: "Poppins", sans-serif;
  color: var(--sd-cream);
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 16px;
}
.sd-footer-links ul { list-style: none; margin: 0; padding: 0; }
.sd-footer-links li { margin-bottom: 10px; }
.sd-footer-links a,
.sd-footer-bottom a { color: #ffffff; text-decoration: none; font-size: 0.9rem; }
.sd-footer-links a:hover { color: var(--sd-gold-bright); }

.sd-social-icons { display: flex; gap: 12px; }
.sd-social-icons a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  /* color: var(--sd-cream-soft); */
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}
.sd-social-icons a:hover {
  background: var(--sd-gold-bright);
  border-color: var(--sd-gold-bright);
  color: var(--sd-brown);
  transform: translateY(-2px);
}

.sd-footer-bottom {
  border-top: 1px solid rgba(231,198,122,0.1);
  padding: 18px 20px;
  text-align: center;
  font-size: 0.82rem;
  /* color: #6E6248; */
  color: white;
}

/* PRODUCTS (homepage) */
.sd-products-section {
  max-width: 1000px;
  margin: 60px auto;
  padding: 0 20px;
  text-align: center;
}
.sd-products-eyebrow { color: var(--sd-gold-dark); margin-bottom: 10px; }
.sd-products-section h2 { font-style: italic; color: #3a2900; margin-top: 0; }
.sd-products-section .sd-section-sub { margin-left: auto; margin-right: auto; color: #3a2900 !important; opacity: 0.75; }
.sd-products-viewall { display: inline-block; margin-top: 36px; }
.sd-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  margin-top: 32px;
  text-align: left;
}
.sd-product-card {
  display: block;
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.22);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(43,32,22,0.06);
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.sd-product-card:hover { transform: translateY(-4px); border-color: rgba(201,151,63,0.45); box-shadow: 0 16px 34px rgba(43,32,22,0.12); }
.sd-product-card img, .sd-product-card-fallback {
  width: 100%;
  height: 190px;
  object-fit: contain;
  padding: 14px;
  box-sizing: border-box;
  display: block;
  background: radial-gradient(circle at 50% 35%, #ffffff 0%, #f3ece0 70%, #ece2d0 100%);
}
.sd-product-card-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
}
.sd-product-card-media { display: block; }
.sd-product-card-body { padding: 18px; }
.sd-product-card-body a { text-decoration: none; }
.sd-product-card-body h3 {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: var(--sd-ink);
  margin: 0 0 8px;
}
.sd-product-card-price { color: var(--sd-gold-dark); font-weight: 700; font-size: 1.05rem; margin-bottom: 12px; }
.sd-variant-select {
  width: 100%;
  padding: 9px 12px;
  border-radius: 8px;
  border: 1px solid rgba(201,151,63,0.35);
  background: rgba(201,151,63,0.06);
  color: var(--sd-ink);
  font-size: 0.85rem;
  font-family: "Poppins", sans-serif;
  cursor: pointer;
}
.sd-variant-select:focus { outline: none; border-color: var(--sd-gold-dark); }
.sd-products-empty { color: #3a2900; padding: 20px; opacity: 0.75; }

/* TRUST / MARKETING */
.sd-trust-marketing {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 56px;
  align-items: center;
  padding: 70px 20px;
}
.sd-trust-marketing-media {
  border-radius: 4px;
  overflow: hidden;
  border: 5px solid rgb(141 98 0 / 92%);
  box-shadow: 0 24px 60px rgb(0 0 0 / 35%);
}
.sd-trust-marketing-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sd-trust-marketing-text .sd-eyebrow { color: var(--sd-gold-dark); }
.sd-trust-marketing-text h2 { font-style: italic; color: #3a2900; margin: 0 0 16px; font-size: 2rem; }
.sd-trust-marketing-text p.muted { color: #3a2900 !important; opacity: 0.75; margin-bottom: 30px; }
.sd-values-title {
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--sd-gold-dark);
  margin: 0 0 18px;
}
.sd-badge-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.sd-badge-item { text-align: center; }
.sd-badge-item img { width: 60px; height: 60px; margin-bottom: 10px; }
.sd-badge-item span {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  color: #3a2900;
  opacity: 0.8;
  line-height: 1.35;
}

/* JOURNEY OF TRUST */
.sd-journey-section {
  display: grid;
  grid-template-columns: 0.85fr 1fr auto;
  gap: 40px;
  align-items: center;
  padding: 60px 20px;
}
.sd-journey-media { border-radius: 8px; overflow: hidden; box-shadow: 0 20px 50px rgba(43,32,22,0.18); }
.sd-journey-media img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4 / 3; }
.sd-journey-text .sd-eyebrow { color: var(--sd-gold-dark); }
.sd-journey-text h2 { font-style: italic; color: #3a2900; margin: 0 0 16px; font-size: clamp(1.7rem, 3vw, 2.1rem); }
.sd-journey-text p.muted { color: #3a2900 !important; opacity: 0.75; margin-bottom: 26px; max-width: 420px; }
.sd-journey-words {
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-family: var(--sd-serif);
  font-style: italic;
  font-size: 1.4rem;
  color: rgb(12 94 0);
  text-align: right;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .sd-journey-section { grid-template-columns: 1fr; text-align: center; padding: 44px 20px; gap: 28px; }
  .sd-journey-text p.muted { margin-left: auto; margin-right: auto; }
  .sd-journey-words { flex-direction: row; justify-content: center; flex-wrap: wrap; text-align: center; }
}

/* ===== Shared inner pages: products / product detail / cart / auth forms / profile =====
   These pages still use the old plain markup classes from style.css (.card,
   .product-grid, .form-card, etc). Rather than touch that markup, we reskin
   those same class names here, scoped to body.sd-page-dark so index.html is
   unaffected. .card is explicitly excluded from .sd-section/.sd-cta (index.html
   reuses "card" on those) so this doesn't bleed into the homepage sections. */
body.sd-page-dark .container { padding-top: 5px;max-width: 1200px !important; }

body.sd-page-dark .page-title {
  font-family: var(--sd-serif);
  font-style: italic;
  font-weight: 600;
  color: #3a2900;
  font-size: 2rem;
  margin-bottom: 24px;
}

body.sd-page-dark .card:not(.sd-section):not(.sd-cta) {
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.2);
  border-radius: 12px;
  padding: 28px;
  color: var(--sd-ink-soft);
  box-shadow: 0 12px 32px rgba(43,32,22,0.08);
}
body.sd-page-dark .card:not(.sd-section):not(.sd-cta) h2 { color: var(--sd-ink); margin-top: 0; }
body.sd-page-dark .form-card { max-width: 460px; margin: 40px auto; }
body.sd-page-dark .form-card .page-title { color: var(--sd-ink); }

body.sd-page-dark label { color: #3a2900; opacity: 0.8; font-weight: 500; font-size: 0.85rem; letter-spacing: 0.02em; text-transform: uppercase; }
body.sd-page-dark .card label { color: var(--sd-ink-soft); opacity: 1; }

/* Inputs sitting directly on the light body (e.g. product search/filter bar) */
body.sd-page-dark input,
body.sd-page-dark select,
body.sd-page-dark textarea {
  /* background: rgba(255,255,255,0.8); */
  /* border: 1px solid rgba(58,41,0,0.2); */
  color: #3a2900;
  border-radius: 4px;
}
body.sd-page-dark input::placeholder,
body.sd-page-dark textarea::placeholder { color: rgba(58,41,0,0.45); }
/* body.sd-page-dark input:focus,
body.sd-page-dark select:focus,
body.sd-page-dark textarea:focus {
  outline: 2px solid var(--sd-gold);
  outline-offset: 1px;
  border-color: var(--sd-gold);
} */
body.sd-page-dark input:disabled { opacity: 0.5; }

/* Inputs inside a card (login/register/profile/checkout forms) */
body.sd-page-dark .card input,
body.sd-page-dark .card select,
body.sd-page-dark .card textarea {
  background: rgba(43,32,22,0.03);
  border: 1px solid rgba(201,151,63,0.3);
  color: var(--sd-ink);
}
body.sd-page-dark .card input::placeholder,
body.sd-page-dark .card textarea::placeholder { color: rgba(43,32,22,0.4); }

body.sd-page-dark .card .muted { color: var(--sd-ink-soft); opacity: 0.85; }
body.sd-page-dark .card a { color: var(--sd-gold-dark); }

body.sd-page-dark .alert-error { background: rgba(192,57,43,0.08); color: #A3261A; border: 1px solid rgba(192,57,43,0.25); }
body.sd-page-dark .alert-success { background: rgba(85,99,43,0.1); color: #45551D; border: 1px solid rgba(85,99,43,0.3); }
body.sd-page-dark .card .alert-error { background: rgba(192,57,43,0.08); color: #A3261A; border-color: rgba(192,57,43,0.25); }
body.sd-page-dark .card .alert-success { background: rgba(85,99,43,0.1); color: #45551D; border-color: rgba(85,99,43,0.3); }

body.sd-page-dark .empty-state { color: #3a2900; opacity: 0.75; padding: 60px 20px; text-align: center; }
body.sd-page-dark .empty-state a { color: var(--sd-gold-dark); font-weight: 600; }
body.sd-page-dark .card .empty-state { color: var(--sd-ink-soft); opacity: 0.85; }
body.sd-page-dark .card .empty-state a { color: var(--sd-gold-dark); }

/* Product filters */
.sd-product-filters {
  display: flex;
  gap: 14px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.sd-product-search { flex: 1; min-width: 220px; }
.sd-product-category { min-width: 180px; cursor: pointer; }

/* Product listing grid */
body.sd-page-dark .product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 24px;
}
body.sd-page-dark .product-card {
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.22);
  border-radius: 14px;
  text-decoration: none;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 8px 24px rgba(43,32,22,0.06);
}
body.sd-page-dark .product-card:hover { transform: translateY(-4px); border-color: rgba(201,151,63,0.45); box-shadow: 0 16px 34px rgba(43,32,22,0.12); }
body.sd-page-dark .product-card img {
  background: radial-gradient(circle at 50% 35%, #ffffff 0%, #f3ece0 70%, #ece2d0 100%);
}
body.sd-page-dark .product-thumb-fallback { background: var(--sd-page-bg); }
body.sd-page-dark .product-card-body h3 { color: var(--sd-ink); font-family: "Poppins", sans-serif; font-weight: 600; }
body.sd-page-dark .product-price { color: var(--sd-gold-dark); }
body.sd-page-dark .product-stock { color: var(--sd-ink-soft); opacity: 0.75; }
.product-unit { font-size: 0.78em; font-weight: 400; opacity: 0.75; }
.sd-product-card-price .product-unit { color: var(--sd-ink-soft); }

/* Premium listing page header + reassure strip + upgraded cards */
.sd-listing-header {
  background: var(--sd-surface);
  border-bottom: 1px solid rgba(201,151,63,0.15);
  padding: 56px 0 40px;
  text-align: center;
}
.sd-listing-header .sd-eyebrow { color: var(--sd-gold-dark); }
.sd-listing-header h1 {
  font-family: var(--sd-serif);
  font-style: italic;
  font-weight: 600;
  color: #3a2900;
  font-size: clamp(2rem, 4vw, 2.8rem);
  margin: 0 0 14px;
}
.sd-listing-header-sub { max-width: 560px; margin: 0 auto; color: #3a2900 !important; opacity: 0.75; }

.sd-reassure-strip { background: var(--sd-page-bg); border-bottom: 1px solid rgba(201,151,63,0.15); }
.sd-reassure-strip-inner {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 28px 44px;
  padding: 20px;
}
.sd-reassure-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--sd-ink-soft);
  font-size: 0.82rem;
  font-weight: 500;
}
.sd-reassure-item svg { width: 18px; height: 18px; color: var(--sd-gold-dark); flex-shrink: 0; }

body.sd-page-dark .container:has(.sd-listing-grid) { padding-top: 40px; }
.sd-listing-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
body.sd-page-dark .sd-listing-card { display: block; overflow: hidden; }
.sd-listing-card-media { display: block; }
body.sd-page-dark .sd-listing-card img,
body.sd-page-dark .sd-listing-card .product-thumb-fallback {
  width: 100%;
  height: 200px;
  object-fit: contain;
  padding: 16px;
  box-sizing: border-box;
}
body.sd-page-dark .sd-listing-card .product-thumb-fallback { display: flex; align-items: center; justify-content: center; font-size: 2.2rem; }
.sd-listing-card .product-card-body { padding: 18px; }
.sd-listing-card .product-card-body h3 { margin: 0 0 8px; }
.sd-listing-card .product-price { font-weight: 700; font-size: 1.05rem; margin-bottom: 10px; }
.sd-listing-card .sd-variant-select { margin-bottom: 10px; }
.sd-listing-card .product-stock { font-size: 0.8rem; margin-bottom: 14px; }
.sd-listing-card-cta { display: block; width: 100%; text-align: center; padding: 10px; font-size: 0.9rem; }

/* FEEDBACK */
.sd-feedback-section { max-width: 720px; }
.sd-feedback-teaser { max-width: 720px; text-align: center; }
.sd-feedback-form { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.sd-feedback-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sd-feedback-form input,
.sd-feedback-form textarea { width: 100%; padding: 12px 14px; border-radius: 8px; font-family: inherit; font-size: 0.92rem; box-sizing: border-box; }
.sd-feedback-form textarea { resize: vertical; }
.sd-feedback-form button { align-self: flex-start; }
@media (max-width: 640px) {
  .sd-feedback-row { grid-template-columns: 1fr; }
}

/* FEEDBACK MODAL */
.sd-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(43,32,22,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.sd-modal-overlay[hidden] { display: none; }
.sd-modal {
  position: relative;
  background: var(--sd-surface);
  border-radius: 14px;
  padding: 36px;
  max-width: 560px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 30px 70px rgba(0,0,0,0.35);
}
.sd-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: rgba(58,41,0,0.06);
  color: var(--sd-ink);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sd-modal-close:hover { background: rgba(58,41,0,0.12); }
@media (max-width: 640px) {
  .sd-modal { padding: 28px 22px; }
}

/* FAQ */
.sd-faq-section { max-width: 900px; }
.sd-faq-grid { display: grid; gap: 26px; margin-top: 24px; }
.sd-faq-item h3 { color: var(--sd-ink); font-size: 1.02rem; margin: 0 0 8px; }
.sd-faq-item p { margin: 0; }

/* Cart */
body.sd-page-dark .cart-row { border-bottom: 1px solid rgba(201,151,63,0.18); }
body.sd-page-dark .cart-row strong { color: var(--sd-ink); }
body.sd-page-dark .cart-total-row { color: var(--sd-ink); border-top: 1px solid rgba(201,151,63,0.3); margin-top: 4px; }

body.sd-page-dark .btn-secondary { background: transparent; border: 1px solid rgba(58,41,0,0.3); color: #3a2900; box-shadow: none; }
body.sd-page-dark .btn-secondary:hover { background: rgba(58,41,0,0.08); }
body.sd-page-dark .card .btn-secondary { border-color: rgba(231,198,122,0.35); color: var(--sd-gold-bright); }
body.sd-page-dark .card .btn-secondary:hover { background: rgba(231,198,122,0.1); }

/* Checkout */
body.sd-page-dark .card:not(.sd-section):not(.sd-cta) h3 { color: var(--sd-ink); margin-top: 0; }
.sd-checkout-layout {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 32px;
  align-items: start;
}
.sd-checkout-summary .cart-row { padding: 12px 0; }
.sd-coupon-row { display: flex; gap: 8px; margin-top: 16px; }
.sd-coupon-row input { flex: 1; }

/* Admin product photos */
.sd-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.sd-photo-thumb {
  position: relative;
  aspect-ratio: 1;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid rgba(231,198,122,0.2);
}
.sd-photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sd-photo-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(18,13,7,0.75);
  color: var(--sd-cream);
  border: 1px solid rgba(231,198,122,0.3);
  cursor: pointer;
  font-size: 0.75rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sd-photo-remove:hover { background: #c0392b; border-color: #c0392b; }

/* Product detail — premium layout */
.sd-product-hero {
  display: grid;
  grid-template-columns: minmax(0, 340px) 1fr;
  gap: 40px;
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.2);
  border-radius: 20px;
  padding: 32px;
  box-shadow: 0 12px 40px rgba(43,32,22,0.1);
}
@media (max-width: 860px) {
  .sd-product-hero { grid-template-columns: 1fr; gap: 24px; padding: 20px; border-radius: 16px; }
}

/* Gallery */
.sd-gallery { width: 100%; max-width: 300px; margin: 0 auto; }
@media (max-width: 860px) {
  .sd-gallery { max-width: 260px; }
}
.sd-gallery-main {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 14px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 35%, #ffffff 0%, #f3ece0 70%, #ece2d0 100%);
  box-shadow: inset 0 0 0 1px rgba(201,151,63,0.15);
}
.sd-gallery-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  padding: 14px;
  box-sizing: border-box;
  transition: opacity 0.2s ease, transform 0.3s ease;
}
.sd-gallery-main:hover img { transform: scale(1.035); }
.sd-gallery-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(18,13,7,0.55);
  color: var(--sd-cream);
  border: 1px solid rgba(231,198,122,0.35);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 1.3rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.sd-gallery-prev { left: 14px; }
.sd-gallery-next { right: 14px; }
.sd-gallery-arrow:hover { background: var(--sd-gold-bright); color: var(--sd-brown); transform: translateY(-50%) scale(1.08); }
.sd-gallery-thumbs { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.sd-gallery-thumb {
  width: 64px;
  height: 64px;
  object-fit: contain;
  background: #f3ece0;
  border-radius: 10px;
  cursor: pointer;
  border: 2px solid transparent;
  padding: 6px;
  box-sizing: border-box;
  opacity: 0.65;
  transition: opacity 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.sd-gallery-thumb:hover { opacity: 1; transform: translateY(-2px); }
.sd-gallery-thumb.active { opacity: 1; border-color: var(--sd-gold-bright); }

/* Info panel */
.sd-product-info { display: flex; flex-direction: column; }
.sd-product-category {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--sd-gold-dark);
  margin-bottom: 10px;
}
.sd-product-name {
  font-family: var(--sd-serif);
  font-style: italic;
  font-weight: 600;
  font-size: 2.2rem;
  color: var(--sd-ink);
  margin: 0 0 14px;
  line-height: 1.15;
}
.sd-product-price-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 16px; }
.sd-product-price {
  font-family: var(--sd-serif);
  font-size: 2rem;
  font-weight: 700;
  color: var(--sd-gold-dark);
}
.sd-product-desc { color: var(--sd-ink-soft); opacity: 0.95; line-height: 1.7; margin: 0 0 20px; }

.sd-stock-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 100px;
  width: fit-content;
  margin-bottom: 24px;
}
.sd-stock-pill.in-stock { background: rgba(85,99,43,0.18); color: #9FBE6C; }
.sd-stock-pill.out-of-stock { background: rgba(163,38,26,0.18); color: #E08A7D; }
.sd-stock-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }

.sd-product-badges {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  padding: 18px 0;
  margin-bottom: 24px;
  border-top: 1px solid rgba(231,198,122,0.15);
  border-bottom: 1px solid rgba(231,198,122,0.15);
}
.sd-product-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  color: var(--sd-ink-soft);
  letter-spacing: 0.01em;
}
.sd-product-badge span:first-child { font-size: 1.1rem; }

.sd-qty-row { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.sd-qty-stepper {
  display: flex;
  align-items: center;
  border: 1px solid rgba(201,151,63,0.35);
  border-radius: 100px;
  overflow: hidden;
}
.sd-qty-btn {
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  color: var(--sd-gold-dark);
  font-size: 1.15rem;
  cursor: pointer;
  transition: background 0.15s ease;
}
.sd-qty-btn:hover:not(:disabled) { background: rgba(201,151,63,0.1); }
.sd-qty-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.sd-qty-value {
  min-width: 44px;
  text-align: center;
  font-weight: 600;
  color: var(--sd-ink);
  font-size: 1rem;
}
.sd-product-cta { width: 100%; padding: 16px; font-size: 1.05rem; }
.sd-product-note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 0.8rem;
  color: var(--sd-ink-soft);
  opacity: 0.85;
}

.sd-order-confirmation { margin-top: 20px; }

.sd-payment-notice {
  background: rgba(201,151,63,0.1);
  border: 1px solid rgba(201,151,63,0.3);
  border-radius: 6px;
  padding: 16px 18px;
  margin: 18px 0;
}
.sd-payment-notice strong { color: var(--sd-gold-dark); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.04em; }
.sd-payment-notice p { color: var(--sd-ink-soft); font-size: 0.88rem; margin: 8px 0 0; line-height: 1.55; }
.sd-payment-notice .sd-payment-contact a { color: var(--sd-gold-dark); font-weight: 600; text-decoration: none; }
.sd-payment-notice .sd-payment-contact a:hover { text-decoration: underline; }

.sd-payment-options { display: flex; flex-direction: column; gap: 10px; }
.sd-payment-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border: 1px solid rgba(201,151,63,0.25);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.sd-payment-option:has(input:checked) {
  border-color: var(--sd-gold-bright);
  background: rgba(201,151,63,0.08);
}
.sd-payment-option input[type="radio"] { accent-color: var(--sd-gold-bright); width: 16px; height: 16px; flex-shrink: 0; }
.sd-payment-option span { display: flex; flex-direction: column; gap: 2px; }
.sd-payment-option strong { color: var(--sd-ink); font-size: 0.92rem; }
.sd-payment-option small { color: var(--sd-ink-soft); font-size: 0.8rem; }

/* Order history (profile page) */
body.sd-page-dark .sd-orders-card { margin-top: 28px; }
.sd-order-block { padding: 18px 0; border-bottom: 1px solid rgba(231,198,122,0.14); }
.sd-order-block:last-child { border-bottom: none; }
.sd-order-block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
  flex-wrap: wrap;
  gap: 8px;
}
body.sd-page-dark .sd-order-block-header strong { color: var(--sd-ink); }
.sd-order-status {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 4px 10px;
  border-radius: 999px;
}
.sd-order-status-pending { background: rgba(201,151,63,0.18); color: var(--sd-gold-bright); }
.sd-order-status-confirmed { background: rgba(85,99,43,0.2); color: #9FBE6C; }
.sd-order-status-shipped { background: rgba(85,99,43,0.2); color: #9FBE6C; }
.sd-order-status-delivered { background: rgba(85,99,43,0.28); color: #9FBE6C; }
.sd-order-status-cancelled { background: rgba(192,57,43,0.2); color: #E8887C; }

/* Admin panel */
body.sd-page-dark .sd-admin-layout {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 32px;
  align-items: start;
}
body.sd-page-dark .sd-admin-sidebar {
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.2);
  border-radius: 6px;
  padding: 10px;
  position: sticky;
  top: 20px;
}
body.sd-page-dark .sd-admin-sidebar a {
  padding: 10px 14px;
  border-radius: 4px;
  color: var(--sd-ink-soft);
  text-decoration: none;
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: background 0.15s ease, color 0.15s ease;
}
body.sd-page-dark .sd-admin-sidebar a:hover { background: rgba(201,151,63,0.1); color: var(--sd-ink); }
body.sd-page-dark .sd-admin-sidebar a.active { background: var(--sd-gold-bright); color: var(--sd-brown); font-weight: 700; }

body.sd-page-dark .sd-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 28px;
}
body.sd-page-dark .sd-stat-card {
  background: var(--sd-surface);
  border: 1px solid rgba(201,151,63,0.2);
  border-radius: 6px;
  padding: 18px 20px;
  box-shadow: 0 8px 20px rgba(43,32,22,0.06);
}
body.sd-page-dark .sd-stat-card .sd-stat-label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--sd-ink-soft); opacity: 0.8; }
body.sd-page-dark .sd-stat-card .sd-stat-value { font-size: 1.7rem; font-weight: 700; color: var(--sd-gold-dark); margin-top: 6px; font-family: var(--sd-serif); }
body.sd-page-dark .sd-stat-card.sd-stat-warn .sd-stat-value { color: #A3261A; }

body.sd-page-dark table { background: transparent; border-collapse: collapse; width: 100%; }
body.sd-page-dark th, body.sd-page-dark td {
  border-bottom: 1px solid rgba(201,151,63,0.18);
  color: var(--sd-ink-soft);
  padding: 10px 12px;
  text-align: left;
  font-size: 0.88rem;
}
body.sd-page-dark th { background: rgba(201,151,63,0.08); color: var(--sd-gold-dark); font-weight: 600; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.05em; }
body.sd-page-dark tr:last-child td { border-bottom: none; }

@media (max-width: 780px) {
  body.sd-page-dark .sd-admin-layout { grid-template-columns: 1fr; min-width: 0; }
  body.sd-page-dark .sd-admin-layout > * { min-width: 0; }
  body.sd-page-dark .sd-admin-sidebar { position: static; flex-direction: row; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body.sd-page-dark .sd-admin-sidebar a { white-space: nowrap; }
  body.sd-page-dark .sd-stat-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .sd-footer-inner { grid-template-columns: 1fr 1fr; }
  .sd-footer-brand { grid-column: 1 / -1; }
  .sd-trust-marketing { grid-template-columns: 1fr; padding: 50px 20px; gap: 36px; }
  .sd-checkout-layout { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .sd-grid-3 { grid-template-columns: 1fr; }
  .sd-section { padding: 30px 22px; margin: 28px auto; }
  .sd-footer-inner { grid-template-columns: 1fr; padding: 44px 20px 32px; }
  .sd-promise { margin: 44px auto; }
  .sd-promise h2 { font-size: 1.6rem; }
  .sd-cta { padding: 40px 24px; }
  .sd-process li { gap: 16px; }
  .sd-products-section { margin: 44px auto; }
  .sd-badge-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}

/* ===== index-v2 preview: tightened section rhythm to match the reference
   mockup, which sits sections much closer together than the current
   site's generous 60-70px margins/padding. Scoped to body.sd-page-v2 so
   the live homepage (index.html) is completely unaffected. ===== */
body.sd-page-v2.sd-page-dark .container { padding-top: 20px; padding-bottom: 20px; }
body.sd-page-v2 .sd-products-section { margin: 30px auto 24px; }
body.sd-page-v2 .sd-cert-strip-inner { padding: 18px 20px; gap: 24px 40px; }
body.sd-page-v2 .sd-trust-marketing { padding: 10px 20px; gap: 44px; }
body.sd-page-v2 .sd-video-section { padding: 10px 0; gap: 44px; }
body.sd-page-v2 .sd-journey-section { padding: 10px 20px; gap: 32px; }
body.sd-page-v2 .sd-feedback-section.card.sd-section { margin: 10px auto; }
body.sd-page-v2 .sd-cta { margin: 10px auto 30px; }
@media (max-width: 900px) {
  body.sd-page-v2.sd-page-dark .container { padding-top: 14px; padding-bottom: 14px; }
  body.sd-page-v2 .sd-trust-marketing { padding: 10px 20px; gap: 24px; }
  body.sd-page-v2 .sd-video-section { padding: 10px 0; gap: 24px; }
  body.sd-page-v2 .sd-journey-section { padding: 10px 20px; gap: 20px; }
}