:root{
  --yellow:oklch(0.87 0.17 92);
  --yellow-d:oklch(0.78 0.16 85);
  --ink:oklch(0.2 0.02 60);
  --ink-2:oklch(0.3 0.02 60);
  --paper:oklch(0.975 0.018 90);
  --red:oklch(0.58 0.2 28);
  --green:oklch(0.55 0.13 160);
  --mut:oklch(0.42 0.02 60);
  --f-d:"Bricolage Grotesque","Noto Sans Kannada","Noto Sans Devanagari",system-ui,sans-serif;
  --f-b:"Hanken Grotesk","Noto Sans Kannada","Noto Sans Devanagari",system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --pad:clamp(1.25rem,5vw,3rem);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--f-b);color:var(--ink);background:var(--paper);line-height:1.6;font-size:1.0625rem;overflow-x:hidden}
a{color:inherit}
h1,h2,h3{font-family:var(--f-d);line-height:1.08;text-wrap:balance}
h1{font-size:clamp(2.6rem,9.5vw,5.6rem);font-weight:800;letter-spacing:-.025em}
h2{margin-bottom:1rem;font-size:clamp(1.9rem,5.5vw,3.2rem);font-weight:800;letter-spacing:-.02em}
h3{font-size:1.25rem;font-weight:800}
p{max-width:62ch}
.wrap{max-width:1080px;margin:0 auto;padding:0 var(--pad)}
.small{font-size:.9rem;color:var(--ink-2)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

.top{position:absolute;inset:0 0 auto 0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:1rem var(--pad)}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--f-d);font-weight:800;font-size:1.15rem}
.brand-mark{width:2.25rem;height:2.25rem;border-radius:.55rem;display:block}
.lang{display:flex;background:oklch(0.2 0.02 60/.1);border-radius:99px;padding:3px}
.lang button{font:inherit;font-size:.85rem;font-weight:700;border:0;background:none;color:var(--ink);padding:.4rem .75rem;border-radius:99px;cursor:pointer;min-height:36px}
.lang button[aria-pressed=true]{background:var(--ink);color:var(--yellow)}

.hero{background:var(--yellow);padding:5.5rem var(--pad) 3rem;display:grid;gap:1.5rem;overflow:hidden;position:relative}
.hero-copy{max-width:36rem;z-index:2}
.kicker{font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}
.lede{font-size:1.15rem;margin:1.2rem 0 1.6rem}
.cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 1.5rem;border-radius:.8rem;font-weight:700;text-decoration:none;font:inherit;font-weight:700;border:2px solid var(--ink);cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-line{background:transparent}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--ink-2)}
.btn:active{transform:translateY(1px);box-shadow:none}

