:root {
  --blush:#F7E8E0; --blush-deep:#F0D5C8; --rose:#D4897A; --rose-light:#E8B4A8;
  --ivory:#FDF8F4; --ivory-dark:#F5EDE4; --gold:#C9956A; --gold-light:#E8C4A8;
  --brown:#8B5E4A; --text:#4A3728; --text-light:#9A7B6E; --border:#EDD8CC; --green:#25D366;
  --ease:cubic-bezier(0.25,1,0.5,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--text);overflow-x:hidden;}
::-webkit-scrollbar{width:5px;}::-webkit-scrollbar-track{background:var(--ivory);}::-webkit-scrollbar-thumb{background:var(--rose-light);border-radius:3px;}

/* Shared logo image */
.db-logo,.intro-logo,.gsign-logo,.ld-logo-ring,.nav-logo-db,.about-logo-big,.footer-db-circle{
  object-fit:cover;object-position:center;background:transparent;display:block;
}

/* ══════════════════════════════
   INTRO SPLASH SCREEN
══════════════════════════════ */
#introScreen{
  position:fixed;inset:0;z-index:10001;
  background:linear-gradient(160deg,#FDF8F4 0%,#F7E8E0 50%,#FDF8F4 100%);
  display:flex;align-items:center;justify-content:center;
  transition:opacity 0.9s var(--ease),visibility 0.9s var(--ease);
}
#introScreen.hide{opacity:0;visibility:hidden;pointer-events:none;}
.intro-inner{text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px;padding:20px;}
.intro-logo{
  width:140px;height:140px;border-radius:50%;margin:0 auto;
  box-shadow:0 12px 40px rgba(212,137,122,0.35),0 0 0 10px rgba(212,137,122,0.1);
  animation:elegantPulse 2.5s ease-in-out infinite;
}
.intro-tagline{font-size:11px;letter-spacing:5px;text-transform:uppercase;color:var(--rose);font-weight:500;}
.intro-sub{font-family:'Cormorant Garamond',cursive;font-size:22px;color:var(--gold);}
.intro-dots{display:flex;gap:8px;margin-top:4px;}
.intro-dot{width:6px;height:6px;border-radius:50%;background:var(--rose-light);animation:dotPulse 1.2s ease-in-out infinite;}
.intro-dot:nth-child(2){animation-delay:0.2s;}
.intro-dot:nth-child(3){animation-delay:0.4s;}

/* ══════════════════════════════
   GOOGLE SIGN-IN SCREEN
══════════════════════════════ */
#gSignInScreen {
  position:fixed;inset:0;z-index:10000;
  background:linear-gradient(160deg,#FDF8F4 0%,#F7E8E0 50%,#FDF8F4 100%);
  display:flex;align-items:center;justify-content:center;
  transition:opacity 0.8s var(--ease),visibility 0.8s var(--ease);
  opacity:0;visibility:hidden;pointer-events:none;
}
#gSignInScreen.show{opacity:1;visibility:visible;pointer-events:auto;}
#gSignInScreen.hide{opacity:0;visibility:hidden;pointer-events:none;}
.gsign-petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.gsign-petal{position:absolute;border-radius:50% 0 50% 0;animation:floatPetal 5s ease-in-out infinite;}
.gsign-petal:nth-child(1){width:60px;height:60px;background:var(--rose);opacity:0.1;top:8%;left:4%;animation-delay:0s;}
.gsign-petal:nth-child(2){width:40px;height:40px;background:var(--gold);opacity:0.12;top:20%;right:6%;animation-delay:0.8s;}
.gsign-petal:nth-child(3){width:80px;height:80px;background:var(--rose-light);opacity:0.1;bottom:15%;left:6%;animation-delay:1.5s;}
.gsign-petal:nth-child(4){width:50px;height:50px;background:var(--gold-light);opacity:0.14;bottom:20%;right:8%;animation-delay:0.4s;}
.gsign-petal:nth-child(5){width:35px;height:35px;background:var(--rose);opacity:0.1;top:50%;left:45%;animation-delay:2s;}
.gsign-petal:nth-child(6){width:55px;height:55px;background:var(--blush-deep);opacity:0.15;top:10%;right:22%;animation-delay:1s;}
.gsign-petal:nth-child(7){width:30px;height:30px;background:var(--rose-light);opacity:0.12;bottom:30%;left:30%;animation-delay:2.5s;}
.gsign-petal:nth-child(8){width:45px;height:45px;background:var(--gold);opacity:0.1;top:35%;right:15%;animation-delay:1.8s;}
.gsign-box{
  position:relative;z-index:1;text-align:center;
  background:#fff;border-radius:32px;padding:56px 48px;
  box-shadow:0 24px 80px rgba(139,94,74,0.14);
  border:1px solid var(--border);max-width:440px;width:90%;
}
.gsign-logo{width:110px;height:110px;border-radius:50%;object-fit:cover;object-position:center;margin:0 auto 24px;display:block;box-shadow:0 8px 32px rgba(212,137,122,0.25),0 0 0 8px rgba(212,137,122,0.08);animation:elegantPulse 2.5s ease-in-out infinite;background:transparent;}
@keyframes elegantPulse{0%,100%{transform:scale(1);box-shadow:0 12px 40px rgba(212,137,122,0.4),0 0 0 10px rgba(212,137,122,0.1);}50%{transform:scale(1.06);box-shadow:0 18px 56px rgba(212,137,122,0.5),0 0 0 16px rgba(212,137,122,0.08);}}
.gsign-title{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--text);font-weight:400;margin-bottom:6px;}
.gsign-title em{font-style:italic;color:var(--rose);}
.gsign-script{font-family:'Cormorant Garamond',cursive;font-size:20px;color:var(--gold);display:block;margin-bottom:20px;}
.gsign-body{font-size:13px;color:var(--text-light);line-height:1.8;margin-bottom:36px;font-weight:300;}
.gsign-divider{display:flex;align-items:center;gap:12px;margin-bottom:28px;}
.gsign-divider::before,.gsign-divider::after{content:'';flex:1;height:1px;background:var(--border);}
.gsign-divider span{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--text-light);}
.gsign-google-btn{
  display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;background:#fff;border:1.5px solid var(--border);
  padding:14px 24px;border-radius:100px;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:13px;font-weight:600;color:var(--text);
  transition:all 0.3s;box-shadow:0 2px 12px rgba(139,94,74,0.08);
}
.gsign-google-btn:hover{border-color:var(--rose);box-shadow:0 6px 20px rgba(212,137,122,0.2);transform:translateY(-1px);}
.gsign-google-icon{width:20px;height:20px;}
.gsign-guest{margin-top:16px;font-size:11px;color:var(--text-light);cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.gsign-guest:hover{color:var(--rose);}
.gsign-badges{display:flex;justify-content:center;gap:20px;margin-top:32px;padding-top:24px;border-top:1px solid var(--border);}
.gsign-badge{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-light);}

