/* Phone layouts give imagery its own space instead of cropping behind long copy. */
@media(max-width:720px){
 .hero{display:flex;flex-direction:column;height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;background:#0e1b2c}
 .hero:before{display:none}
 .hero-content{order:0;width:100%;padding:112px 6% 32px!important;position:relative!important;transform:none!important}
 .hero h1{font-size:clamp(42px,12vw,62px);line-height:1.05;margin:22px 0;max-width:14ch}
 .hero p{font-size:16px;line-height:1.65;margin-bottom:0}
 .hero-actions{gap:12px 22px;margin-top:24px}
 .hero-actions .primary{min-height:48px}
 .hero-gallery{order:1;position:relative;inset:auto;z-index:0;width:100%;aspect-ratio:16/10;overflow:hidden}
 .hero-gallery .hero-image{object-position:center;transform:none!important;scale:1!important;animation:none!important}
 .hero-image[src*="automotive-industry"],.subhero img[src*="automotive-industry"]{object-position:100% center}
 .hero-image[src*="fintech-industry"],.subhero img[src*="fintech-industry"]{object-position:75% center}
 .hero-bottom{order:2;position:relative;inset:auto;margin:0;padding:12px 6% 24px;width:100%;background:#0e1b2c}
 .hero-bottom span:first-child{word-spacing:normal}
 .industry-browser-heading{font-size:12px}
 .industry-browser-footer{gap:14px;font-size:12px;align-items:flex-start}
 .industry-browser-footer a{padding:10px 0;min-height:44px}
 .industry-rail{scroll-padding-inline:8px}
 .header{min-height:66px;backdrop-filter:blur(18px)}
 .header .menu{min-width:48px;min-height:44px;padding:10px 0;font-size:14px}
 .header .brand img{width:160px;max-width:52vw}
 .hero-content .overline,.hero-content h1,.hero-content p,.hero-actions{animation:none}
 .chapter-intro{text-align:left}
 .chapter-intro p{margin-left:0}
 .experience{display:flex;flex-direction:column;padding:0;isolation:auto;background:var(--surface)}
 .experience>img{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center;z-index:0}
 .experience:before{display:none}
 .experience-label{top:16px;left:16px;z-index:1;background:#0a162bd9;padding:10px 14px;border-radius:6px;max-width:27ch}
 .panel{position:relative;border-radius:0;padding:24px 18px;min-height:0;box-shadow:none}
 .tabs button{font-size:11px;line-height:1.4;min-height:48px;white-space:normal}
 .panel h3{font-size:32px}
 .subpage main{padding-top:80px}
 .subwrap{padding-top:28px}
 .subhero{gap:26px}
 .subhero img:not(.daniel-portrait){height:auto;aspect-ratio:16/10;object-position:center;animation:none}
 .subhero img[src*="automotive-industry"]{object-position:100% center}
 .subhero img[src*="fintech-industry"]{object-position:75% center}
 .subhero img.daniel-portrait{height:auto;aspect-ratio:auto;max-width:320px;justify-self:center;animation:none}
 .subhero h1,.subhero p{animation:none}
 .reveal.pending{opacity:1;transform:none}
 .content-section{margin-top:32px;padding-top:32px;padding-bottom:24px}
 .footer{padding:28px 6%}
 .footer a{display:inline-flex;align-items:center;min-height:44px}
 dialog{width:calc(100% - 24px);padding:22px;max-height:90svh}
 dialog h2{font-size:30px}
 .form input,.form textarea,.form select{font-size:16px}
}