:root{
  --cream:#FFFFFF;
  --blush:#FADCE8;
  --rose:#F4A7C1;
  --plum:#1A1A1A;
  --plum-soft:#4D4D4D;
  --gold:#C9A66B;
  --white:#FFFFFF;
  --radius:18px;
  --shadow: 0 10px 30px rgba(26,26,26,0.08);
}

*{box-sizing:border-box;margin:0;padding:0;}

html{overflow-x:hidden;}
body{
  font-family:'Poppins', sans-serif;
  background:var(--cream);
  color:var(--plum);
  font-weight:300;
  line-height:1.6;
  overflow-x:hidden;
  /* Belt-and-suspenders against any element that would otherwise stretch the
     page wider than the viewport (a long unbroken string, a stray fixed-width
     child, etc.) — without this, that extra width shifts what "centered"
     content looks like relative to the visible/scrolled viewport, reading as
     the whole page being off-balance rather than as a scrollbar appearing. */
  width:100%;
}

h1,h2,h3,.logo{
  font-family:'Fraunces', serif;
  font-weight:600;
  color:var(--plum);
}

a{color:inherit;text-decoration:none;}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px;}

/* Announcement bar: rotating promo messages above the header */
.announcement-bar{
  background:var(--rose);
  color:var(--white);
  text-align:center;
}
.announcement-inner{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:9px 24px;
}
.announcement-msg{
  font-size:0.82rem;font-weight:500;letter-spacing:0.2px;
  transition:opacity .2s ease;
}
.announcement-msg.is-fading{opacity:0;}
.announcement-arrow{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:22px;height:22px;border-radius:50%;
  border:none;background:none;color:var(--white);cursor:pointer;
  transition:background .2s,color .2s;
}
.announcement-arrow:hover{background:rgba(255,255,255,0.22);color:var(--white);}

/* Header */
.site-header{
  background:var(--white);
  border-bottom:1px solid rgba(26,26,26,0.08);
  position:sticky;top:0;z-index:50;
  transition:box-shadow .25s ease;
}
.site-header.scrolled{box-shadow:0 6px 24px rgba(199,127,157,0.14);}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:80px;
}
.logo{font-size:1.5rem;letter-spacing:0.5px;display:flex;align-items:center;height:100%;transition:transform .2s ease;}
.logo:hover{transform:scale(1.03);}
.logo span{color:var(--rose);margin:0 4px;font-style:italic;}
.logo-img{
  height:100px;
  width:auto;
  max-width:340px;
  object-fit:contain;
  display:block;
}
.main-nav{display:flex;align-items:center;gap:16px;flex-wrap:nowrap;white-space:nowrap;}
.main-nav a{position:relative;font-size:0.82rem;letter-spacing:0.2px;padding-bottom:3px;transition:color .2s;}
.main-nav a::after{
  content:'';position:absolute;left:0;bottom:0;width:100%;height:1.5px;
  background:var(--rose);transform:scaleX(0);transform-origin:left;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1);
}
.main-nav a:hover{color:var(--rose);}
.main-nav a:hover::after{transform:scaleX(1);}

.nav-dropdown{position:relative;}
.nav-dropdown summary{
  cursor:pointer;list-style:none;position:relative;
  display:inline-flex;align-items:center;gap:5px;
  font-size:0.82rem;letter-spacing:0.2px;padding-bottom:3px;
  white-space:nowrap;
  color:var(--rose);
  transition:color .2s;
}
.nav-dropdown summary::-webkit-details-marker{display:none;}
.nav-dropdown summary::marker{display:none;content:none;}
.nav-dropdown summary::after{
  content:'';position:absolute;left:0;bottom:0;width:100%;height:1.5px;
  background:var(--rose);transform:scaleX(0);transform-origin:left;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1);
}
.nav-dropdown summary:hover,
.nav-dropdown[open] summary{color:var(--rose);}
.nav-dropdown summary:hover::after,
.nav-dropdown[open] summary::after{transform:scaleX(1);}
.nav-dropdown-caret{transition:transform .2s;}
.nav-dropdown[open] .nav-dropdown-caret{transform:rotate(180deg);}
.nav-dropdown-menu{
  position:absolute;top:calc(100% + 14px);left:0;
  background:var(--white);border-radius:12px;box-shadow:var(--shadow);
  padding:10px;min-width:190px;z-index:60;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s,transform .18s,visibility .18s;
}
.nav-dropdown[open] .nav-dropdown-menu,
.nav-dropdown:hover .nav-dropdown-menu{
  opacity:1;visibility:visible;transform:translateY(0);
}
.nav-dropdown-menu a{
  display:block;font-size:0.85rem;color:var(--plum-soft);
  padding:9px 10px;border-radius:8px;
  transition:background .15s,color .15s;
}
.nav-dropdown-menu a::after{content:none;}
.nav-dropdown-menu a:hover{background:var(--cream);color:var(--plum);}

/* Between the mobile hamburger breakpoint (820px) and a full-width desktop
   layout, the nine nav items + logo + header icons no longer all fit on one
   row at the default size — shrink gap/font in two steps so everything
   still reads as one clean, evenly-spaced line instead of overflowing. */
@media (min-width:821px) and (max-width:1000px){
  .main-nav{gap:10px;}
  .main-nav a,.nav-dropdown summary{font-size:0.75rem;}
}
@media (min-width:821px) and (max-width:906px){
  .main-nav{gap:6px;}
  .main-nav a,.nav-dropdown summary{font-size:0.68rem;}
}

.header-actions{display:flex;align-items:center;gap:12px;}
.cart-link{
  display:flex;align-items:center;gap:8px;
  font-size:0.92rem;font-weight:500;
  border:1px solid var(--plum);
  padding:8px 16px;border-radius:999px;
  transition:background .2s,color .2s;
}
.cart-link:hover{background:var(--rose);color:var(--plum);}
.account-link{
  display:flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--plum);color:var(--plum);
  transition:background .2s,color .2s;
}
.account-link:hover{background:var(--rose);color:var(--plum);}
.account-menu{position:relative;}
.account-menu summary{cursor:pointer;list-style:none;}
.account-menu summary::-webkit-details-marker{display:none;}
.account-menu summary::marker{display:none;content:none;}
.account-menu[open] summary.account-link{background:var(--rose);color:var(--plum);}
.account-dropdown{
  position:absolute;top:calc(100% + 10px);right:0;
  background:var(--white);border-radius:12px;box-shadow:var(--shadow);
  padding:14px 18px;min-width:160px;z-index:60;
}
.account-dropdown .account-name{
  font-weight:500;color:var(--plum);margin-bottom:10px;font-size:0.9rem;
  padding-bottom:10px;border-bottom:1px solid rgba(26,26,26,0.1);
}
.account-dropdown a{display:block;font-size:0.85rem;color:var(--plum-soft);}
.account-dropdown a:hover{color:var(--plum);}
.wishlist-link{
  display:flex;align-items:center;gap:6px;
  color:var(--rose);
  border:1px solid var(--plum);
  width:38px;height:38px;border-radius:50%;
  justify-content:center;position:relative;
  transition:background .2s,color .2s;
}
.wishlist-link:hover{background:var(--rose);color:var(--plum);}
.wishlist-link:hover svg{color:var(--plum);}
.wishlist-link .cart-count{
  position:absolute;top:-6px;right:-6px;
}
.cart-count{
  background:var(--rose);color:var(--plum);
  font-size:0.75rem;min-width:20px;height:20px;
  border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  padding:0 4px;
}
.cart-icon{display:none;}
.cart-label{display:inline;}

/* Mobile header controls (hamburger / search) — hidden on desktop */
.nav-toggle{
  display:none;
  flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:38px;height:38px;padding:0;
  background:none;border:none;cursor:pointer;flex-shrink:0;
}
.nav-toggle span{
  display:block;width:22px;height:2px;border-radius:2px;
  background:var(--plum);transition:transform .2s,opacity .2s;
}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.search-toggle{
  display:none;
  align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--plum);color:var(--plum);
  background:none;cursor:pointer;transition:background .2s,color .2s;
}
.search-toggle:hover{background:var(--rose);color:var(--plum);}

