/* ==========================================================================
   Ju Ju's Cakes & More — Theme CSS
   ========================================================================== */

/* ── CSS Variables ────────────────────────────────────────────────────────── */
:root {
  /* Colors — brand palette (overridden by Customizer inline CSS) */
  --color-primary:    #701BC6;
  --color-accent:     #F42B9E;
  --color-background: #FAF7FB;
  --color-foreground: #120F18;
  --color-muted-fg:   #4D4654;
  --color-border:     #E3DAE8;
  --color-card:       #FFFFFF;
  --color-brand-blue: #2B7DF7;
  --color-brand-black:#1A161F;
  --color-primary-fg: #FAF7FB;
  --color-accent-fg:  #FFFFFF;
  --color-destructive:#DF2020;
  --color-input:      #E9E2ED;
  --color-muted:      #EFE9F2;
  --color-secondary:  #EDF4FE;

  /* Typography — manteiga-gorda (Typekit) + Inter (enqueued in functions.php) */
  --font-display: 'manteiga-gorda', 'Georgia', serif;
  --font-body:    'Inter', sans-serif;

  /* Gradients — built from Customizer (see jujus_get_color_css in functions.php) */
  --gradient-warm:    linear-gradient(135deg, #FFF1F9 0%, #F2EBFD 50%, #EDF5FF 100%);
  --gradient-wine:    linear-gradient(135deg, #2E0B57 0%, #BE0F78 60%, #0949AD 100%);
  --gradient-vibrant: linear-gradient(135deg, #8520DF 0%, #F42B9E 50%, #2B7DF7 100%);
  --gradient-gold:    linear-gradient(135deg, #9933EE 0%, #FA42B8 50%, #2B7DF7 100%);

  /* Shadows */
  --shadow-soft: 0 10px 40px -10px hsla(272, 75%, 45%, 0.3);
  --shadow-lift: 0 24px 60px -20px hsla(325, 95%, 58%, 0.45);

  /* Button vars */
  --btn-radius:         9999px;
  --btn-height:         auto;
  --btn-padding:        0.875rem 1.75rem;
  --btn-font-size:      0.875rem;
  --btn-font-weight:    500;
  --btn-letter-spacing: 0.18em;
  --btn-text-transform: uppercase;
  --btn-icon-padding:   0.625rem;
  --card-radius:        0.5rem;
  --header-height:      80px;
  --logo-height:        48px;
  --checkout-gap:       2rem;
}

/* ── Reset & Base ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; border-color: var(--color-border); }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  background-color: var(--color-background);
  color: var(--color-foreground);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-image: radial-gradient(hsl(325 95% 90%) 1px, transparent 1px);
  background-size: 24px 24px;
  overflow-x: hidden;
}
body.mobile-nav-open { overflow: hidden; }
h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}
p { margin: 0; }
a { text-decoration: none; color: inherit; }
img, video { max-width: 100%; display: block; }
button, input, textarea, select { font-family: inherit; }
::selection { background: hsla(325, 95%, 58%, 0.4); color: var(--color-foreground); }

/* ── Containers ───────────────────────────────────────────────────────────── */
.container-wide {
  width: 100%;
  max-width: 80rem; /* 1280px */
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-width: 1024px) {
  .container-wide { padding-left: 2.5rem; padding-right: 2.5rem; }
}

/* ── Utility ──────────────────────────────────────────────────────────────── */
.text-gradient-gold {
  background: var(--gradient-gold);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.not-italic { font-style: normal; }

/* Section heading accents — match React text-primary font-medium */
.featured-heading em,
.menu-heading em,
.services-heading em,
.testimonials-heading em,
.faq-heading em,
.contact-heading em {
  color: var(--color-primary);
  font-weight: 500;
  font-style: normal;
}
.about-heading em {
  color: var(--color-accent);
  font-weight: 500;
  font-style: normal;
}
.eyebrow-on-dark { color: rgba(250, 247, 251, 0.9); }

/* Shared section heading scale — text-4xl lg:text-5xl tracking-tight */
.section-heading,
.featured-heading,
.menu-heading,
.services-heading,
.testimonials-heading,
.faq-heading,
.contact-heading,
.creations-heading,
.about-heading {
  margin-top: 1rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2.25rem;
  letter-spacing: -0.025em;
  line-height: 1.1;
}
@media (min-width: 1024px) {
  .section-heading,
  .featured-heading,
  .menu-heading,
  .services-heading,
  .testimonials-heading,
  .faq-heading,
  .contact-heading,
  .creations-heading,
  .about-heading {
    font-size: 3rem;
  }
}
.bg-gradient-wine    { background: var(--gradient-wine); }
.bg-gradient-warm    { background: var(--gradient-warm); }
.bg-gradient-vibrant { background: var(--gradient-vibrant); }

.noise { position: relative; }
.noise::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Component: eyebrow ───────────────────────────────────────────────────── */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.32em;
  font-weight: 500;
  color: var(--color-accent);
}
.gold-divider {
  height: 1px;
  width: 3rem;
  display: inline-block;
  background: linear-gradient(90deg, transparent, var(--color-accent), transparent);
}

/* ── Component: luxe-card ─────────────────────────────────────────────────── */
.luxe-card {
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--card-radius);
  overflow: hidden;
  transition: transform 0.5s ease, box-shadow 0.5s ease;
  box-shadow: var(--shadow-soft);
}
.luxe-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lift);
}

/* ── Component: btn-primary ───────────────────────────────────────────────── */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: var(--btn-radius);
  padding: 0.875rem 1.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background: var(--gradient-wine);
  color: var(--color-primary-fg);
  box-shadow: 0 8px 24px -8px hsla(272, 75%, 45%, 0.55);
  border: none;
  cursor: pointer;
  text-decoration: none;
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -8px hsla(272, 75%, 45%, 0.7);
  color: var(--color-primary-fg);
}

/* ── Component: btn-ghost-gold ────────────────────────────────────────────── */
.btn-ghost-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: var(--btn-radius);
  padding: 0.875rem 1.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  border: 1px solid var(--color-accent);
  color: var(--color-accent);
  background: transparent;
  transition: background 0.3s ease, color 0.3s ease;
  cursor: pointer;
  text-decoration: none;
}
.btn-ghost-gold:hover {
  background: var(--color-accent);
  color: var(--color-accent-fg);
}

/* ── Layout: Site Header ──────────────────────────────────────────────────── */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  transition: background 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
  background: transparent;
  border-bottom: 1px solid transparent;
}
.site-header.is-solid {
  background: hsla(300, 30%, 98%, 0.9);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom-color: var(--color-border);
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
/* Mobile menu open — solid opaque header (no backdrop-filter on links) */
.site-header.mobile-menu-active {
  background: var(--color-background);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom-color: var(--color-border);
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

/* WordPress admin bar offset (Customizer preview + logged-in front end) */
.admin-bar .site-header {
  top: 32px;
}
@media screen and (max-width: 782px) {
  .admin-bar .site-header {
    top: 46px;
  }
}

.site-header nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-height);
}

/* Logo */
.site-logo-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.site-logo-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  overflow: hidden;
  outline: 2px solid hsla(325, 95%, 58%, 0.4);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  background: var(--color-background);
  transition: transform 0.3s ease;
  flex-shrink: 0;
}
.site-logo-link:hover .site-logo-icon { transform: scale(1.1); }
.site-logo-icon img,
.site-logo-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.site-logo-text { line-height: var(--logo-height); display: block; }

.site-logo-wordmark {
  display: none;
  flex-direction: column;
  line-height: 1;
}
@media (min-width: 640px) { .site-logo-wordmark { display: flex; } }
.site-logo-name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  letter-spacing: -0.02em;
  color: var(--color-foreground);
}
.site-logo-sub {
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--color-accent);
  margin-top: 0.25rem;
}

/* Desktop nav */
.theme-nav-desktop {
  display: none;
  align-items: center;
  gap: 0.25rem;
}
@media (min-width: 1024px) { .theme-nav-desktop { display: flex; } }

@media (max-width: 1023px) {
  .theme-header-mobile .theme-cart-btn {
    width: 2.5rem;
    height: 2.5rem;
  }
}

