:root{
  --ivory:#F1EBDD;
  --ivory-warm:#EAE2CE;
  --ink:#2B2118;
  --indigo:#16324A;
  --indigo-deep:#0E2334;
  --clay:#B24E32;
  --clay-deep:#8F3B24;
  --gold:#D9A441;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--ivory);
  color:var(--ink);
  font-family:'Mukta', sans-serif;
  line-height:1.6;
}
img{max-width:100%; display:block;}
h1,h2,h3, .display{
  font-family:'Tiro Devanagari Marathi', serif;
  font-weight:400;
  color:var(--indigo-deep);
}
.hero-word{
  font-family:'Yatra One', cursive;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}

/* ---------- pot motif (signature) ---------- */
.pot-glyph{display:inline-block; vertical-align:middle;}
.pot-divider{
  display:flex; align-items:center; justify-content:center;
  gap:14px; padding:14px 0;
  color:var(--clay);
}
.pot-divider .line{flex:0 0 auto; width:64px; height:1px; background:currentColor; opacity:.45;}
/* section that follows a divider keeps a small gap instead of its own big
   top padding (divider already provides separation) */
.pot-divider + section{padding-top:24px;}

/* ---------- header ---------- */
header{
  background:var(--ivory); position:sticky; top:0; z-index:20;
  border-bottom:1px solid rgba(43,33,24,.1);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0; gap:18px;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand .crest{width:44px; height:44px; flex:0 0 auto; border-radius:50%;}
.brand .name{font-family:'Tiro Devanagari Marathi', serif; font-size:1.3rem; color:var(--indigo-deep); line-height:1.2;}
.brand .sub{font-size:.68rem; letter-spacing:.14em; color:var(--clay-deep); text-transform:uppercase; font-family:'Mukta',sans-serif;}
nav ul{list-style:none; display:flex; gap:22px; font-size:.98rem; flex-wrap:wrap;}
nav a{position:relative; padding:6px 0; font-weight:500;}
nav a::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--clay); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;}
nav a:hover::after,
nav a.is-active::after{transform:scaleX(1);}
.socials{display:flex; gap:14px;}
.socials a{width:30px; height:30px; border-radius:50%; border:1px solid rgba(43,33,24,.25); display:flex; align-items:center; justify-content:center; font-size:.8rem; color:var(--indigo-deep);}
.socials a:hover{background:var(--indigo-deep); color:var(--ivory); border-color:var(--indigo-deep);}

/* ---------- mobile hamburger menu ---------- */
.nav-toggle{
  display:none; width:42px; height:42px; cursor:pointer; z-index:30;
  background:none; border:none; padding:0; /* transparent hamburger — bg removed */
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--indigo-deep); transition:transform .2s ease, opacity .2s ease;}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media (max-width:900px){
  /* hamburger far-left (absolute), title centered in normal flow,
     socials pinned far-right — brand stays in-flow so header keeps its height */
  .nav-row{position:relative; justify-content:space-evenly;}
  .nav-toggle{display:flex; position:absolute; left:14px; top:50%; transform:translateY(-50%);}
  .socials{position:absolute; right:14px; top:50%; transform:translateY(-50%);}
  nav ul{
    display:none; position:absolute; top:100%; left:0; right:0;
    flex-direction:column; gap:0; background:var(--ivory);
    border-bottom:1px solid rgba(43,33,24,.15); box-shadow:0 12px 24px rgba(22,50,74,.12);
    padding:10px 0; z-index:40;
  }
  nav ul.open{display:flex;}
  nav ul li a{display:block; padding:12px 28px; font-size:1rem;}
  nav ul li a::after{display:none;}
}

