/* V17: network background, light-mode portrait, complete hero frame and experience logos */
.hero{isolation:isolate;position:relative;background:var(--bg)!important;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(90deg,rgba(10,15,23,.91) 0%,rgba(10,15,23,.68) 38%,rgba(10,15,23,.08) 100%),url("assets/hero-network-dark.webp");background-position:center center;background-size:cover;opacity:.75;z-index:0}
body[data-theme="light"] .hero::before{background-image:linear-gradient(90deg,rgba(248,249,251,.93),rgba(248,249,251,.77) 42%,rgba(248,249,251,.16) 100%),url("assets/hero-network-light.webp");opacity:.86}
.hero-inner{z-index:2;min-height:485px!important;overflow:visible}
.hero-wave{opacity:.27}
.neural-hero.show-portrait{height:480px!important;align-self:stretch;overflow:visible!important}
.neural-hero.show-portrait .portrait-visual{inset:0 -8% -1% -5%!important;overflow:visible!important}
.neural-hero.show-portrait .portrait-visual img{height:100%!important;width:100%!important;object-fit:contain!important;object-position:center bottom!important;filter:none!important;mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 100%)!important;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 100%)!important}
body[data-theme="light"] .neural-hero.show-portrait .portrait-visual img{filter:none!important;opacity:1!important}
body[data-theme="light"] .hero .hero-copy{background:none!important}
body[data-theme="light"] .skill-word:hover,body[data-theme="light"] .skill-word:focus-visible{background:#e6ebf0!important;border-color:#a7b7c5!important;box-shadow:0 4px 15px rgba(42,60,85,.12)!important}
body[data-theme="light"] .skill-word{transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
body[data-theme="light"] .header-logo{filter:brightness(0) saturate(100%)!important}
.story-panel .story-quote blockquote{font-size:clamp(19px,1.95vw,25px)!important;line-height:1.46!important}
.experience-head{display:flex!important;align-items:center;gap:15px!important;min-width:0;flex-wrap:wrap}
.experience-company-logo{display:inline-flex;align-items:center;justify-content:center;flex:none;width:88px;min-height:48px;border-radius:9px;background:color-mix(in srgb,var(--panel) 68%,transparent);border:1px solid var(--border);padding:7px 5px}
.experience-company-logo:empty{display:none}
.experience-company-logo img{display:block;max-height:33px;max-width:78px;width:100%;height:auto;object-fit:contain}
.experience-head .company-name{flex:1 1 130px;min-width:0}
.experience-head .company-period{margin-left:auto}
body[data-theme="light"] .timeline-card:hover,body[data-theme="light"] .project-card:hover,body[data-theme="light"] .cert-card:hover{background:linear-gradient(120deg,#edf1f5,#f9fafc)!important;border-color:#a6b4c2!important;box-shadow:0 10px 24px rgba(35,50,70,.10)!important}
@media(max-width:690px){
 .hero::before{background-position:60% center;opacity:.66;background-image:linear-gradient(180deg,rgba(11,15,23,.45) 0%,rgba(11,15,23,.29) 37%,rgba(11,15,23,.91) 83%,var(--bg) 100%),url("assets/hero-network-dark.webp")}
 body[data-theme="light"] .hero::before{background-image:linear-gradient(180deg,rgba(247,248,251,.50) 0%,rgba(247,248,251,.36) 38%,rgba(247,248,251,.94) 87%,var(--bg) 100%),url("assets/hero-network-light.webp");opacity:.72}
 .hero::after{background:linear-gradient(180deg,transparent 0%,transparent 26%,color-mix(in srgb,var(--bg) 8%,transparent) 44%,color-mix(in srgb,var(--bg) 86%,transparent) 85%,var(--bg) 100%)!important}
 .neural-hero.show-portrait{height:340px!important;width:100vw!important;max-width:100vw!important;right:-8px!important;top:0!important;overflow:visible!important}
 .neural-hero.show-portrait .portrait-visual{inset:-7px 0 0 -8px!important}
 .neural-hero.show-portrait .portrait-visual img{object-fit:contain!important;object-position:right top!important;mask-image:linear-gradient(to bottom,#000 0%,#000 82%,transparent 100%)!important;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 82%,transparent 100%)!important}
 .hero-inner{min-height:480px!important}
 .hero-copy{padding-top:255px!important}
 .experience-company-logo{width:69px;min-height:40px;padding:5px}
 .experience-company-logo img{max-height:29px;max-width:60px}
 .experience-head{gap:10px!important}
 .story-panel .story-quote blockquote{font-size:20px!important}
}
@media(max-width:390px){.hero-copy{padding-top:235px!important}.neural-hero.show-portrait{height:315px!important}}
