/* V19: transparent floating header over the same full-bleed hero scene */
:root { --v19-header-height:76px; }
html {scroll-padding-top:86px}
.header{
 position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;
 z-index:80!important;border:0!important;background:transparent!important;
 box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
 transition:background .25s,border-color .25s,box-shadow .25s,backdrop-filter .25s!important;
}
.header:not(.is-scrolled),body[data-theme="light"] .header:not(.is-scrolled){
 background:transparent!important;border:0!important;box-shadow:none!important;
 backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.header.is-scrolled{background:rgba(12,17,25,.87)!important;box-shadow:0 8px 28px rgba(0,0,0,.18)!important;border-bottom:1px solid var(--border)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
body[data-theme="light"] .header.is-scrolled{background:rgba(249,250,252,.93)!important;box-shadow:0 8px 28px rgba(30,46,65,.09)!important}
.header-inner{height:var(--v19-header-height)!important;min-height:0!important;display:flex;align-items:center;justify-content:space-between}
.header-right{align-items:center!important;gap:10px!important}
.header-cv,#themeToggle{height:42px!important;align-self:center!important;margin:0!important;line-height:1!important}
#themeToggle{width:42px!important;min-width:42px!important;padding:0!important;display:grid!important;place-items:center!important}
#themeToggle .theme-sun,#themeToggle .theme-moon{margin:0!important;padding:0!important;position:static!important;align-items:center!important;justify-items:center!important}
#themeToggle svg{width:21px!important;height:21px!important}
.hero{position:relative!important;min-height:500px!important;overflow:hidden!important;isolation:isolate;}
.hero::before{inset:0!important;background-size:cover!important;background-position:center center!important;opacity:1!important;z-index:0!important}
.hero-inner{position:relative!important;min-height:500px!important;padding-top:var(--v19-header-height)!important;z-index:2!important;overflow:visible!important}
.hero-copy{z-index:5!important;background:none!important;filter:none!important;opacity:1!important;mix-blend-mode:normal!important}
.hero h1,.hero .hero-role,.hero .hero-intro,.hero .availability{opacity:1!important;filter:none!important;mix-blend-mode:normal!important;text-shadow:none!important}
.hero h1{white-space:normal!important;letter-spacing:-.045em!important;overflow-wrap:normal}
.hero h1 span{display:inline-block;white-space:nowrap}
.hero .hero-role{color:var(--text)!important}
.hero .hero-intro{color:var(--muted)!important}
/* Keep network uninterrupted behind portrait, with contrast only on the TEXT side */
body[data-theme="dark"] .hero::before{background-image:linear-gradient(90deg,rgba(8,13,21,.60) 0%,rgba(8,13,21,.19) 48%,rgba(8,13,21,.0) 76%),url("assets/hero-network-dark.webp")!important}
body[data-theme="light"] .hero::before{background-image:linear-gradient(90deg,rgba(247,249,252,.59) 0%,rgba(247,249,252,.13) 52%,rgba(247,249,252,0) 78%),url("assets/hero-network-light.webp")!important}
.neural-hero.show-portrait{align-self:stretch!important;max-height:none!important;min-height:400px!important;overflow:visible!important}
.neural-hero.show-portrait .portrait-visual{inset:0 -3% -1% -5%!important;overflow:visible!important}
.neural-hero.show-portrait .portrait-visual img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;opacity:1!important;filter:none!important;mask-image:linear-gradient(to bottom,#000 0%,#000 88%,transparent 100%)!important;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 88%,transparent 100%)!important}
body[data-theme="light"] .neural-hero.show-portrait .portrait-visual img{filter:none!important;opacity:1!important}
/* Clear experience rows, full-card buttons, always logo-left and text-right */
#experience .timeline-viewport:not(.experience-scrollable){overflow:visible!important;max-height:none!important;mask-image:none!important;padding:2px!important}
#experience .timeline{display:flex!important;flex-direction:column!important;gap:12px!important;padding:0!important;margin:0!important;border:0!important}
#experience .timeline-card.v19-experience{display:grid!important;grid-template-columns:98px minmax(0,1fr)!important;align-items:center!important;gap:17px!important;text-align:left!important;padding:16px 20px!important;min-height:117px!important;max-height:none!important;border-radius:16px!important;white-space:normal!important;position:relative}
#experience .v19-experience .experience-company-logo{width:98px!important;height:80px!important;min-height:80px!important;max-width:98px!important;display:grid!important;place-items:center!important;padding:7px!important;background:#f9fafb!important;border:1px solid rgba(120,135,150,.17)!important;border-radius:13px!important;flex:none!important}
#experience .v19-experience .experience-company-logo:empty{display:none!important}
#experience .v19-experience .experience-company-logo img{width:100%!important;max-width:85px!important;max-height:66px!important;height:100%!important;object-fit:contain!important}
#experience .v19-experience .experience-copy{display:flex!important;flex-direction:column!important;min-width:0!important;align-items:flex-start!important}
#experience .v19-experience .experience-head{display:flex!important;flex-wrap:wrap!important;width:100%!important;gap:7px 13px!important;align-items:baseline!important;justify-content:space-between!important;margin-bottom:3px!important}
#experience .v19-experience .company-name{font-weight:800!important;flex:0 1 auto!important;font-size:18px!important;color:var(--text)!important}
#experience .v19-experience .company-period{font-size:12px!important;letter-spacing:0!important;color:var(--muted)!important;margin-left:0!important}
#experience .v19-experience .job-title{display:block!important;font-size:13px!important;font-weight:690!important;line-height:1.35!important;margin:0 0 3px!important;color:var(--text)!important}
#experience .v19-experience .experience-description{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;font-size:12px!important;line-height:1.45!important;color:var(--muted)!important;margin:0!important;max-width:100%}
#experience .v19-experience .experience-more{font-size:11px!important;font-weight:750!important;color:var(--accent2)!important;margin:6px 0 0!important;display:inline-block!important}
#experience .timeline-card:hover,#experience .timeline-card:focus-visible{transform:translateY(-2px)!important;border-color:var(--accent)!important}
body[data-theme="light"] #experience .timeline-card:hover{background:linear-gradient(115deg,#f0f4f8,#ffffff)!important}
@media (max-width:970px){
 .hero h1{font-size:clamp(44px,6.1vw,70px)!important}
 .hero-inner{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)!important}
 .hero::before{background-position:63% center!important}
}
@media (max-width:690px){
 :root{--v19-header-height:65px}
 html{scroll-padding-top:70px}
 .header-inner{height:var(--v19-header-height)!important}
 .header-right{gap:7px!important}
 .header-cv{height:37px!important;font-size:11px!important;min-width:104px!important}
 #themeToggle{width:37px!important;height:37px!important;min-width:37px!important}
 #themeToggle svg{width:19px!important;height:19px!important}
 .hero{min-height:0!important;overflow:hidden!important}
 .hero-inner{display:block!important;position:relative!important;padding-top:var(--v19-header-height)!important;min-height:510px!important;isolation:isolate!important}
 .hero::before{background-size:cover!important;background-position:center center!important;opacity:1!important}
 body[data-theme="dark"] .hero::before{background-image:linear-gradient(180deg,rgba(8,13,21,0) 0%,rgba(8,13,21,.05) 34%,rgba(8,13,21,.35) 57%,rgba(8,13,21,.76) 82%,rgba(8,13,21,.85) 100%),url("assets/hero-network-dark.webp")!important}
 body[data-theme="light"] .hero::before{background-image:linear-gradient(180deg,rgba(249,250,253,0) 0%,rgba(249,250,253,.06) 34%,rgba(249,250,253,.45) 57%,rgba(249,250,253,.82) 84%,rgba(249,250,253,.9) 100%),url("assets/hero-network-light.webp")!important}
 .hero::after{background:none!important;opacity:0!important}
 .neural-hero.show-portrait{position:absolute!important;top:60px!important;right:-11px!important;left:auto!important;width:min(96vw,385px)!important;max-width:none!important;min-height:0!important;height:315px!important;margin:0!important;overflow:visible!important;transform:none!important;z-index:1!important;pointer-events:none!important}
 .neural-hero.show-portrait .portrait-visual{inset:0!important}
 .neural-hero.show-portrait .portrait-visual img{object-fit:contain!important;object-position:right bottom!important;mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 99%)!important;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 99%)!important}
 .hero-copy{position:relative!important;z-index:5!important;padding:205px 0 33px!important;margin:0!important;background:none!important;opacity:1!important;filter:none!important;max-width:100%!important}
 .hero h1{font-size:clamp(41px,11vw,59px)!important;line-height:1.04!important;letter-spacing:-.035em!important;white-space:normal!important;max-width:100%!important;margin:0 0 8px!important;color:var(--text)!important}
 .hero h1 span{display:block!important;white-space:nowrap!important;color:var(--text)!important}
 .hero-copy .hero-role{font-size:19px!important;line-height:1.3!important;font-weight:750!important;margin-top:8px!important;color:var(--text)!important}
 .hero-copy .hero-intro{font-size:14px!important;line-height:1.5!important;color:var(--text)!important;max-width:360px!important;margin:11px 0 15px!important}
 .hero-copy .availability{font-size:11px!important;opacity:1!important;filter:none!important;background:color-mix(in srgb,var(--panel) 93%,transparent)!important;max-width:100%!important}
 #experience .timeline-card.v19-experience{grid-template-columns:74px minmax(0,1fr)!important;gap:12px!important;padding:13px 12px!important;min-height:107px!important}
 #experience .v19-experience .experience-company-logo{width:74px!important;max-width:74px!important;min-height:70px!important;height:70px!important;padding:5px!important;border-radius:11px!important}
 #experience .v19-experience .experience-company-logo img{max-width:64px!important;max-height:59px!important}
 #experience .v19-experience .company-name{font-size:15px!important}
 #experience .v19-experience .company-period{font-size:10px!important}
 #experience .v19-experience .job-title{font-size:11.5px!important}
 #experience .v19-experience .experience-description{font-size:11px!important;line-height:1.42!important}
 #experience .v19-experience .experience-more{font-size:10px!important}
}
@media (max-width:375px){
 .hero-inner{min-height:492px!important}
 .hero-copy{padding-top:198px!important}
 .hero h1{font-size:42px!important}
 .neural-hero.show-portrait{width:100vw!important;height:297px!important;right:-8px!important}
 #experience .timeline-card.v19-experience{grid-template-columns:66px minmax(0,1fr)!important;gap:10px!important}
 #experience .v19-experience .experience-company-logo{width:66px!important;min-height:64px!important;height:64px!important}
}
@media(prefers-reduced-motion:reduce){.header,.timeline-card{transition:none!important}}

/* Keep download action in the floating header even on narrow devices. */
@media(max-width:850px){.header-cv{display:inline-flex!important}}
@media(max-width:690px){
 .header-inner{gap:5px!important}
 .header-right{gap:5px!important}
 .header-cv{min-width:92px!important;padding:0 7px!important;font-size:10px!important}
 .menu-toggle{width:31px!important;padding:4px!important}
 .menu-toggle span{width:22px!important}
 .hero h1 span{display:block!important}
}
@media(max-width:365px){
 .header-logo{max-width:42px!important}
 .header-cv{min-width:86px!important;font-size:9px!important}
 .hero h1{font-size:40px!important}
}
/* In narrow views the portrait ends softly above the headline: no dark suit over black text. */
@media(max-width:690px){
 .neural-hero.show-portrait{top:63px!important;height:267px!important;width:min(90vw,350px)!important;right:-6px!important}
 .neural-hero.show-portrait .portrait-visual img{mask-image:linear-gradient(to bottom,#000 0%,#000 59%,rgba(0,0,0,.6) 70%,transparent 89%)!important;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 59%,rgba(0,0,0,.6) 70%,transparent 89%)!important}
}