/** Reference-led presentation for the editable Family Support Initiatives page. */

.hyda-family { --hyda-family-navy:#000740; --hyda-family-blue:#001964; --hyda-family-gold:#f0a920; --hyda-family-ink:#07143c; background:#fff; overflow:clip; }
.hyda-family h1,.hyda-family h2,.hyda-family h3,.hyda-family p { margin-top:0; }
.hyda-family__wide { margin-inline:auto; max-width:var(--hyda-wide-width); padding-inline:var(--hyda-page-gutter); }
.hyda-family__eyebrow { color:var(--hyda-gold-text); font-size:.78rem; font-weight:800; letter-spacing:.14em; margin-bottom:.75rem; text-transform:uppercase; }
.hyda-family__hero { background:var(--hyda-family-navy); color:#fff; position:relative; }
.hyda-family__hero::before,.hyda-family__study::after { background-image:radial-gradient(circle,rgba(240,169,32,.48) 1px,transparent 1.5px); background-size:10px 10px; content:""; opacity:.35; pointer-events:none; position:absolute; }
.hyda-family__hero::before { height:17rem; left:30%; mask-image:linear-gradient(135deg,transparent,#000 35%,#000 66%,transparent); top:1rem; transform:rotate(13deg); width:27rem; }
.hyda-family__hero-grid { display:grid; grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr); margin-inline:auto; max-width:1440px; min-height:clamp(27rem,37vw,32rem); }
.hyda-family__hero-copy { align-items:flex-start; display:flex; flex-direction:column; justify-content:center; max-width:41rem; padding:clamp(2.9rem,4.2vw,4rem) clamp(1.5rem,6vw,6.5rem) clamp(2.9rem,4.2vw,4rem) max(var(--hyda-page-gutter),calc((100vw - 1200px)/2)); position:relative; z-index:1; }
.hyda-family__hero .hyda-family__eyebrow { color:var(--hyda-family-gold); }
.hyda-family__hero h1 { color:#fff; font-size:clamp(2.75rem,4vw,4.45rem); letter-spacing:-.055em; line-height:.98; margin-bottom:1rem; max-width:12ch; }
.hyda-family__hero-rule { background:var(--hyda-family-gold); height:3px; margin:.1rem 0 1.1rem; width:4.2rem; }
.hyda-family__hero p:not(.hyda-family__eyebrow) { color:rgba(255,255,255,.89); font-size:clamp(1rem,1.3vw,1.08rem); line-height:1.68; max-width:37rem; }
.hyda-family__hero-media { clip-path:polygon(11% 0,100% 0,100% 100%,0 100%); min-height:inherit; position:relative; }
.hyda-family__hero-media::before { background:linear-gradient(105deg,var(--hyda-family-gold),rgba(240,169,32,.16)); clip-path:polygon(0 0,13% 0,3% 100%,0 100%); content:""; inset:0; position:absolute; z-index:1; }
.hyda-family__hero-media img { display:block; height:100%; object-fit:cover; width:100%; }

.hyda-family__pathways { background:#fff; padding-block:clamp(4rem,7vw,6rem); }
.hyda-family__pathway-grid { display:grid; gap:clamp(1.5rem,4vw,4.5rem); grid-template-columns:1fr 1fr; }
.hyda-family__pathway { align-items:center; border:1px solid #e5eaf2; border-radius:1rem; display:grid; gap:1.5rem; grid-template-columns:auto 1fr; min-height:16rem; padding:clamp(1.6rem,3vw,2.5rem); position:relative; }
.hyda-family__pathway + .hyda-family__pathway::before { background:#dfe5ee; content:""; height:76%; left:calc(clamp(1.5rem,4vw,4.5rem)/-2); position:absolute; top:12%; width:1px; }
.hyda-family__pathway-mark { align-items:center; align-self:stretch; display:flex; flex-direction:column; gap:1.1rem; justify-content:flex-start; }
.hyda-family__number { align-items:center; background:var(--hyda-family-navy); border-radius:50%; color:var(--hyda-family-gold); display:flex; font-size:1.25rem; font-weight:800; height:3.8rem; justify-content:center; width:3.8rem; }
.hyda-family__number::after { background:var(--hyda-family-gold); content:""; height:2.2rem; margin-top:4.8rem; position:absolute; width:2px; }
.hyda-family__path-icon { align-items:center; border:1px solid #e5eaf2; border-radius:.8rem; color:var(--hyda-family-gold); display:flex; font-size:2.4rem; height:4.7rem; justify-content:center; margin-top:auto; width:4.7rem; }
.hyda-family__pathway h2 { color:var(--hyda-family-ink); font-size:clamp(1.55rem,2.6vw,2.25rem); letter-spacing:-.045em; line-height:1.08; margin-bottom:1.15rem; }
.hyda-family__pathway h2 span { color:var(--hyda-gold-text); display:block; font-size:.82rem; letter-spacing:0; margin-bottom:.5rem; }
.hyda-family__pathway p { color:#2f3a52; line-height:1.72; margin-bottom:0; max-width:27rem; }

.hyda-family__module { background:linear-gradient(135deg,#f5f8fc,#eef3fa); padding-block:clamp(3.5rem,6vw,5.25rem); }
.hyda-family__module-grid { align-items:center; display:grid; gap:clamp(2rem,6vw,6rem); grid-template-columns:minmax(16rem,.76fr) minmax(0,1.24fr); }
.hyda-family__module-copy h2,.hyda-family__heading h2 { color:var(--hyda-family-ink); font-size:clamp(2rem,3.2vw,3.2rem); letter-spacing:-.055em; line-height:1.04; margin-bottom:.8rem; }
.hyda-family__module-copy p:not(.hyda-family__eyebrow) { color:#2f3a52; line-height:1.72; max-width:25rem; }
.hyda-family__portal-img { display:block; filter:drop-shadow(0 16px 22px rgba(0,7,64,.2)); margin-top:1.25rem; max-width:100%; }
.hyda-family__steps { list-style:none; margin:0; padding:0; }
.hyda-family__steps li { align-items:center; border-bottom:1px solid #dce3ed; display:grid; gap:1rem; grid-template-columns:2.3rem 3rem 1fr; padding:1rem 0; }
.hyda-family__steps li:last-child { border-bottom:0; }
.hyda-family__step-number { align-items:center; background:var(--hyda-family-navy); border-radius:50%; color:var(--hyda-family-gold); display:flex; font-size:.95rem; font-weight:800; height:2.3rem; justify-content:center; width:2.3rem; }
.hyda-family__step-icon { color:var(--hyda-family-gold); font-size:2rem; text-align:center; }
.hyda-family__steps h3 { color:var(--hyda-family-ink); font-size:1rem; letter-spacing:-.025em; margin-bottom:.25rem; }
.hyda-family__steps p { color:#39445b; font-size:.9rem; line-height:1.55; margin-bottom:0; }

.hyda-family__initiatives { background:#fff; padding-block:clamp(4rem,7vw,6.2rem); }
.hyda-family__heading { margin-inline:auto; max-width:47rem; text-align:center; }
.hyda-family__heading h2 { margin-bottom:.65rem; }
.hyda-family__heading > p:not(.hyda-family__eyebrow) { color:#39445b; line-height:1.65; }
.hyda-family__initiative-grid { display:grid; gap:1.5rem; grid-template-columns:repeat(2,minmax(0,1fr)); margin-inline:auto; margin-top:2.2rem; max-width:48rem; }
.hyda-family__initiative { border:1px solid #e1e7ef; border-radius:1rem; padding:2rem 1.25rem; text-align:center; }
.hyda-family__initiative-icon { align-items:center; background:var(--hyda-family-navy); border-radius:50%; color:var(--hyda-family-gold); display:inline-flex; font-size:2.1rem; height:4.6rem; justify-content:center; margin-bottom:1rem; width:4.6rem; }
.hyda-family__initiative h3 { color:var(--hyda-family-ink); font-size:clamp(1.18rem,2vw,1.55rem); letter-spacing:-.04em; line-height:1.18; margin-bottom:1.15rem; }
.hyda-family__initiative h3::after { background:var(--hyda-family-gold); content:""; display:block; height:2px; margin:1rem auto 0; width:2.5rem; }
.hyda-family__initiative p { color:#39445b; font-size:.92rem; line-height:1.62; margin:0 auto; max-width:18rem; }

@media (max-width:782px) { .hyda-family__hero-grid { display:block; min-height:0; } .hyda-family__hero-copy { max-width:none; padding-inline:var(--hyda-page-gutter); } .hyda-family__hero h1 { max-width:12ch; } .hyda-family__hero-media { clip-path:none; min-height:19rem; } .hyda-family__hero-media::before { clip-path:polygon(0 0,100% 0,100% 6%,0 22%); } .hyda-family__pathway-grid,.hyda-family__module-grid { display:block; } .hyda-family__pathway + .hyda-family__pathway { margin-top:1.25rem; } .hyda-family__pathway + .hyda-family__pathway::before { display:none; } .hyda-family__module-copy { margin-bottom:2rem; } }
@media (max-width:480px) { .hyda-family__pathway { grid-template-columns:1fr; } .hyda-family__pathway-mark { align-items:center; flex-direction:row; justify-content:flex-start; } .hyda-family__number::after { display:none; } .hyda-family__path-icon { margin-top:0; } .hyda-family__initiative-grid { grid-template-columns:1fr; } .hyda-family__steps li { align-items:flex-start; grid-template-columns:2.1rem 2.25rem 1fr; } }