/* ============================================================
   SED HUB V10.5 — FULL RESPONSIVE / VISUAL REPAIR
   Fixes clipping, theme contrast, dead-space and visual density
   across core SED Hub pages without changing FutureLab styling.
   ============================================================ */

/* ---------- layout safety ---------- */
html,body{max-width:100%;overflow-x:hidden}
main{min-width:0}
main .wrap{width:min(1260px,calc(100% - 48px));max-width:1260px}
main .section,main .page-hero{position:relative;overflow:hidden}
main .page-hero-grid,main .split,main .form-layout,main .hero-grid{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(34px,5vw,68px)}
main .page-hero-grid>*,main .split>*,main .form-layout>*,main .hero-grid>*{min-width:0;max-width:100%}
main h1,main h2,main h3,main p,main span,main a{overflow-wrap:break-word}
main h1,main h2{word-break:normal;text-wrap:balance}

/* ---------- section headings: stop V6 two-column auto-placement bug ---------- */
main .section-head{display:block!important;max-width:900px!important;margin:0 0 42px!important}
main .section-head .eyebrow{display:block;margin-bottom:12px}
main .section-head h2{max-width:900px!important;margin:0 0 16px!important;font-size:clamp(2.35rem,4.1vw,3.8rem)!important;line-height:.98!important;letter-spacing:-.05em!important}
main .section-head p{max-width:760px!important;margin:0!important;color:var(--v7-muted)!important;font-size:1.02rem;line-height:1.7}
main .split h2,main .form-layout h2{font-size:clamp(2.25rem,3.8vw,3.55rem)!important;line-height:1!important;letter-spacing:-.048em!important;max-width:680px}

/* ---------- theme-safe surfaces: remove white-on-white ---------- */
main .program-card,
main .info-card,
main .tier-grid>a,main .tier-grid>div,
main .impact-panel,main .lead-form,main .stat-stack div,
main .action-card,main .interactive-tool,main .knowledge-card,main .resource-card,
main .catalogue-filters,main .course-card,main .discipline-directory,
main .os-card,main .u-node,main .format-ribbon,main .virtual-lab,main .lab-question,
main .builder-controls,main .builder-result,
main .track-grid a,main .level-cloud a,main .related-discipline-grid a,
main .age-paths>div,main .homeschool-bands>div,main .curriculum-strands>div,main .week-cycle>div,
main .v8-role-card,main .v8-capability-grid>div,main .v8-device-list>span,main .v8-delivery-grid>div,
main .module-list>div,main .selected-course,main .catalogue-note{
  background:var(--v7-panel)!important;color:var(--v7-text)!important;border-color:var(--v7-line)!important;
}
main .program-card p,main .info-card p,main .tier-grid p,main .age-paths p,main .homeschool-bands p,
main .curriculum-strands p,main .week-cycle p,main .v8-delivery-grid span,main .v8-capability-grid span,
main .module-list span,main .catalogue-note span{color:var(--v7-muted)!important}
main .program-card h2,main .program-card h3,main .info-card h3,main .age-paths h3,
main .homeschool-bands h3,main .curriculum-strands h3,main .week-cycle h3{color:var(--v7-text)!important}
main .proof-row span,main .tags span,main .lab-tags span{
  background:var(--v7-panel)!important;color:var(--v7-text)!important;border-color:var(--v7-line)!important;
}
main .module-list b{background:color-mix(in srgb,var(--v7-blue) 13%,var(--v7-panel2))!important;color:var(--v7-blue)!important}
main .filters input,main .filters select,main .catalogue-filters input,main .catalogue-filters select,
main .lead-form input,main .lead-form textarea,main .lead-form select,
main .resource-controls input,main .resource-controls select,main .knowledge-search input,main .interactive-tool select{
  background:var(--v7-panel)!important;color:var(--v7-text)!important;border-color:var(--v7-line)!important;
}

