:root{
  --red:#c8102e; --red-2:#e3262f; --ink:#1b1430; --ink-2:#2c2348; --cream:#fff6ea; --paper:#fffdf8;
  --gold:#d9a531; --gold-ink:#7a5208; --mut:#5d5470; --line:#eadfcf; --ok:#1f7a4d;
  --r:18px; --shadow:0 18px 40px -22px rgba(27,20,48,.45);
  --display:"Anybody",system-ui,sans-serif; --body:"Nunito Sans",system-ui,sans-serif; --hindi:"Yatra One",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 17px/1.6 var(--body);color:var(--ink);background:var(--cream);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--display);font-stretch:112%;line-height:1.02;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(2rem,7vw,3.4rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700;line-height:1.2}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.eyebrow{font:800 .8rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin:0 0 12px}
.hi{font-family:var(--hindi);font-weight:400}
.demo{margin:0;background:var(--ink);color:#f3ecff;font-size:13px;text-align:center;padding:7px 12px}

/* header */
.top{position:sticky;top:0;z-index:30;background:rgba(255,246,234,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:14px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.brand img{height:30px;width:auto;border-radius:4px}
.brand span{font:800 1rem/1.05 var(--display);font-stretch:112%}
.brand small{display:block;font:600 .8rem var(--body);color:var(--mut);letter-spacing:.02em}
.links{display:none;gap:22px}
.links a{text-decoration:none;font-weight:700;padding:10px 2px}
.links a[aria-current]{color:var(--red)}
.cart-btn{min-height:44px;border:0;border-radius:99px;background:var(--red);color:#fff;font:800 15px var(--body);padding:0 16px;display:flex;align-items:center;gap:8px;cursor:pointer}
.cart-btn b{background:#fff;color:var(--red);border-radius:99px;min-width:24px;height:24px;display:grid;place-items:center;font-size:13px}
.cart-btn.bump{animation:bump .4s}
@keyframes bump{40%{transform:scale(1.12)}}
@media(min-width:820px){.links{display:flex}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:99px;font:800 16px var(--body);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .2s,background .2s}
.btn:active{transform:scale(.97)}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:#a90d26}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-gold{background:var(--gold);color:var(--ink)}

/* hero */
.hero{position:relative;padding:28px 0 10px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:auto -20% -40% 30%;height:80%;background:radial-gradient(closest-side,rgba(217,165,49,.28),transparent);pointer-events:none}
.hero .wrap{display:grid;gap:10px;position:relative}
.hero h1{font-size:clamp(2.6rem,11vw,5.6rem);font-weight:900}
.hero h1 em{font-style:normal;color:var(--red)}
.hero .hi-line{font-family:var(--hindi);font-size:1.5rem;color:var(--gold-ink);margin:8px 0 0}
.lede{font-size:1.08rem;color:var(--mut);max-width:34rem;margin:14px 0 20px}
.cta{display:flex;flex-wrap:wrap;gap:10px}
.facts{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.facts li{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:15px}
.facts b{font-family:var(--display);font-stretch:112%;display:block;font-size:1.1rem}
@media(min-width:900px){.hero .wrap{grid-template-columns:1.05fr 1fr;align-items:center}.hero{padding:56px 0 30px}}

.stage{position:relative;aspect-ratio:4/5;max-height:620px;width:100%;border-radius:28px;background:
  radial-gradient(120% 80% at 50% 10%,#3a2c63 0%,var(--ink) 60%);box-shadow:var(--shadow);overflow:hidden;touch-action:pan-y}
.stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.stage .fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.95}
.stage.live .fallback{opacity:0;transition:opacity .6s}
.stage .tag{position:absolute;left:14px;top:14px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:99px;padding:6px 12px;font-size:13px;font-weight:700;backdrop-filter:blur(6px)}
.swatches{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}
.swatches button{min-height:44px;border-radius:99px;border:2px solid rgba(255,255,255,.35);background:rgba(27,20,48,.6);color:#fff;font:700 13px var(--body);padding:0 12px 0 6px;display:flex;align-items:center;gap:8px;cursor:pointer}
.swatches button i{width:22px;height:22px;border-radius:50%;border:2px solid #fff;display:block}
.swatches button[aria-pressed=true]{border-color:var(--gold);background:rgba(217,165,49,.25)}

/* ticker */
.ticker{background:var(--red);color:#fff;overflow:hidden;white-space:nowrap;padding:12px 0;font:800 16px var(--body);margin-top:26px;transform:rotate(-1.2deg) scale(1.03)}
.ticker div{display:inline-block;animation:tick 28s linear infinite}
.ticker span{margin:0 18px}
@keyframes tick{to{transform:translateX(-50%)}}

section{padding:64px 0}
.head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px;margin-bottom:26px}
.head p{color:var(--mut);max-width:30rem;margin:10px 0 0}

/* occasions */
.occ{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.occ a{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:3/4;text-decoration:none;color:#fff;transform-style:preserve-3d;transition:transform .35s}
.occ a:nth-child(1){grid-column:span 2;aspect-ratio:16/10}
.occ img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s}
.occ a:hover img{transform:scale(1.05)}
.occ a::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(27,20,48,.88))}
.occ span{position:absolute;left:14px;right:14px;bottom:12px;z-index:1;font:800 1.3rem/1.1 var(--display);font-stretch:112%}
.occ small{display:block;font:600 14px var(--body);opacity:.9;margin-top:4px}
.occ .hi{display:block;font-size:1rem;color:#ffd77a;font-family:var(--hindi)}
@media(min-width:820px){.occ{grid-template-columns:repeat(5,1fr)}.occ a:nth-child(1){grid-column:span 1;aspect-ratio:3/4}}

/* product grid */
.chips{display:flex;gap:8px;overflow-x:auto;padding:4px 0 14px;scrollbar-width:none}
.chips button{flex:none;min-height:44px;padding:0 18px;border-radius:99px;border:2px solid var(--ink);background:transparent;font:800 15px var(--body);color:var(--ink);cursor:pointer}
.chips button[aria-pressed=true]{background:var(--ink);color:#fff}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:700px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1040px){.grid{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s;transform-style:preserve-3d}
.card:hover{box-shadow:var(--shadow)}
.card .ph{position:relative;aspect-ratio:3/4;background:#f1e6d6;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;object-position:top}
.badge{position:absolute;left:8px;top:8px;background:var(--gold);color:var(--ink);font:800 12px/1 var(--body);padding:6px 8px;border-radius:8px;letter-spacing:.03em}
.badge.real{background:var(--red);color:#fff}
.card .bd{padding:12px;display:flex;flex-direction:column;gap:8px;flex:1}
.card h3{font-size:1rem}
.price{font:800 1.15rem var(--display);font-stretch:112%}
.price s{font:600 14px var(--body);color:var(--mut);margin-left:6px}
.card label{font-size:13px;font-weight:700;color:var(--mut)}
.card select{width:100%;min-height:44px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font:600 15px var(--body);padding:0 8px;color:var(--ink)}
.add{margin-top:auto;min-height:44px;border:0;border-radius:12px;background:var(--ink);color:#fff;font:800 15px var(--body);cursor:pointer}
.add:hover{background:var(--red)}
.add.done{background:var(--ok)}

/* size finder */
.sizer{background:var(--ink);color:#fff;border-radius:28px;padding:28px 20px;display:grid;gap:22px;position:relative;overflow:hidden}
.sizer h2{color:#fff}
.sizer .eyebrow{color:var(--gold)}
.sizer p{color:#d9d2ea;margin:8px 0 0}
.sizer input[type=range]{width:100%;accent-color:var(--gold);min-height:44px}
.sz-out{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.sz-out b{font:900 clamp(3rem,14vw,5rem)/1 var(--display);font-stretch:112%;color:var(--gold)}
.sz-out span{font-size:1.1rem}
.ruler{display:flex;justify-content:space-between;font-size:13px;color:#cfc6e3}
@media(min-width:820px){.sizer{grid-template-columns:1fr 1fr;padding:44px;align-items:center}}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:s}
.steps li{counter-increment:s;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 18px 74px;position:relative}
.steps li::before{content:counter(s);position:absolute;left:18px;top:16px;width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font:900 1.2rem var(--display)}
.steps p{margin:6px 0 0;color:var(--mut)}
@media(min-width:820px){.steps{grid-template-columns:repeat(4,1fr)}}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.gal figure{margin:0;border-radius:var(--r);overflow:hidden;background:#eee;position:relative}
.gal figure:first-child{grid-column:span 2}
.gal img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
.gal figure:first-child img{aspect-ratio:4/3}
.gal figcaption{position:absolute;left:8px;bottom:8px;background:rgba(27,20,48,.8);color:#fff;font-size:13px;padding:4px 10px;border-radius:99px}
@media(min-width:820px){.gal{grid-template-columns:2fr 1fr 1fr}.gal figure:first-child{grid-column:span 1;grid-row:span 2}.gal figure:first-child img{aspect-ratio:auto;height:100%}}

/* visit */
.visit{display:grid;gap:18px}
.vcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.vcard dl{margin:0;display:grid;gap:14px}
.vcard dt{font:800 13px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.vcard dd{margin:2px 0 0}
.vcard .cta{margin-top:18px}
.map{border-radius:var(--r);overflow:hidden;min-height:320px;border:1px solid var(--line)}
.map iframe{width:100%;height:100%;min-height:320px;border:0;display:block}
@media(min-width:820px){.visit{grid-template-columns:1fr 1.3fr}}

footer{background:var(--ink);color:#e8e1f5;padding:40px 0 110px;font-size:15px}
footer .wrap{display:grid;gap:10px}
footer a{color:#fff}
footer .brand span{color:#fff}

/* sticky cart bar */
.bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--ink);color:#fff;border-radius:18px;padding:10px 10px 10px 18px;box-shadow:0 14px 34px rgba(27,20,48,.4);transform:translateY(140%);transition:transform .35s}
.bar.show{transform:none}
.bar b{font-family:var(--display);font-stretch:112%}
@media(min-width:820px){.bar{left:auto;width:420px;right:20px}}

/* drawer */
.drawer{position:fixed;inset:0;z-index:50;visibility:hidden}
.drawer.open{visibility:visible}
.drawer .scrim{position:absolute;inset:0;background:rgba(27,20,48,.5);opacity:0;transition:opacity .3s}
.drawer.open .scrim{opacity:1}
.panel{position:absolute;right:0;top:0;bottom:0;width:min(440px,100%);background:var(--cream);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .35s}
.drawer.open .panel{transform:none}
.panel header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line)}
.panel h2{font-size:1.6rem}
.x{min-width:44px;min-height:44px;border:0;background:var(--paper);border-radius:12px;font-size:22px;cursor:pointer}
.items{flex:1;overflow:auto;padding:10px 18px}
.line{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px dashed var(--line)}
.line img{width:56px;height:70px;object-fit:cover;object-position:top;border-radius:10px}
.line p{margin:0;font-weight:700;font-size:15px;line-height:1.3}
.line small{color:var(--mut);font-size:14px}
.step{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:99px;background:#fff}
.step button{min-width:40px;min-height:44px;border:0;background:none;font:800 18px var(--body);cursor:pointer;color:var(--ink)}
.step span{min-width:22px;text-align:center;font-weight:800}
.empty{color:var(--mut);text-align:center;padding:40px 10px}
.form{padding:14px 18px;border-top:1px solid var(--line);display:grid;gap:10px;background:var(--paper)}
.form label{font-size:14px;font-weight:700;display:grid;gap:4px}
.form input,.form select,.form textarea{min-height:44px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font:500 16px var(--body);padding:8px 10px;color:var(--ink);width:100%}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.seg label{display:flex;align-items:center;justify-content:center;min-height:44px;border:1.5px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;font-size:15px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:checked){border-color:var(--ink);background:var(--ink);color:#fff}
.seg label:has(input:focus-visible){outline:3px solid var(--gold)}
.total{display:flex;justify-content:space-between;font:800 1.2rem var(--display);font-stretch:112%}
.wa{background:#1b8a4c;color:#fff;width:100%}
.wa:hover{background:#15703d}
[hidden]{display:none!important}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
