:root{
  --phase8-ring:rgba(245,130,32,.16);
}
/* Phase 8 public-site polish: safer mobile sizing, card consistency, and touch targets. */
.site-header{position:sticky;top:0;z-index:100;background:rgba(251,248,243,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(231,223,209,.85)}
.nav{min-height:78px}
.nav-cta{display:flex;align-items:center;gap:9px}
.btn-student{background:var(--deep-navy);color:#fff;border-color:var(--deep-navy)}
.btn-student:hover{background:#0a2230;color:#fff}
.mobile-panel{z-index:120}
.mobile-panel ul{padding-bottom:28px}
.mobile-panel a{display:flex;align-items:center;justify-content:space-between;min-height:48px}
.course-card,.path-card,.story-card,.project-card,.partner-card,.info-card{min-width:0}
.course-card .body h3,.path-card h3{overflow-wrap:anywhere}
.course-card .cta-row{flex-wrap:wrap}
.filter-bar{align-items:end}
input,select,textarea{max-width:100%}
button,.btn,a{touch-action:manipulation}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
img{content-visibility:auto}
@media(max-width:1180px){
  .nav-menu{gap:14px}
  .nav-menu a{font-size:.9rem}
  .nav-cta .btn-partner{display:none}
}
@media(max-width:980px){
  .nav-menu{display:none}
  .nav-cta .btn-student,.nav-cta .btn-outline{display:none}
  .nav-toggle{display:grid}
  .nav-brand-text span{font-size:.68rem}
}
@media(max-width:720px){
  .section,.section-lg{padding-top:56px;padding-bottom:56px}
  .container{padding-left:18px;padding-right:18px}
  .display-xl{font-size:clamp(2.45rem,13vw,4rem)}
  .display-lg{font-size:clamp(2rem,10vw,3rem)}
  .lead{font-size:1rem}
  .btn{min-height:46px}
  .grid-2,.grid-3,.grid-4,.two-col,.path-picker{gap:16px}
  .course-card .banner{aspect-ratio:16/9}
  .course-card .body{padding:18px}
  .path-card{padding:20px}
  .form-card{padding:20px}
  .form-grid{gap:14px}
  .impact-strip{padding:24px 16px;gap:14px}
  .impact-strip .num{font-size:1.55rem}
  .gallery-grid{column-gap:10px}
}
@media(max-width:420px){
  .nav-brand img{width:38px}
  .nav-brand-text strong{font-size:1rem}
  .nav-brand-text span{display:none}
  .nav-toggle{width:44px;height:44px}
  .btn-lg{width:100%}
  .cta-row .btn{width:100%}
}
