/* ============================================================
   MATRI PEETH — Greater Noida West Kali Bari
   assets/css/style.css
   Palette sampled from the trust logo artwork.
   ============================================================ */

:root{
  --red:#8E1B22;
  --red-mid:#A81E27;
  --red-deep:#5E1113;
  --gold:#C9962F;
  --gold-lt:#EDC98C;
  --gold-pale:#F3E2C0;
  --ink:#241A16;
  --body-c:#5B4A44;
  --cream:#FBF5EA;
  --cream-2:#F6ECDA;
  --white:#fff;
  --line:#E8DCC6;

  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter Tight',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;

  --wrap:1240px; --gut:22px; --r:10px;
  --shadow:0 18px 44px -28px rgba(36,26,22,.5);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scrollbar-gutter:stable; scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:110px; }
body{ margin:0; background:var(--cream); color:var(--body-c);
      font-family:var(--sans); font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased; }
body.locked{ overflow:hidden; }
img,video{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,h5{ font-family:var(--serif); color:var(--ink); margin:0; line-height:1.2; font-weight:700; }
p{ margin:0 0 1em; }
:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }

/* ------------------------------------------------------------
   ORNAMENT — the little gold flourish beside section titles
   ------------------------------------------------------------ */
.orn{ display:flex; align-items:center; justify-content:center; gap:14px; }
.orn::before,.orn::after{ content:""; width:64px; height:9px; flex:none;
  background:no-repeat center/contain
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='9'%3E%3Cpath d='M0 4.5h44M52 4.5h12' stroke='%23C9962F' stroke-width='1.2'/%3E%3Cpath d='M48 0l4 4.5-4 4.5-4-4.5z' fill='%238E1B22'/%3E%3C/svg%3E"); }
.orn::after{ transform:scaleX(-1); }

.sec-head{ text-align:center; margin-bottom:44px; }
.sec-head h2{ font-size:clamp(26px,3.2vw,38px); margin-bottom:8px; }
.sec-head .orn{ margin-bottom:12px; }
.sec-head p{ color:var(--body-c); margin:0; font-size:15.5px; }

/* ------------------------------------------------------------
   BUTTONS
   ------------------------------------------------------------ */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px;
      font-family:var(--sans); font-weight:600; font-size:13px; letter-spacing:.1em;
      text-transform:uppercase; line-height:1.3; padding:13px 26px; border-radius:6px;
      border:1.5px solid transparent; cursor:pointer; transition:.2s; white-space:nowrap; }
.btn-red{ background:linear-gradient(180deg,var(--red-mid),var(--red)); color:#fff;
          box-shadow:0 8px 20px -12px rgba(142,27,34,.9); }
