:root{
  --navy:#163A6B; --navy-deep:#002060; --blue:#1E72C8; --blue-readable:#155a9e; --sky:#4FB3E8; --aqua:#16B8A6;
  --ink:#0F1B2D; --slate:#5A6B82; --mist:#EEF4FA; --cloud:#F7FAFD; --white:#fff;
  --line:#DCE6F0; --sun:#F6A91B; --success:#1E9E6A;
  --maxw:1180px; --radius:16px; --shadow:0 10px 30px rgba(16,40,80,.10);
  --shadow-sm:0 4px 14px rgba(16,40,80,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--white);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
@media(max-width:540px){body{font-size:16px}}
h1,h2,h3{font-family:Poppins,Inter,sans-serif;line-height:1.15;color:var(--navy);letter-spacing:-.01em}
.accent{font-family:Fraunces,Georgia,serif;font-style:italic;font-weight:600;letter-spacing:0}
h1{font-size:clamp(2.3rem,5vw,3.8rem)}
h2{font-size:clamp(1.9rem,3.5vw,2.6rem)}
h3{font-size:1.2rem}
p{max-width:64ch}
a{color:var(--blue);text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;font-weight:600;font-family:Inter;border-radius:999px;padding:.85rem 1.5rem;border:2px solid transparent;cursor:pointer;transition:.18s ease;font-size:1rem}
/* keyboard focus ring (WCAG 2.4.7) */
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:3px solid #ffce4f;outline-offset:2px;border-radius:6px}
.mobile-menu a:focus-visible{outline-offset:-3px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:#1A63B0;transform:translateY(-1px)}
.btn-sun{background:var(--sun);color:#3a2600}
.btn-sun:hover{background:#e89c0c;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-outline{background:#fff;color:var(--navy);border-color:var(--line)}
.btn-outline:hover{border-color:var(--blue);color:var(--blue)}
/* on dark hero, secondary needs light treatment */
.hero .actions .btn-ghost{border-color:rgba(255,255,255,.85);background:rgba(8,24,60,.28);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.hero .actions .btn-ghost:hover{background:rgba(255,255,255,.16)}
.eyebrow{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem;color:var(--blue-readable)}

/* HEADER */
header{position:sticky;top:0;z-index:50;background:rgba(22,58,107,.97);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.brand{display:flex;align-items:center;gap:.65rem}
.brand img{height:38px;width:38px;border-radius:9px}
.brand b{color:#fff;font-family:Poppins;font-weight:700;font-size:1.05rem;letter-spacing:.02em}
.nav nav{display:flex;gap:1.6rem;align-items:center}
.nav nav a{color:#dce7f5;font-weight:500;font-size:.97rem}
.nav nav a:hover{color:#fff}
.nav .cta{display:flex;gap:.6rem;align-items:center}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:1.7rem;cursor:pointer;line-height:1;min-width:44px;min-height:44px;align-items:center;justify-content:center;border-radius:8px;padding:0}
.menu-btn:active{background:rgba(255,255,255,.1)}
/* mobile drawer */
.mobile-menu{display:none;background:var(--navy-deep);border-top:1px solid rgba(255,255,255,.1)}
.mobile-menu.open{display:block}
.mobile-menu a{display:block;color:#dce7f5;font-weight:500;padding:.95rem 22px;border-bottom:1px solid rgba(255,255,255,.07);font-size:1.02rem}
.mobile-menu a:hover{color:#fff;background:rgba(255,255,255,.05)}
.mobile-menu .m-join{margin:.9rem 22px 1.2rem;display:block;text-align:center;border:0}
@media(max-width:920px){
  .nav nav{display:none}
  .nav .cta .btn-outline{display:none}
  .menu-btn{display:inline-flex}
}
@media(min-width:921px){
  .mobile-menu{display:none !important}
}
/* Narrow phones: drop the inline Join pill so brand + hamburger own the 68px bar (Join still in drawer + hero) */
@media(max-width:480px){
  .nav .cta .btn-sun{display:none}
  .nav{height:60px}
  .brand b{font-size:1rem}
}

/* HERO */
.hero{position:relative;color:#fff;background:var(--navy-deep)}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(0,22,68,.90) 0%,rgba(0,26,80,.62) 42%,rgba(20,54,102,.24) 100%),image-set(url(assets/pacc-exterior-dusk.webp) type("image/webp"), url(assets/pacc-exterior-dusk.jpg) type("image/jpeg")) center/cover;}
@media(max-width:820px){.hero::before{background:linear-gradient(178deg,rgba(0,22,68,.86) 0%,rgba(0,26,80,.62) 55%,rgba(20,54,102,.40) 100%),image-set(url(assets/pacc-exterior-dusk.webp) type("image/webp"), url(assets/pacc-exterior-dusk.jpg) type("image/jpeg")) center/cover;}}
.hero-inner{position:relative;padding-top:clamp(3.5rem,8vw,6.5rem);padding-bottom:clamp(4rem,9vw,7rem)}
.hero h1{color:#fff;max-width:16ch}
.hero p.lede{font-size:clamp(1.05rem,2vw,1.3rem);color:#dbe7f6;max-width:54ch;margin:1.1rem 0 1.8rem}
.hero .actions{display:flex;flex-wrap:wrap;gap:.8rem}
.hero .actions .btn{font-size:1.05rem;padding:1rem 1.7rem}
.trust{display:flex;flex-wrap:wrap;gap:.8rem 1.4rem;margin-top:2.2rem;color:#cfe0f4;font-size:.93rem;font-weight:500}
.trust span{display:flex;align-items:center;gap:.45rem}
@media(max-width:560px){.trust{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1rem}.trust span{font-size:.86rem}}

/* QUICK FACTS BAR */
.facts{background:var(--navy);color:#fff}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.12)}
.fact{background:var(--navy);padding:1.1rem 1.2rem;text-align:center;min-width:0}
.fact .k{font-family:Poppins;font-weight:700;color:#fff;font-size:1.05rem;overflow-wrap:anywhere}
.fact .v{color:#bcd0ea;font-size:.85rem;margin-top:.15rem;overflow-wrap:anywhere}
@media(max-width:720px){.facts .wrap{grid-template-columns:repeat(2,1fr)}.fact{padding:1rem .9rem}.fact .k{font-size:1rem}.fact .v{font-size:.82rem}}
@media(max-width:380px){.facts .wrap{grid-template-columns:1fr}}

/* SECTION */
section.block{padding:clamp(3.2rem,6vw,5rem) 0}
.tint{background:var(--mist)}
.center{text-align:center;margin:0 auto 2.6rem;max-width:62ch}
.center p{margin:.7rem auto 0;color:var(--slate)}

/* AMENITIES */
.grid-am{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
@media(max-width:880px){.grid-am{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.grid-am{grid-template-columns:1fr}}
.am{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-sm);transition:.18s}
.am:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#c9dcef}
.am .ic{width:52px;height:52px;border-radius:13px;display:grid;place-items:center;font-size:1.6rem;background:linear-gradient(135deg,var(--sky),var(--blue));margin-bottom:.9rem}
.am h3{margin-bottom:.35rem}
.am p{color:var(--slate);font-size:.96rem}
/* today strip */
.today{background:var(--cloud);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.today-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.6rem}
.today-head h2{margin:0}
.live-tag{display:inline-flex;align-items:center;gap:.45rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;font-size:.82rem;font-weight:600;color:var(--slate)}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--aqua);box-shadow:0 0 0 4px rgba(22,184,166,.18)}
.status{display:inline-flex;align-items:center;gap:.4rem;margin-top:.5rem;padding:.2rem .6rem;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.01em}
.status-dot{width:8px;height:8px;border-radius:50%;flex:none}
.status.open{background:rgba(22,184,166,.16);color:#7fe6d6}
.status.open .status-dot{background:#16b8a6;box-shadow:0 0 0 3px rgba(22,184,166,.22)}
.status.closed{background:rgba(255,255,255,.1);color:#cdd9ea}
.status.closed .status-dot{background:#8aa0bd}
.sched-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:880px){.sched-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.sched-grid{grid-template-columns:1fr}}
.sched{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem 1.3rem;box-shadow:var(--shadow-sm)}
.sched .sic{font-size:1.4rem;margin-bottom:.5rem}
.sched h3{font-size:1.02rem;margin-bottom:.2rem}
.sched .win{color:var(--slate);font-size:.9rem;margin-bottom:.7rem}
.sched a{font-weight:600;color:var(--blue-readable);font-size:.9rem;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:1px}
.sched a:hover{color:var(--navy)}
.today-note{margin-top:1.5rem;color:var(--slate);font-size:.88rem;text-align:center}

/* SPLIT */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:2.6rem;align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;height:100%;object-fit:cover;object-position:center 30%;max-height:440px}
.split.rev{direction:rtl}.split.rev>*{direction:ltr}
@media(max-width:820px){.split{grid-template-columns:1fr}.split img{max-height:320px}}
.split ul{list-style:none;margin-top:1.1rem;display:grid;gap:.6rem}
.split li{padding-left:1.7rem;position:relative;color:#27384f}
.split li::before{content:"✓";position:absolute;left:0;color:var(--success);font-weight:700}

/* PRICING */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:980px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.plans{grid-template-columns:1fr}}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem 1.4rem;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);position:relative}
.plan.feat{border:2px solid var(--blue);box-shadow:var(--shadow)}
.plan.feat::after{content:"Most popular";position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--sun);color:#3a2600;font-size:.72rem;font-weight:700;padding:.25rem .7rem;border-radius:999px;text-transform:uppercase;letter-spacing:.05em}
.plan h3{color:var(--navy)}
.plan .who{color:var(--slate);font-size:.9rem;min-height:2.4em;margin:.3rem 0 1rem}
.plan .price{font-family:Poppins;font-weight:700;color:var(--navy);font-size:1.05rem;margin-bottom:1rem}
.plan .price small{display:block;font-family:Inter;font-weight:500;color:var(--slate);font-size:.8rem}
.plan ul{list-style:none;display:grid;gap:.5rem;margin-bottom:1.3rem;font-size:.92rem;color:#27384f}
.plan ul li::before{content:"•";color:var(--blue);font-weight:700;margin-right:.5rem}
.plan .btn{margin-top:auto;justify-content:center}
.note{text-align:center;color:var(--slate);font-size:.9rem;margin-top:1.4rem}
.note b{color:var(--navy)}

/* PROGRAMS / SENIOR / CHILD strips */
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
@media(max-width:820px){.strip{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow-sm)}
.card .tag{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--blue-readable);background:var(--mist);padding:.25rem .6rem;border-radius:999px;margin-bottom:.7rem}
.card h3{margin-bottom:.4rem}.card p{color:var(--slate);font-size:.95rem}
.partners{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.9rem}
.partners span{font-size:.82rem;font-weight:600;color:var(--navy);background:var(--mist);border:1px solid var(--line);border-radius:999px;padding:.3rem .75rem}

/* JOIN CTA */
.join{background:linear-gradient(135deg,var(--navy),var(--navy-deep));color:#fff;border-radius:24px;padding:clamp(2.4rem,5vw,3.6rem);text-align:center;position:relative;overflow:hidden}
.join h2{color:#fff}.join p{color:#cfe0f4;margin:.8rem auto 1.8rem}
.join .actions{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}

/* FOOTER */
footer{background:var(--navy-deep);color:#bcd0ea;padding:3rem 0 2rem;margin-top:3rem}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
@media(max-width:760px){.fgrid{grid-template-columns:1fr}}
footer h4,footer .foot-h{color:#fff;font-family:Poppins;font-size:.95rem;margin-bottom:.8rem;letter-spacing:.03em;font-weight:700}
footer a{color:#bcd0ea;display:block;margin-bottom:.45rem;font-size:.93rem}
footer a:hover{color:#fff}
.fbrand{display:flex;align-items:center;gap:.6rem;margin-bottom:.9rem}
.fbrand img{height:40px;width:40px;border-radius:10px}
.fbrand b,.fbrand b{color:#fff}
.legal{border-top:1px solid rgba(255,255,255,.12);margin-top:2.2rem;padding-top:1.4rem;font-size:.82rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem}
.badge-built{color:#7d93b3}
.badge-built a{display:inline;color:#9fb6d6}

/* --- Tier-2 ActiveNet demo --- */
.demo-banner{background:#FFF8E7;border:1px solid #F0D9A0;border-left:4px solid var(--sun);
  border-radius:10px;padding:.85rem 1rem;margin:0 0 1.35rem;font-size:.92rem;line-height:1.55;color:#5B4708}
.demo-banner strong{color:#3D2F00}
.api-tabs{display:flex;gap:.5rem;margin:0 0 1.25rem;flex-wrap:wrap}
.api-tab{font:inherit;font-size:.9rem;font-weight:600;cursor:pointer;padding:.5rem 1.1rem;border-radius:999px;
  border:1px solid var(--line);background:var(--white);color:var(--slate);transition:.18s}
.api-tab:hover{border-color:var(--blue);color:var(--blue-readable)}
.api-tab.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.api-tab:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.live-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:1rem}
.lc{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.15rem;
  box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:.5rem;position:relative}
.lc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}
.lc-time{font-weight:800;color:var(--navy);font-size:1.02rem;letter-spacing:-.01em}
.lc-name{font-weight:700;color:var(--ink);font-size:1.04rem;line-height:1.3;margin:0}
.lc-meta{font-size:.87rem;color:var(--slate);display:flex;flex-wrap:wrap;gap:.35rem .7rem}
.lc-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.2rem;
  padding-top:.7rem;border-top:1px solid var(--line)}
.lc-fee{font-weight:700;color:var(--ink);font-size:.92rem}
.lc-fee small{font-weight:500;color:var(--slate)}
.pill{font-size:.74rem;font-weight:700;padding:.25rem .6rem;border-radius:999px;white-space:nowrap;letter-spacing:.01em}
.pill-open{background:#E4F6EE;color:#12704C}
.pill-few{background:#FFF1DC;color:#8A5308}
.pill-full{background:#F2F4F7;color:#6B7A8D}
.lc-cta{font-weight:700;font-size:.9rem;color:var(--blue-readable);text-decoration:none;white-space:nowrap}
.lc-cta:hover{text-decoration:underline}
.lc-cta[aria-disabled="true"]{color:#9AA7B6;pointer-events:none}
.api-foot{margin-top:1.5rem}
.api-foot-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem}
.api-chip{font-size:.78rem;font-weight:700;color:var(--navy);background:var(--mist);
  border:1px solid var(--line);border-radius:8px;padding:.32rem .6rem;letter-spacing:.02em}
.api-chip code{font-size:.78rem;background:none;padding:0;color:var(--blue-readable)}
.fac-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}
.fc{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.05rem 1.1rem;box-shadow:var(--shadow-sm)}
.fc-h{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.5rem}
.fc-h h3{margin:0;font-size:1rem;color:var(--ink)}
.fc-hours{font-size:.87rem;color:var(--slate);margin:0 0 .7rem}
.bar{height:7px;border-radius:99px;background:var(--mist);overflow:hidden}
.bar span{display:block;height:100%;border-radius:99px}
.fc-cap{font-size:.8rem;color:var(--slate);margin:.45rem 0 0}
@media (max-width:520px){
  .live-grid,.fac-grid{grid-template-columns:1fr}
  .api-tab{flex:1 1 auto;text-align:center}
}

/* ---- shared interior-page utilities (added for multipage build) ---- */
.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}
.skip{position:absolute;left:-9999px;top:0;background:var(--sun);color:#3a2600;padding:.8rem 1.2rem;z-index:100;font-weight:600;border-radius:0 0 10px 0}
.skip:focus{left:0}
.grid{display:grid;gap:1.1rem}
.grid.g3{grid-template-columns:repeat(3,1fr)}
.grid.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:880px){.grid.g3,.grid.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.grid.g3,.grid.g4{grid-template-columns:1fr}}
.ticks{list-style:none;padding:0;margin:.6rem 0 0;display:grid;gap:.5rem}
.ticks li{position:relative;padding-left:1.6rem;color:var(--slate);font-size:.96rem}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--success);font-weight:700}
.ptable caption{text-align:left}
/* a11y: links inside tinted note boxes need higher contrast + underline (WCAG 1.4.3 / 1.4.1) */
.note a{color:var(--blue-readable);text-decoration:underline;text-underline-offset:2px;font-weight:600}
.note a:hover{color:var(--navy)}
.ptable a{color:var(--blue-readable);text-decoration:underline;text-underline-offset:2px}
.ptable a:hover{color:var(--navy)}

/* ---- narrow-viewport overflow fixes (320px floor) ---- */
/* long email/URL strings must be able to break rather than force page width */
.ptable a,.hrs span,.note a,footer a{overflow-wrap:anywhere;word-break:break-word}
/* tables get a horizontal scroll container instead of pushing the page wide */
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius)}
.tscroll .ptable{border-radius:0}
@media(max-width:420px){
  .ptable th,.ptable td{padding:.7rem .6rem;font-size:.88rem}
  .hrs div{flex-wrap:wrap;gap:.15rem}
  .hrs div span,.hrs div b{flex:1 1 100%}
}
@media(max-width:360px){
  .ptable th,.ptable td{padding:.6rem .45rem;font-size:.82rem}
}
/* note paragraphs: allow long inline runs to wrap at 320px */
p.note,.note{overflow-wrap:anywhere}
@media(max-width:360px){p.note{font-size:.86rem;line-height:1.55}}

/* grid tracks: 1fr defaults to minmax(auto,1fr), so an unbreakable word inflates
   the track and blows out scrollWidth at 320px. Pin the floor to 0. */
.plan,.card{min-width:0}
.plan *,.card *{min-width:0;overflow-wrap:anywhere}

/* .note links: readable contrast + underline (not colour-only) on tinted bg */
p.note a,.note a{color:var(--blue-readable);text-decoration:underline;text-underline-offset:2px}
