/* Zones hub and zone pages. Same system as Home, Academy and Framework: navy anchors, gold accents,
   teal = Executive Functions, purple = Holistic Competencies, gold = Mental Toughness. */
.page-zones{--zx-navy:#101f35;--zx-gold:#9a7029;--zx-gold2:#d7b777;--zx-teal:#11675f;--zx-purple:#7662a6;--zx-mist:#f5f5f7;--zx-line:#e3e3e5;--zx-mute:#56657a;--zx-text:#2b3a52;--zx-serif:Georgia,'Times New Roman',serif;--zx-sans:Arial,Helvetica,sans-serif}
.page-zones section[id]{scroll-margin-top:calc(var(--academy-header-height,86px) + 60px)}
.page-zones .mock-section-head h2 em{font-style:italic;color:var(--zx-gold)}
.page-zones .zx-dark .mock-section-head h2{color:#fff}.page-zones .zx-dark .mock-section-head h2 em{color:var(--zx-gold2)}
.page-zones .zx-dark .mock-section-head>p{color:#c9d1dd}.page-zones .zx-dark .eyebrow{color:var(--zx-gold2)}
.page-zones .zx-dark{background:var(--zx-navy)}
.page-zones button{font:inherit}
.page-zones .hero .fw-lead,.page-zones .hero .zx-lead{max-width:720px;margin:24px 0 0;font:400 1.12rem/1.8 var(--zx-sans);color:#c9d1dd}
.page-zones .hero .cta-row{margin-top:32px}

/* zone hero with line drawing */
.zx-hero>.wrap{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.zx-hero .hero-copy{text-align:left!important;max-width:none}
.zx-hero .hero-copy .eyebrow{justify-content:flex-start}
.zx-hero h1{text-align:left!important}
.zx-hero .zx-sub{margin:14px 0 0;font:600 .82rem/1.4 var(--zx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--zx-gold2)}
.zx-art{position:relative;align-self:center;width:100%;height:auto!important;min-height:0!important;border:1px solid #d7b77744;background:radial-gradient(circle at 30% 25%,#1b2d47,#101f35);aspect-ratio:3/2;max-width:100%}
.zx-art svg{position:absolute;inset:8% 6%;width:88%;height:84%;fill:none;stroke:var(--zx-gold2);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.zx-art .age{position:absolute;right:14px;bottom:8px;font:400 3.2rem/1 var(--zx-serif);color:#d7b77733}
.zx-ribbon{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:36px;border-top:1px solid #ffffff22;list-style:none;padding:0}
.zx-ribbon li{min-width:0}
.zx-ribbon a{display:flex;flex-direction:column;gap:2px;padding:12px 10px 4px 0;text-decoration:none;color:#9fb0c6;font:400 1rem/1.2 var(--zx-serif);border-top:2px solid transparent;margin-top:-1px;min-height:44px}
.zx-ribbon a small{font:600 .68rem/1.3 var(--zx-sans);letter-spacing:.1em}
.zx-ribbon a:hover{color:#fff}
.zx-ribbon a[aria-current]{color:#fff;border-top-color:var(--zx-gold2)}
.zx-ribbon a[aria-current] small{color:var(--zx-gold2)}

/* numbers band + glance */
.zx-numbers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 0 44px;background:var(--zx-navy);color:#dbe2ec;border-top:3px solid var(--zx-gold2)}
.zx-numbers>div{padding:26px 28px;min-width:0}
.zx-numbers>div+div{border-left:1px solid #ffffff1c}
.zx-numbers b{display:block;font:400 clamp(2.4rem,4.4vw,3.4rem)/1 var(--zx-serif);color:var(--zx-gold2);font-variant-numeric:tabular-nums}
.zx-numbers span{display:block;margin-top:12px;font-size:.95rem;line-height:1.55;color:#c9d1dd}

/* change */
.zx-change{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:24px 64px;align-items:start}
.zx-change h2{margin:18px 0 0;font:400 clamp(1.9rem,3.2vw,2.8rem)/1.18 var(--zx-serif);color:var(--zx-navy);text-wrap:balance}
.zx-change p{margin:0;font-size:1.08rem;line-height:1.85;color:var(--zx-text)}

/* knowledge */
.zx-subjects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
.zx-subjects article{padding:24px 24px 26px;background:#fff;border:1px solid var(--zx-line);border-top:2px solid var(--zx-navy);min-width:0}
.zx-subjects h3{margin:0 0 10px;font:400 1.4rem/1.2 var(--zx-serif);color:var(--zx-navy)}
.zx-subjects p{margin:0;font-size:.95rem;line-height:1.65;color:var(--zx-text)}
.zx-compl{margin:16px 0 0;font-size:.95rem;color:var(--zx-mute)}
.zx-compl b{color:var(--zx-navy);font-weight:700}
.zx-yearwrap{margin-top:56px}
.zx-yearwrap>h3{margin:0 0 6px;font:400 1.5rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-yearwrap>p{margin:0 0 18px;font-size:.98rem;color:var(--zx-mute)}

/* growth */
.zx-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:34px}
.zx-tabs button{min-height:44px;padding:10px 16px;border:1px solid var(--zx-line);background:#fff;color:var(--zx-navy);cursor:pointer;border-radius:2px;font-size:.95rem}
.zx-tabs button small{margin-left:8px;font-weight:700;color:var(--c)}
.zx-tabs button[aria-selected=true]{border-color:var(--c);box-shadow:inset 0 -3px 0 var(--c);font-weight:700}
.zx-tabs button:focus-visible,.zx-select:focus-visible{outline:3px solid var(--zx-gold2);outline-offset:2px}
.zx-caps{margin-top:16px;background:#fff;border:1px solid var(--zx-line);border-left:3px solid var(--c)}
.zx-caps h4{margin:0;padding:16px 24px 6px;font:700 .7rem/1.4 var(--zx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.zx-caps ul{margin:0;padding:0 24px 8px;list-style:none}
.zx-caps li{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr) auto;gap:6px 24px;align-items:baseline;padding:14px 0;border-top:1px solid var(--zx-line)}
.zx-caps li:first-child{border-top:0}
.zx-caps .n{font:400 1.08rem/1.3 var(--zx-serif);color:var(--zx-navy)}
.zx-caps .n .new{display:inline-block;margin-left:8px;padding:2px 6px;font:700 .6rem/1.3 var(--zx-sans);letter-spacing:.1em;color:#fff;background:var(--zx-gold);border-radius:2px;vertical-align:2px}
.zx-caps .m{font-size:.95rem;line-height:1.6;color:var(--zx-text)}
.zx-caps .r{font:700 .62rem/1 var(--zx-sans);letter-spacing:.08em;text-transform:uppercase;padding:5px 7px;border:1px solid var(--c);color:var(--c);border-radius:2px;white-space:nowrap}
.zx-caps .r.br{border-color:var(--zx-gold);color:var(--zx-gold);background:#fbf8f1}
.zx-capnote{margin:0;padding:0 24px 18px;font-size:.88rem;color:var(--zx-mute)}
.zx-mapcard{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 36px;align-items:center;margin-top:22px;padding:24px 28px;background:var(--zx-navy);color:#dbe2ec;border-top:2px solid var(--zx-gold2)}
.zx-mapcard .k{font:700 .66rem/1.4 var(--zx-sans);letter-spacing:.14em;color:var(--zx-gold2)}
.zx-mapcard h3{margin:8px 0 6px;font:400 1.45rem/1.2 var(--zx-serif);color:#fff}
.zx-mapcard p{margin:0;font-size:.92rem;line-height:1.6;color:#c9d1dd}
.zx-mapcard .go{min-height:48px;padding:14px 22px;border:1px solid var(--zx-gold2);background:var(--zx-gold2);color:var(--zx-navy);font-weight:700;cursor:pointer;border-radius:2px;white-space:nowrap}
.zx-mapcard .go:hover{background:#e7cb94}

/* bridge */
.zx-bridge{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:28px 56px;align-items:start}
.zx-bridge .style{margin:22px 0 0;padding:20px 22px;border-left:2px solid var(--zx-gold2);font:italic 400 1.15rem/1.6 var(--zx-serif);color:#e2e7ef}
.zx-bridge .key{margin:22px 0 0;font-size:.95rem;color:#aab9cc}
.zx-themes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.zx-themes li{padding:18px 18px 20px;border:1px solid #ffffff1f;border-top:2px solid var(--c);background:#ffffff05;min-width:0}
.zx-themes b{display:block;font:400 1.12rem/1.3 var(--zx-serif);color:#fff}
.zx-themes span{display:block;margin-top:6px;font-size:.82rem;color:#aab9cc}
.zx-themes em{display:block;margin-top:10px;font:600 .66rem/1.4 var(--zx-sans);letter-spacing:.1em;text-transform:uppercase;font-style:normal;color:var(--c)}

/* lesson */
.zx-lesson .ac-plan{max-width:340px}
.zx-lessongrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start;margin-top:36px}
.zx-lessongrid .ac-lx{margin:0}

/* learning */
.zx-learn{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:40px;counter-reset:l;list-style:none;padding:0}
.zx-learn li{counter-increment:l;padding:22px 20px 24px;background:#fff;border:1px solid var(--zx-line);min-width:0}
.zx-learn li::before{content:'0' counter(l);display:block;font:400 1.5rem/1 var(--zx-serif);color:var(--zx-gold)}
.zx-learn h3{margin:14px 0 8px;font:400 1.2rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-learn p{margin:0;font-size:.92rem;line-height:1.6;color:var(--zx-text)}
.zx-auto{margin-top:48px}
.zx-auto h3{margin:0;font:400 1.4rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-auto>p{margin:6px 0 0;font-size:.95rem;color:var(--zx-mute)}
.zx-auto ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:20px 0 0;padding:0;list-style:none}
.zx-auto li{padding:14px 14px 16px;border-top:3px solid #c9cfd8;background:#fff;opacity:.55;min-width:0}
.zx-auto li.on{opacity:1;border-top-color:var(--zx-gold);box-shadow:0 10px 24px #101f350d}
.zx-auto li b{display:block;font:400 1rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-auto li span{display:block;margin-top:6px;font-size:.78rem;line-height:1.45;color:var(--zx-mute)}
.zx-auto .ac-axis{margin-top:10px}

/* progress */
.zx-own{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:36px 0 0;padding:0;list-style:none;border-top:1px solid var(--zx-line)}
.zx-own li{padding:16px 14px 0 0;min-width:0;position:relative;color:#8f9ab0}
.zx-own li::before{content:'';position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:#c9cfd8}
.zx-own li b{display:block;font:400 1.02rem/1.25 var(--zx-serif)}
.zx-own li small{font:600 .66rem var(--zx-sans);letter-spacing:.1em}
.zx-own li.on{color:var(--zx-navy)}
.zx-own li.on::before{background:var(--zx-gold);box-shadow:0 0 0 4px #9a702922}
.zx-own li.on small{color:var(--zx-gold)}
.zx-prog{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px 56px;margin-top:40px;align-items:start}
.zx-prog p{margin:0;font-size:1.02rem;line-height:1.8;color:var(--zx-text)}
.zx-prog .note{padding:18px 20px;background:var(--zx-mist);border-left:2px solid var(--zx-gold2);font-size:.95rem;line-height:1.65}
.zx-receive{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:40px}
.zx-receive div{padding:20px 20px 22px;border:1px solid var(--zx-line);border-top:2px solid var(--zx-gold2);background:#fff;min-width:0}
.zx-receive .w{font:700 .64rem/1.4 var(--zx-sans);letter-spacing:.14em;color:var(--zx-teal)}
.zx-receive h3{margin:10px 0 0;font:400 1.15rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-receive-foot{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;margin-top:16px;font-size:.95rem;color:var(--zx-mute)}
.zx-receive-foot a{font-weight:700;color:var(--zx-navy);text-decoration:underline;text-underline-offset:3px}

/* start + zone nav */
.zx-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:40px 0 0;padding:0;list-style:none;counter-reset:s}
.zx-steps li{counter-increment:s;padding:24px 22px 26px;background:#fff;border:1px solid var(--zx-line);min-width:0}
.zx-steps li::before{content:'0' counter(s);display:block;font:400 1.6rem/1 var(--zx-serif);color:var(--zx-gold)}
.zx-steps h3{margin:14px 0 8px;font:400 1.25rem/1.25 var(--zx-serif);color:var(--zx-navy)}
.zx-steps p{margin:0;font-size:.95rem;line-height:1.65;color:var(--zx-text)}
.zx-js{margin:22px 0 0;padding:18px 22px;border-left:2px solid var(--zx-gold2);background:#fff;font-size:1rem;line-height:1.65;color:var(--zx-text)}
.zx-js b{color:var(--zx-navy)}
.zx-startcta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.zx-zonenav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:56px}
.zx-zonenav a{display:flex;flex-direction:column;gap:4px;padding:20px 22px;border:1px solid var(--zx-line);background:#fff;text-decoration:none;color:var(--zx-navy);min-height:44px}
.zx-zonenav a:last-child{text-align:right;align-items:flex-end}
.zx-zonenav small{font:600 .68rem var(--zx-sans);letter-spacing:.12em;color:var(--zx-mute)}
.zx-zonenav b{font:400 1.3rem/1.2 var(--zx-serif)}
.zx-zonenav a:hover{border-color:var(--zx-gold2)}
.zx-zonenav span.empty{visibility:hidden}

/* hub */
.zx-same{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:40px}
.zx-same>div{padding:26px 28px;border:1px solid var(--zx-line);background:#fff;min-width:0}
.zx-same>div:last-child{background:var(--zx-navy);border-color:var(--zx-navy);color:#dbe2ec;border-top:2px solid var(--zx-gold2)}
.zx-same h3{margin:0 0 12px;font:400 1.45rem/1.2 var(--zx-serif);color:var(--zx-navy)}
.zx-same>div:last-child h3{color:#fff}
.zx-same ul{margin:0;padding:0;list-style:none}
.zx-same li{padding:10px 0;border-top:1px solid var(--zx-line);font-size:.98rem;line-height:1.55}
.zx-same>div:last-child li{border-color:#ffffff1c;color:#dbe2ec}
.zx-same li:first-child{border-top:0}
.zx-same-foot{margin:22px 0 0;text-align:center;font:italic 400 1.25rem/1.5 var(--zx-serif);color:var(--zx-navy)}
.zx-matrix{margin-top:40px;border-top:2px solid var(--zx-navy)}
.zx-mrow{display:grid;grid-template-columns:minmax(150px,.8fr) repeat(4,minmax(0,1fr));border-bottom:1px solid var(--zx-line)}
.zx-mrow>*{padding:16px 14px;min-width:0;font-size:.93rem;line-height:1.5;color:var(--zx-text)}
.zx-mrow>.h{font:700 .7rem/1.4 var(--zx-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--zx-mute);padding-left:0}
.zx-mrow.head>*{padding-top:18px;padding-bottom:14px}
.zx-mrow.head a{font:400 1.3rem/1.2 var(--zx-serif);color:var(--zx-navy);text-decoration:none;display:flex;flex-direction:column;gap:2px}
.zx-mrow.head a small{font:600 .68rem var(--zx-sans);letter-spacing:.1em;color:var(--zx-gold)}
.zx-mrow.head a:hover{color:var(--zx-gold)}
.zx-mrow .z{display:none;font:700 .64rem/1.3 var(--zx-sans);letter-spacing:.1em;color:var(--zx-gold);text-transform:uppercase;margin-bottom:4px}
.zx-mrow>div:nth-child(3),.zx-mrow>div:nth-child(5){background:#fafafb}
.zx-capx{margin-top:40px;padding:28px 30px;background:#fff;border:1px solid var(--zx-line);border-top:2px solid var(--zx-gold2)}
.zx-capx label{display:block;font:700 .7rem/1.4 var(--zx-sans);letter-spacing:.14em;color:var(--zx-mute);text-transform:uppercase}
.zx-select{margin-top:10px;width:100%;max-width:520px;min-height:48px;padding:10px 12px;border:1px solid #c9cfd8;background:#fff;color:var(--zx-navy);font:400 1.05rem var(--zx-serif);border-radius:2px}
.zx-capx .d{margin:18px 0 0;font-size:1rem;line-height:1.65;color:var(--zx-text)}
.zx-capx .d b{font:400 1.12rem var(--zx-serif);color:var(--zx-navy)}
.zx-capx ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:22px 0 0;padding:0;list-style:none}
.zx-capx li{position:relative;padding:18px 18px 0 0;border-top:1px solid #c9cfd8;min-width:0}
.zx-capx li+li{padding-left:18px}
.zx-capx li::before{content:'';position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--c,#101f35)}
.zx-capx li+li::before{left:18px}
.zx-capx li b{font:400 1.08rem var(--zx-serif);color:var(--zx-navy)}
.zx-capx li small{font:600 .7rem var(--zx-sans);color:var(--zx-gold);margin-left:4px}
.zx-capx li p{margin:8px 0 0;font-size:.92rem;line-height:1.55;color:var(--zx-text)}
.zx-capx li p.none{color:#8f9ab0;font-style:italic}
.page-zones .mock-zones .age-end p{white-space:normal}

@media (max-width:1100px){
 .zx-learn{grid-template-columns:repeat(2,minmax(0,1fr))}
 .zx-receive{grid-template-columns:repeat(2,minmax(0,1fr))}
 .zx-lessongrid{grid-template-columns:1fr}
 .zx-lessongrid .ac-plan{max-width:420px}
}
@media (max-width:860px){
 .zx-hero>.wrap{grid-template-columns:1fr}
 .zx-art{max-width:420px}
 .zx-numbers{grid-template-columns:1fr}
 .zx-numbers>div+div{border-left:0;border-top:1px solid #ffffff1c}
 .zx-change,.zx-prog,.zx-bridge,.zx-same{grid-template-columns:1fr}
 .zx-subjects,.zx-steps{grid-template-columns:1fr}
 .zx-caps li{grid-template-columns:1fr auto}
 .zx-caps .m{grid-column:1/-1;grid-row:2}
 .zx-auto ol{grid-template-columns:1fr}
 .zx-auto li{opacity:1}
 .zx-auto li:not(.on){display:none}
 .zx-own{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}
 .zx-mrow{grid-template-columns:repeat(2,minmax(0,1fr))}
 .zx-mrow>.h{grid-column:1/-1;padding:16px 0 4px}
 .zx-mrow.head{display:none}
 .zx-mrow .z{display:block}
 .zx-mrow>div:nth-child(3),.zx-mrow>div:nth-child(5){background:none}
 .zx-mrow>div{padding:8px 12px 12px 0}
 .zx-capx ol{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}
 .zx-capx li:nth-child(3){padding-left:0}.zx-capx li:nth-child(3)::before{left:0}
 .zx-mapcard{grid-template-columns:1fr}
 .zx-mapcard .go{justify-self:start}
}
@media (max-width:560px){
 .zx-learn,.zx-receive,.zx-themes,.zx-zonenav{grid-template-columns:1fr}
 .zx-zonenav a:last-child{text-align:left;align-items:flex-start}
 .zx-zonenav span.empty{display:none}
 .zx-capx{padding:22px 18px}
 .zx-capx ol{grid-template-columns:1fr}
 .zx-capx li,.zx-capx li+li{padding-left:0}.zx-capx li+li::before{left:0}
 .zx-ribbon a{font-size:.88rem}
 .zx-caps ul{padding:0 16px 6px}.zx-caps h4{padding:14px 16px 4px}
 .zx-mapcard .go{width:100%;white-space:normal}
}