/* ══════════════════════════════
   DEVICE SELECTOR SCREEN
══════════════════════════════ */
#deviceScreen{
  position:fixed;inset:0;z-index:9999;
  background:linear-gradient(160deg,#FDF8F4 0%,#F7E8E0 50%,#FDF8F4 100%);
  display:none;align-items:center;justify-content:center;flex-direction:column;
  transition:opacity 0.8s var(--ease),visibility 0.8s var(--ease);
}
#deviceScreen.show{display:flex;}
#deviceScreen.hide{opacity:0;visibility:hidden;pointer-events:none;}
.dev-petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.dev-inner{position:relative;z-index:1;text-align:center;max-width:700px;width:90%;padding:20px;}
.dev-welcome{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--rose);margin-bottom:8px;display:flex;align-items:center;justify-content:center;gap:10px;}
.dev-user-name{font-family:'Cormorant Garamond',serif;font-size:clamp(32px,5vw,56px);color:var(--text);font-weight:400;margin-bottom:8px;}
.dev-user-name em{font-style:italic;color:var(--rose);}
.dev-script{font-family:'Cormorant Garamond',cursive;font-size:clamp(20px,3vw,32px);color:var(--gold);margin-bottom:12px;display:block;}
.dev-subtitle{font-size:13px;color:var(--text-light);letter-spacing:2px;text-transform:uppercase;margin-bottom:48px;}
.dev-question{font-family:'Cormorant Garamond',serif;font-size:clamp(16px,2.5vw,22px);color:var(--text);margin-bottom:32px;font-weight:400;font-style:italic;}
.dev-cards{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.dev-card{
  background:#fff;border:2px solid var(--border);border-radius:24px;
  padding:36px 28px;width:180px;cursor:pointer;transition:all 0.35s var(--ease);
  box-shadow:0 4px 20px rgba(139,94,74,0.06);text-align:center;
}
.dev-card:hover,.dev-card:focus{border-color:var(--rose);transform:translateY(-8px);box-shadow:0 20px 50px rgba(212,137,122,0.2);}
.dev-card-icon{font-size:44px;margin-bottom:16px;display:block;}
.dev-card-title{font-family:'Cormorant Garamond',serif;font-size:18px;color:var(--text);font-weight:500;margin-bottom:6px;}
.dev-card-sub{font-size:11px;color:var(--text-light);letter-spacing:1px;}
.dev-card.detected {
  border-color: var(--rose);
  background: linear-gradient(135deg, #fff 60%, var(--blush));
  box-shadow: 0 8px 32px rgba(212,137,122,0.18);
}
.dev-card-detected-badge {
  display: none; font-size: 9px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--rose); font-weight: 700; margin-top: 6px;
  background: var(--blush-deep); padding: 3px 10px; border-radius: 100px;
  width: fit-content; margin-left: auto; margin-right: auto;
}
.dev-card.detected .dev-card-detected-badge { display: block; }


/* ══════════════════════════════
   LOADER
══════════════════════════════ */
#loader{
  position:fixed;inset:0;z-index:9998;
  background:linear-gradient(160deg,#FDF8F4,#F7E8E0,#FDF8F4);
  display:none;align-items:center;justify-content:center;
  transition:opacity 1s var(--ease),visibility 1s var(--ease);
}
#loader.show{display:flex;}
#loader.out{opacity:0;visibility:hidden;pointer-events:none;}
.ld-content{display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center;transition:transform 1.2s var(--ease),opacity 0.9s var(--ease);}
#loader.out .ld-content{transform:scale(1.3) translateY(-40px);opacity:0;}
.ld-logo-ring{
  width:120px;height:120px;border-radius:50%;
  box-shadow:0 16px 56px rgba(212,137,122,0.45),0 0 0 14px rgba(212,137,122,0.12);
  animation:elegantPulse 2s ease-in-out infinite;
}
.ld-tagline{font-family:'Cormorant Garamond',serif;font-size:13px;font-weight:500;letter-spacing:5px;color:#766353;text-transform:uppercase;}
.ld-dots{display:flex;gap:8px;margin-top:8px;}
.ld-dot{width:6px;height:6px;border-radius:50%;background:var(--rose-light);animation:dotPulse 1.2s ease-in-out infinite;}
.ld-dot:nth-child(2){animation-delay:0.2s;}.ld-dot:nth-child(3){animation-delay:0.4s;}
@keyframes dotPulse{0%,100%{opacity:0.3;transform:scale(1);}50%{opacity:1;transform:scale(1.4);}}

/* ══════════════════════════════
   MAIN APP
══════════════════════════════ */
#mainApp{display:none;}
#mainApp.show{display:block;}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(253,248,244,0.96);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 56px;height:72px;
}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none;}
.nav-logo-db{
  width:44px;height:44px;border-radius:50%;
  box-shadow:0 4px 16px rgba(212,137,122,0.35);flex-shrink:0;
}
.nav-brand-main{font-family:'Cormorant Garamond',serif;font-size:17px;color:var(--text);letter-spacing:1px;display:block;}
.nav-brand-sub{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--text-light);display:block;margin-top:1px;}
.nav-links{display:flex;gap:32px;list-style:none;}
.nav-links a{color:var(--text-light);text-decoration:none;font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:500;transition:color 0.3s;}
.nav-links a:hover{color:var(--rose);}
.nav-right{display:flex;align-items:center;gap:12px;}
.nav-user-chip{display:flex;align-items:center;gap:8px;background:var(--blush);border-radius:100px;padding:6px 14px 6px 6px;font-size:12px;color:var(--text);}
.nav-user-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;background:var(--rose);display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;font-weight:600;}
.cart-pill{background:var(--blush);border:1px solid var(--border);color:var(--text);padding:8px 20px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all 0.3s;display:flex;align-items:center;gap:8px;border-radius:100px;}
.cart-pill:hover{background:var(--rose);color:#fff;border-color:var(--rose);}
.cart-pill-count{background:var(--rose);color:#fff;border-radius:50%;width:18px;height:18px;font-size:10px;display:inline-flex;align-items:center;justify-content:center;}

/* PETALS — faster + more */
.hero-petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.petal{position:absolute;border-radius:50% 0 50% 0;animation:floatPetal 4s ease-in-out infinite;}
@keyframes floatPetal{0%,100%{transform:translateY(0) rotate(0deg);}33%{transform:translateY(-24px) rotate(15deg);}66%{transform:translateY(12px) rotate(-10deg);}}
.petal:nth-child(1){width:72px;height:72px;background:var(--rose);opacity:0.15;top:8%;left:4%;animation-delay:0s;animation-duration:3.5s;}
.petal:nth-child(2){width:44px;height:44px;background:var(--gold);opacity:0.18;top:22%;right:7%;animation-delay:0.5s;animation-duration:4s;}
.petal:nth-child(3){width:90px;height:90px;background:var(--rose-light);opacity:0.14;top:58%;left:2%;animation-delay:1s;animation-duration:3.8s;}
.petal:nth-child(4){width:54px;height:54px;background:var(--gold-light);opacity:0.18;top:72%;right:4%;animation-delay:0.3s;animation-duration:3.2s;}
.petal:nth-child(5){width:36px;height:36px;background:var(--rose);opacity:0.15;top:42%;left:48%;animation-delay:1.5s;animation-duration:4.5s;}
.petal:nth-child(6){width:64px;height:64px;background:var(--blush-deep);opacity:0.2;top:12%;right:22%;animation-delay:0.8s;animation-duration:3.6s;}
.petal:nth-child(7){width:28px;height:28px;background:var(--rose-light);opacity:0.18;top:85%;left:20%;animation-delay:2s;animation-duration:3s;}
.petal:nth-child(8){width:48px;height:48px;background:var(--gold);opacity:0.13;top:35%;right:32%;animation-delay:1.2s;animation-duration:4.2s;}
.petal:nth-child(9){width:38px;height:38px;background:var(--rose);opacity:0.12;top:65%;left:35%;animation-delay:0.6s;animation-duration:3.4s;}
.petal:nth-child(10){width:55px;height:55px;background:var(--blush-deep);opacity:0.16;top:5%;left:55%;animation-delay:1.8s;animation-duration:4.8s;}
.petal:nth-child(11){width:32px;height:32px;background:var(--gold-light);opacity:0.2;top:50%;right:12%;animation-delay:2.2s;animation-duration:3.7s;}
.petal:nth-child(12){width:42px;height:42px;background:var(--rose-light);opacity:0.14;top:90%;right:40%;animation-delay:0.9s;animation-duration:4.1s;}

/* HERO */
.hero{min-height:100vh;padding-top:72px;background:linear-gradient(160deg,#FDF8F4 0%,#F7E8E0 40%,#FDF8F4 80%);display:flex;align-items:center;overflow:hidden;position:relative;}
.hero-inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;width:100%;max-width:1300px;margin:0 auto;padding:60px 56px;position:relative;z-index:1;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:10px;background:var(--blush-deep);padding:8px 20px;border-radius:100px;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--rose);margin-bottom:28px;}
.hero-eyebrow::before{content:'✿';font-size:13px;}
.hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(44px,5.5vw,76px);font-weight:400;line-height:1.1;color:var(--text);margin-bottom:8px;}
.hero-title em{font-style:italic;color:var(--rose);display:block;}
.hero-script{font-family:'Cormorant Garamond',cursive;font-size:clamp(28px,3.5vw,46px);color:var(--gold);margin-bottom:24px;display:block;}
.hero-body{color:var(--text-light);font-size:15px;line-height:1.9;font-weight:300;max-width:480px;margin-bottom:40px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:48px;}
.btn-rose{background:var(--rose);color:#fff;padding:15px 36px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:3px;text-transform:uppercase;text-decoration:none;border:none;cursor:pointer;transition:all 0.3s;border-radius:100px;font-weight:600;display:inline-block;box-shadow:0 8px 24px rgba(212,137,122,0.35);}
.btn-rose:hover{background:var(--brown);transform:translateY(-2px);}
.btn-outline-rose{background:transparent;color:var(--rose);padding:15px 36px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:3px;text-transform:uppercase;text-decoration:none;border:2px solid var(--rose-light);cursor:pointer;transition:all 0.3s;border-radius:100px;font-weight:600;display:inline-block;}
.btn-outline-rose:hover{background:var(--blush);border-color:var(--rose);}
.hero-badges{display:flex;gap:24px;flex-wrap:wrap;}
.badge{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-light);}
.badge-icon{width:32px;height:32px;background:var(--blush-deep);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;}
.hero-visual{position:relative;display:flex;justify-content:center;}
.hero-card-stack{position:relative;width:340px;height:480px;}
.hero-card{position:absolute;border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(139,94,74,0.18);}
.hero-card.main{width:260px;height:380px;top:40px;left:40px;z-index:3;background:linear-gradient(135deg,#F0D5C8,#E8B4A8);}
.hero-card.back1{width:220px;height:320px;top:20px;left:80px;z-index:2;background:linear-gradient(135deg,#F7E8E0,#EDD8CC);transform:rotate(6deg);}
.hero-card.back2{width:200px;height:290px;top:0;left:100px;z-index:1;background:linear-gradient(135deg,#FDF8F4,#F7E8E0);transform:rotate(-4deg);}
.hero-card-content{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;}
.hero-float-badge{position:absolute;bottom:60px;right:0;z-index:10;background:#fff;border-radius:16px;padding:16px 20px;box-shadow:0 12px 40px rgba(139,94,74,0.15);display:flex;align-items:center;gap:12px;border:1px solid var(--border);}
.float-badge-icon{width:40px;height:40px;background:var(--blush);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;}
.float-badge-text p:first-child{font-size:13px;font-weight:600;color:var(--text);}
.float-badge-text p:last-child{font-size:11px;color:var(--text-light);}
.hero-float-badge2{position:absolute;top:30px;right:20px;z-index:10;background:var(--rose);border-radius:12px;padding:12px 18px;box-shadow:0 8px 24px rgba(212,137,122,0.4);color:#fff;text-align:center;}
.float-badge2-num{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600;}
.float-badge2-text{font-size:10px;letter-spacing:2px;text-transform:uppercase;opacity:0.85;margin-top:2px;}

/* MARQUEE */
.marquee-strip{background:linear-gradient(90deg,var(--rose),var(--gold),var(--rose));padding:16px 0;overflow:hidden;}
.marquee-track{display:flex;white-space:nowrap;animation:marquee 25s linear infinite;}
.marquee-track span{color:#fff;font-size:12px;letter-spacing:4px;text-transform:uppercase;padding:0 40px;font-weight:500;}
.marquee-track span::before{content:'✿';margin-right:40px;font-size:10px;}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* SECTIONS */
section{padding:100px 56px;}
.section-eyebrow{display:inline-block;font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--rose);background:var(--blush);padding:6px 18px;border-radius:100px;margin-bottom:16px;}
.section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(30px,4vw,52px);font-weight:400;color:var(--text);line-height:1.2;}
.section-title em{font-style:italic;color:var(--rose);}
.section-script{font-family:'Cormorant Garamond',cursive;font-size:clamp(22px,3vw,36px);color:var(--gold);display:block;margin-top:4px;}
.divider-flower{display:flex;align-items:center;gap:16px;margin:20px 0 48px;}
.divider-flower::before,.divider-flower::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);}
.divider-flower span{color:var(--rose-light);font-size:16px;}
.section-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:20px;}

/* FILTER */
.filter-wrap{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px;}
.filt-btn{background:#fff;border:1.5px solid var(--border);color:var(--text-light);padding:9px 22px;border-radius:100px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all 0.3s;font-weight:500;}
.filt-btn.active,.filt-btn:hover{background:var(--rose);border-color:var(--rose);color:#fff;}

/* PRODUCT GRID */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px;}
.pcard{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 4px 20px rgba(139,94,74,0.08);transition:all 0.4s;position:relative;cursor:pointer;}
.pcard:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(139,94,74,0.16);}
.pcard-img-wrap{position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--blush);}
.pcard-img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform 0.6s ease;}
.pcard:hover .pcard-img{transform:scale(1.05);}
.pcard-badge{position:absolute;top:14px;left:14px;background:rgba(253,248,244,0.92);backdrop-filter:blur(8px);color:var(--rose);font-size:9px;letter-spacing:2px;text-transform:uppercase;padding:5px 14px;border-radius:100px;font-weight:600;}
.stock-badge{position:absolute;top:14px;right:14px;font-size:9px;letter-spacing:2px;text-transform:uppercase;padding:5px 12px;border-radius:100px;font-weight:700;}
.stock-badge.in{background:rgba(37,211,102,0.15);color:#15803d;border:1px solid rgba(37,211,102,0.3);}
.stock-badge.out{background:rgba(239,68,68,0.12);color:#dc2626;border:1px solid rgba(239,68,68,0.25);}
.pcard-info{padding:20px 22px 22px;}
.pcard-tag{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--rose);margin-bottom:6px;font-weight:600;}
.pcard-name{font-family:'Cormorant Garamond',serif;font-size:18px;color:var(--text);margin-bottom:10px;line-height:1.3;}
.pcard-desc{font-size:13px;color:var(--text-light);line-height:1.75;font-weight:300;margin-bottom:16px;}
.pcard-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border);}
.pcard-price{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--text);font-weight:500;}
.pcard-actions{display:flex;gap:8px;}
.add-bag-btn{background:var(--blush);border:1.5px solid var(--border);color:var(--text);padding:10px 16px;border-radius:100px;font-family:'Jost',sans-serif;font-size:14px;cursor:pointer;transition:all 0.3s;}
.add-bag-btn:hover{background:var(--rose);border-color:var(--rose);color:#fff;}
.wa-icon-btn{background:#f0fdf4;border:1.5px solid #bbf7d0;color:var(--green);padding:10px 14px;border-radius:100px;font-size:14px;cursor:pointer;transition:all 0.3s;}
.wa-icon-btn:hover{background:var(--green);color:#fff;border-color:var(--green);}

/* PRODUCT MODAL */
.modal-veil{position:fixed;inset:0;background:rgba(74,55,40,0.6);z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity 0.3s;backdrop-filter:blur(6px);}
.modal-veil.open{opacity:1;pointer-events:all;}
.modal-box{background:#fff;border-radius:28px;max-width:900px;width:100%;max-height:90vh;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;box-shadow:0 30px 80px rgba(74,55,40,0.3);}
.modal-img-side{overflow:hidden;position:sticky;top:0;height:90vh;background:var(--blush);}
.modal-img-side img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;}
.modal-info-side{padding:48px 40px;overflow-y:auto;max-height:90vh;display:flex;flex-direction:column;}
.modal-close-btn{align-self:flex-end;background:var(--blush);border:none;color:var(--text);width:36px;height:36px;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;margin-bottom:16px;flex-shrink:0;}
.modal-close-btn:hover{background:var(--rose);color:#fff;}
.modal-tag{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--rose);font-weight:600;margin-bottom:8px;}
.modal-name{font-family:'Cormorant Garamond',serif;font-size:26px;color:var(--text);font-weight:400;margin-bottom:6px;line-height:1.2;}
.modal-stock{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px 14px;border-radius:100px;margin-bottom:18px;}
.modal-stock.in{background:rgba(37,211,102,0.12);color:#15803d;}
.modal-stock.out{background:rgba(239,68,68,0.1);color:#dc2626;}
.modal-price{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--text);font-weight:500;margin-bottom:18px;}
.modal-desc{font-size:14px;color:var(--text-light);line-height:1.85;font-weight:300;margin-bottom:28px;flex:1;}
.modal-note{background:var(--blush);border-radius:12px;padding:12px 16px;font-size:12px;color:var(--rose);margin-bottom:20px;font-style:italic;}
.modal-btns{display:flex;flex-direction:column;gap:10px;}

/* ABOUT */
.about-section{background:linear-gradient(135deg,#FDF8F4 0%,#F7E8E0 50%,#FDF8F4 100%);}
.about-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.about-visual{display:flex;flex-direction:column;align-items:center;gap:24px;}
.about-logo-big{width:130px;height:130px;border-radius:50%;box-shadow:0 16px 56px rgba(212,137,122,0.4),0 0 0 16px rgba(212,137,122,0.1);}

.about-visual-text{text-align:center;}
.about-visual-text p{font-family:'Cormorant Garamond',cursive;font-size:22px;color:var(--rose);}
.about-visual-text small{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--text-light);}
.about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;width:100%;}
.about-stat{background:#fff;border-radius:16px;padding:20px;text-align:center;box-shadow:0 4px 16px rgba(139,94,74,0.08);}
.about-stat-num{font-family:'Cormorant Garamond',serif;font-size:32px;color:var(--rose);}
.about-stat-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text-light);margin-top:4px;}
.about-body{font-size:16px;line-height:2.0;color:var(--text-light);font-weight:300;margin-top:20px;}
.about-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;}
.apill{background:var(--blush-deep);color:var(--rose);padding:8px 20px;border-radius:100px;font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:600;}
.about-notes{margin-top:28px;display:flex;flex-direction:column;gap:12px;}
.about-note{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--text-light);}
.about-note-icon{width:36px;height:36px;background:var(--blush);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}

/* REVIEWS */
.reviews-section{background:var(--ivory-dark);}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-bottom:60px;}
.rcard{background:#fff;border-radius:20px;padding:32px;box-shadow:0 4px 20px rgba(139,94,74,0.08);border:1px solid var(--border);}
.rcard-quote{font-family:'Cormorant Garamond',serif;font-size:56px;color:var(--rose-light);line-height:0.6;margin-bottom:16px;}
.rcard-stars{color:#F4A261;font-size:16px;margin-bottom:14px;letter-spacing:1px;}
.rcard-text{font-size:14px;line-height:1.85;color:var(--text);font-style:italic;font-weight:300;margin-bottom:20px;}
.rcard-author{font-weight:600;font-size:13px;color:var(--text);}
.rcard-loc{font-size:11px;color:var(--rose);margin-top:3px;}
.rcard-user{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.rcard-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--blush);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--rose);font-weight:600;}

/* HALF-STAR RATING */
.half-star-row{display:flex;gap:4px;margin-bottom:4px;}
.hstar-wrap{position:relative;width:32px;height:32px;cursor:pointer;}
.hstar-bg,.hstar-fg{position:absolute;top:0;left:0;font-size:28px;line-height:1;user-select:none;}
.hstar-bg{color:#E8DDD5;}
.hstar-fg{color:#F4A261;overflow:hidden;white-space:nowrap;}
.hstar-left,.hstar-right{position:absolute;top:0;width:50%;height:100%;z-index:1;}
.hstar-left{left:0;}
.hstar-right{right:0;}
.rating-display{font-size:13px;color:var(--text-light);margin-top:6px;}

/* FEEDBACK FORM */
.feedback-form-section{background:linear-gradient(135deg,#FDF8F4,#F7E8E0);}
.form-card{background:#fff;border-radius:28px;padding:64px;box-shadow:0 16px 60px rgba(139,94,74,0.1);max-width:720px;margin:0 auto;}
.form-subtitle{font-size:15px;color:var(--text-light);line-height:1.8;margin-top:8px;margin-bottom:32px;font-weight:300;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.fgroup{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}
.fgroup.full{grid-column:1/-1;}
.fgroup label{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--text-light);font-weight:600;}
.fgroup input,.fgroup textarea,.fgroup select{
  border:1.5px solid var(--border);background:var(--ivory);color:var(--text);
  padding:14px 18px;border-radius:12px;font-family:'Jost',sans-serif;
  font-size:14px;outline:none;transition:border-color 0.3s,background 0.3s;width:100%;
}
.fgroup textarea{resize:vertical;min-height:120px;border-radius:16px;padding:16px 18px;}
.fgroup input:focus,.fgroup textarea:focus,.fgroup select:focus{border-color:var(--rose);background:#fff;}
.fgroup input::placeholder,.fgroup textarea::placeholder{color:var(--text-light);opacity:0.5;}
.fgroup select{appearance:none;cursor:pointer;}
.upload-zone{border:2px dashed var(--border);border-radius:16px;padding:32px;text-align:center;cursor:pointer;transition:all 0.3s;background:var(--ivory);}
.upload-zone:hover{border-color:var(--rose);background:var(--blush);}
.upload-zone p{color:var(--text-light);font-size:14px;}
.upload-zone small{font-size:11px;color:var(--text-light);opacity:0.6;margin-top:6px;display:block;}
.preview-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.preview-row img{width:72px;height:72px;object-fit:cover;border-radius:10px;border:2px solid var(--border);}
.form-submit{width:100%;background:linear-gradient(135deg,var(--rose),var(--gold));color:#fff;border:none;padding:18px;border-radius:100px;font-family:'Jost',sans-serif;font-size:13px;letter-spacing:3px;text-transform:uppercase;cursor:pointer;font-weight:700;margin-top:28px;transition:all 0.3s;box-shadow:0 8px 28px rgba(212,137,122,0.35);}
.form-submit:hover{transform:translateY(-2px);}
.success-box{display:none;text-align:center;padding:48px 20px;}
.success-box .sicon{font-size:56px;}
.success-box h3{font-family:'Cormorant Garamond',serif;font-size:32px;color:var(--rose);font-weight:400;margin:16px 0 8px;}
.logged-in-note{background:var(--blush);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:12px;margin-bottom:24px;font-size:13px;color:var(--text);}
.logged-in-note-avatar{width:36px;height:36px;border-radius:50%;background:var(--rose);display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;font-weight:600;flex-shrink:0;}

/* CART SIDEBAR */
.cart-veil{position:fixed;inset:0;background:rgba(74,55,40,0.45);z-index:200;opacity:0;pointer-events:none;transition:opacity 0.3s;backdrop-filter:blur(4px);}
.cart-veil.open{opacity:1;pointer-events:all;}
.cart-panel{position:fixed;top:0;right:-500px;width:460px;height:100vh;background:#fff;z-index:201;transition:right 0.4s var(--ease);display:flex;flex-direction:column;overflow:hidden;box-shadow:-20px 0 60px rgba(139,94,74,0.15);}
.cart-panel.open{right:0;}
.cart-panel-head{padding:28px 32px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--ivory);}
.cart-panel-head h2{font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--text);font-weight:400;}
.cart-close-btn{background:var(--blush);border:none;color:var(--text);width:36px;height:36px;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;}
.cart-close-btn:hover{background:var(--rose);color:#fff;}
.cart-body{flex:1;overflow-y:auto;padding:24px 32px;}
.cart-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:16px;color:var(--text-light);}
.cart-item-row{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--border);align-items:flex-start;}
.cart-item-thumb{width:76px;height:96px;object-fit:cover;object-position:top;border-radius:12px;background:var(--blush);flex-shrink:0;}
.cart-item-thumb-placeholder{width:76px;height:96px;border-radius:12px;background:var(--blush);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:24px;}
.citem-info{flex:1;}
.citem-cat{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--rose);font-weight:600;}
.citem-name{font-family:'Cormorant Garamond',serif;font-size:15px;color:var(--text);margin:4px 0;}
.citem-price{font-size:14px;color:var(--rose);font-weight:600;}
.citem-remove{background:var(--blush);border:none;color:var(--text-light);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:all 0.2s;flex-shrink:0;}
.citem-remove:hover{background:#fee2e2;color:#ef4444;}
.cart-foot{padding:24px 32px;border-top:1px solid var(--border);background:var(--ivory);}
.cart-total{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.cart-total-label{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--text-light);}
.cart-total-amount{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--text);font-weight:500;}
.cart-note-txt{font-size:12px;color:var(--text-light);text-align:center;line-height:1.7;margin-bottom:16px;}
.wa-checkout-btn{width:100%;background:linear-gradient(135deg,#25D366,#1da851);color:#fff;border:none;padding:16px;border-radius:100px;font-family:'Jost',sans-serif;font-size:12px;letter-spacing:2px;text-transform:uppercase;cursor:pointer;font-weight:700;transition:all 0.3s;box-shadow:0 6px 20px rgba(37,211,102,0.35);display:flex;align-items:center;justify-content:center;gap:10px;}
.wa-checkout-btn:hover{transform:translateY(-2px);}

/* CONTACT */
.contact-section{background:linear-gradient(135deg,var(--rose) 0%,#C9956A 100%);color:#fff;text-align:center;padding:90px 56px;}
.contact-section .section-title{color:#fff;}
.contact-section .section-script{color:rgba(255,255,255,0.7);}
.contact-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:32px;}
.btn-white{background:#fff;color:var(--rose);padding:15px 36px;border-radius:100px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:3px;text-transform:uppercase;text-decoration:none;font-weight:700;transition:all 0.3s;display:inline-block;box-shadow:0 8px 24px rgba(0,0,0,0.15);}
.btn-white:hover{transform:translateY(-2px);}
.btn-outline-white{background:transparent;color:#fff;padding:15px 36px;border-radius:100px;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:3px;text-transform:uppercase;text-decoration:none;font-weight:700;border:2px solid rgba(255,255,255,0.5);transition:all 0.3s;display:inline-block;}
.btn-outline-white:hover{background:rgba(255,255,255,0.15);border-color:#fff;}
.contact-policy{display:flex;gap:32px;justify-content:center;flex-wrap:wrap;margin-top:40px;}
.contact-policy-item{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,0.75);}

/* FOOTER */
footer{background:var(--text);color:rgba(245,235,228,0.6);padding:60px 56px 32px;}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;margin-bottom:48px;}
.footer-brand-logo{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.footer-db-circle{width:44px;height:44px;border-radius:50%;flex-shrink:0;}
.footer-brand-name{font-family:'Cormorant Garamond',serif;font-size:20px;color:#fff;}
.footer-brand-p{font-size:13px;line-height:1.8;font-weight:300;color:rgba(245,235,228,0.45);}
.footer-col-title{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--rose-light);margin-bottom:20px;font-weight:600;}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:10px;}
.footer-col ul a{color:rgba(245,235,228,0.45);text-decoration:none;font-size:13px;transition:color 0.2s;}
.footer-col ul a:hover{color:var(--rose-light);}
.footer-bottom{border-top:1px solid rgba(245,235,228,0.1);padding-top:24px;display:flex;justify-content:space-between;font-size:11px;flex-wrap:wrap;gap:10px;}

/* WA FLOAT */
.wa-float{position:fixed;bottom:32px;right:32px;z-index:150;background:var(--green);color:#fff;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;text-decoration:none;box-shadow:0 6px 24px rgba(37,211,102,0.45);transition:all 0.3s;}
.wa-float:hover{transform:scale(1.12);}

/* TOAST */
.toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:var(--text);color:var(--gold-light);padding:14px 28px;border-radius:100px;font-size:13px;z-index:999;white-space:nowrap;box-shadow:0 8px 32px rgba(74,55,40,0.3);transition:opacity 0.3s;}

/* FADE-IN */
.fade-up{opacity:0;transform:translateY(30px);transition:opacity 0.7s ease,transform 0.7s ease;}
.fade-up.in{opacity:1;transform:translateY(0);}

/* ══════════════════════════════
   MOBILE OVERRIDES
══════════════════════════════ */
.mobile-view .hero-inner{grid-template-columns:1fr;text-align:center;padding:40px 20px;}
.mobile-view .hero-visual{display:none;}
.mobile-view .hero-badges{justify-content:center;}
.mobile-view .hero-ctas{justify-content:center;}
.mobile-view .about-inner{grid-template-columns:1fr;}
.mobile-view .footer-top{grid-template-columns:1fr;}
.mobile-view .modal-box{grid-template-columns:1fr;max-height:90vh;overflow-y:auto;}
.mobile-view .modal-img-side{aspect-ratio:3/2;height:auto;position:relative;}
.mobile-view .cart-panel{width:100%;right:-100%;}
.mobile-view .cart-panel.open{right:0;}
.mobile-view .contact-section{padding:70px 20px;}
.mobile-view .marquee-track span{font-size:10px;padding:0 24px;}

/* ── Mobile Nav ── */
.mobile-view nav {
  padding: 0 16px;
  height: 60px;
}
.mobile-view .nav-links { display: none; }
.mobile-view .nav-right { gap: 8px; }

/* Hide bag button in nav on mobile — it lives in profile instead */
.mobile-view #mobileHideBag { display: none !important; }

/* Mobile profile button — compact pill */
.mobile-view #profileNavBtn {
  padding: 6px 12px;
  font-size: 10px;
  gap: 5px;
}
.mobile-view #profileNavBtn span:first-child {
  width: 22px; height: 22px; font-size: 10px;
}

/* ── Mobile Sections ── */
.mobile-view section { padding: 48px 16px; }
.mobile-view .form-card { padding: 28px 16px; }
.mobile-view .form-grid { grid-template-columns: 1fr; }

/* ── Mobile Product Grid ── */
.mobile-view .product-grid {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.mobile-view .pcard { border-radius: 14px; }
.mobile-view .pcard-img-wrap { aspect-ratio: 3/4; }
.mobile-view .pcard-info { padding: 12px 12px 14px; }
.mobile-view .pcard-tag { font-size: 8px; letter-spacing: 2px; margin-bottom: 4px; }
.mobile-view .pcard-name {
  font-size: 13px; margin-bottom: 0; line-height: 1.3;
  /* clamp to 2 lines */
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mobile-view .pcard-desc { display: none; }
.mobile-view .pcard-foot {
  margin-top: 10px; padding-top: 10px;
  flex-direction: column; align-items: flex-start; gap: 8px;
}
.mobile-view .pcard-price { font-size: 16px; }
.mobile-view .pcard-actions { width: 100%; justify-content: space-between; }
.mobile-view .add-bag-btn { padding: 8px 10px; font-size: 13px; flex: 1; text-align: center; }
.mobile-view .wa-icon-btn { padding: 8px 10px; font-size: 13px; }

/* Stock badge smaller on mobile */
.mobile-view .stock-badge { font-size: 7px; padding: 3px 8px; }
/* Bug-4 fix: move category badge to bottom-right so it doesn't overlap the stock badge */
.mobile-view .pcard-badge { font-size: 7px; padding: 3px 8px; top: auto; left: auto; bottom: 10px; right: 10px; }

/* ── Mobile Filter ── */
.mobile-view .filter-wrap {
  gap: 6px; flex-wrap: nowrap; overflow-x: auto;
  padding-bottom: 8px; scrollbar-width: none; margin-bottom: 28px;
}
.mobile-view .filter-wrap::-webkit-scrollbar { display: none; }
.mobile-view .filt-btn { padding: 7px 14px; font-size: 10px; white-space: nowrap; flex-shrink: 0; }

/* ── Mobile Bag inside Profile ── */
.mobile-bag-section {
  display: none;
  border-top: 1px solid var(--border);
  padding: 20px 32px;
}
.mobile-view .mobile-bag-section { display: block; }
.mobile-bag-title {
  font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--text-light); font-weight: 600; margin-bottom: 14px;
}
.mobile-bag-open-btn {
  width: 100%; background: var(--blush); border: 1.5px solid var(--border);
  color: var(--text); padding: 13px; border-radius: 100px;
  font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: 2px;
  text-transform: uppercase; cursor: pointer; transition: all 0.3s; font-weight: 600;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.mobile-bag-open-btn:hover { background: var(--rose); color: #fff; border-color: var(--rose); }
.mobile-bag-count-badge {
  background: var(--rose); color: #fff; border-radius: 50%;
  width: 18px; height: 18px; font-size: 10px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* ── Mobile Hero ── */
.mobile-view .hero { min-height: auto; padding-top: 60px; }
.mobile-view .hero-title { font-size: clamp(34px, 9vw, 52px); }
.mobile-view .hero-body { font-size: 14px; }

/* ── Mobile About ── */
.mobile-view .about-stats { grid-template-columns: repeat(3,1fr); gap: 10px; }
.mobile-view .about-stat { padding: 14px 10px; }
.mobile-view .about-stat-num { font-size: 24px; }

/* ── Mobile Modal ── */
.mobile-view .modal-info-side { padding: 28px 24px; }
.mobile-view .modal-name { font-size: 20px; }
.mobile-view .modal-price { font-size: 22px; }

/* ── Mobile Device Screen ── */
.mobile-view .dev-cards { flex-direction: column; align-items: center; gap: 12px; }
.mobile-view .dev-card { width: 80%; padding: 22px 20px; display: flex; align-items: center; gap: 16px; text-align: left; flex-direction: row; }
.mobile-view .dev-card-icon { font-size: 32px; margin-bottom: 0; flex-shrink: 0; }

/* ── Mobile WA float — keep above bottom bar ── */
.mobile-view .wa-float { bottom: 24px; right: 20px; width: 50px; height: 50px; font-size: 22px; }

/* ── Mobile Footer ── */
.mobile-view footer { padding: 48px 20px 28px; }
.mobile-view .footer-bottom { flex-direction: column; text-align: center; gap: 6px; }


/* RESPONSIVE BASE */
@media(max-width:900px){
  nav{padding:0 20px;}
  .nav-links{display:none;}
  section{padding:70px 20px;}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;}
  .about-inner{grid-template-columns:1fr;}
  /* Bug-5 fix: modal becomes scrollable column on tablet — img must not be 90vh */
  .modal-box{grid-template-columns:1fr;max-height:90vh;overflow-y:auto;}
  .modal-img-side{height:auto;position:relative;aspect-ratio:3/2;}
  .footer-top{grid-template-columns:1fr;}
  .form-card{padding:36px 24px;}
  .form-grid{grid-template-columns:1fr;}
  /* Bug-2 fix: cart must slide fully in on tablet */
  .cart-panel{width:100%;right:-100%;}
  .cart-panel.open{right:0;}
  .hero-inner{grid-template-columns:1fr;text-align:center;padding:40px 20px;}
  .hero-visual{display:none;}
  .hero-badges,.hero-ctas{justify-content:center;}
}
@media(max-width:500px){
  .product-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .pcard-name{font-size:14px;}
  .pcard-desc{display:none;}
}
/* ══════════════════════════════
   PROFILE, LOGOUT & LOGIN WALL MODALS
══════════════════════════════ */
.profile-veil {
  position: fixed; inset: 0; background: rgba(74,55,40,0.6); z-index: 300;
  opacity: 0; pointer-events: none; transition: opacity 0.3s; backdrop-filter: blur(6px);
}
.profile-veil.open { opacity: 1; pointer-events: all; }

#profilePanel {
  position: fixed; top: 0; right: -400px; width: 340px; height: 100vh;
  background: #fff; z-index: 301; transition: right 0.4s var(--ease);
  box-shadow: -20px 0 60px rgba(139,94,74,0.15); display: flex; flex-direction: column;
}
#profilePanel.open { right: 0; }
.profile-head { padding: 32px; background: var(--ivory); border-bottom: 1px solid var(--border); text-align: center; }
.profile-name { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: var(--text); margin-top: 12px; }
.profile-email { font-size: 12px; color: var(--text-light); margin-top: 4px; }
.profile-rows { padding: 24px 32px; display: flex; flex-direction: column; gap: 16px; }
.profile-row { display: flex; align-items: center; justify-content: space-between; cursor: pointer; padding: 12px 0; border-bottom: 1px dashed var(--border); transition: all 0.2s; }
.profile-row:hover .profile-row-text p:first-child { color: var(--rose); }
.profile-row.logout:hover .profile-row-text p:first-child { color: #dc2626; }
.profile-row-left { display: flex; align-items: center; gap: 16px; }
.profile-row-icon { font-size: 20px; }
.profile-row-text p:first-child { font-size: 14px; font-weight: 600; color: var(--text); transition: color 0.2s; }
.profile-row-text p:last-child { font-size: 11px; color: var(--text-light); margin-top: 4px; }
.profile-row-arrow { font-size: 18px; color: var(--text-light); }

.logout-confirm, .login-wall {
  position: fixed; inset: 0; background: rgba(74,55,40,0.6); z-index: 10000;
  display: none; align-items: center; justify-content: center; backdrop-filter: blur(6px);
}
.logout-confirm.open, .login-wall.open { display: flex; }
.logout-box, .login-wall-box {
  background: #fff; border-radius: 24px; padding: 40px; text-align: center;
  max-width: 400px; width: 90%; box-shadow: 0 20px 60px rgba(139,94,74,0.2);
}
.logout-emoji, .login-wall-icon { font-size: 48px; margin-bottom: 16px; }
.logout-title, .login-wall-title { font-family: 'Cormorant Garamond', serif; font-size: 26px; color: var(--text); margin-bottom: 12px; }
.logout-body, .login-wall-body { font-size: 14px; color: var(--text-light); line-height: 1.6; }
.logout-btns { display: flex; gap: 12px; margin-top: 24px; justify-content: center; }
.logout-btn-no, .logout-btn-yes, .login-wall-btn {
  padding: 12px 24px; border-radius: 100px; font-family: 'Jost', sans-serif;
  font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase;
  cursor: pointer; transition: all 0.3s; border: none;
}
.logout-btn-no { background: var(--blush); color: var(--text); }
.logout-btn-no:hover { background: var(--border); }
.logout-btn-yes { background: #fee2e2; color: #dc2626; }
.logout-btn-yes:hover { background: #ef4444; color: #fff; }

.login-wall-btn { background: #4285F4; color: #fff; width: 100%; margin-top: 24px; display: flex; justify-content: center; align-items: center; gap: 10px; }
.login-wall-btn:hover { background: #3367D6; }
.login-wall-close { margin-top: 16px; font-size: 12px; color: var(--text-light); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.login-wall-close:hover { color: var(--rose); }

/* ══════════════════════════════
   ORDER CONFIRMATION MODAL
══════════════════════════════ */
.order-veil {
  position: fixed; inset: 0; background: rgba(74,55,40,0.65); z-index: 10002;
  display: none; align-items: center; justify-content: center;
  backdrop-filter: blur(8px); padding: 20px;
}
.order-veil.open { display: flex; }
.order-box {
  background: #fff; border-radius: 28px; max-width: 480px; width: 100%;
  box-shadow: 0 30px 80px rgba(139,94,74,0.25); overflow: hidden;
}
.order-box-top {
  background: linear-gradient(135deg, var(--blush), var(--ivory-dark));
  padding: 40px 40px 32px; text-align: center; border-bottom: 1px solid var(--border);
}
.order-success-icon { font-size: 56px; margin-bottom: 12px; display: block; }
.order-success-title {
  font-family: 'Cormorant Garamond', serif; font-size: 26px; color: var(--text);
  font-weight: 400; margin-bottom: 8px;
}
.order-success-title em { color: var(--rose); font-style: italic; }
.order-success-sub {
  font-size: 13px; color: var(--text-light); line-height: 1.8; font-weight: 300;
}
.order-box-body { padding: 28px 40px 36px; }
.order-detail-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0; border-bottom: 1px dashed var(--border); font-size: 13px;
}
.order-detail-row:last-of-type { border-bottom: none; }
.order-detail-label { color: var(--text-light); font-weight: 300; }
.order-detail-val { color: var(--text); font-weight: 600; }
.order-note-box {
  background: var(--blush); border-radius: 14px; padding: 16px 20px;
  margin: 20px 0 0; font-size: 12px; color: var(--brown); line-height: 1.8;
  font-style: italic;
}
.order-close-btn {
  width: 100%; margin-top: 20px; background: linear-gradient(135deg, var(--rose), var(--gold));
  color: #fff; border: none; padding: 16px; border-radius: 100px;
  font-family: 'Jost', sans-serif; font-size: 12px; letter-spacing: 2px;
  text-transform: uppercase; font-weight: 700; cursor: pointer;
  transition: all 0.3s; box-shadow: 0 6px 20px rgba(212,137,122,0.3);
}
.order-close-btn:hover { transform: translateY(-2px); }

/* Qty selector in modal */
.qty-row {
  display: flex; align-items: center; gap: 12px; margin: 16px 0;
}
.qty-label { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-light); font-weight: 600; }
.qty-ctrl {
  display: flex; align-items: center; gap: 0; border: 1.5px solid var(--border);
  border-radius: 100px; overflow: hidden; background: var(--ivory);
}
.qty-btn {
  background: none; border: none; width: 36px; height: 36px; font-size: 18px;
  cursor: pointer; color: var(--text); transition: all 0.2s; font-weight: 300;
  display: flex; align-items: center; justify-content: center;
}
.qty-btn:hover { background: var(--blush); color: var(--rose); }
.qty-val {
  min-width: 36px; text-align: center; font-family: 'Cormorant Garamond', serif;
  font-size: 16px; color: var(--text); font-weight: 500;
}

/* ══════════════════════════════
   CONTACT BUTTONS (from terms.html)
══════════════════════════════ */
.contact-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 28px; border-radius: 100px;
  font-family: 'Jost', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase; text-decoration: none;
  transition: all 0.3s var(--ease); cursor: pointer; border: none;
}
.contact-btn-wa { background: var(--green); color: #fff; }
.contact-btn-wa:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(37,211,102,0.3); }
.contact-btn-ig { background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); color: #fff; }
.contact-btn-ig:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(220,39,67,0.3); }

/* ══════════════════════════════
   MOBILE MODAL — STICKY ACTION BUTTONS
══════════════════════════════ */
.modal-sticky-actions {
  display: none;
}
.mobile-view .modal-sticky-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: sticky;
  bottom: 0;
  background: #fff;
  padding: 16px;
  border-top: 1px solid var(--border);
  z-index: 10;
  margin: 0 -24px -28px;
}
.mobile-view .modal-btns {
  display: none;
}

/* ══════════════════════════════
   SMALL SCREEN — SIGN-IN & DEVICE PICKER
══════════════════════════════ */
@media (max-width: 480px) {
  /* Sign-in screen — scrollable, compact box */
  #gSignInScreen {
    align-items: flex-start;
    padding: 16px;
    overflow-y: auto;
  }
  .gsign-box {
    padding: 32px 24px 40px;
    border-radius: 24px;
    margin: auto;
    width: 100%;
  }
  .gsign-logo {
    width: 80px;
    height: 80px;
    margin-bottom: 16px;
  }
  .gsign-title { font-size: 22px; }
  .gsign-script { font-size: 17px; margin-bottom: 14px; }
  .gsign-body { font-size: 12px; margin-bottom: 24px; }
  .gsign-divider { margin-bottom: 18px; }
  .gsign-badges { gap: 12px; flex-wrap: wrap; }
  .gsign-badge { font-size: 10px; }

  /* Device picker — scrollable, compact */
  #deviceScreen {
    align-items: flex-start;
    padding: 20px 16px;
    overflow-y: auto;
  }
  .dev-inner {
    padding: 12px 0 32px;
    width: 100%;
  }
  .dev-user-name { font-size: 26px; margin-bottom: 4px; }
  .dev-script { font-size: 18px; margin-bottom: 8px; }
  .dev-subtitle { margin-bottom: 24px; }
  .dev-question { font-size: 15px; margin-bottom: 20px; }
  .dev-cards {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .dev-card {
    width: 100%;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    text-align: left;
    border-radius: 18px;
  }
  .dev-card-icon { font-size: 28px; margin-bottom: 0; flex-shrink: 0; }
  .dev-card-title { font-size: 16px; margin-bottom: 2px; }
  .dev-card-sub { font-size: 10px; }
  .dev-note { font-size: 11px; margin-top: 20px; padding: 0 8px; }

  /* Loader — compact */
  .ld-logo-ring { width: 90px; height: 90px; }
  .ld-tagline { font-size: 11px; letter-spacing: 3px; }

  /* Intro — compact */
  .intro-logo { width: 100px; height: 100px; }
  .intro-sub { font-size: 18px; }
}

/* ══════════════════════════════
   ORDER FREEZE OVERLAY
══════════════════════════════ */
/* ══════════════════════════════
   ORDER FREEZE OVERLAY — all screen sizes
══════════════════════════════ */
#orderFreezeOverlay {
  position: fixed;
  inset: 0;
  background: rgba(74, 55, 40, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: all;
  padding: 24px;
}
#orderFreezeOverlay.active {
  display: flex;
}
.freeze-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
  width: 100%;
  max-width: 320px;
}
.freeze-spinner {
  width: 60px;
  height: 60px;
  border: 3.5px solid rgba(253, 248, 244, 0.25);
  border-top-color: var(--rose-light);
  border-radius: 50%;
  animation: freezeSpin 0.85s linear infinite;
  flex-shrink: 0;
}
@keyframes freezeSpin {
  to { transform: rotate(360deg); }
}
.freeze-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  color: #fff;
  font-weight: 400;
  line-height: 1.3;
}
.freeze-sub {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  letter-spacing: 1px;
  line-height: 1.6;
}

/* Tablet */
@media (max-width: 900px) {
  .freeze-spinner { width: 54px; height: 54px; }
  .freeze-text { font-size: 18px; }
}

/* Mobile */
@media (max-width: 500px) {
  #orderFreezeOverlay { padding: 16px; }
  .freeze-inner { gap: 16px; max-width: 280px; }
  .freeze-spinner { width: 46px; height: 46px; border-width: 3px; }
  .freeze-text { font-size: 17px; }
  .freeze-sub { font-size: 11px; }
}

/* mobile-view class (device-picker selected mobile) */
.mobile-view #orderFreezeOverlay { padding: 16px; }
.mobile-view .freeze-inner { gap: 14px; max-width: 260px; }
.mobile-view .freeze-spinner { width: 44px; height: 44px; border-width: 3px; }
.mobile-view .freeze-text { font-size: 16px; }
.mobile-view .freeze-sub { font-size: 11px; }