.theme-nav-list {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-nav-list li a,
.theme-nav-btn {
  display: block;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: hsla(270, 30%, 8%, 0.8);
  transition: color 0.3s ease;
  position: relative;
  background: none;
  border: none;
  cursor: pointer;
}
.theme-nav-list li a::after,
.theme-nav-btn::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 4px;
  height: 1px;
  width: 0;
  background: var(--color-accent);
  transition: width 0.3s ease;
}
.theme-nav-list li a:hover,
.theme-nav-btn:hover { color: var(--color-accent); }
.theme-nav-list li a:hover::after,
.theme-nav-btn:hover::after { width: 1.5rem; }

/* Cart button */
.theme-cart-btn {
  position: relative;
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 1px solid var(--color-border);
  background: none;
  cursor: pointer;
  transition: border-color 0.3s ease, color 0.3s ease;
  color: var(--color-foreground);
  margin-left: 0.75rem;
}
.theme-cart-btn:hover { border-color: var(--color-accent); color: var(--color-accent); }
.theme-cart-count {
  position: absolute;
  top: -0.25rem;
  right: -0.25rem;
  background: var(--color-accent);
  color: var(--color-accent-fg);
  font-size: 0.625rem;
  font-weight: 700;
  width: 1.25rem;
  height: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
}
.theme-cart-count:empty { display: none; }

/* Mobile header controls */
.theme-header-mobile {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
@media (min-width: 1024px) { .theme-header-mobile { display: none; } }

.theme-mobile-toggle {
  padding: 0.5rem;
  border-radius: 9999px;
  border: 1px solid var(--color-border);
  background: none;
  cursor: pointer;
  color: var(--color-foreground);
}

/* Mobile nav panel — Lovable-style dropdown */
.theme-mobile-nav {
  display: none;
  border-top: 1px solid var(--color-border);
  padding: 1rem 0;
}
.theme-mobile-nav.is-open {
  display: block;
  animation: fade-in 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.theme-mobile-nav a,
.theme-mobile-nav-btn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 0.75rem 0;
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  border: none;
  border-bottom: 1px solid hsla(290, 25%, 88%, 0.6);
  background: none;
  cursor: pointer;
  color: var(--color-foreground);
  text-decoration: none;
  transition: color 0.3s ease;
}
.theme-mobile-nav a:last-child,
.theme-mobile-nav-btn:last-child {
  border-bottom: none;
}
.theme-mobile-nav a:hover,
.theme-mobile-nav-btn:hover {
  color: var(--color-accent);
}

/* ── Layout: Site Footer ──────────────────────────────────────────────────── */
.site-footer {
  background: var(--gradient-wine);
  color: var(--color-primary-fg);
  position: relative;
}
.site-footer-inner {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media (min-width: 1024px) {
  .site-footer-inner {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}

.site-footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 768px) {
  .site-footer-grid { grid-template-columns: repeat(4, 1fr); gap: 3rem; }
  .site-footer-brand { grid-column: span 2; }
}

.site-footer-logo-row { display: flex; align-items: center; gap: 0.75rem; }
.site-footer-logo-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 9999px;
  overflow: hidden;
  outline: 2px solid hsla(325, 95%, 58%, 0.6);
  background: var(--color-background);
  flex-shrink: 0;
}
.site-footer-logo-icon img { width: 100%; height: 100%; object-fit: cover; }
.site-footer-brand-name { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; display: block; line-height: 1.1; }
.site-footer-brand-sub { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.3em; color: var(--color-accent); }
.site-footer-tagline { margin-top: 1.5rem; font-size: 0.875rem; line-height: 1.6; max-width: 28rem; color: rgba(250,247,251,0.75); font-style: italic; font-weight: 300; }
.site-footer-social { display: flex; gap: 0.75rem; margin-top: 1.5rem; }
.site-footer-social-link {
  width: 2.5rem; height: 2.5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  border: 1px solid rgba(250,247,251,0.3);
  color: var(--color-primary-fg);
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.site-footer-social-link:hover { background: var(--color-accent); color: var(--color-accent-fg); border-color: var(--color-accent); }

.site-footer-col-title { font-family: var(--font-display); font-weight: 600; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.3em; margin-bottom: 1.25rem; color: var(--color-accent); }
.site-footer-nav-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.75rem; }
.site-footer-nav-btn {
  background: none; border: none; cursor: pointer; padding: 0;
  font-size: 0.875rem; color: rgba(250,247,251,0.7); transition: color 0.3s ease;
  text-align: left;
}
.site-footer-nav-btn:hover { color: var(--color-accent); }

.site-footer-contact-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.75rem; }
.site-footer-contact-item { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.875rem; color: rgba(250,247,251,0.75); }
.site-footer-contact-item svg { width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.125rem; color: var(--color-accent); }
.site-footer-contact-item a:hover { color: var(--color-accent); }
.site-footer-contact-item a { transition: color 0.3s ease; word-break: break-all; }

.site-footer-bottom {
  margin-top: 3.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(250,247,251,0.15);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}
@media (min-width: 640px) { .site-footer-bottom { flex-direction: row; justify-content: space-between; } }
.site-footer-copy { font-size: 0.75rem; color: rgba(250,247,251,0.55); }
.site-footer-love { font-size: 0.75rem; color: rgba(250,247,251,0.55); text-transform: uppercase; letter-spacing: 0.2em; }
.site-footer-credit { display: flex; justify-content: center; margin-top: 0.75rem; }
.site-footer-credit a { font-size: 0.75rem; color: rgba(250,247,251,0.4); transition: color 0.3s ease; }
.site-footer-credit a:hover { color: var(--color-accent); }

/* ── Section: Hero (matches React: relative min-h-screen flex items-center pt-28 pb-20 bg-gradient-warm noise) */
.hero-section {
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 7rem;   /* pt-28 */
  padding-bottom: 5rem; /* pb-20 */
}
.hero-section.bg-gradient-warm {
  background: var(--gradient-warm);
}
.hero-inner {
  position: relative;
  z-index: 1;
  width: 100%;
}
.hero-grid {
  position: relative;
  display: grid;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 1024px) { .hero-grid { grid-template-columns: 7fr 5fr; } }

.hero-text { position: relative; z-index: 10; }
.hero-h1 {
  margin-top: 1.5rem;
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: -0.025em;
  font-size: 3rem;
}
@media (min-width: 640px)  { .hero-h1 { font-size: 3.75rem; } }
@media (min-width: 1024px) { .hero-h1 { font-size: 4.5rem; } }
@media (min-width: 1280px) { .hero-h1 { font-size: 5.5rem; } }
.hero-h1-line3 { color: var(--color-primary); font-style: italic; font-weight: 500; }
.hero-body { margin-top: 2rem; max-width: 36rem; font-size: 1rem; color: var(--color-muted-fg); line-height: 1.625; font-weight: 300; }
@media (min-width: 640px) { .hero-body { font-size: 1.125rem; } }
.hero-body strong { color: var(--color-foreground); font-weight: 600; }
.hero-buttons { margin-top: 2.5rem; display: flex; flex-wrap: wrap; gap: 0.75rem; }
.hero-social-proof { margin-top: 3rem; display: flex; align-items: center; gap: 1.5rem; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.25em; color: var(--color-muted-fg); }
.hero-stars { display: flex; align-items: center; gap: 0.375rem; }
.hero-star { width: 0.875rem; height: 0.875rem; fill: var(--color-accent); color: var(--color-accent); }

/* Floating decorations — direct children of .hero-section (Lovable layout) */
.hero-float-tree,
.hero-float-anchor {
  position: absolute;
  pointer-events: none;
  display: none;
  z-index: 0;
  will-change: transform;
}
@media (min-width: 1024px) {
  .hero-float-tree,
  .hero-float-anchor { display: block; }
}
.hero-float-tree {
  top: 8rem;    /* top-32 */
  right: 2.5rem; /* right-10 */
  width: 8rem;  /* w-32 */
  height: 8rem;
  color: hsla(325, 95%, 58%, 0.15); /* text-accent/15 */
}
.hero-float-anchor {
  bottom: 7rem; /* bottom-28 */
  left: 2.5rem; /* left-10 */
  width: 5rem;  /* w-20 */
  height: 5rem;
  color: hsla(272, 75%, 45%, 0.1); /* text-primary/10 */
}
.hero-star-animate {
  opacity: 0;
  transform: scale(0.5) rotate(-45deg);
  animation: hero-star-in 0.85s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  animation-delay: calc(1s + var(--star-delay, 0s));
}
@media (prefers-reduced-motion: reduce) {
  .hero-star-animate {
    opacity: 1;
    transform: none;
    animation: none;
  }
  .animate-float-slow { animation: none !important; }
}