.btn-red:hover{ background:linear-gradient(180deg,var(--red),var(--red-deep)); transform:translateY(-1px); }
.btn-gold{ background:var(--gold); color:#3A2A08; }
.btn-gold:hover{ background:#B8861F; }
.btn-out{ border-color:var(--red); color:var(--red); background:transparent; }
.btn-out-light{ border-color:rgba(243,226,192,.6); color:#fff; background:transparent; }
.btn-out-light:hover{ background:rgba(255,255,255,.14); border-color:var(--gold-lt); }
.btn-out:hover{ background:var(--red); color:#fff; }
.btn-lt{ border-color:#fff; color:#fff; background:transparent; }
.btn-lt:hover{ background:#fff; color:var(--red); }
/* the small lotus glyphs that flank a button label in the artwork */
.btn .lotus{ width:14px; height:14px; flex:none; opacity:.85; }

/* ------------------------------------------------------------
   HEADER
   ------------------------------------------------------------ */
.topline{ height:4px; background:var(--gold); }

header.site{ position:sticky; top:0; z-index:70; background:rgba(251,245,234,.97);
             backdrop-filter:blur(10px); box-shadow:0 2px 18px -12px rgba(36,26,22,.55); }

/* The centre grid column physically reserves the logo's width, so no menu
   item can slide underneath it however many items the nav holds. The logo
   is absolutely placed INSIDE that column, which lets it overhang downward
   without changing the row height — that is what stops the header jumping
   when it shrinks on scroll. */
/* ------------------------------------------------------------
   HEADER — wordmark on the left, the eight menu items spread
   across the bar, Donate on the right. No centre emblem.
   ------------------------------------------------------------ */
.head-row{ display:flex; align-items:center; gap:20px; min-height:0; padding:10px 0; }

/* the brand column is a fixed width and the Donate button has a floor, so the
   menu sits in exactly the same place on every page — no shift when the web
   fonts swap in, and scrollbar-gutter above keeps the page width constant */
.brand{ display:flex; align-items:center; gap:14px; flex:none; width:334px;
        line-height:1.05; position:relative; }
/* the emblem is bigger than the bar and hangs down over the hero. The negative
   bottom margin keeps it out of the flex row's height calculation, so the
   header stays the same height and never jumps when it shrinks on scroll. */
.brand img{ height:114px; width:auto; max-width:none; margin-bottom:-54px; position:relative;
            z-index:2; filter:drop-shadow(0 8px 18px rgba(36,26,22,.28));
            transition:height .25s ease, margin-bottom .25s ease; }
.brand-txt{ display:block; }
.brand-txt b{ display:block; font-family:var(--serif); font-weight:700; color:var(--red);
              font-size:20px; letter-spacing:.02em; text-transform:uppercase; white-space:nowrap; }
.brand-txt b sup{ font-size:9px; top:-.75em; }
.brand-txt i{ display:block; font-style:normal; font-family:var(--sans); font-size:9px;
              letter-spacing:.15em; text-transform:uppercase; color:var(--body-c);
              margin-top:3px; white-space:nowrap; }
header.site.shrink .brand img{ height:92px; margin-bottom:-42px; }
header.site.shrink .brand-txt b{ font-size:18px; }

.hnav{ display:flex; align-items:center; flex:1 1 auto; justify-content:space-evenly;
       gap:2px; min-width:0; }
.hnav a{ font-size:11.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
         padding:9px 8px; border-radius:5px; color:var(--ink); transition:.18s; white-space:nowrap; }
.hnav a:hover,.hnav a.active{ color:var(--red); }
.hnav a.active{ position:relative; }
.hnav a.active::after{ content:""; position:absolute; left:8px; right:8px; bottom:3px;
         height:2px; background:var(--red); border-radius:2px; }

.head-cta{ flex:none; min-width:172px; }
.head-cta.btn{ padding:11px 18px; font-size:11.5px; }

.burger{ display:none; background:none; border:1.5px solid var(--line); border-radius:6px;
         padding:9px 12px; cursor:pointer; font-family:var(--mono); font-size:11px;
         letter-spacing:.12em; }

@media(max-width:1240px){
  .hnav a{ font-size:11px; padding:9px 6px; letter-spacing:.03em; }
  .brand{ width:306px; }
  .brand img{ height:100px; margin-bottom:-46px; }
  .brand-txt b{ font-size:18px; }
  .head-cta.btn{ padding:10px 14px; font-size:11px; }
  .head-cta{ min-width:158px; }
}
@media(max-width:1080px){
  /* eight items plus the button no longer fit cleanly — use the drawer */
  .hnav{ display:none; }
  .burger{ display:block; order:3; }
  .head-cta{ margin-left:auto; order:2; min-width:0; }
  .brand{ order:1; width:auto; }
  .head-row{ gap:14px; }
}
@media(max-width:560px){
  .brand img{ height:78px; margin-bottom:-34px; }
  .brand-txt b{ font-size:16px; }
  .brand-txt i{ font-size:8px; letter-spacing:.12em; }
  .head-cta.btn{ padding:9px 12px; font-size:10px; }
}
@media(max-width:400px){
  .brand-txt i{ display:none; }
}

/* slide-down mobile menu */
.mnav{ display:none; background:var(--white); border-top:1px solid var(--line);
       padding:8px var(--gut) 18px; }
.mnav.open{ display:block; }
.mnav a{ display:block; padding:13px 2px; border-bottom:1px solid var(--line);
         font-size:15px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); }
.mnav a:last-child{ border-bottom:0; }

/* ------------------------------------------------------------
   SAREE DIVIDER — teeth only, no backing colour at all.
   It is attached to the TOP of the section it belongs to, so the
   gaps between the teeth show that section's own background and
   the border is genuinely transparent wherever it is placed.
   ------------------------------------------------------------ */
.teeth-top{ position:relative; }
.teeth-top::before{
  content:""; position:absolute; top:0; left:0; right:0; height:18px; z-index:4; pointer-events:none;
  background:
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 18 L17 4 L34 18 Z' fill='%238E1B22'/%3E%3C/svg%3E") repeat-x bottom left,
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 18 L17 0 L34 18 Z' fill='%23C9962F'/%3E%3C/svg%3E") repeat-x bottom left;
  background-size:34px 18px,34px 18px;
}

/* teeth hanging DOWN — used where a red band sits above a light one,
   so the red teeth descend into the light section below */
.teeth-top.teeth-down::before{
  background:
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 0 L17 14 L34 0 Z' fill='%238E1B22'/%3E%3C/svg%3E") repeat-x top left,
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 0 L17 18 L34 0 Z' fill='%23C9962F'/%3E%3C/svg%3E") repeat-x top left;
  background-size:34px 18px,34px 18px;
}

/* standalone strip, for sitting over the hero video */
.saree{
  height:18px; line-height:0; position:relative; z-index:4; background-color:transparent;
  background:
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 18 L17 4 L34 18 Z' fill='%238E1B22'/%3E%3C/svg%3E") repeat-x bottom left,
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 18 L17 0 L34 18 Z' fill='%23C9962F'/%3E%3C/svg%3E") repeat-x bottom left;
  background-size:34px 18px,34px 18px;
}
.saree.over{ position:absolute; left:0; right:0; bottom:0;
             filter:drop-shadow(0 -2px 6px rgba(0,0,0,.4)); }

/* ------------------------------------------------------------
   HERO VIDEO
   ------------------------------------------------------------ */
.hero-media{ position:absolute; inset:0; overflow:hidden; }
.hero-media video,.hero-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.hslide{ position:absolute; inset:0; opacity:0; transition:opacity .9s ease; }
.hslide.is-on{ opacity:1; }
@media(prefers-reduced-motion:reduce){ .hslide{ transition:none; } }
.hero-tools{ position:absolute; right:18px; bottom:30px; z-index:5; display:flex; gap:8px; }
.hero-btn{ background:rgba(30,21,18,.55); border:1px solid rgba(255,255,255,.4); color:#fff;
  font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  padding:7px 12px; border-radius:5px; cursor:pointer; backdrop-filter:blur(6px); transition:.18s; }
.hero-btn:hover{ background:var(--red); border-color:var(--red); }
@media(max-width:600px){ .hero-tools{ right:10px; bottom:26px; } }

/* ------------------------------------------------------------
   HERO
   ------------------------------------------------------------ */
.hero{ position:relative; overflow:hidden; background:#C9A97C; z-index:1; }
.hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-bg-v{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.9; }
.hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(100deg,rgba(251,245,234,.94) 0%,rgba(251,245,234,.72) 30%,
                                    rgba(251,245,234,.12) 56%,rgba(60,30,10,.28) 100%); }
.hero .wrap{ position:relative; z-index:2; }
.hero-grid{ display:grid; grid-template-columns:1fr 380px; gap:40px; align-items:center;
            min-height:520px; padding:56px 0 66px; }
.hero h1{ font-size:clamp(38px,5.6vw,64px); line-height:1.08; }
.hero h1 .l1{ color:var(--red); display:block; }
.hero h1 .l2{ color:var(--ink); display:block; }
.hero-sub{ margin:22px 0 30px; font-size:19px; color:var(--ink); line-height:1.6; }
.hero-sub b{ font-weight:600; display:block; }

/* the appeal card */
.appeal{ background:rgba(255,255,255,.96); border-radius:var(--r); padding:26px 26px 24px;
         box-shadow:0 24px 60px -30px rgba(36,26,22,.6); border:1px solid rgba(201,150,47,.35); }
.appeal h3{ font-size:24px; line-height:1.25; margin-bottom:12px; }
.appeal h3 em{ font-style:italic; color:var(--red); }
.appeal .a-lead{ font-size:14.5px; margin-bottom:18px; }
.appeal .a-raised{ font-family:var(--serif); font-size:27px; color:var(--red); font-weight:700; }
.appeal .a-of{ font-size:13px; margin-bottom:12px; }
.a-bar{ height:8px; border-radius:99px; background:var(--cream-2); overflow:hidden; margin-bottom:8px; }
.a-bar i{ display:block; height:100%; width:0; border-radius:99px;
          background:linear-gradient(90deg,var(--red-deep),var(--red-mid) 60%,var(--gold));
          transition:width 1.5s cubic-bezier(.2,.8,.2,1); }
.a-pct{ display:flex; justify-content:space-between; font-size:12px; font-weight:600;
        color:var(--ink); margin-bottom:18px; }
.appeal .btn{ width:100%; }

@media(max-width:980px){
  .hero-grid{ grid-template-columns:1fr; gap:32px; min-height:0; padding:44px 0 52px; }
  .hero::after{ background:linear-gradient(180deg,rgba(251,245,234,.9) 0%,rgba(251,245,234,.78) 55%,rgba(251,245,234,.92) 100%); }
  .appeal{ max-width:420px; }
}

/* ------------------------------------------------------------
   STATS STRIP
   ------------------------------------------------------------ */
.stats{ background:linear-gradient(180deg,var(--red-mid),var(--red)); color:#fff; position:relative; }
.stats::before,.stats::after{ content:""; position:absolute; left:0; right:0; height:7px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 8px,transparent 8px 16px); opacity:.5; }
.stats::before{ top:0; } .stats::after{ bottom:0; }
.stats-row{ display:grid; grid-template-columns:repeat(5,1fr); }
.stat{ display:flex; align-items:center; justify-content:center; gap:13px;
       padding:26px 14px; border-right:1px solid rgba(255,255,255,.2); text-align:left; }
.stat:last-child{ border-right:0; }
.stat svg{ width:32px; height:32px; flex:none; color:var(--gold-lt); }
.stat b{ font-family:var(--serif); font-size:26px; color:#fff; display:block; line-height:1.15; }
.stat span{ font-size:12.5px; color:#F2D9CF; letter-spacing:.04em; }
@media(max-width:900px){ .stats-row{ grid-template-columns:1fr 1fr; }
  .stat{ border-bottom:1px solid rgba(255,255,255,.2); } }
@media(max-width:460px){ .stats-row{ grid-template-columns:1fr; } }

/* ------------------------------------------------------------
   SECTIONS
   ------------------------------------------------------------ */
.section{ padding:74px 0; }
.teeth-top{ padding-top:80px; }
.hosp.teeth-top .hosp-grid{ padding-top:44px; }
/* sections alternate cream and white rather than running cream throughout */
.bg-cream{ background:var(--cream); }
.bg-cream2{ background:var(--white); }
.bg-white{ background:var(--white); }

/* ------------------------------------------------------------
   PROJECT CARDS
   ------------------------------------------------------------ */
.projects{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.proj{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
       overflow:hidden; text-align:center; padding-bottom:20px; transition:.25s;
       display:flex; flex-direction:column; }
.proj:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--gold); }
.proj-img{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.proj-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.proj:hover .proj-img img{ transform:scale(1.06); }
/* the circular emblem straddling the image edge */
.proj-badge{ position:absolute; left:50%; bottom:-24px; transform:translateX(-50%);
   width:48px; height:48px; border-radius:50%; display:grid; place-items:center;
   background:linear-gradient(180deg,var(--red-mid),var(--red)); border:3px solid var(--white);
   box-shadow:0 6px 14px -6px rgba(36,26,22,.7); }
.proj-badge svg{ width:22px; height:22px; color:var(--gold-lt); }
.proj-body{ padding:38px 16px 0; flex:1; display:flex; flex-direction:column; }
.proj h4{ font-size:16.5px; line-height:1.3; margin-bottom:7px; }
.proj p{ font-size:13.5px; margin:0 0 14px; flex:1; }
.proj .explore{ font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
                color:var(--red); display:inline-flex; align-items:center; gap:6px; justify-content:center; }
.proj .explore::after{ content:"→"; transition:transform .18s; }
.proj:hover .explore::after{ transform:translateX(4px); }
@media(max-width:1080px){ .projects{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:760px){ .projects{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:440px){ .projects{ grid-template-columns:1fr; } }
.center-cta{ text-align:center; margin-top:36px; }

/* ------------------------------------------------------------
   EVENTS & PROGRAMS  (the "Evening for Matri-Peeth" block)
   ------------------------------------------------------------ */
.prog-grid{ display:grid; grid-template-columns:300px 1fr; gap:30px; align-items:start; }
.prog-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
            padding:24px 22px; text-align:center; }
.prog-card img{ height:64px; width:auto; margin:0 auto 12px; }
.prog-card .pc-name{ font-family:var(--serif); font-size:17px; color:var(--ink); font-weight:700; }
.prog-card .pc-sub{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--body-c); }
.prog-card h4{ color:var(--red); font-size:19px; margin:16px 0 4px; }
.prog-card .pc-line{ font-size:14px; margin-bottom:16px; }
.pc-meta{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:6px; }
.pc-meta div{ padding:10px 6px; border-right:1px solid var(--line); }
.pc-meta div:last-child{ border-right:0; }
.pc-meta dt{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--red); font-weight:700; }
.pc-meta dd{ margin:4px 0 0; font-size:11.5px; line-height:1.45; color:var(--ink); }

.prog-items{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.prog-item{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
            overflow:hidden; text-align:center; padding-bottom:16px; transition:.22s; }
.prog-item:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--gold); }
.prog-item .pi-img{ position:relative; aspect-ratio:1/1; overflow:hidden; }
.prog-item .pi-img img{ width:100%; height:100%; object-fit:cover; }
.prog-item .proj-badge{ width:38px; height:38px; bottom:-19px; }
.prog-item .proj-badge svg{ width:17px; height:17px; }
.prog-item h5{ font-size:14px; color:var(--red); margin:30px 10px 5px; }
.prog-item p{ font-size:12px; margin:0 10px; line-height:1.5; }
@media(max-width:1080px){ .prog-grid{ grid-template-columns:1fr; }
  .prog-items{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:640px){ .prog-items{ grid-template-columns:repeat(2,1fr); } }

/* ------------------------------------------------------------
   HOSPITAL BAND
   ------------------------------------------------------------ */
.hosp{ background:linear-gradient(160deg,var(--red-mid),var(--red-deep)); color:#F3DED9;
       position:relative; overflow:hidden; }
.hosp::after{ content:""; position:absolute; right:-90px; top:-70px; width:420px; height:420px;
  border-radius:50%; pointer-events:none; opacity:.16;
  background:radial-gradient(circle,var(--gold-lt) 0%,transparent 68%); }
.hosp-grid{ display:grid; grid-template-columns:minmax(280px,420px) 1fr; gap:44px;
            align-items:center; padding:52px 0; position:relative; z-index:2; }
.hosp-img{ border-radius:var(--r); overflow:hidden; border:2px solid rgba(201,150,47,.5); }
.hosp .kicker{ font-size:13px; letter-spacing:.06em; color:var(--gold-lt); margin-bottom:6px; }
.hosp h2{ color:#fff; font-size:clamp(25px,3.2vw,36px); margin-bottom:12px; }
.hosp p{ font-size:15.5px; margin-bottom:24px; max-width:56ch; }
.hosp-icons{ display:flex; gap:14px 26px; flex-wrap:wrap; margin-bottom:26px; }
/* icon and label on one line, vertically centred against each other */
.hosp-ico{ display:inline-flex; align-items:center; gap:9px;
           font-size:13.5px; line-height:1; color:#F3DED9; white-space:nowrap; }
.hosp-ico svg{ width:22px; height:22px; flex:none; color:var(--gold-lt); display:block; }
@media(max-width:900px){ .hosp-grid{ grid-template-columns:1fr; gap:28px; } }

/* ------------------------------------------------------------
   HOW IT WORKS  +  IMPACT
   ------------------------------------------------------------ */
.works-impact{ display:grid; grid-template-columns:1.35fr 1fr; gap:52px; align-items:start; }
@media(max-width:1000px){ .works-impact{ grid-template-columns:1fr; gap:44px; } }
.h2-left{ text-align:left; }
.h2-left .orn{ justify-content:flex-start; margin-bottom:10px; }
.h2-left .orn::before{ display:none; }

.steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; position:relative; }
.steps::before{ content:""; position:absolute; left:10%; right:10%; top:29px; height:2px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 6px,transparent 6px 12px); }
.step{ text-align:center; position:relative; }
.step-ico{ width:58px; height:58px; margin:0 auto 14px; border-radius:50%; display:grid;
  place-items:center; background:linear-gradient(180deg,var(--red-mid),var(--red));
  border:3px solid var(--cream); position:relative; z-index:2; }
.step-ico svg{ width:26px; height:26px; color:var(--gold-lt); }
.step-n{ position:absolute; right:-2px; bottom:-2px; width:20px; height:20px; border-radius:50%;
  background:var(--gold); color:#3A2A08; font-size:11px; font-weight:700; display:grid;
  place-items:center; border:2px solid var(--cream); }
.step h4{ font-size:15px; margin-bottom:5px; }
.step p{ font-size:12.5px; margin:0; line-height:1.5; }
@media(max-width:760px){ .steps{ grid-template-columns:1fr 1fr; gap:26px; }
  .steps::before{ display:none; } }

.impact-row{ margin-bottom:20px; }
.impact-top{ display:flex; justify-content:space-between; font-size:13.5px; margin-bottom:7px; }
.impact-top b{ color:var(--ink); font-weight:600; }
.impact-bar{ height:7px; border-radius:99px; background:var(--cream-2); overflow:hidden; }
.impact-bar i{ display:block; height:100%; width:0; border-radius:99px;
  background:linear-gradient(90deg,var(--red),var(--gold)); transition:width 1.4s cubic-bezier(.2,.8,.2,1); }

/* ------------------------------------------------------------
   EVENTS & NEWS CAROUSEL
   ------------------------------------------------------------ */
.carousel{ position:relative; }
.track{ display:grid; grid-auto-flow:column; grid-auto-columns:calc(25% - 17px); gap:22px;
        overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
        padding-bottom:6px; scrollbar-width:none; }
.track::-webkit-scrollbar{ display:none; }
.ev{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
     overflow:hidden; scroll-snap-align:start; transition:.22s; }
.ev:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--gold); }
.ev-img{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.ev-img img{ width:100%; height:100%; object-fit:cover; }
.ev-date{ position:absolute; left:12px; top:12px; background:var(--red); color:#fff;
   border-radius:6px; padding:6px 10px 5px; text-align:center; line-height:1; }
.ev-date b{ display:block; font-family:var(--serif); font-size:17px; }
.ev-date span{ font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; opacity:.9; }
.ev-body{ padding:16px 18px 20px; }
.ev-body h4{ font-size:16px; color:var(--red); margin-bottom:6px; }
.ev-body p{ font-size:13px; margin:0 0 12px; }
.ev-body .more{ font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--ink); }
.ev-body .more::after{ content:" →"; }
.c-btn{ position:absolute; top:38%; width:38px; height:38px; border-radius:50%; border:0;
  background:var(--red); color:#fff; cursor:pointer; display:grid; place-items:center;
  font-size:16px; box-shadow:0 8px 18px -10px rgba(0,0,0,.7); transition:.18s; z-index:3; }
.c-btn:hover{ background:var(--red-deep); }
.c-prev{ left:-16px; } .c-next{ right:-16px; }
@media(max-width:1080px){ .track{ grid-auto-columns:calc(50% - 11px); } .c-prev{ left:2px; } .c-next{ right:2px; } }
@media(max-width:600px){ .track{ grid-auto-columns:86%; } }
.ev-all{ text-align:right; margin-top:18px; font-size:11.5px; font-weight:700;
         letter-spacing:.13em; text-transform:uppercase; color:var(--red); }

/* ------------------------------------------------------------
   TESTIMONIALS
   ------------------------------------------------------------ */
.says{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.say{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
      padding:26px 24px; position:relative; }
.say .q{ font-family:var(--serif); font-size:44px; line-height:1; color:var(--gold); }
.say p{ font-size:14px; font-style:italic; margin:6px 0 14px; }
.say .who{ font-size:13px; font-weight:600; color:var(--ink); }
.say .role{ font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--red); }
.stars{ color:var(--gold); font-size:13px; letter-spacing:2px; margin-bottom:6px; }
@media(max-width:880px){ .says{ grid-template-columns:1fr; } }

/* ------------------------------------------------------------
   NEWSLETTER
   ------------------------------------------------------------ */
.news{ background:var(--cream-2); }
.news-row{ display:grid; grid-template-columns:auto 1fr auto; gap:26px; align-items:center;
           padding:32px 0; }
.news-ico{ width:52px; height:52px; border-radius:50%; background:var(--red); display:grid;
           place-items:center; flex:none; }
.news-ico svg{ width:24px; height:24px; color:#fff; }
.news h4{ font-size:19px; margin-bottom:3px; }
.news p{ font-size:13.5px; margin:0; }
.news form{ display:flex; gap:10px; }
.news input{ padding:12px 16px; border:1px solid var(--line); border-radius:6px;
             font-family:var(--sans); font-size:14px; min-width:240px; background:#fff; color:var(--ink); }
.news input:focus{ outline:none; border-color:var(--gold); }
@media(max-width:860px){ .news-row{ grid-template-columns:1fr; gap:18px; }
  .news form{ flex-wrap:wrap; } .news input{ flex:1; min-width:0; } }

/* ------------------------------------------------------------
   FOOTER
   ------------------------------------------------------------ */
footer.site{ background:#1E1512; color:#B5A69F; padding:0 0 26px; font-size:13.5px; }
.foot-top{ height:6px; background:linear-gradient(90deg,var(--red) 0 33%,var(--gold) 33% 66%,var(--red) 66%); }
.foot-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.4fr 1fr; gap:30px; padding:46px 0 34px; }
.foot-grid h5{ font-family:var(--sans); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
   color:var(--gold); margin:0 0 16px; font-weight:700; position:relative; padding-bottom:9px; }
.foot-grid h5::after{ content:""; position:absolute; left:0; bottom:0; width:26px; height:2px; background:var(--red-mid); }
.foot-grid ul{ list-style:none; margin:0; padding:0; }
.foot-grid li{ margin-bottom:8px; }
.foot-grid a:hover{ color:var(--gold-lt); }
.f-brand img{ height:158px; width:auto; margin-bottom:16px; }
@media(max-width:900px){ .f-brand img{ height:128px; } }
.f-brand p{ font-size:13px; max-width:32ch; margin:0; }
.f-contact li{ display:flex; gap:10px; align-items:flex-start; }
.f-contact svg{ width:15px; height:15px; flex:none; color:var(--gold); margin-top:4px; }
.qr{ width:104px; height:104px; background:#fff; border-radius:6px; padding:6px; }
.qr img,.qr svg{ width:100%; height:100%; display:block; }
.socials{ display:flex; gap:9px; }
.socials a{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
   background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); transition:.18s; }
.socials a:hover{ background:var(--red-mid); border-color:var(--red-mid); color:#fff; }
.socials svg{ width:15px; height:15px; }
.foot-base{ border-top:1px solid rgba(255,255,255,.12); padding-top:20px; display:flex;
   justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; }
@media(max-width:1000px){ .foot-grid{ grid-template-columns:1fr 1fr 1fr; } }
@media(max-width:620px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:420px){ .foot-grid{ grid-template-columns:1fr; } }

/* ------------------------------------------------------------
   MOTION
   ------------------------------------------------------------ */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
  .track{ scroll-behavior:auto; }
}

/* ============================================================
   LAYOUT OPTIONS
   body.opt-a  — light: stats float as a card over the hero,
                 hospital and testimonials on cream
   body.opt-b  — bold: full-width red stats strip, red hospital
                 band, red testimonial band
   ============================================================ */

/* ---------- OPTION A ---------- */
.opt-a .stats{ background:transparent; color:inherit; margin-top:-58px; position:relative; z-index:6; }
.opt-a .stats::before,.opt-a .stats::after{ display:none; }
.opt-a .stats-row{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:0 22px 50px -34px rgba(36,26,22,.6); overflow:hidden; }
.opt-a .stat{ border-right:1px solid var(--line); }
.opt-a .stat svg{ color:var(--gold); }
.opt-a .stat b{ color:var(--ink); }
.opt-a .stat span{ color:var(--body-c); }
.opt-a .hero-grid{ padding-bottom:104px; }

.opt-a .hosp{ background:linear-gradient(180deg,var(--cream-2),#F1E4CE); color:var(--body-c); }
.opt-a .hosp::after{ opacity:.5; background:radial-gradient(circle,rgba(201,150,47,.4) 0%,transparent 68%); }
.opt-a .hosp h2{ color:var(--red); }
.opt-a .hosp .kicker{ color:var(--body-c); }
.opt-a .hosp-ico{ color:var(--body-c); }
.opt-a .hosp-ico svg{ color:var(--red); }
.opt-a .hosp-img{ border-color:rgba(201,150,47,.55); }
.opt-a .hosp .btn-gold{ background:linear-gradient(180deg,var(--red-mid),var(--red)); color:#fff; }
.opt-a .hosp .btn-gold:hover{ background:var(--red-deep); }

.opt-a .says-band{ background:var(--cream); }

/* ---------- OPTION B ---------- */
.opt-b .says-band{ background:linear-gradient(160deg,var(--red-mid),var(--red-deep)); position:relative; }
.opt-b .says-band::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.13;
  background:radial-gradient(520px 320px at 88% 12%,var(--gold-lt),transparent 70%); }
.opt-b .says-band .wrap{ position:relative; z-index:2; }
.opt-b .says-band h2{ color:#fff; }
.opt-b .says-band .orn::before,.opt-b .says-band .orn::after{
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='9'%3E%3Cpath d='M0 4.5h44M52 4.5h12' stroke='%23EDC98C' stroke-width='1.2'/%3E%3Cpath d='M48 0l4 4.5-4 4.5-4-4.5z' fill='%23EDC98C'/%3E%3C/svg%3E"); }
.opt-b .say{ background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.2); }
.opt-b .say p{ color:#F3DED9; }
.opt-b .say .who{ color:#fff; }
.opt-b .say .role{ color:var(--gold-lt); }
.opt-b .say .q{ color:var(--gold-lt); }

/* teeth hang downward from the section's top edge; gaps stay transparent */


/* ============================================================
   INNER PAGES
   ============================================================ */
.pagehead{ position:relative; padding:92px 0 84px; color:#fff; overflow:hidden;
  min-height:300px; display:flex; align-items:center;
  background:linear-gradient(160deg,var(--red-mid),var(--red-deep)); }
/* the banner photograph, with a deliberately light wash over it so it stays visible */
.ph-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.pagehead::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(100deg,rgba(94,17,19,.88) 0%,rgba(142,27,34,.62) 48%,
                                    rgba(94,17,19,.38) 100%); }
.pagehead::after{ content:""; position:absolute; right:-80px; top:-80px; width:400px; height:400px;
  border-radius:50%; opacity:.16; pointer-events:none; z-index:1;
  background:radial-gradient(circle,var(--gold-lt) 0%,transparent 68%); }
@media(max-width:700px){
  .pagehead{ padding:64px 0 58px; min-height:230px; }
  .pagehead::before{ background:linear-gradient(120deg,rgba(94,17,19,.90) 0%,rgba(142,27,34,.70) 100%); }
}
.pagehead .wrap{ position:relative; z-index:2; width:100%; }
.pagehead h1{ color:#fff; font-size:clamp(30px,4.4vw,50px); max-width:20ch; }
.pagehead p{ color:#F3DED9; font-size:17.5px; max-width:62ch; margin:14px 0 0; }
.crumb{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
        color:var(--gold-lt); margin:0 0 14px; }
.crumb a{ color:var(--gold-lt); border-bottom:1px solid rgba(237,201,140,.5); }
.crumb span{ opacity:.5; margin:0 6px; }

.split{ display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:start; }
.trio{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media(max-width:900px){ .split,.trio{ grid-template-columns:1fr; gap:32px; } }
.lead{ font-size:19px; color:var(--ink); }

.framed{ border-radius:var(--r); overflow:hidden; border:2px solid var(--gold); }
.framed img{ width:100%; height:auto; }

.panel{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
        padding:28px 26px; }
.panel h4{ font-size:19px; margin:0 0 8px; }
.panel p{ font-size:14.5px; margin:0; }
.p-ico{ display:inline-grid; place-items:center; width:46px; height:46px; border-radius:50%;
        background:linear-gradient(180deg,var(--red-mid),var(--red)); margin-bottom:14px; }
.p-ico svg{ width:22px; height:22px; color:var(--gold-lt); }

.facts{ list-style:none; margin:0; padding:0; border-top:2px solid var(--red); }
.facts li{ padding:16px 0 16px 22px; position:relative; border-bottom:1px solid var(--line); }
.facts li::before{ content:"◆"; position:absolute; left:0; top:20px; font-size:8px; color:var(--gold); }
.facts b{ display:block; font-family:var(--serif); font-size:17.5px; color:var(--ink); }
.facts span{ font-size:14.5px; }
.costline{ font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
           color:var(--red); margin-top:20px; }

.soon{ text-align:center; border:1.5px dashed var(--line); border-radius:var(--r);
       padding:46px 30px; background:var(--white); }
.soon h4{ font-size:21px; margin:6px 0 8px; }
.soon p{ max-width:52ch; margin:0 auto; font-size:15px; }

.vow{ margin:0; font-family:var(--serif); font-style:italic; font-size:clamp(20px,2.6vw,28px);
      line-height:1.5; color:#fff; text-align:center; max-width:34ch; margin-inline:auto; }
.vow span{ display:block; font-family:var(--sans); font-style:normal; font-size:15px;
           color:var(--gold-lt); margin-top:18px; }

table.cost{ width:100%; border-collapse:collapse; }
table.cost caption{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--red); text-align:left; padding-bottom:10px; }
table.cost th{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--body-c); text-align:left; padding:9px 0; border-bottom:2px solid var(--ink); font-weight:500; }
table.cost th:last-child,table.cost td:last-child{ text-align:right; }
table.cost td{ padding:11px 0; border-bottom:1px solid var(--line); font-size:15px; }
table.cost tr.total td{ font-family:var(--serif); font-weight:700; border-bottom:2px solid var(--ink); }
table.cost tr.grand td{ font-family:var(--serif); font-weight:700; font-size:18px; color:var(--red); }

/* ---------- donate page ---------- */
.big-num{ font-family:var(--serif); font-weight:700; font-size:clamp(42px,6vw,68px);
          color:var(--red); line-height:1; margin:0 0 6px; }
.big-lab{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
          color:var(--body-c); }
.equiv{ margin-top:26px; border-top:2px solid var(--red); }
.equiv div{ display:flex; justify-content:space-between; gap:16px; padding:12px 0;
            border-bottom:1px solid var(--line); font-size:15px; }
.equiv span{ font-family:var(--mono); font-size:10.5px; letter-spacing:.13em;
             text-transform:uppercase; color:var(--body-c); }
.equiv b{ color:var(--ink); }
blockquote.pull{ margin:26px 0 0; padding-left:18px; border-left:3px solid var(--gold);
                 font-family:var(--serif); font-style:italic; font-size:18px; color:var(--ink); }

.calc{ background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:28px;
       box-shadow:var(--shadow); }
.calc-label{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase;
             color:var(--body-c); margin-bottom:12px; }
.sq-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.sq-chip{ font-family:var(--sans); font-weight:600; font-size:14.5px; padding:9px 14px;
          border:1.5px solid var(--line); background:var(--white); color:var(--ink);
          border-radius:6px; cursor:pointer; transition:.15s; }
.sq-chip:hover{ border-color:var(--red); }
.sq-chip[aria-pressed="true"]{ background:var(--red); border-color:var(--red); color:#fff; }
.slider{ width:100%; margin:4px 0 20px; accent-color:var(--red); height:24px; }
.calc-out{ border-top:1px solid var(--line); padding-top:20px; }
.calc-amt{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin:0; }
.calc-amt b{ font-family:var(--serif); font-size:clamp(32px,4.4vw,46px); color:var(--red); line-height:1; }
.calc-amt span{ font-family:var(--mono); font-size:11px; letter-spacing:.14em;
                text-transform:uppercase; color:var(--body-c); }
.honour{ margin-top:18px; padding:16px 18px; border:1px dashed var(--gold);
         border-radius:var(--r); background:#FDF6E9; transition:opacity .3s, transform .3s; }
.honour.pulse{ opacity:0; transform:translateY(6px); }
.h-lab{ font-family:var(--mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
        color:var(--body-c); margin:0; }
.h-title{ font-family:var(--serif); font-size:24px; color:var(--ink); margin:5px 0 2px; }
.h-mean{ font-family:var(--serif); font-style:italic; font-size:15px; color:var(--red); margin:0; }
.h-gives{ font-size:14px; margin:10px 0 0; }
.field{ margin:16px 0 0; }
.field label{ display:block; font-family:var(--mono); font-size:10px; letter-spacing:.16em;
              text-transform:uppercase; color:var(--body-c); margin-bottom:7px; }
.field input,.field select,.field textarea{ width:100%; padding:12px 13px; font-family:var(--sans);
  font-size:15px; color:var(--ink); background:var(--white); border:1.5px solid var(--line);
  border-radius:6px; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--red); }
.calc .btn{ width:100%; margin-top:18px; }
.pay-note{ font-family:var(--mono); font-size:10px; letter-spacing:.05em; color:var(--body-c);
           text-align:center; margin-top:12px; line-height:1.8; }

.ladder-scroll{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r); background:var(--white); }
table.ladder{ width:100%; border-collapse:collapse; min-width:740px; }
table.ladder th{ font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase;
  background:var(--red); color:#fff; text-align:left; padding:14px 16px; font-weight:500;
  border-bottom:3px solid var(--gold); }
table.ladder td{ padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; font-size:14.5px; }
table.ladder tbody tr:hover{ background:var(--cream); }
table.ladder tr[data-stone] .t-amt::after{ content:"◆"; color:var(--gold); font-size:8px;
  vertical-align:super; margin-left:5px; }
.t-amt{ font-family:var(--serif); font-weight:700; font-size:16px; white-space:nowrap; color:var(--ink); }
.t-sq{ font-family:var(--mono); font-size:12.5px; color:var(--body-c); white-space:nowrap; }
.t-title b{ font-family:var(--serif); font-size:15.5px; display:block; color:var(--ink); }
.t-title span{ font-family:var(--serif); font-style:italic; font-size:13.5px; color:var(--red); }
.t-gives{ max-width:32ch; }
.t-pick{ font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:.06em; padding:8px 13px;
  white-space:nowrap; border:1.5px solid var(--ink); background:transparent; border-radius:6px;
  cursor:pointer; transition:.15s; color:var(--ink); }
.t-pick:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.ladder-note{ font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--body-c); margin-top:14px; }

/* ---------- gallery ---------- */
.years{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:32px; }
.year-chip{ font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; padding:9px 15px;
  border:1px solid var(--line); background:var(--white); border-radius:6px; cursor:pointer; transition:.15s; }
.year-chip:hover{ border-color:var(--red); }
.year-chip.is-on{ background:var(--red); color:#fff; border-color:var(--red); }
.grid{ column-count:4; column-gap:18px; }
.tile{ margin:0 0 18px; break-inside:avoid; position:relative; cursor:zoom-in;
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--white);
  transition:opacity .38s ease, transform .38s ease; }
.tile.fading{ opacity:0; transform:translateY(12px); }
.tile img{ width:100%; height:auto; }
.tile figcaption{ position:absolute; inset:auto 0 0 0; padding:24px 11px 9px; color:#fff;
  background:linear-gradient(transparent,rgba(30,21,18,.9)); font-family:var(--mono);
  font-size:10px; letter-spacing:.1em; text-transform:uppercase; opacity:0; transition:opacity .2s; }
.tile:hover figcaption,.tile:focus-within figcaption{ opacity:1; }
.tile.hide{ display:none; }
@media(max-width:1000px){ .grid{ column-count:3; } }
@media(max-width:700px){ .grid{ column-count:2; } }
@media(max-width:420px){ .grid{ column-count:1; } }

.lb{ position:fixed; inset:0; z-index:200; background:rgba(30,21,18,.95);
  backdrop-filter:blur(14px); display:flex; align-items:center; justify-content:center;
  padding:60px 20px; opacity:0; visibility:hidden; transition:opacity .32s, visibility .32s; }
.lb.open{ opacity:1; visibility:visible; }
.lb img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:var(--r);
  opacity:0; transform:scale(.94); transition:opacity .34s, transform .38s cubic-bezier(.2,.85,.25,1); }
.lb.open img{ opacity:1; transform:scale(1); }
.lb.swapping img{ opacity:0; transform:scale(.985); transition-duration:.16s; }
.lb-btn,.lb-cap{ opacity:0; transition:opacity .3s ease .1s; }
.lb.open .lb-btn,.lb.open .lb-cap{ opacity:1; }
.lb-cap{ position:absolute; left:0; right:0; bottom:18px; text-align:center; color:#D8CBC7;
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.lb-btn{ position:absolute; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.26);
  color:#fff; width:46px; height:46px; border-radius:50%; cursor:pointer; font-size:20px;
  display:grid; place-items:center; transition:.15s; }
.lb-btn:hover{ background:var(--red); border-color:var(--red); }
.lb-prev{ left:16px; top:50%; transform:translateY(-50%); }
.lb-next{ right:16px; top:50%; transform:translateY(-50%); }
.lb-close{ right:16px; top:16px; }

/* ---------- events grid ---------- */
.ev-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media(max-width:960px){ .ev-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .ev-grid{ grid-template-columns:1fr; } }

/* ---------- contact ---------- */
.c-list{ border-top:2px solid var(--red); margin:0; }
.c-row{ display:grid; grid-template-columns:110px 1fr; gap:18px; padding:16px 0;
        border-bottom:1px solid var(--line); align-items:baseline; }
.c-row dt{ font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
           color:var(--body-c); }
.c-row dd{ margin:0; font-size:16px; color:var(--ink); }
.c-row a{ border-bottom:1px solid var(--gold); }
.c-row a:hover{ color:var(--red); }
.map-wrap{ display:flex; flex-direction:column; gap:12px; }
.map-slot{ position:relative; aspect-ratio:4/3; border:2px solid var(--gold);
           border-radius:var(--r); overflow:hidden; }
.map-slot iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.map-link{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--body-c); align-self:flex-start; }
.map-link svg{ width:15px; height:15px; color:var(--red); }
.map-link:hover{ color:var(--red); }
.contact-form.is-centred{ max-width:780px; margin-inline:auto; }
.contact-form{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
               padding:30px; max-width:820px; }
.cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:640px){ .cf-row{ grid-template-columns:1fr; gap:0; } }
.contact-form .btn{ margin-top:22px; }

/* ---------- about: chairman signature, milestones ---------- */
.sig{ font-family:var(--serif); font-size:19px; color:var(--ink); margin-top:26px;
      padding-top:20px; border-top:1px solid var(--line); }
.sig span{ display:block; font-family:var(--sans); font-size:13px; color:var(--body-c); margin-top:4px; }
.mile{ display:grid; grid-template-columns:repeat(3,1fr); gap:0 26px; border-top:2px solid var(--red); }
.mile div{ padding:15px 0; border-bottom:1px solid var(--line); }
.mile b{ display:block; font-family:var(--serif); font-size:16px; color:var(--ink); }
.mile span{ font-size:13.5px; }
@media(max-width:900px){ .mile{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .mile{ grid-template-columns:1fr; } }

/* ---------- events: year blocks ---------- */
.year-block{ margin-bottom:44px; }
.year-h{ font-family:var(--serif); font-size:clamp(28px,3.6vw,40px); color:var(--red);
         margin-bottom:14px; display:flex; align-items:center; gap:16px; }
.year-h::after{ content:""; flex:1; height:2px;
  background:linear-gradient(90deg,var(--gold),transparent); }

/* small outline button */
.btn-sm{ padding:9px 16px; font-size:11.5px; }


/* ============================================================
   2026 HOMEPAGE REVISION
   ============================================================ */

/* ---------- hero without the appeal card ---------- */
.hero-grid.hero-solo{ grid-template-columns:1fr; min-height:560px; }
.hero-solo .hero-copy{ max-width:640px; }
@media(max-width:980px){ .hero-grid.hero-solo{ min-height:0; } }

/* teeth pointing DOWN over the hero video */
.saree.down{
  background:
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 0 L17 14 L34 0 Z' fill='%238E1B22'/%3E%3C/svg%3E") repeat-x top left,
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='18' viewBox='0 0 34 18'%3E%3Cpath d='M0 0 L17 18 L34 0 Z' fill='%23C9962F'/%3E%3C/svg%3E") repeat-x top left;
  background-size:34px 18px,34px 18px;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));
}

/* ---------- red brand band under the hero ---------- */
/* the emblem rides up out of the band: top half over the hero video, bottom
   half inside the red, so the band itself can stay very shallow. The top edge
   carries the gold chequer "par" instead of a plain cut. */
.brandband{ background:linear-gradient(180deg,var(--red-mid),var(--red)); position:relative;
            z-index:3; padding:0 0 24px; text-align:center; }
.brandband::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px;
  z-index:1; background:var(--gold); }
.bb-inner{ position:relative; z-index:2; display:inline-block; margin-top:-104px; }
.bb-inner::before{ content:""; position:absolute; left:50%; top:40px; width:280px; height:280px;
  transform:translateX(-50%); border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(243,226,192,.30) 0%,rgba(243,226,192,0) 66%); }
.bb-mark{ position:relative; height:152px; width:auto; margin:0 auto 10px;
          filter:drop-shadow(0 12px 28px rgba(0,0,0,.45)); }
.bb-name{ position:relative; font-family:var(--serif); font-weight:700; color:#fff; margin:0;
          font-size:clamp(22px,2.7vw,32px); letter-spacing:.05em; text-transform:uppercase;
          line-height:1.05; }
.bb-name sup{ font-size:.35em; top:-1.1em; }
.bb-sub{ position:relative; margin:6px 0 0; color:var(--gold-lt); font-size:11px;
         letter-spacing:.26em; text-transform:uppercase; }
@media(max-width:900px){
  .brandband{ padding:0 0 20px; }
  .bb-inner{ margin-top:-78px; }
  .bb-mark{ height:118px; margin-bottom:9px; }
  .bb-inner::before{ width:210px; height:210px; top:30px; }
}
@media(max-width:600px){
  .brandband{ padding:0 0 18px; }
  .bb-inner{ margin-top:-60px; }
  .bb-mark{ height:96px; margin-bottom:8px; }
  .bb-inner::before{ width:170px; height:170px; top:22px; }
  .bb-sub{ letter-spacing:.16em; font-size:10px; }
}

/* ---------- short about block (home) ---------- */
.about-brief{ max-width:880px; margin-inline:auto; text-align:center; }
.about-brief .lead{ font-size:19px; line-height:1.65; }
.about-brief p{ margin-bottom:1.1em; }
.about-brief .center-cta{ margin-top:26px; }

/* ---------- chairman's portrait (about page) ---------- */
.chairman{ margin:0; text-align:center; }
.chairman img{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover;
               border-radius:var(--r); border:2px solid rgba(201,150,47,.55);
               box-shadow:var(--shadow); }
.chairman figcaption{ margin-top:14px; line-height:1.35; }
.chairman figcaption b{ display:block; font-family:var(--serif); font-size:18px; color:var(--ink); }
.chairman figcaption span{ display:block; font-size:12px; letter-spacing:.06em;
                           text-transform:uppercase; color:var(--red); margin-top:4px; }
.framed-fig{ max-width:420px; margin-inline:auto; }
@media(max-width:900px){ .chairman{ max-width:300px; margin-inline:auto; } }

/* ---------- hospital + mandir, side by side in one red band ---------- */
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:stretch;
      padding:46px 0 64px; position:relative; z-index:2; }
.duo-col{ min-width:0; display:flex; flex-direction:column; }
.duo-col .hosp-img{ margin-bottom:20px; }
.duo-col .hosp-img img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.duo-col .kicker{ font-size:12px; letter-spacing:.06em; color:var(--gold-lt); margin-bottom:5px; }
.duo-col h2{ color:#fff; font-size:clamp(19px,1.9vw,24px); margin-bottom:10px; }
.duo-col p{ font-size:14.5px; line-height:1.6; margin-bottom:18px; max-width:46ch; }
.duo-col .hosp-icons{ margin-bottom:22px; gap:11px 20px; }
.duo-col .hosp-ico{ font-size:12.5px; }
.duo-col .hosp-ico svg{ width:19px; height:19px; }
.duo-col .btn{ margin-top:auto; align-self:flex-start; }
.duo-band .hosp-grid{ display:none; }
@media(max-width:900px){
  .duo{ grid-template-columns:1fr; gap:44px; padding:40px 0 52px; }
  .duo-col .btn{ margin-top:0; }
}

/* ---------- contribute section: works | impact | appeal ---------- */
.works-impact.three{ grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 320px; gap:40px; }
.works-impact.three .sec-head h2{ font-size:clamp(18px,1.95vw,26px); margin-bottom:6px; }
.works-impact.three .steps{ gap:6px; }
.works-impact.three .step-ico{ width:52px; height:52px; margin-bottom:12px; }
.works-impact.three .step-ico svg{ width:23px; height:23px; }
.works-impact.three .steps::before{ top:26px; }
.works-impact.three .step h4{ font-size:14px; }
.works-impact.three .step p{ font-size:12px; }
.works-impact.three .appeal{ align-self:start; }
@media(max-width:1180px){
  .works-impact.three{ grid-template-columns:minmax(0,1fr) 320px; gap:36px; }
  .works-impact.three .appeal{ grid-column:2; grid-row:1 / span 2; }
}
@media(max-width:900px){
  .works-impact.three{ grid-template-columns:1fr; gap:40px; }
  .works-impact.three .sec-head h2{ font-size:clamp(24px,4.6vw,32px); }
  .works-impact.three .appeal{ grid-column:auto; grid-row:auto; max-width:420px; }
}

/* ---------- statistics, now inside the contribute section ---------- */
.stats.inset{ margin-top:26px; border-radius:var(--r); overflow:hidden;
              box-shadow:0 22px 50px -34px rgba(36,26,22,.6); }
.stats.inset::before,.stats.inset::after{ display:none; }
.stats.inset .stats-row{ border:0; }
@media(max-width:900px){ .stats.inset .stat:nth-last-child(-n+1){ border-bottom:0; } }


/* ============================================================
   MULTI-SITE SHELL (mandir / cultural / charity / main)
   ============================================================ */

/* ---------- wordmark header, menu anchored right ---------- */
.brand.wordmark{ width:auto; display:block; line-height:1; text-decoration:none; }
.wm-main{ display:block; font-family:var(--serif); font-weight:700; color:var(--red);
  font-size:clamp(22px,2.5vw,32px); letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.wm-main b{ color:var(--red-deep); font-weight:700; }
.wm-rule{ display:block; height:2px; width:100%; margin:7px 0 6px;
  background:linear-gradient(90deg,var(--gold),rgba(201,150,47,0)); }
.wm-sub{ display:block; font-size:9px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--body-c); white-space:nowrap; }
header.site.shrink .wm-main{ font-size:clamp(20px,2.1vw,26px); }
.hnav.right{ justify-content:flex-end; gap:4px; }
.hnav.right a{ font-size:12.5px; padding:10px 13px; }
.hnav.right a[target]::after{ content:"↗"; font-size:9px; margin-left:4px; opacity:.6;
  position:static; background:none; }
.hnav.right a.active::after{ content:""; }
@media(max-width:860px){
  .hnav.right{ display:none; }
  .burger{ display:block; margin-left:auto; }
  .wm-sub{ font-size:8px; letter-spacing:.14em; }
}

/* ---------- brand band with a menu either side of the emblem ---------- */
.bb-row{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:26px; }
.bb-nav{ display:flex; gap:10px; flex-wrap:wrap; }
.bb-nav.l{ justify-content:flex-end; }
.bb-nav.r{ justify-content:flex-start; }
.bb-nav a{ color:#fff; font-size:12px; font-weight:600; letter-spacing:.13em;
  text-transform:uppercase; padding:11px 16px; border:1px solid rgba(243,226,192,.42);
  border-radius:999px; transition:.2s; white-space:nowrap; }
.bb-nav a:hover{ background:var(--gold); border-color:var(--gold); color:var(--red-deep); }
.brandband.has-nav{ padding:0 0 34px; }
.brandband.has-nav .bb-inner{ margin-top:-58px; }
.brandband.has-nav .bb-mark{ height:140px; }
@media(max-width:980px){
  .bb-row{ grid-template-columns:1fr; gap:18px; justify-items:center; }
  .bb-nav{ justify-content:center !important; }
  .bb-row .bb-inner{ order:-1; }
  .brandband.has-nav .bb-inner{ margin-top:-52px; }
  .brandband.has-nav .bb-mark{ height:110px; }
  .bb-nav a{ font-size:11px; padding:9px 13px; letter-spacing:.1em; }
}

/* ---------- two service boxes inside one band ---------- */
.svc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:34px; padding:52px 0 64px;
  position:relative; z-index:2; }
.svc-card{ background:rgba(255,255,255,.97); border-radius:var(--r); overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 30px 60px -34px rgba(20,8,8,.75);
  border:1px solid rgba(201,150,47,.5); }
.svc-card .svc-img{ aspect-ratio:16/9; overflow:hidden; }
.svc-card .svc-img img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s ease; }
.svc-card:hover .svc-img img{ transform:scale(1.05); }
.svc-body{ padding:26px 28px 30px; display:flex; flex-direction:column; flex:1; }
.svc-body .kicker{ color:var(--red); font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; margin-bottom:7px; }
.svc-body h3{ font-size:clamp(20px,2vw,25px); color:var(--ink); margin-bottom:10px; }
.svc-body p{ font-size:14.5px; color:var(--body-c); margin-bottom:18px; }
.svc-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.svc-tags span{ font-size:11.5px; letter-spacing:.05em; padding:6px 11px; border-radius:999px;
  background:var(--cream-2); color:var(--red-deep); border:1px solid rgba(201,150,47,.4); }
.svc-body .btn{ margin-top:auto; align-self:flex-start; }
@media(max-width:900px){ .svc-grid{ grid-template-columns:1fr; gap:28px; padding:40px 0 52px; } }

/* ---------- the two headline actions: donate + membership ---------- */
.actband{ background:linear-gradient(135deg,var(--red-deep),var(--red-mid) 55%,var(--red));
  position:relative; overflow:hidden; }
.actband::before{ content:""; position:absolute; inset:0; opacity:.16; pointer-events:none;
  background:radial-gradient(circle at 12% 0%,var(--gold-lt) 0%,transparent 42%),
             radial-gradient(circle at 88% 100%,var(--gold-lt) 0%,transparent 42%); }
.act-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:28px;
  padding:64px 0 70px; }
.act-card{ display:block; border-radius:var(--r); padding:34px 34px 30px; position:relative;
  overflow:hidden; transition:transform .3s ease, box-shadow .3s ease; }
.act-card:hover{ transform:translateY(-5px); box-shadow:0 34px 60px -30px rgba(0,0,0,.6); }
.act-card .act-ico{ width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  margin-bottom:18px; }
.act-card .act-ico svg{ width:27px; height:27px; }
.act-card h3{ font-size:clamp(24px,2.6vw,32px); margin-bottom:9px; }
.act-card p{ font-size:15px; margin-bottom:22px; max-width:44ch; }
.act-go{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:12.5px;
  letter-spacing:.14em; text-transform:uppercase; }
.act-go span{ transition:transform .25s ease; }
.act-card:hover .act-go span{ transform:translateX(5px); }
.act-card.gold{ background:linear-gradient(150deg,var(--gold-lt),var(--gold)); color:var(--red-deep); }
.act-card.gold h3{ color:var(--red-deep); }
.act-card.gold p{ color:#5E3A10; }
.act-card.gold .act-ico{ background:rgba(94,17,19,.14); color:var(--red-deep); }
.act-card.gold .act-go{ color:var(--red-deep); }
.act-card.cream{ background:var(--white); color:var(--body-c); border:1px solid rgba(201,150,47,.5); }
.act-card.cream h3{ color:var(--ink); }
.act-card.cream .act-ico{ background:var(--cream-2); color:var(--red); }
.act-card.cream .act-go{ color:var(--red); }
.act-note{ position:relative; z-index:2; text-align:center; color:var(--gold-lt); font-size:12.5px;
  letter-spacing:.1em; text-transform:uppercase; padding-bottom:58px; }
@media(max-width:900px){ .act-grid{ grid-template-columns:1fr; gap:22px; padding:48px 0 40px; }
  .act-note{ padding-bottom:44px; } }

/* ---------- hub cards on the parent site ---------- */
.hub-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.hub-card{ display:flex; flex-direction:column; border-radius:var(--r); overflow:hidden;
  background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow);
  transition:transform .3s ease, box-shadow .3s ease; }
.hub-card:hover{ transform:translateY(-6px); box-shadow:0 30px 56px -30px rgba(36,26,22,.5); }
.hub-card .hub-img{ aspect-ratio:4/3; overflow:hidden; }
.hub-card .hub-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.hub-body{ padding:24px 26px 28px; display:flex; flex-direction:column; flex:1; }
.hub-body h3{ font-size:23px; color:var(--red); margin-bottom:9px; }
.hub-body p{ font-size:14.5px; margin-bottom:20px; }
.hub-body .btn{ margin-top:auto; align-self:flex-start; }
@media(max-width:960px){ .hub-grid{ grid-template-columns:1fr; } }


/* ---------- messages from the mentor and the chairman ---------- */
.msg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.msg-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  padding:32px 34px 30px; box-shadow:var(--shadow); position:relative; }
.msg-card::before{ content:"\201C"; position:absolute; top:6px; right:26px; font-family:var(--serif);
  font-size:96px; line-height:1; color:rgba(201,150,47,.26); pointer-events:none; }
.msg-head{ display:flex; align-items:center; gap:18px; margin-bottom:20px; }
.msg-head img{ width:88px; height:88px; border-radius:50%; object-fit:cover; flex:none;
  border:2px solid rgba(201,150,47,.6); }
.msg-head .kicker{ color:var(--red); font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; margin-bottom:4px; }
.msg-head h3{ font-size:21px; color:var(--ink); margin:0; }
.msg-head span{ display:block; font-size:12.5px; color:var(--body-c); margin-top:3px; }
.msg-body p{ font-size:15px; margin-bottom:1em; }
.msg-body p:last-of-type{ margin-bottom:0; }
.msg-sign{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line);
  font-family:var(--serif); font-size:17px; color:var(--ink); }
@media(max-width:900px){ .msg-grid{ grid-template-columns:1fr; gap:26px; }
  .msg-head img{ width:70px; height:70px; } }

/* ---------- registration dialog ---------- */
.modal{ position:fixed; inset:0; z-index:200; display:none; }
.modal.is-open{ display:block; }
.modal-back{ position:absolute; inset:0; background:rgba(20,10,8,.62); backdrop-filter:blur(3px);
  animation:mfade .25s ease; }
.modal-panel{ position:relative; z-index:2; background:var(--white); width:min(680px,calc(100% - 32px));
  margin:min(6vh,60px) auto; border-radius:var(--r); box-shadow:0 40px 90px -30px rgba(20,8,8,.7);
  max-height:88vh; overflow:auto; animation:mrise .3s ease; }
@keyframes mfade{ from{opacity:0} to{opacity:1} }
@keyframes mrise{ from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none} }
@media(prefers-reduced-motion:reduce){ .modal-back,.modal-panel{ animation:none; } }
.modal-head{ background:linear-gradient(135deg,var(--red-deep),var(--red)); color:#fff;
  padding:26px 30px; position:relative; }
