/* V5 – Portrait-first, balanced executive redesign · 15 November 2026 */
:root{--content-max:1280px;--quiet-ink:#acc6da}
/* Increase section-background visibility without compromising text contrast. */
#overview{background-image:linear-gradient(100deg,rgba(3,14,28,.93) 0%,rgba(4,18,35,.84) 43%,rgba(5,26,43,.58) 100%),url('images/broadcast-wide.webp')!important;background-position:center 41%!important;min-height:unset!important;padding:48px 0 65px!important}
#overview::before{background:radial-gradient(ellipse at 80% 30%,rgba(16,190,220,.15),transparent 46%),linear-gradient(0deg,rgba(3,14,27,.64),transparent 36%)}
#overview .hero-overline{margin:0 0 22px}
#overview .max-w-7xl > .mb-8{margin-bottom:30px!important}
#overview .grid.lg\:grid-cols-12{align-items:center!important;column-gap:clamp(24px,4vw,52px);row-gap:30px}
#overview h1{font-size:clamp(3.6rem,5.8vw,6.25rem)!important;line-height:1.03!important;letter-spacing:-.072em;white-space:nowrap}
#overview #hero-subtitle{font-size:clamp(1.12rem,1.43vw,1.36rem);line-height:1.45}
#overview #hero-summary{font-size:14px;line-height:1.84}
#overview .hero-copy{padding:4px 0 0!important;min-width:0}
#overview .hero-copy .flex.flex-wrap.items-center.gap-x-6{gap:10px 19px}
#overview .hero-side{width:100%;min-width:0;transform:none!important;align-self:stretch!important;display:flex;justify-content:center}
#overview .hero-editorial-image{height:clamp(420px,40vw,550px);width:100%;max-width:495px;margin-left:auto;margin-right:auto;border-radius:26px;border:1px solid rgba(129,225,248,.53);box-shadow:0 30px 72px rgba(0,0,0,.5),0 0 0 6px rgba(24,175,211,.09),0 0 60px rgba(56,189,248,.15);background:#08192a}
#overview .hero-editorial-image img{object-position:50% 38%;filter:brightness(1.04) saturate(1.08) contrast(1.015)}
#overview .hero-editorial-image::after{background:linear-gradient(180deg,transparent 68%,rgba(4,19,32,.25) 100%)}
#overview .frame-glint{inset:12px;border-radius:17px;border-color:rgba(255,255,255,.18)}
/* Move executive impact BELOW both hero columns; compact, symmetrical and legible. */
.hero-impact-strip{margin:30px auto 0;max-width:1280px}
#overview .hero-impact-strip>.rounded-2xl{background:linear-gradient(105deg,rgba(6,27,44,.9),rgba(8,34,54,.93))!important;border:1px solid rgba(87,185,215,.38)!important;padding:22px 25px!important;display:grid;grid-template-columns:175px minmax(0,1.15fr) minmax(0,1.3fr);align-items:center;gap:18px!important;box-shadow:0 22px 52px rgba(0,0,0,.27);backdrop-filter:blur(18px)}
#overview .hero-impact-strip>.rounded-2xl>.border-b{border:0!important;padding:0!important;margin:0!important;align-items:center}
#overview .hero-impact-strip>.rounded-2xl>.border-b h2{font-size:17px;color:#f3faff!important;line-height:1.24}
#overview .hero-impact-strip>.rounded-2xl>.border-b .w-10{display:none}
#overview .hero-impact-strip>.rounded-2xl>.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px!important}
#overview .hero-impact-strip>.rounded-2xl>.grid>div{padding:10px 9px!important;min-height:74px;display:flex;flex-direction:column;justify-content:center;background:rgba(28,60,85,.65)!important;border:1px solid rgba(112,198,228,.15)}
#overview .hero-impact-strip>.rounded-2xl>.grid .text-2xl{font-size:17px!important;white-space:nowrap}
#overview .hero-impact-strip>.rounded-2xl>.grid .text-xs{font-size:9px;color:#a7c0d2!important;line-height:1.4}
#overview .hero-impact-strip>.rounded-2xl>.space-y-2{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px;margin:0!important;padding:0!important}
#overview .hero-impact-strip>.rounded-2xl>.space-y-2>div{align-items:flex-start;font-size:10px;color:#b9cede;line-height:1.47}
#overview .hero-impact-strip>.rounded-2xl>.space-y-2 svg{width:13px;height:13px;flex-shrink:0;margin-top:2px}
#overview .hero-scroll-hint{display:none!important}
/* More intentional project grid and headers; last odd item is centered. */
#projects{background-image:linear-gradient(109deg,rgba(3,16,30,.82) 0%,rgba(6,22,37,.70) 49%,rgba(3,16,30,.83) 100%),url('images/studio-mixer.webp')!important;background-position:center 40%!important;background-size:cover!important}
#projects-grid{align-items:stretch}
#projects-grid>.project-card{height:100%}
#projects-grid>.project-card:last-child:nth-child(odd){grid-column:1/-1;max-width:calc((100% - 24px)/2);width:100%;justify-self:center}
#project-filters{align-items:center;justify-content:flex-end;max-width:590px}
#leadership>.flex:first-child{align-items:center}
#leadership>.grid .card-hover{height:100%}
#tech-stack{background-image:linear-gradient(112deg,rgba(5,19,32,.83),rgba(5,22,37,.70),rgba(5,19,32,.80)),url('images/engineering-desk.webp')!important;background-position:center 38%!important}
#tech-stack>.max-w-7xl>.grid{align-items:stretch}
#tech-stack>.max-w-7xl>.grid>.rounded-2xl{height:100%;border-color:rgba(94,181,208,.28)!important;background:rgba(9,31,48,.88)!important;backdrop-filter:blur(9px)}
/* Credentials: clear hierarchy, consistently sized tiles, structured training chips. */
#education{border-radius:22px!important;padding:35px 37px!important;border-color:rgba(98,191,218,.38)!important}
#education>.grid{align-items:center!important;gap:30px}
#education .lg\:col-span-8.grid>.rounded-xl:not(.credential-training-grid){min-height:93px;display:flex;flex-direction:column;justify-content:center;border-color:rgba(100,169,203,.2)!important}
#education .credential-training-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px!important;border:0!important;background:transparent!important;padding:0!important}
#education .credential-training-grid>span{display:flex;align-items:center;padding:13px 14px;min-height:64px;border-radius:12px;background:rgba(27,52,72,.88);border:1px solid rgba(95,163,195,.22);font-size:11px;line-height:1.5}
#education .credential-training-grid>span strong{color:#f1fbff}
#education.has-credential-photo .credentials-photo{opacity:.33;width:32%}
/* Contact editorial split: portrait on the left, content aligned to the right. */
#contact{background-image:linear-gradient(110deg,rgba(3,15,27,.78),rgba(5,19,33,.73),rgba(4,18,33,.82)),url('images/field-satellite.webp')!important;background-position:center 48%!important;padding-top:90px!important;padding-bottom:78px!important;min-height:650px}
#contact .contact-photo-side{left:max(30px,calc((100vw - 1225px)/2));top:72px;width:clamp(235px,25vw,340px);height:calc(100% - 144px);max-height:510px;opacity:1;box-shadow:0 28px 70px rgba(0,0,0,.5);border-color:rgba(127,218,237,.48)}
#contact .contact-photo-side img{object-position:center 41%;filter:brightness(1.08) saturate(1.06)}
#contact>.max-w-5xl{position:relative;max-width:1225px!important;padding-left:clamp(315px,30vw,390px)!important;padding-right:30px!important;text-align:left!important}
#contact>.max-w-5xl>h2{font-size:clamp(2rem,3vw,2.9rem);line-height:1.18;max-width:820px}
#contact>.max-w-5xl>p{margin-left:0!important;margin-right:0!important;max-width:780px}
#contact>.max-w-5xl>.grid{max-width:100%!important;margin-left:0!important;margin-right:0!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#contact>.max-w-5xl>.grid a{min-width:0;padding:18px 12px!important}
#contact>.max-w-5xl>.grid a .font-bold{font-size:12px!important;overflow-wrap:anywhere;line-height:1.45}
#contact>.max-w-5xl>.pt-10{gap:16px;text-align:left}
/* Responsive refinements */
@media(max-width:1200px) and (min-width:1024px){
 #overview h1{font-size:clamp(3.3rem,5vw,4.5rem)!important}
 .hero-impact-strip>.rounded-2xl{grid-template-columns:150px minmax(0,1fr) minmax(0,1.2fr)!important;gap:12px!important}
 #overview .hero-impact-strip>.rounded-2xl>.grid .text-2xl{font-size:15px!important}
 #contact .contact-photo-side{width:270px}
 #contact>.max-w-5xl{padding-left:300px!important}
}
@media(max-width:1023px){
 #overview .hero-side{align-self:stretch!important;max-width:100%}
 #overview .hero-editorial-image{max-width:420px;height:510px}
 #overview .hero-impact-strip>.rounded-2xl{grid-template-columns:1fr 1.4fr!important;gap:15px!important}
 #overview .hero-impact-strip>.rounded-2xl>.space-y-2{grid-column:1/-1}
 #contact .contact-photo-side{left:24px;width:235px}
 #contact>.max-w-5xl{padding-left:285px!important}
 #contact>.max-w-5xl>.grid{grid-template-columns:1fr!important}
 #contact>.max-w-5xl>.grid a{flex-direction:row;justify-content:flex-start;gap:14px;text-align:left}
}
@media(max-width:767px){
 #overview{padding:30px 0 65px!important}
 #overview h1{font-size:clamp(3rem,11vw,5.25rem)!important;white-space:normal;line-height:1!important}
 #overview .hero-overline{margin-bottom:23px}
 #overview .hero-editorial-image{width:100%;max-width:450px;height:clamp(360px,90vw,505px);margin:0 auto}
 #overview .hero-side{display:block!important}
 #overview .hero-impact-strip{margin-top:25px}
 #overview .hero-impact-strip>.rounded-2xl{grid-template-columns:1fr!important;padding:21px!important}
 #overview .hero-impact-strip>.rounded-2xl>.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #overview .hero-impact-strip>.rounded-2xl>.space-y-2{grid-template-columns:1fr;grid-column:auto}
 #overview #hero-summary{font-size:13px;line-height:1.78}
 #projects-grid>.project-card:last-child:nth-child(odd){grid-column:auto;max-width:none}
 #project-filters{justify-content:flex-start}
 #education{padding:24px 20px!important}
 #education>.grid{gap:20px}
 #education .credential-training-grid{grid-template-columns:1fr!important}
 #education .credential-training-grid>span{min-height:unset;padding:12px 14px}
 #contact{padding:30px 0 55px!important;min-height:unset}
 #contact .contact-photo-side{position:relative;left:auto;top:auto;width:min(90%,440px);height:360px;margin:0 auto 32px}
 #contact .contact-photo-side img{object-position:center 35%}
 #contact>.max-w-5xl{padding:0 18px!important;text-align:center!important}
 #contact>.max-w-5xl>p{margin-left:auto!important;margin-right:auto!important}
 #contact>.max-w-5xl>.grid{max-width:520px!important;margin:auto!important;grid-template-columns:1fr!important}
 #contact>.max-w-5xl>.grid a{flex-direction:column;justify-content:center;text-align:center}
 #contact>.max-w-5xl>.pt-10{text-align:center}
 body.section-isolated[data-active-section="education"] #education{padding:26px 20px!important}
}
@media(max-width:420px){#overview .hero-editorial-image{height:345px}#contact .contact-photo-side{height:260px}#overview .hero-impact-strip>.rounded-2xl>.grid .text-2xl{font-size:17px!important}}
@media(prefers-reduced-motion:reduce){#overview .hero-editorial-image img{transition:none!important}}
@media print{.hero-impact-strip>.rounded-2xl{display:block!important;background:#fff!important}.hero-impact-strip>.rounded-2xl>div{margin:12px 0!important}#contact>.max-w-5xl{padding:0!important}#contact .contact-photo-side{display:none!important}#projects-grid>.project-card:last-child:nth-child(odd){max-width:none!important}}

/* Final polish: readable credentials and compact mobile controls. */
#education .credential-training-grid>span{display:block!important;min-height:67px}
#education .credential-training-grid>span strong{display:block;margin-bottom:4px}
#education .lg\:col-span-8.grid>.rounded-xl:not(.credential-training-grid){background:rgba(22,43,61,.96)!important}
@media(max-width:480px){
 .glass-nav>.max-w-7xl>a[href="#overview"]{min-width:0;flex:1;gap:8px;overflow:hidden}
 .glass-nav>.max-w-7xl>a[href="#overview"]>div:last-child{min-width:0;overflow:hidden}
 .glass-nav>.max-w-7xl>a[href="#overview"]>div:last-child>div:last-child{max-width:180px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:10px}
 #overview>.max-w-7xl>.mb-8{width:100%;overflow:hidden}
 #overview>.max-w-7xl>.mb-8>.flex.flex-wrap{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:thin;padding-bottom:3px}
 #overview>.max-w-7xl>.mb-8>.flex.flex-wrap>button{flex:0 0 auto;white-space:nowrap}
}
