/* KM Nazim Uddin — one-colour luxury portfolio.
   Colours sampled from the jubba in assets/portraits (olive-green, hue ~64°): light tone = background everywhere, dark tone = every button. Mobile-first. */
:root{
  --bg:#d3d8bc;                 /* jubba light tone — the single page background */
  --dk:#3b3e2d;                 /* jubba dark tone — buttons, headings accents */
  --dk1:#4a4e39; --dk2:#2c2f22; /* subtle tonal gradient of the dark tone (top → bottom) */
  --ink:#22251a; --text:#2e3225; --muted:#4f533e; --on-dk:#f2f4e4;
  --line:rgba(59,62,45,.16); --line2:rgba(59,62,45,.28);
  --card:#e4e8d0; --card2:#eaedd9; --card-b:rgba(59,62,45,.14);
  --sh:0 18px 44px -26px rgba(44,47,34,.5),0 2px 8px -4px rgba(44,47,34,.12);
  --btn-sh:0 10px 22px -10px rgba(44,47,34,.65),inset 0 1px 0 rgba(255,255,255,.16),inset 0 -2px 4px rgba(0,0,0,.18);
  --serif:'Noto Serif Bengali','Hind Siliguri',serif; --sans:'Hind Siliguri','Noto Serif Bengali',system-ui,sans-serif;
  --r:1.375rem; --pad:max(1.1rem,env(safe-area-inset-left),env(safe-area-inset-right)); --head:calc(4rem + env(safe-area-inset-top,0px));
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:var(--head)}
body{font-family:var(--sans);font-size:1.0625rem;line-height:1.75;color:var(--text);background:var(--bg);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;position:relative}
img{max-width:100%;display:block}a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);color:var(--ink);line-height:1.35;font-weight:700}
button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:0.1875rem solid var(--dk);outline-offset:3px;border-radius:0.5rem}
.skip{position:absolute;left:-999px;top:0.5rem;z-index:200;background:var(--bg);padding:.6rem 1rem;border-radius:0.625rem}.skip:focus{left:0.5rem}

/* ---------- ambient background: ONE colour + a faint, tone-on-tone Islamic girih (8-pointed star) tessellation ---------- */
.bg-pattern{position:fixed;left:-15rem;top:-15rem;right:-15rem;bottom:-15rem;z-index:-1;pointer-events:none;background:url(../assets/pattern.svg) 0 0/9rem 9rem;opacity:.1;animation:drift 220s linear infinite;will-change:transform}
@keyframes drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(9rem,9rem,0)}}
@media (prefers-reduced-motion:reduce){.bg-pattern{animation:none}}
.bg-glow{display:none}