.modal-head h3{ color:#fff; font-size:25px; margin:0 40px 5px 0; }
.modal-head p{ margin:0; color:var(--gold-lt); font-size:13px; }
.modal-x{ position:absolute; top:18px; right:18px; width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(255,255,255,.45); background:none; color:#fff; font-size:20px;
  line-height:1; cursor:pointer; transition:.2s; }
.modal-x:hover{ background:rgba(255,255,255,.18); }
.modal-body{ padding:28px 30px 32px; }
.modal-body .cf-row{ gap:16px; }
.modal-note{ font-size:12.5px; color:var(--body-c); margin:16px 0 0; }
.modal-ok{ padding:44px 30px 52px; text-align:center; }
.modal-ok h4{ font-family:var(--serif); font-size:24px; color:var(--red); margin-bottom:10px; }
body.modal-lock{ overflow:hidden; }


/* ---------- segmented toggle nav (mandir) ---------- */
.segnav{ display:inline-flex; align-items:center; gap:4px; padding:5px; margin-left:auto;
  background:var(--cream-2); border:1px solid var(--line); border-radius:999px; }
.seg{ display:inline-block; border:0; background:none; font-family:var(--sans); cursor:pointer;
  padding:11px 21px; border-radius:999px; font-size:12.5px; font-weight:600; letter-spacing:.06em;
  text-transform:uppercase; color:var(--body-c); white-space:nowrap; line-height:1;
  transition:background .22s ease, color .22s ease, box-shadow .22s ease; }
.seg:hover,.seg:focus-visible{ background:rgba(142,27,34,.10); color:var(--red); outline:none; }
.seg.is-on{ background:var(--white); color:var(--red); box-shadow:0 2px 9px rgba(36,26,22,.18); }
.seg.is-on:hover{ background:var(--white); }
.seg .ext{ font-size:9px; margin-left:5px; opacity:.55; }
@media(max-width:1080px){ .seg{ padding:10px 16px; font-size:11.5px; } }
@media(max-width:860px){
  /* the toggle stays on phones rather than collapsing to a drawer */
  .head-row{ flex-wrap:wrap; gap:12px; row-gap:10px; }
  .brand.wordmark{ flex:1 1 auto; }
  .segnav{ order:3; flex:1 0 100%; margin:0 0 4px; overflow-x:auto; justify-content:flex-start;
    -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .segnav::-webkit-scrollbar{ display:none; }
  .seg{ padding:10px 15px; font-size:11px; letter-spacing:.04em; }
}

/* ---------- main site: event cards from the live archive ---------- */
.feat-event{ display:grid; grid-template-columns:1.05fr 1fr; gap:44px; align-items:center; }
.feat-event .shloka{ font-family:var(--serif); font-size:clamp(17px,1.9vw,21px); color:var(--red);
  line-height:1.6; margin-bottom:18px; padding-left:16px; border-left:3px solid var(--gold); }
.feat-event .feat-pic{ border-radius:var(--r); overflow:hidden; border:2px solid rgba(201,150,47,.5);
  box-shadow:var(--shadow); }
.feat-event .feat-pic img{ width:100%; display:block; aspect-ratio:4/3; object-fit:cover; }
.feat-meta{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 24px; }
.feat-meta span{ font-size:12px; letter-spacing:.05em; padding:8px 14px; border-radius:999px;
  background:var(--cream-2); color:var(--red-deep); border:1px solid rgba(201,150,47,.4); }
@media(max-width:900px){ .feat-event{ grid-template-columns:1fr; gap:26px; }
  .feat-event .feat-pic{ order:-1; } }

.arch-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.arch-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow);
  transition:transform .3s ease, box-shadow .3s ease; }