/* Hero image stack */
.hero-images { position: relative; }
.hero-image-stack { position: relative; aspect-ratio: 1; }
.hero-img-top {
  position: absolute; top: 0; right: 0;
  width: 78%;
  aspect-ratio: 4/5;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: var(--shadow-lift);
  transform: rotate(3deg);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.hero-img-top:hover { transform: rotate(5deg) scale(1.03); }
.hero-img-top img { width: 100%; height: 100%; object-fit: cover; }
.hero-img-bottom {
  position: absolute; bottom: 0; left: 0;
  width: 68%;
  aspect-ratio: 1;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: var(--shadow-lift);
  border: 4px solid var(--color-background);
  transform: rotate(-6deg);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.hero-img-bottom:hover { transform: rotate(-3deg) scale(1.04); }
.hero-img-bottom img { width: 100%; height: 100%; object-fit: cover; }
.hero-badge {
  position: absolute;
  bottom: -1rem;
  right: 0.5rem;
  background: var(--color-background);
  border-radius: 9999px;
  padding: 1rem 1.25rem;
  box-shadow: var(--shadow-soft);
  border: 1px solid var(--color-border);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  z-index: 10;
}
.hero-badge-icon {
  width: 2.5rem; height: 2.5rem;
  border-radius: 9999px;
  background: var(--gradient-wine);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.hero-badge-icon svg { width: 1rem; height: 1rem; color: var(--color-primary-fg); }
.hero-badge-title { font-family: var(--font-display); font-weight: 700; font-size: 0.875rem; line-height: 1.2; }
.hero-badge-sub { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--color-muted-fg); }

/* ── Section: Marquee ─────────────────────────────────────────────────────── */
.marquee-section {
  background: var(--gradient-wine);
  color: var(--color-primary-fg);
  padding: 1.25rem 0;
  overflow: hidden;
  border-top: 1px solid hsla(325,95%,58%,0.2);
  border-bottom: 1px solid hsla(325,95%,58%,0.2);
}
.marquee-track {
  display: flex;
  white-space: nowrap;
  animation: marquee 40s linear infinite;
}
.marquee-items {
  display: flex;
  align-items: center;
  gap: 3rem;
  padding: 0 1.5rem;
  flex-shrink: 0;
}
.marquee-item {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  gap: 3rem;
}
.marquee-dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 9999px;
  background: var(--color-accent);
  display: inline-block;
  flex-shrink: 0;
}

/* ── Section: Featured ────────────────────────────────────────────────────── */
/* py-24 lg:py-32 — padding-top/bottom only (same element has .container-wide px-6 lg:px-10) */
.featured-section { padding-top: 6rem; padding-bottom: 6rem; }
@media (min-width: 1024px) { .featured-section { padding-top: 8rem; padding-bottom: 8rem; } }
.featured-header { max-width: 42rem; margin-bottom: 3.5rem; } /* max-w-2xl mb-14 */
.featured-sub { margin-top: 1.25rem; color: var(--color-muted-fg); font-weight: 300; line-height: 1.625; }
.featured-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem; /* gap-6 */
  align-items: stretch;
}
@media (min-width: 640px) { .featured-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .featured-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ── Product Card ─────────────────────────────────────────────────────────── */
.theme-product-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  will-change: transform;
  position: relative;
}
.theme-product-card__image-wrapper {
  position: relative;
  aspect-ratio: 4/5;
  overflow: hidden;
  background: var(--color-secondary);
}
.theme-product-card__image-wrapper a {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.theme-product-card__image-wrapper img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s ease;
  display: block;
}
.theme-product-card:hover .theme-product-card__image-wrapper img { transform: scale(1.1); }
.theme-product-card__tag {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  background: hsla(300,30%,98%,0.9);
  backdrop-filter: blur(4px);
  padding: 0.375rem 0.75rem;
  border-radius: 9999px;
  color: var(--color-accent);
  font-weight: 500;
  z-index: 2;
  pointer-events: none;
}
.theme-product-card__body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  gap: 0.625rem;
}
.theme-product-card__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.3;
  transition: color 0.3s ease;
}
@media (min-width: 1280px) {
  .theme-product-card__title { font-size: 1.125rem; }
}
.theme-product-card__title:hover { color: var(--color-accent); }
.theme-product-card__title a { color: inherit; }
.theme-product-card__title a:hover { color: var(--color-accent); }
.theme-product-card__desc {
  font-size: 0.8125rem;
  color: var(--color-muted-fg);
  font-weight: 300;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1 1 auto;
  min-height: 0;
}
@media (min-width: 1280px) {
  .theme-product-card__desc { font-size: 0.875rem; -webkit-line-clamp: 3; }
}
.theme-product-card__footer {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.875rem;
  min-width: 0;
}
.theme-product-card__price {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--color-primary);
  line-height: 1.25;
  flex-shrink: 0;
}
@media (min-width: 1280px) {
  .theme-product-card__price { font-size: 1.25rem; }
}
.theme-product-card__price-on-sale {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.5rem;
}
.theme-product-card__price .woocommerce-Price-amount,
.theme-product-card__price .woocommerce-Price-currencySymbol { color: inherit; font-size: inherit; font-weight: inherit; }
.theme-product-card__price-on-sale del {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-muted-fg);
  text-decoration: line-through;
  margin-right: 0;
}
.theme-product-card__price-on-sale del .woocommerce-Price-amount { font-size: inherit; color: inherit; }
.theme-product-card__price-on-sale ins {
  text-decoration: none;
  color: var(--color-primary);
}
.theme-product-card__price .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.theme-product-card__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}
.theme-product-card__actions--solo { justify-content: flex-end; }
.theme-product-card__sold-out { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--color-destructive); }

/* Qty stepper in card */
.theme-qty-stepper-inline {
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  border: 1px solid var(--color-border);
  flex-shrink: 0;
}
.theme-qty-btn-sm {
  width: 1.75rem;
  height: 1.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-foreground);
  transition: color 0.2s ease;
  border-radius: 9999px;
}
.theme-qty-btn-sm:hover { color: var(--color-accent); }
.theme-qty-display-sm { width: 1.75rem; text-align: center; font-size: 0.875rem; font-weight: 600; }

/* Add button in card */
.theme-card-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 500;
  color: var(--color-accent);
  background: none;
  border: none;
  cursor: pointer;
  transition: color 0.2s ease;
  padding: 0;
  flex-shrink: 0;
  white-space: nowrap;
}
.theme-card-add-btn:hover { color: var(--color-primary); }

/* WooCommerce add-to-cart button global override */
.single_add_to_cart_button.button,
.add_to_cart_button.button,
a.single_add_to_cart_button,
a.add_to_cart_button {
  background: var(--gradient-wine) !important;
  color: var(--color-primary-fg) !important;
  border: none !important;
  border-radius: var(--btn-radius) !important;
  padding: var(--btn-padding) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--font-body) !important;
  font-size: var(--btn-font-size) !important;
  font-weight: var(--btn-font-weight) !important;
  letter-spacing: var(--btn-letter-spacing) !important;
  text-transform: var(--btn-text-transform) !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}
.single_add_to_cart_button.button:hover,
.add_to_cart_button.button:hover {
  opacity: 0.85 !important;
  background: var(--gradient-wine) !important;
  color: var(--color-primary-fg) !important;
}
.single_add_to_cart_button.button:disabled,
.single_add_to_cart_button.button.disabled,
.add_to_cart_button.button:disabled,
.add_to_cart_button.button.disabled {
  cursor: not-allowed !important;
  opacity: 0.4 !important;
  pointer-events: none !important;
}
.single_add_to_cart_button.button:disabled:hover,
.single_add_to_cart_button.button.disabled:hover,
.add_to_cart_button.button:disabled:hover,
.add_to_cart_button.button.disabled:hover {
  opacity: 0.4 !important;
  background: var(--gradient-wine) !important;
}
/* Hide "View cart" after AJAX add */
.woocommerce-page a.added_to_cart.wc-forward,
.single-product a.added_to_cart.wc-forward,
body a.added_to_cart.wc-forward { display: none !important; }