/* 3D stage */
.stage{transform-style:preserve-3d;position:relative;height:530px;perspective:1100px;display:grid;place-items:center;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.halo{position:absolute;width:300px;height:300px;border-radius:50%;background:var(--yellow-d);transform:translateZ(-80px)}
.phone{position:relative;width:224px;height:456px;transform-style:preserve-3d;will-change:transform;cursor:grab}
.phone:active{cursor:grabbing}
.screen{position:absolute;inset:0;border-radius:34px;background:var(--paper);border:8px solid var(--ink);overflow:hidden;transform:translateZ(7px);backface-visibility:hidden}
.edge{position:absolute;inset:0;border-radius:34px;background:var(--ink)}
.e1{transform:translateZ(5px)}.e2{transform:translateZ(2px)}.e3{transform:translateZ(-1px)}.e4{transform:translateZ(-4px)}.e5{transform:translateZ(-7px);background:var(--ink-2)}
.notch{position:absolute;top:6px;left:50%;width:64px;height:16px;background:var(--ink);border-radius:99px;transform:translateX(-50%);z-index:2}
.mini{font-size:12px;line-height:1.35;height:100%;display:flex;flex-direction:column}
.mini-hero{background:oklch(0.25 0.03 40);color:#fff8ee;padding:34px 14px 16px}
.mini-hero small{font-size:9px;letter-spacing:.14em;color:oklch(0.8 0.1 55)}
.mini-hero strong{display:block;font:800 22px/1.1 var(--f-d);margin:4px 0 2px}
.mini-hero span{font-size:11px;opacity:.8}
.mini-row{display:flex;justify-content:space-between;padding:11px 14px;border-bottom:1px solid oklch(0.2 0.02 60/.12)}
.mini-row em{font-style:normal;font-weight:700;color:oklch(0.5 0.13 45)}
.mini-map{margin:12px 14px;padding:18px 8px;text-align:center;background:oklch(0.9 0.04 150);border-radius:10px;font-size:11px}
.mini-call{margin:auto 14px 16px;background:var(--green);color:#fff;text-align:center;font-weight:700;padding:11px;border-radius:10px}
.float{position:absolute;background:var(--paper);border:2px solid var(--ink);border-radius:.8rem;padding:.55rem .85rem;display:flex;flex-direction:column;font-size:.8rem;line-height:1.25;box-shadow:4px 4px 0 var(--ink);will-change:transform}
.float b{font-family:var(--f-d)}
.f1{left:0;top:64%}.f2{right:0;top:12%}
.hint{position:absolute;bottom:0;font-size:.8rem;font-weight:700;opacity:.7}

section{padding:clamp(3.5rem,9vw,6.5rem) 0}
.hero{padding-bottom:3rem}
.band-paper{background:var(--paper)}
.two{display:grid;gap:1.75rem}
.big{font-family:var(--f-d);font-weight:500;font-size:clamp(1.3rem,3.6vw,1.75rem);line-height:1.3;margin-bottom:1rem}
.facts{margin-top:2rem;display:grid;gap:.9rem}
.facts div{display:flex;flex-wrap:wrap;gap:.2rem 1.25rem;padding-bottom:.9rem;border-bottom:1px solid oklch(0.2 0.02 60/.18)}
.facts dt{font-weight:700;min-width:7.5rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);padding-top:.15rem}
.facts dd{margin:0}

.make{background:oklch(0.94 0.03 92)}
.list{list-style:none;padding:0;margin-top:2.2rem;display:grid;gap:0}
.list li{display:grid;grid-template-columns:3.2rem 1fr;gap:1rem;padding:1.4rem 0;border-top:2px solid var(--ink)}
.list li:last-child{border-bottom:2px solid var(--ink)}
.n{font:800 1.6rem var(--f-d);color:var(--red)}
.list p{color:var(--ink-2);margin-top:.25rem}

.band-ink{background:var(--ink);color:var(--paper);overflow:hidden}
.band-ink h2{color:var(--yellow)}
.lede-s{margin-top:.8rem;opacity:.85}
.light{color:var(--paper);opacity:.8;margin-top:1rem}
.deck{perspective:1200px;display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:3rem var(--pad) 2rem;scrollbar-width:none;transform-style:preserve-3d}
.deck::-webkit-scrollbar{display:none}
.card{flex:0 0 min(72vw,260px);height:340px;scroll-snap-align:center;border-radius:1.2rem;padding:1.1rem;position:relative;display:flex;flex-direction:column;gap:.8rem;transform:rotateY(var(--ry,-14deg)) translateZ(0);transition:transform .7s var(--ease);will-change:transform;color:var(--ink)}
.deck.seen .card{--ry:0deg}
.card:hover,.card:focus-visible{transform:rotateY(0) translateY(-8px)}
.card .tag{position:absolute;top:.8rem;right:.8rem;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:.2rem .55rem;border-radius:99px}
.cs-top{padding:2.2rem 0 .6rem}
.cs-top strong{font:800 1.9rem/1.05 var(--f-d)}
.card ul{list-style:none;padding:0;display:grid;font-size:.95rem}
.card li{display:flex;justify-content:space-between;gap:.5rem;padding:.55rem 0;border-bottom:1px solid oklch(0.2 0.02 60/.2)}
.card em{font-style:normal;font-weight:700}
.cs-btn{margin-top:auto;text-align:center;font-weight:700;padding:.8rem;border-radius:.7rem}
.c-salon{background:oklch(0.82 0.1 55)}.c-salon .cs-btn{background:var(--ink);color:oklch(0.9 0.1 55)}
.c-dental{background:oklch(0.9 0.05 215)}.c-dental .cs-btn{background:oklch(0.35 0.09 230);color:#fff}
.c-bakery{background:oklch(0.9 0.08 85)}.c-bakery .cs-btn{background:var(--red);color:#fff}

.steps .rail{display:grid;gap:1.8rem;margin-top:2.2rem}
.rail div{position:relative;padding-left:3.4rem}
.rail b{position:absolute;left:0;top:0;width:2.5rem;height:2.5rem;display:grid;place-items:center;background:var(--yellow);border:2px solid var(--ink);border-radius:50%;font:800 1.1rem var(--f-d)}
.rail p{color:var(--ink-2);margin-top:.2rem}

.band-yellow{background:var(--yellow)}
.rev-list{display:grid;gap:1rem;margin-top:1.5rem}
.rev{background:var(--paper);border:2px solid var(--ink);border-radius:1rem;padding:1rem 1.1rem}
.rev .st{color:var(--red);letter-spacing:.1em}
.rev p{margin:.3rem 0}
.rev small{color:var(--mut)}
.rev-empty{font-weight:500;color:var(--ink-2)}
.form{background:var(--paper);border:2px solid var(--ink);border-radius:1.2rem;padding:1.4rem;display:grid;gap:1rem;box-shadow:6px 6px 0 var(--ink);align-content:start}
.fld{display:grid;gap:.35rem;font-weight:700;font-size:.9rem}
.fld input,.fld textarea{font:inherit;font-weight:400;font-size:1rem;padding:.75rem .9rem;border:2px solid var(--ink);border-radius:.7rem;background:#fffdf6;color:var(--ink);width:100%;min-height:48px}
.chk{display:flex;gap:.7rem;align-items:flex-start;font-size:.92rem}
.chk input{width:22px;height:22px;margin-top:.15rem;accent-color:var(--ink);flex:none}
.hp{position:absolute!important;left:-9999px;opacity:0}
.stars{border:0;padding:0;display:flex;flex-direction:row-reverse;flex-wrap:wrap;justify-content:flex-end;gap:.1rem}
.stars legend{order:-1;flex:0 0 100%;padding:0;font-weight:700;font-size:.9rem;margin-bottom:.3rem}
.stars input{position:absolute;opacity:0}
.stars label{font-size:2.4rem;line-height:1;color:oklch(0.2 0.02 60/.2);cursor:pointer;padding:.1rem .15rem;transition:transform .2s var(--ease),color .2s}
.stars label:hover,.stars label:hover~label,.stars input:checked~label{color:var(--red)}
.stars label:active{transform:scale(1.2)}
.stars input:focus-visible+label{outline:3px solid var(--ink);border-radius:6px}
.msg{font-weight:700;min-height:1.4em}
.msg.err{color:var(--red)}.msg.ok{color:var(--green)}

.foot{background:var(--ink);color:var(--paper);padding:2.5rem 0}
.foot-in{display:grid;gap:1.2rem}
.foot-links{display:grid;gap:.4rem}
.foot a{text-decoration:none;opacity:.9}.foot a:hover{text-decoration:underline}

.rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}

@media(min-width:760px){
  .hero{grid-template-columns:1.1fr .9fr;align-items:center;padding-top:7rem;min-height:92vh;max-width:none;padding-inline:max(var(--pad),calc((100vw - 1080px)/2 + var(--pad)))}
  .stage{height:600px}
  .phone{width:260px;height:530px}
  .two{grid-template-columns:.8fr 1.2fr;gap:3rem}
  .band-yellow .two{grid-template-columns:1fr 1fr}
  .list{grid-template-columns:1fr 1fr;column-gap:3rem}
  .list li:nth-last-child(2){border-bottom:2px solid var(--ink)}
  .deck{justify-content:center;overflow:visible}
  .card{flex-basis:260px}
  .deck .c-salon{--ry:28deg}.deck .c-bakery{--ry:-28deg}.deck .c-dental{--ry:0deg;transform:translateZ(40px)}
  .deck.seen .c-salon{--ry:14deg}.deck.seen .c-bakery{--ry:-14deg}
  .rail{grid-template-columns:repeat(3,1fr);gap:2rem}
  .foot-in{grid-template-columns:1fr auto;align-items:end}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
}
.still .hero{min-height:0!important}
.rev-sample{border-style:dashed;background:transparent}.rev-sample .st{color:var(--mut)}