/* =======================================================================
   DIRA — style.css
   GREEN-primary (as in the logo) with the brand-guide accents:
   navy · sky · blush · linen · ivory · gold. Rich dark-green header/hero
   (logo sits on it perfectly). Light, colourful, DISTINCT section
   backgrounds. Fonts: Cormorant Garamond (display) · Jost + DM Sans (UI).
   ======================================================================= */

:root{
  /* Rich ethnic green — PRIMARY brand colour (matches the logo) */
  --green:      #12503A;
  --green-2:    #1C6B4F;
  --green-deep: #0B3225;
  --green-logo: #0C3527;   /* header/hero surface — close to the logo bg */
  --green-soft: #DEEDE5;
  --green-tint: #EFF5F1;
  /* Brand-guide accents */
  --navy:      #16233F;
  --navy-2:    #263A63;
  --navy-deep: #0E1830;
  --sky:       #6E9DC4;
  --sky-soft:  #E4EDF5;
  --sky-tint:  #F1F6FA;
  --blush:     #E7A992;
  --blush-soft:#FAE7DF;
  --blush-tint:#FDF4EF;
  --linen:     #ECE5D9;
  --linen-soft:#F5F0E7;
  --ivory:     #FCFBF7;
  --white-2:   #FFFFFF;
  --gold:      #C4933D;
  --gold-2:    #DFBD77;
  --gold-3:    #EBD6A2;
  --gold-soft: #F4E9D0;
  --gold-deep: #A87E33;

  --ink:      #16233F;
  --ink-2:    #3A4460;
  --ink-soft: #6C7488;
  --on-dark:      #F3EEE3;
  --on-dark-soft: #C2C9BF;

  --serif: "Cormorant Garamond", Georgia, serif;
  --sans:  "DM Sans", system-ui, sans-serif;
  --util:  "Jost", var(--sans);

  --wrap: 1240px;
  --gutter: clamp(1.1rem, 4.5vw, 4rem);
  --sp: clamp(3.4rem, 6vw, 6rem);
  --r: 18px; --r-sm: 12px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --sh-sm: 0 10px 24px -16px rgba(11,50,37,.35);
  --sh:    0 22px 44px -26px rgba(11,50,37,.42);
  --sh-lg: 0 34px 64px -30px rgba(11,50,37,.48);
  --header-h: 80px;
}

*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ font-family:var(--sans); font-size:16px; line-height:1.7; color:var(--ink); background:var(--ivory); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
ul{ list-style:none; padding:0; }
input,button,select,textarea{ font-family:inherit; }
::selection{ background:var(--gold-2); color:var(--green-deep); }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
body.no-scroll{ overflow:hidden; }
svg.i{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

/* TYPE */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; line-height:1.05; letter-spacing:-.01em; color:var(--navy); }
.d1{ font-size:clamp(2.7rem,5.4vw,4.8rem); line-height:1; }
.d2{ font-size:clamp(2rem,3.6vw,3.2rem); }
.d3{ font-size:clamp(1.5rem,2.4vw,2.1rem); }
.serif-it{ font-style:italic; }
.goldtext{ background:linear-gradient(96deg,var(--gold-deep),var(--gold-2) 50%,var(--gold-3)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.greentext{ color:var(--green); }
.eyebrow{ font-family:var(--util); font-weight:600; font-size:.72rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); display:inline-flex; align-items:center; gap:.7rem; }
.eyebrow::before{ content:""; width:26px; height:2px; border-radius:2px; background:var(--gold); }
.eyebrow--c{ justify-content:center; } .eyebrow--c::after{ content:""; width:26px; height:2px; border-radius:2px; background:var(--gold); }
.eyebrow--light{ color:var(--gold-2); }
.lede{ font-size:clamp(1.02rem,1.2vw,1.16rem); color:var(--ink-2); }

/* LAYOUT */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:var(--sp); position:relative; }
.section--tight{ padding-block:clamp(2.4rem,4vw,3.6rem); }
.head-c{ max-width:60ch; margin-inline:auto; text-align:center; margin-bottom:clamp(2.2rem,4vw,3rem); }
.head-c .eyebrow{ margin-bottom:1rem; } .head-c h2{ margin-bottom:.7rem; }
.head-c p{ color:var(--ink-soft); max-width:56ch; margin-inline:auto; }

