/* ==========================================================================
   Hashi Khushi — design system
   Ivory paper, sindoor, turmeric, kohl. Tiro Bangla display, Hind Siliguri body.
   ========================================================================== */
:root{color-scheme:only light;
  --ivory:#F6EFE3; --paper:#EFE5D3; --jute:#E6D8C0; --sand:#D9C7A8;
  --ink:#22160F; --ink-2:#4E3B2E; --muted:#8A7460; --line:rgba(34,22,15,.14);
  --sindoor:#8E1B1F; --sindoor-2:#A8262B; --turmeric:#D8901A; --haldi:#F2C14E; --kohl:#140C08; --kohl-2:#22150F;
  --bn:"Tiro Bangla",serif; --body:"Hind Siliguri",system-ui,sans-serif; --en:"Cormorant Garamond",Georgia,serif;
  --pad:clamp(20px,5vw,72px); --max:1320px;
  --ease:cubic-bezier(.22,.8,.18,1); --ease-io:cubic-bezier(.65,0,.35,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
body{background:var(--ivory);color:var(--ink);font:400 16px/1.7 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--haldi);color:var(--ink)}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* type */
.eyebrow{font:600 .78rem/1 var(--en);letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.eyebrow.gold{color:var(--turmeric)}
.display{font-family:var(--bn);font-weight:400;line-height:1.12;letter-spacing:-.005em}
.d-xl{font-size:clamp(2.7rem,8.4vw,7.2rem)}
.d-l{font-size:clamp(2.1rem,5.6vw,4.6rem)}
.d-m{font-size:clamp(1.6rem,3.2vw,2.6rem)}
.lede{font-size:clamp(1.02rem,1.25vw,1.18rem);color:var(--ink-2);max-width:46ch}
.en-i{font-family:var(--en);font-style:italic;font-weight:500}
.rule{width:56px;height:1px;background:currentColor;opacity:.4;margin:22px 0}
.line{display:block;overflow:hidden;padding-bottom:.06em}
.line>span{display:block;will-change:transform}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 28px;border-radius:99px;font-weight:500;font-size:1rem;letter-spacing:.01em;position:relative;overflow:hidden;isolation:isolate;transition:transform .5s var(--ease),color .4s}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.btn:hover::after{transform:scaleX(1);transform-origin:left}
.btn svg{width:18px;height:18px;flex:none}
.btn-solid{background:var(--sindoor);color:#fff}.btn-solid::after{background:var(--kohl)}
.btn-ghost{box-shadow:inset 0 0 0 1px currentColor}.btn-ghost::after{background:var(--ivory)}.btn-ghost:hover{color:var(--ink)}
.btn-ink{background:var(--ink);color:var(--ivory)}.btn-ink::after{background:var(--sindoor)}
.btn-haldi{background:var(--haldi);color:var(--ink)}.btn-haldi::after{background:#fff}
.link{display:inline-flex;gap:10px;align-items:center;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:3px}

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;z-index:300;background:var(--kohl);display:grid;place-items:center;pointer-events:none}
.loader svg{width:min(150px,32vw);height:auto;overflow:visible}
.loader .lw{margin-top:20px;width:min(240px,56vw);opacity:0}
html.ready .loader{visibility:hidden}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:100;color:var(--ivory);transition:color .4s,background .5s,transform .6s var(--ease)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:76px}
.nav .brand{display:flex;align-items:center;gap:12px}
.nav .brand img{height:38px;width:auto}
.nav .brand .wm{height:30px;filter:brightness(0) invert(1);transition:filter .4s}
.nav.light{color:var(--ink);background:rgba(246,239,227,.86);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2)}
.nav.light .brand .wm{filter:none}
.nav.away{transform:translateY(-100%)}
.nav.scrolled:not(.light){background:rgba(20,12,8,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.nav ul{display:none;list-style:none;gap:34px;font-size:.95rem}
.nav ul a{opacity:.85;transition:opacity .3s}.nav ul a:hover{opacity:1}
.nav .cta{height:44px;padding:0 20px;font-size:.92rem}
@media(min-width:1000px){.nav ul{display:flex}}

/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--kohl);color:var(--ivory)}
.hero picture,.hero .hero-img{position:absolute;inset:0;width:100%;height:100%}
.hero .hero-img{object-fit:cover;object-position:62% 50%;transform-origin:60% 55%;will-change:transform}
.hero .shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(20,12,8,.9) 0%,rgba(20,12,8,.78) 34%,rgba(20,12,8,.35) 56%,rgba(20,12,8,0) 70%),
  linear-gradient(180deg,rgba(20,12,8,.75) 0,rgba(20,12,8,0) 130px),
  linear-gradient(0deg,rgba(20,12,8,.55),rgba(20,12,8,0) 35%)}