.arch-card:hover{ transform:translateY(-5px); box-shadow:0 28px 52px -30px rgba(36,26,22,.5); }
.arch-card .arch-img{ aspect-ratio:16/10; overflow:hidden; }
.arch-card .arch-img img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s ease; }
.arch-card:hover .arch-img img{ transform:scale(1.06); }
.arch-body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.arch-year{ font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; color:var(--gold);
  text-transform:uppercase; margin-bottom:7px; }
.arch-body h3{ font-size:19px; color:var(--red); margin-bottom:8px; }
.arch-body p{ font-size:13.5px; margin:0; }
@media(max-width:980px){ .arch-grid{ grid-template-columns:repeat(2,1fr); gap:20px; } }
@media(max-width:620px){ .arch-grid{ grid-template-columns:1fr; } }


/* ============================================================
   SITE SWITCHER + FULL MENU WITH DROPDOWNS
   ============================================================ */
.switchbar{ background:var(--red-deep); }
.switchbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:7px 0; }
.switchbar .sb-tag{ color:rgba(243,226,192,.75); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; white-space:nowrap; }
.sb-nav{ display:inline-flex; align-items:center; gap:3px; padding:3px;
  background:rgba(255,255,255,.10); border-radius:999px; }
.sb-nav a{ padding:7px 15px; border-radius:999px; font-size:11px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.82);
  white-space:nowrap; transition:background .2s ease, color .2s ease; }
