/* ===== Premium layer: bloom, depth, 3D, scroll motion ===== */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.06;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--rose),var(--brown));z-index:120}
.site-header{transition:padding .35s,box-shadow .35s,background .35s}
.site-header.scrolled{padding-block:.3rem;box-shadow:0 12px 30px -18px rgba(63,34,20,.55);background:rgba(251,249,193,.82)}
.site-header .brand img{transition:transform .6s}
.site-header .brand:hover img{transform:rotate(180deg)}

/* hero depth + bloom */
.hero{--px:0;--py:0;--gx:70%;--gy:40%;perspective:1400px;box-shadow:0 40px 80px -40px rgba(63,34,20,.6)}
.hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(520px circle at var(--gx) var(--gy),rgba(222,180,158,.34),transparent 62%);mix-blend-mode:screen;transition:background .15s}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.slide{z-index:2}
.hero-ui{z-index:5}
.slide-art{transform-style:preserve-3d;transform:rotateY(calc(var(--px)*9deg)) rotateX(calc(var(--py)*-7deg));transition:transform .25s ease-out}
.slide-art::before{content:"";position:absolute;width:75%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(251,249,193,.5),rgba(216,172,151,.25) 40%,transparent 70%);filter:blur(34px);animation:breathe 6s ease-in-out infinite;translate:calc(var(--px)*-26px) calc(var(--py)*-20px)}
@keyframes breathe{50%{scale:1.18;opacity:.65}}
.spin{translate:calc(var(--px)*22px) calc(var(--py)*16px);transition:translate .25s ease-out;filter:drop-shadow(0 0 30px rgba(251,249,193,.35)) drop-shadow(0 24px 30px rgba(0,0,0,.35))}
.ring{translate:calc(var(--px)*-14px) calc(var(--py)*-10px);transition:translate .3s ease-out}
.r2{translate:calc(var(--px)*-30px) calc(var(--py)*-20px)}
.pouch-big{filter:drop-shadow(0 30px 28px rgba(0,0,0,.4)) drop-shadow(0 0 40px rgba(251,249,193,.18))}
.slide.active .slide-copy h1,.slide.active .slide-copy h2{background:linear-gradient(100deg,var(--cream) 30%,#fff 50%,var(--cream) 70%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:rise .8s both,sheen 5s 1s ease-in-out infinite}
.slide.active .slide-copy h1 em,.slide.active .slide-copy h2 em{-webkit-text-fill-color:var(--rose-2)}
@keyframes sheen{to{background-position:-150% 0}}

/* buttons */
.btn,.add{position:relative;overflow:hidden;isolation:isolate}
.btn::after,.add::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);translate:-120% 0;transition:translate .7s}
.btn:hover::after,.add:hover::after{translate:120% 0}
.btn,.add,.cart-btn,.wa-float{transition:transform .25s,box-shadow .25s,background .25s,translate .2s ease-out}
.btn:hover{box-shadow:0 10px 0 -4px var(--rose),0 14px 30px -8px rgba(92,52,33,.5)}
.slide .btn:hover{box-shadow:0 0 34px rgba(251,249,193,.55)}
.cart-btn{box-shadow:0 8px 20px -8px rgba(92,52,33,.7)}

/* stats */
.stats{max-width:1100px;margin:2.8rem auto 0;padding:0 clamp(1rem,4vw,3rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;text-align:center}
.stats div{padding:1.1rem .5rem;border-radius:var(--r);background:var(--paper);border:1px solid rgba(92,52,33,.12);transition:transform .35s,box-shadow .35s}
.stats div:hover{transform:translateY(-5px);box-shadow:0 20px 40px -22px rgba(92,52,33,.5),0 0 40px rgba(216,172,151,.35)}
.stats b{display:block;font-family:var(--serif);font-weight:800;font-size:clamp(2.1rem,4vw,3rem);color:var(--brown);line-height:1}
.stats span{font-size:.85rem;opacity:.75}

/* 3D tilt cards + glare */
.card,.tile,.why-card{--rx:0deg;--ry:0deg;--mx:50%;--my:50%;transform-style:preserve-3d;will-change:transform}
.card.reveal.in,.tile.reveal.in,.why-card.reveal.in{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--ty,0px));transition:opacity .8s,transform .18s ease-out,box-shadow .35s,background .35s;transition-delay:0s}
.card.reveal:not(.in),.tile.reveal:not(.in),.why-card.reveal:not(.in){transition-delay:var(--d,0s)}
.card:hover,.tile:hover,.why-card:hover{--ty:-8px}
.card::after,.tile::before,.why-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(255,255,255,.55),transparent 60%);mix-blend-mode:soft-light;z-index:3}
.card{position:relative}
.why-card{position:relative;overflow:hidden}
.card:hover::after,.tile:hover::before,.why-card:hover::after{opacity:1}
.card:hover{box-shadow:0 40px 60px -30px rgba(63,34,20,.55),0 0 60px rgba(216,172,151,.35)}
.card-art .pouch{transform:translateZ(40px);filter:drop-shadow(0 18px 14px rgba(63,34,20,.28));transition:transform .5s,filter .5s}
.card:hover .pouch{transform:translateZ(70px) rotate(-5deg) scale(1.08);filter:drop-shadow(0 30px 20px rgba(63,34,20,.35))}
.card-art::before{content:"";position:absolute;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--glow,rgba(216,172,151,.5)),transparent 68%);filter:blur(22px);opacity:0;transition:opacity .5s}
.card:hover .card-art::before{opacity:1}
.tile{overflow:hidden}
.tile::after{content:"";position:absolute;width:260px;aspect-ratio:1;left:var(--mx);top:var(--my);translate:-50% -50%;background:radial-gradient(circle,rgba(251,249,193,.28),transparent 65%);filter:blur(10px);opacity:0;transition:opacity .3s;pointer-events:none}
.tile:hover::after{opacity:1}

