:root{
  --ink:#16215C;
  --ink-70:#414C84;
  --ink-50:#6B739E;
  --sindoor:#C0272D;
  --sindoor-dark:#94161C;
  --paper:#FFFDF9;
  --line:#DFDBEC;
  --wash:#F4F2FA;
  --q-sport:#E8436B;
  --q-music:#0E9BA2;
  --q-art:#E9A424;
  --q-health:#AE2C8C;
  --shell:min(1080px, 100% - 2.5rem);
  --r:12px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"Hind","Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:1.0625rem; line-height:1.7; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block; height:auto}
a{color:inherit}
h1,h2,h3{font-family:"Tiro Devanagari Hindi",Georgia,"Times New Roman",serif; font-weight:400; line-height:1.25; margin:0}
p{margin:0 0 1.05rem}
p:last-child{margin-bottom:0}
:focus-visible{outline:3px solid var(--sindoor); outline-offset:3px; border-radius:4px}
.shell{width:var(--shell); margin-inline:auto}
.skip{position:absolute; left:-9999px; background:var(--ink); color:#fff; padding:.6rem 1rem; z-index:99}
.skip:focus{left:0; top:0}

/* header */
.topbar{position:sticky; top:0; z-index:50; background:rgba(255,253,249,.95); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.quad{display:flex; height:4px}
.quad span{flex:1}
.quad span:nth-child(1){background:var(--q-sport)}
.quad span:nth-child(2){background:var(--q-music)}
.quad span:nth-child(3){background:var(--q-art)}
.quad span:nth-child(4){background:var(--q-health)}
.topbar .row{display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; padding:.6rem 0; width:var(--shell); margin-inline:auto}
.brand{display:flex; align-items:center; gap:.6rem; text-decoration:none; margin-right:auto}
.brand img{width:44px; height:44px}
.brand b{font-family:"Tiro Devanagari Hindi",serif; font-weight:400; font-size:1.1rem; color:var(--sindoor); line-height:1.15; display:block}
.brand small{font-size:.72rem; color:var(--ink-50); display:block}
.fb{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--line); border-radius:50%; color:var(--ink)}
.fb:hover{background:var(--ink); color:#fff; border-color:var(--ink)}
.fb svg{width:18px; height:18px; fill:currentColor}
.navtoggle{border:1px solid var(--line); background:#fff; border-radius:10px; padding:.45rem .6rem; font:inherit; font-size:.9rem; color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; gap:.4rem}
.navtoggle svg{width:20px; height:20px}
nav#nav{display:none; order:3; flex:0 0 100%; padding:.3rem 0 .8rem}
nav#nav.open{display:block}
nav#nav ul{list-style:none; margin:0; padding:0}
nav#nav a{display:block; padding:.6rem .25rem; text-decoration:none; font-weight:500; border-bottom:1px solid var(--line)}
nav#nav a:hover{color:var(--sindoor)}
nav#nav a[aria-current="page"]{color:var(--sindoor)}

/* buttons and links */
.btn{display:inline-flex; align-items:center; justify-content:center; font-family:inherit; font-size:1rem; font-weight:600; text-decoration:none; padding:.7rem 1.15rem; border-radius:10px; border:1.5px solid transparent; transition:background .15s ease, color .15s ease}
.btn-primary{background:var(--sindoor); color:#fff}
.btn-primary:hover{background:var(--sindoor-dark)}
.btn-ghost{border-color:var(--ink); color:var(--ink)}
.btn-ghost:hover{background:var(--ink); color:#fff}
.btn-light{border-color:rgba(255,255,255,.55); color:#fff}
.btn-light:hover{background:#fff; color:var(--ink)}
.links{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem}
.textlink{font-weight:600; color:var(--sindoor); text-decoration:none; border-bottom:2px solid rgba(192,39,45,.3); padding-bottom:1px}
.textlink:hover{border-bottom-color:var(--sindoor)}

/* sections */
section{padding:2.8rem 0; border-top:1px solid var(--line)}
section:first-of-type{border-top:0}
h1{font-size:clamp(1.9rem,6vw,2.6rem)}
h2{font-size:clamp(1.6rem,5.4vw,2.15rem); margin-bottom:1.2rem}
h3{font-size:1.1rem}
.split{display:grid; gap:1.6rem}
.prose{max-width:38em}
figure{margin:0}
figcaption{font-size:.85rem; color:var(--ink-50); margin-top:.5rem}
.centered{text-align:center}
.centered .prose{margin-inline:auto}
.after{margin-top:1.6rem}

/* photo grids */
.photos{display:grid; grid-template-columns:1fr 1fr; gap:.75rem}
.photos img{border-radius:10px; aspect-ratio:4/3; object-fit:cover; width:100%}
.photos .wide{grid-column:1 / -1}
.photos .wide img{aspect-ratio:2/1; object-position:center 35%}
.strip{display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; margin-top:1.6rem}
.strip figure{border-radius:10px; overflow:hidden; background:var(--wash)}
.strip img{aspect-ratio:3/2; object-fit:cover; width:100%}
.strip figcaption{margin:0; padding:.55rem .7rem; font-size:.82rem; color:var(--ink-70)}

/* media */
.clips{display:grid; gap:1rem; margin-top:1.8rem}
.clip{border:1px solid var(--line); border-radius:var(--r); overflow:hidden; text-decoration:none; background:#fff; display:block; text-align:left}
.clip .shot{height:210px; overflow:hidden}
.clip .shot img{width:100%; height:100%; object-fit:cover; object-position:top center}
.clip .meta{padding:.8rem 1rem 1rem; border-top:1px solid var(--line)}
.clip .pub{font-size:.83rem; color:var(--ink-50); display:block}
.clip .head{font-family:"Tiro Devanagari Hindi",serif; font-size:1.05rem; display:block; margin-top:.15rem}
.clip .shot.press{border:0; padding:0; width:100%; background:none; cursor:zoom-in; display:block}

/* compliance */
.docs{display:grid; gap:.9rem; margin-top:1.6rem}
.doc{border:1px solid var(--line); border-radius:var(--r); padding:1rem 1.1rem; background:#fff}
.doc b{display:block; font-weight:600; font-size:1.02rem}
.doc span{display:block; font-size:.88rem; color:var(--ink-50); margin:.15rem 0 .5rem}
.doc a{font-size:.92rem; font-weight:600; color:var(--sindoor); text-decoration:none}
.doc a:hover{text-decoration:underline}

/* action row and footer */
.actions{display:grid; gap:.7rem; padding:2.2rem 0; border-top:1px solid var(--line)}
.actions .btn{width:100%}
footer{border-top:1px solid var(--line); padding:1.5rem 0 2.2rem}
.footrow{display:flex; flex-wrap:wrap; align-items:center; gap:1rem; justify-content:space-between}
.footrow p{margin:0; font-size:.88rem; color:var(--ink-50)}
.footrow a.fbtext{display:inline-flex; align-items:center; gap:.5rem; text-decoration:none; font-size:.92rem; color:var(--ink-70)}
.footrow a.fbtext:hover{color:var(--sindoor)}
.footrow svg{width:18px; height:18px; fill:currentColor}

@media (max-width:620px){
  .brand small{display:none}
  .brand img{width:38px; height:38px}
  .brand b{font-size:1rem}
  .mlabel{position:absolute; left:-9999px}
  .topbar .row{gap:.5rem}
  .fb{width:34px; height:34px}
}
@media (min-width:720px){
  .clips{grid-template-columns:repeat(3,1fr)}
  .docs{grid-template-columns:repeat(3,1fr)}
  .actions{grid-template-columns:repeat(3,1fr)}
  .split{grid-template-columns:1.15fr .85fr; gap:2.4rem; align-items:center}
  .split.wideleft{grid-template-columns:1fr 1fr}
  .strip{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:960px){
  .navtoggle{display:none}
  nav#nav{display:block; order:0; flex:0 1 auto; padding:0; margin-right:1.1rem}
  nav#nav ul{display:flex; gap:1.5rem}
  nav#nav a{border:0; padding:.2rem 0; font-size:.99rem}
  .brand img{width:50px; height:50px}
  .brand b{font-size:1.24rem}
  section{padding:3.8rem 0}
}

/* home page portrait */
.portrait{background:linear-gradient(180deg,#F4F1FA,#FFFDF9); border-radius:var(--r)}
.portrait img{width:min(300px,80%); margin-inline:auto}
@media (min-width:960px){ .portrait img{width:100%; max-width:340px} }

/* ---------- camp page ---------- */
.pagehead{padding:2.4rem 0 1.6rem}
.pagehead .hi{color:var(--sindoor); font-family:"Tiro Devanagari Hindi",serif; font-size:1.2rem; margin-bottom:.2rem}
.pagehead p{color:var(--ink-70); max-width:34em; margin-top:.7rem; font-size:1.1rem}

/* slider */
.slider{position:relative; border-radius:var(--r); overflow:hidden; background:var(--wash)}
.slides{display:flex; transition:transform .45s ease}
.slide{flex:0 0 100%; position:relative}
.slide img{width:100%; aspect-ratio:3/2; object-fit:cover}
.slide .cap{position:absolute; left:0; right:0; bottom:0; padding:2.2rem 1rem .8rem; color:#fff; font-size:.92rem;
  background:linear-gradient(180deg,rgba(9,13,40,0) 0%,rgba(9,13,40,.78) 100%)}
.playwrap{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; border:0; background:transparent; cursor:pointer; padding:0}
.playwrap .dot{width:74px; height:74px; border-radius:50%; background:var(--sindoor); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 24px rgba(0,0,0,.35)}
.playwrap svg{width:26px; height:26px; fill:#fff; margin-left:4px}
.playwrap:hover .dot{background:var(--sindoor-dark)}
.slide iframe{width:100%; aspect-ratio:3/2; border:0; display:block}
.snav{position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%; border:0;
  background:rgba(255,253,249,.9); color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center}
.snav:hover{background:#fff}
.snav svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2}
.snav.prev{left:10px}
.snav.next{right:10px}
.dots{display:flex; gap:.45rem; justify-content:center; margin-top:.9rem}
.dots button{width:9px; height:9px; padding:0; border-radius:50%; border:0; background:var(--line); cursor:pointer}
.dots button[aria-current="true"]{background:var(--sindoor)}

/* stats */
.stats{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-top:2rem}
.stats div{background:var(--paper); padding:1.1rem 1rem}
.stats b{display:block; font-family:"Tiro Devanagari Hindi",serif; font-weight:400; font-size:1.85rem; color:var(--sindoor); line-height:1.15}
.stats span{font-size:.9rem; color:var(--ink-70); line-height:1.4; display:block}

/* next camp */
.nextcamp{background:var(--ink); color:#fff; border-radius:var(--r); padding:1.4rem 1.3rem; display:grid; gap:1rem; margin-top:2rem}
.nextcamp h2{color:#fff; font-size:1.05rem; font-family:"Hind",sans-serif; font-weight:600; margin:0}
.nextcamp .date{font-family:"Tiro Devanagari Hindi",serif; font-size:1.6rem; line-height:1.25; margin:.25rem 0 .35rem}
.nextcamp p{color:#C9CEE9; font-size:.96rem; margin:0}
.nextcamp .btn-primary{background:#fff; color:var(--ink)}
.nextcamp .btn-primary:hover{background:#FFE9AA}
.nextcamp .cta{display:flex; flex-wrap:wrap; gap:.6rem; align-self:center}

/* doctors strip */
.drwrap{position:relative; margin-top:1.6rem}
.drscroll{display:flex; gap:.8rem; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:.2rem .1rem 1rem; scrollbar-width:thin; -webkit-overflow-scrolling:touch}
.drscroll::-webkit-scrollbar{height:6px}
.drscroll::-webkit-scrollbar-thumb{background:var(--line); border-radius:3px}
.dr{flex:0 0 140px; scroll-snap-align:start; border:1px solid var(--line); border-radius:var(--r);
  background:#fff; overflow:hidden}
.dr .pic{aspect-ratio:1/1; background:var(--wash); display:flex; align-items:center; justify-content:center; overflow:hidden}
.dr .pic img{width:100%; height:100%; object-fit:cover}
.dr .pic .ph{color:var(--ink-50); font-family:"Tiro Devanagari Hindi",serif; font-size:1.5rem; letter-spacing:.02em}
.dr .who{padding:.55rem .65rem .75rem}
.dr h3{font-size:.95rem; line-height:1.3}
.drnav{display:none}

@media (min-width:720px){
  .dr{flex-basis:165px}
  .drnav{display:flex; position:absolute; top:calc(50% - 26px); transform:translateY(-50%);
    width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:rgba(255,253,249,.96);
    color:var(--ink); cursor:pointer; align-items:center; justify-content:center; z-index:2}
  .drnav:hover{background:#fff}
  .drnav svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2}
  .drnav.prev{left:-14px}
  .drnav.next{right:-14px}
  .nextcamp{grid-template-columns:1fr auto; align-items:center; padding:1.6rem 1.8rem}
  .stats{grid-template-columns:repeat(4,1fr)}
  .snav.prev{left:16px}
  .snav.next{right:16px}
}
@media (prefers-reduced-motion:reduce){
  .slides{transition:none}
  html{scroll-behavior:auto}
}


/* doctors listing page */
.drlist{display:grid; gap:1rem; margin-top:1.8rem}
.drcard{border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:1rem; display:flex; gap:1rem; align-items:flex-start}
.drcard .pic{flex:0 0 96px; width:96px; height:96px; border-radius:10px; overflow:hidden; background:var(--wash); display:flex; align-items:center; justify-content:center}
.drcard .pic img{width:100%; height:100%; object-fit:cover}
.drcard .pic .ph{color:var(--ink-50); font-family:"Tiro Devanagari Hindi",serif; font-size:1.4rem}
.drcard h3{font-size:1.12rem}
.drcard .role{font-size:.92rem; color:var(--ink-70); margin:.25rem 0 .55rem; line-height:1.5}
.drcard .meta{display:flex; flex-wrap:wrap; gap:.3rem 1.1rem; font-size:.92rem}
.drcard .meta a{color:var(--sindoor); font-weight:600; text-decoration:none}
.drcard .meta a:hover{text-decoration:underline}
@media (min-width:760px){
  .drlist{grid-template-columns:repeat(2,1fr)}
  .drcard{padding:1.15rem}
  .drcard .pic{flex-basis:110px; width:110px; height:110px}
}

/* forms */
.formwrap{max-width:38rem}
.field{margin-bottom:1.1rem}
.field label{display:block; font-weight:600; font-size:.96rem; margin-bottom:.35rem}
.field .hint{display:block; font-weight:400; font-size:.86rem; color:var(--ink-50); margin-bottom:.35rem}
.field input,.field select,.field textarea{
  width:100%; font:inherit; font-size:1rem; color:var(--ink); background:#fff;
  border:1.5px solid var(--line); border-radius:10px; padding:.7rem .85rem}
.field textarea{min-height:120px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ink); outline:none; box-shadow:0 0 0 3px rgba(22,33,92,.12)}
.field input:user-invalid,.field select:user-invalid,.field textarea:user-invalid{border-color:var(--sindoor)}
.req{color:var(--sindoor)}
.disclaimer{background:var(--wash); border-left:4px solid var(--q-art); border-radius:0 10px 10px 0;
  padding:.85rem 1rem; font-size:.95rem; color:var(--ink-70); margin:0 0 1.4rem}
.formnote{font-size:.9rem; color:var(--ink-50); margin-top:.9rem}
.formmsg{display:none; border-radius:10px; padding:.9rem 1rem; margin-top:1rem; font-size:.96rem}
.formmsg.show{display:block}
.formmsg.ok{background:#EAF6EE; border:1px solid #BFE0CB; color:#1C5B33}
.formmsg.warn{background:#FFF4E5; border:1px solid #F0D4A6; color:#7A4B06}

/* contact page */
.contactgrid{display:grid; gap:2.2rem}
.addr{border:1px solid var(--line); border-radius:var(--r); background:#fff; padding:1.1rem 1.2rem; margin-bottom:1rem}
.addr h3{font-size:1.05rem; font-family:"Hind",sans-serif; font-weight:600; margin-bottom:.3rem}
.addr p{margin:0; color:var(--ink-70); font-size:.98rem}
.addr a{color:var(--sindoor); font-weight:600; text-decoration:none}
.addr a:hover{text-decoration:underline}
.mapwrap{border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-top:1rem}
.mapwrap iframe{width:100%; height:300px; border:0; display:block}
@media (min-width:860px){
  .contactgrid{grid-template-columns:1fr 1fr; gap:3rem; align-items:start}
  .mapwrap iframe{height:340px}
}

/* ---------- blog / resources ---------- */
.blog-grid{display:grid; gap:1.4rem; margin-top:1.8rem}
.blog-card{background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; text-decoration:none; display:flex; flex-direction:column}
.blog-card .thumb{aspect-ratio:16/9; overflow:hidden; background:var(--wash)}
.blog-card .thumb img{width:100%; height:100%; object-fit:cover}
.blog-card .body{padding:1.1rem 1.2rem 1.3rem}
.blog-card .meta{font-size:.82rem; color:var(--ink-50); margin-bottom:.4rem}
.blog-card h3{font-size:1.2rem; color:var(--ink); line-height:1.35}
.blog-card p{color:var(--ink-70); font-size:.95rem; margin-top:.55rem}
.blog-card .readmore{margin-top:.8rem; font-weight:600; color:var(--sindoor); font-size:.92rem}
@media (min-width:760px){ .blog-grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1040px){ .blog-grid{grid-template-columns:repeat(3,1fr)} }

.post-hero{border-radius:var(--r); overflow:hidden; margin:1.6rem 0; aspect-ratio:16/9; background:var(--wash)}
.post-hero img{width:100%; height:100%; object-fit:cover}
.post-meta{font-size:.9rem; color:var(--ink-50); margin-bottom:.3rem}
.post-body{max-width:42em; font-size:1.05rem; line-height:1.75; color:var(--ink)}
.post-body h2{font-size:1.35rem; color:var(--sindoor); margin:1.8rem 0 .7rem}
.post-body p{margin:0 0 1.1rem}
.post-body ul{margin:0 0 1.1rem; padding-left:1.3rem}
.post-body li{margin-bottom:.4rem; color:var(--ink-70)}
.post-body .hi-block{font-family:"Tiro Devanagari Hindi",serif; background:var(--wash); border-left:4px solid var(--q-art); border-radius:0 10px 10px 0; padding:1rem 1.2rem; margin:1.4rem 0; font-size:1.05rem; line-height:1.8}

/* ---------- modal (donate notice, etc.) ---------- */
.modal-overlay{position:fixed; inset:0; background:rgba(20,16,10,.55); z-index:200; display:none; align-items:center; justify-content:center; padding:5vh 5vw}
.modal-overlay.open{display:flex}
.modal-box{background:#fff; border-radius:var(--r); max-width:420px; width:100%; padding:1.8rem 1.6rem; position:relative; box-shadow:0 20px 60px rgba(0,0,0,.25)}
.modal-box h3{font-size:1.2rem; color:var(--ink); margin-bottom:.7rem; padding-right:1.5rem}
.modal-box p{color:var(--ink-70); font-size:.96rem; line-height:1.6; margin-bottom:1.3rem}
.modal-box .modal-actions{display:flex; gap:.7rem; flex-wrap:wrap}
.modal-close{position:absolute; top:12px; right:14px; width:34px; height:34px; border-radius:50%; border:0; background:var(--wash); color:var(--ink-70); font-size:1.3rem; cursor:pointer; line-height:1}
.modal-close:hover{background:var(--line)}

/* ---------- horizontal scroll rail (encouragement, resources) ---------- */
.railwrap{position:relative; margin-top:1.5rem}
.railscroll{display:flex; gap:1rem; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.4rem; scroll-padding-left:1rem}
.railscroll::-webkit-scrollbar{height:6px}
.railscroll::-webkit-scrollbar-thumb{background:var(--line); border-radius:3px}
.railnav{display:none}
@media (min-width:760px){
  .railnav{display:flex; position:absolute; top:calc(50% - 26px); transform:translateY(-50%);
    width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.92);
    align-items:center; justify-content:center; color:var(--ink); cursor:pointer; z-index:2; box-shadow:0 4px 14px rgba(0,0,0,.08)}
  .railnav:hover{background:#fff}
  .railnav svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2}
  .railnav.prev{left:-14px}
  .railnav.next{right:-14px}
}

.enc-card{flex:0 0 280px; scroll-snap-align:start; border:1px solid var(--line); border-radius:var(--r); background:#fff; overflow:hidden; display:flex; flex-direction:column}
.enc-card .thumb{aspect-ratio:4/3; background:var(--wash); overflow:hidden}
.enc-card .thumb img{width:100%; height:100%; object-fit:cover; display:block}
.enc-card .thumb.pair{display:grid; grid-template-columns:1fr 1fr; gap:2px}
.enc-card .thumb.pair img{aspect-ratio:auto; height:100%}
.enc-card.video{flex-basis:min(500px,88vw); padding:0}
.enc-card.video .thumb{aspect-ratio:500/457; background:#fff}
.enc-card .thumb .video-wrap{width:100%; height:100%; overflow:hidden}
.enc-card .thumb .video-wrap iframe{width:100%; height:100%; border:0; display:block}
.enc-card .body{padding:1rem 1.1rem 1.2rem}
.enc-card h3{font-size:1.02rem; line-height:1.35; color:var(--ink); margin-bottom:.4rem}
.enc-card p{font-size:.88rem; color:var(--ink-70); line-height:1.5}
@media (min-width:760px){ .enc-card{flex-basis:320px} }

.res-card{flex:0 0 270px; scroll-snap-align:start; border:1px solid var(--line); border-radius:var(--r); background:#fff; overflow:hidden; display:flex; flex-direction:column; text-decoration:none}
.res-card .thumb{aspect-ratio:16/9; background:var(--wash); overflow:hidden}
.res-card .thumb img{width:100%; height:100%; object-fit:cover; display:block}
.res-card .body{padding:1rem 1.1rem 1.2rem}
.res-card .meta{font-size:.78rem; color:var(--ink-50); margin-bottom:.35rem}
.res-card h3{font-size:1rem; line-height:1.35; color:var(--ink)}
@media (min-width:760px){ .res-card{flex-basis:310px} }

/* ---------- gallery page ---------- */
.gal-filters{display:flex; flex-wrap:wrap; gap:.55rem; margin:1.6rem 0}
.gal-filters button{font:inherit; font-size:.9rem; font-weight:600; padding:.5rem .95rem; border-radius:999px; border:1.5px solid var(--line); background:#fff; color:var(--ink-70); cursor:pointer}
.gal-filters button.active{background:var(--ink); border-color:var(--ink); color:#fff}
.gal-grid{columns:2 220px; column-gap:.8rem}
.gal-grid figure{margin:0 0 .8rem; break-inside:avoid; border-radius:10px; overflow:hidden; background:var(--wash)}
.gal-grid img{width:100%; display:block; cursor:zoom-in}
.gal-grid figure.hide{display:none}
@media (min-width:760px){ .gal-grid{columns:3 240px} }
@media (min-width:1040px){ .gal-grid{columns:4 240px} }
.lightbox{position:fixed; inset:0; background:rgba(20,16,10,.92); z-index:100; display:none; align-items:center; justify-content:center; padding:4vh 4vw}
.lightbox.open{display:flex}
.lightbox img{max-width:100%; max-height:92vh; border-radius:6px; box-shadow:0 10px 40px rgba(0,0,0,.5)}
.lightbox .lbclose{position:absolute; top:18px; right:22px; width:42px; height:42px; border-radius:50%; border:0; background:rgba(255,255,255,.15); color:#fff; font-size:1.5rem; cursor:pointer}
.lightbox .lbclose:hover{background:rgba(255,255,255,.28)}