.hero h1,.hero .lede,.hero .eyebrow{text-shadow:0 2px 18px rgba(0,0,0,.55)}
.hero .copy{position:absolute;left:0;right:0;bottom:clamp(56px,11vh,120px);z-index:2}
.hero h1{max-width:12ch;margin:18px 0 20px;text-shadow:0 2px 30px rgba(0,0,0,.25)}
.hero h1 em{font-style:normal;color:var(--haldi)}
.hero .lede{color:rgba(246,239,227,.86);max-width:38ch}
.hero .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero .scroll{position:absolute;right:var(--pad);bottom:clamp(56px,11vh,120px);z-index:2;display:none;align-items:center;gap:12px;font:500 .78rem var(--en);letter-spacing:.3em;text-transform:uppercase;writing-mode:vertical-rl;opacity:.75}
.hero .scroll i{display:block;width:1px;height:60px;background:currentColor;transform-origin:top;animation:drip 2.4s var(--ease-io) infinite}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media(min-width:900px){.hero .scroll{display:flex}}
@media(max-width:899px){
  .hero .shade{background:linear-gradient(180deg,rgba(20,12,8,.9) 0%,rgba(20,12,8,.78) 38%,rgba(20,12,8,.3) 58%,rgba(20,12,8,0) 68%,rgba(20,12,8,.35) 100%)}
  .hero .hero-img{object-position:50% 70%}
  .hero .copy{top:88px;bottom:auto}
  .hero h1{margin:12px 0 12px;font-size:clamp(2.5rem,11.5vw,3.4rem)}
  .hero .eyebrow{font-size:.68rem;letter-spacing:.24em;line-height:1.5}
  .hero .lede{font-size:.98rem;line-height:1.6}
  .hero .actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
  .hero .actions .btn{justify-content:center;padding:0 10px;height:50px;font-size:.95rem}
}
/* ---------- statement ---------- */
.statement{padding:clamp(110px,16vw,220px) 0 clamp(80px,10vw,140px);text-align:center}
.statement .mark{width:62px;margin:0 auto 34px}
.statement p.big{font-family:var(--bn);font-size:clamp(1.6rem,3.6vw,3rem);line-height:1.45;max-width:24ch;margin:0 auto}
.statement p.big .w{opacity:.42;transition:opacity .2s}
.statement .sig{margin-top:30px}

/* ---------- chapter divider ---------- */
.chapter{position:relative;padding:clamp(60px,9vw,120px) 0 clamp(34px,5vw,60px)}
.chapter .num{font:500 clamp(4rem,12vw,10rem)/.8 var(--en);color:var(--sindoor);opacity:.12;position:absolute;right:var(--pad);top:clamp(30px,5vw,70px)}
.chapter .grid{display:grid;gap:22px;align-items:end}
@media(min-width:900px){.chapter .grid{grid-template-columns:1.2fr 1fr;gap:60px}}
.dark{background:var(--kohl);color:var(--ivory)}
.dark .lede{color:rgba(246,239,227,.74)}
.dark .eyebrow{color:var(--haldi)}
.dark .chapter .num{color:var(--haldi)}