.search-bar{
  display:none;
  border-top:1px solid rgba(26,26,26,0.08);
  background:var(--white);
}
.search-form{
  display:flex;align-items:center;gap:10px;padding:12px 24px;
}
.search-form input{
  flex:1;border:1px solid rgba(26,26,26,0.2);border-radius:999px;
  padding:10px 16px;font-family:'Poppins',sans-serif;font-size:0.9rem;
  background:var(--cream);color:var(--plum);
}
.search-form input:focus{outline:none;border-color:var(--rose);}
.search-form button{
  width:38px;height:38px;border-radius:50%;border:none;flex-shrink:0;
  background:var(--rose);color:var(--plum);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s,color .2s;
}
.search-form button:hover{background:var(--plum);color:var(--white);}

.mobile-only-links{display:none;}

/* Hero: full-width imagery with a tagline + Shop CTA overlaid on the main image.
   Desktop shows a static 2-3 panel grid (first panel wider, carries the CTA);
   mobile falls back to a single auto-playing slideshow with the same CTA. */
.hero-slider{
  position:relative;width:100%;
  height:100vh;height:100dvh;
  overflow:hidden;
  background:linear-gradient(180deg, var(--blush) 0%, var(--cream) 100%);
}
.hero-slider-single{position:absolute;inset:0;}
.hero-slide{
  position:absolute;inset:0;overflow:hidden;
  opacity:0;transition:opacity 1.2s ease;
}
.hero-slide.active{opacity:1;}
.hero-slide-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 75%;
}
.hero-slide-empty{
  display:flex;align-items:center;justify-content:center;text-align:center;padding:40px;
  background:linear-gradient(180deg, var(--blush) 0%, var(--cream) 100%);
}
.hero-slide-empty p{max-width:420px;color:var(--plum-soft);font-size:1rem;}
.hero-slide-empty code{background:rgba(26,26,26,0.06);padding:2px 8px;border-radius:6px;font-size:0.9em;}
.hero-slider-dots{
  position:absolute;left:50%;bottom:28px;transform:translateX(-50%);
  display:flex;gap:9px;z-index:2;
}
.hero-slider-dots .dot{
  width:8px;height:8px;padding:0;border:none;border-radius:50%;
  background:rgba(255,255,255,0.55);cursor:pointer;
  box-shadow:0 1px 4px rgba(26,26,26,0.2);
  transition:background .3s ease,transform .3s ease;
}
.hero-slider-dots .dot:hover{background:rgba(255,255,255,0.85);}
.hero-slider-dots .dot.active{background:var(--rose);transform:scale(1.4);}
.hero-slider-dots .dot:focus-visible{outline:2px solid var(--white);outline-offset:2px;}

/* Desktop multi-image grid (hidden by default; enabled at desktop widths below).
   First cell is wider and carries the tagline + Shop CTA, Rottique-style. */
.hero-grid{display:none;}
.hero-grid-cell{position:relative;height:100%;overflow:hidden;flex:1 1 0;}
.hero-grid-cell-main{flex:1.4 1 0;}
.hero-grid-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 75%;
  opacity:0;
  transition:opacity 1.6s ease, transform 1s ease;
}
.hero-grid-img.active{opacity:1;}
.hero-grid-cell-main .hero-grid-img{object-position:30% 75%;}
@media (hover:hover) and (pointer:fine){
  .hero-grid-cell:hover .hero-grid-img.active{transform:scale(1.06);}
}
@media (min-width:821px){
  .hero-slider.has-grid .hero-grid{
    position:absolute;inset:0;
    display:flex;
  }
  .hero-slider.has-grid .hero-slider-single{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .hero-grid-img{transition:opacity .3s ease;}
  .hero-grid-cell:hover .hero-grid-img.active{transform:none;}
}

/* Tagline + Shop button overlaid on the hero's main image */
.hero-cta-overlay{
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:22px;text-align:center;padding:24px;
  pointer-events:none;
}
.hero-cta-overlay .btn{pointer-events:auto;}
.hero-cta-tagline{
  font-family:'Fraunces',serif;font-weight:700;font-style:italic;
  color:var(--white);
  font-size:clamp(1.7rem, 3.2vw, 2.6rem);
  line-height:1.25;max-width:520px;
  text-shadow:0 4px 22px rgba(26,26,26,0.4), 0 1px 3px rgba(26,26,26,0.35);
}
.hero-cta-shop{padding:14px 46px;}
/* JS adds "cta-pre" right when the hero is about to become visible (on load,
   or once the welcome popup closes), then "cta-in" a frame later so the fade
   actually plays where the visitor can see it. No JS = elements stay visible. */
.hero-cta-tagline.cta-pre,.hero-cta-shop.cta-pre{
  opacity:0;transform:translateY(18px);
  transition:opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
}
.hero-cta-tagline.cta-pre{transition-delay:.15s;}
.hero-cta-shop.cta-pre{transition-delay:.4s;}
.hero-cta-tagline.cta-pre.cta-in,.hero-cta-shop.cta-pre.cta-in{opacity:1;transform:translateY(0);}
@media (min-width:821px){
  .hero-grid-cell-cta .hero-cta-overlay{
    align-items:flex-start;text-align:left;
    padding-left:56px;padding-right:56px;
  }
  .hero-grid-cell-cta .hero-cta-tagline{max-width:340px;}
}
@media (max-width:820px){
  .hero-slider-single .hero-cta-overlay{
    justify-content:flex-end;
    padding-bottom:16vh;
  }
}

/* Welcome popup: shown once per session, promotes the 10% off signup */
.welcome-modal{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:24px;}
.welcome-modal[hidden]{display:none;}
.welcome-modal-backdrop{
  position:absolute;inset:0;
  background:rgba(255,255,255,0.88);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
@media (max-width:820px){
  /* Full-screen backdrop-filter blur is one of the heaviest things a mobile GPU can be
     asked to do every frame — on weaker devices it starves the WebGL canvas (and other
     running animations) of frame budget badly enough that they visibly stall. The solid
     backdrop alone already reads fine without the blur, so cut it way down on small screens. */
  .welcome-modal-backdrop{
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
  }
}
.welcome-modal-panel{
  position:relative;z-index:1;width:min(88vw, 440px);
  opacity:0;transform:scale(.92) translateY(10px);
  transition:opacity .45s cubic-bezier(.22,1,.36,1), transform .45s cubic-bezier(.22,1,.36,1);
}
.promo-modal-panel{width:min(92vw, 760px);}
.welcome-modal.visible .welcome-modal-panel{opacity:1;transform:scale(1) translateY(0);}
.welcome-modal-close{
  position:absolute;top:-14px;right:-14px;z-index:2;
  width:36px;height:36px;border-radius:50%;border:none;
  background:var(--white);color:var(--plum);
  display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow);cursor:pointer;
  transition:transform .2s ease;
}
.welcome-modal-close:hover{transform:scale(1.08);}
.welcome-modal-close:focus-visible{outline:2px solid var(--rose);outline-offset:2px;}
body.modal-open{overflow:hidden;}
@media (prefers-reduced-motion: reduce){
  .welcome-modal-panel{transition:opacity .3s ease;}
}

.promo-card{
  background:var(--white);border-radius:24px;
  padding:32px 32px 36px;text-align:center;
  box-shadow:0 20px 60px rgba(199,127,157,0.35);
}
.promo-card-split{
  padding:0;text-align:left;
  display:flex;flex-direction:column;
  /* Scrolls internally (not the panel it sits in) so a short viewport can
     still see all the content without clipping the close button, which is
     deliberately positioned half outside this card's parent panel. Sized
     against the small/dynamic viewport (not plain vh) so mobile browsers'
     address bar can't make this taller than what's actually visible and
     push the close button off the top of the screen. */
  max-height:calc(100vh - 48px);max-height:calc(100svh - 48px);
  overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;-ms-overflow-style:none;
}
.promo-card-split::-webkit-scrollbar{display:none;}
@media (min-width:560px){
  .promo-card-split{flex-direction:row;}
}
.promo-visual-pane{
  flex:0 0 auto;
  background:linear-gradient(160deg, var(--blush) 0%, var(--rose) 100%);
  display:flex;align-items:center;justify-content:center;
  padding:32px;
}
@media (min-width:560px){
  .promo-visual-pane{flex:0 0 42%;}
}
.promo-text-pane{
  flex:1;
  padding:32px 34px 34px;
  display:flex;flex-direction:column;justify-content:center;
}
.hero-visual{
  aspect-ratio:1/1;
  position:relative;
}
#hero3d{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  cursor:grab;
  touch-action:none;
}
#hero3d.grabbing{cursor:grabbing;}
.promo-visual-pane .hero-visual{width:min(100%, 210px);}
.promo-card h2{
  font-family:'Fraunces',serif;font-weight:600;
  font-size:1.5rem;letter-spacing:0.4px;
  color:var(--plum);margin-bottom:12px;
}
.promo-card p{color:var(--plum-soft);font-size:0.95rem;line-height:1.5;margin-bottom:26px;}
.promo-form{display:flex;flex-direction:column;gap:12px;}
.promo-form input[type="email"]{
  padding:13px 18px;border-radius:999px;
  border:1.5px solid rgba(26,26,26,0.12);
  font-family:inherit;font-size:0.95rem;color:var(--plum);
  outline:none;transition:border-color .2s ease;
}
.promo-form input[type="email"]:focus{border-color:var(--rose);}
.promo-form .btn{border:none;cursor:pointer;width:100%;}
.promo-form .btn[disabled]{opacity:0.65;cursor:not-allowed;}
.promo-form-message{font-size:0.85rem;line-height:1.4;margin-top:2px;}
.promo-form-message.is-success{color:#2c6b3f;}
.promo-form-message.is-error{color:#a33;}
@media (max-width:559px){
  /* On mobile the split card stacks image-over-text (see the row/column breakpoint
     above), so both halves need to shrink or their combined height overwhelms the
     screen. Keep it compact enough that the page behind stays visible around it. */
  .promo-modal-panel{width:min(88vw, 380px);}
  /* Less overhang than the desktop -14px: on narrow screens the panel
     leaves little margin to the viewport edge, so pulling the close
     button in a bit keeps it safely clear of the edge on every device. */
  .welcome-modal-close{top:-10px;right:-10px;}
  .promo-visual-pane{padding:18px;}
  .promo-visual-pane .hero-visual{width:min(100%, 130px);}
  .promo-text-pane{padding:20px 22px 24px;}
  .promo-card h2{font-size:1.15rem;margin-bottom:8px;}
  .promo-card p{font-size:0.85rem;margin-bottom:14px;}
  .promo-form{gap:8px;}
  .promo-form input[type="email"]{padding:11px 16px;}
  .promo-form .btn{padding:12px 32px;}
}
.eyebrow{
  text-transform:uppercase;letter-spacing:3px;font-size:0.75rem;
  color:var(--gold);font-weight:500;margin-bottom:14px;
  display:inline-block;
  transition:opacity .4s ease, transform .4s ease;
}
.btn{
  display:inline-block;padding:14px 32px;border-radius:999px;
  font-size:0.95rem;font-weight:500;letter-spacing:0.3px;
  transition:transform .2s, box-shadow .2s;
}
.btn-primary{background:var(--rose);color:var(--plum);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.btn-outline{background:transparent;border:1.5px solid var(--plum);color:var(--plum);}
.btn-outline:hover{background:var(--rose);color:var(--plum);}

/* Scallop divider - signature ruffle element */
.scallop{
  height:36px;width:100%;
  background:
    radial-gradient(circle at 18px 0, transparent 17px, var(--cream) 18px) 0 -18px / 36px 36px repeat-x;
}
.scallop.flip{transform:scaleY(-1);}

/* Section headings */
.section{padding:64px 0;}
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:36px;flex-wrap:wrap;gap:16px;
}
.section-head h2{font-size:2rem;}
.section-head p{color:var(--plum-soft);max-width:420px;}

/* Category cards - image style, swipeable on mobile */
.categories{
  display:flex;gap:14px;margin-bottom:16px;
}
.category-card{
  position:relative;
  flex:1;
  height:220px;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease;
  display:flex;align-items:flex-end;
}
.category-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(26,26,26,0) 42%, rgba(26,26,26,0.58) 100%);
  opacity:0.85;transition:opacity .3s ease;
}
.category-card:hover{
  transform:translateY(-6px) scale(1.015);
  box-shadow:0 18px 36px rgba(199,127,157,0.3);
}
.category-card:hover::before{opacity:1;}
.category-card-label{
  position:relative;
  color:var(--white);
  font-family:'Fraunces', serif;
  font-weight:600;
  font-size:1.15rem;
  padding:20px;
  text-shadow:0 2px 8px rgba(0,0,0,0.25);
}
.categories-dots{
  display:none;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:14px;
}
.categories-dots .dot{
  width:7px;height:7px;border-radius:999px;
  background:rgba(26,26,26,0.2);
  transition:background .2s,width .3s ease;
}
.categories-dots .dot.active{
  width:20px;
  background:var(--rose);
}