/* ---------- hero ---------- */
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--indigo-deep), var(--indigo) 70%);
  color:var(--ivory);
}
.hero .wrap{
  padding:86px 28px 96px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;
}
.hero .eyebrow{
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  margin-bottom:18px; font-family:'Mukta',sans-serif; font-weight:600;
}
.hero h1{
  font-size:2.6rem; line-height:1.25; color:var(--ivory); margin-bottom:20px;
}
.hero p.tagline{
  font-size:1.15rem; color:rgba(241,235,221,.86); max-width:46ch; margin-bottom:30px;
}
.cta{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--clay); color:var(--ivory); padding:13px 26px; border-radius:2px;
  font-weight:600; letter-spacing:.02em; font-size:.98rem;
  transition:background .2s ease, transform .2s ease;
}
.cta:hover{background:var(--clay-deep); transform:translateY(-1px);}
.hero-photo{
  position:relative; aspect-ratio:4/3; border-radius:2px; overflow:hidden;
  border:1px solid rgba(241,235,221,.18);
  background:radial-gradient(circle at 30% 20%, rgba(217,164,65,.35), transparent 55%), linear-gradient(135deg, #23425c, #142838);
}
.hero-photo img{width:100%; height:100%; object-fit:cover;}

/* ---------- subpage hero (shared band) ---------- */
.page-hero{position:relative; overflow:hidden; background:linear-gradient(160deg, var(--indigo-deep), var(--indigo) 70%); color:var(--ivory);}
.page-hero .wrap{padding:56px 28px 60px;}
.page-hero .eyebrow{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; font-weight:600;}
.page-hero h1{font-size:2.2rem; line-height:1.3; color:var(--ivory);}
.page-hero p.sub{margin-top:12px; max-width:62ch; color:rgba(241,235,221,.82); font-size:1.05rem;}

/* ---------- notice band ---------- */
.notice{padding:26px 0 0;}
.notice-card{
  background:#fff; border:1px solid rgba(43,33,24,.1); border-left:4px solid var(--gold);
  border-radius:3px; padding:18px 22px;
  display:flex; flex-direction:column; gap:12px;
}
.notice-card .chip{
  align-self:flex-start; background:var(--gold); color:var(--indigo-deep);
  font-size:.7rem; font-weight:700; letter-spacing:.08em; padding:5px 12px; border-radius:100px;
}
.notice-card .txt{font-size:.95rem; line-height:1.5;}
.notice-card .txt b{font-family:'Tiro Devanagari Marathi',serif; font-weight:400; color:var(--indigo-deep); font-size:1.05rem;}
.notice-card .body{overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.notice-card .body.expanded{-webkit-line-clamp:unset;}
.notice-card .more{
  background:none; border:none; padding:0; cursor:pointer; color:var(--clay-deep);
  font-weight:600; font-size:.85rem; margin-top:2px; align-self:flex-start;
}
.notice-card .more:hover{color:var(--clay);}
.notice-card .links{
  display:flex; gap:18px; align-items:center; flex-wrap:wrap;
  border-top:1px solid rgba(43,33,24,.1); padding-top:10px;
}
.notice-card .links a.yt{
  color:var(--clay-deep); font-weight:600; border-bottom:1px solid rgba(178,78,50,.4); padding-bottom:1px;
}
.notice-card .links a.yt:hover{color:var(--clay);}
.notice-card .links .wa{color:rgba(43,33,24,.6);}
/* announcement carousel (single-footprint rotator) */
.notice-car{position:relative;}
.notice-car .slide{display:none;}
.notice-car .slide.active{display:block; animation:fadeIn .5s ease;}
@keyframes fadeIn{from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;}}
.notice-car .arr{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:30px; height:30px; border-radius:50%; border:1px solid rgba(43,33,24,.25);
  background:rgba(255,255,255,.9); color:var(--indigo-deep); font-size:1rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.notice-car .arr:hover{background:var(--indigo-deep); color:var(--ivory);}
.notice-car .arr.prev{left:-14px;}
.notice-car .arr.next{right:-14px;}
.notice-car .dots{
  display:flex; justify-content:center; gap:7px; margin-top:10px;
}
.notice-car .dots button{
  width:7px; height:7px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(43,33,24,.25); padding:0;
}
.notice-car .dots button.active{background:var(--clay);}

/* ---------- practice band / figures ---------- */
.practice{padding:76px 0 40px;}
.practice .lead{max-width:60ch; margin:0 auto 46px; text-align:center;}
.practice .lead h2{font-size:1.9rem; margin-bottom:10px;}
.practice .lead p{color:rgba(43,33,24,.7);}
.band{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.band figure{
  aspect-ratio:4/5; border-radius:2px; position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--ivory-warm), #ddd0ac);
  border:1px solid rgba(43,33,24,.12);
  display:flex; align-items:flex-end;
}
.band figure > img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .35s ease;
}
.band figure:hover > img{transform:scale(1.03);}
.band figcaption{
  position:relative; width:100%; padding:40px 16px 14px;
  background:linear-gradient(0deg, rgba(22,50,74,.88), transparent);
  color:var(--ivory); font-size:.92rem;
}
.band figcaption b{display:block; font-family:'Tiro Devanagari Marathi',serif; font-weight:400; font-size:1.05rem; margin-bottom:2px;}
/* typographic tile for figures without a photograph */
.band figure.tile{background:linear-gradient(155deg, var(--indigo), var(--indigo-deep)); align-items:center; justify-content:center;}
.band figure.tile::before{
  content:attr(data-word);
  font-family:'Tiro Devanagari Marathi', serif; color:var(--ivory); font-size:1.9rem;
}
.band figure.tile figcaption{
  position:absolute; bottom:0; padding-top:34px;
}

/* ---------- quote ---------- */
.quote-section{background:var(--ivory-warm); padding:70px 0;}
.quote-box{max-width:900px; margin:0 auto; display:grid; grid-template-columns: 220px 1fr; gap:44px; align-items:center;}
.quote-portrait{position:relative;}
.quote-portrait img{
  width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:2px;
  border:1px solid rgba(43,33,24,.15);
  box-shadow:10px 10px 0 rgba(22,50,74,.12);
}
.quote-portrait cite{
  display:block; margin-top:12px; font-style:normal; font-weight:600;
  color:var(--clay-deep); letter-spacing:.03em; font-size:.9rem; text-align:center;
}
.quote-body{text-align:left;}
.quote-body .kicker{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--clay-deep); font-weight:600; margin-bottom:14px; font-family:'Mukta',sans-serif;}
.quote-body .pot-glyph{opacity:.18; width:56px; height:56px; margin-bottom:6px;}
.quote-body p{
  font-family:'Tiro Devanagari Marathi', serif; font-size:1.42rem; line-height:1.55;
  color:var(--indigo-deep); font-style:italic;
}