/* ---------- build the holud (pinned crossfade) ---------- */
.build{position:relative;height:560vh}
.build .stick{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;grid-template-rows:58% 42%}
.build .frames{position:relative;overflow:hidden;grid-row:1}
.build .frames img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 62%;opacity:0;will-change:opacity,transform}
.build .frames img.f0{opacity:1}
.build .frames::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--kohl),rgba(20,12,8,0) 30%);pointer-events:none}
.build .panel{grid-row:2;position:relative;display:flex;flex-direction:column;justify-content:flex-start;padding:14px var(--pad) 0}
.build .step{display:flex;flex-direction:column;gap:6px}
.build .n{font:500 .95rem var(--en);letter-spacing:.2em;color:var(--haldi);flex:none}
.build .t{position:relative;height:1.6em;overflow:hidden;flex:none;width:100%;font-family:var(--bn);font-size:clamp(1.7rem,4.6vw,3.4rem);line-height:1.35}
.build .t span{position:absolute;left:0;top:.12em;white-space:nowrap}
.build .d{margin-top:10px;max-width:42ch;color:rgba(246,239,227,.76);min-height:3.4em}
.build .bar{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:auto;padding-bottom:max(22px,env(safe-area-inset-bottom))}
.build .bar i{display:block;height:2px;background:rgba(246,239,227,.2);position:relative;overflow:hidden}
.build .bar i b{position:absolute;inset:0;background:var(--haldi);transform:scaleX(0);transform-origin:left}
.build .bar small{display:block;margin-top:8px;font-size:.72rem;color:rgba(246,239,227,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:899px){.build .frames img{object-fit:contain;object-position:50% 70%}.build .frames{background:var(--kohl)}}
@media(min-width:900px){
  .build .stick{grid-template-rows:1fr;grid-template-columns:minmax(380px,38%) 1fr}
  .build .frames{grid-row:1;grid-column:2}
  .build .frames::after{background:linear-gradient(90deg,var(--kohl),rgba(20,12,8,0) 18%)}
  .build .panel{grid-row:1;grid-column:1;justify-content:center;padding:0 48px 0 var(--pad)}
  .build .step{flex-direction:column;gap:18px}
  .build .t{width:100%;flex:none}
  .build .d{font-size:1.05rem;margin-top:18px}
  .build .bar{grid-template-columns:1fr;gap:14px;margin-top:44px;padding-bottom:0}
  .build .bar>div{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:14px}
  .build .bar small{margin:0;font-size:.85rem;order:-1}
}

/* ---------- rental pieces grid ---------- */
.pieces{padding:clamp(70px,9vw,120px) 0 clamp(90px,11vw,150px)}
.pgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:44px}
@media(min-width:900px){.pgrid{grid-template-columns:repeat(4,1fr);gap:22px}}
.card{position:relative;cursor:pointer;display:flex;flex-direction:column}
.card .ph{position:relative;aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:var(--paper);display:grid;place-items:center}
.dark .card .ph{background:var(--kohl-2)}
.card .ph::before{content:"";position:absolute;left:50%;bottom:9%;width:64%;height:7%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(34,22,15,.28),transparent);filter:blur(3px)}
.dark .card .ph::before{background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent)}
.card .ph img{position:relative;width:80%;height:78%;object-fit:contain;transition:transform 1s var(--ease)}
.card .ph img.full{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card:hover .ph img{transform:translateY(-6px) scale(1.035)}
.card:hover .ph img.full{transform:scale(1.05)}
.card .meta{padding:14px 2px 0;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.card h3{font-family:var(--bn);font-weight:400;font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.3}
.card small{display:block;font:500 .95rem var(--en);color:var(--muted);font-style:italic}
.dark .card small{color:rgba(246,239,227,.55)}
.card .tag{position:absolute;top:12px;left:12px;z-index:2;font-size:.72rem;letter-spacing:.06em;padding:4px 10px;border-radius:99px;background:rgba(246,239,227,.92);color:var(--ink)}
.card .plus{flex:none;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;transition:background .3s,color .3s}
.dark .card .plus{box-shadow:inset 0 0 0 1px rgba(246,239,227,.25)}
.card:hover .plus{background:var(--sindoor);color:#fff;box-shadow:none}
.card.wide{grid-column:span 2}.card.wide .ph{aspect-ratio:16/10}
.rent-cta{margin-top:56px;display:grid;gap:24px;padding:34px;border:1px solid rgba(246,239,227,.18);border-radius:4px}
@media(min-width:900px){.rent-cta{grid-template-columns:1fr auto;align-items:center;padding:44px 52px}}

/* ---------- mirror on the wall ---------- */
.wall{position:relative;height:760vh;background:#efe7da}
.wall .stick{position:sticky;top:0;height:100svh;overflow:hidden}
.wall .room{position:absolute;inset:0}
.wall .room img{width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.wall .slot{position:absolute;left:50%;transform:translateX(-50%);display:grid;place-items:center;pointer-events:none}
.wall .slot img{position:absolute;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(60,40,20,.32)) drop-shadow(0 4px 6px rgba(60,40,20,.22));opacity:0;will-change:transform,opacity}
.wall .hud{position:absolute;left:var(--pad);top:clamp(96px,14vh,130px);z-index:3;max-width:420px}
.wall .now{margin-top:26px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.wall .now .nm{position:relative;height:1.75em;overflow:hidden;width:min(420px,80vw)}
.wall .now .nm span{position:absolute;left:0;top:.18em;white-space:nowrap;font-family:var(--bn);font-size:clamp(1.3rem,2.4vw,1.9rem);line-height:1.4}
.wall .now .idx{font:500 .9rem var(--en);letter-spacing:.2em;color:var(--muted);margin-bottom:4px}
.wall .now .btn{height:46px}
.wall .hud{background:linear-gradient(90deg,rgba(239,231,218,.0),rgba(239,231,218,0));}
@media(max-width:899px){.wall .now{margin-top:14px;gap:10px}.wall .hud{top:86px}}

/* ---------- collections rails ---------- */
.collections{padding:clamp(80px,10vw,140px) 0}
.tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:34px calc(var(--pad)*-1) 0;padding:0 var(--pad) 6px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;height:42px;padding:0 18px;border-radius:99px;box-shadow:inset 0 0 0 1px var(--line);font-size:.95rem;transition:all .35s var(--ease)}
.tabs button.on{background:var(--ink);color:var(--ivory);box-shadow:none}
.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin:30px calc(var(--pad)*-1) 0;padding:6px var(--pad) 26px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.rail .card{flex:0 0 78%;scroll-snap-align:start}
@media(min-width:700px){.rail .card{flex-basis:44%}}
@media(min-width:1100px){.rail .card{flex-basis:calc(25% - 12px)}}
.rail-nav{display:flex;gap:10px;justify-content:flex-start;margin-top:6px}
.rail-nav button{width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;transition:background .3s}
.rail-nav button:hover{background:var(--ink);color:var(--ivory)}
.rail-nav svg{width:18px;height:18px}

/* ---------- craft / story ---------- */
.craft{padding:clamp(90px,12vw,170px) 0;background:var(--paper)}
.craft .grid{display:grid;gap:44px;align-items:center}
@media(min-width:900px){.craft .grid{grid-template-columns:1fr 1fr;gap:80px}}
.craft .stack{position:relative;aspect-ratio:4/5}
.craft .stack img{position:absolute;object-fit:cover;border-radius:3px;box-shadow:0 30px 60px -30px rgba(34,22,15,.45)}
.craft .stack .a{left:0;top:0;width:72%;height:78%}
.craft .stack .b{right:0;bottom:0;width:52%;height:50%;border:8px solid var(--paper)}
.craft blockquote{font-family:var(--bn);font-size:clamp(1.4rem,2.8vw,2.2rem);line-height:1.55;margin:24px 0}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px;margin-top:40px}
.facts b{display:block;font-family:var(--bn);font-weight:400;font-size:1.25rem}
.facts span{color:var(--ink-2);font-size:.94rem;line-height:1.5}

/* ---------- how ---------- */
.how{padding:clamp(80px,10vw,140px) 0}
.how ol{list-style:none;display:grid;gap:0;margin-top:40px;counter-reset:s}
.how li{display:grid;grid-template-columns:70px 1fr;gap:16px;padding:26px 0;border-top:1px solid var(--line)}
.how li::before{counter-increment:s;content:counter(s,bengali);font-family:var(--bn);font-size:2.4rem;line-height:1;color:var(--sindoor)}
.how li b{display:block;font-family:var(--bn);font-weight:400;font-size:1.35rem}
.how li span{color:var(--ink-2)}
@media(min-width:900px){.how ol{grid-template-columns:repeat(3,1fr);gap:40px}.how li{grid-template-columns:1fr;border-top:1px solid var(--ink)}}

/* ---------- footer ---------- */
.foot{background:var(--kohl);color:var(--ivory);padding:clamp(80px,10vw,130px) 0 calc(110px + env(safe-area-inset-bottom))}
.foot .grid{display:grid;gap:44px}
@media(min-width:900px){.foot .grid{grid-template-columns:1.3fr 1fr 1fr;align-items:start}}
.foot .logo{width:min(320px,80%)}
.foot h4{font:600 .78rem var(--en);letter-spacing:.3em;text-transform:uppercase;color:var(--haldi);margin-bottom:16px}
.foot p,.foot li{color:rgba(246,239,227,.72);list-style:none;line-height:2}
.foot .big{margin-top:70px;padding-top:30px;border-top:1px solid rgba(246,239,227,.14);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.85rem;color:rgba(246,239,227,.5)}

/* ---------- floating messenger ---------- */
.float-msg{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:90;height:56px;padding:0 22px 0 18px;border-radius:99px;background:var(--sindoor);color:#fff;display:flex;align-items:center;gap:10px;font-weight:500;box-shadow:0 18px 40px -14px rgba(142,27,31,.75);transform:translateY(160%);transition:transform .7s var(--ease)}
.float-msg.on{transform:none}
.float-msg svg{width:20px;height:20px}
@media(max-width:899px){.float-msg{width:58px;height:58px;padding:0;justify-content:center;border-radius:50%}.float-msg span{display:none}.float-msg svg{width:24px;height:24px}}

/* ---------- product sheet ---------- */
.veil{position:fixed;inset:0;z-index:180;background:rgba(20,12,8,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .45s}
.veil.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;z-index:181;left:0;right:0;bottom:0;max-height:94svh;overflow:auto;background:var(--ivory);border-radius:22px 22px 0 0;transform:translateY(104%);transition:transform .7s var(--ease);overscroll-behavior:contain}
.sheet.on{transform:none}
.sheet .in{display:grid}
.sheet .ph{position:relative;background:var(--paper);aspect-ratio:1;display:grid;place-items:center;perspective:1000px}
.sheet .ph img{width:78%;height:78%;object-fit:contain;filter:drop-shadow(0 24px 24px rgba(34,22,15,.28));transition:transform .5s var(--ease)}
.sheet .ph img.full{width:100%;height:100%;object-fit:cover;filter:none}
.sheet .tx{padding:26px 24px calc(28px + env(safe-area-inset-bottom))}
.sheet .badge{display:inline-block;font-size:.75rem;letter-spacing:.06em;padding:4px 12px;border-radius:99px;background:var(--haldi);color:var(--ink)}
.sheet .badge.buy{background:var(--sindoor);color:#fff}
.sheet h3{font-family:var(--bn);font-weight:400;font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.25;margin-top:14px}
.sheet .en-i{font-size:1.2rem;color:var(--muted)}
.sheet p{color:var(--ink-2);margin:16px 0 26px}
.sheet .btn{width:100%;justify-content:center}
.sheet .x{position:absolute;right:14px;top:14px;z-index:3;width:44px;height:44px;border-radius:50%;background:rgba(246,239,227,.9);display:grid;place-items:center;font-size:1.3rem}
.sheet .grab{position:absolute;top:8px;left:50%;width:44px;height:4px;margin-left:-22px;border-radius:9px;background:rgba(34,22,15,.2);z-index:3}
@media(min-width:900px){
  .sheet{left:50%;right:auto;bottom:50%;width:min(980px,92vw);border-radius:6px;transform:translate(-50%,calc(50% + 40px));opacity:0;pointer-events:none;transition:transform .6s var(--ease),opacity .4s}
  .sheet.on{transform:translate(-50%,50%);opacity:1;pointer-events:auto}
  .sheet .in{grid-template-columns:1.1fr 1fr}
  .sheet .tx{padding:56px 48px;display:flex;flex-direction:column;justify-content:center}
  .sheet .grab{display:none}
}

/* reveal helpers */
.rv{opacity:0;transform:translateY(34px)}
.reduced .rv{opacity:1;transform:none}
.reduced .build,.reduced .wall{height:auto}
.reduced .build .stick,.reduced .wall .stick{position:relative}

/* ===== round 4 fixes ===== */
.eyebrow.bn,.foot h4.bn{letter-spacing:0;text-transform:none;font-family:var(--body);font-weight:500;font-size:.92rem}
.display,h2,h3{text-wrap:balance}
.btn-wa{background:#1F7A4D;color:#fff}.btn-wa::after{background:var(--kohl)}
.sh-btns{display:grid;gap:10px}
@media(min-width:600px){.rent-cta .sh-btns{grid-template-columns:auto auto}}
.sheet .in{grid-template-columns:minmax(0,1fr)}
.sheet .btn{box-sizing:border-box;max-width:100%}
@media(min-width:900px){.sheet .in{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
/* floating contact: two quiet buttons */
.float-msg{height:auto;padding:0;background:none;box-shadow:none;display:flex;gap:10px;align-items:center}
.float-msg .fm{height:52px;padding:0 18px 0 14px;border-radius:99px;display:flex;align-items:center;gap:8px;font-weight:500;font-size:.92rem;color:#fff;box-shadow:0 14px 30px -12px rgba(20,12,8,.6);transition:transform .4s var(--ease)}
.float-msg .fm:hover{transform:translateY(-2px)}
.float-msg .fm-ms{background:var(--sindoor)}.float-msg .fm-wa{background:#1F7A4D}
.float-msg .fm svg{width:20px;height:20px}
@media(max-width:899px){
  .nav .cta{display:none}
  .float-msg{left:auto;right:14px;flex-direction:column;gap:10px;transform:translateY(160%)}
  .float-msg.on{transform:none}
  .float-msg .fm{width:50px;height:50px;padding:0;justify-content:center;border-radius:50%}
  .float-msg .fm span{display:none}
}
/* sections never slide under the header */
section,[id]{scroll-margin-top:84px}
.wall .hud{top:clamp(100px,15vh,140px)}
@media(max-width:899px){.wall .hud{top:92px}}
.wall .slot{transform:none}
.wall .slot img{filter:drop-shadow(16px 20px 18px rgba(60,40,20,.30)) drop-shadow(4px 6px 5px rgba(60,40,20,.2))}
/* desktop nav legible over the bright hero */
@media(min-width:900px){.nav:not(.light):not(.scrolled){background:linear-gradient(180deg,rgba(20,12,8,.55),rgba(20,12,8,0))}}
/* phone: square stage frames with the caption over the lower edge */
@media(max-width:899px){
  .build .stick{grid-template-rows:auto 1fr}
  .build .frames{aspect-ratio:1;width:100%;margin-top:76px}
  .build .frames img{object-fit:cover;object-position:50% 50%}
  .build .panel{padding-top:18px}
  .build .bar{padding-right:0}
}
@media(hover:none){.rail-nav{display:none}}
@media(max-width:899px){.how li{grid-template-columns:48px 1fr}}
.card small{font-size:1rem}

/* ===== patachitra: folk paintings that unroll like a pat scroll ===== */
.pat-walk{position:relative;height:190vh;background:var(--paper)}
.pat-walk .stick{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,4vh,40px);padding-top:70px}
.pat-head h2{margin-top:10px;max-width:24ch}
.scroll-paper{position:relative;margin:0 auto;width:min(1100px,92vw);aspect-ratio:1024/572;overflow:hidden;box-shadow:0 30px 60px -34px rgba(60,35,15,.55);background:#f3ead7}
.scroll-paper img{width:100%;height:100%;object-fit:cover;will-change:transform,clip-path}
.scroll-paper .rod{position:absolute;top:-10px;bottom:-10px;width:16px;border-radius:8px;background:linear-gradient(90deg,#5a3214,#a8692f 40%,#6d3d18);box-shadow:0 8px 16px rgba(0,0,0,.35);z-index:2;pointer-events:none}
.scroll-paper .rod::before,.scroll-paper .rod::after{content:"";position:absolute;left:50%;width:22px;height:22px;margin-left:-11px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d9a35b,#7a4419)}
.scroll-paper .rod::before{top:-8px}.scroll-paper .rod::after{bottom:-8px}
@media(max-width:899px){
  .scroll-paper{width:100%;height:52svh;aspect-ratio:auto;box-shadow:none}
  .scroll-paper img{width:auto;max-width:none;height:100%}
}
.pat{position:relative;margin:0 0 26px;max-width:420px;filter:drop-shadow(0 24px 30px rgba(20,12,8,.35))}
.pat img{width:100%;height:auto;display:block}
.pat figcaption{margin-top:12px;font-family:var(--en);font-style:italic;font-size:1.05rem;opacity:.75}
.pat.unroll img{clip-path:inset(0 0 100% 0)}
.reduced .pat.unroll img,.reduced .scroll-paper img{clip-path:none}
@media(min-width:900px){.chapter .pat{max-width:360px}}
.scroll-paper .inner{position:absolute;inset:0;overflow:hidden}
.scroll-paper .inner img{position:absolute;left:0;top:0}
@media(min-width:900px){.scroll-paper .inner img{width:100%;height:100%}}

/* ===== round 5: language switch, palki curtains, horse, real scenes, poetry ===== */
.nav-r{display:flex;align-items:center;gap:10px}
.lang{height:40px;padding:0 4px;border-radius:99px;display:flex;align-items:center;gap:2px;box-shadow:inset 0 0 0 1px currentColor;font-size:.82rem;font-weight:600}
.lang span{padding:5px 10px;border-radius:99px;opacity:.6;transition:all .3s}
.lang span.on{opacity:1;background:currentColor}
.lang span.on{color:var(--ink)}
.nav.light .lang span.on{color:var(--ivory)}
.nav:not(.light) .lang span.on{background:var(--ivory);color:var(--ink)}
.nav.light .lang span.on{background:var(--ink)}
@media(max-width:899px){.lang{height:36px}}

/* palki: velvet curtains that part */
.scroll-paper .curtain{position:absolute;top:-2%;bottom:-2%;width:51%;z-index:3;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(0,0,0,.28) 0 3px,rgba(255,255,255,.04) 3px 9px,transparent 9px 34px),linear-gradient(90deg,#5c0b14,#9a1826 45%,#6e0f18);
  box-shadow:0 0 40px rgba(0,0,0,.5)}
.scroll-paper .curtain.l{left:0;transform-origin:left top}
.scroll-paper .curtain.r{right:0;transform-origin:right top}
.scroll-paper .curtain::after{content:"";position:absolute;left:0;right:0;top:0;height:22px;background:repeating-linear-gradient(90deg,var(--turmeric) 0 12px,#b8862f 12px 24px)}
.scroll-paper{border-radius:4px}
.scroll-paper .rod{display:none}

/* the jamai's horse — decoration only */
.horse-lane{position:relative;height:clamp(190px,22vw,270px);margin-top:28px;overflow:hidden;pointer-events:none}
.horse-lane svg{position:absolute;bottom:0;left:0;width:clamp(250px,29vw,360px);height:auto;overflow:visible}
.hl{transform-box:fill-box;transform-origin:50% 0}
.hl1,.hl4{animation:hlk .42s ease-in-out infinite alternate}.hl2,.hl3{animation:hlk .42s ease-in-out infinite alternate-reverse}
@keyframes hlk{from{transform:rotate(-18deg)}to{transform:rotate(18deg)}}
.horse-lane::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(246,239,227,.18)}

/* real scene photos */
.scene-fig{margin:0 0 26px;max-width:440px}
.scene-fig img{width:100%;height:auto;display:block;border-radius:4px;box-shadow:0 30px 60px -30px rgba(20,12,8,.5)}
.scene-fig figcaption{margin-top:12px;font-size:.92rem;color:var(--muted)}
@media(min-width:900px){.chapter .scene-fig{max-width:380px}}
.craft .stack.one{aspect-ratio:4/5}
.craft .stack.one .a{position:absolute;inset:0;width:100%;height:100%}

/* poetry */
.poem{font-family:var(--bn)}
.statement p.big.poem{max-width:22ch;font-size:clamp(1.7rem,3.8vw,3.1rem);line-height:1.5}

/* English mode */
html.en .display{font-family:var(--en);font-weight:600;letter-spacing:-.01em;line-height:1.05}
html.en .d-xl{font-size:clamp(2.5rem,6.4vw,6.6rem)}
html.en .poem,html.en .craft blockquote,html.en .build .t,html.en .card h3,html.en .sheet h3,html.en .wall .now .nm span,html.en .facts b,html.en .how li b,html.en .rent-cta .display{font-family:var(--en);font-weight:600}
html.en .statement p.big.poem{font-style:italic;font-weight:500}
html.en .how li::before{font-family:var(--en)}

/* ---------- credits ---------- */
.foot .credits{margin-top:64px;padding-top:30px;border-top:1px solid rgba(246,239,227,.14);display:grid;gap:10px}
@media(min-width:900px){.foot .credits{grid-template-columns:repeat(3,1fr);gap:28px}}
.foot .credits p{line-height:1.6}
.foot .credits .cr-k{display:block;font-size:.8rem;color:rgba(246,239,227,.5)}
.foot .credits b{font-weight:500;color:var(--haldi);font-size:1.05rem}
.foot .credits + .big{margin-top:36px}

/* ---------- brand lines ---------- */
.tagline{font-family:var(--bn),serif;font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.5;color:var(--haldi);margin-top:22px}
#buy .tagline,.collections .tagline{color:var(--sindoor)}
.tagline.sm{font-size:clamp(1rem,1.6vw,1.2rem);margin:8px 0 0;color:inherit;opacity:.85}
.col-line{margin:18px 0 0}
html.en .tagline{font-family:"Cormorant Garamond",serif;font-style:italic}


/* ---------- round 6: readable wall panel, coloured product backdrops ---------- */
.wall .hud{background:none;color:#120b07}
.wall .hud .display,.wall .now .nm{color:#120b07}
.wall .now .idx{color:#3a2a1f}
.wall .hud .eyebrow{color:var(--sindoor)}
.wall .now .nm{font-size:clamp(1.3rem,2.4vw,1.9rem);height:1.65em;width:min(380px,calc(100vw - 2*var(--pad) - 48px))}
.wall .now .nm span{font-size:1em;top:.12em}
html.en .wall .now .nm span{font-family:"Cormorant Garamond",serif;font-weight:500}

.col-sub{margin-top:10px}


/* jamai idle life: tail, plume, sehra and an ear flick, independent of the walk */
.jamai .tl,.jamai .pl,.jamai .sh,.jamai .ear,.jamai .ts{transform-box:view-box}
.jamai .tl{transform-origin:132px 150px;animation:hzTail 2.6s ease-in-out infinite alternate}
.jamai .pl{transform-origin:327px 55px;animation:hzPlume 1.9s ease-in-out infinite alternate}
.jamai .sh{transform-origin:241px 48px;animation:hzSehra 1.5s ease-in-out infinite alternate}
.jamai .ear{transform-origin:330px 58px;animation:hzEar 6s ease-in-out infinite}
.jamai .ts{transform-origin:230px 200px;animation:hzTassel 1.2s ease-in-out infinite alternate}
@keyframes hzTail{from{transform:rotate(-5deg)}to{transform:rotate(7deg)}}
@keyframes hzPlume{from{transform:rotate(-6deg)}to{transform:rotate(5deg)}}
@keyframes hzSehra{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
@keyframes hzEar{0%,88%,100%{transform:rotate(0)}92%{transform:rotate(-14deg)}96%{transform:rotate(4deg)}}
@keyframes hzTassel{from{transform:skewX(-4deg)}to{transform:skewX(4deg)}}
@media (prefers-reduced-motion:reduce){.jamai *{animation:none!important}}
/* in English mode the secondary (Bangla) name keeps a Bangla face — no fake italics */
html.en .card small,html.en #shE{font-family:var(--bn);font-style:normal;font-size:.88rem;letter-spacing:0}
/* "one piece at a time": a warm skin-tone room so the light product pictures stand out */
.collections{background:radial-gradient(55% 45% at 50% 58%,rgba(226,170,128,.32),rgba(226,170,128,0) 70%),linear-gradient(180deg,#faf1e4,#f2e5cf)}
.collections .card .ph{background:#fffaf3}
.collections .tabs button:not(.on){background:rgba(255,255,255,.35)}
#buy .buy-line{font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1.35;margin-top:16px;max-width:14em}
/* cut-outs are always fully inside their card, centred, whatever their proportions */
.card .ph img:not(.full){position:absolute;inset:0;margin:auto;width:80%;height:80%;object-fit:contain}
/* English hero: two calm lines, never under the menu */
html.en .hero h1{max-width:none;font-size:clamp(2.3rem,4.6vw,5rem);line-height:1.08}
html.en .hero h1 .line{white-space:nowrap}
@media(max-width:899px){html.en .hero h1{font-size:clamp(2rem,9vw,2.8rem)}html.en .hero h1 .line{white-space:normal}}
/* product backdrop: the soft cream-sand the owner picked (#f5e9d6 → #f0e1c8) */
.card .ph,.collections .card .ph,.sheet .ph{background:linear-gradient(172deg,#f5e9d6 0%,#f3e6d1 50%,#f0e1c8 100%)}

/* product numbers */
.card .code{position:absolute;top:12px;right:12px;z-index:2;font:600 .72rem/1 var(--en);letter-spacing:.08em;padding:6px 9px;border-radius:99px;background:rgba(34,22,15,.78);color:#f6efe3}
.sheet .pcode{display:inline-block;margin-left:8px;font:600 .78rem var(--en);letter-spacing:.06em;padding:4px 12px;border-radius:99px;background:var(--kohl);color:var(--ivory)}
.card .code,.sheet .pcode{font-family:var(--body);font-weight:600;font-variant-numeric:lining-nums tabular-nums;letter-spacing:.04em}

/* ---------- order list ---------- */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:300;transform:translate(-50%,30px);opacity:0;pointer-events:none;background:var(--kohl);color:var(--ivory);padding:12px 18px;border-radius:12px;font-size:.92rem;width:max-content;max-width:min(92vw,420px);text-align:center;transition:opacity .35s,transform .35s;box-shadow:0 14px 30px -12px rgba(0,0,0,.5)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.btn-add{width:100%;justify-content:center;background:var(--haldi);color:var(--ink);margin-top:22px;cursor:pointer;border:0;font-family:inherit}
.btn-add.in{background:#e9d7a6}
.btn-add svg{width:20px;height:20px}
.sh-or{text-align:center;font-size:.85rem;color:var(--muted);margin:14px 0 10px}
.nav-cart{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer;margin-right:4px}
.nav-cart svg{width:20px;height:20px}
.cart-n{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--sindoor);color:#fff;font:600 .72rem/20px var(--body);text-align:center;font-style:normal}
.fm-cart{position:relative;background:var(--ink);border:0;cursor:pointer;font-family:inherit}
.fm-cart .cart-n{top:-6px;right:-6px;background:var(--haldi);color:var(--ink)}
.nav-cart.pop,.fm-cart.pop{animation:cartPop .55s var(--ease)}
@keyframes cartPop{0%{transform:scale(1)}35%{transform:scale(1.22)}100%{transform:scale(1)}}
.nav-cart[hidden],.fm-cart[hidden]{display:none}
.cart .cart-in{padding:30px 24px calc(28px + env(safe-area-inset-bottom));max-width:620px;margin:0 auto}
.cart h3{font-family:var(--bn);font-weight:400;font-size:clamp(1.5rem,2.6vw,2rem);margin:8px 0 18px}
.cart-list{list-style:none;display:grid;gap:10px;margin:0 0 16px;padding:0}
.cart-list li{display:grid;grid-template-columns:56px 1fr auto auto;gap:12px;align-items:center;padding:10px;border-radius:14px;background:linear-gradient(172deg,#f5e9d6,#f0e1c8)}
.cart-list .ci{width:56px;height:56px;border-radius:10px;overflow:hidden;background:#fbf6ee;display:grid;place-items:center}
.cart-list .ci img{width:86%;height:86%;object-fit:contain}.cart-list .ci.full img{width:100%;height:100%;object-fit:cover}
.cart-list .cn b{display:block;font-weight:500;line-height:1.3}
.cart-list .cn small{color:var(--muted);font-variant-numeric:lining-nums}
.cart-list .cq{display:flex;align-items:center;gap:8px}
.cart-list .cq button,.cart-list .cx{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:#fffaf3;cursor:pointer;font-size:1.1rem;line-height:1;color:var(--ink)}
.cart-list .cx{border:0;background:transparent;color:var(--muted);font-size:1.4rem}
.cart-note{font-size:.88rem;color:var(--muted);margin:0 0 16px}
.cart .sh-btns .btn{justify-content:center}
.cart .off{pointer-events:none;opacity:.4}
.cart-clear{display:block;margin:14px auto 0;background:none;border:0;color:var(--muted);text-decoration:underline;cursor:pointer;font-family:inherit}
@media(min-width:900px){.cart{left:auto;right:24px;bottom:24px;width:min(560px,calc(100vw - 48px));border-radius:22px;max-height:calc(100vh - 48px)}}
.sheet.cart{transform:translateY(calc(100% + 60px))}.sheet.cart.on{transform:none}
.btn-add{height:auto;min-height:54px;padding:12px 20px;text-align:center;line-height:1.35}
.btn-add span{flex:0 1 auto}
.sheet .tx .badge,.sheet .tx .pcode{align-self:flex-start;width:max-content}
@media(min-width:900px){.sheet .tx .pcode{margin:8px 0 0}}
/* loader: logo on the left, name beside it — same lockup as the header */
.loader>div{display:flex;align-items:center;gap:clamp(14px,2.4vw,26px)}
.loader svg{width:min(118px,24vw)}
.loader .lw{margin-top:0;width:min(250px,48vw)}

/* mirror wall on phones: title on the wall at the top, name + price button down on the sofa,
   so the empty wall between them is free for the mirror */
.wall .now .idx{font-family:var(--body);font-variant-numeric:lining-nums tabular-nums;letter-spacing:.08em}
@media(max-width:899px){
  .wall .hud{top:76px;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));max-width:none;pointer-events:none}
  .wall .hud .eyebrow{display:none}
  .wall .hud .display{font-size:clamp(1.45rem,6.6vw,1.9rem);margin-top:0!important}
  .wall .now{position:absolute;left:0;right:0;bottom:0;margin:0;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:12px;pointer-events:auto}
  .wall .now .nm{width:calc(100vw - 32px - 150px);font-size:1.25rem}
  .wall .now .btn{height:44px;padding:0 18px;flex:none}
  .wall .now .idx,.wall .now .nm span{text-shadow:0 0 14px rgba(255,250,240,.95),0 0 4px rgba(255,250,240,.9)}
}
.foot .credits .cr-link{text-decoration:none;border-bottom:1px solid rgba(240,190,70,.35);transition:border-color .3s}
.foot .credits .cr-link:hover{border-color:var(--haldi)}

/* ---------- search, share, rental details, questions ---------- */
.col-search{display:flex;align-items:center;gap:10px;max-width:520px;margin:26px 0 4px;padding:0 16px;height:50px;border-radius:99px;background:rgba(255,255,255,.6);border:1px solid var(--line)}
.col-search:focus-within{border-color:var(--sindoor);background:#fffaf3}
.col-search svg{width:20px;height:20px;flex:none;color:var(--muted)}
.col-search input{flex:1;min-width:0;border:0;background:transparent;font:400 1rem var(--body);color:var(--ink);outline:none}
.col-none{padding:30px 0;color:var(--muted)}
.sh-share{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px;height:44px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--ink);font:500 .95rem var(--body);cursor:pointer}
.sh-share svg{width:18px;height:18px}
.sh-share:hover{border-color:var(--ink)}
.cart-ev{display:grid;gap:10px;margin:0 0 16px;padding:14px;border-radius:14px;border:1px dashed var(--line)}
.cart-ev[hidden]{display:none}
.cart-ev-h{font-size:.85rem;color:var(--muted)}
.cart-ev label{display:grid;gap:4px;font-size:.88rem}
.cart-ev input{height:44px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:#fffaf3;font:400 1rem var(--body);color:var(--ink);width:100%}
.faq{padding:clamp(70px,9vw,120px) 0;border-top:1px solid var(--line)}
.faq-list{margin-top:34px;max-width:860px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:22px 0;font-family:var(--bn);font-size:clamp(1.1rem,1.8vw,1.35rem)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 1.8rem/1 var(--en);color:var(--sindoor);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--muted);max-width:70ch;line-height:1.75}
html.en .faq summary{font-family:var(--en);font-weight:600}
.foot .big a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.cart-list .cq b{font:600 1rem var(--body);min-width:1.2em;text-align:center}
/* Messenger is always Messenger blue, so customers recognise it at a glance (WhatsApp stays green) */
.btn[data-msg],#shA,#cartM,.float-msg .fm-ms{background:linear-gradient(135deg,#00B2FF 0%,#006AFF 100%);color:#fff;box-shadow:0 14px 30px -14px rgba(0,106,255,.65)}
.btn[data-msg]::after,#shA::after,#cartM::after{background:#0050C8}