@media (max-width:600px){
  .categories{
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding-bottom:4px;
  }
  .categories::-webkit-scrollbar{display:none;}
  .categories{scrollbar-width:none;}
  .category-card{
    flex:0 0 78%;
    scroll-snap-align:start;
    height:280px;
  }
  .categories-dots{display:flex;}

  .product-grid.bestsellers-scroll{
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding-bottom:4px;
    gap:16px;
  }
  .product-grid.bestsellers-scroll::-webkit-scrollbar{display:none;}
  .product-grid.bestsellers-scroll{scrollbar-width:none;}
  .product-grid.bestsellers-scroll .product-card{
    flex:0 0 78%;
    scroll-snap-align:start;
  }

  /* Two-column product grid on mobile (Shop, Wishlist, Rewards) */
  .product-grid:not(.bestsellers-scroll){
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }
  .product-grid:not(.bestsellers-scroll) .wishlist-btn{width:28px;height:28px;font-size:0.85rem;}
  .product-grid:not(.bestsellers-scroll) .swatch-row{padding:10px 12px 0;gap:5px;}
  .product-grid:not(.bestsellers-scroll) .swatch{width:14px;height:14px;}
  .product-grid:not(.bestsellers-scroll) .product-card-body{padding:12px 12px 16px;}
  .product-grid:not(.bestsellers-scroll) .product-cat{font-size:0.6rem;letter-spacing:1px;margin-bottom:4px;}
  .product-grid:not(.bestsellers-scroll) .product-card h3{font-size:0.85rem;margin-bottom:4px;line-height:1.3;}
  .product-grid:not(.bestsellers-scroll) .product-card p{
    font-size:0.74rem;margin-bottom:8px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .product-grid:not(.bestsellers-scroll) .product-price{font-size:0.86rem;margin-bottom:8px;}
  .product-grid:not(.bestsellers-scroll) .btn-small{padding:8px;font-size:0.74rem;}
}

/* Product grid */
.product-grid{
  display:grid;grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
  gap:28px;
}
.product-card{
  background:var(--white);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);
  transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
  display:flex;flex-direction:column;
}
.product-card:hover{transform:translateY(-6px);box-shadow:0 18px 34px rgba(199,127,157,0.24);}
.product-thumb{
  aspect-ratio:1/1;
  display:flex;align-items:center;justify-content:center;
  position:relative;
  overflow:hidden;
}
.product-thumb{transition:transform .4s cubic-bezier(.22,1,.36,1);}
.product-card:hover .product-thumb{transform:scale(1.05);}
.product-thumb-wrap{position:relative;}
.swatch-row{
  display:flex;flex-wrap:wrap;gap:7px;
  padding:12px 20px 0;
}
.swatch{
  width:18px;height:18px;border-radius:50%;
  border:none;padding:0;cursor:pointer;
  box-shadow:0 0 0 1px rgba(26,26,26,0.15) inset, 0 1px 3px rgba(26,26,26,0.12);
  outline-offset:2px;
  transition:transform .15s, box-shadow .15s;
}
.swatch:hover{transform:scale(1.12);}
.swatch.active{
  box-shadow:0 0 0 1px rgba(26,26,26,0.15) inset, 0 0 0 2px var(--white), 0 0 0 3.5px var(--rose);
}
.swatch.sold-out{
  opacity:0.35;cursor:not-allowed;
  background-image:linear-gradient(45deg, transparent 46%, rgba(26,26,26,0.5) 48%, rgba(26,26,26,0.5) 52%, transparent 54%);
}
.swatch.sold-out:hover{transform:none;}
.wishlist-form{position:absolute;top:10px;right:10px;z-index:2;}
.wishlist-btn{
  width:34px;height:34px;border-radius:50%;border:none;
  background:rgba(255,255,255,0.85);color:var(--plum-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;cursor:pointer;box-shadow:0 2px 8px rgba(26,26,26,0.15);
  transition:transform .15s, color .15s, background .15s;
}
.wishlist-btn:hover{transform:scale(1.1);}
.wishlist-btn.active{background:var(--white);color:var(--rose);}
.product-card-body{padding:18px 20px 22px;flex:1;display:flex;flex-direction:column;}
.product-cat{font-size:0.72rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--gold);margin-bottom:6px;}
.product-card h3{font-size:1.02rem;margin-bottom:6px;}
.product-card p{font-size:0.88rem;color:var(--plum-soft);flex:1;margin-bottom:14px;}
.product-price{font-weight:500;font-size:1.05rem;margin-bottom:14px;}
.product-card form{margin-top:auto;}
.btn-small{
  width:100%;padding:10px;border-radius:999px;
  background:var(--rose);color:var(--plum);border:none;
  font-family:'Poppins',sans-serif;font-size:0.85rem;font-weight:500;
  cursor:pointer;transition:background .2s;
}
.btn-small:hover{background:var(--plum);color:var(--white);}
.btn-small:disabled,
.btn-primary:disabled{
  background:rgba(26,26,26,0.15);color:rgba(26,26,26,0.4);
  cursor:not-allowed;
}
.btn-small:disabled:hover,
.btn-primary:disabled:hover{
  background:rgba(26,26,26,0.15);color:rgba(26,26,26,0.4);
  transform:none;box-shadow:none;
}

