/* BBanya brand site styles — based on the approved HTML prototype (plain CSS, no Tailwind). */

/* ---- Brand fonts ---- */
@font-face{font-family:'Jeferson';src:url('../fonts/jeferson.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:'Ramus Med';src:url('../fonts/ramus-medium.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:'Avenir Next';src:url('../fonts/avenir-next-regular.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap}

/* ---- Brand colors (defaults; overridable via ACF palette on the front page) ---- */
:root{--forest:#153d35;--gold:#d6c29e;--ivory:#f4f0e7;--ink:#28332e}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);font:17px/1.6 'Avenir Next',Arial,sans-serif;min-height:100vh;display:flex;flex-direction:column}
h1,h2,h3,.brand{font-family:'Jeferson','Arial Narrow',Impact,Arial,sans-serif;font-stretch:condensed;letter-spacing:.025em;line-height:1.1}
h3,.brand{font-family:'Ramus Med','Arial Narrow',Impact,Arial,sans-serif}
h1{font-size:clamp(3rem,6vw,6.7rem);margin:.3em 0}
h2{font-size:clamp(2.4rem,4vw,4.4rem);margin:.2em 0 .5em}
h3{font-size:1.65rem}
a{color:inherit}
img{max-width:100%;height:auto}

header.site-head{background:var(--forest);color:var(--ivory);padding:20px 5%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-size:2rem;color:var(--gold);text-decoration:none;font-weight:900}
nav.main-nav{font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin:0}
nav.main-nav ul{display:flex;gap:22px;flex-wrap:wrap;margin:0;padding:0}
nav.main-nav li{list-style:none}
nav.main-nav a{text-decoration:none}

.hero{background:var(--forest);color:var(--ivory);display:grid;grid-template-columns:48% 52%;min-height:680px}
.hero-copy{padding:clamp(38px,6vw,100px) 8% 70px 10%;display:flex;flex-direction:column;justify-content:center}
.eyebrow{color:var(--gold);font-size:12px;font-weight:bold;letter-spacing:.22em;text-transform:uppercase}
.hero p{max-width:490px;color:#e0e3da}
.hero-img{background:url('../images/hero.webp') center/cover no-repeat;min-height:420px}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.btn{padding:13px 18px;border:1px solid var(--gold);text-decoration:none;text-transform:uppercase;letter-spacing:.09em;font-size:12px;font-weight:bold;display:inline-block}
.btn.primary{background:var(--gold);color:var(--forest)}
section{padding:95px 6%}
.intro{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:60px}
.intro p{font-size:20px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:#b4b7ac;margin-top:55px}
.stat{background:var(--ivory);padding:25px}
.stat strong{font:46px 'Jeferson',Impact,Arial;color:var(--forest);display:block}
.stat span{font-size:13px}
.dark{background:var(--forest);color:var(--ivory)}
.dark h2{color:var(--gold)}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.service{border:1px solid #6c8a7e;padding:28px;min-height:220px}
.service b{color:var(--gold);font-size:13px}
.service h3{margin:30px 0 12px}
.service p{font-size:14px;color:#d8dfd8}
.locations{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:35px}
.location{background:white}
.location img{display:block;width:100%;height:270px;object-fit:cover}
.location div{padding:18px}
.location h3{margin:0 0 6px}
.location small{color:#626c65}
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.split img{width:100%;height:480px;object-fit:cover}
.partner-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:35px}
.partner{padding:35px;border:1px solid #c6c8bf;background:white}
.partner p{max-width:480px}
.contact{text-align:center}
.contact a{color:var(--gold)}
footer.site-foot{background:#0c2923;color:#cdd6cd;padding:25px 6%;font-size:12px;margin-top:auto}
.note{font-size:12px;color:#737c74;max-width:1000px;margin:20px auto}
section.dark .note{color:#c2cfc4}

.section-top{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:end;max-width:1240px;margin:0 auto 48px}
.section-top>p{font-size:19px;max-width:590px}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1240px;margin:auto}
.timeline article{border-top:2px solid var(--forest);padding:20px 12px 16px 0}
.timeline span{font:36px 'Jeferson',Impact,Arial,sans-serif;color:var(--forest)}
.timeline h3{margin:12px 0}
.timeline p{font-size:15px}
.story-next{margin:55px auto 0;padding:38px;background:#e7e4d9;max-width:1240px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.story-next .eyebrow{color:#607b69}
.story-next h3{font-size:2rem;margin:12px 0}
.people-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1240px;margin:auto}
.person{border:1px solid #658075;padding:24px;min-height:255px}
.person.lead{grid-column:span 2;display:flex;gap:28px;align-items:center}
.person h3{margin:14px 0 4px}
.person p{font-size:14px;color:#d8dfd8}
.person .role{color:var(--gold);font-weight:bold}
.person.has-photo .portrait{border:none;background:none;font-size:0}
.person-tag{font-size:11px;letter-spacing:.14em;color:var(--gold)}
.portrait-placeholder{display:flex;align-items:center;justify-content:center;width:78px;height:78px;flex-shrink:0;border-radius:50%;border:1px solid #8fa99b;color:var(--gold);font:28px 'Jeferson',Impact,Arial;background:#244d42;overflow:hidden}
.portrait-placeholder img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.person.lead .portrait-placeholder{width:132px;height:132px;font-size:45px}
.section-intro{max-width:720px}
.downloads{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1200px;margin:35px 0}
.downloads article{display:flex;gap:25px;padding:30px;background:white;border:1px solid #d5d3ca}
.downloads h3{margin:0}
.downloads p{font-size:14px;margin:12px 0 28px}
.doc-icon{width:65px;height:82px;flex-shrink:0;display:grid;place-items:center;background:var(--forest);color:var(--gold);font-size:13px;font-weight:bold;letter-spacing:.08em}
.downloads .btn{display:inline-block}
.story-section .note,.people-section .note{max-width:1240px}

@media(max-width:850px){
  .hero,.intro,.split{grid-template-columns:1fr}
  .hero-img{min-height:430px;grid-row:1}
  .hero-copy{padding:48px 7% 65px}
  .services,.locations{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  nav.main-nav{gap:10px}
  section{padding:65px 6%}
  .section-top,.story-next{grid-template-columns:1fr}
  .timeline{grid-template-columns:repeat(2,1fr)}
  .people-grid{grid-template-columns:repeat(2,1fr)}
  .downloads{grid-template-columns:1fr}
}
@media(max-width:520px){
  .services,.locations,.partner-grid{grid-template-columns:1fr}
  header.site-head{align-items:flex-start;flex-direction:column}
  nav.main-nav{font-size:11px}
  .location img{height:320px}
  .split img{height:320px}
  .timeline,.people-grid{grid-template-columns:1fr}
  .person.lead{grid-column:auto;display:block}
  .person.lead .portrait-placeholder{width:78px;height:78px;font-size:28px}
  .downloads article{padding:20px;gap:14px}
}

/* simple fallback template (blog/page view) */
.plain-wrap{max-width:900px;margin:60px auto;padding:0 6%}