.sb-nav a:hover{ background:rgba(255,255,255,.16); color:#fff; }
.sb-nav a.is-on{ background:var(--gold); color:var(--red-deep); }
@media(max-width:860px){
  .switchbar .wrap{ justify-content:center; padding:6px 0; }
  .switchbar .sb-tag{ display:none; }
  .sb-nav{ width:100%; overflow-x:auto; justify-content:flex-start; scrollbar-width:none; }
  .sb-nav::-webkit-scrollbar{ display:none; }
  .sb-nav a{ padding:7px 12px; font-size:10px; }
}

.mainnav{ display:flex; align-items:center; flex:1 1 auto; justify-content:flex-end; gap:1px;
  min-width:0; }
.mainnav .mi{ position:relative; }
.mainnav > .mi > a,.mainnav > .mi > button{ display:flex; align-items:center; gap:5px;
  font-family:var(--sans); background:none; border:0; cursor:pointer; padding:11px 12px;
  border-radius:6px; font-size:11.5px; font-weight:600; letter-spacing:.045em;
  text-transform:uppercase; color:var(--ink); white-space:nowrap; transition:.18s; }
.mainnav > .mi > a:hover,.mainnav > .mi > button:hover,
.mainnav > .mi:hover > a,.mainnav > .mi:hover > button{ color:var(--red); }
.mainnav > .mi > .is-here{ color:var(--red); }
.mainnav > .mi > .is-here::after{ content:""; position:absolute; left:12px; right:12px; bottom:4px;
  height:2px; background:var(--red); border-radius:2px; }
.mi .caret{ width:8px; height:8px; flex:none; transition:transform .2s ease; }
.mi:hover .caret{ transform:rotate(180deg); }

.submenu{ position:absolute; top:100%; left:0; min-width:236px; padding:8px; margin:0;
  list-style:none; background:var(--white); border:1px solid var(--line); border-radius:10px;
  box-shadow:0 24px 46px -22px rgba(36,26,22,.45); opacity:0; visibility:hidden;
  transform:translateY(8px); transition:opacity .2s ease, transform .2s ease, visibility .2s;
  z-index:80; }
.mi:hover .submenu,.mi:focus-within .submenu{ opacity:1; visibility:visible; transform:none; }
.submenu a{ display:block; padding:10px 13px; border-radius:6px; font-size:13px;
  color:var(--body-c); transition:.16s; }
.submenu a:hover{ background:var(--cream-2); color:var(--red); }
@media(max-width:1180px){ .mainnav > .mi > a,.mainnav > .mi > button{ padding:11px 9px;
  font-size:11px; letter-spacing:.02em; } .submenu{ min-width:210px; } }
@media(max-width:1040px){ .mainnav{ display:none; } .burger{ display:block; margin-left:auto; } }

/* mobile drawer with groups */
.mnav .mgroup{ padding:6px 0 4px; }
.mnav .mgroup > b{ display:block; font-family:var(--mono); font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--gold); padding:10px 4px 4px; }
.mnav .mgroup a{ padding-left:16px; }

/* ---------- team ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.team-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; text-align:center; box-shadow:var(--shadow); transition:transform .3s ease; }
.team-card:hover{ transform:translateY(-5px); }
.team-card img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.team-body{ padding:18px 16px 22px; }
.team-body h3{ font-size:17px; color:var(--ink); margin-bottom:4px; }
.team-body p{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--red);
  margin:0; }
@media(max-width:900px){ .team-grid{ grid-template-columns:repeat(2,1fr); gap:18px; } }
@media(max-width:480px){ .team-grid{ grid-template-columns:1fr; } }

/* ---------- awards / certification / recognition ---------- */
.cert-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cert-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  padding:28px 26px 30px; box-shadow:var(--shadow); }
.cert-ico{ width:52px; height:52px; border-radius:12px; display:grid; place-items:center;
  background:var(--cream-2); color:var(--red); margin-bottom:16px; }
.cert-ico svg{ width:25px; height:25px; }
.cert-card h3{ font-size:19px; color:var(--red); margin-bottom:8px; }
.cert-card p{ font-size:14px; margin:0 0 12px; }
.cert-meta{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--gold);
  text-transform:uppercase; margin:0; }
@media(max-width:900px){ .cert-grid{ grid-template-columns:1fr; } }

/* ---------- media coverage ---------- */
.media-list{ display:flex; flex-direction:column; gap:16px; }
.media-row{ display:grid; grid-template-columns:120px 1fr auto; gap:22px; align-items:center;
  background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  padding:20px 24px; transition:.25s; }
.media-row:hover{ border-color:rgba(201,150,47,.7); box-shadow:var(--shadow); }
.media-date{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--gold);
  text-transform:uppercase; }
.media-row h3{ font-size:17px; color:var(--ink); margin-bottom:4px; }
.media-row p{ font-size:13.5px; margin:0; }
.media-src{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--red);
  white-space:nowrap; }
@media(max-width:760px){ .media-row{ grid-template-columns:1fr; gap:8px; } }

/* ---------- objective / plan / detail blocks ---------- */
.obj-list{ counter-reset:obj; display:grid; gap:18px; }
.obj-item{ counter-increment:obj; position:relative; padding:22px 26px 24px 74px;
  background:var(--white); border:1px solid var(--line); border-radius:var(--r); }
.obj-item::before{ content:counter(obj,decimal-leading-zero); position:absolute; left:26px; top:22px;
  font-family:var(--serif); font-size:24px; color:var(--gold); font-weight:700; }
.obj-item h3{ font-size:18px; color:var(--red); margin-bottom:6px; }
.obj-item p{ font-size:14.5px; margin:0; }
.plan-table{ width:100%; border-collapse:collapse; background:var(--white);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.plan-table th,.plan-table td{ padding:14px 18px; text-align:left; font-size:14px;
  border-bottom:1px solid var(--line); }
.plan-table th{ background:var(--cream-2); font-family:var(--mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--red-deep); }
.plan-table tr:last-child td{ border-bottom:0; }
.plan-table td:first-child{ font-weight:600; color:var(--ink); }
@media(max-width:640px){ .plan-table th,.plan-table td{ padding:11px 12px; font-size:13px; } }


/* ---------- header overflow: long menus get their own row ---------- */
/* the wordmark must never be squeezed under the menu */
.brand.wordmark{ flex:0 0 auto; }
.head-row{ flex-wrap:wrap; }

@media(min-width:1041px) and (max-width:1320px){
  .mainnav > .mi > a,.mainnav > .mi > button{ padding:11px 8px; font-size:10.5px;
    letter-spacing:.01em; }
}

/* Charity carries ten items — too many to sit beside the wordmark at any width,
   so its menu drops to a full-width second row and centres itself. */
header.site.nav-wide .mainnav{ flex:1 0 100%; justify-content:center; margin-top:4px;
  padding-top:6px; border-top:1px solid var(--line); }
header.site.nav-wide .head-row{ padding-bottom:4px; }
@media(min-width:1041px){
  header.site.nav-wide .mainnav > .mi > a,
  header.site.nav-wide .mainnav > .mi > button{ padding:10px 13px; font-size:11.5px;
    letter-spacing:.045em; }
  header.site.nav-wide .submenu{ left:50%; transform:translateX(-50%) translateY(8px); }
  header.site.nav-wide .mi:hover .submenu,
  header.site.nav-wide .mi:focus-within .submenu{ transform:translateX(-50%); }
}
@media(max-width:1040px){
  header.site.nav-wide .mainnav{ border-top:0; margin-top:0; padding-top:0; }
}


/* nine or more menu items: one row still, just tighter */
@media(min-width:1041px){
  header.site.nav-tight .mainnav > .mi > a,
  header.site.nav-tight .mainnav > .mi > button{ padding:11px 9px; font-size:11px;
    letter-spacing:.02em; }
  header.site.nav-tight .brand.wordmark .wm-main{ font-size:clamp(20px,2.1vw,27px); }
  header.site.nav-tight .head-row{ gap:14px; }
}


/* ============================================================
   FOUR DIFFERENT HEROES — one per site
   ============================================================ */

/* --- MANDIR: still photograph, copy left (no video, no controls) --- */
.hero.hero-still .hero-media img{ width:100%; height:100%; object-fit:cover; display:block; }

/* --- MAIN: full-bleed photograph, everything centred --- */
.hero-center{ position:relative; overflow:hidden; background:#2A0F0F; z-index:1; }
.hero-center .hc-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:.55; }
.hero-center::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 42%,rgba(94,17,19,.30) 0%,rgba(30,10,10,.82) 72%); }
.hero-center .wrap{ position:relative; z-index:2; text-align:center;
  padding:110px 0 120px; }
.hc-kick{ font-family:var(--mono); font-size:11px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold-lt); margin:0 0 20px; }
.hero-center h1{ color:#fff; font-size:clamp(36px,5.4vw,66px); line-height:1.06; margin:0 auto;
  max-width:16ch; }
.hero-center h1 em{ font-style:italic; color:var(--gold-lt); }
.hc-sub{ color:rgba(255,255,255,.86); font-size:18px; margin:20px auto 0; max-width:52ch; }
.hc-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:34px; }
.hc-chips a{ display:inline-flex; align-items:center; gap:9px; padding:14px 26px;
  border-radius:999px; border:1px solid rgba(243,226,192,.45); color:#fff; font-size:12.5px;
  font-weight:600; letter-spacing:.12em; text-transform:uppercase; transition:.24s; }
.hc-chips a:hover{ background:var(--gold); border-color:var(--gold); color:var(--red-deep);
  transform:translateY(-3px); }
.hc-chips a.solid{ background:var(--red); border-color:var(--red); }
.hc-chips a.solid:hover{ background:var(--gold); border-color:var(--gold); }
@media(max-width:700px){ .hero-center .wrap{ padding:72px 0 78px; } .hc-sub{ font-size:16px; }
  .hc-chips a{ padding:12px 18px; font-size:11px; } }

/* --- CULTURAL: red panel left, photo mosaic right --- */
.hero-split{ background:linear-gradient(135deg,var(--red-deep),var(--red-mid) 60%,var(--red));
  position:relative; overflow:hidden; z-index:1; }
.hero-split::before{ content:""; position:absolute; inset:0; opacity:.2; pointer-events:none;
  background:radial-gradient(circle at 8% 10%,var(--gold-lt) 0%,transparent 38%),
             radial-gradient(circle at 92% 90%,var(--gold-lt) 0%,transparent 40%); }
.hs-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:52px;
  align-items:center; padding:78px 0 84px; }
.hs-copy .hc-kick{ margin-bottom:16px; }
.hs-copy h1{ color:#fff; font-size:clamp(34px,4.6vw,56px); line-height:1.07; }
.hs-copy h1 em{ font-style:italic; color:var(--gold-lt); }
.hs-copy p{ color:rgba(255,255,255,.88); font-size:17px; margin:18px 0 30px; max-width:44ch; }
.hs-btns{ display:flex; flex-wrap:wrap; gap:12px; }
.hs-mosaic{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:14px;
  aspect-ratio:1/.92; }
.hs-mosaic img{ width:100%; height:100%; object-fit:cover; border-radius:14px;
  border:2px solid rgba(243,226,192,.42); box-shadow:0 20px 44px -22px rgba(0,0,0,.7); }
.hs-mosaic img:nth-child(1){ grid-row:span 2; }
.hs-mosaic img:nth-child(2){ margin-top:22px; }
.hs-mosaic img:nth-child(3){ margin-bottom:22px; }
@media(max-width:900px){
  .hs-grid{ grid-template-columns:1fr; gap:34px; padding:56px 0 62px; }
  .hs-mosaic{ aspect-ratio:1/.6; }
  .hs-mosaic img:nth-child(2),.hs-mosaic img:nth-child(3){ margin:0; }
}

/* --- CHARITY: cream, copy left, framed photo right, stat strip beneath --- */
.hero-offset{ background:var(--cream); position:relative; overflow:hidden; z-index:1; }
.hero-offset::before{ content:""; position:absolute; right:-160px; top:-160px; width:560px;
  height:560px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(201,150,47,.20) 0%,transparent 66%); }
.ho-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:54px;
  align-items:center; padding:72px 0 44px; }
.ho-copy .hc-kick{ color:var(--red); margin-bottom:14px; }
.ho-copy h1{ font-size:clamp(34px,4.6vw,56px); line-height:1.07; color:var(--ink); }
.ho-copy h1 span{ color:var(--red); display:block; }
.ho-copy p{ font-size:17.5px; margin:20px 0 30px; max-width:46ch; }
.ho-btns{ display:flex; flex-wrap:wrap; gap:12px; }
.ho-pic{ position:relative; }
.ho-pic img{ width:100%; aspect-ratio:4/3.2; object-fit:cover; border-radius:var(--r);
  border:3px solid var(--white); box-shadow:0 34px 64px -30px rgba(36,26,22,.6); }
.ho-pic::after{ content:""; position:absolute; inset:18px -18px -18px 18px; z-index:-1;
  border:2px solid var(--gold); border-radius:var(--r); }
.ho-stats{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:rgba(201,150,47,.4); border:1px solid rgba(201,150,47,.4);
  border-radius:var(--r); overflow:hidden; margin-bottom:56px; }
.ho-stat{ background:var(--white); padding:24px 26px; text-align:center; }
.ho-stat b{ display:block; font-family:var(--serif); font-size:clamp(24px,3vw,34px);
  color:var(--red); line-height:1; }