.out-of-stock-badge{
  position:absolute;top:10px;left:10px;z-index:2;
  background:rgba(26,26,26,0.82);color:var(--white);
  font-size:0.68rem;font-weight:600;letter-spacing:0.4px;
  text-transform:uppercase;
  padding:5px 10px;border-radius:999px;
}

/* Testimonials — a single elegant SVG heart at a time, auto-rotating carousel */
.testimonials-section{background:var(--cream);overflow:hidden;}
.testimonials-section .section-head{
  flex-direction:column;align-items:center;text-align:center;margin-bottom:44px;
}
.testimonials-section .section-head p{max-width:460px;}

.testimonial-carousel{
  position:relative;
  display:flex;flex-direction:column;align-items:center;gap:24px;
}

/* Decorative floating sparkles behind the heart — purely ambient, non-interactive */
.testimonial-sparkles{position:absolute;inset:0;pointer-events:none;z-index:0;}
.testimonial-sparkles .spark{
  position:absolute;color:var(--rose);opacity:0.3;
  animation:sparkFloat 5.4s ease-in-out infinite;
}
.spark.s1{top:4%;left:10%;font-size:1.1rem;animation-delay:0s;}
.spark.s2{top:12%;right:8%;font-size:1.5rem;color:var(--gold);animation-delay:.7s;}
.spark.s3{bottom:20%;left:2%;font-size:1.2rem;animation-delay:1.4s;}
.spark.s4{bottom:6%;right:4%;font-size:1rem;color:var(--gold);animation-delay:2.1s;}
.spark.s5{top:48%;left:-1%;font-size:0.9rem;animation-delay:2.8s;}
@keyframes sparkFloat{
  0%,100%{transform:translateY(0) scale(1);opacity:.22;}
  50%{transform:translateY(-14px) scale(1.18);opacity:.55;}
}

.testimonial-stage-row{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:center;
  width:100%;
}
.testimonial-heart-stage{
  position:relative;
  width:min(82vw,340px);
  aspect-ratio:1/1;
  perspective:1600px;
}
.testimonial-heart-stage::before{
  content:'';position:absolute;inset:6%;
  background:radial-gradient(circle, rgba(244,167,193,0.4), transparent 70%);
  filter:blur(22px);
  z-index:-1;
}
.testimonial-heart-slide{
  position:absolute;inset:0;
  transform-style:preserve-3d;
  backface-visibility:hidden;
  opacity:0;
  transform:rotateY(-120deg) scale(0.25);
  transition:transform .8s cubic-bezier(.34,1.56,.64,1),opacity .4s ease;
  pointer-events:none;
}
.testimonial-heart-slide.active{
  opacity:1;transform:rotateY(0) scale(1);
  pointer-events:auto;z-index:2;
}
.testimonial-heart-slide.leaving{
  opacity:0;transform:rotateY(120deg) scale(0.25);
  z-index:1;
}
/* Reverse direction (Previous) flips the opposite way for spatial continuity */
.testimonial-carousel.reverse .testimonial-heart-slide{
  transform:rotateY(120deg) scale(0.25);
}
.testimonial-carousel.reverse .testimonial-heart-slide.leaving{
  transform:rotateY(-120deg) scale(0.25);
}
/* Inner wrapper carries its own "heartbeat" pulse independently of the
   parent's flip-in/out transform, so the shape+text scale together without
   fighting the entrance animation. */
.testimonial-heart-inner{position:absolute;inset:0;}
.testimonial-heart-slide.active .testimonial-heart-inner{
  animation:heartbeatPulse 1.7s ease-in-out .8s infinite;
}
@keyframes heartbeatPulse{
  0%,45%,100%{transform:scale(1);}
  12%{transform:scale(1.16);}
  24%{transform:scale(1);}
  34%{transform:scale(1.11);}
}
.testimonial-heart-svg{
  position:absolute;inset:0;width:100%;height:100%;
  filter:drop-shadow(0 22px 34px rgba(199,127,157,0.35));
}
.testimonial-heart-text{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  padding:27% 26% 28%;
  clip-path:url(#testimonialHeartTextClip);
}

/* Prev/Next controls — required alongside autoplay for accessible carousels */
.testimonial-nav-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--white);color:var(--rose);
  border:1px solid rgba(244,167,193,0.4);
  box-shadow:0 8px 20px rgba(199,127,157,0.22);
  cursor:pointer;z-index:2;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease,background .25s ease,color .25s ease;
}
.testimonial-nav-btn svg{width:18px;height:18px;display:block;}
.testimonial-nav-btn:hover{
  background:var(--rose);color:var(--white);
  transform:translateY(-50%) scale(1.08);
  box-shadow:0 10px 24px rgba(199,127,157,0.34);
}
.testimonial-nav-btn:active{transform:translateY(-50%) scale(0.96);}
.testimonial-nav-btn:focus-visible{outline:2px solid var(--rose);outline-offset:3px;}
.testimonial-nav-btn.prev{left:-6px;}
.testimonial-nav-btn.next{right:-6px;}
@media (min-width:640px){
  .testimonial-nav-btn.prev{left:-20px;}
  .testimonial-nav-btn.next{right:-20px;}
}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease;}
.reveal.reveal-visible{opacity:1;transform:translateY(0);}
.category-card.reveal,.product-card.reveal{transition-delay:calc(var(--i, 0) * 70ms);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

@keyframes iconPulse{
  0%{transform:scale(1);}
  35%{transform:scale(1.32);}
  60%{transform:scale(0.92);}
  100%{transform:scale(1);}
}
.icon-pulse{animation:iconPulse .55s ease;}
@media (prefers-reduced-motion: reduce){
  .icon-pulse{animation:none;}
}
.testimonial-stars{display:flex;gap:3px;color:var(--gold);margin-bottom:8px;flex-shrink:0;}
.testimonial-stars svg{display:block;}
.testimonial-stars .star-empty{color:rgba(26,26,26,0.15);}
.testimonial-text{
  color:var(--plum-soft);font-size:0.76rem;line-height:1.42;
  margin-bottom:12px;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}
.quote-mark{font-family:'Fraunces',serif;font-style:italic;font-weight:600;color:var(--rose);}
.testimonial-person{display:flex;flex-direction:column;align-items:center;gap:6px;}
.testimonial-avatar{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg, var(--white), var(--blush));
  color:var(--rose);border:1.5px solid rgba(244,167,193,0.55);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-weight:600;font-size:0.66rem;
  box-shadow:0 2px 6px rgba(26,26,26,0.1);
}
.testimonial-name{font-weight:500;color:var(--plum);font-size:0.74rem;letter-spacing:0.2px;}