/* headings: masked word reveal */
.sec-head h2 .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em}
.sec-head h2 .w>span{display:inline-block;transform:translateY(110%) rotate(4deg);transition:transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i)*70ms)}
.sec-head.in h2 .w>span{transform:none}
.sec-head .eyebrow{transition:letter-spacing 1.2s,opacity 1.2s}
.sec-head:not(.in) .eyebrow{letter-spacing:.6em;opacity:0}

/* steps line draw */
.steps li{border-top:0}
.steps li::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--brown);transform:scaleX(0);transform-origin:left;transition:transform 1.1s .2s cubic-bezier(.2,.8,.2,1)}
.steps li.in::after{transform:scaleX(1)}
.steps li::before{transition:transform .6s,color .4s}
.steps li:hover::before{transform:scale(1.15) rotate(-6deg);color:var(--brown)}

/* story bloom + rings */
.story::before{content:"";position:absolute;width:620px;aspect-ratio:1;left:-140px;top:50%;translate:0 -50%;background:radial-gradient(circle,rgba(216,172,151,.45),transparent 65%);filter:blur(50px);animation:breathe 7s ease-in-out infinite}
.story-inner{position:relative}
.logo-wrap{position:relative;display:grid;place-items:center;padding:34px}
.lr{position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(222,180,158,.55)}
.lr2{inset:-18px;border-style:dotted;opacity:.6}
.story-logo{position:relative;box-shadow:0 0 0 10px rgba(216,172,151,.25),0 0 0 22px rgba(216,172,151,.12),0 0 80px rgba(251,249,193,.35)}
.bulk{position:relative;overflow:hidden}
.bulk::before{content:"";position:absolute;width:480px;aspect-ratio:1;right:-120px;top:-160px;background:radial-gradient(circle,rgba(251,249,193,.3),transparent 65%);filter:blur(40px);pointer-events:none}
.bulk>*{position:relative}

/* ghost stars (parallax) */
.sec{position:relative}
.gstar{position:absolute;width:clamp(160px,22vw,300px);color:var(--brown);opacity:.06;pointer-events:none;z-index:-1}
.gstar.l{left:-70px;top:40px}.gstar.r{right:-80px;bottom:30px}

/* fly to cart */
.fly{position:fixed;z-index:300;pointer-events:none;width:70px;transition:transform .8s cubic-bezier(.5,0,.8,.4),opacity .8s;filter:drop-shadow(0 10px 10px rgba(0,0,0,.3))}

/* reviews + faq polish */
.rev{transition:transform .35s,box-shadow .35s}
.rev:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 24px 40px -24px rgba(63,34,20,.5),0 0 40px rgba(216,172,151,.3)}
.rev .stars{text-shadow:0 0 14px rgba(216,172,151,.9)}
.rev-score{box-shadow:0 30px 50px -28px rgba(63,34,20,.7),inset 0 0 60px rgba(216,172,151,.15)}
.rev-score .stars{text-shadow:0 0 18px rgba(222,180,158,.8)}
.wa-float{transition:transform .3s}
.wa-float:hover{transform:scale(1.12) rotate(-8deg)}

@media(hover:none){.card,.tile,.why-card{--rx:0deg!important;--ry:0deg!important}}
@media(prefers-reduced-motion:reduce){.sec-head h2 .w>span{transform:none}.hero canvas{display:none}.slide-art{transform:none}}