/* Button lock during AJAX */
.ajax_add_to_cart.theme-btn-loading {
  opacity: 0.6 !important;
  pointer-events: none !important;
  cursor: wait !important;
}

/* ── Section: Creations / Gallery ─────────────────────────────────────────── */
.creations-section { padding-top: 6rem; padding-bottom: 6rem; color: var(--color-primary-fg); position: relative; overflow: hidden; }
@media (min-width: 1024px) { .creations-section { padding-top: 8rem; padding-bottom: 8rem; } }
.creations-header { max-width: 42rem; margin-bottom: 3.5rem; }
.creations-heading em { text-decoration: underline; text-decoration-style: wavy; text-decoration-color: rgba(250,247,251,0.5); text-underline-offset: 0.5rem; font-style: normal; color: inherit; font-weight: inherit; }
.creations-sub { margin-top: 1.25rem; color: rgba(250,247,251,0.85); font-weight: 300; line-height: 1.625; }

/* Video placeholder */
.creations-video-wrap {
  position: relative;
  aspect-ratio: 16/9;
  width: 100%;
  border-radius: 1rem;
  overflow: hidden;
  border: 4px solid rgba(250,247,251,0.2);
  box-shadow: var(--shadow-lift);
  margin-bottom: 3rem;
  background: hsl(270 20% 10%);
}
.creations-video-wrap video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.creations-video-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background: linear-gradient(135deg, hsl(272 75% 25%), hsl(325 85% 30%), hsl(220 90% 25%));
}
.creations-video-play {
  width: 5rem; height: 5rem;
  border-radius: 9999px;
  background: rgba(250,247,251,0.15);
  backdrop-filter: blur(4px);
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(250,247,251,0.3);
  animation: pulse-scale 2.4s ease-in-out infinite;
}
.creations-video-play svg { width: 2rem; height: 2rem; fill: var(--color-primary-fg); color: var(--color-primary-fg); }
.creations-video-title { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; text-align: center; }
.creations-video-sub { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.3em; color: rgba(250,247,251,0.7); margin-top: 0.5rem; }
.creations-video-copy { text-align: center; padding: 0 1.5rem; }

/* Gallery grid */
.creations-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}
@media (min-width: 768px) { .creations-gallery { grid-template-columns: repeat(3, 1fr); gap: 1rem; } }
@media (min-width: 1024px) { .creations-gallery { grid-template-columns: repeat(4, 1fr); } }

.gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid rgba(250,247,251,0.2);
  aspect-ratio: 1;
  will-change: transform;
  transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.gallery-item:hover { transform: translateY(-6px); box-shadow: var(--shadow-lift); }
.gallery-item.lg-span { /* items 0 and 5 */ }
@media (min-width: 768px) {
  .gallery-item.lg-span { grid-row: span 2; grid-column: span 2; aspect-ratio: auto; }
  .gallery-item.lg-span::after { padding-bottom: 100%; content:''; display:block; }
}
.gallery-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.gallery-item:hover img { transform: scale(1.1); }
.gallery-item-overlay { position: absolute; inset: 0; background: linear-gradient(to top, hsl(272 80% 15% / 0.7) 0%, transparent 50%); opacity: 0.6; transition: opacity 0.3s ease; }
.gallery-item:hover .gallery-item-overlay { opacity: 0.9; }

.creations-cta { margin-top: 3rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.btn-white-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  padding: 0.875rem 1.75rem; border-radius: 9999px;
  font-size: 0.875rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.18em;
  background: var(--color-primary-fg); color: var(--color-primary);
  border: none; cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease;
}
.btn-white-primary:hover { background: var(--color-accent); color: var(--color-accent-fg); }

