/* YFI Day 6 — multilingual + mobile UX polish. Extends locked Day 1–5 styling only. */
html[lang="zh"] body{font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif}
html[lang="ar"] body{font-family:Arial,"Noto Sans Arabic","Tahoma",sans-serif}
html[dir="rtl"] body{text-align:right}
html[dir="rtl"] .site-header,html[dir="rtl"] .header-actions,html[dir="rtl"] nav,html[dir="rtl"] .actions,html[dir="rtl"] .performance-list,html[dir="rtl"] .chips,html[dir="rtl"] .form-actions{direction:rtl}
html[dir="rtl"] .brand{direction:ltr}
html[dir="rtl"] .nav-menu,html[dir="rtl"] .lang-menu,html[dir="rtl"] .mobile-nav,html[dir="rtl"] .mobile-programs-menu{text-align:right}
html[dir="rtl"] .text-link{display:inline-flex;flex-direction:row-reverse;gap:.3em}
html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select{text-align:right;direction:rtl}
html[dir="rtl"] .path-grid,html[dir="rtl"] .mini-grid,html[dir="rtl"] .d4-grid,html[dir="rtl"] .d5-policy-grid{direction:rtl}
html[dir="rtl"] .d4-split,html[dir="rtl"] .editorial,html[dir="rtl"] .founder,html[dir="rtl"] .d5-education,html[dir="rtl"] .d5-safe{direction:rtl}
html[dir="rtl"] .d4-split img,html[dir="rtl"] .editorial img,html[dir="rtl"] .founder img,html[dir="rtl"] .d5-education img,html[dir="rtl"] .d5-safe img{direction:ltr}
.lang-menu button[aria-current="true"],.mobile-langs button[aria-current="true"],.footer-langs button[aria-current="true"]{font-weight:800;text-decoration:underline;text-underline-offset:4px}
.lang-menu button:focus-visible,.mobile-langs button:focus-visible,.footer-langs button:focus-visible,.lang:focus-visible,.menu:focus-visible,.nav-dropbtn:focus-visible,.mobile-programs-btn:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.btn,.nav-menu a,.mobile-nav a,.lang-menu button,.mobile-langs button{min-height:44px}
.btn{height:auto;white-space:normal;text-align:center;line-height:1.2}
select,input,textarea{max-width:100%;min-width:0}
@media(max-width:980px){
  .header-actions{gap:.45rem}.header-cta{display:none}.language-switcher{display:block}.lang{min-width:44px;min-height:44px}
  .mobile-nav{overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .mobile-nav>a,.mobile-programs-btn{min-height:46px;display:flex;align-items:center}
  .mobile-langs{display:flex;flex-wrap:wrap;gap:.35rem}.mobile-langs button{min-width:48px;padding:.55rem .7rem}
}
@media(max-width:640px){
  .brand span{font-size:.72rem;line-height:1.05}.brand img{max-height:42px;width:auto}
  h1,h2{overflow-wrap:anywhere}.actions{gap:.65rem}.actions .btn{width:100%}
  .form-grid{grid-template-columns:minmax(0,1fr)!important}
  p,li,label,.btn,a{overflow-wrap:anywhere}
}
@media(max-height:460px) and (orientation:landscape){
  .site-header{min-height:58px}.brand img{max-height:38px}.mobile-nav{top:58px;max-height:calc(100dvh - 58px)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* MASTER responsive media QA — 2026-09-09 */
img{max-width:100%;display:block}
/* Content photography: never crop people, faces, weapons or medals. */
.d4-photo,.d5-founder-media,.d5-breadth-media,.d5-education-media,.founder-image,.school-media,.camp-image,.results-image{height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:visible!important;background:#081a2b}
.d4-photo img,.d5-founder-media img,.d5-breadth-media img,.d5-education-media img,.founder-image img,.school-media img,.camp-image img,.results-image img{position:static!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center!important}
/* Hero photography: portrait phones preserve the complete photo; landscape phones use a shallow contain frame. */
@media(max-width:767px) and (orientation:portrait){
  .d4-hero{display:flex!important;flex-direction:column!important;min-height:0!important;height:auto!important;align-items:stretch!important;background:#081a2b!important}
  .d4-hero>img{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center!important;order:0!important}
  .d4-hero-shade{background:linear-gradient(to bottom,transparent 0,rgba(8,26,43,.08) 30%,rgba(8,26,43,.96) 100%)!important}
  .d4-hero-copy{position:relative!important;margin-top:-42%!important;padding:28% 32px 58px!important;width:100%!important;max-width:none!important;order:1!important}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
  .d4-hero{min-height:calc(100svh - 58px)!important;height:auto!important;background:#081a2b!important;display:grid!important;grid-template-columns:minmax(0,48%) minmax(0,52%)!important;align-items:center!important;overflow:hidden!important}
  .d4-hero>img{position:relative!important;inset:auto!important;grid-column:2!important;grid-row:1!important;width:100%!important;height:calc(100svh - 58px)!important;min-height:240px!important;object-fit:contain!important;object-position:center!important;background:#081a2b!important}
  .d4-hero-shade{grid-column:1 / -1!important;grid-row:1!important;background:linear-gradient(90deg,#081a2b 0,#081a2b 44%,rgba(8,26,43,.42) 64%,rgba(8,26,43,.08) 100%)!important}
  .d4-hero-copy{grid-column:1!important;grid-row:1!important;padding:72px 24px 28px!important;align-self:end!important;max-width:none!important}
  .d4-hero h1{font-size:clamp(34px,6.4vh,58px)!important;line-height:.92!important}
  .d4-hero-copy>p:not(.eyebrow){font-size:14px!important;line-height:1.45!important}
}