/* ---------- programs / cards ---------- */
.programs{padding:80px 0 90px;}
.programs .lead{max-width:60ch; margin:0 auto 50px; text-align:center;}
.programs .lead h2{font-size:1.95rem;}
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.card{
  background:#fff; border:1px solid rgba(43,33,24,.1); border-radius:3px; overflow:hidden;
  display:flex; flex-direction:column; transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(22,50,74,.14);}
.card .thumb{
  aspect-ratio:16/10; background:linear-gradient(150deg,var(--ivory-warm), #d8c9a3);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.card .thumb > img.photo{width:100%; height:100%; object-fit:cover;}
.card .thumb > img.emblem{width:52%; height:auto; object-fit:contain; filter:drop-shadow(0 4px 10px rgba(43,33,24,.18));}
.card .badge{
  position:absolute; top:12px; left:12px; background:var(--gold); color:var(--indigo-deep);
  font-size:.68rem; font-weight:700; letter-spacing:.03em; padding:4px 10px; border-radius:100px; z-index:1;
}
/* .card .thumb sets the beige fill, so this needs the same specificity to win */
.card .thumb.thumb--type{
  background:linear-gradient(155deg, var(--indigo), var(--indigo-deep));
  flex-direction:column; gap:8px;
}
.thumb--type .big{
  font-family:'Tiro Devanagari Marathi', serif; color:var(--ivory); font-size:1.7rem; line-height:1.2;
}
.thumb--type .small{color:var(--gold); font-size:.68rem; letter-spacing:.22em; text-transform:uppercase; font-weight:600;}
.card .body{padding:20px 20px 24px; border-top:3px solid var(--clay);}
.card h3{font-size:1.15rem; margin-bottom:6px; line-height:1.4;}
.card p{font-size:.92rem; color:rgba(43,33,24,.68);}

/* ---------- prose (text pages) ---------- */
.prose{padding:70px 0;}
.prose .inner{max-width:900px; margin:0 auto;}
.prose h2{font-size:1.55rem; margin:38px 0 14px;}
.prose h2:first-child{margin-top:0;}
.prose p{margin-bottom:16px; font-size:1.02rem; color:rgba(43,33,24,.85);}
.prose ul{margin:0 0 16px; padding-inline-start:22px;}
.prose li{margin-bottom:8px; font-size:1.02rem; color:rgba(43,33,24,.85);}
.prose blockquote{
  font-family:'Tiro Devanagari Marathi', serif; font-style:italic; color:var(--indigo-deep);
  border-left:3px solid var(--gold); padding:6px 0 6px 20px; margin:18px 0; font-size:1.15rem;
}

/* ---------- issue list (Satyarpan archive) ---------- */
.issue-list{padding:60px 0 80px;}
.issue-year{margin:40px 0 18px; display:flex; align-items:center; gap:14px;}
.issue-year::after{content:""; flex:1; height:1px; background:rgba(43,33,24,.15);}
.issue-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px;}
a.issue{
  display:block; background:#fff; border:1px solid rgba(43,33,24,.1); border-top:3px solid var(--gold);
  border-radius:3px; padding:14px 16px; transition:transform .15s ease, box-shadow .15s ease;
}
a.issue:hover{transform:translateY(-3px); box-shadow:0 10px 22px rgba(22,50,74,.13);}
a.issue .date{font-family:'Tiro Devanagari Marathi', serif; font-size:1.02rem; color:var(--indigo-deep);}
a.issue .pdf{display:block; margin-top:4px; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--clay-deep); font-weight:600;}