.ho-stat span{ display:block; font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--body-c); margin-top:8px; }
@media(max-width:900px){
  .ho-grid{ grid-template-columns:1fr; gap:32px; padding:52px 0 32px; }
  .ho-pic{ order:-1; } .ho-pic::after{ display:none; }
  .ho-stats{ grid-template-columns:1fr; margin-bottom:40px; }
}

/* slim link strip used instead of the emblem band on cultural + charity */
.brandband.bandstrip{ padding:0; }
.brandband.bandstrip .wrap{ padding:16px 0; }
.brandband.bandstrip .bb-nav{ justify-content:center; }
.brandband.bandstrip::before{ height:4px; }


/* ============================================================
   MAIN SITE HEADER — logo in the top bar, menu centred below
   ============================================================ */
.switchbar.sb-brand .wrap{ padding:12px 0; }
.sb-logo{ display:flex; align-items:center; gap:12px; flex:none; }
.sb-logo img{ height:52px; width:auto; filter:drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
.sb-logo span{ display:block; line-height:1.1; }
.sb-logo b{ display:block; font-family:var(--serif); font-weight:700; color:#fff;
  font-size:22px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.sb-logo i{ display:block; font-style:normal; font-size:9px; letter-spacing:.17em;
  text-transform:uppercase; color:var(--gold-lt); margin-top:4px; white-space:nowrap; }

header.site.nav-center .head-row{ justify-content:center; padding:6px 0; }
.mainnav.center{ justify-content:center; flex:1 1 auto; gap:2px; }
@media(min-width:1041px){
  .mainnav.center > .mi > a,.mainnav.center > .mi > button{ padding:13px 16px; font-size:12px;
    letter-spacing:.06em; }
  .mainnav.center .submenu{ left:50%; transform:translateX(-50%) translateY(8px); }
  .mainnav.center .mi:hover .submenu,
  .mainnav.center .mi:focus-within .submenu{ transform:translateX(-50%); }
}
@media(max-width:860px){
  .switchbar.sb-brand .wrap{ flex-direction:column; gap:10px; padding:12px 0 10px; }
  .sb-logo img{ height:44px; }
  .sb-logo b{ font-size:19px; }
}
@media(max-width:1040px){ header.site.nav-center .head-row{ justify-content:flex-end; } }

/* wider prose block on the main site */
.about-brief.wide{ max-width:1120px; }
.about-brief.wide .lead{ font-size:20px; }

/* upcoming-event slideshow */
.feat-pic{ position:relative; }
.feat-pic .fslide{ position:absolute; inset:0; opacity:0; transition:opacity .8s ease; }
.feat-pic .fslide.is-on{ opacity:1; position:relative; }
.feat-pic .fslide img{ width:100%; display:block; aspect-ratio:4/3; object-fit:cover; }
.feat-dots{ position:absolute; left:0; right:0; bottom:12px; z-index:3; display:flex;
  justify-content:center; gap:7px; }
.feat-dots button{ width:8px; height:8px; padding:0; border-radius:50%; cursor:pointer;
  border:1px solid rgba(255,255,255,.85); background:rgba(0,0,0,.25); transition:.2s; }
.feat-dots button.is-on{ background:var(--gold); border-color:var(--gold); width:22px;
  border-radius:999px; }

/* support block: appeal card beside the two actions */
.support-grid{ display:grid; grid-template-columns:1.05fr 1fr 1fr; gap:26px; align-items:stretch; }
.support-grid .appeal{ margin:0; max-width:none; }
.support-grid .act-card{ box-shadow:0 20px 44px -26px rgba(36,26,22,.5); }
.support-grid .act-card.gold,.support-grid .act-card.cream{ display:flex; flex-direction:column; }
.support-grid .act-card .act-go{ margin-top:auto; }
@media(max-width:1060px){ .support-grid{ grid-template-columns:1fr 1fr; }
  .support-grid .appeal{ grid-column:1 / -1; max-width:520px; margin-inline:auto; } }
@media(max-width:720px){ .support-grid{ grid-template-columns:1fr; }
  .support-grid .appeal{ grid-column:auto; } }


/* --- MAIN: plain banner, full picture, no overlay and no copy --- */
.hero-banner{ position:relative; z-index:1; line-height:0; background:#2A0F0F; }
.hero-banner .hb-img{ width:100%; height:clamp(320px,42vw,560px); object-fit:cover;
  object-position:center; display:block; }
@media(max-width:600px){ .hero-banner .hb-img{ height:230px; } }


/* slideshow moves to the left, dots sit under the images where they can be seen */
.feat-event{ grid-template-columns:1fr 1.05fr; }
.feat-event .feat-pic{ border:0; border-radius:0; box-shadow:none; overflow:visible; }
.feat-stage{ position:relative; border-radius:var(--r); overflow:hidden;
  border:2px solid rgba(201,150,47,.5); box-shadow:var(--shadow); }
.feat-dots{ position:static; margin-top:16px; }
.feat-dots button{ border:1px solid rgba(142,27,34,.45); background:rgba(142,27,34,.14); }
.feat-dots button:hover{ background:rgba(142,27,34,.3); }
.feat-dots button.is-on{ background:var(--red); border-color:var(--red); }
@media(max-width:900px){
  .feat-event{ grid-template-columns:1fr; }
  .feat-event .feat-pic{ order:0; }
}


/* ============================================================
   2026-09 REBUILD — client layout: red two-tier header with the
   emblem centred, saree zigzag edges, stats band, Mission Mandir
   band, social welfare, media, red footer.
   ============================================================ */
:root{ --mp-red:#9B1D24; --mp-deep:#6A1418; --mh-top:68px; --mh-nav:46px; }

/* ---------- zigzag edges (red / deep / cream fill, gold rim) ---------- */
.teeth-dn-red{ position:relative; }
.teeth-dn-red::after,.opt-b .says-band.teeth-dn-red::after{ content:""; position:absolute; inset:auto 0 -15px 0; height:16px; z-index:5; opacity:1;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 0 L15 13 L30 0 Z' fill='%239B1D24'/%3E%3Cpath d='M0 0 L15 13 L30 0' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left top/30px 16px; }
.teeth-up-red{ position:relative; }
.teeth-up-red::before{ content:""; position:absolute; inset:-15px 0 auto 0; height:16px; z-index:5;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 16 L15 3 L30 16 Z' fill='%239B1D24'/%3E%3Cpath d='M0 16 L15 3 L30 16' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left bottom/30px 16px; }
.teeth-dn-deep{ position:relative; }
.teeth-dn-deep::after,.opt-b .says-band.teeth-dn-deep::after{ content:""; position:absolute; inset:auto 0 -15px 0; height:16px; z-index:5; opacity:1;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 0 L15 13 L30 0 Z' fill='%236A1418'/%3E%3Cpath d='M0 0 L15 13 L30 0' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left top/30px 16px; }
.teeth-up-deep{ position:relative; }
.teeth-up-deep::before{ content:""; position:absolute; inset:-15px 0 auto 0; height:16px; z-index:5;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 16 L15 3 L30 16 Z' fill='%236A1418'/%3E%3Cpath d='M0 16 L15 3 L30 16' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left bottom/30px 16px; }
.teeth-dn-cream{ position:relative; }
.teeth-dn-cream::after,.opt-b .says-band.teeth-dn-cream::after{ content:""; position:absolute; inset:auto 0 -15px 0; height:16px; z-index:5; opacity:1;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 0 L15 13 L30 0 Z' fill='%23FBF5EA'/%3E%3Cpath d='M0 0 L15 13 L30 0' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left top/30px 16px; }
.teeth-up-cream{ position:relative; }
.teeth-up-cream::before{ content:""; position:absolute; inset:-15px 0 auto 0; height:16px; z-index:5;
  pointer-events:none; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 16 L15 3 L30 16 Z' fill='%23FBF5EA'/%3E%3Cpath d='M0 16 L15 3 L30 16' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left bottom/30px 16px; }
/* ---------- HEADER ---------- */
.topline{ display:none; }
header.site.mp-head{ position:sticky; top:calc(var(--mh-top) * -1); z-index:70; background:transparent;
  box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
.mh-top{ background:var(--mp-red); height:var(--mh-top); }
.mh-top-row{ height:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.mh-word{ display:flex; align-items:center; gap:12px; min-width:0; }
.mh-word img{ display:none; height:50px; width:auto; flex:none; filter:drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
.mh-word span{ display:block; min-width:0; }
.mh-word b{ display:block; font-family:var(--serif); font-weight:700; color:#fff; font-size:30px;
  letter-spacing:.05em; text-transform:uppercase; line-height:1; white-space:nowrap; }
.mh-word i{ display:block; font-style:normal; font-size:9.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold-lt); margin-top:7px; white-space:nowrap; }
.mh-sites{ display:flex; gap:10px; }
.mh-sites a{ padding:7px 18px; border-radius:999px; border:1.5px solid rgba(243,226,192,.7); color:#fff;
  font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; line-height:1.3; transition:.18s; }
.mh-sites a:hover,.mh-sites a:focus-visible{ background:var(--gold-lt); border-color:var(--gold-lt); color:var(--red-deep); }

.mh-nav{ background:var(--mp-deep); position:relative; }
.mh-nav::after{ content:""; position:absolute; inset:auto 0 -15px 0; height:16px; z-index:4; pointer-events:none;
  background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='16' viewBox='0 0 30 16'%3E%3Cpath d='M0 0 L15 13 L30 0 Z' fill='%236A1418'/%3E%3Cpath d='M0 0 L15 13 L30 0' fill='none' stroke='%23C9962F' stroke-width='2'/%3E%3C/svg%3E") repeat-x left top/30px 16px; }
.mh-menu{ display:grid; grid-template-columns:1fr 210px 1fr; align-items:center; height:var(--mh-nav); }
.mh-l{ grid-column:1; justify-self:end; }
.mh-r{ grid-column:3; justify-self:start; }
.mh-group{ display:flex; align-items:center; }
.mh-group .mi{ position:relative; display:flex; align-items:center; }
.mh-group .mi + .mi::before{ content:""; width:1px; height:12px; background:rgba(237,201,140,.45); }
.mh-group .mi > a,.mh-group .mi > button{ display:flex; align-items:center; gap:6px; position:relative;
  padding:13px 16px; font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.09em;
  text-transform:uppercase; color:#F6E7D6; background:none; border:0; cursor:pointer; line-height:1.2;
  white-space:nowrap; transition:color .18s; }
.mh-group .mi > a:hover,.mh-group .mi > button:hover,.mh-group .mi:hover > button{ color:var(--gold-lt); }
.mh-group .mi > .is-here{ color:var(--gold-lt); }
.mh-group .mi > .is-here::after{ content:""; position:absolute; left:16px; right:16px; bottom:6px; height:2px;
  background:var(--gold); border-radius:2px; }
.mh-r .submenu{ left:auto; right:0; }

.mh-emblem{ position:absolute; left:50%; top:6px; transform:translateX(-50%); z-index:6; line-height:0;
  transition:top .3s ease; }
.mh-emblem img{ height:172px; width:auto; max-width:none; filter:drop-shadow(0 10px 22px rgba(0,0,0,.45));
  transition:height .3s ease; }
header.site.mp-head.shrink .mh-emblem{ top:calc(var(--mh-top) + 3px); }
header.site.mp-head.shrink .mh-emblem img{ height:68px; }

@media(max-width:1200px){
  .mh-group .mi > a,.mh-group .mi > button{ padding:13px 11px; font-size:11px; letter-spacing:.06em; }
  .mh-group .mi > .is-here::after{ left:11px; right:11px; }
  .mh-menu{ grid-template-columns:1fr 190px 1fr; }
  .mh-emblem img{ height:140px; }
  .mh-word b{ font-size:26px; }
}
@media(max-width:1040px){
  header.site.mp-head{ top:0; }
  .mh-emblem{ display:none; }
  .mh-menu{ display:none; }
  .mh-nav{ height:6px; }
  .mh-word img{ display:block; }
  .mh-word b{ font-size:22px; }
  .mh-word i{ font-size:8.5px; letter-spacing:.18em; margin-top:5px; }
  .mh-sites{ margin-left:auto; }
  .mh-top-row .burger{ display:block; margin-left:4px; background:transparent; color:#fff;
    border-color:rgba(243,226,192,.6); }
  header.site.mp-head .mnav{ padding-top:26px; box-shadow:0 20px 30px -24px rgba(36,26,22,.6); }
}
@media(max-width:640px){
  :root{ --mh-top:62px; }
  .mh-sites{ display:none; }
  .mh-top-row .burger{ margin-left:auto; }
  .mh-word img{ height:44px; }
  .mh-word b{ font-size:19px; }
}
@media(max-width:360px){ .mh-word i{ display:none; } }

/* ---------- HERO + STATS ---------- */
.mp-hero{ position:relative; line-height:0; background:#2A0F0F; border-bottom:4px solid var(--gold); }
.mp-hero img{ width:100%; height:clamp(340px,40vw,640px); object-fit:cover; object-position:center 30%; }
@media(max-width:600px){ .mp-hero img{ height:260px; } }

.mp-stats{ background:var(--mp-red); color:#fff; padding:36px 0 40px; z-index:3; }
.mp-stats-row{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); }
.mp-stats-row li{ position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; }
.mp-stats-row li + li::before{ content:""; position:absolute; left:0; top:12%; bottom:12%; width:1px;
  background:rgba(237,201,140,.35); }
.mp-stats-row b{ font-family:var(--serif); font-weight:700; color:#fff; line-height:1;
  font-size:clamp(38px,5vw,64px); font-variant-numeric:lining-nums; }
.mp-stats-row span{ margin-top:10px; font-size:13px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-lt); }
@media(max-width:560px){ .mp-stats{ padding:26px 0 30px; } .mp-stats-row span{ font-size:10.5px; letter-spacing:.08em; } }

/* sections that sit under a zigzag need a little more headroom */
.mp-about,.mp-acts,.mp-upcoming,.mp-welfare,.mp-media{ padding-top:96px; }
.mp-works{ padding-bottom:96px; }
.mp-acts,.mp-upcoming{ padding-bottom:88px; }
.feat-title{ font-size:clamp(24px,2.7vw,33px); margin-bottom:14px; }

/* ---------- MISSION MANDIR BAND ---------- */
.mp-mission{ z-index:3; color:#F3DED9; padding:92px 0 78px;
  background:
    radial-gradient(600px 340px at 10% 35%,rgba(237,201,140,.12),transparent 70%),
    radial-gradient(600px 340px at 90% 65%,rgba(0,0,0,.14),transparent 70%),
    var(--mp-red); }
.sec-head.on-red h2{ color:#fff; }
.sec-head.on-red .orn::before,.sec-head.on-red .orn::after,
.says-band .orn::before,.says-band .orn::after{
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='9'%3E%3Cpath d='M0 4.5h44M52 4.5h12' stroke='%23EDC98C' stroke-width='1.2'/%3E%3Cpath d='M48 0l4 4.5-4 4.5-4-4.5z' fill='%23EDC98C'/%3E%3C/svg%3E"); }
.mm-intro{ max-width:780px; margin:14px auto 0 !important; color:#F3DED9 !important; font-size:16.5px !important; line-height:1.75; }
.mm-actions{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.mm-actions .act-card{ display:flex; flex-direction:column; box-shadow:0 26px 50px -30px rgba(0,0,0,.6); }
.mm-actions .act-card .act-go{ margin-top:auto; }
.mm-strip{ list-style:none; margin:34px 0 0; padding:0; display:grid; grid-template-columns:repeat(5,1fr);
  border:1px solid rgba(237,201,140,.3); border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.1)); }
.mm-strip li{ display:flex; align-items:center; justify-content:center; gap:13px; padding:22px 14px; }
.mm-strip li + li{ border-left:1px solid rgba(237,201,140,.24); }
.mm-strip svg{ width:30px; height:30px; flex:none; color:var(--gold-lt); }
.mm-strip b{ display:block; font-family:var(--serif); font-size:25px; color:#fff; line-height:1.1; white-space:nowrap; }
.mm-strip span{ display:block; font-size:12.5px; color:#F3DED9; margin-top:3px; }
@media(max-width:1080px){ .mm-strip{ grid-template-columns:repeat(3,1fr); }
  .mm-strip li:nth-child(4){ border-left:0; }
  .mm-strip li:nth-child(n+4){ border-top:1px solid rgba(237,201,140,.24); } }
@media(max-width:760px){ .mm-actions{ grid-template-columns:1fr; gap:20px; }
  .mm-strip{ grid-template-columns:1fr 1fr; }
  .mm-strip li{ justify-content:flex-start; }
  .mm-strip li:nth-child(n){ border-left:0; border-top:1px solid rgba(237,201,140,.24); }
  .mm-strip li:nth-child(-n+2){ border-top:0; }
  .mm-strip li:nth-child(even){ border-left:1px solid rgba(237,201,140,.24); }
  .mm-strip li:last-child{ grid-column:1 / -1; justify-content:center; border-left:0; } }
@media(max-width:400px){ .mm-strip b{ font-size:21px; } .mm-strip li{ gap:10px; padding:18px 12px; } }

/* ---------- HOW IT WORKS / IMPACT / APPEAL ---------- */
.mw-grid{ display:grid; grid-template-columns:1.55fr 1fr .95fr; gap:40px; align-items:start; }
.mw-h{ font-size:clamp(22px,2.2vw,27px); margin-bottom:28px; }
ol.steps{ list-style:none; margin:0; padding:0; }
.mp-works .appeal{ margin:0; }
@media(max-width:1180px){ .mw-grid{ grid-template-columns:1fr 1fr; }
  .mp-works .appeal{ grid-column:1 / -1; max-width:560px; width:100%; margin-inline:auto; } }
@media(max-width:860px){ .mw-grid{ grid-template-columns:1fr; gap:48px; }
  .mp-works .appeal{ grid-column:auto; } }

/* ---------- WELFARE + MEDIA CARDS ---------- */
.sw-intro{ max-width:800px; margin:10px auto 0 !important; line-height:1.75; }
.mp-welfare .arch-img,.mp-media .arch-img{ aspect-ratio:4/3; }
.mp-welfare .arch-img img,.mp-media .arch-img img{ object-position:center top; }
.mp-media a.arch-card:hover h3{ text-decoration:underline; text-underline-offset:3px; }
.mt-cta{ margin-top:38px; }
.mp-follow{ margin:42px auto 0; display:flex; align-items:center; justify-content:center; gap:14px 20px;
  flex-wrap:wrap; }
.mp-follow > p{ margin:0; font-family:var(--serif); font-size:18px; color:var(--ink); }
.mp-follow-links{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.mp-follow-links a{ display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px;
  border:1px solid var(--line); background:var(--cream); color:var(--ink); font-size:13.5px; font-weight:600;
  transition:.18s; }
.mp-follow-links a svg{ width:16px; height:16px; color:var(--red); transition:.18s; }
.mp-follow-links a:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.mp-follow-links a:hover svg{ color:#fff; }
.mp-follow-links a.mf-all{ background:none; border-color:transparent; color:var(--red); text-decoration:underline;
  text-underline-offset:3px; }
.mp-follow-links a.mf-all:hover{ background:none; color:var(--red-deep); }

/* ---------- TESTIMONIALS on flat red (edges must match the zigzag) ---------- */
.opt-b .says-band.teeth-up-red,.says-band.teeth-up-red{ z-index:3; padding:92px 0 84px;
  background:
    radial-gradient(520px 300px at 85% 40%,rgba(237,201,140,.12),transparent 70%),
    var(--mp-red); }
.says-band h2{ color:#fff; }

/* ---------- NEWSLETTER + FOOTER ---------- */
.news{ border-top:5px solid var(--mp-deep); }
.news-row{ padding:32px 0 50px; }

footer.site.mp-foot{ background:none; padding:0; color:#F3DED9; }
.mf-main{ background:var(--mp-red); z-index:3; }
.mf-grid{ grid-template-columns:1.1fr 1fr 1fr 1.3fr .9fr; gap:0; padding:62px 0 54px; }
.mf-grid > div{ padding:4px 28px; }
.mf-grid > div:first-child{ padding-left:0; }
.mf-grid > div:last-child{ padding-right:0; }
.mf-grid > div + div{ border-left:1px solid rgba(237,201,140,.3); }
.mf-brand{ text-align:center; }
.mf-brand img{ height:176px; width:auto; margin:0 auto 14px; }
.mf-brand p{ font-size:13px; margin:0 auto; max-width:26ch; color:#F3DED9; }
.mp-foot .foot-grid h5{ color:var(--gold-lt); }
.mp-foot .foot-grid h5::after{ background:var(--gold); }
.mp-foot .foot-grid h5.mf-gap{ margin-top:26px; }
.mp-foot .foot-grid a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.mp-foot .f-contact svg{ color:var(--gold-lt); }
.mp-foot .socials a{ background:rgba(255,255,255,.1); border-color:rgba(243,226,192,.35); color:#fff; }
.mp-foot .socials a:hover{ background:var(--gold-lt); border-color:var(--gold-lt); color:var(--red-deep); text-decoration:none; }
.mf-note{ font-size:12.5px; margin:12px 0 0; }
.mf-base{ background:#1E1512; color:#B5A69F; padding:34px 0 24px; }
.mf-base .foot-base{ border-top:0; padding-top:0; }
@media(max-width:1100px){
  .mf-grid{ grid-template-columns:repeat(4,1fr); row-gap:36px; }
  .mf-brand{ grid-column:1 / -1; }
  .mf-grid > div:first-child{ padding:0; }
  .mf-grid > div:nth-child(2){ border-left:0; padding-left:0; }
}
@media(max-width:760px){
  .mf-grid{ grid-template-columns:1fr 1fr; }
  .mf-grid > div{ padding:0 0 0 22px; }
  .mf-grid > div:nth-child(2),.mf-grid > div:nth-child(4){ border-left:0; padding-left:0; }
}
@media(max-width:440px){
  .mf-grid{ grid-template-columns:1fr; }
  .mf-grid > div{ padding:0; border-left:0 !important; }
}
.mp-works{ padding-top:96px; }
@media(max-width:760px){ .mp-works .steps .step:last-child{ grid-column:1 / -1; } }

/* ============================================================
   v41 — header site pills, stat counters, follow buttons
   ============================================================ */

/* ---------- header site pills: soft, quiet, icon + label ---------- */
.mh-sites{ gap:8px; }
.mh-sites a{ position:relative; display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px 8px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.08); color:#FFF6EC;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 1px 2px rgba(0,0,0,.18);
  font-family:var(--sans); font-size:13.5px; font-weight:500; letter-spacing:.01em;
  text-transform:none; line-height:1.2;
  transition:background .22s ease, color .22s ease, border-color .22s ease,
             box-shadow .22s ease, transform .22s ease, padding .22s ease; }
.mh-sites .mh-ico{ width:17px; height:17px; flex:none; color:var(--gold-lt); transition:color .22s ease, transform .3s ease; }
.mh-sites .mh-arr{ width:12px; height:12px; flex:none; margin-left:-12px; opacity:0;
  transform:translate(-4px,2px); transition:opacity .22s ease, transform .22s ease, margin .22s ease; }
.mh-sites a:hover,.mh-sites a:focus-visible{ background:#FFF8EF; border-color:#FFF8EF; color:var(--red-deep);
  transform:translateY(-1px); padding-right:12px;
  box-shadow:0 6px 18px -6px rgba(0,0,0,.45), 0 0 0 3px rgba(237,201,140,.28); }
.mh-sites a:hover .mh-ico,.mh-sites a:focus-visible .mh-ico{ color:var(--red); transform:scale(1.08); }
.mh-sites a:hover .mh-arr,.mh-sites a:focus-visible .mh-arr{ margin-left:0; opacity:1; transform:none; }
.mh-sites a:active{ transform:translateY(0) scale(.98); }
.mh-sites a:focus-visible{ outline:none; }
@media(max-width:1200px){ .mh-sites a{ padding:7px 12px 7px 10px; font-size:13px; } }

/* ---------- stat counters: fixed width so the layout never jitters ---------- */
.mp-stats-row b{ font-variant-numeric:tabular-nums lining-nums; }

/* ---------- follow buttons: brand colour sweeps in on hover ---------- */
.mp-follow-links a{ position:relative; overflow:hidden; isolation:isolate; padding:10px 18px 10px 14px;
  background:#fff; border:1px solid var(--line); box-shadow:0 1px 2px rgba(36,26,22,.06);
  transition:color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.mp-follow-links a::before{ content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit;
  background:var(--fl,var(--red)); transform:scaleX(0); transform-origin:left center;
  transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.mp-follow-links a svg{ width:17px; height:17px; color:var(--flc,var(--red));
  transition:color .25s ease, transform .35s cubic-bezier(.3,1.6,.5,1); }
.mp-follow-links a:hover,.mp-follow-links a:focus-visible{ color:#fff; border-color:transparent;
  transform:translateY(-2px); box-shadow:0 12px 24px -12px var(--fls,rgba(142,27,34,.6)); background:#fff; }
.mp-follow-links a:hover::before,.mp-follow-links a:focus-visible::before{ transform:scaleX(1); }
.mp-follow-links a:hover svg,.mp-follow-links a:focus-visible svg{ color:#fff; transform:scale(1.15) rotate(-6deg); }
.mp-follow-links a:active{ transform:translateY(0) scale(.97); }
.mp-follow-links a.fl-fb{ --fl:#1877F2; --flc:#1877F2; --fls:rgba(24,119,242,.55); }
.mp-follow-links a.fl-ig{ --fl:linear-gradient(45deg,#F58529,#DD2A7B 50%,#8134AF); --flc:#DD2A7B; --fls:rgba(221,42,123,.55); }
.mp-follow-links a.fl-yt{ --fl:#FF0000; --flc:#FF0000; --fls:rgba(255,0,0,.45); }

.mp-follow-links a.mf-all{ overflow:visible; background:none; border:0; box-shadow:none; padding:10px 4px;
  text-decoration:none; color:var(--red); gap:6px; }
.mp-follow-links a.mf-all::before{ display:none; }
.mp-follow-links a.mf-all::after{ content:""; position:absolute; left:4px; right:4px; bottom:6px; height:1.5px;
  background:currentColor; transform-origin:left; transition:transform .3s ease; }
.mp-follow-links a.mf-all svg{ width:14px; height:14px; color:currentColor; transition:transform .25s ease; }
.mp-follow-links a.mf-all:hover{ color:var(--red-deep); transform:none; box-shadow:none; background:none; }
.mp-follow-links a.mf-all:hover::after{ transform:scaleX(0); transform-origin:right; }
.mp-follow-links a.mf-all:hover svg{ transform:translateX(4px); color:currentColor; }

@media(prefers-reduced-motion:reduce){
  .mh-sites a,.mp-follow-links a,.mp-follow-links a::before{ transition:none; }
}

/* ============================================================
   v42 — sister sites (Mandir / Cultural / Charity)
   ============================================================ */

/* header call-to-action (Donate on Mandir, New Member elsewhere) */
.mh-top-row .mh-sites{ margin-left:auto; }
.mh-cta{ display:inline-flex; align-items:center; gap:8px; padding:9px 18px 9px 15px; border-radius:999px;
  background:linear-gradient(180deg,#F2D59E,#D9A94F); color:var(--red-deep); border:1px solid #F4DDB0;
  font-family:var(--sans); font-size:13.5px; font-weight:700; letter-spacing:.01em; line-height:1.2; white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 6px 16px -8px rgba(0,0,0,.55);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease; }
.mh-cta svg{ width:16px; height:16px; flex:none; transition:transform .3s cubic-bezier(.3,1.6,.5,1); }
.mh-cta:hover,.mh-cta:focus-visible{ transform:translateY(-1px); filter:brightness(1.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 22px -8px rgba(0,0,0,.6), 0 0 0 3px rgba(237,201,140,.3); outline:none; }
.mh-cta:hover svg{ transform:scale(1.15); }
.mh-cta:active{ transform:translateY(0) scale(.98); }
@media(max-width:1180px){ .mp-sub .mh-sites .mh-ico{ display:none; } .mp-sub .mh-sites a{ padding-left:13px; } }
@media(max-width:1040px){ .mh-cta{ margin-left:8px; } }
@media(max-width:820px){ .mp-sub .mh-sites{ display:none; } .mh-cta{ margin-left:auto; } }
@media(max-width:420px){ .mh-cta{ padding:8px 12px; font-size:12.5px; } .mh-cta svg{ display:none; } }

/* sister-site hero: photo with caption */
.mp-hero-sub{ position:relative; }
.mp-hero-sub::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(38,8,10,.86) 0%,rgba(38,8,10,.62) 34%,rgba(38,8,10,.12) 62%,transparent 80%),
             linear-gradient(0deg,rgba(38,8,10,.45),transparent 40%); }
.hs-cap{ position:absolute; inset:0; z-index:2; display:flex; align-items:flex-end; padding-bottom:clamp(36px,5vw,70px); line-height:1.5; }
.hs-cap .wrap{ width:100%; }
.hs-box{ max-width:540px; color:#F6E7D6; }
.hs-eyebrow{ margin:0 0 10px; font-size:12px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); }
.hs-box h1{ margin:0; font-family:var(--serif); font-weight:700; color:#fff; line-height:1.08; font-size:clamp(32px,4.2vw,56px); }
.hs-lead{ margin:14px 0 0; font-size:16px; line-height:1.65; color:#F3DED9; }
.hs-btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.btn-light-out{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.7); }
.btn-light-out:hover{ background:#fff; color:var(--red-deep); border-color:#fff; }
@media(max-width:760px){
  .mp-hero-sub img{ height:520px !important; }
  .mp-hero-sub::after{ background:linear-gradient(0deg,rgba(38,8,10,.92) 0%,rgba(38,8,10,.7) 45%,rgba(38,8,10,.15) 80%); }
  .hs-lead{ font-size:15px; }
}

/* messages: chairman + director */
.msg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:stretch; }
.msg-card{ position:relative; background:var(--cream); border:1px solid var(--line); border-radius:var(--r);
  padding:30px 32px 32px; box-shadow:0 22px 44px -34px rgba(36,26,22,.45); overflow:hidden; }
.msg-card::before{ content:"\201C"; position:absolute; right:22px; top:-18px; font-family:var(--serif);
  font-size:150px; line-height:1; color:rgba(201,150,47,.18); pointer-events:none; }
.msg-card::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:linear-gradient(180deg,var(--gold),var(--red)); }
.msg-head{ display:flex; align-items:center; gap:18px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.msg-photo{ width:84px; height:84px; flex:none; border-radius:50%; object-fit:cover;
  border:3px solid #fff; box-shadow:0 0 0 2px var(--gold), 0 8px 18px -8px rgba(36,26,22,.45); }
.msg-kind{ margin:0 0 4px; font-size:11.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.msg-head h3{ margin:0; font-family:var(--serif); font-size:22px; color:var(--red-deep); line-height:1.2; }
.msg-head h3.is-tbc{ color:var(--muted,#7A6B64); font-style:italic; }
.msg-title{ margin:4px 0 0; font-size:13.5px; color:var(--muted,#7A6B64); }
.msg-body p{ margin:0 0 12px; font-size:15.5px; line-height:1.75; color:var(--ink); }
.msg-body p:last-child{ margin-bottom:0; }
@media(max-width:860px){ .msg-grid{ grid-template-columns:1fr; } .msg-card{ padding:26px 22px 26px 26px; } }

/* two-up project cards */
.hub-grid.two{ grid-template-columns:repeat(2,1fr); max-width:980px; margin-inline:auto; }
@media(max-width:760px){ .hub-grid.two{ grid-template-columns:1fr; } }

.mp-msgs,.mp-programs{ padding-top:96px; }
.mp-projects{ padding-top:96px; padding-bottom:96px; }
.join-ribbon{ padding:96px 0 90px !important; }

/* footer join column */
.mf-join p{ font-size:13.5px; line-height:1.65; margin:0 0 16px; color:#F3DED9; }
.mf-join-btn{ display:inline-flex; align-items:center; gap:8px; padding:10px 18px 10px 14px; border-radius:999px;
  background:var(--gold-lt); color:var(--red-deep) !important; font-weight:700; font-size:13.5px;
  box-shadow:0 8px 18px -10px rgba(0,0,0,.6); transition:transform .2s ease, filter .2s ease; text-decoration:none !important; }
.mf-join-btn svg{ width:16px; height:16px; }
.mf-join-btn:hover{ transform:translateY(-1px); filter:brightness(1.06); }
.mp-stats-row b span{ display:inline; margin:0; font:inherit; color:inherit; letter-spacing:inherit; text-transform:none; }
.mp-sub .mh-sites .mh-ico{ display:none; }
.mp-sub .mh-sites a{ padding:8px 14px; }
.mp-sub .mh-sites{ gap:6px; }
@media(max-width:1200px){ .mp-sub .mh-sites a{ padding:7px 11px; font-size:12.5px; } .mh-cta{ padding:8px 14px 8px 12px; font-size:13px; } }
.bg-cream .msg-card{ background:#fff; } .mp-msgs.teeth-up-cream{ padding-bottom:96px; }
@media(max-width:640px){ .mh-top-row .mh-cta{ display:none; } }
.mnav a.mnav-cta{ display:block; margin:4px 0 10px; padding:13px 16px; text-align:center; border-radius:999px;
  background:linear-gradient(180deg,#F2D59E,#D9A94F); color:var(--red-deep); font-weight:700; border:0; }
@media(min-width:641px){ .mnav a.mnav-cta{ display:none; } }
@media(max-width:480px){ .mp-sub .mh-word i{ display:none; } }

/* ============================================================
   v43 — one site switcher on all four sites, aligned header,
   header stays on screen (compact) while scrolling,
   Charity projects: five cards
   ============================================================ */
:root{ --mh-gap:210px; }
@media(max-width:1200px){ :root{ --mh-gap:190px; } }
html{ scroll-padding-top:128px; }

/* header stays pinned; it only gets shorter on scroll */
header.site.mp-head{ top:0; transition:box-shadow .3s ease; }
.mh-top{ transition:height .3s ease; }
.mh-menu{ grid-template-columns:1fr var(--mh-gap) 1fr; transition:height .3s ease; }
.mh-l,.mh-r{ justify-self:center; }
.mh-r .submenu{ left:50%; right:auto; transform:translateX(-50%) translateY(8px); }
.mh-l .submenu{ left:50%; transform:translateX(-50%) translateY(8px); }
.mh-group .mi:hover .submenu,.mh-group .mi:focus-within .submenu{ transform:translateX(-50%); }

/* top row lines up with the menu row: wordmark over the left menu,
   site switcher over the right menu, emblem between */
@media(min-width:1041px){
  .mh-top-row{ display:grid; grid-template-columns:1fr var(--mh-gap) 1fr; align-items:center; gap:0; }
  .mh-top-row .mh-word{ grid-column:1; justify-self:center; }
  .mh-top-row .mh-word span{ text-align:center; }
  .mh-right{ grid-column:3; justify-self:center; display:flex; align-items:center; gap:10px; }
  .mh-top-row .burger{ display:none; }
}

/* ---------- the site switcher (same on every page of every site) ---------- */
.mh-switch{ display:inline-flex; align-items:center; gap:2px; padding:3px; border-radius:999px;
  background:rgba(40,6,8,.28); border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.3), 0 1px 0 rgba(255,255,255,.08); }
.mh-switch a{ display:block; padding:7px 14px; border-radius:999px; font-family:var(--sans); font-size:13px;
  font-weight:500; line-height:1.2; letter-spacing:.01em; color:#F6E7D6; white-space:nowrap;
  transition:background .2s ease, color .2s ease, box-shadow .2s ease; }
.mh-switch a:hover{ background:rgba(255,255,255,.13); color:#fff; }
.mh-switch a.is-on,.mh-switch a.is-on:hover{ background:#FFF8EF; color:var(--red-deep); font-weight:700;
  box-shadow:0 2px 8px -3px rgba(0,0,0,.5); }
.mh-switch a:focus-visible{ outline:2px solid var(--gold-lt); outline-offset:1px; }
.mh-cta{ margin-left:0; }
@media(max-width:1239px){
  .mh-switch a{ padding:7px 11px; font-size:12.5px; }
  .mh-cta{ padding:8px 13px; font-size:12.5px; }
  .mh-cta svg{ display:none; }
}

/* ---------- compact state while scrolling ---------- */
header.site.mp-head.shrink{ --mh-top:52px; --mh-nav:42px; box-shadow:0 12px 26px -16px rgba(0,0,0,.6); }
header.site.mp-head.shrink .mh-word b{ font-size:22px; }
header.site.mp-head.shrink .mh-word i{ font-size:8.5px; margin-top:4px; }
header.site.mp-head.shrink .mh-group .mi > a,
header.site.mp-head.shrink .mh-group .mi > button{ padding-top:11px; padding-bottom:11px; }
header.site.mp-head.shrink .mh-emblem{ top:3px; }
header.site.mp-head.shrink .mh-emblem img{ height:88px; }
.mh-word b,.mh-word i,.mh-group .mi > a,.mh-group .mi > button{ transition:font-size .3s ease, padding .3s ease, color .18s; }

/* ---------- tablet / phone ---------- */
@media(max-width:1040px){
  .mh-right{ display:flex; align-items:center; gap:8px; margin-left:auto; }
  .mh-top-row .mh-sites{ display:none; }
}
@media(max-width:899px){ .mh-right .mh-switch{ display:none; } }
@media(max-width:640px){ .mh-right{ display:none; } }
header.site.mp-head.shrink .mh-word img{ height:38px; }

/* switcher at the top of the mobile drawer */
.mnav .mh-switch-m{ display:flex; margin:4px 0 12px; background:var(--cream-2); border-color:var(--line);
  box-shadow:inset 0 1px 2px rgba(36,26,22,.12); }
.mnav .mh-switch-m a{ flex:1 1 auto; text-align:center; padding:9px 6px; border-bottom:0; color:var(--ink);
  font-size:12.5px; letter-spacing:0; text-transform:none; font-weight:600; }
.mnav .mh-switch-m a:hover{ background:rgba(142,27,34,.08); color:var(--red); }
.mnav .mh-switch-m a.is-on,.mnav .mh-switch-m a.is-on:hover{ background:var(--red); color:#fff; }
@media(min-width:900px){ .mnav .mh-switch-m{ display:none; } }

/* ---------- Charity: five project cards, centred ---------- */
.projects.is-five{ display:flex; flex-wrap:wrap; justify-content:center; gap:22px; }
.projects.is-five .proj{ flex:0 0 calc((100% - 88px) / 5); }
@media(max-width:1080px){ .projects.is-five .proj{ flex-basis:calc((100% - 44px) / 3); } }
@media(max-width:760px){ .projects.is-five .proj{ flex-basis:calc((100% - 22px) / 2); } }
@media(max-width:440px){ .projects.is-five .proj{ flex-basis:100%; } }

/* v43 fit: right-hand group must clear the emblem at every width */
:root{ --mh-gap:196px; }
.mh-switch a{ padding:7px 12px; }
.mh-right{ gap:8px; }
.mh-right .mh-cta{ padding:9px 15px 9px 13px; font-size:13px; }
@media(max-width:1239px){
  :root{ --mh-gap:176px; }
  .mh-switch a{ padding:7px 10px; font-size:12.5px; }
  .mh-right .mh-cta{ width:38px; height:38px; padding:0; justify-content:center; border-radius:50%; }
  .mh-right .mh-cta span{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .mh-right .mh-cta svg{ display:block; width:17px; height:17px; }
  .mh-emblem img{ height:132px; }
}
@media(max-width:1040px){
  .mh-right .mh-cta{ width:auto; height:auto; padding:8px 14px; border-radius:999px; }
  .mh-right .mh-cta span{ position:static; width:auto; height:auto; clip:auto; }
}

/* v43 phone fixes: long button labels wrap, two-column blocks collapse fully */
.split > *,.trio > *{ min-width:0; }
@media(max-width:900px){ .split,.trio{ grid-template-columns:minmax(0,1fr); } }
@media(max-width:480px){ .btn{ white-space:normal; text-align:center; } }

/* ============================================================
   v44 — header edges line up with the menu edges, one
   "Matri Peeth" wordmark on all sites, gold current-site
   marker, Donate beside Contact (Mandir), Messages fly-out
   ============================================================ */
:root{ --mi-pad:16px; }
@media(max-width:1200px){ :root{ --mi-pad:11px; } }

@media(min-width:1041px){
  /* left edge: wordmark = first menu word; right edge: switcher = last menu item */
  .mh-top-row .mh-word{ justify-self:start; }
  .mh-top-row .mh-word span{ text-align:left; }
  .mh-right{ justify-self:end; }
  .mh-l{ justify-self:start; margin-left:calc(var(--mi-pad) * -1); }
  .mh-r{ justify-self:end; margin-right:calc(var(--mi-pad) * -1); }
  .mh-r.has-cta{ margin-right:0; }
  .mh-l .submenu{ left:var(--mi-pad); transform:translateY(8px); }
  .mh-r .submenu{ left:auto; right:var(--mi-pad); transform:translateY(8px); }
  .mh-group .mi:hover .submenu,.mh-group .mi:focus-within .submenu{ transform:none; }
}

/* ---------- current-site marker: warm gold instead of white ---------- */
.mh-switch{ background:rgba(40,6,8,.32); border-color:rgba(237,201,140,.22); }
.mh-switch a.is-on,.mh-switch a.is-on:hover{
  background:linear-gradient(180deg,#F6DDA6 0%,#E2B460 55%,#C9962F 100%);
  color:#4A0D10; font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(94,17,19,.18),
             0 0 0 1px rgba(246,221,166,.45), 0 4px 12px -4px rgba(0,0,0,.55); }
.mh-switch a:not(.is-on):hover{ background:rgba(237,201,140,.14); color:#FFF3E2; }

/* ---------- Donate button in the menu row (Mandir) ---------- */
.mh-group .mi.mi-cta{ margin-left:12px; }
.mh-group .mi.mi-cta::before{ display:none; }
.mh-group .mi.mi-cta .mh-cta{ padding:7px 15px 7px 13px; font-size:12.5px; letter-spacing:.02em; }
.mh-group .mi.mi-cta .mh-cta svg{ display:block; width:15px; height:15px; }
header.site.mp-head.shrink .mh-group .mi.mi-cta .mh-cta{ padding-top:6px; padding-bottom:6px; }
@media(max-width:1200px){ .mh-group .mi.mi-cta{ margin-left:8px; } .mh-group .mi.mi-cta .mh-cta{ padding:6px 12px 6px 11px; } }

/* ---------- second-level fly-out (About > Messages) ---------- */
.submenu li.has-sub{ position:relative; }
.submenu .sub-toggle{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%;
  padding:10px 13px; border:0; border-radius:6px; background:none; cursor:pointer; text-align:left;
  font-family:var(--sans); font-size:13px; color:var(--body-c); transition:.16s; }
.submenu .sub-toggle .caret-r{ width:9px; height:9px; flex:none; opacity:.7; }
.submenu li.has-sub:hover > .sub-toggle,.submenu li.has-sub:focus-within > .sub-toggle{ background:var(--cream-2); color:var(--red); }
.mh-group .mi .submenu li.has-sub > .submenu.sub2{ top:-8px; left:calc(100% + 6px); right:auto; min-width:236px;
  opacity:0; visibility:hidden; transform:translateX(6px); }
.mh-group .mi .submenu li.has-sub:hover > .submenu.sub2,
.mh-group .mi .submenu li.has-sub:focus-within > .submenu.sub2{ opacity:1; visibility:visible; transform:none; }
/* bridge the 6px gap so the fly-out doesn't close on the way across */
.submenu.sub2::before{ content:""; position:absolute; left:-8px; top:0; bottom:0; width:8px; }

/* mobile drawer: nested Messages group */
.mnav .mgroup-2{ padding:2px 0 0 16px; }
.mnav .mgroup-2 > b{ margin-top:6px; }
.mnav .mgroup-2 a{ padding-left:16px; font-size:14px; }
.mnav a.mnav-cta.always{ display:block; }
/* menu-row Donate keeps the gold button look (beats the generic menu-link rule) */
.mh-group .mi.mi-cta > a.mh-cta{ display:inline-flex; align-items:center; gap:7px;
  padding:7px 16px 7px 13px; border-radius:999px; border:1px solid #F4DDB0;
  background:linear-gradient(180deg,#F2D59E,#D9A94F); color:var(--red-deep);
  font-family:var(--sans); font-size:13px; font-weight:700; letter-spacing:.01em; text-transform:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 6px 16px -8px rgba(0,0,0,.6); }
.mh-group .mi.mi-cta > a.mh-cta:hover,.mh-group .mi.mi-cta > a.mh-cta:focus-visible{ color:var(--red-deep);
  filter:brightness(1.06); transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 20px -8px rgba(0,0,0,.65), 0 0 0 3px rgba(237,201,140,.3); }
.mh-group .mi.mi-cta > a.mh-cta::after{ display:none; }
header.site.mp-head.shrink .mh-group .mi.mi-cta > a.mh-cta{ padding-top:6px; padding-bottom:6px; }
@media(max-width:1200px){ .mh-group .mi.mi-cta > a.mh-cta{ padding:6px 13px 6px 11px; font-size:12.5px; } }

/* ============================================================
   v46 — hero slideshows (Main, Mandir, Cultural)
   ============================================================ */
.mp-hero.has-slides{ overflow:hidden; }
.mp-hero.has-slides .hs-slide{ position:absolute; top:0; left:0; opacity:0; transform:scale(1.05);
  transition:opacity 1.4s ease, transform 7.5s ease-out; will-change:opacity, transform; }
.mp-hero.has-slides .hs-slide:first-child{ position:relative; }   /* gives the hero its height */
.mp-hero.has-slides .hs-slide.is-on{ opacity:1; transform:scale(1); z-index:1; }
.mp-hero-sub.has-slides::after{ z-index:2; }
.mp-hero-sub.has-slides .hs-cap{ z-index:3; }
.hs-dots{ position:absolute; z-index:4; right:clamp(16px,4vw,48px); bottom:20px; display:flex; gap:8px; line-height:0; }
.hs-dots button{ width:9px; height:9px; padding:0; border-radius:999px; cursor:pointer;
  border:1px solid rgba(255,248,239,.85); background:rgba(30,8,10,.35); transition:width .3s ease, background .3s ease; }
.hs-dots button:hover{ background:rgba(255,248,239,.6); }
.hs-dots button.is-on{ width:26px; background:linear-gradient(90deg,#F6DDA6,#D9A94F); border-color:#F6DDA6; }
.hs-dots button:focus-visible{ outline:2px solid var(--gold-lt); outline-offset:2px; }
@media(max-width:760px){ .mp-hero-sub .hs-dots{ bottom:auto; top:16px; } }
@media(prefers-reduced-motion:reduce){ .mp-hero.has-slides .hs-slide{ transform:none; } }