/* ── Section: Menu ────────────────────────────────────────────────────────── */
.menu-section { padding-top: 6rem; padding-bottom: 6rem; background: hsla(220,90%,96%,0.6); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); position: relative; }
@media (min-width: 1024px) { .menu-section { padding-top: 8rem; padding-bottom: 8rem; } }
.menu-header-row {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 3rem;
}
.menu-header-copy {
  flex: 0 0 auto;
  max-width: 42rem;
  min-width: 0;
  width: fit-content;
}
@media (min-width: 1024px) {
  .menu-header-row {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
  }
  .menu-header-copy {
    flex: 0 0 auto;
    max-width: 42rem;
  }
}
.menu-heading { /* uses shared section heading scale */ }
.menu-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}
@media (min-width: 1024px) {
  .menu-filters {
    flex: 1 1 0;
    min-width: 0;
    justify-content: flex-end;
    align-content: flex-end;
  }
}
/* Prevent reveal blur from degrading inline SVG icons */
.menu-filters.reveal.is-visible {
  filter: none;
}
.menu-filters.reveal {
  transition: opacity 0.9s cubic-bezier(0.22,1,0.36,1), transform 0.9s cubic-bezier(0.22,1,0.36,1);
}
.menu-filters::-webkit-scrollbar { display: none; }
.menu-filter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem; /* py-2.5 px-4 — matches Lovable */
  border-radius: 9999px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 500;
  line-height: 1;
  transition: all 0.3s ease;
  border: 1px solid var(--color-border);
  background: var(--color-background);
  color: var(--color-foreground);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  overflow: visible;
}
.menu-filter-btn:hover { border-color: var(--color-accent); color: var(--color-accent); }
.menu-filter-btn.is-active { background: var(--color-primary); color: var(--color-primary-fg); border-color: var(--color-primary); box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); }
.menu-grid.is-filtering { opacity: 0.55; transition: opacity 0.25s ease; }
.menu-filter-btn .menu-filter-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.875rem;   /* w-3.5 — matches Lovable */
  height: 0.875rem;
  flex-shrink: 0;
  overflow: visible;
  line-height: 0;
}
.menu-filter-btn .menu-filter-icon-wrap svg,
.menu-filter-btn .menu-filter-icon {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
  stroke: currentColor;
  color: inherit;
}
.menu-filter-btn.is-active .menu-filter-icon-wrap svg,
.menu-filter-btn.is-active .menu-filter-icon {
  color: var(--color-primary-fg);
  stroke: currentColor;
}
.menu-grid {
  display: grid; grid-template-columns: 1fr; gap: 1.5rem;
}
@media (min-width: 640px)  { .menu-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .menu-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ── Section: About ───────────────────────────────────────────────────────── */
.about-section { padding-top: 6rem; padding-bottom: 6rem; color: var(--color-primary-fg); position: relative; overflow: hidden; }
@media (min-width: 1024px) { .about-section { padding-top: 8rem; padding-bottom: 8rem; } }
.about-grid { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .about-grid { grid-template-columns: 5fr 7fr; } }
.about-photo-wrap {
  position: relative;
}
.about-photo-inner {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: 1rem;
  overflow: hidden;
  border: 4px solid hsla(325,95%,58%,0.3);
  box-shadow: var(--shadow-lift);
  max-width: 28rem;
  margin: 0 auto;
}
.about-photo-inner img { width: 100%; height: 100%; object-fit: cover; }
.about-decor-palm {
  display: none;
  position: absolute;
  top: 5rem;
  left: 2rem;
  width: 10rem;
  height: 10rem;
  color: hsla(325, 95%, 58%, 0.1);
  pointer-events: none;
}
@media (min-width: 1024px) { .about-decor-palm { display: block; } }

.about-badge {
  position: absolute;
  bottom: -1.5rem;
  right: -1rem;
  background: var(--color-accent);
  color: var(--color-accent-fg);
  border-radius: 9999px;
  width: 8rem; height: 8rem;
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  font-family: var(--font-display);
  text-align: center;
  transform: rotate(6deg);
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
@media (min-width: 1024px) { .about-badge { right: 2.5rem; } }
.about-badge-num { font-size: 1.875rem; font-weight: 700; line-height: 1; }
.about-badge-label { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.2em; margin-top: 0.25rem; font-weight: 500; }
.about-content { }
.about-body { margin-top: 1.5rem; color: rgba(250,247,251,0.85); line-height: 1.625; font-weight: 300; }
.about-body--spaced { margin-top: 1rem; }
.about-stats { margin-top: 2rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; max-width: 28rem; }
.about-stat { border-radius: 0.75rem; border: 1px solid hsla(325,95%,58%,0.3); padding: 1.25rem 1rem; text-align: center; background: rgba(250,247,251,0.05); backdrop-filter: blur(4px); }
.about-stat-num { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; color: var(--color-accent); }
.about-stat-label { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.25em; margin-top: 0.25rem; color: rgba(250,247,251,0.7); }

/* ── Section: Services ────────────────────────────────────────────────────── */
.services-section { padding-top: 6rem; padding-bottom: 6rem; }
@media (min-width: 1024px) { .services-section { padding-top: 8rem; padding-bottom: 8rem; } }
.services-header { max-width: 42rem; margin-bottom: 3.5rem; }
.services-heading { /* uses shared section heading scale */ }
.services-grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 768px) { .services-grid { grid-template-columns: repeat(3, 1fr); } }
.service-card { padding: 1.75rem; will-change: transform; } /* p-7 */
.service-icon {
  width: 3rem;
  height: 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: var(--gradient-wine);
  color: var(--color-primary-fg);
  margin-bottom: 1.25rem; /* mb-5 */
  flex-shrink: 0;
  overflow: visible;
}
.service-icon svg,
.service-icon .service-card-icon {
  width: 1.25rem;  /* w-5 */
  height: 1.25rem;
  display: block;
  overflow: visible;
  stroke: currentColor;
  color: inherit;
}
.service-title { font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; }
.service-body { margin-top: 0.5rem; font-size: 0.875rem; color: var(--color-muted-fg); font-weight: 300; line-height: 1.625; }

/* ── Section: Testimonials (matches Lovable: py-24 lg:py-32 bg-secondary/60, grid md:cols-3 gap-6) */
.testimonials-section {
  padding-top: 6rem;
  padding-bottom: 6rem;
  background: hsla(220, 90%, 96%, 0.6);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
@media (min-width: 1024px) {
  .testimonials-section { padding-top: 8rem; padding-bottom: 8rem; }
}
.testimonials-header {
  text-align: center;
  max-width: 42rem; /* max-w-2xl */
  margin: 0 auto 3.5rem; /* mb-14 */
}
.testimonials-heading { /* shared section heading scale */ }
.testimonials-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem; /* gap-6 */
  align-items: stretch;
}
@media (min-width: 768px) {
  .testimonials-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.testimonial-card {
  margin: 0;
  padding: 2rem; /* p-8 */
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  will-change: transform;
}
.testimonial-card .testimonial-quote-icon {
  position: absolute;
  top: 1rem;    /* top-4 */
  right: 1.25rem; /* right-5 */
  width: 2.5rem;  /* w-10 */
  height: 2.5rem;
  color: hsla(325, 95%, 58%, 0.2); /* text-accent/20 */
  pointer-events: none;
  stroke: currentColor;
}
.testimonial-stars {
  display: flex;
  align-items: center;
  gap: 0.25rem; /* gap-1 */
  margin-bottom: 0.75rem; /* mb-3 */
  color: var(--color-accent);
}
.testimonial-star {
  width: 0.875rem; /* w-3.5 */
  height: 0.875rem;
  display: block;
  flex-shrink: 0;
  fill: var(--color-accent);
  color: var(--color-accent);
}
.testimonial-quote {
  margin: 0;
  padding: 0;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.125rem; /* text-lg */
  line-height: 1.375; /* leading-snug */
  flex: 1 1 auto;
}
.testimonial-footer {
  margin-top: 1.25rem; /* mt-5 */
  padding-top: 1rem; /* pt-4 */
  border-top: 1px solid var(--color-border);
}
.testimonial-name { font-weight: 600; } /* font-semibold */
.testimonial-role {
  font-size: 0.75rem; /* text-xs */
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--color-muted-fg);
  margin-top: 0.25rem; /* mt-1 */
}

/* ── Section: FAQ ─────────────────────────────────────────────────────────── */
.faq-section { padding-top: 6rem; padding-bottom: 6rem; }
@media (min-width: 1024px) { .faq-section { padding-top: 8rem; padding-bottom: 8rem; } }
.faq-grid { display: grid; gap: 3rem; }
@media (min-width: 1024px) { .faq-grid { grid-template-columns: 4fr 8fr; } }
.faq-intro { }
.faq-sub { margin-top: 1.25rem; color: var(--color-muted-fg); font-weight: 300; line-height: 1.625; }
.faq-cta { margin-top: 1.75rem; }
.faq-list { display: flex; flex-direction: column; gap: 0.75rem; }
.faq-item { overflow: hidden; }
.faq-question-btn {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.5rem; text-align: left; background: none; border: none; cursor: pointer; color: var(--color-foreground);
}
.faq-question-text { font-family: var(--font-display); font-weight: 600; font-size: 1.125rem; padding-right: 1rem; line-height: 1.3; }
.faq-toggle-icon {
  flex-shrink: 0;
  width: 2.25rem; height: 2.25rem;
  border-radius: 9999px; background: var(--color-secondary);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--color-accent);
}
.faq-toggle-icon svg { width: 1rem; height: 1rem; }
.faq-answer { padding: 0 1.5rem 1.5rem; font-size: 0.875rem; color: var(--color-muted-fg); line-height: 1.625; font-weight: 300; display: none; }
.faq-item.is-open .faq-answer { display: block; animation: fade-in 0.7s cubic-bezier(0.22, 1, 0.36, 1); }

/* ── Section: Contact ─────────────────────────────────────────────────────── */
.contact-section { padding-top: 6rem; padding-bottom: 6rem; border-top: 1px solid var(--color-border); }
@media (min-width: 1024px) { .contact-section { padding-top: 8rem; padding-bottom: 8rem; } }
.contact-grid { display: grid; gap: 3rem; }
@media (min-width: 1024px) {
  .contact-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 3rem;
    align-items: start;
  }
  .contact-info { grid-column: span 5; }
  .contact-form.luxe-card { grid-column: span 7; }
}
.contact-info { }
.contact-sub { margin-top: 1.25rem; color: var(--color-muted-fg); font-weight: 300; line-height: 1.625; }
.contact-details {
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.contact-detail-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  list-style: none;
}
.contact-detail-item > div {
  min-width: 0;
  flex: 1;
  line-height: 1.25;
}
.contact-detail-icon {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 9999px;
  background: var(--color-primary);
  color: var(--color-primary-fg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.contact-detail-icon svg { width: 1rem; height: 1rem; display: block; flex-shrink: 0; }
.contact-detail-label {
  display: block;
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: var(--color-muted-fg);
}
.contact-detail-value {
  display: block;
  font-weight: 500;
  margin-top: 0.125rem;
}
.contact-detail-value a {
  display: inline;
  word-break: break-all;
  transition: color 0.3s ease;
}
.contact-detail-value a:hover { color: var(--color-accent); }
.contact-socials { margin-top: 2rem; display: flex; gap: 0.75rem; }
.contact-social-btn {
  width: 2.75rem; height: 2.75rem;
  border-radius: 9999px; border: 1px solid var(--color-border);
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 0.3s ease; color: var(--color-foreground);
}
.contact-social-btn:hover { background: var(--color-primary); color: var(--color-primary-fg); border-color: var(--color-primary); }

/* Contact form — luxe-card on <form> (Lovable: lg:col-span-7 p-8 lg:p-10 space-y-5) */
.contact-form.luxe-card {
  padding: 2rem;
  margin: 0;
  width: 100%;
  align-self: start;
}
@media (min-width: 1024px) {
  .contact-form.luxe-card { padding: 2.5rem; }
}
.contact-form.luxe-card:hover {
  transform: none;
  box-shadow: var(--shadow-soft);
}
/* space-y-5 — block layout, not flex (avoids stretch + extra bottom gap) */
.contact-form.luxe-card > * + * { margin-top: 1.25rem; }
.contact-form-row { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 640px) { .contact-form-row { grid-template-columns: 1fr 1fr; } }
.contact-form label { display: block; margin: 0; }
.form-label-text { display: block; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.25em; font-weight: 500; color: var(--color-muted-fg); }
.form-input, .form-textarea {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
  background: var(--color-background);
  border: 1px solid var(--color-border);
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  transition: border-color 0.3s ease;
  outline: none;
  color: var(--color-foreground);
}
.form-input:focus, .form-textarea:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px hsla(325, 95%, 58%, 0.12);
}
.form-textarea { resize: none; min-height: 0; }

/* Date field — themed picker (matches luxe-card form aesthetic) */
.form-date-field {
  position: relative;
  display: block;
  margin-top: 0.5rem;
}
.form-input--date {
  margin-top: 0;
  padding-right: 2.75rem;
  cursor: pointer;
  color-scheme: light;
  transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}
.form-input--date:hover {
  border-color: hsla(325, 95%, 58%, 0.45);
  background-color: hsla(325, 95%, 96%, 0.35);
}
.form-date-field:hover .form-date-icon { color: var(--color-primary); }
.form-date-icon {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;
  height: 1rem;
  color: var(--color-accent);
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.3s ease;
}
.form-date-icon svg { width: 100%; height: 100%; display: block; }
.form-input--date::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 0;
  top: 0;
  width: 3rem;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
}
.form-input--date::-webkit-datetime-edit { padding: 0; }
.form-input--date::-webkit-datetime-edit-fields-wrapper { padding: 0; }
.form-input--date::-webkit-datetime-edit-text,
.form-input--date::-webkit-datetime-edit-month-field,
.form-input--date::-webkit-datetime-edit-day-field,
.form-input--date::-webkit-datetime-edit-year-field {
  color: var(--color-foreground);
  padding: 0 0.125rem;
  font-family: var(--font-body);
}
.form-input--date:focus::-webkit-datetime-edit-month-field,
.form-input--date:focus::-webkit-datetime-edit-day-field,
.form-input--date:focus::-webkit-datetime-edit-year-field {
  background: hsla(325, 95%, 58%, 0.08);
  border-radius: 0.25rem;
}
.form-input--date::-moz-calendar-picker-indicator {
  position: absolute;
  right: 0;
  top: 0;
  width: 3rem;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.contact-form button { margin: 0; }
.contact-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding-top: 0.5rem;
  margin-bottom: 0;
}