/* ---------- layout ---------- */
.wrap{width:min(72.5rem,100% - 2*var(--pad));margin-inline:auto}
section{position:relative}
.sec{padding:clamp(3.2rem,8vw,6rem) 0}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;font:600 .86rem var(--sans);letter-spacing:.14em;color:var(--dk)}
.eyebrow::before,.eyebrow::after{content:"";width:1.625rem;height:1.5px;background:linear-gradient(90deg,transparent,var(--dk))}
.eyebrow::after{background:linear-gradient(270deg,transparent,var(--dk))}
.sec-head{text-align:center;max-width:46rem;margin:0 auto clamp(1.8rem,5vw,3rem)}
.sec-head h2{font-size:clamp(1.75rem,5vw,2.8rem);margin:.5rem 0 .6rem;font-weight:800}
.sec-head h2::after{content:"";display:block;width:3.375rem;height:0.1875rem;border-radius:0.1875rem;margin:.7rem auto 0;background:var(--dk);opacity:.85}
.sec-head p{color:var(--muted);font-size:1.04rem}
.reveal{opacity:0;transform:translateY(1.25rem);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;height:var(--head);padding-top:env(safe-area-inset-top,0px);z-index:60;display:flex;align-items:center;transition:background .35s,box-shadow .35s}
.hdr.solid{background:#d3d8bc;box-shadow:0 1px 0 var(--line)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;font:700 1.1rem var(--serif);color:var(--ink)}
.brand img{width:2.125rem;height:2.125rem}
.nav{display:none;gap:.1rem;align-items:center}
.nav a{padding:.5rem .8rem;border-radius:62.4375rem;text-decoration:none;font-weight:500;font-size:.97rem;color:var(--ink);transition:background .25s}
.nav a:hover{background:rgba(59,62,45,.1)}
.burger{width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;background:transparent}
.burger i{display:block;width:1.1875rem;height:2px;background:var(--dk);border-radius:2px;transition:.3s}
.burger i+i{margin-top:0.3125rem}
.burger[aria-expanded=true] i:nth-child(1){transform:translateY(0.4375rem) rotate(45deg)}.burger[aria-expanded=true] i:nth-child(2){opacity:0}.burger[aria-expanded=true] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.drawer{position:fixed;inset:var(--head) 0 auto 0;z-index:59;background:var(--bg);padding:.4rem 1.1rem 1.2rem;display:none;flex-direction:column;box-shadow:0 30px 40px -28px rgba(44,47,34,.5);border-radius:0 0 1.5rem 1.5rem;border-bottom:1px solid var(--line)}
.drawer.open{display:flex}.drawer a{padding:.9rem .5rem;border-bottom:1px solid var(--line);text-decoration:none;font:600 1.08rem var(--sans);color:var(--ink)}
@media(min-width:62rem){.nav{display:flex}.burger,.drawer{display:none!important}}

/* ---------- buttons: jubba dark tone, subtle tonal gradient ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:3rem;padding:.65rem 1.5rem;border-radius:62.4375rem;border:1px solid rgba(255,255,255,.14);text-decoration:none;color:var(--on-dk);font:700 1.02rem var(--sans);letter-spacing:.01em;
  background:linear-gradient(180deg,var(--dk1) 0%,var(--dk) 55%,var(--dk2) 100%);box-shadow:var(--btn-sh);transition:transform .25s,box-shadow .3s,filter .3s}
.btn::after{content:"";position:absolute;z-index:-1;top:0;bottom:0;width:36%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);transition:left .8s ease}
.btn:hover{filter:brightness(1.08);box-shadow:0 16px 30px -12px rgba(44,47,34,.75),inset 0 1px 0 rgba(255,255,255,.18),inset 0 -2px 4px rgba(0,0,0,.18)}
.btn:hover::after{left:130%}.btn:active{transform:translateY(0)}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn.lg{min-height:3.4rem;padding:.8rem 2rem;font-size:1.1rem}
.btn.sm{min-height:2.75rem;padding:.4rem 1rem;font-size:.93rem}
.btn.ghost{background:var(--card2);color:var(--ink);border:1px solid var(--line2);box-shadow:0 8px 18px -14px rgba(44,47,34,.5),inset 0 1px 0 rgba(255,255,255,.7)}
.btn.ghost:hover{background:#f2f4e6}
.btn[disabled],.btn.off{opacity:.55;pointer-events:none}

/* ---------- hero v10: ONE rounded square card = exactly the real 16:9 photo of each poster (extension streaks removed) + dark name bar; subtle 3D tilt; button below ---------- */
.hero{position:relative;padding:calc(var(--head) + clamp(1rem,2.6svh,2rem)) var(--pad) 0}
.card3d{--rx:0deg;--ry:0deg;width:min(100%,62rem,calc((100svh - var(--head) - 17rem)*16/9));min-width:min(100%,22rem);margin-inline:auto;transform:perspective(1300px) rotateX(var(--rx)) rotateY(var(--ry));will-change:transform}
.band{--r:2.25rem;position:relative;width:100%;container-type:inline-size;border-radius:var(--r);overflow:hidden;clip-path:inset(0 round var(--r));isolation:isolate;background:#23261c;box-shadow:0 .25rem .5rem rgba(44,47,34,.22),0 1rem 1.6rem -.5rem rgba(44,47,34,.3),0 2.4rem 3.6rem -1rem rgba(44,47,34,.5);animation:cardfloat 11s ease-in-out infinite alternate;will-change:transform}
@keyframes cardfloat{0%{transform:translateY(0) rotateY(-1.6deg) rotateX(.9deg)}100%{transform:translateY(-.4rem) rotateY(1.6deg) rotateX(-.9deg)}}
.frame{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;isolation:isolate;outline-offset:-4px;background:#23261c}
.slide{position:absolute;inset:0;opacity:0;transform:perspective(900px) rotateY(-14deg) scale(.97);transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
.slide.on{opacity:1;transform:none}
.slide picture{position:absolute;inset:0;display:block}
/* the real photo inside each poster is a 1080x~608 (16:9) picture, centred in the 4:5 canvas and extended top/bottom with flat edge streaks; cover into a 16:9 frame shows exactly that photo, no bands, no fill */
.slide picture img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero-name{position:relative;z-index:3;text-align:center;padding:.85rem 1rem 1rem;background:linear-gradient(180deg,#2c2f22,#23261c);border-top:1px solid rgba(211,216,188,.18)}
.hero-name h1{margin:0;font-weight:800;font-size:clamp(1.4rem,6.4vw,2.1rem);line-height:1.3;white-space:nowrap;color:#f4f2e4;letter-spacing:-.005em}
.hero-name .tag{margin:.1rem 0 0;display:block;color:#d3d8bc;font:500 clamp(1rem,4.1vw,1.25rem) var(--serif)}
@supports (width:1cqw){.hero-name h1{font-size:min(2.8rem,7.4cqw)}.hero-name .tag{font:500 min(1.5rem,4.7cqw) var(--serif)}}
.hero-cta{display:flex;justify-content:center;padding:clamp(1.4rem,3.4svh,2.2rem) 0 0}
.hero-id{min-height:4.5rem;padding-inline:3rem;font-size:1.4rem;gap:.7rem}
.hero-id svg{width:1.5rem;height:1.5rem}
@media(max-width:47.99rem){
  .band{--r:1.75rem}
  .hero-id{min-height:4.25rem;font-size:1.3rem;padding-inline:2.6rem}
}
@media(prefers-reduced-motion:reduce){.card3d{transform:none!important;will-change:auto}.band{animation:none}.slide{transform:none!important;transition:opacity .6s ease}}

/* ---------- ring (circular carousel) ---------- */
.ring-wrap{position:relative;max-width:47.5rem;margin-inline:auto}
.ring{position:relative;height:clamp(16.875rem,50vw,23.75rem);touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab;--cw:min(56vw,18.75rem)}
.ring:active{cursor:grabbing}
.ring::before{content:"";position:absolute;left:8%;right:8%;top:14%;bottom:4%;border-radius:50%;border:1.5px dashed var(--line2);transform:perspective(56.25rem) rotateX(62deg);pointer-events:none}
.rc{position:absolute;top:0;left:50%;width:var(--cw);margin-left:calc(var(--cw)/-2);aspect-ratio:1/1;border-radius:1.375rem;overflow:hidden;background:#cfd3bd;box-shadow:0 20px 40px -22px rgba(44,47,34,.7),0 0 0 1px rgba(255,255,255,.55);will-change:transform,opacity;border:0;padding:0;display:block;backface-visibility:hidden}
.rc img{width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.rc.front{box-shadow:0 26px 48px -24px rgba(44,47,34,.75),0 0 0 2px #fff}
.ring-ui{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem}
.rbtn{width:3rem;height:3rem;border-radius:50%;border:1px solid rgba(255,255,255,.14);color:var(--on-dk);display:grid;place-items:center;background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh);transition:filter .25s}
.rbtn:hover{filter:brightness(1.1)}.rbtn svg{width:1.3125rem;height:1.3125rem}
.ring-cnt{text-align:center;font:600 .86rem var(--sans);letter-spacing:.1em;color:var(--dk);margin-top:.4rem}

/* ---------- services: 3 per row everywhere, icon + short title; details open in a sheet ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;max-width:45rem;margin-inline:auto}.svc-grid:empty{min-height:clamp(18rem,72vw,28rem)}
.svc-grid .svc:last-child:nth-child(3n+1){grid-column:2}
@media(min-width:48rem){.svc-grid{gap:1rem}}
.svc{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;padding:.8rem .35rem .75rem;border-radius:1.125rem;background:var(--card);border:1px solid var(--card-b);box-shadow:var(--sh);color:var(--ink);text-align:center;font-family:var(--sans)}
@media(min-width:48rem){.svc{padding:1.2rem .6rem 1.1rem;gap:.7rem}}
.svc:hover{border-color:var(--line2);background:#eceedd}
.svc .ic{width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh)}
.svc .ic svg{width:1.4375rem;height:1.4375rem}
@media(min-width:48rem){.svc .ic{width:3.5rem;height:3.5rem}.svc .ic svg{width:1.75rem;height:1.75rem}}
.svc b{font:700 .88rem/1.35 var(--serif);color:var(--ink)}
@media(min-width:48rem){.svc b{font-size:1.1rem}}
.more-links{display:none}
.fine{text-align:center;color:var(--muted);font-size:.86rem;margin-top:1.2rem}
/* sheet / modal */
.sheet-bg{position:fixed;inset:0;z-index:120;background:rgba(34,37,26,.55);display:none;align-items:flex-end;justify-content:center;padding:0}
.sheet-bg.open{display:flex}
@media(min-width:40rem){.sheet-bg{align-items:center;padding:1rem}}
.sheet{position:relative;width:min(32.5rem,100%);max-height:88svh;overflow:auto;background:#e4e8d0;border-radius:1.625rem 1.625rem 0 0;padding:1.4rem 1.2rem 1.5rem;box-shadow:0 -20px 60px -20px rgba(0,0,0,.5);border:1px solid var(--line)}
@media(min-width:40rem){.sheet{border-radius:1.625rem}}
.sheet h3{display:flex;align-items:center;gap:.7rem;font-size:1.3rem;margin-bottom:.7rem;padding-right:2.6rem}
.sheet h3 .ic{width:2.625rem;height:2.625rem;border-radius:50%;display:grid;place-items:center;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));flex:none}
.sheet h3 .ic svg{width:1.375rem;height:1.375rem}
.sheet p{color:var(--text);margin-bottom:.7rem;font-size:1rem}
.sheet .sx{position:absolute;top:.8rem;right:.8rem;width:2.5rem;height:2.5rem;border-radius:50%;border:1px solid var(--line2);background:#eceedd;color:var(--ink);font-size:1.5rem;line-height:1}
.sheet .sbtns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:1rem 0 .6rem}
.sheet .sbtns .btn{font-size:.92rem;padding-inline:.6rem;text-align:center;line-height:1.3}
.sheet .snote{font-size:.85rem;color:var(--muted);background:#dadfc3;border-radius:0.75rem;padding:.6rem .8rem;margin-top:.4rem}
.sheet dl{display:grid;gap:.7rem;margin:.4rem 0}
.sheet dt{font-size:.78rem;font-weight:700;letter-spacing:.06em;color:var(--muted)}.sheet dd{margin:0;color:var(--ink);font-weight:500;line-height:1.5}

/* ---------- নগরবিদ: one opaque round container ---------- */
.ai-sec .wrap{display:flex;justify-content:center}
.ai-round{width:min(42.5rem,100%);text-align:center;padding:clamp(1.6rem,5vw,2.6rem) clamp(1rem,4vw,2rem) clamp(1.3rem,4vw,2rem);border-radius:clamp(2.25rem,9vw,4rem);background:#e4e8d0;border:1px solid var(--line2);box-shadow:var(--sh)}
.ai-round h2{font-size:clamp(1.7rem,5vw,2.4rem);font-weight:800}
.ai-round h2::after{content:"";display:block;width:3.375rem;height:0.1875rem;border-radius:0.1875rem;margin:.6rem auto 0;background:var(--dk);opacity:.85}
.ai-desc{color:var(--muted);max-width:30rem;margin:.9rem auto 1.4rem;font-size:1rem}
.orb{position:relative;width:clamp(7.5rem,34vw,10rem);aspect-ratio:1/1;margin:0 auto;border-radius:50%;border:0;padding:0;color:var(--on-dk);display:grid;place-items:center;background:radial-gradient(120% 120% at 32% 22%,var(--dk1),var(--dk) 52%,var(--dk2));box-shadow:0 22px 40px -18px rgba(44,47,34,.8),inset 0 2px 0 rgba(255,255,255,.18),inset 0 -10px 24px rgba(0,0,0,.25)}
.orb svg{width:46%;height:46%}
.orb{outline-offset:6px}
.ai-langs{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin:1.5rem auto 0}
.ai-langs button{min-height:2.7rem;padding:.35rem 1.3rem;border-radius:62.4375rem;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font:700 1rem var(--sans)}
.ai-langs button[aria-pressed=true]{background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));color:var(--on-dk);border-color:transparent;box-shadow:var(--btn-sh)}
.chat{position:relative;width:100%;margin:0 auto;display:flex;flex-direction:column;border-radius:1.625rem;overflow:hidden;text-align:left;background:#eceedd;border:1px solid var(--line);
  height:0;opacity:0;visibility:hidden;margin-top:0;transition:height .5s ease,opacity .35s,margin .4s,visibility 0s .5s}
.chat.open{height:min(35rem,76svh);opacity:1;visibility:visible;margin-top:1.4rem;transition:height .5s ease,opacity .4s .1s,margin .4s,visibility 0s}
.chat-h{display:flex;align-items:center;gap:.8rem;padding:.7rem 1rem;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));flex:none}
.chat-h strong{font:700 1.05rem var(--serif);line-height:1.25}
.chat-x{margin-left:auto;width:2.375rem;height:2.375rem;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:1.4rem;line-height:1}
.chat-msgs{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.7rem;scroll-behavior:smooth}
.msg{max-width:88%;padding:.65rem .95rem;border-radius:1.125rem;font-size:1rem;line-height:1.6;word-break:break-word}
.msg.bot{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:0.375rem;color:var(--text)}
.msg.user{align-self:flex-end;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk2));border-bottom-right-radius:0.375rem}
.msg a{color:var(--dk);font-weight:700}
.typing-indicator{display:none;align-self:flex-start;gap:0.3125rem;padding:.7rem 1rem;background:#fff;border-radius:1.125rem}.typing-indicator.visible{display:flex}
.typing-indicator span{width:0.5rem;height:0.5rem;border-radius:50%;background:var(--dk);animation:ty 1.2s infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}
@keyframes ty{0%,80%,100%{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1.1)}}
.chat .chips{display:flex;gap:.45rem;overflow-x:auto;padding:.2rem 1rem .6rem;flex:none;scrollbar-width:none}
.chat-in{display:flex;gap:.5rem;padding:.4rem 1rem .6rem;flex:none}
.chat-in input{border-radius:62.4375rem;padding-inline:1.1rem}
.chat-send{width:3rem;height:3rem;border-radius:50%;border:1px solid rgba(255,255,255,.14);flex:none;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh);font-size:1.1rem}
.ai-note{font-size:.74rem;color:var(--muted);padding:0 1rem .7rem;line-height:1.4;flex:none}
/* voice-core UI (mic, speak toggle); language is chosen with the chips above */
.vx-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .5rem;padding:.3rem 1rem 0;flex:none}
.vx-lang{display:none!important}
.vx-mic{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;padding:.45rem 1.1rem;border-radius:62.4375rem;border:1px solid rgba(255,255,255,.14);color:var(--on-dk);font:700 .96rem var(--sans);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh)}
.vx-mic.listening{background:#9c3a2a;animation:vxp 1.2s ease-out infinite}
@keyframes vxp{0%{box-shadow:0 0 0 0 rgba(156,58,42,.55)}70%{box-shadow:0 0 0 14px rgba(156,58,42,0)}100%{box-shadow:0 0 0 0 rgba(156,58,42,0)}}
.vx-status{flex:1 1 7rem;min-width:0;font-size:.8rem;line-height:1.3;color:var(--muted)}.vx-status.active{color:var(--ink);font-weight:700}
.vx-row2{flex:1 0 100%;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.vx-toggle,.vx-stop{display:inline-flex;align-items:center;gap:.35rem;min-height:2.125rem;padding:.2rem .8rem;border-radius:62.4375rem;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font-size:.8rem;font-weight:600}
.vx-toggle.on{background:var(--dk);color:var(--on-dk);border-color:transparent}.vx-stop{background:#9c3a2a;border-color:#9c3a2a;color:#fff}.vx-stop[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){.vx-mic.listening{animation:none}}

/* ---------- community ---------- */
.com-grid{display:grid;gap:1.4rem;grid-template-columns:minmax(0,1fr)}.com-grid>*{min-width:0}
@media(min-width:62rem){.com-grid{grid-template-columns:minmax(0,25.625rem) minmax(0,1fr);align-items:start}.com-form{position:sticky;top:calc(var(--head) + 1rem)}}
.panel{background:var(--card);border:1px solid var(--card-b);border-radius:1.625rem;box-shadow:var(--sh);padding:clamp(1.1rem,3vw,1.6rem)}
.com-form h3{font-size:1.3rem;margin-bottom:.2rem}.com-form .sub{color:var(--muted);font-size:.92rem;margin-bottom:1.1rem}
.form-row{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.9rem}
label,.lbl{font-weight:600;font-size:.93rem;color:var(--ink)}
input,select,textarea{width:100%;font:inherit;color:var(--ink);background:var(--card2);border:1.5px solid var(--line2);border-radius:0.875rem;padding:.7rem .9rem;min-height:3rem;transition:border-color .2s,box-shadow .2s}
textarea{min-height:8rem;resize:vertical;line-height:1.6}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--dk);box-shadow:0 0 0 4px rgba(59,62,45,.14)}
.hp{position:absolute!important;left:-9999px;opacity:0;height:0;width:0}
.form-msg{min-height:1.4rem;font-weight:600;margin-top:.7rem;font-size:.95rem}.form-msg.ok{color:#2c6a3a}.form-msg.err{color:#9c3a2a}
.counter{font-size:.8rem;color:var(--muted);text-align:right}
.catpick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}
.catpick label{position:relative;display:block;margin:0}
.catpick input{position:absolute;opacity:0;inset:0;min-height:0;cursor:pointer}
.catpick span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:2.5rem;padding:.25rem .5rem;border-radius:62.4375rem;border:1px solid var(--line2);background:var(--card2);font-weight:600;font-size:.86rem;color:var(--ink);line-height:1.25;transition:.2s}
.catpick input:checked+span{background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));color:var(--on-dk);border-color:transparent;box-shadow:var(--btn-sh)}
.catpick input:focus-visible+span{outline:0.1875rem solid var(--dk);outline-offset:2px}
.filters{display:flex;gap:.45rem;overflow-x:auto;padding:.1rem .1rem .8rem;margin-bottom:.2rem;scrollbar-width:thin}
.chip{flex:none;padding:.4rem .95rem;border-radius:62.4375rem;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font-weight:600;font-size:.88rem;min-height:2.4rem}
.chip.on{color:var(--on-dk);border-color:transparent;background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh)}
.stat{display:flex;gap:.6rem;margin-bottom:.9rem;flex-wrap:wrap}
.stat span{padding:.3rem .9rem;border-radius:62.4375rem;background:var(--card2);border:1px solid var(--line);font-size:.88rem;color:var(--muted)}.stat b{color:var(--ink);font-size:1rem}
.post{position:relative;padding:1rem 1.1rem 1rem 1.3rem;border-radius:1.375rem;background:var(--card);border:1px solid var(--card-b);box-shadow:var(--sh);margin-bottom:.9rem;overflow:hidden}
.post::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0.3125rem;background:var(--dk);opacity:.5}
.post.solved::before{opacity:1;background:#2f6b3e}
.post header{display:flex;align-items:center;gap:.75rem;margin-bottom:.55rem}
.av{width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;color:var(--on-dk);font:700 1.15rem var(--serif);background:linear-gradient(180deg,var(--dk1),var(--dk2));flex:none;box-shadow:var(--btn-sh)}
.post .who{font-weight:700;color:var(--ink);line-height:1.3}.post .meta{font-size:.8rem;color:var(--muted)}
.tagc{margin-left:auto;font-size:.76rem;font-weight:700;padding:.2rem .75rem;border-radius:62.4375rem;background:rgba(59,62,45,.1);color:var(--dk);white-space:nowrap;border:1px solid var(--line)}
.post .body{white-space:pre-wrap;word-break:break-word}
.status{display:inline-block;font-size:.76rem;font-weight:700;padding:.15rem .7rem;border-radius:62.4375rem;margin-top:.55rem}
.status.review{background:rgba(59,62,45,.12);color:var(--dk)}.status.solved{background:#d4e8d0;color:#2a5a35}
.reply{margin-top:.7rem;padding:.7rem .9rem;border-radius:0.875rem;background:rgba(59,62,45,.08);border-left:3px solid var(--dk)}
.reply b{display:block;font-size:.82rem;color:var(--dk);margin-bottom:.1rem}
.post .acts{display:flex;gap:.5rem;margin-top:.75rem;flex-wrap:wrap}
.mini{min-height:2.4rem;padding:.3rem .95rem;border-radius:62.4375rem;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font-weight:600;font-size:.86rem}
.mini:hover{background:#fff}.mini.on{background:var(--dk);color:var(--on-dk);border-color:transparent}
.empty{text-align:center;color:var(--muted);padding:2rem 1rem}

/* ---------- contact: three buttons per row; details open in the sheet ---------- */
.ct-grid{display:grid;gap:.6rem;grid-template-columns:repeat(3,minmax(0,1fr));max-width:45rem;margin-inline:auto}
@media(min-width:48rem){.ct-grid{gap:1rem}}
.ct{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.9rem .35rem .85rem;border-radius:1.125rem;background:var(--card);border:1px solid var(--card-b);box-shadow:var(--sh);color:var(--ink);text-align:center;font-family:var(--sans)}
@media(min-width:48rem){.ct{padding:1.3rem .6rem 1.2rem;gap:.7rem}}
.ct:hover{border-color:var(--line2);background:#eceedd}
.ct .ic{width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh)}
.ct .ic svg{width:1.4375rem;height:1.4375rem}
@media(min-width:48rem){.ct .ic{width:3.5rem;height:3.5rem}.ct .ic svg{width:1.75rem;height:1.75rem}}
.ct b{font:700 .88rem/1.35 var(--serif)}
@media(min-width:48rem){.ct b{font-size:1.1rem}}
.ph{display:inline-block;padding:.1rem .65rem;border-radius:62.4375rem;font-size:.88rem;font-weight:600;background:repeating-linear-gradient(135deg,rgba(59,62,45,.1) 0 0.5rem,rgba(59,62,45,.04) 0.5rem 1rem);color:var(--muted);border:1px dashed var(--line2)}
.chk{display:inline-block;margin-left:.35rem;padding:.05rem .55rem;border-radius:62.4375rem;font-size:.72rem;font-weight:700;background:rgba(59,62,45,.12);color:var(--dk);vertical-align:middle}

/* ---------- footer (same background colour — only a hairline above) ---------- */
.ftr{padding:2.4rem 0 3rem;text-align:center;color:var(--muted);margin-top:1rem;border-top:1px solid var(--line)}
.ftr .brand{justify-content:center;margin-bottom:.4rem}
.ftr nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.2rem;margin:.9rem 0}
.ftr nav a{color:var(--dk);font-weight:600;text-decoration:none}
.ftr small{display:block;margin-top:.8rem;font-size:.82rem}

/* ---------- identity page ---------- */
.id-hero{padding:calc(var(--head) + 2rem) 0 2rem}
.id-top{display:grid;gap:1.6rem;align-items:center;grid-template-columns:1fr}
@media(min-width:52rem){.id-top{grid-template-columns:minmax(0,21.25rem) 1fr;gap:3rem}}
.id-photo{--fw:min(100%,21.25rem);position:relative;width:var(--fw);aspect-ratio:4/5;border-radius:1.625rem;overflow:hidden;box-shadow:0 30px 50px -28px rgba(44,47,34,.7),0 0 0 1px rgba(44,47,34,.35);margin-inline:auto;background:#2c2f22}
.id-photo img{width:100%;height:100%;object-fit:cover;object-position:44% 14%}
.id-top h1{font-size:clamp(2rem,6vw,3.4rem);font-weight:800;margin:.4rem 0 .3rem}
.id-top .role{font:600 1.15rem var(--serif);color:var(--dk);margin-bottom:.9rem}
.facts{display:grid;gap:.6rem;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1.2rem}
.fact{padding:.75rem .9rem;border-radius:1rem;background:var(--card);border:1px solid var(--card-b)}
.fact span{display:block;font-size:.78rem;color:var(--muted);font-weight:600;letter-spacing:.04em}.fact b{display:block;color:var(--ink);font-weight:700;line-height:1.5;word-break:break-word}
.blk{margin-top:clamp(2.2rem,6vw,3.4rem)}
.blk>h2{font-size:clamp(1.45rem,4vw,2.1rem);margin-bottom:1.1rem;display:flex;align-items:center;gap:.8rem}
.blk>h2::after{content:"";flex:1;height:1.5px;background:linear-gradient(90deg,var(--line2),transparent)}
.tl{position:relative;padding-left:1.6rem;display:grid;gap:1rem}
.tl::before{content:"";position:absolute;left:0.375rem;top:0.5rem;bottom:0.5rem;width:2px;background:var(--dk);opacity:.5}
.tl li{list-style:none;position:relative;padding:.85rem 1.05rem;border-radius:1.125rem;background:var(--card);border:1px solid var(--card-b);box-shadow:var(--sh)}
.tl li::before{content:"";position:absolute;left:-1.6rem;top:1.3rem;width:0.875rem;height:0.875rem;border-radius:50%;background:var(--dk);box-shadow:0 0 0 4px var(--bg)}
.tl li b{display:block;color:var(--ink)}.tl li span{color:var(--muted);display:block}
.orgs{display:grid;gap:1rem;grid-template-columns:minmax(0,1fr)}
@media(min-width:48rem){.orgs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.org{padding:1.2rem;border-radius:var(--r);background:var(--card);border:1px solid var(--card-b);box-shadow:var(--sh)}
.org h3{font-size:1.2rem;margin-bottom:.15rem}.org .r{color:var(--dk);font-weight:700;margin-bottom:.4rem}.org p{margin:.2rem 0;font-size:.97rem}
.org .k{color:var(--muted);font-size:.85rem;font-weight:600}
.prio{display:grid;gap:.7rem;grid-template-columns:minmax(0,1fr)}
@media(min-width:40rem){.prio{grid-template-columns:repeat(2,minmax(0,1fr))}}
.prio div{display:flex;gap:.8rem;align-items:flex-start;padding:.8rem 1rem;border-radius:1rem;background:var(--card);border:1px solid var(--card-b)}
.prio i{flex:none;width:2.125rem;height:2.125rem;border-radius:50%;display:grid;place-items:center;font:700 .95rem var(--serif);font-style:normal;color:var(--on-dk);background:linear-gradient(180deg,var(--dk1),var(--dk2))}
.prio b{display:block;color:var(--ink);line-height:1.35}.prio span{font-size:.92rem;color:var(--muted);line-height:1.5}
.src{font-size:.84rem;color:var(--muted);margin-top:.8rem}
.src a{color:var(--dk);font-weight:700}

@media(prefers-reduced-motion:reduce){.rc{will-change:auto}}

/* ---------- big displays (TV / LED / 4K): everything is in rem, so scaling the root keeps the layout as on a ~1536px screen ---------- */
@media(min-width:120rem){html{font-size:125%}}
@media(min-width:160rem){html{font-size:166.67%}}
@media(min-width:240rem){html{font-size:250%}}

/* ---------- touch targets ≥ 44px, safe areas ---------- */
.chip,.mini,.catpick span,.ai-langs button{min-height:2.75rem}
.vx-toggle,.vx-stop{min-height:2.75rem}
.rbtn,.chat-x,.sheet .sx{min-width:2.75rem;min-height:2.75rem}
.ftr{padding-bottom:calc(3rem + env(safe-area-inset-bottom,0px))}
.drawer a{min-height:2.75rem}
.chat-in{padding-bottom:calc(.6rem + env(safe-area-inset-bottom,0px))}
body{padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}
.sheet{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom,0px))}

/* ---------- community: two big buttons; post form and desk open as full screens ---------- */
.com-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;max-width:44rem;margin-inline:auto}
@media(min-width:48rem){.com-actions{gap:1.4rem}}
.com-big{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;min-height:9rem;padding:1.2rem .6rem;border-radius:1.6rem;border:1px solid rgba(255,255,255,.14);color:var(--on-dk);font:700 clamp(1.1rem,3.6vw,1.6rem) var(--serif);line-height:1.3;text-align:center;
  background:linear-gradient(180deg,var(--dk1),var(--dk) 55%,var(--dk2));box-shadow:var(--btn-sh);transition:filter .25s}
@media(min-width:48rem){.com-big{min-height:12rem;gap:1rem}}
.com-big:hover{filter:brightness(1.1)}
.com-big svg{width:2.4rem;height:2.4rem}
@media(min-width:48rem){.com-big svg{width:3rem;height:3rem}}
.screen{position:fixed;inset:0;z-index:125;background:#d3d8bc;display:none;flex-direction:column;overscroll-behavior:contain}
.screen.open{display:flex}
.scr-bar{flex:none;display:flex;align-items:center;gap:.8rem;padding:calc(.7rem + env(safe-area-inset-top,0px)) var(--pad) .7rem;background:#d3d8bc;border-bottom:1px solid var(--line)}
.scr-bar h2{font-size:clamp(1.15rem,3.5vw,1.6rem);flex:1;min-width:0;margin:0}
.scr-x{width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--line2);background:#eceedd;color:var(--ink);font-size:1.6rem;line-height:1;flex:none}
.scr-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1.2rem var(--pad) calc(2rem + env(safe-area-inset-bottom,0px))}
.scr-in{width:min(46rem,100%);margin-inline:auto}
.scr-in.narrow{width:min(34rem,100%)}
.desk-intro{color:var(--muted);margin-bottom:1rem}
.com-form{position:static!important}

/* ---------- PWA install ---------- */
.ftr-tools{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin:1rem 0 .2rem}
.pwa-bar{position:fixed;z-index:110;left:50%;transform:translateX(-50%);bottom:calc(.8rem + env(safe-area-inset-bottom,0px));width:min(30rem,100% - 1.6rem);display:flex;align-items:center;gap:.7rem;padding:.7rem .8rem .7rem 1rem;border-radius:1.2rem;background:#e4e8d0;border:1px solid var(--line2);box-shadow:0 1rem 2.5rem -1rem rgba(44,47,34,.6)}
.pwa-bar span{flex:1;font-weight:600;font-size:.95rem;line-height:1.35}
.pwa-bar .pwa-x{width:2.75rem;height:2.75rem;border-radius:50%;border:0;background:none;font-size:1.5rem;color:var(--muted)}
.steps{margin:.6rem 0 .8rem 1.2rem;display:grid;gap:.6rem}.steps li{line-height:1.6}

/* ---------- TV / display (kiosk) mode: ?display=tv ---------- */
html.tvmode,html.tvmode body{cursor:none!important;overflow:hidden!important;height:100%}
html.tvmode body>*:not(.tv-stage):not(.bg-pattern):not(script){display:none!important}
.tv-stage{position:fixed;inset:0;z-index:300}
.tv-slide{position:absolute;inset:0;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6vmin;padding:6vmin 8vmin;opacity:0;visibility:hidden;transition:opacity 1.2s ease,visibility 0s 1.2s}
.tv-slide.on{opacity:1;visibility:visible;transition:opacity 1.2s ease}
.tv-photo{height:84vmin;aspect-ratio:4/5;max-width:46vw;border-radius:4vmin;overflow:hidden;box-shadow:0 3vmin 6vmin -3vmin rgba(44,47,34,.7);background:#23261c}
.tv-photo.sq{aspect-ratio:1/1;max-width:50vw;height:min(78vmin,100%)}
.tv-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 8%}
.tv-photo.sq img{object-position:50% 50%}
.tv-txt h1{font-size:8.2vmin;line-height:1.3;font-weight:800;white-space:nowrap;margin:0}
.tv-txt .t{font:500 4.6vmin var(--serif);color:var(--muted);margin-top:1.2vmin}
.tv-txt h3{font-size:7vmin;line-height:1.3;margin:0 0 2vmin}
.tv-txt p{font-size:3.8vmin;line-height:1.6;color:var(--text)}
.tv-brand{position:absolute;z-index:2;left:8vmin;bottom:3.2vmin;font:600 2.6vmin var(--serif);color:var(--muted);letter-spacing:.02em}
.tv-count{position:absolute;right:8vmin;bottom:3.2vmin;font:600 2.4vmin var(--sans);color:var(--muted)}
@media(max-aspect-ratio:1/1){.tv-slide{grid-template-columns:minmax(0,1fr);align-content:center;justify-items:center;text-align:center;gap:4vmin}.tv-photo,.tv-photo.sq{height:auto;width:min(80vw,52vh*.8);max-width:none}.tv-photo.sq{width:min(80vw,46vh)}.tv-txt h1{font-size:7vmin}.tv-txt h3{font-size:5.6vmin}.tv-txt p{font-size:3.4vmin}.tv-txt .t{font-size:4vmin}}

.brand{min-height:2.75rem}
.nav a{min-height:2.75rem;display:inline-flex;align-items:center}
.ftr nav a{display:inline-flex;align-items:center;min-height:2.75rem}
.ftr .brand{min-height:2.75rem}

/* ======================= 3D buttons v11 (luxury, clean): fine bevel, smooth gradient, inner highlight hairline, soft layered shadows, slim 2px edge ======================= */
:root{
  --bv-d:inset 0 1px 0 rgba(255,255,255,.24),inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -1px 0 rgba(0,0,0,.4),0 1px 1px rgba(25,27,18,.4),0 2px 0 #26281d,0 5px 9px -2px rgba(25,27,18,.32),0 12px 22px -10px rgba(25,27,18,.38);
  --bv-d-h:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.06),inset 0 -1px 0 rgba(0,0,0,.4),0 1px 1px rgba(25,27,18,.4),0 3px 0 #26281d,0 8px 14px -3px rgba(25,27,18,.32),0 18px 28px -12px rgba(25,27,18,.4);
  --bv-d-p:inset 0 2px 5px rgba(0,0,0,.36),inset 0 0 0 1px rgba(0,0,0,.12),0 1px 0 #26281d,0 2px 4px -2px rgba(25,27,18,.35);
  --bv-l:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.4),inset 0 -1px 0 rgba(44,47,34,.1),0 1px 1px rgba(44,47,34,.12),0 2px 0 rgba(44,47,34,.15),0 6px 12px -5px rgba(44,47,34,.26),0 12px 20px -12px rgba(44,47,34,.3);
  --bv-l-h:inset 0 1px 0 rgba(255,255,255,1),inset 0 0 0 1px rgba(255,255,255,.45),inset 0 -1px 0 rgba(44,47,34,.1),0 1px 1px rgba(44,47,34,.12),0 3px 0 rgba(44,47,34,.15),0 10px 16px -5px rgba(44,47,34,.28),0 18px 26px -14px rgba(44,47,34,.32);
  --bv-l-p:inset 0 2px 4px rgba(44,47,34,.2),inset 0 0 0 1px rgba(44,47,34,.05),0 1px 0 rgba(44,47,34,.15),0 2px 3px -2px rgba(44,47,34,.25);
  --dk-grad:linear-gradient(180deg,#4a4e39 0%,#3d4030 46%,#34372a 100%);
}
/* dark (primary) buttons */
.btn:not(.ghost),.rbtn,.com-big,.chat-send,.vx-mic,.ai-langs button[aria-pressed=true],.chip.on,.mini.on,.catpick input:checked+span,.vx-toggle.on,.svc-title span{border:1px solid #2a2c20;box-shadow:var(--bv-d);transition:transform .18s ease,box-shadow .18s ease,filter .25s}
.btn:not(.ghost),.rbtn,.com-big,.chat-send,.vx-mic,.svc-title span{background-image:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,0) 48%),var(--dk-grad)}
.ai-langs button[aria-pressed=true],.chip.on,.mini.on,.catpick input:checked+span,.vx-toggle.on{background:var(--dk-grad)}
.vx-mic.listening{background-image:none}
/* icon discs inside cards (decorative) */
.svc .ic,.ct .ic{border:1px solid #2a2c20;background:var(--dk-grad);box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.4),0 1px 0 #26281d,0 4px 7px -3px rgba(25,27,18,.45)}
/* light buttons / cards that act as buttons */
.btn.ghost,.svc,.ct,.chip:not(.on),.mini:not(.on),.ai-langs button:not([aria-pressed=true]),.catpick span,.scr-x,.sheet .sx,.burger,.pwa-bar .pwa-x,.vx-toggle:not(.on),.lb-x{box-shadow:var(--bv-l);transition:transform .18s ease,box-shadow .18s ease,background .25s}
.svc,.ct,.btn.ghost,.chip:not(.on),.mini:not(.on),.ai-langs button:not([aria-pressed=true]),.catpick span{background-image:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 62%)}
.svc,.ct{border-radius:1.25rem}
.burger,.pwa-bar .pwa-x{background:#eceedd;border:1px solid var(--line2)}
.vx-stop{box-shadow:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.35),0 2px 0 #5e2218,0 6px 10px -4px rgba(94,34,24,.45)}
/* pressed */
.btn:active,.rbtn:active,.com-big:active,.chat-send:active,.vx-mic:active,.svc:active,.ct:active,.chip:active,.mini:active,.ai-langs button:active,.catpick label:active span,.scr-x:active,.sheet .sx:active,.burger:active,.pwa-x:active,.vx-toggle:active,.vx-stop:active,.orb:active,.lb-x:active{transform:translateY(2px)}
.btn:not(.ghost):active,.rbtn:active,.com-big:active,.chat-send:active,.vx-mic:active,.ai-langs button[aria-pressed=true]:active,.chip.on:active,.mini.on:active,.vx-toggle.on:active{box-shadow:var(--bv-d-p)}
.btn.ghost:active,.svc:active,.ct:active,.chip:not(.on):active,.mini:not(.on):active,.ai-langs button:not([aria-pressed=true]):active,.catpick label:active span,.scr-x:active,.sheet .sx:active,.burger:active,.pwa-x:active,.vx-toggle:not(.on):active,.lb-x:active{box-shadow:var(--bv-l-p)}
/* hover lift: only real pointers */
@media(hover:hover) and (pointer:fine){
  .btn:not(.ghost):hover,.rbtn:hover,.com-big:hover,.chat-send:hover,.vx-mic:hover{transform:translateY(-1px);box-shadow:var(--bv-d-h);filter:brightness(1.05)}
  .btn.ghost:hover,.svc:hover,.ct:hover,.chip:not(.on):hover,.mini:not(.on):hover,.ai-langs button:not([aria-pressed=true]):hover,.scr-x:hover,.sheet .sx:hover,.burger:hover,.vx-toggle:not(.on):hover{transform:translateY(-1px);box-shadow:var(--bv-l-h)}
  .btn:not(.ghost):hover:active,.rbtn:hover:active,.com-big:hover:active,.chat-send:hover:active,.vx-mic:hover:active{transform:translateY(2px);box-shadow:var(--bv-d-p);filter:none}
  .btn.ghost:hover:active,.svc:hover:active,.ct:hover:active,.chip:not(.on):hover:active,.mini:not(.on):hover:active,.ai-langs button:not([aria-pressed=true]):hover:active,.scr-x:hover:active,.sheet .sx:hover:active,.burger:hover:active,.vx-toggle:not(.on):hover:active{transform:translateY(2px);box-shadow:var(--bv-l-p)}
}
.btn.off,.btn[disabled]{box-shadow:0 2px 0 rgba(44,47,34,.2);transform:none!important}
@media(prefers-reduced-motion:reduce){.btn,.rbtn,.com-big,.chat-send,.vx-mic,.svc,.ct,.chip,.mini,.ai-langs button,.catpick span,.scr-x,.sheet .sx,.burger,.pwa-x{transition:none}.btn:hover,.rbtn:hover,.com-big:hover,.svc:hover,.ct:hover{transform:none!important}}

/* ======================= v11 sections ======================= */
/* services: one large 3D title plaque; the 10 cards below share its width and radius */
.svc-title{max-width:45rem;margin:0 auto clamp(.8rem,2.4vw,1.2rem);padding:0;font-size:inherit}
.svc-title span{display:flex;align-items:center;justify-content:center;min-height:clamp(3.8rem,10vw,5rem);padding:.6rem 1.2rem;border-radius:1.25rem;color:var(--on-dk);font:800 clamp(1.3rem,4.8vw,1.95rem)/1.3 var(--serif);letter-spacing:.005em;text-align:center}
@media(min-width:48rem){.svc-grid{gap:1rem}}
/* community: framed box (reuses .gal-box look) */
.com-box{max-width:46rem}
.com-box .sec-head{margin-bottom:clamp(1rem,3vw,1.6rem)}
.com-box .com-actions{max-width:none}
.com-box .com-big{border-radius:1.25rem}
/* contact intro as a quiet line above the three buttons */
.ct-intro{text-align:center;max-width:42rem;margin:0 auto 1.2rem;color:var(--muted)}
.ct-intro:empty{display:none}
/* footer luxury name button */
.ftr .lux{display:inline-flex;align-items:center;gap:.85rem;min-height:3.6rem;padding:.55rem 1.6rem .55rem .7rem;max-width:100%;text-align:left;border-radius:62.4375rem;font-family:var(--serif)}
.ftr .lux img{width:2.5rem;height:2.5rem;flex:none;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.25),0 1px 3px rgba(0,0,0,.4)}
.lux-txt{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;column-gap:.55rem;row-gap:.05rem;line-height:1.35}
.lux-name{font-weight:800;font-size:1.12rem;letter-spacing:.005em}
.lux-sep{opacity:.55}
.lux-tag{font-weight:500;font-size:1rem;color:#d3d8bc}
@media(max-width:36rem){.lux-txt{flex-direction:column;align-items:flex-start}.lux-sep{display:none}.ftr .lux{padding-right:1.3rem}}

/* ======================= gallery 'শহর নিয়ে ভাবনা': ONE opaque rounded box with a thin olive line; lightbox ======================= */
.gal-box{max-width:52rem;margin-inline:auto;background:#e4e8d0;border:1.5px solid #5b5f48;border-radius:1.75rem;padding:clamp(1.3rem,4vw,2.4rem) clamp(.7rem,3vw,2rem) clamp(1.2rem,3vw,1.8rem);box-shadow:0 .9rem 1.8rem -1rem rgba(44,47,34,.35)}
.gal-box .sec-head{margin-bottom:clamp(.8rem,3vw,1.6rem)}
.gal-box .sec-head h2{margin-top:0}
.gal-box .ring-wrap{max-width:none}
.ring-cnt{margin-top:.55rem}
.lb-bg{position:fixed;inset:0;z-index:140;background:rgba(34,37,26,.72);display:none;align-items:center;justify-content:center;padding:max(.8rem,env(safe-area-inset-top)) .8rem max(.8rem,env(safe-area-inset-bottom))}
.lb-bg.open{display:flex}
.lb-lock{overflow:hidden}
.lb{position:relative;width:min(62rem,100%);max-height:100%;overflow:auto;background:#e4e8d0;border:1.5px solid #5b5f48;border-radius:1.75rem;display:grid;grid-template-columns:minmax(0,1fr);box-shadow:0 2rem 4rem -1rem rgba(0,0,0,.55);-webkit-overflow-scrolling:touch}
.lb-img{background:#23261c;display:grid;place-items:center;will-change:transform,opacity}
.lb-img img{display:block;width:100%;max-height:56svh;object-fit:contain;aspect-ratio:1/1;user-select:none;-webkit-user-drag:none}
.lb-info{padding:1.1rem 1.2rem 1.4rem;will-change:opacity}
.lb-t{font-size:clamp(1.25rem,4vw,1.7rem);margin:0 0 .4rem;color:var(--ink)}
.lb-m{color:var(--ink);margin:0 0 .7rem;line-height:1.7}
.lb-p{margin:0 0 .8rem;padding-left:1.2rem;color:var(--muted);line-height:1.65}
.lb-p li{margin:.2rem 0}
.lb-note{font-size:.84rem;color:var(--muted);margin:0 0 1rem}
.lb-nav{display:flex;align-items:center;justify-content:center;gap:1rem}
.lb-c{font:600 .9rem var(--sans);letter-spacing:.1em;color:var(--dk);min-width:4.5rem;text-align:center}
.lb-x{position:absolute;top:.7rem;right:.7rem;z-index:5;width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--line2);background:#eceedd;color:var(--ink);font-size:1.7rem;line-height:1;display:grid;place-items:center;box-shadow:var(--bv-l)}
.lb-x:active{transform:translateY(3px);box-shadow:var(--bv-l-p)}
@media(min-width:40rem){.lb{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);max-height:min(100%,44rem)}.lb-img img{max-height:none;height:100%;aspect-ratio:auto;min-height:24rem}.lb-info{padding:2.4rem 1.8rem 1.6rem;align-self:center}}
@media(prefers-reduced-motion:reduce){.lb-img,.lb-info{transition:none!important}}

/* v11: নগরবিদ section = heading + the single line "মাইক চেপে কথা বলুন"; no suggestion chips or other hints; AI disclosure only as a tiny quiet note inside the chat panel */
.ai-desc{font-weight:600;color:var(--ink);margin:.6rem auto 1.2rem}
#nu-chips,.chat .chips{display:none!important}
.ai-note{font-size:.68rem;opacity:.75;padding:0 1rem .6rem}

/* ======================= নগরবিদ: large luxurious 3D round mic button with pulsing ripple rings + small chat-bubble badge ======================= */
.orb{width:clamp(8.5rem,38vw,11.5rem);margin:.4rem auto .3rem;background:radial-gradient(120% 120% at 30% 16%,#5d6247 0%,#3b3e2d 46%,#262a1d 100%);border:1px solid #23261a;box-shadow:inset 0 2px 1px rgba(255,255,255,.26),inset 0 0 0 1px rgba(255,255,255,.06),inset 0 -16px 28px rgba(0,0,0,.38),0 3px 0 #1c1f15,0 14px 22px -8px rgba(25,27,18,.55),0 30px 48px -22px rgba(25,27,18,.6);transition:transform .18s ease,box-shadow .18s ease;cursor:pointer;isolation:isolate}
.orb:active{transform:translateY(3px);box-shadow:inset 0 3px 10px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.04),0 1px 0 #1c1f15,0 6px 12px -6px rgba(25,27,18,.5)}
.orb::before{content:"";position:absolute;z-index:1;left:12%;right:12%;top:5%;height:34%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,0));pointer-events:none}
.orb-core{position:relative;z-index:2;width:58%;height:58%;border-radius:50%;display:grid;place-items:center;color:#f4f6e6;background:radial-gradient(110% 110% at 32% 22%,#5a5f45,#34372a 70%);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(255,255,255,.1),inset 0 -8px 14px rgba(0,0,0,.35),0 6px 10px -4px rgba(0,0,0,.5)}
.orb .orb-core svg{width:52%;height:52%;filter:drop-shadow(0 2px 3px rgba(0,0,0,.45))}
.orb-rings{position:absolute;inset:0;z-index:-1;border-radius:50%;pointer-events:none}
.orb-rings i{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(59,62,45,.5);opacity:0;animation:orbring 3.4s cubic-bezier(.2,.6,.3,1) infinite}
.orb-rings i:nth-child(2){animation-delay:1.13s}.orb-rings i:nth-child(3){animation-delay:2.26s}
@keyframes orbring{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.65);opacity:0}}
.orb.listening .orb-rings i{border-color:rgba(156,58,42,.7);animation-duration:1.7s}
.orb.listening .orb-core{background:radial-gradient(110% 110% at 32% 22%,#b9503c,#8a3324 70%)}
.orb-bubble{position:absolute;z-index:3;top:2%;right:-2%;width:2.7rem;height:2.7rem;border-radius:50%;display:grid;place-items:center;color:#3b3e2d;background:linear-gradient(180deg,#f4f6e6,#dfe3c8);border:1px solid rgba(59,62,45,.35);box-shadow:inset 0 1px 0 #fff,0 1px 0 rgba(44,47,34,.3),0 6px 10px -3px rgba(25,27,18,.45)}
.orb-bubble svg{width:62%;height:62%}
@media(prefers-reduced-motion:reduce){.orb-rings i{animation:none;opacity:.28;transform:scale(1.22)}.orb-rings i:nth-child(n+2){display:none}.orb{transition:none}}

/* FOUC: page stays visible (no blank). font-display:optional + preloads prevent swap jump; .nu-fonts marks when ready */