/* Tokens – see DESIGN.md */
:root{
  --ink:#1b2433;--blue:#1d3557;--blue-deep:#111c2e;
  --orange:#c25e00;--orange-hover:#a34e00;--green:#128c4a;
  --surface:#f6f7fb;--line:#e3e7ef;
  --r-sm:8px;--r-md:14px;
  --shadow:0 8px 24px rgba(17,28,46,.12);
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:72px;
  --wrap:1160px;
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font:400 16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Bengali",Arial,sans-serif;color:var(--ink);background:#fff;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none;padding:0}
address{font-style:normal}
:focus-visible{outline:3px solid #ffb703;outline-offset:2px}

.skip{position:absolute;left:-999px;top:8px;background:#fff;color:var(--blue);padding:8px 16px;border-radius:var(--r-sm);z-index:200}
.skip:focus{left:8px}

h1,h2{line-height:1.2;color:var(--blue);text-wrap:balance}
h1{font-size:clamp(2rem,4.5vw,3rem)}
h2{font-size:clamp(1.5rem,3vw,2.25rem)}
.eyebrow{color:var(--orange);font-weight:700;font-size:1.125rem;margin-bottom:var(--s1)}

.btn{display:inline-block;padding:10px 24px;border-radius:var(--r-sm);font-weight:700;font-size:.95rem;color:#fff;border:0;cursor:pointer;transition:background .2s,transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn-call{background:var(--blue)}.btn-call:hover{background:#142640}
.btn-wa{background:var(--green)}.btn-wa:hover{background:#0e7340}
.btn-primary{background:var(--orange)}.btn-primary:hover{background:var(--orange-hover)}

.topbar{position:sticky;top:0;z-index:50;background:#fff;display:flex;justify-content:space-between;align-items:center;gap:var(--s2);padding:8px max(5%,16px);border-bottom:1px solid var(--line)}
.logo img{height:64px;width:auto}
.top-actions{display:flex;gap:10px}

.hero{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);align-items:center;padding:var(--s6) max(5%,16px);background:var(--surface)}
.hero-text h1{margin-bottom:var(--s3)}

.slider{position:relative;overflow:hidden;border-radius:var(--r-md);box-shadow:var(--shadow);background:var(--line)}
.slides{display:flex;transition:transform .6s ease}
.slides a{flex:0 0 100%;display:block}
.slides img{width:100%;aspect-ratio:4/3;object-fit:cover}
.nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(17,28,46,.65);color:#fff;border:0;width:44px;height:44px;border-radius:50%;cursor:pointer;font-size:16px}
.nav:hover{background:rgba(17,28,46,.9)}
.prev{left:10px}.next{right:10px}
.dots{position:absolute;bottom:10px;width:100%;display:flex;justify-content:center;gap:4px}
.dots button{width:24px;height:24px;border:0;background:none;cursor:pointer;display:grid;place-items:center}
.dots button::after{content:"";width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.7)}
.dots button.active::after{background:var(--orange)}

.work{padding:var(--s6) max(5%,16px);text-align:center;max-width:calc(var(--wrap) + 10%);margin:auto}
.work h2{margin-bottom:var(--s4)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}
.gallery a{overflow:hidden;border-radius:var(--r-md);display:block;background:var(--line)}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s}
.gallery a:hover img{transform:scale(1.06)}

.testimonials{display:grid;grid-template-columns:1fr 2fr;gap:var(--s5);align-items:center;padding:var(--s6) max(5%,16px);background:var(--blue);color:#fff}
.testimonials h2{color:#fff;margin-bottom:var(--s3)}
.t-right blockquote p{font-size:1.125rem;font-style:italic;margin-bottom:var(--s3);max-width:65ch}
.t-person{display:flex;align-items:center;gap:14px}
.t-person img{width:64px;height:64px;border-radius:50%;object-fit:cover}
.t-person small{display:block;opacity:.85}

.map iframe{width:100%;height:380px;border:0;display:block}

.about{padding:var(--s6) max(5%,16px);text-align:center;background:var(--surface)}
.about-text{max-width:760px;margin:auto}
.about h2{margin-bottom:var(--s1)}
.addr{font-weight:700;color:var(--orange);margin-bottom:14px}
.about p{margin-bottom:var(--s3)}

.footer{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);padding:var(--s5) max(5%,16px);background:var(--blue-deep);color:#d5dbe6}
.footer h2{color:#fff;font-size:1.125rem;margin-bottom:14px}
.footer li{margin-bottom:var(--s1);font-size:.9rem}
.footer p{font-size:.9rem}
.footer a:hover{color:#ffb703;text-decoration:underline}

.mobile-bar{display:none}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;z-index:100}
.lightbox[hidden]{display:none}
.lightbox img{max-height:90vh;max-width:92vw;border-radius:var(--r-sm)}
.lightbox .close{position:absolute;top:12px;right:20px;font-size:44px;line-height:1;color:#fff;background:none;border:0;cursor:pointer;width:48px;height:48px}

@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding:var(--s5) max(5%,16px)}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .testimonials{grid-template-columns:1fr}
  .footer{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  body{padding-bottom:64px}
  .logo img{height:48px}
  .top-actions{display:none}
  .gallery{grid-template-columns:1fr}
  .footer{grid-template-columns:1fr}
  .work,.about,.testimonials{padding-top:var(--s5);padding-bottom:var(--s5)}
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}
  .mobile-bar .btn{text-align:center;padding:12px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}