/* ---------- location statement ---------- */
.locate{
  background:var(--indigo-deep); color:var(--ivory); padding:70px 0; text-align:center;
  position:relative; overflow:hidden;
}
.locate::before{
  content:""; position:absolute; inset:0;
  background-image:repeating-linear-gradient(45deg, rgba(217,164,65,.05) 0 2px, transparent 2px 26px);
}
.locate .inner{position:relative;}
.locate .eyebrow{font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; font-weight:600;}
.locate h2{font-size:2.3rem; color:var(--ivory); font-family:'Yatra One',cursive; font-weight:400;}
.locate .sub{color:rgba(241,235,221,.7); margin-top:10px; font-size:1rem;}
.locate h2 .ska{font-family:'Tiro Devanagari Marathi', serif; font-weight:bold;}
.locate .details{
  margin-top:26px; display:inline-flex; flex-direction:column; gap:6px;
  font-size:1rem; color:rgba(241,235,221,.85);
}
.locate .details b{color:var(--gold); font-weight:600;}

/* ---------- contact cards ---------- */
.contact-cards{display:grid; grid-template-columns:1fr 1fr; gap:26px; padding:60px 0 30px;}
.ccard{background:#fff; border:1px solid rgba(43,33,24,.1); border-top:4px solid var(--clay); border-radius:3px; padding:28px;}
.ccard h2{font-size:1.35rem; margin-bottom:4px;}
.ccard .role{color:var(--clay-deep); font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; margin-bottom:16px;}
.ccard p{margin-bottom:6px; font-size:.98rem;}
.ccard b{color:var(--indigo-deep);}

/* ---------- footer ---------- */
footer{background:var(--indigo-deep); border-top:1px solid rgba(241,235,221,.12); padding:34px 0; color:rgba(241,235,221,.6); font-size:.85rem; text-align:center;}
footer a{text-decoration:underline; text-underline-offset:3px;}

@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr; padding-top:56px;}
  .band{grid-template-columns:1fr 1fr;}
  .grid{grid-template-columns:1fr 1fr;}
  .quote-box{grid-template-columns:1fr; text-align:center;}
  .quote-portrait{max-width:240px; margin:0 auto;}
  .quote-body{text-align:center;}
  .contact-cards{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .grid{grid-template-columns:1fr;}
  .band{grid-template-columns:1fr;}
  .hero h1{font-size:2.1rem;}
  nav ul{gap:14px;}
  .ska{font-weight:bolder;}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; scroll-behavior:auto !important;}
}