/* ---------- hero visual integrity ---------- */
main .camp-hero,main .homeschool-hero{background:linear-gradient(135deg,var(--v7-bg2),var(--v7-soft))!important}
main .camp-visual-card,main .homeschool-visual-card{min-height:420px;isolation:isolate;border:1px solid var(--v7-line);background:#061126}
main .camp-visual-card>img,main .homeschool-visual-card>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;aspect-ratio:auto!important}
main .camp-visual-card:before,main .homeschool-visual-card:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(3,8,25,.04),rgba(3,8,25,.55))}
main .camp-visual-card>div,main .homeschool-visual-card>div{z-index:3!important;left:20px;right:20px;bottom:20px;background:rgba(4,10,30,.82)!important;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(16px)}
main .camp-visual-card b,main .homeschool-visual-card b{color:#fff!important}

/* ---------- Summer/Winter camp — image-rich and properly aligned ---------- */
main .camp-theme-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
main .camp-theme-grid>div{position:relative;min-height:260px;overflow:hidden;border-radius:18px;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;border:1px solid rgba(122,168,255,.28)!important;color:#fff!important;background-position:center!important;background-size:cover!important;box-shadow:0 18px 42px rgba(2,8,28,.16)}
main .camp-theme-grid>div:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,7,22,.05) 12%,rgba(2,7,22,.9) 92%)}
main .camp-theme-grid>div:nth-child(1){background-image:url('/assets/img/v7/world-medical.webp')!important}
main .camp-theme-grid>div:nth-child(2){background-image:url('/assets/img/v7/world-ocean.webp')!important}
main .camp-theme-grid>div:nth-child(3){background-image:url('/assets/img/v7/world-robot.webp')!important}
main .camp-theme-grid>div:nth-child(4){background-image:url('/assets/img/v7/world-space.webp')!important}
main .camp-theme-grid>div:nth-child(5){background-image:url('/assets/img/v7/world-code.webp')!important}
main .camp-theme-grid>div:nth-child(6){background-image:url('/assets/img/v7/world-medical.webp')!important}
main .camp-theme-grid>div>*{position:relative;z-index:1}
main .camp-theme-grid>div>span{width:48px;height:48px;margin:0 0 15px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.13)!important;color:#fff!important;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px)}
main .camp-theme-grid h3{font-size:1.25rem;color:#fff!important;margin:0 0 7px!important}
main .camp-theme-grid p{color:#d7e2f4!important;font-size:.88rem;margin:0}
main .v8-camp-flow{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
main .v8-camp-flow>div{min-width:0;min-height:245px}

/* ---------- homeschool visual depth ---------- */
main .homeschool-bands{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
main .homeschool-bands>div{position:relative;min-height:210px;padding:23px;border-radius:18px;background:linear-gradient(145deg,var(--v7-panel),var(--v7-panel2))!important}
main .homeschool-bands>div:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--v7-blue),var(--v7-pink),var(--v7-cyan))}
main .homeschool-bands b{font-size:.8rem;color:var(--v7-pink)!important}
main .curriculum-strands{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
main .curriculum-strands>div{min-height:215px;border-radius:18px;padding:23px;background:linear-gradient(150deg,var(--v7-panel),color-mix(in srgb,var(--v7-blue) 7%,var(--v7-panel)))!important}
main .curriculum-strands span{background:color-mix(in srgb,var(--v7-violet) 16%,var(--v7-panel2))!important;color:var(--v7-blue2)!important}
main .week-cycle{grid-template-columns:1fr 1fr;gap:12px}
main .week-cycle>div{border-radius:16px;padding:20px;min-height:150px}
main .age-paths{grid-template-columns:1fr 1fr;gap:12px}
main .age-paths>div{border-radius:16px;padding:20px}

/* ---------- information cards need hierarchy, not blank boxes ---------- */
main .card-grid{gap:16px}
main .info-card,main .program-card{min-height:180px;padding:24px!important;display:flex;flex-direction:column;align-items:flex-start}
main .info-card h3,main .program-card h3{margin-top:8px!important}
main .info-card p,main .program-card p{margin-bottom:0}
main .info-card a,main .program-card .arrow{margin-top:auto;padding-top:14px}
main .card-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---------- keep dark sections truly dark and readable ---------- */
main .section-dark{background:radial-gradient(circle at 82% 16%,rgba(47,107,255,.22),transparent 24%),linear-gradient(135deg,#040817,#0a1735 58%,#171143)!important;color:#fff!important}
main .section-dark h2,main .section-dark h3,main .section-dark b{color:#fff!important}
main .section-dark p,main .section-dark span{color:#c7d3e8!important}
main .section-dark .mini-dashboard{background:#fff!important;color:#091127!important}
main .section-dark .mini-dashboard b{color:#091127!important}
main .section-dark .mini-dashboard span{color:#66708a!important}

/* ---------- course catalogue density ---------- */
main .v8-course-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
main .v8-course-card{display:flex;flex-direction:column;min-width:0;border-radius:18px}
main .v8-course-image{min-height:158px}
main .v8-course-body{padding:18px 18px 19px}
main .v8-course-card h2{font-size:1.02rem;line-height:1.2}
main .v8-course-card p{font-size:.79rem}
main .course-meta{display:flex;flex-wrap:wrap;gap:6px}
main .course-meta span{background:var(--v7-panel2)!important;color:var(--v7-muted)!important;border-color:var(--v7-line)!important}

/* ---------- portal/devices: contained at every viewport ---------- */
main .v8-device-lab,main .v8-home-device-stage,main .v7-device-stage{max-width:100%;min-width:0}
main .v8-desktop-device,main .v8-home-monitor,main .v7-laptop{max-width:100%;min-width:0}
main .v8-tablet-device{right:14px}
main .v8-phone-device{right:-2px}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  main .page-hero-grid,main .split,main .form-layout,main .hero-grid{grid-template-columns:1fr;gap:34px}
  main .section-head{max-width:820px!important}
  main .camp-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  main .homeschool-bands{grid-template-columns:repeat(3,minmax(0,1fr))}
  main .curriculum-strands{grid-template-columns:repeat(2,minmax(0,1fr))}
  main .card-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
  main .v8-course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  main .wrap{width:min(100% - 30px,1260px)}
  main .section{padding:68px 0}
  main .page-hero{padding:64px 0}
  main .section-head h2{font-size:clamp(2.05rem,10vw,3rem)!important}
  main .split h2,main .form-layout h2{font-size:clamp(2rem,9vw,2.9rem)!important}
  main .camp-theme-grid,main .homeschool-bands,main .curriculum-strands,main .week-cycle,main .age-paths,
  main .card-grid.three,main .v8-course-grid,main .v8-camp-flow{grid-template-columns:1fr}
  main .camp-theme-grid>div{min-height:230px}
  main .camp-visual-card,main .homeschool-visual-card{min-height:330px}
  main .proof-row{gap:8px}
  main .proof-row span{font-size:.7rem;padding:7px 10px}
  main .v8-tablet-device,main .v8-phone-device,main .v8-home-tablet,main .v8-home-phone{display:none!important}
  main .v8-device-lab{padding-right:0!important}
}
