/* Bilal Academy Management: new home page (v1.114)
   Loaded on the home page only. See bam-chrome.css for the shared base, buttons, header and footer. */
.bh :focus-visible { outline:3px solid var(--gold); outline-offset:3px; border-radius:8px; }
.bh h2 { font-size:clamp(30px,4.2vw,46px); color:var(--g900); }
.bh .bh-lead { font-size:clamp(17px,1.6vw,20px); color:var(--muted); max-width:62ch; }
.bh .bh-sec { padding:clamp(56px,7.5vw,96px) 0; }
.bh .bh-sec-head { max-width:760px; margin:0 0 clamp(34px,5vw,56px); }
.bh .bh-sec-head.bh-center { margin-inline:auto; text-align:center; }
.bh .bh-sec-head h2 { margin:14px 0 14px; }
.bh .bh-hero { color:#fff; overflow:hidden; background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1.2'%3E%3Crect x='18' y='18' width='36' height='36'/%3E%3Crect x='18' y='18' width='36' height='36' transform='rotate(45 36 36)'/%3E%3C/g%3E%3C/svg%3E"),
  radial-gradient(900px 520px at 78% 38%, rgba(39,147,92,.55), transparent 62%),
  linear-gradient(140deg, var(--g950) 0%, var(--g800) 58%, var(--g700) 100%); }