/* ===== Dark mode ===== */
:root{color-scheme:light}
:root[data-theme=dark]{color-scheme:dark;--cream:#1c0f09;--cream-2:#2a190f;--paper:#2a1a10;--ink:#f3ead0;--brown:#e6bba4;--brown-2:#120a05;--rose:#b98770;--rose-2:#deb49e;--shadow:0 18px 40px -18px rgba(0,0,0,.8)}
/* panels that stay brown/coloured keep the light-theme palette inside */
:root[data-theme=dark] :is(.hero,.story,.tile,.bulk,.rev-score,.footer,.announce){--cream:#fbf9c1;--brown:#5c3421;--brown-2:#3f2214;--rose:#d8ac97;--ink:#2b170d}
:root[data-theme=dark] .hero{--brown:#4a2616}
:root[data-theme=dark] .story{--brown:#4a2616}
:root[data-theme=dark] .footer,:root[data-theme=dark] .announce{--brown-2:#120a05}
:root[data-theme=dark] body::after{mix-blend-mode:screen;opacity:.035}
:root[data-theme=dark] .site-header,:root[data-theme=dark] .site-header.scrolled{background:rgba(28,15,9,.82);border-bottom-color:rgba(230,187,164,.18)}
@media(max-width:860px){:root[data-theme=dark] .nav{background:var(--cream)}}
:root[data-theme=dark] input,:root[data-theme=dark] select,:root[data-theme=dark] textarea{background:#22130b;color:var(--ink);border-color:rgba(230,187,164,.35)}
:root[data-theme=dark] .bulk-form input{background:#fbf9c1;color:#2b170d}
:root[data-theme=dark] .card-art{background:radial-gradient(circle at 50% 40%,#4a2c1b 0,#2a190f 72%)}
:root[data-theme=dark] .card,:root[data-theme=dark] .why-card,:root[data-theme=dark] .rev,:root[data-theme=dark] .stats div,:root[data-theme=dark] .rev-form{border-color:rgba(230,187,164,.16)}
:root[data-theme=dark] .why-card:hover{background:#3b2314}
:root[data-theme=dark] .why-card .num{color:#7d5441}
:root[data-theme=dark] .chip{color:#2b170d}
:root[data-theme=dark] .star-input button{color:#6b4a3a}
:root[data-theme=dark] .star-input button.on{color:var(--rose-2)}
:root[data-theme=dark] .gstar{color:var(--rose-2);opacity:.07}
:root[data-theme=dark] .progress{background:linear-gradient(90deg,#5c3421,var(--rose-2))}
:root[data-theme=dark] .sizes button{border-color:rgba(230,187,164,.35)}
:root[data-theme=dark] .free i{background:rgba(230,187,164,.18)}
:root[data-theme=dark] .free u{background:#8a9a4a}
:root[data-theme=dark] .scrim{background:rgba(0,0,0,.65)}
:root[data-theme=dark] .rev-score .stars{color:var(--rose-2)}
:root[data-theme=dark] .btn:hover{box-shadow:0 10px 0 -4px #6b4a3a,0 14px 30px -8px rgba(0,0,0,.6)}
:root[data-theme=dark] .hero{box-shadow:0 40px 80px -40px rgba(0,0,0,.9),0 0 0 1px rgba(230,187,164,.12)}

.theme-btn{position:relative;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--brown);background:transparent;color:var(--brown);display:grid;place-items:center;cursor:pointer;overflow:hidden;transition:background .3s,color .3s,transform .3s}
.theme-btn:hover{background:var(--brown);color:var(--cream)}
.theme-btn svg{position:absolute;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s}
.theme-btn .i-sun{transform:translateY(130%) rotate(-90deg);opacity:0}
:root[data-theme=dark] .theme-btn .i-sun{transform:none;opacity:1}
:root[data-theme=dark] .theme-btn .i-moon{transform:translateY(-130%) rotate(90deg);opacity:0}
html.theme-anim,html.theme-anim *{transition:background-color .5s,color .5s,border-color .5s,fill .5s!important}

/* ===== Seamless announcement loop ===== */
.announce-track{display:flex;width:max-content;padding:0;gap:0;animation:marq var(--dur,40s) linear infinite;will-change:transform}
.m-group{display:flex;flex:none;align-items:center;gap:1.6rem;padding:.55rem 1.6rem .55rem 0}
.m-group i{font-style:normal;color:var(--rose)}
.announce:hover .announce-track{animation-play-state:paused}
@keyframes marq{to{transform:translate3d(calc(var(--w,50%) * -1),0,0)}}
@media(prefers-reduced-motion:reduce){.announce-track{animation:none}.m-group:not(:first-child){display:none}}

/* ===== Language toggle + Kannada typography ===== */
.lang-btn{height:46px;padding:0 1rem;border-radius:999px;border:1.5px solid var(--brown);background:transparent;color:var(--brown);font-weight:600;cursor:pointer;transition:background .3s,color .3s;white-space:nowrap}
.lang-btn:hover{background:var(--brown);color:var(--cream)}
:root{--serif:'Fraunces','Noto Serif Kannada',Georgia,serif;--sans:'Hind Madurai','Noto Sans Kannada',system-ui,sans-serif}
html[lang=kn] h1,html[lang=kn] h2,html[lang=kn] h3{line-height:1.3;letter-spacing:0;font-weight:700}
html[lang=kn] .slide h1,html[lang=kn] .slide h2{font-size:clamp(2rem,4.6vw,3.9rem)}
html[lang=kn] .eyebrow,html[lang=kn] .brand small,html[lang=kn] .badge,html[lang=kn] .chip{letter-spacing:.02em;text-transform:none}
html[lang=kn] .sec-head:not(.in) .eyebrow{letter-spacing:.3em}
html[lang=kn] body{line-height:1.75}
html[lang=kn] .card .kn{font-size:.8rem}
html[lang=kn] .steps b,html[lang=kn] summary{font-weight:700}
html[lang=kn] .stats span{line-height:1.5}
@media(max-width:560px){
  .brand span small{display:none}
  .brand img{width:40px;height:40px}.brand{font-size:1.15rem}
  .theme-btn,.cart-btn{width:38px;height:38px}
  .lang-btn{height:38px;padding:0 .7rem;font-size:.85rem}
  .head-actions{gap:.35rem}
  .site-header{gap:.5rem;padding-inline:.8rem}
}

/* ===== Delivery location picker ===== */
.loc-row{display:flex;flex-wrap:wrap;gap:.5rem}
.chip-btn{display:inline-flex;align-items:center;gap:.4rem;background:transparent;border:1.5px solid var(--brown);color:var(--brown);border-radius:999px;padding:.4rem .9rem;font-size:.85rem;font-weight:600;cursor:pointer;transition:background .25s,color .25s}
.chip-btn:hover:not(:disabled){background:var(--brown);color:var(--cream)}
.chip-btn:disabled{opacity:.55;cursor:wait}
.loc-msg{font-size:.82rem;line-height:1.5;min-height:0;color:var(--brown)}
.loc-msg:empty{display:none}
.loc-msg.far b{color:#a1432b}
.map-modal{position:fixed;inset:0;z-index:400;background:rgba(20,10,5,.7);backdrop-filter:blur(4px);display:grid;place-items:center;padding:1rem}
.map-modal[hidden]{display:none}
.map-box{width:min(760px,100%);max-height:100%;background:var(--cream);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 40px 80px rgba(0,0,0,.5);animation:mapin .35s cubic-bezier(.2,.8,.2,1)}
@keyframes mapin{from{opacity:0;transform:translateY(24px) scale(.97)}}
.map-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.2rem}
.map-head h3{color:var(--brown);font-size:1.3rem}
.map-head button{background:none;border:0;font-size:1.3rem;cursor:pointer;color:var(--brown)}
.map-search{display:flex;gap:.5rem;padding:0 1.2rem .7rem}
.map-search .btn{padding:.5rem 1.1rem}
.map-results{margin:0 1.2rem .6rem;border:1px solid rgba(92,52,33,.25);border-radius:12px;max-height:150px;overflow:auto;background:var(--paper);font-size:.88rem;padding:.2rem}
.map-results button{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem .7rem;border-radius:8px;cursor:pointer;color:var(--ink)}
.map-results button:hover{background:var(--rose-2);color:#2b170d}
.map{height:min(46vh,380px);background:#e8e0c0}
.map-foot{padding:.9rem 1.2rem 1.1rem;display:grid;gap:.7rem}
.map-addr{font-size:.92rem;min-height:2.7em;color:var(--ink)}
.map-actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:flex-end}
.map-actions .btn{padding:.6rem 1.3rem}
.gpin span{display:block;width:34px;height:44px;background:var(--brown);border-radius:50% 50% 50% 0;transform:rotate(-45deg) scale(.7);transform-origin:50% 100%;box-shadow:0 8px 14px rgba(0,0,0,.4);position:relative;animation:pinDrop .5s cubic-bezier(.3,1.6,.5,1)}
.gpin span::after{content:"";position:absolute;inset:11px;border-radius:50%;background:#fbf9c1}
@keyframes pinDrop{from{transform:rotate(-45deg) scale(.7) translate(-14px,24px);opacity:0}}
:root[data-theme=dark] .map-box{background:#24140c}
:root[data-theme=dark] .map-head h3,:root[data-theme=dark] .map-head button{color:var(--rose-2)}
:root[data-theme=dark] .loc-msg{color:var(--rose-2)}