/* ── Section: CTA (matches Lovable: py-32 bg-gradient-wine, video 40%, overlay wine/70 multiply) */
.cta-section {
  padding-top: 8rem;
  padding-bottom: 8rem;
  color: var(--color-primary-fg);
  position: relative;
  overflow: hidden;
  background: var(--gradient-wine);
  isolation: isolate;
}
.cta-section.noise::after { z-index: 2; }
.cta-bg-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.4;
  pointer-events: none;
}
.cta-bg-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--gradient-wine);
  opacity: 0.7;
  mix-blend-mode: multiply;
  pointer-events: none;
}
.cta-float-anchor {
  position: absolute;
  z-index: 1;
  right: -1.5rem;
  bottom: -1.5rem;
  width: 12rem;
  height: 12rem;
  color: hsla(325, 95%, 58%, 0.1);
  display: none;
  pointer-events: none;
}
@media (min-width: 768px) { .cta-float-anchor { display: block; } }
.cta-section > .cta-content {
  position: relative;
  z-index: 3;
  color: var(--color-primary-fg);
}
.cta-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .cta-inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
  }
}
.cta-heading {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.875rem;
  letter-spacing: -0.025em;
  color: var(--color-primary-fg);
}
@media (min-width: 1024px) { .cta-heading { font-size: 2.25rem; } }
.cta-sub { margin-top: 0.5rem; color: rgba(250, 247, 251, 0.8); font-weight: 300; }
.cta-section .cta-btn { border-color: var(--color-accent); color: var(--color-accent); }
#theme-cart-drawer .luxe-card:hover { transform: none; box-shadow: var(--shadow-soft); }

/* ── WooCommerce: Cart Drawer ──────────────────────────────────────────────── */
#theme-cart-overlay {
  position: fixed; inset: 0; z-index: 60;
  background: rgba(18,15,24,0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0; pointer-events: none;
  transition: opacity 0.3s ease;
}
body.cart-open #theme-cart-overlay { opacity: 1; pointer-events: auto; }

#theme-cart-drawer {
  position: fixed; top: 0; right: 0; z-index: 70;
  height: 100%; width: 100%;
  max-width: 440px;
  background: var(--color-background);
  border-left: 1px solid var(--color-border);
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
body.cart-open #theme-cart-drawer { transform: translateX(0); }
#theme-cart-drawer.is-updating { opacity: 0.6; pointer-events: none; }

.cart-drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.5rem; border-bottom: 1px solid var(--color-border);
  background: var(--gradient-warm);
  flex-shrink: 0;
}
.cart-drawer-title-row { display: flex; align-items: center; gap: 0.75rem; }
.cart-drawer-title-row svg { width: 1.25rem; height: 1.25rem; color: var(--color-accent); }
.cart-drawer-title { font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; letter-spacing: -0.01em; }
.cart-drawer-close {
  width: 2.25rem; height: 2.25rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px; border: 1px solid var(--color-border);
  background: none; cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease;
  color: var(--color-foreground);
}
.cart-drawer-close:hover { background: var(--color-foreground); color: var(--color-background); }
.cart-drawer-close svg { width: 1rem; height: 1rem; }

.cart-drawer-body { flex: 1; overflow-y: auto; padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; }

.cart-empty-state {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 4rem 1rem;
}
.cart-empty-state svg { width: 3rem; height: 3rem; color: var(--color-muted-fg); margin-bottom: 1rem; }
.cart-empty-title { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; margin-bottom: 0.5rem; }
.cart-empty-sub { font-size: 0.875rem; color: var(--color-muted-fg); margin-bottom: 1.5rem; }

.cart-item { padding: 0.75rem; display: flex; gap: 0.75rem; }
.cart-item-thumb { flex-shrink: 0; width: 5rem; height: 5rem; border-radius: 0.375rem; overflow: hidden; border: 1px solid var(--color-border); }
.cart-item-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cart-item-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cart-item-name { font-family: var(--font-display); font-weight: 600; font-size: 0.875rem; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cart-item-price { font-size: 0.75rem; color: var(--color-muted-fg); margin-top: 0.125rem; }
.cart-item-variation { font-size: 0.75rem; color: var(--color-muted-fg); margin-top: 0.125rem; }
.cart-item-controls { margin-top: auto; padding-top: 0.5rem; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.cart-item-qty {
  display: inline-flex; align-items: center;
  border-radius: 9999px; border: 1px solid var(--color-border);
}
.cart-item-qty-btn {
  width: 1.75rem; height: 1.75rem;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  color: var(--color-foreground); transition: color 0.2s ease;
  border-radius: 9999px;
}
.cart-item-qty-btn:hover { color: var(--color-accent); }
.cart-item-qty-btn svg { width: 0.75rem; height: 0.75rem; }
.cart-item-qty-display { width: 2rem; text-align: center; font-size: 0.875rem; font-weight: 600; }
.cart-item-line-total { font-family: var(--font-display); font-weight: 700; font-size: 1rem; color: var(--color-primary); }
.cart-item-remove {
  width: 1.75rem; height: 1.75rem;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  color: var(--color-foreground); transition: color 0.2s ease;
}
.cart-item-remove:hover { color: var(--color-destructive); }
.cart-item-remove svg { width: 0.875rem; height: 0.875rem; }

.cart-drawer-footer {
  border-top: 1px solid var(--color-border);
  padding: 1.5rem;
  background: var(--gradient-warm);
  flex-shrink: 0;
  display: flex; flex-direction: column; gap: 1rem;
}
.cart-footer-subtotal { display: flex; align-items: center; justify-content: space-between; }
.cart-footer-subtotal-label { font-weight: 500; text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.75rem; }
.cart-footer-subtotal-value { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; color: var(--color-primary); }
.cart-footer-notice { font-size: 0.6875rem; color: var(--color-muted-fg); }
.cart-footer-checkout { width: 100%; display: flex; }
.cart-footer-checkout .btn-primary { width: 100%; justify-content: center; }
.cart-footer-phone { text-align: center; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.3em; color: var(--color-accent); }
.cart-footer-phone a:hover { text-decoration: underline; }

/* ── WooCommerce: Single Product ──────────────────────────────────────────── */
.single-product-page { padding-top: 7rem; padding-bottom: 5rem; min-height: 100vh; }
.product-back-link {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.25em;
  color: var(--color-muted-fg); transition: color 0.3s ease;
  margin-bottom: 2rem;
}
.product-back-link:hover { color: var(--color-accent); }
.product-back-link svg { width: 0.875rem; height: 0.875rem; }

.theme-product-layout { display: grid; gap: 2.5rem; }
@media (min-width: 768px) { .theme-product-layout { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.theme-product-gallery, .theme-product-info { min-width: 0; max-width: 100%; }

.theme-product-main-image-wrap {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: var(--card-radius);
  overflow: hidden;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-soft);
}
.theme-product-main-image-wrap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.theme-product-thumbnails {
  display: flex; gap: 0.5rem; margin-top: 0.75rem;
  flex-wrap: wrap; max-width: 100%;
}
.theme-product-thumb-btn {
  width: 4rem; height: 4rem; border-radius: 0.5rem; overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer; padding: 0; background: none;
  transition: border-color 0.3s ease;
  flex-shrink: 0;
}
.theme-product-thumb-btn img { width: 100%; height: 100%; object-fit: cover; }
.theme-product-thumb-btn.is-active { border-color: var(--color-accent); }

.product-category-label { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.3em; color: var(--color-accent); font-weight: 500; }
.product-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem,4vw,3rem); margin-top: 0.75rem; line-height: 1.1; }
.product-description { margin-top: 1.5rem; color: var(--color-muted-fg); font-weight: 300; line-height: 1.7; font-size: 1.125rem; }
.product-price-row { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--color-border); }
.product-price { font-family: var(--font-display); font-weight: 700; font-size: 2.5rem; color: var(--color-primary); }
.product-stock-out { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.2em; color: var(--color-destructive); }