.bh .bh-hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:linear-gradient(90deg, transparent, var(--gold), transparent); opacity:.9; }
.bh .bh-hero .bh-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:40px; align-items:center; padding:clamp(48px,7vw,92px) 0 clamp(120px,12vw,168px); }
.bh .bh-hero h1 { font-size:clamp(40px,6.2vw,76px); margin:22px 0 22px; }
.bh .bh-hero h1 em { font-style:normal; color:var(--gold); position:relative; white-space:nowrap; }
.bh .bh-hero h1 em::after { content:""; position:absolute; left:0; right:0; bottom:-.06em; height:.11em; border-radius:99px; background:linear-gradient(90deg,var(--gold),rgba(242,182,50,.0)); }
.bh .bh-hero .bh-lead { color:#eaf6ee; font-size:clamp(18px,1.9vw,22px); max-width:54ch; }
.bh .bh-hero .bh-cta { display:flex; flex-wrap:wrap; gap:14px; margin:34px 0 28px; }
.bh .bh-facts { display:flex; flex-wrap:wrap; gap:10px 22px; color:#eaf6ee; font-size:15.5px; font-weight:600; }
.bh .bh-facts span { display:inline-flex; align-items:center; gap:8px; }
.bh .bh-facts svg { width:20px; height:20px; color:var(--gold); }
.bh .bh-art { position:relative; justify-self:center; width:min(440px,100%); aspect-ratio:440/560; }
.bh .bh-arch { position:absolute; inset:0; border-radius:220px 220px 30px 30px; overflow:hidden; border:2px solid rgba(255,255,255,.28); box-shadow:0 40px 80px rgba(0,0,0,.35), inset 0 0 0 10px rgba(255,255,255,.05);
  background:
  radial-gradient(260px 260px at 50% 38%, rgba(242,182,50,.35), transparent 70%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.10' stroke-width='1.2'%3E%3Crect x='14' y='14' width='28' height='28'/%3E%3Crect x='14' y='14' width='28' height='28' transform='rotate(45 28 28)'/%3E%3C/g%3E%3C/svg%3E"),
  linear-gradient(170deg, #1d7a4c 0%, #0d3b22 100%); }
.bh .bh-arch .bh-emblem { position:absolute; left:50%; top:36%; width:64%; translate:-50% -50%; filter:drop-shadow(0 18px 30px rgba(0,0,0,.35)); animation:bh-float 7s ease-in-out infinite; }
.bh .bh-arch .bh-photo-note { position:absolute; left:0; right:0; bottom:22px; text-align:center; font-size:13px; color:#cfe6d6; letter-spacing:.04em; }
.bh .bh-arch .bh-photo-note b { display:block; color:#fff; font-size:15px; letter-spacing:0; }
.bh .bh-ring { position:absolute; inset:-26px; width:calc(100% + 52px); height:calc(100% + 52px); pointer-events:none; }
.bh .bh-ring .bh-spin { transform-origin:center; animation:bh-spin 80s linear infinite; }
.bh .bh-chip { position:absolute; display:flex; align-items:center; gap:10px; padding:10px 16px 10px 10px; border-radius:999px; background:#fff; color:var(--g900); font-weight:800; font-size:15px; box-shadow:0 14px 34px rgba(0,0,0,.28); animation:bh-float 6s ease-in-out infinite; white-space:nowrap; }
.bh .bh-chip i { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--g100); color:var(--g700); }
.bh .bh-chip i svg { width:20px; height:20px; }
.bh .bh-chip.bh-c1 { left:-40px; top:17%; animation-delay:-1s; }
.bh .bh-chip.bh-c2 { right:-34px; top:62%; animation-delay:-3s; }
.bh .bh-chip.bh-c3 { left:-24px; bottom:19%; animation-delay:-2s; }
.bh .bh-chip.bh-c4 { right:-14px; top:9%; animation-delay:-4s; }
.bh .bh-chip.bh-gold i { background:var(--gold-50); color:var(--gold-d); }
@keyframes bh-float { 50% { transform:translateY(-12px); } }
.bh .bh-quick { margin-top:-84px; position:relative; z-index:5; }
.bh .bh-quick .bh-row { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.bh .bh-q { display:flex; flex-direction:column; gap:10px; padding:26px 24px; background:#fff; border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); text-decoration:none; transition:transform .2s, box-shadow .2s, border-color .2s; position:relative; overflow:hidden; }
.bh .bh-q::before { content:""; position:absolute; left:0; top:0; right:0; height:5px; background:var(--g700); }
.bh .bh-q:nth-child(2)::before { background:var(--gold); }
.bh .bh-q:nth-child(3)::before { background:var(--navy); }
.bh .bh-q:nth-child(4)::before { background:#cc3366; }
.bh .bh-q:hover { transform:translateY(-6px); box-shadow:0 2px 4px rgba(13,59,34,.06), 0 24px 48px rgba(13,59,34,.16); border-color:var(--g200); }
.bh .bh-q .bh-ibox { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; background:var(--g100); color:var(--g700); }
.bh .bh-q:nth-child(2) .bh-ibox { background:var(--gold-50); color:var(--gold-d); }
.bh .bh-q:nth-child(3) .bh-ibox { background:#e8eefc; color:var(--navy); }
.bh .bh-q:nth-child(4) .bh-ibox { background:#fdeaf0; color:#cc3366; }
.bh .bh-q b { font-family:var(--serif); font-size:22px; color:var(--g900); line-height:1.15; }
.bh .bh-q small { color:var(--muted); font-size:15.5px; line-height:1.45; }
.bh .bh-q .bh-go { margin-top:auto; font-weight:800; color:var(--g700); display:flex; align-items:center; gap:8px; font-size:15.5px; }
.bh .bh-q .bh-go svg { width:18px; height:18px; transition:transform .2s; }
.bh .bh-q:hover .bh-go svg { transform:translateX(5px); }
.bh .bh-nums { padding:56px 0 8px; }
.bh .bh-nums .bh-row { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center; }
.bh .bh-num b { display:block; font-family:var(--serif); font-size:clamp(40px,5vw,60px); color:var(--g800); line-height:1; }
.bh .bh-num span { display:block; margin-top:10px; color:var(--muted); font-weight:700; font-size:15px; letter-spacing:.04em; text-transform:uppercase; }
.bh .bh-num + .bh-num { border-left:1px solid var(--line); }
.bh .bh-programs { background:linear-gradient(180deg, #fff 0%, var(--g50) 100%); }
.bh .bh-pgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.bh .bh-pc { position:relative; display:flex; flex-direction:column; gap:14px; padding:32px 30px 28px; background:#fff; border:1px solid var(--line); border-radius:26px; box-shadow:0 1px 2px rgba(13,59,34,.05); transition:transform .22s, box-shadow .22s, border-color .22s; overflow:hidden; }
.bh .bh-pc::after { content:""; position:absolute; right:-60px; top:-60px; width:170px; height:170px; border-radius:50%; background:var(--tint,var(--g100)); opacity:.7; transition:transform .4s; }
.bh .bh-pc:hover { transform:translateY(-8px); box-shadow:0 2px 4px rgba(13,59,34,.06), 0 28px 56px rgba(13,59,34,.15); border-color:var(--g200); }
.bh .bh-pc:hover::after { transform:scale(1.35); }
.bh .bh-pc > * { position:relative; z-index:1; }
.bh .bh-pc .bh-pi { width:62px; height:62px; border-radius:20px; display:grid; place-items:center; background:var(--tint,var(--g100)); color:var(--accent,var(--g700)); }
.bh .bh-pc .bh-pi svg { width:32px; height:32px; }
.bh .bh-pc h3 { font-size:27px; color:var(--g900); }
.bh .bh-pc p { margin:0; color:var(--muted); font-size:16.5px; }
.bh .bh-pc .bh-age { display:inline-block; align-self:flex-start; padding:4px 12px; border-radius:99px; background:var(--tint,var(--g100)); color:var(--accent,var(--g800)); font-size:13.5px; font-weight:800; }
.bh .bh-pc a.bh-more { margin-top:auto; padding-top:6px; font-weight:800; color:var(--g700); text-decoration:none; display:inline-flex; gap:8px; align-items:center; }
.bh .bh-pc a.bh-more svg { width:18px; height:18px; transition:transform .2s; }
.bh .bh-pc a.bh-more:hover svg { transform:translateX(5px); }
.bh .bh-pc .bh-new { position:absolute !important; right:20px; top:20px; z-index:2; background:var(--gold); color:#2a1d00; font-size:12.5px; font-weight:900; letter-spacing:.08em; padding:5px 12px; border-radius:99px; text-transform:uppercase; }
.bh .bh-pc.bh-t1 { --tint:#e3f5ea; --accent:#14663d; }
.bh .bh-pc.bh-t2 { --tint:#fff6dc; --accent:#7a5200; }
.bh .bh-pc.bh-t3 { --tint:#e8eefc; --accent:#29499b; }
.bh .bh-pc.bh-t4 { --tint:#fdeaf0; --accent:#b02a58; }
.bh .bh-pc.bh-t5 { --tint:#e6f4f7; --accent:#0e5f75; }
.bh .bh-pc.bh-t6 { --tint:#efe9fb; --accent:#583aa0; }
.bh .bh-values .bh-split { display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(32px,5vw,72px); align-items:center; }
.bh .bh-values blockquote { margin:26px 0 0; padding:6px 0 6px 22px; border-left:5px solid var(--gold); font-family:var(--serif); font-size:clamp(22px,2.4vw,28px); line-height:1.3; color:var(--g800); }
.bh .bh-vcards { display:grid; gap:16px; }
.bh .bh-vc { display:flex; gap:20px; align-items:flex-start; padding:24px 26px; border-radius:22px; background:var(--g50); border:1px solid var(--line); transition:transform .2s, background .2s; }
.bh .bh-vc:hover { transform:translateX(8px); background:#fff; }
.bh .bh-vc .bh-vi { width:60px; height:60px; border-radius:50%; background:#fff; color:var(--g700); display:grid; place-items:center; flex:none; box-shadow:0 6px 16px rgba(13,59,34,.10); }
.bh .bh-vc .bh-vi svg { width:30px; height:30px; }
.bh .bh-vc b { font-family:var(--serif); font-size:23px; color:var(--g900); display:block; }
.bh .bh-vc p { margin:4px 0 0; color:var(--muted); font-size:16.5px; }
.bh .bh-join { background:var(--g900); color:#fff; overflow:hidden; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.06' stroke-width='1.2'%3E%3Crect x='18' y='18' width='36' height='36'/%3E%3Crect x='18' y='18' width='36' height='36' transform='rotate(45 36 36)'/%3E%3C/g%3E%3C/svg%3E"); }
.bh .bh-join h2 { color:#fff; }
.bh .bh-join .bh-lead { color:#cfe6d6; }
.bh .bh-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; position:relative; counter-reset:s; }
.bh .bh-steps::before { content:""; position:absolute; left:16%; right:16%; top:38px; height:2px; background:repeating-linear-gradient(90deg, rgba(255,255,255,.4) 0 10px, transparent 10px 20px); }
.bh .bh-st { position:relative; text-align:center; padding:0 10px; }
.bh .bh-st .bh-n { width:78px; height:78px; margin:0 auto 22px; border-radius:50%; background:var(--gold); color:#2a1d00; font-family:var(--serif); font-size:34px; font-weight:700; display:grid; place-items:center; box-shadow:0 0 0 10px rgba(242,182,50,.18); }
.bh .bh-st h3 { color:#fff; font-size:25px; margin-bottom:8px; }
.bh .bh-st p { margin:0 auto; color:#cfe6d6; max-width:30ch; font-size:16.5px; }
.bh .bh-join .bh-cta { margin-top:48px; text-align:center; }
.bh .bh-dates .bh-split { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,5vw,72px); align-items:start; }
.bh .bh-evs { display:grid; gap:14px; }
.bh .bh-ev { display:flex; gap:20px; align-items:center; padding:16px 22px 16px 16px; border:1px solid var(--line); border-radius:20px; background:#fff; transition:transform .2s, box-shadow .2s; }
.bh .bh-ev:hover { transform:translateX(6px); box-shadow:var(--shadow); }
.bh .bh-ev .bh-d { width:72px; flex:none; text-align:center; border-radius:16px; background:var(--g100); color:var(--g800); padding:8px 0 10px; }
.bh .bh-ev .bh-d small { display:block; font-size:12.5px; letter-spacing:.1em; font-weight:800; text-transform:uppercase; }
.bh .bh-ev .bh-d b { display:block; font-family:var(--serif); font-size:32px; line-height:1; }
.bh .bh-ev b.bh-t { display:block; font-size:18.5px; color:var(--g900); }
.bh .bh-ev span.bh-m { color:var(--muted); font-size:15.5px; }
.bh .bh-ev.bh-closed .bh-d { background:#fff0e3; color:#9a4a00; }
.bh .bh-ev.bh-key .bh-d { background:var(--gold-50); color:#8a5b00; }
.bh .bh-tag { display:inline-block; margin-left:8px; padding:2px 10px; border-radius:99px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; vertical-align:2px; }
.bh .bh-tag.bh-c { background:#ffe6cc; color:#8a3d00; }
.bh .bh-tag.bh-s { background:var(--g100); color:var(--g800); }
.bh .bh-panels { background:var(--g50); }
.bh .bh-pn2 { display:grid; grid-template-columns:1.15fr .85fr; gap:24px; }
.bh .bh-panel { background:#fff; border:1px solid var(--line); border-radius:26px; padding:34px; box-shadow:var(--shadow); }
.bh .bh-panel h3 { font-size:29px; color:var(--g900); margin-bottom:6px; }
.bh .bh-panel > p { margin:0 0 22px; color:var(--muted); }
.bh .bh-links { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.bh .bh-panel.bh-one .bh-links { grid-template-columns:1fr; }
.bh .bh-lk { display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px; border:1px solid var(--line); text-decoration:none; font-weight:700; color:var(--ink); background:#fff; transition:background .18s, border-color .18s, transform .18s; min-height:60px; }
.bh .bh-lk:hover { background:var(--g50); border-color:var(--g200); transform:translateY(-2px); }
.bh .bh-lk i { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:var(--g100); color:var(--g700); flex:none; }
.bh .bh-lk i svg { width:22px; height:22px; }
.bh .bh-lk small { display:block; font-weight:500; color:var(--muted); font-size:14px; line-height:1.3; }
.bh .bh-lk.bh-hl { background:var(--g800); color:#fff; border-color:var(--g800); }
.bh .bh-lk.bh-hl i { background:rgba(255,255,255,.14); color:var(--gold); }
.bh .bh-lk.bh-hl small { color:#cfe6d6; }
.bh .bh-lk.bh-hl:hover { background:var(--g900); }
.bh .bh-lk.bh-wide { grid-column:1 / -1; }
.bh .bh-youth { background:linear-gradient(135deg,#102a52 0%, #203b6a 55%, #29499b 100%); color:#fff; overflow:hidden; }
.bh .bh-youth .bh-split { display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); align-items:center; }
.bh .bh-youth h2 { color:#fff; margin:16px 0; }
.bh .bh-youth .bh-lead { color:#d7e0f7; }
.bh .bh-youth ul { list-style:none; padding:0; margin:26px 0 32px; display:grid; gap:14px; }
.bh .bh-youth li { display:flex; gap:14px; align-items:flex-start; font-size:18px; font-weight:600; }
.bh .bh-youth li i { width:30px; height:30px; border-radius:50%; background:var(--gold); color:#2a1d00; display:grid; place-items:center; flex:none; margin-top:1px; }
.bh .bh-youth li i svg { width:18px; height:18px; stroke-width:2.6; }
.bh .bh-youth .bh-cta { display:flex; flex-wrap:wrap; gap:14px; }
.bh .bh-hub { position:relative; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); border-radius:28px; padding:30px; backdrop-filter:blur(6px); }
.bh .bh-hub h3 { color:#fff; font-size:26px; }
.bh .bh-hub p { color:#d7e0f7; margin:6px 0 20px; font-size:16px; }
.bh .bh-mock { background:#fff; color:var(--ink); border-radius:18px; padding:20px; box-shadow:0 24px 48px rgba(0,0,0,.3); }
.bh .bh-mock .bh-mh { display:flex; align-items:center; gap:10px; font-weight:800; color:var(--g900); margin-bottom:14px; }
.bh .bh-mock .bh-mh i { width:34px; height:34px; border-radius:10px; background:var(--g100); color:var(--g700); display:grid; place-items:center; }
.bh .bh-mock .bh-mh svg { width:20px; height:20px; }
.bh .bh-mock .bh-row { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; border-radius:12px; background:var(--g50); margin-top:8px; font-size:15px; font-weight:600; }
.bh .bh-mock .bh-row span { color:var(--muted); font-weight:500; font-size:14px; }
.bh .bh-mock .bh-pill { background:var(--g100); color:var(--g800); padding:3px 10px; border-radius:99px; font-size:12.5px; font-weight:800; }
.bh .bh-voices .bh-vg { display:flex; flex-wrap:wrap; justify-content:center; gap:24px; }
.bh .bh-voices .bh-vq { flex:1 1 300px; max-width:390px; }
.bh .bh-vq { position:relative; padding:34px 30px 28px; border-radius:26px; background:var(--g50); border:1px solid var(--line); }
.bh .bh-vq::before { content:"\201C"; position:absolute; left:24px; top:-6px; font-family:var(--serif); font-size:96px; line-height:1; color:var(--gold); }
.bh .bh-vq p { margin:34px 0 20px; font-family:var(--serif); font-size:21px; line-height:1.4; color:var(--g900); }
.bh .bh-vq figcaption { display:flex; align-items:center; gap:12px; font-weight:700; }
.bh .bh-vq figcaption i { width:44px; height:44px; border-radius:50%; background:var(--g200); color:var(--g800); display:grid; place-items:center; font-style:normal; font-family:var(--serif); }
.bh .bh-vq figcaption small { display:block; color:var(--muted); font-weight:500; }
.bh .bh-faq { background:var(--g50); }
.bh .bh-faq .bh-split { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,5vw,72px); align-items:start; }
.bh details.bh-q2 { background:#fff; border:1px solid var(--line); border-radius:18px; margin-bottom:12px; transition:box-shadow .2s, border-color .2s; }
.bh details.bh-q2[open] { box-shadow:var(--shadow); border-color:var(--g200); }
.bh details.bh-q2 summary { list-style:none; cursor:pointer; padding:20px 24px; font-weight:800; font-size:18.5px; color:var(--g900); display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:64px; }
.bh details.bh-q2 summary::-webkit-details-marker { display:none; }
.bh details.bh-q2 summary i { width:34px; height:34px; border-radius:50%; background:var(--g100); color:var(--g700); display:grid; place-items:center; flex:none; transition:transform .25s, background .25s; }
.bh details.bh-q2[open] summary i { transform:rotate(45deg); background:var(--gold); color:#2a1d00; }
.bh details.bh-q2 summary i svg { width:18px; height:18px; stroke-width:2.6; }
.bh details.bh-q2 .bh-a { padding:0 24px 22px; color:var(--muted); font-size:17px; }
.bh .bh-visit .bh-split { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.bh .bh-vinfo { padding:clamp(28px,4vw,48px); border-radius:28px; background:var(--g800); color:#fff; display:flex; flex-direction:column; gap:22px; }
.bh .bh-vinfo h2 { color:#fff; }
.bh .bh-vrow { display:flex; gap:16px; align-items:flex-start; }
.bh .bh-vrow i { width:46px; height:46px; border-radius:14px; background:rgba(255,255,255,.12); color:var(--gold); display:grid; place-items:center; flex:none; }
.bh .bh-vrow svg { width:24px; height:24px; }
.bh .bh-vrow b { display:block; font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:#ffe9a8; }
.bh .bh-vrow span,
.bh .bh-vrow a { font-size:18px; color:#fff; text-decoration:none; }
.bh .bh-vrow a:hover { text-decoration:underline; }
.bh .bh-vinfo .bh-cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:6px; }
.bh .bh-map { position:relative; min-height:420px; border-radius:28px; overflow:hidden; border:1px solid var(--line); background:#eaf3ec; }
.bh .bh-map svg.bh-bg { position:absolute; inset:0; width:100%; height:100%; }
.bh .bh-pin { position:absolute; left:52%; top:46%; transform:translate(-50%,-100%); text-align:center; }
.bh .bh-pin .bh-bubble { background:#fff; border-radius:16px; padding:12px 18px; box-shadow:0 14px 34px rgba(13,59,34,.25); font-weight:800; color:var(--g900); white-space:nowrap; position:relative; }
.bh .bh-pin .bh-bubble small { display:block; font-weight:600; color:var(--muted); font-size:13.5px; }
.bh .bh-pin .bh-bubble::after { content:""; position:absolute; left:50%; bottom:-9px; width:18px; height:18px; background:#fff; transform:translateX(-50%) rotate(45deg); }
.bh .bh-pin .bh-mk { margin:18px auto 0; width:22px; height:22px; border-radius:50%; background:var(--g700); border:4px solid #fff; box-shadow:0 0 0 0 rgba(29,122,76,.5); animation:bh-pulse2 2.4s infinite; }
@keyframes bh-pulse2 { 70% { box-shadow:0 0 0 22px rgba(29,122,76,0); } 100% { box-shadow:0 0 0 0 rgba(29,122,76,0); } }
.bh .bh-final { text-align:center; color:#fff; overflow:hidden; background:radial-gradient(700px 360px at 50% 0%, rgba(242,182,50,.28), transparent 70%), linear-gradient(140deg,var(--g950),var(--g800)); }
.bh .bh-final h2 { color:#fff; font-size:clamp(34px,5vw,58px); max-width:20ch; margin:0 auto 16px; }
.bh .bh-final p { color:#d6eadb; max-width:56ch; margin:0 auto 32px; font-size:19px; }
.bh .bh-final .bh-cta { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.bh footer h4 { margin:0 0 14px; color:#fff; font-size:15px; letter-spacing:.1em; text-transform:uppercase; }
.bh footer a { display:block; padding:5px 0; text-decoration:none; color:#b9d3c2; }
.bh footer a:hover { color:#fff; text-decoration:underline; }
.bh .bh-mbar { display:none; }
html.bh-js .bh .bh-rv { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
html.bh-js .bh .bh-rv.bh-in { opacity:1; transform:none; }
.bh .bh-rv.bh-d1 { transition-delay:.08s; }
.bh .bh-rv.bh-d2 { transition-delay:.16s; }
.bh .bh-rv.bh-d3 { transition-delay:.24s; }
.bh .bh-rv.bh-d4 { transition-delay:.32s; }
.bh .bh-rv.bh-d5 { transition-delay:.4s; }
@media (max-width:1060px) {
.bh .bh-hero .bh-grid { grid-template-columns:1fr; }
.bh .bh-art { width:min(380px,86%); margin-top:10px; }
.bh .bh-quick .bh-row { grid-template-columns:repeat(2,1fr); }
.bh .bh-pgrid { grid-template-columns:repeat(2,1fr); }
.bh .bh-values .bh-split,
.bh .bh-dates .bh-split,
.bh .bh-faq .bh-split,
.bh .bh-visit .bh-split,
.bh .bh-youth .bh-split,
.bh .bh-pn2 { grid-template-columns:1fr; }
.bh .bh-voices .bh-vg { grid-template-columns:1fr; }
}
@media (max-width:720px) {
.bh-home { font-size:16.5px; padding-bottom:0; }
.bh .bh-arch .bh-emblem { top:45%; width:58%; }
.bh .bh-chip.bh-c1 { top:3%; }
.bh .bh-chip.bh-c4 { top:15%; }
.bh .bh-chip.bh-c2 { top:64%; }
.bh .bh-chip.bh-c3 { bottom:17%; }
.bh .bh-chip { font-size:13px; padding:7px 12px 7px 7px; }
.bh .bh-chip i { width:28px; height:28px; }
.bh .bh-chip.bh-c1 { left:-6px; }
.bh .bh-chip.bh-c2 { right:-6px; }
.bh .bh-chip.bh-c3 { left:-4px; }
.bh .bh-chip.bh-c4 { right:-2px; }
.bh .bh-quick { margin-top:-64px; }
.bh .bh-quick .bh-row,
.bh .bh-pgrid,
.bh .bh-links,
.bh .bh-steps { grid-template-columns:1fr; }
.bh .bh-nums .bh-row { grid-template-columns:1fr 1fr; gap:28px 12px; }
.bh .bh-num + .bh-num { border-left:0; }
.bh .bh-steps::before { display:none; }
.bh .bh-st { text-align:left; display:grid; grid-template-columns:78px 1fr; column-gap:18px; }
.bh .bh-st .bh-n { margin:0; width:64px; height:64px; font-size:28px; }
.bh .bh-st p { margin:0; max-width:none; }
.bh .bh-st h3 { grid-column:2; }
.bh .bh-st .bh-n { grid-row:1 / span 2; }
.bh .bh-panel { padding:24px 20px; }
.bh .bh-ev { padding:12px 14px 12px 12px; gap:14px; }
.bh .bh-ev .bh-d { width:62px; }
.bh .bh-mbar { display:grid; grid-template-columns:1.2fr 1fr; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:150; padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px)); background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-top:1px solid var(--line); box-shadow:0 -10px 30px rgba(13,59,34,.12); }
}
@media (prefers-reduced-motion:reduce) {
.bh .bh-rv { opacity:1; transform:none; }
}
html:has(.bh-home) { scroll-behavior:smooth; scroll-padding-top:110px; }
.bh-home { width:100vw; max-width:none; margin-left:calc(50% - 50vw); }
html:has(.bh-home) body { overflow-x:clip; }

/* the arch holds a real photo when one is chosen in Settings, otherwise the school's logo */
.bh .bh-arch .bh-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.bh .bh-arch .bh-logo-card { position:absolute; left:50%; top:45%; width:64%; aspect-ratio:1; translate:-50% -50%; padding:16px; background:#fff; border-radius:30px; box-shadow:0 24px 50px rgba(0,0,0,.30); animation:bh-float 7s ease-in-out infinite; display:grid; place-items:center; }
.bh .bh-arch .bh-logo-card img { width:100%; height:100%; object-fit:contain; display:block; }
/* optional: photos of the school, shown only once real ones have been chosen */
.bh .bh-lifepics { background:#fff; }
.bh .bh-gal { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:210px; gap:14px; }
.bh .bh-gal figure { margin:0; border-radius:22px; overflow:hidden; box-shadow:var(--shadow); background:var(--g50); }
.bh .bh-gal.bh-c3, .bh .bh-gal.bh-c6 { grid-template-columns:repeat(3,1fr); }
.bh .bh-gal.bh-c5 figure:first-child { grid-column:span 2; grid-row:span 2; }
.bh .bh-gal img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s; }
.bh .bh-gal figure:hover img { transform:scale(1.05); }
@media (max-width:1060px) { .bh .bh-gal { grid-template-columns:repeat(2,1fr); grid-auto-rows:170px; } }
@media (max-width:720px) { .bh .bh-gal { grid-template-columns:repeat(2,1fr); grid-auto-rows:130px; gap:10px; } .bh .bh-arch .bh-logo-card { top:44%; width:60%; } }

/* the planned new building */
.bh .bh-newhome { background:linear-gradient(180deg,#fff 0%, var(--g50) 100%); }
.bh .bh-newhome .bh-split { display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(32px,5vw,72px); align-items:center; }
.bh .bh-frame { margin:0; position:relative; border-radius:28px; overflow:hidden; box-shadow:0 2px 4px rgba(13,59,34,.06), 0 28px 60px rgba(13,59,34,.18); background:#fff; }
.bh .bh-frame img { display:block; width:100%; height:auto; transition:transform .6s; }
.bh .bh-frame:hover img { transform:scale(1.03); }
.bh .bh-frame figcaption { display:block; padding:12px 20px; background:#fff; color:var(--muted); font-size:14px; font-weight:600; border-top:1px solid var(--line); }
@media (max-width:1060px) { .bh .bh-newhome .bh-split { grid-template-columns:1fr; } }

/* two photos side by side */
.bh .bh-gal.bh-c2 { grid-template-columns:repeat(2,1fr); grid-auto-rows:clamp(220px,26vw,360px); }
@media (max-width:720px) { .bh .bh-gal.bh-c2 { grid-template-columns:1fr; grid-auto-rows:240px; } }

/* an optional video */
.bh .bh-video { background:#fff; }
.bh .bh-vframe { max-width:960px; margin:0 auto; border-radius:26px; overflow:hidden; background:#0a2e1a; box-shadow:0 2px 4px rgba(13,59,34,.06), 0 28px 60px rgba(13,59,34,.22); }
.bh .bh-vframe video { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#0a2e1a; }

/* parent and teacher quotes: a tidy masonry when there are many */
.bh .bh-voices .bh-vg.bh-many { display:block; columns:3; column-gap:24px; }
.bh .bh-voices .bh-vg.bh-many .bh-vq { display:inline-block; width:100%; max-width:none; margin:0 0 24px !important; break-inside:avoid; }
.bh .bh-vq .bh-vtag { display:inline-block; margin:6px 0 0 54px; padding:3px 12px; border-radius:99px; background:var(--g100); color:var(--g800); font-size:12.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.bh .bh-vq p { font-size:19px; }
@media (max-width:1060px) { .bh .bh-voices .bh-vg.bh-many { columns:2; } }
@media (max-width:720px) { .bh .bh-voices .bh-vg.bh-many { columns:1; } .bh .bh-vq p { font-size:18px; } }

/* PHONE QUICK BAR (v2.0): slim, hidden until the visitor has scrolled past the top of the page, slides
   away while scrolling down, returns on scrolling up, hides near the closing call to action, and
   can be dismissed with the x. It never sits on top of the first screen. */
@media (max-width:720px) {
	.bh .bh-mbar { display:flex; gap:8px; align-items:center; position:fixed; left:0; right:0; bottom:0; z-index:150; padding:7px 10px calc(7px + env(safe-area-inset-bottom, 0px)); background:rgba(255,255,255,.97); border-top:1px solid var(--line); box-shadow:0 -8px 24px rgba(13,59,34,.12); transform:translateY(110%); opacity:0; pointer-events:none; transition:transform .25s ease, opacity .25s ease; }
	.bh .bh-mbar.bh-show { transform:none; opacity:1; pointer-events:auto; }
	.bh .bh-mbar .bh-btn { flex:1 1 0; min-height:42px; padding:0 10px; font-size:15px; box-shadow:none; }
	.bh .bh-mbar .bh-mbar-x { flex:none; width:42px; height:42px; padding:0; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--muted); font-size:22px; line-height:1; cursor:pointer; }
}
@media (min-width:721px) { .bh .bh-mbar { display:none; } }