/* ============ TOKENS ============ */
  :root{
    --blush:#f3d9d2;
    --blush-soft:#f8e6e1;
    --cream:#fbf5f0;
    --white:#fffdfb;
    --mocha:#5c3a32;
    --mocha-deep:#42261f;
    --ink:#2b211d;
    --rosewood:#a9695d;
    --dust:#c89a8e;
    --line: rgba(92,58,50,0.16);
    --serif: 'Playfair Display', serif;
    --sans: 'Jost', sans-serif;
    --container: 1240px;
    --radius: 2px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family: var(--sans);
    color: var(--ink);
    background: var(--white);
    -webkit-font-smoothing:antialiased;
    font-weight:400;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  h1,h2,h3,h4{
    font-family: var(--serif);
    font-weight:500;
    margin:0;
    color: var(--mocha-deep);
  }
  p{margin:0; line-height:1.7;}
  .wrap{max-width:var(--container); margin:0 auto; padding:0 32px;}
  .eyebrow{
    font-family: var(--sans);
    letter-spacing:.32em;
    text-transform:uppercase;
    font-size:11.5px;
    font-weight:500;
    color: var(--rosewood);
  }
  .btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-family: var(--sans);
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:12px;
    font-weight:500;
    padding:16px 34px;
    border:1px solid var(--mocha-deep);
    color: var(--mocha-deep);
    background:transparent;
    cursor:pointer;
    transition: all .35s ease;
    white-space:nowrap;
  }
  .btn:hover{ background: var(--mocha-deep); color:var(--cream); }
  .btn.solid{ background: var(--mocha-deep); color: var(--cream); }
  .btn.solid:hover{ background: var(--rosewood); border-color: var(--rosewood); }
  .btn.on-image{ border-color: rgba(255,255,255,.85); color:#fff; }
  .btn.on-image:hover{ background:#fff; color:var(--mocha-deep); }

  section{ position:relative; }
  .section-pad{ padding:96px 0; }
  .center{ text-align:center; }

  /* ============ MOON DIVIDER (signature motif) ============ */
  .moon-divider{
    display:flex; align-items:center; justify-content:center; gap:18px;
    margin: 0 au0;
    color: var(--dust);
  }
  .moon-divider .ln{ height:1px; width:120px; background: var(--line); }
  .moon-divider svg{ width:20px; height:20px; opacity:.9; }

  /* ============ ANNOUNCEMENT BAR ============ */
  .announce{
    background: var(--mocha-deep);
    color: var(--blush-soft);
    text-align:center;
    font-size:12px;
    letter-spacing:.14em;
    padding:10px 20px;
    font-family: var(--sans);
    overflow:hidden;
    white-space:nowrap;
  }
  .announce .track{
    display:inline-block;
    padding-left:100%;
    animation: scroll-left 26s linear infinite;
  }
  .announce span{ margin:0 40px; }
  @keyframes scroll-left{
    0%{ transform:translateX(0); }
    100%{ transform:translateX(-100%); }
  }

  /* ============ HEADER ============ */
  header{
    position:sticky; top:0; z-index:50;
    background: rgba(255,253,251,.92);
    backdrop-filter: blur(8px);
    border-bottom:1px solid var(--line);
  }
  .nav-row{
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 32px;
    max-width:var(--container); margin:0 auto;
  }
  .logo-mark{
    display:flex; align-items:center; gap:10px;
    font-family:var(--serif);
    font-size:28px;
    letter-spacing:.04em;
    color: var(--mocha-deep);
  }
  .logo-mark small{
    display:block;
    font-family: var(--sans);
    font-size:9.5px;
    letter-spacing:.5em;
    font-weight:500;
    color: var(--rosewood);
    margin-top:2px;
  }
  .logo-mark svg{ width:22px; height:22px; flex-shrink:0; }

  nav.primary{ display:flex; gap:38px; }
  nav.primary a{
    font-size:12.5px;
    letter-spacing:.12em;
    text-transform:uppercase;
    font-weight:500;
    color: var(--ink);
    position:relative;
    padding:4px 0;
  }
  nav.primary a::after{
    content:''; position:absolute; left:0; right:0; bottom:-2px; height:1px;
    background: var(--rosewood); transform:scaleX(0); transform-origin:left;
    transition: transform .3s ease;
  }
  nav.primary a:hover::after{ transform:scaleX(1); }

  .nav-icons{ display:flex; align-items:center; gap:22px; }
  .nav-icons a, .nav-icons button{ background:none; border:none; cursor:pointer; color:var(--mocha-deep); }
  .nav-icons svg{ width:19px; height:19px; }

  .menu-toggle{ display:none; }

  /* ============ HERO ============ */
  .hero{
    position:relative;
    min-height: 92vh;
    display:flex; align-items:center;
    overflow:hidden;
    background: var(--mocha-deep);
  }
  .hero img{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position: top center;
    opacity:.92;
  }
  .hero::after{
    content:'';
    position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(43,26,22,.15) 0%, rgba(43,26,22,.08) 40%, rgba(43,26,22,.65) 100%);
  }
  .hero-content{
    position:relative; z-index:2;
    max-width:var(--container); margin:0 auto; padding:0 32px;
    width:100%;
    color:#fff;
  }
  .hero-content .eyebrow{ color: var(--blush-soft); }
  .hero-content h1{
    font-size: clamp(48px, 7vw, 92px);
    color:#fff;
    line-height:1.02;
    margin: 18px 0 22px;
    max-width:820px;
    font-style:italic;
    font-weight:500;
  }
  .hero-content p{
    color: rgba(255,255,255,.86);
    max-width:440px;
    font-size:15.5px;
    margin-bottom:34px;
  }
  .hero-cta{ display:flex; gap:16px; flex-wrap:wrap; }

  .hero-scroll{
    position:absolute; bottom:34px; left:50%; transform:translateX(-50%);
    z-index:2; color:#fff; opacity:.8;
    display:flex; flex-direction:column; align-items:center; gap:8px;
    font-size:10px; letter-spacing:.3em; text-transform:uppercase;
  }
  .hero-scroll .line{ width:1px; height:38px; background: rgba(255,255,255,.6); animation: pulse-h 2.4s ease-in-out infinite; }
  @keyframes pulse-h{ 0%,100%{ opacity:.3; } 50%{ opacity:1; } }

  /* ============ INTRO STRIP ============ */
  .intro{
    padding: 90px 0 70px;
    text-align:center;
  }
  .intro h2{
    font-size: clamp(28px, 3.4vw, 40px);
    font-style: italic;
    max-width: 760px;
    margin: 22px auto 0;
    line-height:1.4;
    color: var(--mocha);
    font-weight:400;
  }

  /* ============ CATEGORY TILES ============ */
  .cat-grid{
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap:22px;
    margin-top:56px;
  }
  .cat-tile{
    position:relative; overflow:hidden;
    aspect-ratio: 3/4;
    background: var(--blush-soft);
  }
  .cat-tile:first-child{ grid-row: span 1; }
  .cat-tile img{ width:100%; height:100%; object-fit:cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
  .cat-tile:hover img{ transform: scale(1.06); }
  .cat-tile .tag{
    position:absolute; left:24px; bottom:24px; z-index:2; color:#fff;
  }
  .cat-tile::before{
    content:''; position:absolute; inset:0;
    background: linear-gradient(180deg, transparent 45%, rgba(43,26,22,.72) 100%);
    z-index:1;
  }
  .cat-tile .tag .eyebrow{ color: var(--blush-soft); }
  .cat-tile .tag h3{ color:#fff; font-size:24px; font-style:italic; margin-top:6px; font-weight:500;}

  /* ============ PRODUCT GRID ============ */
  .shop-head{
    display:flex; align-items:flex-end; justify-content:space-between;
    margin-bottom:48px; flex-wrap:wrap; gap:20px;
  }
  .shop-head h2{ font-size: clamp(30px,3.6vw,44px); font-style:italic; margin-top:12px; font-weight:500;}

  .product-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:34px 26px;
  }
  .product-card{ position:relative; }
  .product-media{
    position:relative; overflow:hidden;
    aspect-ratio: 3/4;
    background: var(--blush-soft);
    margin-bottom:16px;
  }
  .product-media img{
    width:100%; height:100%; object-fit:cover;
    transition: transform .7s ease, opacity .5s ease;
  }
  .product-media img.alt{ position:absolute; inset:0; opacity:0; }
  .product-card:hover .product-media img.main{ opacity:0; }
  .product-card:hover .product-media img.alt{ opacity:1; transform: scale(1.04); }

  .product-badge{
    position:absolute; top:14px; left:14px; z-index:3;
    background: var(--white); color:var(--rosewood);
    font-size:10px; letter-spacing:.14em; text-transform:uppercase;
    padding:6px 11px; font-weight:500;
  }
  .product-quick{
    position:absolute; left:14px; right:14px; bottom:14px; z-index:3;
    opacity:0; transform: translateY(8px);
    transition: all .35s ease;
  }
  .product-card:hover .product-quick{ opacity:1; transform:translateY(0); }
  .product-quick button{
    width:100%; background: rgba(255,253,251,.95); border:none; padding:13px;
    font-family:var(--sans); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
    cursor:pointer; color:var(--mocha-deep); font-weight:500;
  }
  .product-quick button:hover{ background: var(--mocha-deep); color:#fff; }

  .product-info h3{ font-size:17px; font-weight:500; margin-bottom:4px; }
  .product-info .price{ font-size:13px; color: var(--rosewood); letter-spacing:.02em; }
  .product-info .price .note{ color: var(--ink); opacity:.55; font-size:11.5px; margin-left:6px;}

  .shop-more{ text-align:center; margin-top:56px; }

  /* ============ MOMENTS (moon-phase edit) ============ */
  .moments{ background: var(--mocha-deep); color: var(--blush-soft); }
  .moments .wrap{ padding:100px 32px; }
  .moments-head{ text-align:center; max-width:640px; margin:0 auto 64px; }
  .moments-head h2{ color:#fff; font-size:clamp(30px,3.6vw,44px); font-style:italic; margin-top:14px; font-weight:500;}
  .moments-head p{ color: rgba(255,255,255,.72); margin-top:16px; font-size:14.5px; }

  .phase-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
  .phase{ text-align:center; }
  .phase-icon{
    width:54px; height:54px; margin:0 auto 22px;
    border:1px solid rgba(255,255,255,.35); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
  }
  .phase-icon svg{ width:22px; height:22px; }
  .phase .eyebrow{ color: var(--dust); }
  .phase h3{ color:#fff; font-size:22px; font-style:italic; margin:10px 0 12px; font-weight:500; }
  .phase p{ color: rgba(255,255,255,.68); font-size:13.5px; max-width:280px; margin:0 auto 22px; }
  .phase a{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:#fff; border-bottom:1px solid rgba(255,255,255,.5); padding-bottom:4px; }

  /* ============ CUSTOM STRIP ============ */
  .custom-strip{
    display:grid; grid-template-columns: 1fr 1fr;
    align-items:stretch;
  }
  .custom-strip .media{ min-height:520px; overflow:hidden; }
  .custom-strip .media img{ width:100%; height:100%; object-fit:cover; }
  .custom-strip .copy{
    display:flex; flex-direction:column; justify-content:center;
    padding:70px 90px; background: var(--blush-soft);
  }
  .custom-strip h2{ font-size:clamp(28px,3.2vw,40px); font-style:italic; margin:16px 0 20px; font-weight:500;}
  .custom-strip p{ color: var(--mocha); font-size:15px; margin-bottom:30px; max-width:420px; }
  .custom-strip ul{ list-style:none; padding:0; margin:0 0 34px; }
  .custom-strip li{
    display:flex; gap:12px; align-items:flex-start;
    font-size:14px; color: var(--mocha); margin-bottom:14px;
  }
  .custom-strip li svg{ width:16px; height:16px; flex-shrink:0; margin-top:3px; color:var(--rosewood); }

  /* ============ GALLERY BAND ============ */
  .gallery-band{ padding: 100px 0; text-align:center; background:var(--cream); }
  .gallery-band .eyebrow{ margin-bottom:14px; }
  .gallery-band h2{ font-size:clamp(30px,3.6vw,44px); font-style:italic; margin-bottom:56px; font-weight:500;}
  .gallery-grid{
    display:grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 130px;
    gap:12px;
  }
  .gallery-grid img{ width:100%; height:100%; object-fit:cover; }
  .gallery-grid .g1{ grid-column: span 2; grid-row: span 3; }
  .gallery-grid .g2{ grid-column: span 2; grid-row: span 2; }
  .gallery-grid .g3{ grid-column: span 2; grid-row: span 2; }
  .gallery-grid .g4{ grid-column: span 2; grid-row: span 2; }
  .gallery-grid .g5{ grid-column: span 2; grid-row: span 3; }
  .gallery-grid .g6{ grid-column: span 2; grid-row: span 2; }
  .gallery-cta{ margin-top:52px; }

  /* ============ REVIEWS ============ */
  .reviews{ padding:100px 0; }
  .reviews-head{ text-align:center; margin-bottom:60px; }
  .reviews-head h2{ font-size:clamp(30px,3.6vw,44px); font-style:italic; margin-top:14px; font-weight:500;}
  .review-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
  .review-card{
    background: var(--blush-soft);
    padding:38px 34px;
    display:flex; flex-direction:column; gap:18px;
  }
  .stars{ color: var(--rosewood); letter-spacing:3px; font-size:14px; }
  .review-card p{ font-size:14.5px; color: var(--mocha); font-style:italic; }
  .review-name{ font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color: var(--rosewood); font-weight:500; }
  .review-note{
    text-align:center; margin-top:40px; font-size:12.5px; color: var(--ink); opacity:.55;
  }

  /* ============ INSTAGRAM CTA ============ */
  .insta{
    background: var(--blush);
    padding:90px 0;
    text-align:center;
  }
  .insta h2{ font-size:clamp(28px,3.2vw,40px); font-style:italic; margin:16px 0 14px; font-weight:500;}
  .insta p{ color: var(--mocha); max-width:460px; margin:0 auto 30px; font-size:14.5px; }

  /* ============ NEWSLETTER ============ */
  .newsletter{
    background: var(--mocha-deep); color:#fff; text-align:center;
    padding: 90px 0;
  }
  .newsletter .eyebrow{ color: var(--dust); }
  .newsletter h2{ color:#fff; font-size:clamp(28px,3.2vw,38px); font-style:italic; margin:16px 0 26px; font-weight:500;}
  .news-form{
    display:flex; max-width:440px; margin:0 auto; border-bottom:1px solid rgba(255,255,255,.4);
    padding-bottom:12px;
  }
  .news-form input{
    flex:1; background:transparent; border:none; outline:none;
    color:#fff; font-family:var(--sans); font-size:14px; letter-spacing:.02em;
  }
  .news-form input::placeholder{ color: rgba(255,255,255,.55); }
  .news-form button{
    background:none; border:none; color:#fff; cursor:pointer;
    letter-spacing:.14em; text-transform:uppercase; font-size:11.5px; font-family:var(--sans); font-weight:500;
  }

  /* ============ FOOTER ============ */
  footer{ background: var(--cream); padding:80px 0 0; }
  .foot-grid{
    display:grid; grid-template-columns: 1.3fr 1fr 1fr 1fr;
    gap:40px;
    padding-bottom:60px;
    border-bottom:1px solid var(--line);
  }
  .foot-brand img{ width:64px; margin-bottom:18px; }
  .foot-brand p{ font-size:13.5px; color: var(--mocha); max-width:280px; margin-bottom:20px;}
  .foot-social{ display:flex; gap:14px; }
  .foot-social a{
    width:36px; height:36px; border:1px solid var(--line); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
  }
  .foot-social svg{ width:15px; height:15px; }
  .foot-col h4{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; margin-bottom:20px; color:var(--mocha-deep); font-family:var(--sans); font-weight:600;}
  .foot-col a, .foot-col p{ display:block; font-size:13.5px; color: var(--mocha); opacity:.85; margin-bottom:12px; }
  .foot-bottom{
    display:flex; justify-content:space-between; align-items:center;
    padding:26px 0; font-size:12px; color: var(--mocha); opacity:.6; flex-wrap:wrap; gap:10px;
  }
  .foot-bottom a{ opacity:1; }
  .foot-credit{
    text-align:center; padding:16px 0 28px; font-size:12px; color: var(--mocha); opacity:.7;
    border-top:1px solid var(--line);
  }
  .foot-credit a{
    color: var(--rosewood); opacity:1; font-weight:500; text-decoration:underline;
    text-underline-offset:2px;
  }
  .foot-credit a:hover{ color: var(--mocha-deep); }

  /* ============ REVEAL ANIM ============ */
  .reveal{ opacity:0; transform: translateY(26px); transition: opacity .8s ease, transform .8s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

  /* ============ RESPONSIVE ============ */
  @media (max-width: 1024px){
    .cat-grid{ grid-template-columns:1fr 1fr; }
    .product-grid{ grid-template-columns:repeat(2,1fr); }
    .phase-grid{ grid-template-columns:1fr; gap:56px; }
    .custom-strip{ grid-template-columns:1fr; }
    .custom-strip .media{ min-height:380px; }
    .custom-strip .copy{ padding:60px 40px; }
    .review-grid{ grid-template-columns:1fr; }
    .foot-grid{ grid-template-columns:1fr 1fr; row-gap:40px; }
    .gallery-grid{ grid-template-columns:repeat(4,1fr); grid-auto-rows:110px; }
    .gallery-grid .g1,.gallery-grid .g5{ grid-row: span 2; }
  }
  @media (max-width: 760px){
    nav.primary{ display:none; }
    .menu-toggle{ display:block; }
    .wrap{ padding:0 20px; }
    .nav-row{ padding:16px 20px; }
    .cat-grid{ grid-template-columns:1fr; }
    .product-grid{ grid-template-columns:1fr 1fr; gap:20px 14px; }
    .section-pad{ padding:64px 0; }
    .custom-strip .copy{ padding:48px 26px; }
    .gallery-grid{ grid-template-columns:repeat(2,1fr); }
    .foot-grid{ grid-template-columns:1fr; }
    .hero-content h1{ max-width:100%; }
  }

/* ============ ADDITIONS: SWATCHES ============ */
.color-label{
  font-size:11.5px; color: var(--ink); opacity:.65; margin-top:4px; display:block;
}
.swatches{
  display:flex; gap:7px; margin-top:10px; flex-wrap:wrap;
}
.swatch{
  width:20px; height:20px; border-radius:50%;
  border:1.5px solid rgba(0,0,0,.12);
  cursor:pointer; padding:0; position:relative;
  transition: transform .2s ease, border-color .2s ease;
}
.swatch:hover{ transform: scale(1.14); }
.swatch.active{ border-color: var(--mocha-deep); box-shadow: 0 0 0 2px var(--white), 0 0 0 3px var(--mocha-deep); }
.custom-note{
  font-size:11px; color: var(--rosewood); margin-top:8px; font-style:italic;
}

/* ============ ADDITIONS: SECTION HEADERS FOR CATEGORY BLOCKS ============ */
.category-block{ padding: 70px 0; }
.category-block:nth-child(even){ background: var(--cream); }
.category-block .shop-head{ margin-bottom:44px; }
.category-block .shop-head p.eyebrow{ margin-bottom:8px; }

/* ============ ADDITIONS: REELS SECTION ============ */
.reels-section{ padding: 100px 0; background: var(--mocha-deep); }
.reels-head{ text-align:center; max-width:600px; margin:0 auto 50px; }
.reels-head h2{ color:#fff; font-size:clamp(28px,3.4vw,40px); font-style:italic; margin-top:14px; font-weight:500;}
.reels-head p{ color: rgba(255,255,255,.7); margin-top:14px; font-size:14px; }
.reels-carousel{ position:relative; }
.reels-scroll{
  display:flex;
  gap:20px;
  overflow-x:auto;
  scroll-snap-type: x mandatory;
  scroll-behavior:smooth;
  padding-bottom:6px;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.reels-scroll::-webkit-scrollbar{ display:none; }
.reel-embed{
  position:relative;
  flex:0 0 240px;
  aspect-ratio:9/16;
  scroll-snap-align:start;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  box-shadow:0 10px 30px rgba(0,0,0,.28);
  cursor:pointer;
}
.reel-video{ width:100%; height:100%; object-fit:cover; display:block; }
.reel-embed::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.18) 0%, transparent 22%, transparent 60%, rgba(0,0,0,.55) 100%);
  pointer-events:none;
}
.reel-mute-btn{
  position:absolute; bottom:14px; right:14px; z-index:3;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.92); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:transform .2s ease;
}
.reel-mute-btn:hover{ transform:scale(1.08); }
.reel-mute-btn svg{ width:16px; height:16px; color:var(--mocha-deep); }
.reel-badge{
  position:absolute; top:12px; left:12px; z-index:3;
  display:flex; align-items:center; gap:6px;
  color:#fff; font-size:11px; letter-spacing:.06em; font-weight:500;
}
.reel-badge img{ width:22px; height:22px; border-radius:50%; border:1.5px solid #fff; }
.reel-play-overlay{
  position:absolute; inset:0; z-index:2;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.25); opacity:0; pointer-events:none;
  transition:opacity .2s ease;
}
.reel-embed.paused .reel-play-overlay{ opacity:1; }
.reel-play-overlay svg{ width:46px; height:46px; color:#fff; filter:drop-shadow(0 2px 8px rgba(0,0,0,.4)); }
.reels-arrow{
  position:absolute; top:50%; right:-22px; transform:translateY(-50%);
  width:52px; height:52px; border-radius:50%;
  background:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.18);
  z-index:5; transition:transform .2s ease;
}
.reels-arrow:hover{ transform:translateY(-50%) scale(1.08); }
.reels-arrow svg{ width:20px; height:20px; color:var(--mocha-deep); }
.reels-arrow.prev{ left:-22px; right:auto; }
@media (max-width:1300px){
  .reels-arrow{ display:none; }
}
.reels-cta{ text-align:center; margin-top:44px; }
.reels-note{
  text-align:center; margin-top:22px; font-size:11.5px; color: rgba(255,255,255,.45);
  max-width:480px; margin-left:auto; margin-right:auto;
}

@media (max-width:760px){
  .reel-embed{ flex-basis:170px; }
}

/* ============ CART DRAWER ============ */
.cart-overlay{
  position:fixed; inset:0; background:rgba(43,26,22,.45); z-index:200;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
.cart-overlay.open{ opacity:1; pointer-events:auto; }
.cart-drawer{
  position:fixed; top:0; right:0; height:100%; width:420px; max-width:92vw;
  background:var(--white); z-index:201; box-shadow:-8px 0 30px rgba(0,0,0,.12);
  transform:translateX(100%); transition:transform .35s cubic-bezier(.2,.8,.2,1);
  display:flex; flex-direction:column;
}
.cart-drawer.open{ transform:translateX(0); }
.cart-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:24px 26px; border-bottom:1px solid var(--line);
}
.cart-head h3{ font-size:19px; font-style:italic; font-weight:500; }
.cart-close{ background:none; border:none; cursor:pointer; color:var(--mocha-deep); padding:4px; }
.cart-close svg{ width:20px; height:20px; }
.cart-body{ flex:1; overflow-y:auto; padding:20px 26px; }
.cart-empty{ text-align:center; padding:60px 20px; color:var(--mocha); }
.cart-empty svg{ width:44px; height:44px; margin:0 auto 16px; opacity:.4; display:block; }
.cart-empty p{ font-size:14px; margin-bottom:20px; }
.cart-item{
  display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line);
}
.cart-item img{ width:72px; height:90px; object-fit:cover; flex-shrink:0; background:var(--blush-soft); }
.cart-item-info{ flex:1; display:flex; flex-direction:column; }
.cart-item-info h4{ font-family:var(--serif); font-size:14.5px; font-weight:500; margin-bottom:4px; }
.cart-item-info .meta{ font-size:12px; color:var(--mocha); opacity:.7; margin-bottom:8px; }
.cart-item-info .row{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; }
.cart-qty{ display:flex; align-items:center; gap:10px; font-size:13px; }
.cart-qty button{ width:22px; height:22px; border:1px solid var(--line); background:none; cursor:pointer; font-size:13px; line-height:1; }
.cart-remove{ background:none; border:none; color:var(--rosewood); font-size:11.5px; cursor:pointer; text-decoration:underline; }
.cart-total-row{
  display:flex; justify-content:space-between; align-items:center;
  padding:18px 0 6px; margin-top:10px; border-top:1px solid var(--line);
  font-family:var(--serif); font-size:16px; font-weight:500; color:var(--mocha-deep);
}
.cart-foot{ padding:22px 26px; border-top:1px solid var(--line); }
.cart-foot .cart-note-line{ font-size:12px; color:var(--mocha); opacity:.7; margin-bottom:16px; }
.cart-foot .btn{ width:100%; justify-content:center; }
.cart-checkout-form{ display:flex; flex-direction:column; gap:10px; margin-bottom:18px; padding:18px; background:var(--cream); border:1px solid var(--line); }
.cart-checkout-form .ck-section-label{
  font-family:var(--sans); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--rosewood); font-weight:600; margin:4px 0 2px;
}
.cart-checkout-form .ck-section-label:first-child{ margin-top:0; }
.cart-checkout-form .ck-row-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.cart-checkout-form .ck-row-3{ display:grid; grid-template-columns:1.3fr 1.3fr 1fr; gap:10px; }
.cart-checkout-form input{
  width:100%; padding:11px 13px; border:1px solid var(--line); background:var(--white);
  font-family:var(--sans); font-size:13px; color:var(--ink); outline:none;
  transition:border-color .2s ease;
}
.cart-checkout-form input:focus{ border-color:var(--mocha-deep); }
.cart-checkout-form input.field-error{ border-color:#b3413a; }
#payRazorpayBtn{ margin-bottom:10px; }
#payRazorpayBtn:disabled{ opacity:.6; cursor:not-allowed; }
.cart-pay-status{ font-size:12.5px; text-align:center; margin-top:10px; }
.cart-pay-status.error{ color:#b3413a; }
.cart-pay-status.success{ color:#3a7d44; }

/* ============ SEARCH OVERLAY ============ */
.search-overlay{
  position:fixed; inset:0; background:rgba(43,26,22,.5); z-index:210;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
  display:flex; align-items:flex-start; justify-content:center;
  padding-top:110px;
}
.search-overlay.open{ opacity:1; pointer-events:auto; }
.search-box{
  background:var(--white); width:560px; max-width:92vw; border-radius:2px;
  box-shadow:0 20px 60px rgba(0,0,0,.2);
  transform:translateY(-16px); transition:transform .3s ease;
}
.search-overlay.open .search-box{ transform:translateY(0); }
.search-input-row{ display:flex; align-items:center; gap:14px; padding:22px 24px; border-bottom:1px solid var(--line); }
.search-input-row svg{ width:19px; height:19px; color:var(--mocha-deep); flex-shrink:0; }
.search-input-row input{
  flex:1; border:none; outline:none; font-family:var(--sans); font-size:16px;
  background:transparent; color:var(--ink);
}
.search-close{ background:none; border:none; cursor:pointer; color:var(--mocha-deep); }
.search-close svg{ width:18px; height:18px; }
.search-results{ max-height:400px; overflow-y:auto; padding:8px 0; }
.search-result{
  display:flex; align-items:center; gap:14px; padding:10px 24px;
  text-decoration:none; color:var(--ink);
}
.search-result:hover{ background:var(--cream); }
.search-result img{ width:44px; height:56px; object-fit:cover; background:var(--blush-soft); }
.search-result-name{ font-family:var(--serif); font-size:14.5px; }
.search-result-cat{ font-size:11.5px; color:var(--rosewood); margin-top:2px; }
.search-empty{ padding:30px 24px; text-align:center; font-size:13.5px; color:var(--mocha); opacity:.65; }

@media (max-width:600px){
  .cart-drawer{ width:100%; max-width:100%; }
  .cart-checkout-form .ck-row-3{ grid-template-columns:1fr 1fr; }
  .cart-checkout-form .ck-row-3 input:last-child{ grid-column:span 2; }
  .search-overlay{ padding-top:70px; }
}

/* ============ URGENCY BADGE ============ */
.urgency-badge{
  position:absolute; top:14px; right:14px; z-index:3;
  background: var(--mocha-deep); color:#fff;
  font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  padding:6px 11px; font-weight:500;
}

/* ============ QUICK VIEW BUTTON ============ */
.quick-view-btn{
  position:absolute; top:14px; right:14px; z-index:4;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,253,251,.92); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translateY(-6px);
  transition: all .25s ease;
}
.product-card:hover .quick-view-btn{ opacity:1; transform:translateY(0); }
.quick-view-btn:hover{ background:var(--mocha-deep); color:#fff; }
.quick-view-btn svg{ width:16px; height:16px; }
.urgency-badge ~ .quick-view-btn, .product-badge ~ .urgency-badge ~ .quick-view-btn{ top:50px; }
.product-card:has(.urgency-badge) .quick-view-btn{ top:50px; }

/* ============ QUICK VIEW MODAL ============ */
.qv-overlay{
  position:fixed; inset:0; background:rgba(43,26,22,.55); z-index:300;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
  display:flex; align-items:center; justify-content:center; padding:24px;
}
.qv-overlay.open{ opacity:1; pointer-events:auto; }
.qv-modal{
  background:var(--white); max-width:900px; width:100%; max-height:88vh;
  overflow-y:auto; border-radius:2px; position:relative;
  transform:scale(.96); transition:transform .3s ease;
  display:grid; grid-template-columns:1fr 1fr;
}
.qv-overlay.open .qv-modal{ transform:scale(1); }
.qv-close{
  position:absolute; top:16px; right:16px; z-index:5;
  width:36px; height:36px; border-radius:50%; background:rgba(255,253,251,.9);
  border:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.qv-close svg{ width:16px; height:16px; color:var(--mocha-deep); }
.qv-media{ background:var(--blush-soft); aspect-ratio:3/4; overflow:hidden; }
.qv-media img{ width:100%; height:100%; object-fit:cover; }
.qv-info{ padding:40px 36px; display:flex; flex-direction:column; }
.qv-badge{ display:inline-block; background:var(--blush-soft); color:var(--rosewood); font-size:11px; letter-spacing:.1em; text-transform:uppercase; padding:6px 12px; margin-bottom:14px; width:fit-content; }
.qv-info h2{ font-size:24px; font-style:italic; font-weight:500; margin-bottom:8px; }
.qv-price{ color:var(--rosewood); font-size:15px; margin-bottom:16px; }
.qv-desc{ font-size:13.5px; color:var(--ink); line-height:1.7; margin-bottom:20px; }
.qv-swatches{ display:flex; gap:9px; margin-bottom:6px; }
.qv-color-label{ font-size:12.5px; color:var(--ink); opacity:.7; margin-bottom:20px; display:block; }
.qv-btn-row{ display:flex; gap:10px; margin-top:auto; }
.qv-btn-row .btn{ flex:1; padding:15px; font-size:11.5px; justify-content:center; }
.qv-view-full{ margin-top:14px; font-size:12px; text-align:center; }
.qv-view-full a{ color:var(--rosewood); text-decoration:underline; }
@media (max-width:700px){
  .qv-modal{ grid-template-columns:1fr; }
  .qv-media{ aspect-ratio:1/1; }
  .qv-info{ padding:26px 22px; }
}

/* ============ RELATED PRODUCTS ============ */
.related-section{ margin-top:90px; padding-top:60px; border-top:1px solid var(--line); }
.related-section h2{ font-size:24px; font-style:italic; font-weight:500; margin-bottom:32px; text-align:center; }

/* ============ INSTAGRAM FLOATING BUTTON ============ */
.insta-float{
  position:fixed; bottom:26px; right:26px; z-index:150;
  width:56px; height:56px; border-radius:50%;
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  transition: transform .25s ease;
  text-decoration:none;
}
.insta-float:hover{ transform:scale(1.08); }
.insta-float svg{ width:26px; height:26px; color:#fff; }
@media (max-width:600px){
  .insta-float{ width:50px; height:50px; bottom:18px; right:18px; }
  .insta-float svg{ width:23px; height:23px; }
}