.woocommerce-product-details__short-description { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--color-border); overflow-wrap: break-word; word-break: break-word; }
.woocommerce-product-details__short-description h4 { font-family: var(--font-display); font-weight: 700; font-size: 1.125rem; margin-bottom: 0.5rem; }
.woocommerce-product-details__short-description p { color: var(--color-muted-fg); font-weight: 300; line-height: 1.7; font-size: 0.9375rem; }

.theme-add-to-cart-area {
  margin-top: 2rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: 1rem;
}
.theme-quantity-wrapper {
  display: inline-flex; align-items: center;
  border-radius: 9999px; border: 1px solid var(--color-border);
}
.theme-qty-minus, .theme-qty-plus {
  width: 2.75rem; height: 2.75rem;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  color: var(--color-foreground); transition: color 0.2s ease;
  border-radius: 9999px;
}
.theme-qty-minus:hover, .theme-qty-plus:hover { color: var(--color-accent); }
.theme-qty-input {
  width: 3rem; text-align: center;
  font-family: var(--font-display); font-weight: 700; font-size: 1.125rem;
  border: none; background: none; outline: none; color: var(--color-foreground);
  -moz-appearance: textfield;
}
.theme-qty-input::-webkit-inner-spin-button,
.theme-qty-input::-webkit-outer-spin-button { -webkit-appearance: none; }

.single_add_to_cart_button { flex: 1 1 auto; min-width: 160px; }

.product-quick-qty { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.product-quick-qty-btn {
  padding: 0.5rem 1rem; border-radius: 9999px;
  font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.2em;
  border: 1px solid var(--color-border); background: none; cursor: pointer;
  color: var(--color-foreground);
  transition: all 0.3s ease;
}
.product-quick-qty-btn.is-active { background: var(--color-foreground); color: var(--color-background); border-color: var(--color-foreground); }
.product-quick-qty-btn:hover:not(.is-active) { border-color: var(--color-accent); color: var(--color-accent); }

/* ── Variable product form — stacked option rows ───────────────────────────── */
.theme-variations-form {
  margin-top: 2rem;
  display: block;
  width: 100%;
}
.theme-variations-fields {
  display: block;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
}
.single-product .variations.shop_attributes {
  width: 100%;
  border: none;
  margin: 0;
}
.single-product .variations.shop_attributes tbody,
.single-product .variations tbody tr,
.single-product .variations tbody td {
  display: block;
  width: 100%;
  padding: 0;
  border: none;
  background: none;
}
.single-product .theme-variation-row + .theme-variation-row {
  margin-top: 1.5rem;
}
.single-product .variations tbody td.label {
  padding-bottom: 0.625rem;
}
.single-product .variations tbody td.label label {
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  font-weight: 500;
  color: var(--color-muted-fg);
  margin: 0;
}
.single-product .variations tbody td.value {
  position: relative;
  padding-top: 0;
}
/* Hide native selects — custom option list handles UI */
.theme-variations-form select[name^="attribute_"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.theme-variation-options {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.theme-variation-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: 0.75rem;
  background: var(--color-background);
  cursor: pointer;
  text-align: left;
  font-family: var(--font-body);
  color: inherit;
  transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}
.theme-variation-option:hover:not(:disabled):not(.is-selected) {
  border-color: hsla(325, 95%, 58%, 0.4);
  background: hsla(325, 95%, 96%, 0.45);
}
.theme-variation-option.is-selected {
  border-color: var(--color-accent);
  background: hsla(325, 95%, 58%, 0.07);
  box-shadow: inset 3px 0 0 var(--color-accent);
}
.theme-variation-option:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
.theme-variation-option:disabled .theme-variation-option-label {
  text-decoration: line-through;
}
.theme-variation-option-inner {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
}
.theme-variation-option-label {
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.3;
  color: var(--color-foreground);
}
.theme-variation-option.is-selected .theme-variation-option-label {
  font-weight: 600;
  color: var(--color-primary);
}
.theme-variation-option-swatch {
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 9999px;
  border: 2px solid hsla(18, 15%, 24%, 0.1);
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px hsla(0, 0%, 100%, 0.35);
}
.theme-variation-option-marker {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  border: 2px solid var(--color-border);
  flex-shrink: 0;
  position: relative;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.theme-variation-option.is-selected .theme-variation-option-marker {
  border-color: var(--color-accent);
  background: var(--color-accent);
}
.theme-variation-option.is-selected .theme-variation-option-marker::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 46%;
  width: 0.3125rem;
  height: 0.5625rem;
  border: solid var(--color-primary-fg);
  border-width: 0 2px 2px 0;
  transform: translate(-50%, -50%) rotate(45deg);
}
.variations_form .reset_variations {
  display: inline-flex;
  align-items: center;
  margin-top: 0.75rem;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 500;
  color: var(--color-muted-fg);
  transition: color 0.3s ease;
}
.variations_form .reset_variations:hover { color: var(--color-accent); }
.single-product .theme-variation-row:not(:last-child) td.value .reset_variations {
  display: none;
}
.theme-variations-form .single_variation_wrap {
  margin-top: 1.25rem;
}
.theme-variations-form .woocommerce-variation {
  margin-bottom: 0.75rem;
}
.theme-variations-form .woocommerce-variation-price {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--color-primary);
  line-height: 1.2;
}
.theme-variations-form .woocommerce-variation-price .price {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.theme-variations-form .woocommerce-variation-availability {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--color-muted-fg);
  margin-top: 0.25rem;
}
.theme-variations-form .woocommerce-variation-availability .stock.out-of-stock {
  color: var(--color-destructive);
}
.theme-variations-form .product-form-wrapper.theme-add-to-cart-area {
  margin-top: 0;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}
.theme-variations-form .single_add_to_cart_button.disabled,
.theme-variations-form .single_add_to_cart_button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

.theme-attr-select-hidden { display: none !important; }

/* Related products */
.related-products-section { margin-top: 6rem; }
.related-products-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.5rem,3vw,2rem); margin-bottom: 2rem; }
.related-products-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
@media (min-width: 1024px) { .related-products-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Single product responsive */
.single-product .theme-product-layout { min-width: 0; }
.single-product .theme-add-to-cart-area { flex-wrap: wrap; gap: 0.75rem; }
.single-product .single_add_to_cart_button { flex: 1 1 auto; min-width: 160px; }
.single-product .woocommerce-product-details__short-description,
.single-product .posted_in { overflow-wrap: break-word; word-break: break-word; }

/* ── WooCommerce: Archive / Shop ─────────────────────────────────────────── */
.woocommerce-archive-page { padding-top: 7rem; padding-bottom: 5rem; min-height: 100vh; }
.shop-header { margin-bottom: 3rem; }
.shop-heading { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem,4vw,3rem); }
.shop-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 640px)  { .shop-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.shop-empty { text-align: center; padding: 4rem 0; color: var(--color-muted-fg); }

/* ── WooCommerce: Checkout ────────────────────────────────────────────────── */
body.woocommerce-checkout .site-main { padding-top: var(--header-height); padding-bottom: 4rem; }
body.woocommerce-checkout .entry-content { max-width: 100%; }
body.woocommerce-checkout .page-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem,4vw,2.5rem); margin-bottom: 2rem; padding: 2rem 1.5rem 0; }
@media (min-width: 1024px) { body.woocommerce-checkout .page-title { padding: 2rem 2.5rem 0; } }

