:root{
  --navy:#171717; --blue:#d96516; --gold:#f58220; --gold2:#ffb15c;
  --ink:#12233f; --muted:#617089; --paper:#f7f9fc; --white:#fff;
  --line:#e7edf5; --shadow:0 18px 50px rgba(8,43,92,.12);
  --radius:22px; --max:1180px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:var(--white);line-height:1.65}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
.container{width:min(var(--max),92%);margin:auto}
.topbar{background:var(--navy);color:#dbe8f7;font-size:13px}
.topbar .container{display:flex;justify-content:flex-end;gap:22px;padding:8px 0}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;color:var(--navy)}
.crest{width:58px;height:58px;border:3px solid var(--navy);border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#fff,var(--gold2));font-size:11px;text-align:center;line-height:1.05}
.brand span{display:block}.brand small{font-weight:600;color:var(--muted);font-size:11px;letter-spacing:.3px}
nav{display:flex;align-items:center;gap:22px;font-weight:700;font-size:14px}
nav a{padding:8px 0;border-bottom:3px solid transparent}nav a:hover{border-color:var(--gold)}
.menu{display:none;border:0;background:var(--navy);color:#fff;padding:10px 13px;border-radius:10px}
.hero{background:
 radial-gradient(circle at 80% 20%,rgba(245,189,34,.24),transparent 28%),
 linear-gradient(120deg,#171717,#3b2417 55%,#d96516);
 color:white;padding:92px 0 70px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:center}
.kicker{color:var(--gold2);font-weight:800;letter-spacing:2px;text-transform:uppercase;font-size:13px}
h1{font-size:clamp(42px,6vw,72px);line-height:1.02;margin:14px 0 20px;letter-spacing:-2px}
.hero p{font-size:19px;color:#dce9f8;max-width:650px}
.btns{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 19px;border-radius:12px;font-weight:800;border:1px solid transparent}
.btn.primary{background:var(--gold);color:#10284d}.btn.ghost{border-color:#8fb0d1;color:#fff}
.visual{min-height:390px;border-radius:32px;position:relative;overflow:hidden;background:
 linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.02)),
 repeating-linear-gradient(45deg,rgba(255,255,255,.07) 0 1px,transparent 1px 14px);
 border:1px solid rgba(255,255,255,.2);box-shadow:0 25px 80px rgba(0,0,0,.2)}
.visual:after{content:"ABLE ACADEMY";position:absolute;inset:auto 22px 22px 22px;background:rgba(8,43,92,.86);padding:15px 18px;border-radius:16px;font-weight:900;letter-spacing:1px}
.photo-note{position:absolute;inset:0;display:grid;place-items:center;color:#dce9f8;text-align:center;padding:30px;font-weight:700}
.feature-strip{background:#fff;box-shadow:var(--shadow);margin-top:-30px;position:relative;border-radius:20px;padding:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px}
.feature{padding:18px;border-right:1px solid var(--line)}.feature:last-child{border:0}
.feature strong{display:block;color:var(--navy);margin-bottom:5px}.feature span{font-size:13px;color:var(--muted)}
section{padding:84px 0}.eyebrow{color:var(--blue);font-size:13px;font-weight:900;letter-spacing:1.8px;text-transform:uppercase}
h2{font-size:clamp(30px,4vw,48px);line-height:1.08;margin:9px 0 16px;color:var(--navy)}
.lead{color:var(--muted);max-width:760px;font-size:17px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 12px 35px rgba(8,43,92,.07)}
.quote{border-left:5px solid var(--gold);padding-left:20px;font-size:18px;color:#334866}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.program{overflow:hidden;padding:0}.program .ph{height:190px;background:linear-gradient(135deg,#0b3d78,#7aa1c9);display:grid;place-items:center;color:#fff;font-size:42px;font-weight:900}.program .body{padding:24px}
.program h3{margin:0 0 8px;color:var(--navy)}
.achievements{background:var(--navy);color:#fff}.achievements h2{color:#fff}
.ach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.ach{padding:25px;border:1px solid rgba(255,255,255,.13);border-radius:18px;background:rgba(255,255,255,.05)}
.ach b{display:block;color:var(--gold2);font-size:18px;margin-bottom:8px}
.page-hero{background:linear-gradient(120deg,#171717,#d96516);color:#fff;padding:70px 0}
.page-hero h1{font-size:clamp(38px,5vw,58px)}
.list{display:grid;gap:16px}.list .card h3{color:var(--navy);margin-top:0}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.news-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(8,43,92,.07)}.news-img{height:180px;background:linear-gradient(135deg,var(--navy),#5383b3);display:grid;place-items:center;color:#fff;font-weight:900}.news-body{padding:22px}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tile{min-height:230px;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,#0c3d75,#c9d9ea);position:relative}.tile span{position:absolute;left:15px;right:15px;bottom:15px;background:rgba(8,43,92,.86);color:#fff;padding:10px 13px;border-radius:12px;font-weight:700}
.form{display:grid;gap:15px}.form input,.form textarea,.form select{width:100%;padding:14px;border:1px solid #d8e1ed;border-radius:11px;font:inherit}.form textarea{min-height:150px}
footer{background:#171717;color:#c9d7e8;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:35px}.footer-title{color:#fff;font-weight:900;margin-bottom:12px}footer a:hover{color:var(--gold2)}.copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:35px;padding-top:18px;font-size:13px}
.note{font-size:13px;color:var(--muted);background:#f4f7fb;border:1px dashed #cbd7e5;padding:13px 15px;border-radius:12px}
@media(max-width:850px){
 nav{display:none;position:absolute;left:4%;right:4%;top:82px;background:#fff;padding:16px;border-radius:16px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
 nav.open{display:flex}.menu{display:block}.hero-grid,.two{grid-template-columns:1fr}.feature-strip{grid-template-columns:1fr 1fr}.grid3,.news-grid,.gallery{grid-template-columns:1fr 1fr}.ach-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){.feature-strip,.grid3,.news-grid,.gallery,.ach-grid,.footer-grid{grid-template-columns:1fr}.hero{padding-top:60px}.visual{min-height:280px}section{padding:60px 0}.topbar .container{justify-content:center}}

.logo-img{width:245px;height:76px;object-fit:contain;object-position:left center;background:#fff;border-radius:8px}
.social-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.social-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;background:#fff1e8;color:#b84e0e;font-weight:800;border:1px solid #ffd2b7}
.fb-panel{margin-top:24px;background:linear-gradient(135deg,#fff8f3,#fff);border:1px solid #f2d9c8;border-radius:22px;padding:28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
@media(max-width:560px){.logo-img{width:205px;height:68px}.fb-panel{flex-direction:column;align-items:flex-start}}

/* V3 real-photo carousel and gallery */
.hero-carousel{position:relative;min-height:650px;padding:0;overflow:hidden;background:#171717}
.hero-slides,.hero-slide{position:absolute;inset:0}
.hero-slide{opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s ease}
.hero-slide.active{opacity:1;visibility:visible}
.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center}
.slide-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.58) 42%,rgba(0,0,0,.18) 100%),linear-gradient(0deg,rgba(217,101,22,.25),transparent 50%)}
.slide-copy{position:absolute;z-index:2;left:4%;top:50%;transform:translateY(-50%);max-width:720px;color:#fff}
.slide-copy h1,.slide-copy h2{color:#fff}
.slide-copy h2{font-size:clamp(42px,6vw,68px);line-height:1.02;margin:14px 0 20px;letter-spacing:-2px}
.slide-copy p{font-size:19px;color:#f2f5f8;max-width:650px}
.carousel-arrow{position:absolute;z-index:4;top:50%;transform:translateY(-50%);width:50px;height:50px;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.3);color:#fff;border-radius:50%;font-size:38px;line-height:38px;cursor:pointer;backdrop-filter:blur(6px)}
.carousel-arrow.prev{left:22px}.carousel-arrow.next{right:22px}
.carousel-dots{position:absolute;z-index:4;bottom:28px;left:4%;display:flex;gap:8px}
.dot{width:34px;height:5px;border:0;border-radius:8px;background:rgba(255,255,255,.45);cursor:pointer;padding:0}.dot.active{background:var(--gold)}
.image-ph{height:190px!important;padding:0!important;overflow:hidden}.image-ph img{width:100%;height:100%;object-fit:cover}
.photo-band{background:#fff}
.photo-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr 1.15fr;gap:16px;margin-top:28px}
.photo-grid figure{margin:0;position:relative;border-radius:18px;overflow:hidden;min-height:240px;background:#eee}
.photo-grid figure:nth-child(2),.photo-grid figure:nth-child(3){min-height:300px}
.photo-grid img{width:100%;height:100%;min-height:240px;object-fit:cover}
.photo-grid figcaption{position:absolute;left:12px;right:12px;bottom:12px;background:rgba(0,0,0,.72);color:#fff;border-radius:10px;padding:9px 11px;font-weight:800}
.real-gallery{grid-auto-flow:dense}.photo-tile{min-height:280px}.photo-tile.wide{grid-column:span 2}.photo-tile img{width:100%;height:100%;min-height:280px;object-fit:cover}.photo-tile figcaption{position:absolute;left:15px;right:15px;bottom:15px;background:rgba(0,0,0,.72);color:#fff;padding:10px 13px;border-radius:11px;font-weight:800}
.about-photo{background:linear-gradient(180deg,#fff,#fff8f3)}.about-photo-wrap,.image-card{border-radius:24px;overflow:hidden;box-shadow:0 18px 50px rgba(8,43,92,.14)}.about-photo-wrap img,.image-card img{width:100%;height:100%;object-fit:cover;min-height:360px}
@media(max-width:850px){.hero-carousel{min-height:620px}.photo-grid{grid-template-columns:1fr 1fr}.photo-tile.wide{grid-column:span 1}}
@media(max-width:560px){.hero-carousel{min-height:650px}.slide-copy{left:7%;right:7%}.slide-copy h1,.slide-copy h2{font-size:42px}.slide-copy p{font-size:16px}.carousel-arrow{width:42px;height:42px;font-size:30px}.carousel-arrow.prev{left:12px}.carousel-arrow.next{right:12px}.photo-grid{grid-template-columns:1fr}.photo-grid figure,.photo-grid figure:nth-child(2),.photo-grid figure:nth-child(3){min-height:260px}.photo-grid img{min-height:260px}}

/* Accessible labels for form controls */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}