.testimonial-controls{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:center;gap:16px;
}
.testimonials-dots{display:flex;justify-content:center;align-items:center;gap:8px;}
.testimonials-dots .dot{
  position:relative;width:8px;height:8px;border-radius:999px;
  border:none;padding:0;cursor:pointer;overflow:hidden;
  background:rgba(26,26,26,0.15);
  transition:width .3s ease,background .3s ease;
}
.testimonials-dots .dot:hover{background:rgba(244,167,193,0.55);}
.testimonials-dots .dot:focus-visible{outline:2px solid var(--rose);outline-offset:3px;}
.testimonials-dots .dot.active{width:26px;background:rgba(244,167,193,0.3);}
.dot-fill{
  position:absolute;inset:0;background:var(--rose);border-radius:999px;
  transform:scaleX(0);transform-origin:left center;
}
.dot-fill.filling{animation:dotFill 4.2s linear forwards;}
@keyframes dotFill{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.testimonial-carousel.paused .dot-fill.filling{animation-play-state:paused;}

.testimonial-playpause{
  width:32px;height:32px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--white);border:1px solid rgba(26,26,26,0.12);color:var(--plum-soft);
  cursor:pointer;
  transition:transform .2s ease,color .2s ease,border-color .2s ease;
}
.testimonial-playpause svg{width:11px;height:11px;display:block;}
.testimonial-playpause:hover{color:var(--rose);border-color:var(--rose);transform:scale(1.1);}
.testimonial-playpause:focus-visible{outline:2px solid var(--rose);outline-offset:3px;}
.testimonial-playpause .icon-play{display:none;}
.testimonial-playpause.is-paused .icon-pause{display:none;}
.testimonial-playpause.is-paused .icon-play{display:block;}

@media (min-width:900px){
  .testimonial-heart-stage{width:min(27vw,390px);}
}

@media (prefers-reduced-motion: reduce){
  .testimonial-heart-slide{transition:none;transform:none !important;}
  .testimonial-heart-slide.leaving{display:none;}
  .testimonial-heart-slide.active .testimonial-heart-inner{animation:none;}
  .testimonial-sparkles .spark{animation:none;opacity:0.18;}
  .dot-fill.filling{animation:none;}
  .testimonial-nav-btn,.testimonial-playpause{transition:none;}
}

/* Rewards page */
.points-banner{
  display:flex;justify-content:space-between;align-items:center;
  background:linear-gradient(135deg, var(--rose), var(--blush));
  color:var(--plum);border-radius:var(--radius);
  padding:26px 30px;box-shadow:var(--shadow);margin-bottom:28px;
}
.points-banner-label{font-size:0.85rem;letter-spacing:0.5px;color:rgba(26,26,26,0.65);}
.points-banner-value{font-family:'Fraunces',serif;font-weight:600;font-size:1.8rem;}
.reward-flash{
  background:var(--blush);color:var(--plum);border-radius:12px;
  padding:14px 18px;font-size:0.9rem;margin-bottom:24px;
}
.reward-points{color:var(--plum);}
.reward-card .btn-small:disabled{
  background:rgba(26,26,26,0.2);color:rgba(26,26,26,0.5);
  cursor:not-allowed;
}
.reward-card .btn-small:disabled:hover{background:rgba(26,26,26,0.2);}

.order-history-list{display:flex;flex-direction:column;gap:18px;}
.order-history-card{
  background:var(--white);border-radius:var(--radius);
  padding:24px 26px;box-shadow:var(--shadow);
}
.order-history-top{
  display:flex;justify-content:space-between;align-items:flex-start;
  margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(26,26,26,0.08);
}
.order-history-ref{font-weight:500;color:var(--plum);}
.order-history-date{font-size:0.82rem;color:var(--plum-soft);margin-top:2px;}
.order-status-badge{
  font-size:0.78rem;font-weight:500;padding:5px 14px;border-radius:999px;flex-shrink:0;
}
.order-status-badge.is-delivered{background:var(--blush);color:var(--plum);}
.order-status-badge.is-pending{background:rgba(26,26,26,0.06);color:var(--plum-soft);}
.order-history-items{margin-bottom:10px;}
.order-history-items .item-row{display:flex;justify-content:space-between;font-size:0.88rem;margin-bottom:6px;color:var(--plum-soft);}
.order-history-total{
  display:flex;justify-content:space-between;font-weight:500;font-size:0.95rem;
  padding-top:12px;border-top:1px solid rgba(26,26,26,0.08);
}

/* FAQ accordion */
.faq-list{display:flex;flex-direction:column;gap:12px;}
.faq-item{
  background:var(--white);border-radius:14px;
  padding:18px 22px;box-shadow:var(--shadow);
}
.faq-item summary{
  cursor:pointer;list-style:none;font-weight:500;color:var(--plum);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:'+';font-size:1.3rem;color:var(--rose);flex-shrink:0;transition:transform .2s;
}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{color:var(--plum-soft);margin-top:14px;font-size:0.92rem;}

/* Filter bar */
.shop-controls{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;
  gap:16px 24px;margin-bottom:32px;
}
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:0;}
.filter-pill{
  padding:8px 18px;border-radius:999px;border:1px solid var(--plum);
  font-size:0.85rem;transition:.2s;
}
.filter-pill.active,.filter-pill:hover{background:var(--rose);color:var(--plum);}

.shop-toolbar{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:flex-end;}
.price-filter,.sort-filter,.category-filter{display:flex;flex-direction:column;gap:6px;}
.price-filter label,.sort-filter label,.category-filter label{
  font-size:0.72rem;text-transform:uppercase;letter-spacing:1px;color:var(--plum-soft);
}
.price-filter-inputs{display:flex;align-items:center;gap:8px;}
.price-filter-inputs input[type=number]{
  width:78px;padding:9px 10px;border-radius:10px;border:1px solid rgba(26,26,26,0.2);
  font-family:'Poppins',sans-serif;font-size:0.85rem;background:var(--white);color:var(--plum);
}
.price-filter-inputs input[type=number]:focus{border-color:var(--rose);outline:none;}
.price-filter-inputs input[type=number]::-webkit-outer-spin-button,
.price-filter-inputs input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.price-filter-inputs span{color:var(--plum-soft);font-size:0.85rem;}
.price-apply-btn{
  padding:9px 18px;border-radius:999px;background:var(--rose);color:var(--plum);border:none;
  font-family:'Poppins',sans-serif;font-size:0.82rem;font-weight:500;cursor:pointer;
  white-space:nowrap;transition:background .2s;
}
.price-apply-btn:hover{background:var(--plum);color:var(--white);}
.sort-filter select,.category-filter select{
  padding:9px 14px;border-radius:10px;border:1px solid rgba(26,26,26,0.2);
  font-family:'Poppins',sans-serif;font-size:0.85rem;background:var(--white);color:var(--plum);
  cursor:pointer;transition:border-color .2s,background .2s,color .2s;
}
.sort-filter select:focus,.category-filter select:focus{border-color:var(--rose);outline:none;}
/* Filled-in pink state once a real category is chosen (vs. the "All" default) —
   the same highlight language as the desktop pills' .active state. */
.category-filter select.is-active{
  border-color:var(--rose);background:var(--blush);color:var(--plum);font-weight:500;
}
.clear-filters-link{
  font-size:0.82rem;color:var(--plum-soft);text-decoration:underline;
  align-self:flex-end;padding-bottom:9px;
}
.clear-filters-link:hover{color:var(--rose);}