/* Distinct light section backgrounds */
.s-ivory{ background:var(--ivory); }
.s-white{ background:linear-gradient(180deg,#FFFFFF,#FBFBF8); }
.s-linen{ background:linear-gradient(180deg,var(--linen-soft),var(--linen)); }
.s-sky{ background:linear-gradient(180deg,var(--sky-tint),var(--sky-soft)); }
.s-blush{ background:linear-gradient(180deg,var(--blush-tint),var(--blush-soft)); }
.s-green-soft{ background:linear-gradient(180deg,var(--green-tint),var(--green-soft)); }
/* Rich anchors */
.s-green{ background:radial-gradient(120% 130% at 85% -10%, var(--green-2) 0%, var(--green) 45%, var(--green-deep) 100%); color:var(--on-dark); }
.s-navy{ background:radial-gradient(120% 130% at 12% 0%, var(--navy-2) 0%, var(--navy) 48%, var(--navy-deep) 100%); color:var(--on-dark); }
.s-green h2,.s-green h3,.s-navy h2,.s-navy h3{ color:var(--ivory); }
.s-green p,.s-navy p,.s-green .lede,.s-navy .lede{ color:var(--on-dark-soft); }
.pattern::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='54'%3E%3Cg fill='none' stroke='%23EBD6A2' stroke-opacity='0.08'%3E%3Cpath d='M27 5c7 9 7 15 0 24-7-9-7-15 0-24zM27 25c7 9 7 15 0 24-7-9-7-15 0-24z'/%3E%3C/g%3E%3C/svg%3E"); }
.s-green>.wrap,.s-navy>.wrap{ position:relative; z-index:1; }

/* BUTTONS */
.btn{ font-family:var(--util); font-weight:600; font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; display:inline-flex; align-items:center; justify-content:center; gap:.55rem; padding:.95rem 1.7rem; line-height:1; border-radius:100px; border:1.5px solid transparent; position:relative; overflow:hidden; white-space:nowrap; transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s, color .3s, border-color .3s; }
.btn svg{ width:16px; height:16px; }
.btn:active{ transform:translateY(1px); }
.btn--green{ background:linear-gradient(120deg,var(--green),var(--green-2)); color:var(--ivory); box-shadow:0 12px 24px -14px rgba(11,50,37,.85); }
.btn--green:hover{ transform:translateY(-3px); box-shadow:0 20px 34px -16px rgba(11,50,37,.95); }
.btn--gold{ background:linear-gradient(96deg,var(--gold-deep),var(--gold) 55%,var(--gold-2)); color:#3a2c08; box-shadow:0 12px 24px -14px rgba(168,126,51,.7); }
.btn--gold::after{ content:""; position:absolute; top:0; left:-120%; width:55%; height:100%; transform:skewX(-20deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent); transition:left .7s var(--ease); }
.btn--gold:hover{ transform:translateY(-3px); } .btn--gold:hover::after{ left:130%; }
.btn--navy{ background:var(--navy); color:var(--ivory); } .btn--navy:hover{ background:var(--navy-deep); transform:translateY(-3px); box-shadow:var(--sh); }
.btn--ghost{ border-color:var(--green); color:var(--green); background:rgba(18,80,58,.05); }
.btn--ghost:hover{ background:var(--green); color:var(--ivory); transform:translateY(-3px); }
.btn--light{ border-color:rgba(243,238,227,.45); color:var(--ivory); background:rgba(243,238,227,.08); }
.btn--light:hover{ background:var(--ivory); color:var(--green); transform:translateY(-3px); }
.btn--goldline{ border-color:var(--gold-2); color:var(--gold-2); background:rgba(223,189,119,.08); }
.btn--goldline:hover{ background:var(--gold-2); color:var(--green-deep); transform:translateY(-3px); }
.btn--block{ width:100%; }
.btn--lg{ padding:1.1rem 2.2rem; font-size:.8rem; }
.btn--sm{ padding:.68rem 1.15rem; font-size:.68rem; }

/* ANNOUNCE */
.announce{ background:var(--green-deep); color:var(--on-dark); overflow:hidden; }
.announce__track{ display:flex; gap:3.5rem; white-space:nowrap; padding:.55rem 0; width:max-content; animation:marquee 30s linear infinite; font-family:var(--util); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; }
.announce__track span{ display:inline-flex; align-items:center; gap:.6rem; }
.announce b{ color:var(--gold-2); font-weight:600; } .announce i{ color:var(--gold); font-style:normal; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* HEADER — rich dark green, actual logo image, creative nav */
.site-header{ position:sticky; top:0; z-index:50; height:var(--header-h); transition:background .45s var(--ease), box-shadow .45s, border-color .45s; border-bottom:1px solid rgba(235,214,162,.1); background:var(--green-logo); }
.site-header[data-transparent="true"]{ background:var(--green-logo); border-color:rgba(235,214,162,.1); }
.site-header.solid{ background:rgba(9,42,31,.97); backdrop-filter:blur(14px); box-shadow:0 12px 34px -18px rgba(0,0,0,.6); border-color:rgba(235,214,162,.14); }
.header-inner{ display:flex; align-items:center; gap:1.4rem; height:var(--header-h); }
.brand-logo{ height:38px; width:auto; flex-shrink:0; }
.brand-logo--footer{ height:48px; }

.nav{ display:flex; align-items:center; gap:.35rem; margin-left:1.4rem; }
.nav a{ font-family:var(--util); font-weight:600; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark); padding:.55rem 1rem; border-radius:100px; position:relative; z-index:0; transition:color .3s var(--ease); }
.nav a::before{ content:""; position:absolute; inset:0; border-radius:100px; z-index:-1; background:linear-gradient(120deg,var(--gold),var(--gold-2)); opacity:0; transform:scale(.85); transition:opacity .3s var(--ease), transform .3s var(--ease); }
.nav a:hover,.nav a:focus-visible{ color:#3a2c08; } .nav a:hover::before,.nav a:focus-visible::before{ opacity:1; transform:scale(1); }
.header-tools{ display:flex; align-items:center; gap:.15rem; margin-left:auto; }
.iconbtn{ width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center; color:var(--on-dark); border-radius:50%; position:relative; transition:background .3s,color .3s; }
.iconbtn:hover{ background:rgba(243,238,227,.14); color:var(--gold-2); }
.iconbtn svg{ width:20px; height:20px; }
.cart-count{ position:absolute; top:4px; right:3px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--gold); color:var(--green-deep); font-family:var(--util); font-size:.6rem; font-weight:600; display:flex; align-items:center; justify-content:center; }
.header-cta{ margin-left:.6rem; }
.hamburger{ display:none; width:42px; height:42px; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:var(--on-dark); }
.hamburger span{ width:22px; height:2px; background:currentColor; border-radius:2px; }

.has-mega{ position:relative; }
.mega{ position:fixed; left:0; right:0; margin-top:.35rem; background:var(--ivory); color:var(--ink); border-top:2px solid var(--gold); box-shadow:var(--sh-lg); opacity:0; visibility:hidden; transform:translateY(-6px); transition:.35s var(--ease); z-index:49; }
.has-mega:hover .mega{ opacity:1; visibility:visible; transform:none; }
.mega-inner{ max-width:var(--wrap); margin-inline:auto; padding:2.2rem var(--gutter); display:grid; grid-template-columns:repeat(3,1fr) 1.4fr; gap:2rem; }
.mega h4{ font-family:var(--util); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:1rem; }
.mega li{ margin-bottom:.55rem; } .mega li a{ color:var(--ink-2); font-size:.92rem; } .mega li a:hover{ color:var(--green); }
.mega__promo{ border-radius:var(--r); overflow:hidden; position:relative; min-height:190px; color:var(--ivory); display:flex; }
.mega__promo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mega__promo span{ position:relative; z-index:1; margin-top:auto; padding:1.2rem; font-family:var(--serif); font-size:1.4rem; background:linear-gradient(180deg,transparent,rgba(11,50,37,.85)); width:100%; color:#fff; }

/* HERO — clean light banner, refined type & alignment */
.hero{ position:relative; overflow:hidden; }
.hero__glow{ position:absolute; top:-14%; right:-8%; width:48%; height:74%; z-index:0; pointer-events:none; background:radial-gradient(closest-side, rgba(110,157,196,.15), transparent 72%); }
.hero-inner{ position:relative; z-index:2; display:grid; grid-template-columns:1.06fr .94fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; padding-block:clamp(3rem,5.5vw,5rem); }
.hero__text{ max-width:36rem; }
.hero__text .eyebrow{ margin-bottom:1.5rem; }
.hero__title{ font-family:var(--serif); font-weight:600; color:var(--navy);
  font-size:clamp(2.9rem,5.6vw,5rem); line-height:1.02; letter-spacing:-.022em; margin-bottom:1.4rem; }
.hero__title .serif-it{ font-style:italic; font-weight:600; }
.hero__lede{ font-family:var(--sans); font-size:1.12rem; line-height:1.75; color:var(--ink-2); max-width:42ch; margin-bottom:2.2rem; }
.hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; align-items:center; margin-bottom:2.3rem; }
.hero__trust{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.hero__avatars{ display:flex; }
.hero__avatars span{ width:38px; height:38px; border-radius:50%; border:2px solid var(--ivory); margin-left:-12px; box-shadow:var(--sh-sm); }
.hero__avatars span:first-child{ margin-left:0; }
.hero__avatars .a1{ background:linear-gradient(135deg,var(--green),var(--green-2)); }
.hero__avatars .a2{ background:linear-gradient(135deg,var(--blush),#C0472F); }
.hero__avatars .a3{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); }
.hero__trust .hero__stars{ color:var(--gold); font-size:.95rem; letter-spacing:2px; display:block; line-height:1; margin-bottom:.2rem; }
.hero__trust small{ color:var(--ink-soft); font-size:.84rem; } .hero__trust b{ color:var(--navy); }
.hero__media{ position:relative; }
.hero__media::before{ content:""; position:absolute; right:-5%; top:8%; width:74%; height:86%; border-radius:28px; z-index:0;
  background:linear-gradient(155deg,var(--green-soft),var(--blush-soft)); }
.hero__frame{ position:relative; z-index:1; border-radius:26px; overflow:hidden; aspect-ratio:1/1.08; box-shadow:var(--sh-lg); border:1px solid var(--linen); }
.hero__frame img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; transition:transform 1.5s var(--ease-out); }
.hero:hover .hero__frame img{ transform:scale(1.04); }
.hero__seal{ position:absolute; z-index:2; left:-16px; bottom:26px; display:flex; align-items:center; gap:.65rem; background:#fff; border:1px solid var(--linen); border-radius:14px; padding:.7rem .95rem; box-shadow:var(--sh); }
.hero__seal .ic{ width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,var(--green),var(--green-2)); color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.hero__seal .ic svg{ width:18px; height:18px; }
.hero__seal b{ font-family:var(--util); font-size:.78rem; color:var(--navy); display:block; letter-spacing:.01em; } .hero__seal small{ font-size:.68rem; color:var(--ink-soft); }

/* VALUE STRIP */
.values__row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.value{ display:flex; align-items:center; gap:.9rem; justify-content:center; }
.value .ic{ width:46px; height:46px; border-radius:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#fff; transition:transform .4s var(--ease); }
.value:hover .ic{ transform:translateY(-4px) rotate(-6deg); }
.value:nth-child(1) .ic{ background:linear-gradient(135deg,var(--green),var(--green-2)); }
.value:nth-child(2) .ic{ background:linear-gradient(135deg,var(--blush),#C0472F); }
.value:nth-child(3) .ic{ background:linear-gradient(135deg,var(--sky),#4E7EA6); }
.value:nth-child(4) .ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); }
.value .ic svg{ width:22px; height:22px; }
.value b{ font-family:var(--util); font-size:.84rem; color:var(--navy); display:block; letter-spacing:.02em; }
.value small{ color:var(--ink-soft); font-size:.74rem; }
.s-green .value b{ color:var(--ivory); } .s-green .value small{ color:var(--on-dark-soft); }
/* 10% JOIN band — compact, on green, no separate box */
.joinband{ text-align:center; }
.joinband .off{ font-family:var(--serif); font-style:italic; font-size:clamp(1.3rem,2.4vw,1.9rem); color:var(--gold-2); }
.joinband h2{ color:var(--ivory); margin:.15rem 0 .5rem; }
.joinband p{ color:var(--on-dark-soft); max-width:54ch; margin:0 auto 1.2rem; font-size:.98rem; }
.joinband form{ display:flex; gap:.6rem; max-width:520px; margin-inline:auto; flex-wrap:wrap; justify-content:center; }
.joinband input{ flex:1; min-width:220px; background:rgba(243,238,227,.12); border:1px solid rgba(235,214,162,.3); color:var(--ivory); padding:.9rem 1.2rem; border-radius:100px; }
.joinband input::placeholder{ color:var(--on-dark-soft); } .joinband input:focus{ outline:none; border-color:var(--gold-2); }
.joinband small{ display:block; margin-top:.8rem; color:var(--on-dark-soft); font-size:.74rem; }

/* CATEGORIES — clean equal editorial cards */
.cat-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }
.cat{ position:relative; overflow:hidden; border-radius:var(--r); display:block; box-shadow:var(--sh); aspect-ratio:3/4; }
.cat img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-out); }
.cat:hover img{ transform:scale(1.08); }
.cat__ov{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(9,42,31,0) 42%,rgba(9,42,31,.82) 100%); transition:background .4s; }
.cat:hover .cat__ov{ background:linear-gradient(180deg,rgba(9,42,31,.15) 30%,rgba(9,42,31,.88) 100%); }
.cat__body{ position:absolute; left:0; bottom:0; z-index:2; padding:1.2rem 1.25rem; color:#fff; width:100%; }
.cat__body .k{ font-family:var(--util); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2); }
.cat__body h3{ color:#fff; font-size:1.5rem; margin:.15rem 0 .35rem; }
.cat__body .go{ display:inline-flex; align-items:center; gap:.4rem; font-family:var(--util); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-3); opacity:0; max-height:0; transform:translateY(6px); transition:.4s var(--ease); }
.cat:hover .cat__body .go{ opacity:1; max-height:2rem; transform:none; } .cat__body .go svg{ width:14px; height:14px; }

/* PRODUCTS */
.prod-top{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:1.4rem; margin-bottom:2.2rem; }
.tabs{ display:inline-flex; gap:.35rem; background:#fff; border:1px solid var(--linen); padding:.32rem; border-radius:100px; flex-wrap:wrap; box-shadow:var(--sh-sm); }
.tab{ font-family:var(--util); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); padding:.58rem 1.15rem; border-radius:100px; transition:.35s var(--ease); }
.tab:hover{ color:var(--navy); }
.tab.is-active{ background:linear-gradient(120deg,var(--green),var(--green-2)); color:var(--ivory); box-shadow:0 6px 16px -8px rgba(11,50,37,.6); }
.prod-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1rem,1.5vw,1.5rem); }
.product{ position:relative; border-radius:var(--r); overflow:hidden; background:#fff; border:1px solid var(--linen); box-shadow:var(--sh-sm); display:flex; flex-direction:column; transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.product:hover{ transform:translateY(-8px); box-shadow:var(--sh-lg); }
.product:nth-child(4n+1){ background:#FBF3EF; } /* blush tint */
.product:nth-child(4n+2){ background:#F1F6FB; } /* sky tint   */
.product:nth-child(4n+3){ background:#EDF5F0; } /* green tint */
.product:nth-child(4n){   background:#FAF3E3; } /* gold tint  */
.product.is-hidden{ display:none; }
.product__media{ position:relative; overflow:hidden; aspect-ratio:4/5; }
.product:nth-child(4n+1) .product__media{ background:var(--blush-soft); }
.product:nth-child(4n+2) .product__media{ background:var(--sky-soft); }
.product:nth-child(4n+3) .product__media{ background:var(--green-soft); }
.product:nth-child(4n) .product__media{ background:var(--gold-soft); }
.product__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 10%; transition:transform 1s var(--ease-out), opacity .6s; }
.product__media img.back{ opacity:0; transform:scale(1.04); }
.product:hover .product__media img.front{ opacity:0; }
.product:hover .product__media img.back{ opacity:1; transform:scale(1); }
.badge{ position:absolute; top:.8rem; left:.8rem; z-index:3; font-family:var(--util); font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; padding:.38rem .65rem; border-radius:100px; color:#fff; font-weight:600; }
.badge--new{ background:linear-gradient(120deg,var(--green),var(--green-2)); }
.badge--sale{ background:linear-gradient(120deg,var(--blush),#C0472F); }
.badge--best{ background:linear-gradient(120deg,var(--gold),var(--gold-deep)); color:#3a2c08; }
.wish{ position:absolute; top:.7rem; right:.7rem; z-index:3; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.94); display:flex; align-items:center; justify-content:center; color:var(--navy); box-shadow:var(--sh-sm); transition:.3s var(--ease); }
.wish svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; }
.wish:hover,.wish.is-active{ background:linear-gradient(120deg,var(--blush),#C0472F); color:#fff; }
.wish.is-active svg{ fill:currentColor; }
.product__actions{ position:absolute; left:0; right:0; bottom:0; z-index:3; padding:.75rem; display:flex; gap:.5rem; transform:translateY(120%); transition:transform .45s var(--ease); }
.product:hover .product__actions{ transform:none; }
.qadd{ flex:1; background:var(--green); color:var(--ivory); font-family:var(--util); font-size:.66rem; letter-spacing:.09em; text-transform:uppercase; padding:.72rem; border-radius:100px; font-weight:600; transition:background .3s; }
.qadd:hover{ background:var(--green-deep); }
.qview{ width:44px; border-radius:100px; background:rgba(255,255,255,.94); color:var(--navy); display:flex; align-items:center; justify-content:center; box-shadow:var(--sh-sm); }
.qview svg{ width:18px; height:18px; }
.product__info{ padding:1rem 1.1rem 1.15rem; display:flex; flex-direction:column; gap:.28rem; flex:1; }
.product__cat{ font-family:var(--util); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); }
.product__name{ font-family:var(--serif); font-size:1.3rem; line-height:1.1; color:var(--navy); }
.product__row{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:.3rem; }
.product__price{ font-weight:600; color:var(--navy); }
.product__price del{ color:var(--ink-soft); font-weight:400; font-size:.85em; margin-right:.35rem; }
.stars{ color:var(--gold); font-size:.72rem; letter-spacing:1px; }
.prod-foot{ text-align:center; margin-top:2.6rem; }

/* AUTO-SLIDER */
.slider{ position:relative; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.slider__track{ display:flex; gap:1.2rem; width:max-content; animation:slide 42s linear infinite; }
.slider:hover .slider__track{ animation-play-state:paused; }
.slide-card{ width:270px; flex-shrink:0; background:#fff; border:1px solid var(--linen); border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-sm); transition:transform .4s var(--ease), box-shadow .4s; }
.slide-card:hover{ transform:translateY(-6px); box-shadow:var(--sh); }
.slide-card__media{ position:relative; aspect-ratio:4/5; overflow:hidden; }
.slide-card__media img{ width:100%; height:100%; object-fit:cover; object-position:50% 10%; transition:transform 1s var(--ease-out); }
.slide-card:hover .slide-card__media img{ transform:scale(1.06); }
.slide-card__b{ padding:.9rem 1rem 1.1rem; }
.slide-card__b .product__cat{ display:block; }
.slide-card__b h3{ font-family:var(--serif); font-size:1.2rem; color:var(--navy); margin:.1rem 0 .35rem; }
@keyframes slide{ to{ transform:translateX(calc(-50% - .6rem)); } }

/* FESTIVE BANNER */
.festive .wrap{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.6rem,3vw,3rem); align-items:center; padding-block:clamp(2.6rem,4vw,3.6rem); }
.festive__img{ position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--sh-lg); }
.festive__img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); }
.festive:hover .festive__img img{ transform:scale(1.06); }
.festive__off{ display:inline-flex; align-items:center; gap:.5rem; background:linear-gradient(120deg,var(--gold),var(--gold-deep)); color:#3a2c08; padding:.45rem .95rem; border-radius:100px; font-family:var(--util); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:1rem; font-weight:600; }
.festive h2{ margin-bottom:.85rem; } .festive p{ margin-bottom:1.3rem; max-width:44ch; }
.count{ display:flex; gap:.7rem; margin-bottom:1.5rem; }
.count div{ text-align:center; }
.count .box{ background:rgba(243,238,227,.1); border:1px solid rgba(235,214,162,.28); border-radius:12px; padding:.65rem .3rem; min-width:60px; backdrop-filter:blur(6px); }
.count b{ font-family:var(--serif); font-size:1.6rem; color:var(--gold-2); line-height:1; }
.count small{ font-family:var(--util); font-size:.54rem; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-soft); }

/* AUTHOR / STORY (sticky, real photo, rich stat boxes) */
.split{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(2rem,4vw,4rem); align-items:start; }
.sticky-media{ position:sticky; top:calc(var(--header-h) + 22px); }
.author__media{ position:relative; }
.author__img{ border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-lg); aspect-ratio:4/5; }
.author__img img{ width:100%; height:100%; object-fit:cover; object-position:50% 18%; }
.author__stamp{ position:absolute; right:-16px; bottom:-16px; width:104px; height:104px; border-radius:50%; background:var(--green-logo); box-shadow:var(--sh-lg); display:flex; align-items:center; justify-content:center; padding:8px; border:2px solid var(--gold-2); z-index:2; }
.author__stamp img{ width:100%; height:100%; object-fit:contain; }
.author__body{ padding-top:.4rem; }
.author__quote{ font-family:var(--serif); font-size:clamp(1.5rem,2.4vw,2.15rem); line-height:1.3; color:var(--navy); margin:1rem 0 1.2rem; }
.author__quote em{ color:var(--green); font-style:italic; }
.author__sign{ font-family:var(--serif); font-style:italic; font-size:1.35rem; color:var(--green); }
.author__role{ font-family:var(--util); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); margin-top:.15rem; }
.author__pitch{ margin-top:1.4rem; display:grid; gap:.7rem; }
.author__pitch li{ display:flex; gap:.7rem; align-items:flex-start; color:var(--ink-2); font-size:.95rem; }
.author__pitch .tick{ width:22px; height:22px; border-radius:50%; background:var(--green-soft); color:var(--green); display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px; }
.author__pitch .tick svg{ width:13px; height:13px; }
/* stat cards — light, gold-topped, rich accent */
.author__stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem; margin-top:1.9rem; }
.statbox{ text-align:center; padding:1.3rem .6rem 1.1rem; border-radius:14px; background:#fff; border:1px solid var(--linen); border-top:3px solid var(--gold); box-shadow:var(--sh-sm); transition:transform .45s var(--ease), box-shadow .45s; }
.statbox:hover{ transform:translateY(-6px); box-shadow:var(--sh); border-top-color:var(--green); }
.statbox b{ font-family:var(--serif); font-weight:600; font-size:2.1rem; color:var(--green); display:block; line-height:1; }
.statbox span{ font-family:var(--util); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }

/* WHY (colourful cards on a very light bg) */
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.why{ padding:1.7rem 1.4rem; border-radius:var(--r); position:relative; overflow:hidden; border:1px solid rgba(22,35,63,.05); transition:transform .45s var(--ease), box-shadow .45s; }
.why:hover{ transform:translateY(-8px); box-shadow:var(--sh); }
.why:nth-child(1){ background:var(--green-soft); } .why:nth-child(2){ background:var(--blush-soft); }
.why:nth-child(3){ background:var(--sky-soft); } .why:nth-child(4){ background:var(--gold-soft); }
.why .ic{ width:54px; height:54px; border-radius:16px; display:flex; align-items:center; justify-content:center; margin-bottom:1rem; color:#fff; transition:transform .4s var(--ease); }
.why:hover .ic{ transform:rotate(-6deg) scale(1.05); }
.why:nth-child(1) .ic{ background:linear-gradient(135deg,var(--green),var(--green-2)); }
.why:nth-child(2) .ic{ background:linear-gradient(135deg,var(--blush),#C0472F); }
.why:nth-child(3) .ic{ background:linear-gradient(135deg,var(--sky),#4E7EA6); }
.why:nth-child(4) .ic{ background:linear-gradient(135deg,var(--gold),var(--gold-deep)); }
.why .ic svg{ width:25px; height:25px; }
.why h3{ font-size:1.32rem; margin-bottom:.4rem; color:var(--navy); }
.why p{ color:var(--ink-2); font-size:.9rem; }
.why .no{ position:absolute; top:.9rem; right:1.1rem; font-family:var(--serif); font-style:italic; font-size:2.2rem; color:rgba(22,35,63,.1); }

/* PROCESS (sticky) */
.process__steps{ display:grid; gap:1rem; }
.pstep{ display:grid; grid-template-columns:auto 1fr; gap:1.1rem; align-items:start; padding:1.2rem 1.3rem; background:#fff; border:1px solid var(--linen); border-radius:var(--r); box-shadow:var(--sh-sm); transition:transform .4s var(--ease), box-shadow .4s; }
.pstep:hover{ transform:translateX(6px); box-shadow:var(--sh); }
.pstep__n{ font-family:var(--serif); font-style:italic; font-size:1.7rem; color:var(--gold-deep); line-height:1; width:44px; }
.pstep h3{ font-size:1.3rem; margin-bottom:.25rem; } .pstep p{ color:var(--ink-soft); font-size:.92rem; }

/* OCCASION */
.occ-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; }
.occ{ position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:3/4; display:block; box-shadow:var(--sh); }
.occ img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-out); }
.occ:hover img{ transform:scale(1.08); }
.occ::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 42%,rgba(11,50,37,.82)); }
.occ span{ position:absolute; left:0; bottom:1rem; width:100%; text-align:center; z-index:1; color:#fff; font-family:var(--util); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; }
.occ b{ position:absolute; top:.8rem; left:0; width:100%; text-align:center; z-index:1; font-family:var(--serif); font-style:italic; color:var(--gold-2); font-size:1.1rem; }

/* GOOGLE REVIEWS — feature card + auto-scrolling columns */
.greviews{ display:grid; grid-template-columns:.92fr 1fr 1fr; gap:1.2rem; align-items:start; position:relative; z-index:1; }
.gfeature{ position:sticky; top:calc(var(--header-h) + 20px); background:radial-gradient(120% 130% at 80% -10%, var(--green-2), var(--green) 45%, var(--green-deep)); border:1px solid rgba(235,214,162,.2); border-radius:22px; padding:2rem 1.9rem; color:var(--on-dark); box-shadow:var(--sh-lg); overflow:hidden; }
.gfeature .glogo{ width:58px; height:58px; border-radius:14px; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:var(--sh-sm); margin-bottom:1.3rem; }
.gfeature .glogo span{ width:34px; height:34px; border-radius:50%; padding:2px; background:conic-gradient(#4285F4 0 25%,#EA4335 0 50%,#FBBC05 0 75%,#34A853 0); display:flex; }
.gfeature .glogo i{ display:flex; width:100%; height:100%; align-items:center; justify-content:center; border-radius:50%; background:#fff; font-family:var(--util); font-weight:700; font-size:.95rem; color:#4285F4; font-style:normal; }
.gfeature h3{ color:var(--ivory); font-size:2.1rem; margin-bottom:.35rem; }
.gfeature .gstars{ color:var(--gold-2); letter-spacing:3px; font-size:1.15rem; margin-bottom:1rem; }
.gfeature p{ color:var(--on-dark-soft); font-size:.95rem; margin-bottom:1.6rem; }
.gfeature .btn{ width:100%; }
.rev-col{ overflow:hidden; height:min(72vh,600px); position:relative; -webkit-mask-image:linear-gradient(180deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(180deg,transparent,#000 7%,#000 93%,transparent); }
.rev-col__track{ display:flex; flex-direction:column; gap:1rem; animation:vscroll 34s linear infinite; }
.rev-col--b .rev-col__track{ animation-duration:44s; }
.rev-col:hover .rev-col__track{ animation-play-state:paused; }
@keyframes vscroll{ to{ transform:translateY(-50%); } }
.grev{ background:#fff; border-radius:var(--r); padding:1.35rem 1.45rem; box-shadow:var(--sh); }
.grev__head{ display:flex; align-items:center; gap:.75rem; margin-bottom:.7rem; }
.grev__ava{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-family:var(--serif); font-weight:600; font-size:1.1rem; flex-shrink:0; }
.grev__who b{ font-family:var(--util); font-size:.9rem; color:var(--navy); display:block; line-height:1.2; }
.grev__who small{ color:var(--ink-soft); font-size:.72rem; }
.grev__g{ margin-left:auto; width:22px; height:22px; border-radius:50%; padding:2px; background:conic-gradient(#4285F4 0 25%,#EA4335 0 50%,#FBBC05 0 75%,#34A853 0); flex-shrink:0; }
.grev__g span{ display:flex; width:100%; height:100%; align-items:center; justify-content:center; border-radius:50%; background:#fff; font-family:var(--util); font-weight:700; font-size:.62rem; color:#4285F4; }
.grev__stars{ color:#FBBC05; letter-spacing:1px; font-size:.9rem; margin-bottom:.55rem; }
.grev__stars em{ color:var(--ink-soft); font-style:normal; font-family:var(--util); font-size:.72rem; margin-left:.45rem; }
.grev p{ color:var(--ink-2); font-size:.9rem; line-height:1.6; }
.grev__posted{ display:flex; align-items:center; gap:.45rem; margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--linen); color:var(--ink-soft); font-family:var(--util); font-size:.74rem; }
.grev__posted .ck{ width:16px; height:16px; color:#34A853; }

/* INSTAGRAM — reels feel */
.ig-head{ display:flex; align-items:center; gap:1rem; justify-content:center; margin-bottom:1.8rem; flex-wrap:wrap; }
.ig-ava{ width:60px; height:60px; border-radius:50%; padding:3px; background:conic-gradient(from 210deg,var(--gold),var(--blush),var(--sky),var(--green-2),var(--gold)); }
.ig-ava div{ width:100%; height:100%; border-radius:50%; background:var(--green); color:var(--ivory); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:1.4rem; border:2px solid var(--linen); }
.ig-meta{ text-align:left; } .ig-meta b{ font-family:var(--util); font-size:1.05rem; color:var(--navy); } .ig-meta small{ display:block; color:var(--ink-soft); font-size:.8rem; }
.reels-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:.7rem; }
.reel{ position:relative; overflow:hidden; aspect-ratio:9/16; border-radius:var(--r); display:block; box-shadow:var(--sh-sm); }
.reel img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease-out); }
.reel:hover img{ transform:scale(1.09); }
.reel::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,50,37,.15) 0%,transparent 30%,transparent 55%,rgba(11,50,37,.78) 100%); }
.reel__play{ position:absolute; top:.6rem; right:.6rem; z-index:2; width:26px; height:26px; border-radius:8px; background:rgba(12,53,39,.55); backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; color:#fff; }
.reel__play svg{ width:15px; height:15px; }
.reel__meta{ position:absolute; left:.7rem; bottom:.7rem; z-index:2; color:#fff; font-family:var(--util); font-size:.72rem; display:flex; align-items:center; gap:.9rem; }
.reel__meta i{ font-style:normal; display:inline-flex; align-items:center; gap:.28rem; } .reel__meta svg{ width:14px; height:14px; }
.reel__tag{ position:absolute; left:.7rem; top:.6rem; z-index:2; font-family:var(--util); font-size:.56rem; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:rgba(11,50,37,.5); backdrop-filter:blur(4px); padding:.25rem .5rem; border-radius:100px; }
.ig-cta{ display:flex; gap:.8rem; justify-content:center; margin-top:2rem; flex-wrap:wrap; }

/* NEWSLETTER */
.news-card{ border-radius:calc(var(--r)*1.4); padding:clamp(2.2rem,4vw,3.4rem); text-align:center; position:relative; overflow:hidden; background:radial-gradient(120% 130% at 85% -10%, var(--green-2), var(--green) 45%, var(--green-deep)); box-shadow:var(--sh-lg); }
.news-card::before{ content:""; position:absolute; width:300px; height:300px; border-radius:50%; top:-120px; right:-70px; background:radial-gradient(closest-side,rgba(235,214,162,.28),transparent); }
.news-card .off{ font-family:var(--serif); font-style:italic; font-size:clamp(1.5rem,3vw,2.3rem); color:var(--gold-2); }
.news-card h2{ color:var(--ivory); margin:.35rem 0 .6rem; }
.news-card p{ color:var(--on-dark-soft); max-width:46ch; margin:0 auto 1.7rem; }
.news-card form{ display:flex; gap:.7rem; max-width:520px; margin-inline:auto; flex-wrap:wrap; justify-content:center; position:relative; z-index:1; }
.news-card input{ flex:1; min-width:230px; background:rgba(243,238,227,.12); border:1px solid rgba(235,214,162,.3); color:var(--ivory); padding:1rem 1.25rem; border-radius:100px; }
.news-card input::placeholder{ color:var(--on-dark-soft); } .news-card input:focus{ outline:none; border-color:var(--gold-2); }
.news-card small{ display:block; margin-top:.9rem; color:var(--on-dark-soft); font-size:.76rem; }

/* FAQ (sticky image left) */
.faq-split{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,4vw,3.5rem); align-items:start; }
.faq-media{ border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-lg); aspect-ratio:4/5; position:relative; }
.faq-media img{ width:100%; height:100%; object-fit:cover; }
.faq-media__tag{ position:absolute; left:1rem; bottom:1rem; right:1rem; background:rgba(252,251,247,.95); backdrop-filter:blur(6px); border-radius:14px; padding:1rem 1.2rem; box-shadow:var(--sh); }
.faq-media__tag b{ font-family:var(--serif); font-size:1.2rem; color:var(--navy); display:block; }
.faq-media__tag small{ color:var(--ink-soft); font-size:.82rem; }
.faq{ margin-bottom:.7rem; border:1px solid var(--linen); border-radius:var(--r-sm); overflow:hidden; background:#fff; transition:border-color .3s, box-shadow .3s; }
.faq[open]{ border-color:var(--gold); box-shadow:var(--sh-sm); }
.faq summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:1rem; justify-content:space-between; padding:1.1rem 1.3rem; font-family:var(--serif); font-size:1.18rem; color:var(--navy); }
.faq summary::-webkit-details-marker{ display:none; }
.faq__ic{ width:28px; height:28px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:var(--linen); position:relative; transition:.4s var(--ease); }
.faq[open] .faq__ic{ background:linear-gradient(120deg,var(--green),var(--green-2)); transform:rotate(135deg); }
.faq__ic::before,.faq__ic::after{ content:""; position:absolute; background:var(--gold-deep); border-radius:2px; }
.faq[open] .faq__ic::before,.faq[open] .faq__ic::after{ background:var(--ivory); }
.faq__ic::before{ width:12px; height:2px; } .faq__ic::after{ width:2px; height:12px; }
.faq p{ padding:0 1.3rem 1.2rem; color:var(--ink-soft); font-size:.94rem; }
.faq-help{ margin-top:1.4rem; display:flex; gap:.7rem; align-items:center; flex-wrap:wrap; padding:1.1rem 1.3rem; background:var(--green-soft); border-radius:var(--r-sm); }
.faq-help b{ color:var(--navy); font-family:var(--util); font-size:.9rem; } .faq-help span{ color:var(--ink-soft); font-size:.86rem; }

/* FOOTER */
.footer{ background:linear-gradient(180deg,var(--green),var(--green-deep)); color:var(--on-dark-soft); position:relative; }
.footer.pattern::after{ opacity:.35; } .footer .wrap{ position:relative; z-index:1; }
.footer-top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:2.2rem; padding-block:clamp(2.8rem,5vw,4.2rem); }
.footer-brand .brand-logo{ margin-bottom:1.1rem; }
.footer-brand p{ font-size:.9rem; max-width:32ch; margin-bottom:1.3rem; }
.footer-social{ display:flex; gap:.55rem; }
.footer-social a{ width:40px; height:40px; border-radius:50%; border:1px solid rgba(235,214,162,.2); display:flex; align-items:center; justify-content:center; color:var(--on-dark-soft); transition:.3s var(--ease); }
.footer-social a:hover{ background:var(--gold); color:#3a2c08; border-color:var(--gold); transform:translateY(-3px); }
.footer-social svg{ width:17px; height:17px; }
.footer-col h4{ font-family:var(--util); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2); margin-bottom:1rem; }
.footer-col li{ margin-bottom:.62rem; } .footer-col a{ font-size:.9rem; } .footer-col a:hover{ color:var(--ivory); }
.footer-pay{ display:flex; justify-content:space-between; align-items:center; gap:1.4rem; flex-wrap:wrap; padding-block:1.5rem; border-top:1px solid rgba(235,214,162,.18); border-bottom:1px solid rgba(235,214,162,.18); }
.pillrow{ display:flex; gap:.45rem; flex-wrap:wrap; align-items:center; }
.pillrow .lbl{ font-family:var(--util); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-soft); margin-right:.3rem; }
.pill{ border:1px solid rgba(235,214,162,.2); border-radius:6px; padding:.32rem .55rem; font-family:var(--util); font-size:.6rem; color:var(--on-dark); background:rgba(243,238,227,.05); }
.footer-bottom{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-block:1.4rem; font-size:.78rem; }
.footer-legal{ display:flex; gap:1.3rem; flex-wrap:wrap; } .footer-bottom a:hover{ color:var(--ivory); }

/* REVEAL / HELPERS */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); }
.reveal.is-in{ opacity:1; transform:none; }
.skip-link{ position:absolute; left:-999px; top:0; background:var(--green); color:var(--ivory); padding:.7rem 1rem; z-index:200; }
.skip-link:focus{ left:12px; top:12px; }
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } .reveal{ opacity:1; transform:none; } }

/* OVERLAYS */
.overlay{ position:fixed; inset:0; background:rgba(11,50,37,.5); backdrop-filter:blur(3px); z-index:80; opacity:0; transition:opacity .4s; }
.overlay.is-shown{ opacity:1; }
.mobile-menu{ position:fixed; inset:0 auto 0 0; width:min(86vw,380px); background:linear-gradient(180deg,var(--green),var(--green-deep)); color:var(--on-dark); z-index:90; transform:translateX(-100%); transition:transform .5s var(--ease); display:flex; flex-direction:column; padding:1.4rem 1.6rem; overflow-y:auto; }
.mobile-menu.is-open{ transform:none; }
.mm-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1.6rem; }
.mobile-nav a{ display:block; font-family:var(--serif); font-size:1.55rem; color:var(--ivory); padding:.65rem 0; border-bottom:1px solid rgba(235,214,162,.15); }
.mm-foot{ margin-top:auto; padding-top:1.4rem; }
.search-overlay{ position:fixed; inset:0; background:var(--ivory); z-index:95; transform:translateY(-100%); transition:transform .5s var(--ease); display:flex; flex-direction:column; padding:1.5rem var(--gutter); }
.search-overlay.is-open{ transform:none; }
.search-overlay__mid{ flex:1; display:flex; flex-direction:column; justify-content:center; max-width:760px; margin-inline:auto; width:100%; }
.search-overlay input{ width:100%; background:transparent; border:none; border-bottom:2px solid var(--linen); font-family:var(--serif); font-size:clamp(1.8rem,4vw,3rem); color:var(--navy); padding:1rem 0; }
.search-overlay input:focus{ outline:none; border-color:var(--gold); }
.search-suggest{ margin-top:1.6rem; display:flex; gap:.7rem; flex-wrap:wrap; align-items:center; }
.search-suggest span{ font-family:var(--util); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.search-suggest a{ font-size:.86rem; color:var(--green); border:1px solid var(--linen); padding:.4rem .9rem; border-radius:100px; } .search-suggest a:hover{ background:var(--green); color:var(--ivory); }
.cart-drawer{ position:fixed; inset:0 0 0 auto; width:min(92vw,420px); background:var(--ivory); z-index:90; transform:translateX(100%); transition:transform .5s var(--ease); display:flex; flex-direction:column; }
.cart-drawer.is-open{ transform:none; }
.cart-head{ display:flex; justify-content:space-between; align-items:center; padding:1.3rem 1.5rem; background:var(--green); color:var(--ivory); }
.cart-head h3{ color:var(--ivory); font-size:1.35rem; }
.cart-head .iconbtn{ color:var(--ivory); } .cart-head .iconbtn:hover{ background:rgba(243,238,227,.15); color:var(--ivory); }
.cart-body{ flex:1; overflow-y:auto; padding:1.1rem 1.5rem; }
.cart-item{ display:grid; grid-template-columns:66px 1fr; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--linen); position:relative; }
.cart-item img{ width:66px; height:84px; object-fit:cover; border-radius:var(--r-sm); }
.cart-item h4{ font-family:var(--serif); font-size:1.1rem; color:var(--navy); } .cart-item small{ color:var(--ink-soft); font-size:.76rem; }
.cart-item .pr{ font-weight:600; margin-top:.3rem; color:var(--navy); }
.cart-x{ position:absolute; top:1rem; right:0; color:var(--ink-soft); font-size:1.1rem; }
.cart-foot{ padding:1.2rem 1.5rem; border-top:1px solid var(--linen); background:var(--linen-soft); }
.cart-note{ text-align:center; font-family:var(--util); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--green); margin-bottom:.9rem; }
.cart-total{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:.9rem; }
.cart-total span{ font-family:var(--util); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.cart-total strong{ font-family:var(--serif); font-size:1.7rem; color:var(--navy); }
.cart-foot .btn{ margin-bottom:.55rem; }
.quickview{ position:fixed; inset:0; z-index:96; display:flex; align-items:center; justify-content:center; padding:1.4rem; opacity:0; visibility:hidden; transition:opacity .4s; }
.quickview.is-open{ opacity:1; visibility:visible; }
.qv-panel{ position:relative; background:var(--ivory); width:min(860px,100%); max-height:90vh; border-radius:var(--r); overflow:hidden; display:grid; grid-template-columns:1fr 1fr; transform:translateY(16px); transition:transform .5s var(--ease); box-shadow:var(--sh-lg); }
.quickview.is-open .qv-panel{ transform:none; }
.qv-media{ background:var(--blush-soft); } .qv-media img{ width:100%; height:100%; object-fit:cover; object-position:50% 10%; }
.qv-body{ padding:clamp(1.6rem,3vw,2.6rem); display:flex; flex-direction:column; justify-content:center; }
.qv-body h3{ font-size:clamp(1.7rem,2.4vw,2.2rem); margin:.4rem 0; }
.qv-price{ font-family:var(--serif); font-size:1.35rem; color:var(--gold-deep); margin-bottom:.9rem; }
.qv-body p{ color:var(--ink-soft); font-size:.92rem; margin-bottom:1.3rem; }
.qv-sizes{ display:flex; gap:.5rem; margin-bottom:1.3rem; flex-wrap:wrap; }
.qv-sizes button{ min-width:50px; padding:.52rem; border:1px solid var(--linen); border-radius:8px; font-family:var(--util); font-size:.72rem; transition:.3s; }
.qv-sizes button.is-active,.qv-sizes button:hover{ background:var(--green); color:var(--ivory); border-color:var(--green); }
.qv-close{ position:absolute; top:1rem; right:1rem; z-index:4; width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; box-shadow:var(--sh-sm); }
.toast{ position:fixed; bottom:1.6rem; left:50%; transform:translate(-50%,20px); z-index:100; display:flex; align-items:center; gap:.7rem; background:var(--green); color:var(--ivory); padding:.95rem 1.45rem; border-radius:100px; box-shadow:var(--sh-lg); opacity:0; visibility:hidden; transition:.4s var(--ease); }
.toast.is-shown{ opacity:1; visibility:visible; transform:translate(-50%,0); }
.toast svg{ width:18px; height:18px; color:var(--gold-2); } .toast span{ font-family:var(--util); font-size:.76rem; letter-spacing:.05em; }
.to-top{ position:fixed; bottom:1.5rem; right:1.5rem; z-index:70; width:48px; height:48px; border-radius:50%; background:var(--green); color:var(--gold-2); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transform:translateY(10px); transition:.4s var(--ease); box-shadow:var(--sh-lg); }
.to-top.is-shown{ opacity:1; visibility:visible; transform:none; } .to-top:hover{ background:var(--gold); color:var(--green-deep); }
.to-top svg{ width:20px; height:20px; }