body.woocommerce-checkout .wc-block-checkout { display: block; }
@media (min-width: 768px) {
  body.woocommerce-checkout .wc-block-components-sidebar-layout.wc-block-checkout.is-large {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: var(--checkout-gap);
    align-items: start;
  }
}
body.woocommerce-checkout .wc-block-checkout__main,
body.woocommerce-checkout .wc-block-checkout__sidebar { min-width: 0; width: 100%; max-width: none; }
body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select { width: 100% !important; max-width: none !important; }
body.woocommerce-checkout .wc-block-checkout__sidebar {
  background: var(--gradient-warm); border-radius: var(--card-radius); padding: 2rem;
}
body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select,
body.woocommerce-checkout .wc-block-components-textarea textarea {
  border: 1px solid var(--color-border) !important; border-radius: 0.5rem !important;
  background: var(--color-background) !important; color: var(--color-foreground) !important;
  font-family: var(--font-body) !important;
}
body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-select select:focus { border-color: var(--color-accent) !important; outline: none !important; }
body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
  background: var(--gradient-wine) !important; color: var(--color-primary-fg) !important;
  border-radius: var(--btn-radius) !important; border: none !important;
  font-family: var(--font-body) !important; font-size: var(--btn-font-size) !important;
  font-weight: var(--btn-font-weight) !important;
  text-transform: var(--btn-text-transform) !important;
  letter-spacing: var(--btn-letter-spacing) !important;
  padding: var(--btn-padding) !important; cursor: pointer !important; width: 100% !important;
}
body.woocommerce-checkout .wc-block-components-notice-banner { border-radius: 0.5rem; }

/* ── WooCommerce: Thank You ────────────────────────────────────────────────── */
body.theme-thankyou-page .woocommerce-order { padding: 2rem 0; }
body.theme-thankyou-page .woocommerce-order h2,
body.theme-thankyou-page .woocommerce-order-details__title { font-family: var(--font-display); font-weight: 700; padding: 0 0 1rem 0; }
body.theme-thankyou-page .woocommerce-order-overview { list-style: none; padding: 1.5rem; margin: 0 0 2rem; background: var(--gradient-warm); border-radius: var(--card-radius); display: flex; flex-wrap: wrap; gap: 1.5rem; }
body.theme-thankyou-page .woocommerce-order-overview li { font-size: 0.875rem; color: var(--color-muted-fg); }
body.theme-thankyou-page .woocommerce-order-overview li strong { display: block; font-family: var(--font-display); font-weight: 700; font-size: 1.125rem; color: var(--color-primary); }
body.theme-thankyou-page .woocommerce-customer-details { display: flex; flex-direction: column; gap: 1.5rem; margin-bottom: 2rem; }
body.theme-thankyou-page .woocommerce-customer-details address { max-width: 480px; overflow-wrap: break-word; }
body.theme-thankyou-page .woocommerce-order-details table { width: 100%; table-layout: fixed; border-collapse: collapse; }
body.theme-thankyou-page .woocommerce-order-details table th,
body.theme-thankyou-page .woocommerce-order-details table td { padding: 0.75rem; border-bottom: 1px solid var(--color-border); }
body.theme-thankyou-page .woocommerce-order-details tfoot th { text-align: left; }
body.theme-thankyou-page .woocommerce-order-details tfoot td { text-align: right; }
body.theme-thankyou-page { overflow-x: hidden; }

/* ── Page: Generic ────────────────────────────────────────────────────────── */
.site-main { min-height: 60vh; }
.page-content { padding-top: 7rem; padding-bottom: 5rem; }
.page-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem,4vw,3rem); margin-bottom: 2rem; }
.entry-content { font-size: 1rem; line-height: 1.7; color: var(--color-muted-fg); }
.entry-content h2,h3 { font-family: var(--font-display); color: var(--color-foreground); margin: 1.5rem 0 0.75rem; }
.entry-content p { margin: 0 0 1rem; }
.entry-content a { color: var(--color-accent); }
.entry-content a:hover { text-decoration: underline; }

/* ── Page: 404 ────────────────────────────────────────────────────────────── */
.page-404 {
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; padding: 2rem; background: var(--color-muted);
}
.page-404-number { font-family: var(--font-display); font-weight: 700; font-size: 8rem; color: var(--color-primary); line-height: 1; }
.page-404-title { font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; margin-top: 1rem; }
.page-404-sub { color: var(--color-muted-fg); margin-top: 0.5rem; font-weight: 300; }
.page-404-link { margin-top: 2rem; }

/* ── Animations ───────────────────────────────────────────────────────────── */
@keyframes mobile-nav-item-in {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fade-in {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes float-slow {
  0%,100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-12px) rotate(2deg); }
}
@keyframes hero-star-in {
  from { opacity: 0; transform: scale(0.5) rotate(-45deg); }
  to   { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes pulse-scale {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}

.animate-fade-in { animation: fade-in 0.7s cubic-bezier(0.22,1,0.36,1) forwards; }
.animate-float-slow { animation: float-slow 6s ease-in-out infinite; }
.animate-pulse-scale { animation: pulse-scale 2.4s ease-in-out infinite; }

/* Reveal animation for scroll */
.reveal { opacity: 0; transform: translateY(30px); filter: blur(8px); transition: opacity 0.9s cubic-bezier(0.22,1,0.36,1), transform 0.9s cubic-bezier(0.22,1,0.36,1), filter 0.9s cubic-bezier(0.22,1,0.36,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); filter: blur(0); }
.hero-text.is-parallax { will-change: transform; }
.hero-images.is-parallax { will-change: transform; }

/* ── WooCommerce Notices ──────────────────────────────────────────────────── */
.woocommerce-message,.woocommerce-info,.woocommerce-error {
  padding: 1rem 1.25rem; border-radius: 0.5rem; margin-bottom: 1rem; font-size: 0.875rem;
  display: flex; align-items: flex-start; gap: 0.75rem; flex-wrap: wrap;
}
.woocommerce-message { background: hsla(220,90%,96%,0.8); border: 1px solid var(--color-brand-blue); color: var(--color-foreground); }
.woocommerce-info    { background: hsla(220,90%,96%,0.8); border: 1px solid var(--color-brand-blue); color: var(--color-foreground); }
.woocommerce-error   { background: hsla(0,75%,96%,0.8);   border: 1px solid var(--color-destructive); color: var(--color-destructive); }
.woocommerce-message::before, .woocommerce-info::before { display: none; }
.single-product .woocommerce-message,
.single-product .woocommerce-info { display: none; }
#theme-cart-drawer .woocommerce-message { display: none; }

/* ── WooCommerce Breadcrumbs — hidden globally ────────────────────────────── */
.woocommerce-breadcrumb { display: none; }

/* ── Scrollbar hide utility ───────────────────────────────────────────────── */
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* ── Responsive / Misc ────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
  .cart-btn.desktop-only { display: none !important; }
}
/* Hero image stack — mobile/tablet (single column, matches Lovable below lg) */
@media (max-width: 1023px) {
  .hero-images {
    width: 100%;
    max-width: none;
    margin: 0;
    overflow: visible;
  }
  .hero-image-stack {
    width: 100%;
    overflow: visible;
    padding-bottom: 1.25rem; /* room for badge at -bottom-4 */
  }
  .hero-img-top { z-index: 1; }
  .hero-img-bottom { z-index: 2; }
  .hero-img-top img,
  .hero-img-bottom img {
    position: absolute;
    inset: 0;
    display: block;
  }
  .hero-badge { z-index: 10; }
}

/* overflow-x utility */
.overflow-x-hidden { overflow-x: hidden; }

/* Checkout: remove page-content extra padding (site-main handles it) */
body.woocommerce-checkout .page-content { padding-top: 0; }

/* Inner page: no hero-bg */
body.theme-no-hero .hero-section { display: none; }