/* Mobile category select is hidden on desktop — the pill row above is what
   shows there instead. */
.mobile-category-select{display:none;}

@media (max-width:640px){
  .shop-controls{align-items:flex-start;}
  .shop-toolbar{width:100%;}
  .price-filter,.sort-filter,.category-filter{flex:1 1 auto;}
  .sort-filter select{width:100%;}

  /* Swap the desktop pill row for a single compact dropdown — a row of
     pills for a long category list wraps onto multiple lines and eats
     vertical space on a small screen; one select does the same job in
     one line. */
  .filter-bar{display:none;}
  .mobile-category-select{display:flex;width:100%;order:-1;}
  .mobile-category-select select{width:100%;padding:12px 14px;font-size:0.9rem;}
}

/* Product detail */
.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:flex-start;}
.detail-visual-wrap{position:relative;}
.detail-visual{aspect-ratio:1/1;border-radius:24px;box-shadow:var(--shadow);position:relative;}
.detail-visual-wrap .wishlist-btn{width:44px;height:44px;font-size:1.2rem;}
.gallery-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:38px;height:38px;border-radius:50%;border:none;
  background:rgba(255,255,255,0.85);color:var(--plum-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(26,26,26,0.15);
  transition:transform .15s, background .15s, color .15s;
}
.gallery-arrow:hover{background:var(--white);color:var(--rose);transform:translateY(-50%) scale(1.08);}
.gallery-arrow-prev{left:10px;}
.gallery-arrow-next{right:10px;}
.gallery-thumb-strip{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;}
.gallery-thumb{
  width:60px;height:60px;border-radius:10px;border:2px solid transparent;padding:0;
  background-size:cover;background-position:center;cursor:pointer;
  transition:border-color .15s, transform .15s;
}
.gallery-thumb:hover{transform:scale(1.05);}
.gallery-thumb.active{border-color:var(--rose);}
.detail-info .product-cat{margin-bottom:10px;}
.detail-info h1{font-size:2.2rem;margin-bottom:12px;}
.detail-price{font-size:1.4rem;color:var(--plum);font-weight:500;margin-bottom:20px;}
.detail-info .desc-accordion{max-width:480px;margin-bottom:28px;border-top:1px solid rgba(26,26,26,0.1);border-bottom:1px solid rgba(26,26,26,0.1);}
.detail-info .desc-accordion summary{
  cursor:pointer;list-style:none;font-weight:500;color:var(--plum);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 0;
}
.detail-info .desc-accordion summary::-webkit-details-marker{display:none;}
.detail-info .desc-accordion summary::after{
  content:'+';font-size:1.2rem;color:var(--rose);flex-shrink:0;transition:transform .2s;
}
.detail-info .desc-accordion[open] summary::after{transform:rotate(45deg);}
.detail-info .desc-accordion p.desc{color:var(--plum-soft);margin:0 0 18px;}
.detail-info .swatch-row{padding:0;margin-bottom:20px;}
.detail-info .swatch{width:26px;height:26px;}
.qty-row{display:flex;align-items:center;gap:16px;margin-bottom:24px;}
.qty-row input{
  width:70px;padding:10px;border-radius:10px;border:1px solid rgba(26,26,26,0.2);
  font-family:'Poppins',sans-serif;text-align:center;
}
.qty-stepper{display:flex;align-items:stretch;border:1px solid rgba(26,26,26,0.2);border-radius:10px;overflow:hidden;}
.qty-stepper input{width:52px;border:none;border-radius:0;}
.qty-stepper input::-webkit-outer-spin-button,.qty-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.qty-stepper input{-moz-appearance:textfield;}
.qty-btn{
  width:38px;border:none;background:transparent;color:var(--plum-soft);
  font-size:1.15rem;line-height:1;cursor:pointer;transition:background .15s, color .15s;
}
.qty-btn:hover:not(:disabled){background:rgba(244,167,193,0.18);color:var(--rose);}
.qty-btn:disabled{opacity:0.35;cursor:not-allowed;}
.back-link{display:inline-block;margin-bottom:24px;font-size:0.88rem;color:var(--plum-soft);}
.back-link:hover{color:var(--rose);}

/* Cart page */
.cart-table{width:100%;border-collapse:collapse;margin-bottom:32px;}
.cart-table th{
  text-align:left;font-size:0.78rem;text-transform:uppercase;letter-spacing:1px;
  color:var(--plum-soft);padding-bottom:12px;border-bottom:1px solid rgba(26,26,26,0.12);
}
.cart-table td{padding:18px 0;border-bottom:1px solid rgba(26,26,26,0.08);vertical-align:middle;}
.cart-product{display:flex;align-items:center;gap:16px;}
.cart-product-info{min-width:0;}
.cart-product-info div{overflow-wrap:break-word;}
.cart-thumb{width:64px;height:64px;border-radius:12px;flex-shrink:0;}
.cart-table input[type=number]{
  width:60px;padding:6px;border-radius:8px;border:1px solid rgba(26,26,26,0.2);
  text-align:center;font-family:'Poppins',sans-serif;
}
.qty-form{display:flex;gap:8px;align-items:center;}
.cart-table button.link-btn{
  background:none;border:none;color:var(--plum-soft);cursor:pointer;
  font-family:'Poppins',sans-serif;font-size:0.85rem;text-decoration:underline;
}
.cart-summary{
  max-width:360px;margin-left:auto;background:var(--white);
  border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);
}
.cart-summary .row{display:flex;justify-content:space-between;margin-bottom:12px;font-size:0.92rem;}
.cart-summary .row.total{font-weight:500;font-size:1.15rem;border-top:1px solid rgba(26,26,26,0.1);padding-top:14px;margin-top:14px;}
.empty-state{text-align:center;padding:60px 0;color:var(--plum-soft);}

/* Checkout */
/* minmax(0,...) rather than a bare fr: a grid container being sized inside
   another fr track has its OWN fr tracks treated as auto again for that
   outer min-content measurement, so content (long names/email/address) can
   still bubble up and force this wider than the viewport without it. */
.checkout-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px;align-items:flex-start;}
.form-group{margin-bottom:18px;}
.form-group label{display:block;font-size:0.85rem;margin-bottom:6px;color:var(--plum-soft);}
.form-group input,.form-group textarea,.form-group select{
  width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(26,26,26,0.2);
  font-family:'Poppins',sans-serif;font-size:0.92rem;background:var(--white);
}
/* A bare `1fr` track's min sizing function is `auto`, which still lets a
   filled-in <input>'s content nudge the track's base/growth size past the
   even 1fr split — minmax(0,1fr) pins the track's minimum to a definite 0
   so it can't grow past its fair share, and min-width:0 on the item stops
   the same content-based auto-minimum from applying at the item level too.
   Together these are what let the row actually shrink to fit a narrow phone
   instead of forcing it (and the page) wider than the viewport. */
.form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;}
.form-row .form-group{min-width:0;}
.form-group input.invalid{border-color:#a33;}
.field-error{display:block;color:#a33;font-size:0.78rem;margin-top:6px;line-height:1.4;}
.form-group input:disabled{background:rgba(26,26,26,0.04);color:var(--plum-soft);cursor:not-allowed;}
.order-summary{
  background:var(--white);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);
}
.order-summary .item-row{display:flex;justify-content:space-between;font-size:0.88rem;margin-bottom:10px;color:var(--plum-soft);}
.coupon-form{display:flex;gap:8px;margin:18px 0 6px;}
.coupon-form input{
  flex:1;min-width:0;padding:10px 14px;border-radius:999px;border:1.5px solid rgba(26,26,26,0.12);
  font-family:'Poppins',sans-serif;font-size:0.88rem;color:var(--plum);outline:none;transition:border-color .2s ease;
}
.coupon-form input:focus{border-color:var(--rose);}
.coupon-form input:disabled{background:rgba(26,26,26,0.04);color:var(--plum-soft);}
.coupon-form button{
  white-space:nowrap;border:none;border-radius:999px;padding:0 18px;
  background:var(--plum);color:var(--white);font-size:0.82rem;font-weight:500;cursor:pointer;
}
.coupon-form button:disabled{opacity:0.6;cursor:not-allowed;}
.coupon-message{font-size:0.8rem;line-height:1.4;margin:0 0 16px;}
.coupon-message.is-success{color:#2c6b3f;}
.coupon-message.is-error{color:#a33;}
.confirmation{
  max-width:640px;margin:0 auto;padding:70px 20px 60px;text-align:center;
}
.confirmation h1{margin-bottom:10px;font-size:1.7rem;}
.confirmation p{color:var(--plum-soft);}
.confirmation .confirmation-check{
  width:72px;height:72px;margin:0 auto 22px;border-radius:50%;
  background:var(--blush);display:flex;align-items:center;justify-content:center;
}
.confirmation .confirmation-check svg{width:34px;height:34px;}
.confirmation .confirmation-sub{margin-bottom:22px;}
.confirmation .order-ref-pill{
  display:inline-block;background:var(--blush);color:var(--plum);
  font-weight:600;letter-spacing:0.3px;padding:10px 24px;border-radius:999px;
  margin-bottom:36px;font-size:0.95rem;
}
.confirmation .confirmation-card{
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:26px;text-align:left;margin-bottom:28px;
}
.confirmation .confirmation-items{margin-bottom:18px;}
.confirmation .confirmation-item{
  display:flex;align-items:center;gap:14px;padding:12px 0;
  border-bottom:1px solid rgba(26,26,26,0.06);
}
.confirmation .confirmation-item:last-child{border-bottom:none;}
.confirmation .confirmation-item-thumb{
  width:56px;height:56px;border-radius:12px;flex-shrink:0;
  background-size:cover;background-position:center;
}
.confirmation .confirmation-item-info{flex:1;min-width:0;}
.confirmation .confirmation-item-name{font-size:0.92rem;color:var(--plum);}
.confirmation .confirmation-item-variant{font-size:0.8rem;margin-top:2px;}
.confirmation .confirmation-item-qty{font-size:0.8rem;margin-top:2px;}
.confirmation .confirmation-item-subtotal{font-size:0.92rem;font-weight:500;white-space:nowrap;color:var(--plum);}
.confirmation .confirmation-totals{border-top:1px solid rgba(26,26,26,0.08);padding-top:16px;}
.confirmation .confirmation-totals .item-row{display:flex;justify-content:space-between;font-size:0.9rem;margin-bottom:10px;}
.confirmation .confirmation-totals .item-row.discount{color:#2c6b3f;}
.confirmation .confirmation-totals .row.total{
  display:flex;justify-content:space-between;font-weight:600;font-size:1.1rem;color:var(--plum);
  border-top:1px solid rgba(26,26,26,0.1);padding-top:12px;margin-top:4px;
}
.confirmation .confirmation-details{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;text-align:left;margin-bottom:36px;
}
.confirmation .confirmation-detail-card{
  background:var(--white);border-radius:14px;box-shadow:var(--shadow);padding:20px;
}
.confirmation .confirmation-detail-card h4{
  font-size:0.78rem;text-transform:uppercase;letter-spacing:0.6px;color:var(--gold);margin-bottom:10px;
}
.confirmation .confirmation-detail-card p{font-size:0.88rem;line-height:1.6;margin:0;}
@media (max-width:600px){
  .confirmation{padding:50px 16px 40px;}
  .confirmation .confirmation-details{grid-template-columns:1fr;}
}

/* Newsletter */
.newsletter-form{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;}
.newsletter-form input{
  padding:13px 18px;border-radius:999px;border:1.5px solid transparent;
  flex:1 1 280px;max-width:100%;min-width:0;
  font-family:'Poppins',sans-serif;
  transition:border-color .2s ease;
}
.newsletter-form input:focus{outline:none;border-color:var(--plum);}
.newsletter-form button{
  padding:13px 28px;border-radius:999px;border:none;background:var(--gold);color:var(--plum);
  font-family:'Poppins',sans-serif;font-weight:500;cursor:pointer;
  transition:background .2s;
}
.newsletter-form button:hover{background:var(--plum);color:var(--white);}

/* Footer */
.site-footer{
  background:var(--blush);
  margin-top:28px;
}

.footer-newsletter{
  background:var(--rose);
  padding:28px 0;
}
.footer-newsletter-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;
}
.footer-newsletter-text .eyebrow{color:rgba(26,26,26,0.55);margin-bottom:8px;}
.footer-newsletter-text h2{font-size:1.4rem;color:var(--plum);margin-bottom:6px;}
.footer-newsletter-text p{font-size:0.9rem;color:rgba(26,26,26,0.7);}
.footer-newsletter .newsletter-form{justify-content:flex-start;}
.footer-newsletter .newsletter-form .promo-form-message{width:100%;text-align:left;}

.footer-main{
  display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:32px;
  padding:32px 0 20px;
}
.footer-heading{
  font-family:'Poppins',sans-serif;font-size:0.85rem;font-weight:600;
  text-transform:uppercase;letter-spacing:1px;color:var(--plum);
  margin-bottom:12px;
}
.footer-logo{display:inline-flex;margin-bottom:8px;}
.footer-logo-img{height:44px;width:auto;max-width:220px;object-fit:contain;display:block;}
.footer-tagline{font-size:0.88rem;color:var(--plum-soft);max-width:260px;margin-bottom:14px;}
.footer-social{display:flex;gap:12px;}
.social-link{
  width:38px;height:38px;border-radius:50%;
  background:var(--white);color:var(--plum);
  display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow);
  transition:background .2s,color .2s,transform .2s;
}
.social-link:hover{background:var(--plum);color:var(--white);transform:translateY(-2px);}

.footer-links{display:flex;flex-direction:column;gap:10px;}
.footer-links a{font-size:0.9rem;color:var(--plum-soft);transition:color .2s;}
.footer-links a:hover{color:var(--plum);}

.trust-badges{display:flex;flex-direction:column;gap:10px;margin-bottom:12px;}
.trust-badge{display:flex;align-items:center;gap:10px;font-size:0.88rem;color:var(--plum-soft);}
.trust-badge svg{flex-shrink:0;color:var(--gold);}
.payment-badges{display:flex;flex-wrap:wrap;gap:8px;}
.payment-badge{
  padding:5px 12px;border-radius:6px;
  background:var(--white);color:var(--plum-soft);
  font-size:0.72rem;font-weight:500;letter-spacing:0.3px;
  box-shadow:0 2px 6px rgba(26,26,26,0.06);
}

.footer-bottom{
  padding:14px 0;
  font-size:0.85rem;
  color:var(--plum-soft);
  text-align:center;
  border-top:1px solid rgba(26,26,26,0.08);
}
/* Chat widget */
.chat-widget{
  position:fixed;right:24px;bottom:24px;z-index:200;
  font-family:'Poppins',sans-serif;
}
.chat-toggle{
  height:52px;padding:0 22px;border-radius:999px;border:none;
  background:rgba(244,167,193,0.78);color:var(--white);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  box-shadow:var(--shadow);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-family:'Poppins',sans-serif;font-weight:600;font-size:0.95rem;
  line-height:1;
  transition:background .2s, color .2s, transform .2s;
}
.chat-toggle:hover{background:rgba(26,26,26,0.85);color:var(--white);transform:translateY(-2px);}
.chat-toggle-icon-open,.chat-toggle-icon-close{display:flex;align-items:center;gap:8px;}
.chat-toggle-icon-open svg{width:18px;height:18px;flex-shrink:0;}
.chat-toggle-close-x{font-size:1.2rem;line-height:1;}
.chat-toggle-icon-close{display:none;}
.chat-widget.open .chat-toggle-icon-open{display:none;}
.chat-widget.open .chat-toggle-icon-close{display:flex;}

.chat-window{
  position:absolute;right:0;bottom:68px;
  width:330px;max-width:calc(100vw - 32px);
  max-height:min(520px, 70vh);
  background:var(--white);border-radius:var(--radius);
  box-shadow:var(--shadow);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(12px) scale(0.98);pointer-events:none;
  transition:opacity .18s, transform .18s;
}
.chat-widget.open .chat-window{
  opacity:1;transform:translateY(0) scale(1);pointer-events:auto;
}
.chat-header{
  background:var(--rose);color:var(--plum);
  padding:16px 18px;display:flex;align-items:center;justify-content:space-between;
}
.chat-header-title{font-family:'Fraunces',serif;font-weight:600;font-size:1rem;}
.chat-header-sub{font-size:0.75rem;color:rgba(26,26,26,0.65);margin-top:2px;}
.chat-close{
  background:none;border:none;color:var(--plum);font-size:1.3rem;
  cursor:pointer;line-height:1;opacity:0.8;
}
.chat-close:hover{opacity:1;}

.chat-messages{
  flex:1;overflow-y:auto;padding:16px;
  display:flex;flex-direction:column;gap:10px;
  background:var(--cream);
  min-height:180px;
}
.chat-bubble{
  max-width:82%;padding:10px 14px;border-radius:14px;
  font-size:0.87rem;line-height:1.5;
}
.chat-bubble-bot{
  align-self:flex-start;
  background:var(--white);color:var(--plum);
  border-bottom-left-radius:4px;box-shadow:0 2px 8px rgba(26,26,26,0.06);
}
.chat-bubble-user{
  align-self:flex-end;
  background:var(--rose);color:var(--plum);
  border-bottom-right-radius:4px;
}

.chat-quick-replies{
  display:flex;flex-wrap:wrap;gap:8px;
  padding:12px 16px;border-top:1px solid rgba(26,26,26,0.08);
  background:var(--white);
}
.chat-chip{
  border:1px solid var(--plum);background:transparent;color:var(--plum);
  border-radius:999px;padding:6px 14px;font-size:0.78rem;
  font-family:'Poppins',sans-serif;cursor:pointer;transition:.2s;
}
.chat-chip:hover{background:var(--rose);color:var(--plum);}

.chat-input-row{
  display:flex;gap:8px;padding:12px 14px;
  border-top:1px solid rgba(26,26,26,0.08);background:var(--white);
}
.chat-input-row input{
  flex:1;border:1px solid rgba(26,26,26,0.2);border-radius:999px;
  padding:10px 16px;font-family:'Poppins',sans-serif;font-size:0.85rem;
  background:var(--cream);color:var(--plum);
}
.chat-input-row input:focus{outline:none;border-color:var(--rose);}
.chat-send{
  width:38px;height:38px;border-radius:50%;border:none;
  background:var(--rose);color:var(--plum);cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:0.9rem;
  transition:background .2s, color .2s;flex-shrink:0;
}
.chat-send:hover{background:var(--plum);color:var(--white);}
.chat-input-row input:disabled,.chat-send:disabled{opacity:0.6;cursor:not-allowed;}

.chat-typing{display:flex;gap:4px;align-items:center;padding:14px;}
.chat-typing span{
  width:6px;height:6px;border-radius:50%;background:var(--plum-soft);
  opacity:0.4;animation:chatTypingBounce 1s infinite ease-in-out;
}
.chat-typing span:nth-child(2){animation-delay:0.15s;}
.chat-typing span:nth-child(3){animation-delay:0.3s;}
@keyframes chatTypingBounce{
  0%,60%,100%{opacity:0.4;transform:translateY(0);}
  30%{opacity:1;transform:translateY(-3px);}
}

@media (max-width:480px){
  .chat-window{
    right:-8px;width:calc(100vw - 24px);
  }
  .announcement-inner{padding:8px 14px;gap:6px;}
  .announcement-msg{font-size:0.74rem;}
}

/* Responsive */
@media (max-width:820px){
  .product-detail{grid-template-columns:1fr;}
  .checkout-grid{grid-template-columns:minmax(0,1fr);}

  /* Mobile header: hamburger left, logo centered in remaining space, action icons right */
  .header-inner{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;column-gap:6px;
    height:96px;
  }
  .nav-toggle{display:flex;grid-column:1;justify-self:start;}
  .logo{grid-column:2;justify-content:center;}
  .logo-img{height:84px;}
  .header-actions{
    grid-column:3;
    display:flex;align-items:center;justify-content:flex-end;gap:6px;
  }
  /* Account and wishlist icons move into the hamburger nav on mobile
     (see .mobile-only-links) — only search + cart stay in the header row. */
  .header-actions .account-link,
  .header-actions .account-menu,
  .header-actions .wishlist-link{display:none;}
  .search-toggle,.cart-link{
    width:36px;height:36px;flex-shrink:0;
  }
  .search-toggle{display:flex;}
  .cart-link{
    padding:0;border-radius:50%;
    justify-content:center;position:relative;border:1px solid var(--plum);
  }
  .cart-icon{display:block;}
  .cart-label{display:none;}
  .cart-link .cart-count{position:absolute;top:-6px;right:-6px;}

  .search-bar:not([hidden]){display:block;}
  .search-form{padding:12px 20px;}

  .main-nav{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--white);
    border-top:1px solid rgba(26,26,26,0.08);
    box-shadow:var(--shadow);
    padding:8px 24px 16px;
    max-height:calc(100vh - 88px);overflow-y:auto;
    z-index:55;
  }
  .main-nav.open{display:flex;}
  .main-nav a{
    padding:12px 4px;font-size:1rem;text-align:left;
    border-bottom:1px solid rgba(26,26,26,0.06);
  }
  .mobile-only-links{
    display:flex;flex-direction:column;
    margin-top:4px;
  }
  .mobile-only-links a{padding:12px 4px;font-size:1rem;border-bottom:1px solid rgba(26,26,26,0.06);}

  /* On mobile the dropdown expands inline (accordion) inside the menu
     panel instead of floating over the page like the desktop version. */
  .nav-dropdown summary{
    padding:12px 4px;font-size:1rem;
    border-bottom:1px solid rgba(26,26,26,0.06);
    justify-content:space-between;width:100%;
  }
  .nav-dropdown summary::after{content:none;}
  .nav-dropdown-menu{
    position:static;display:none;
    opacity:1;visibility:visible;transform:none;
    background:transparent;box-shadow:none;
    padding:0 0 4px 14px;min-width:0;
  }
  .nav-dropdown[open] .nav-dropdown-menu{display:block;}
  .nav-dropdown-menu a{
    padding:11px 4px;font-size:0.95rem;border-radius:0;
    border-bottom:1px solid rgba(26,26,26,0.06);
  }

  /* Mobile footer: newsletter, brand and trust columns collapse away —
     only Quick Links and the copyright line remain, shown compact. */
  .footer-newsletter,
  .footer-brand,
  .footer-trust-col{display:none;}

  .footer-main{grid-template-columns:1fr;padding:20px 0 4px;}
  .footer-col{text-align:center;}
  .footer-heading{font-size:0.72rem;margin-bottom:8px;}
  .footer-links{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:6px 14px;}
  .footer-links a{font-size:0.78rem;}

  .footer-bottom{padding:10px 0;font-size:0.75rem;}

  /* Cart page: stack the table into cards */
  .cart-table{border-collapse:separate;border-spacing:0;margin-bottom:24px;}
  .cart-table thead{display:none;}
  .cart-table, .cart-table tbody, .cart-table tr, .cart-table td{display:block;width:100%;}
  .cart-table tr{
    background:var(--white);
    border:1px solid rgba(26,26,26,0.08);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    padding:16px;
    margin-bottom:16px;
  }
  .cart-table td{
    padding:8px 0;border-bottom:none;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
  }
  .cart-table td[data-label]::before{
    content:attr(data-label);
    font-size:0.72rem;text-transform:uppercase;letter-spacing:0.5px;
    color:var(--plum-soft);flex-shrink:0;
  }
  .cart-table td[data-label="Product"]{
    display:block;padding-bottom:12px;margin-bottom:8px;
    border-bottom:1px solid rgba(26,26,26,0.08);
  }
  .cart-table td[data-label="Product"]::before{display:none;}
  .cart-table td:last-child{padding-top:12px;justify-content:flex-end;}
  .cart-table input[type=number]{width:64px;padding:8px 6px;}

  .cart-summary{max-width:100%;margin-left:0;padding:22px;}
}