/* Portrait-led second section; the remaining portfolio keeps its established navy design. */
.personal-intro{position:relative;isolation:isolate;overflow:clip;background:#0b1524}
.personal-intro:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;mask-image:linear-gradient(transparent,#000 14%,#000 80%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 80%,transparent);background:radial-gradient(ellipse at 82% 40%,#82455630,transparent 58%),radial-gradient(ellipse at 20% 5%,#35455e2b,transparent 60%),linear-gradient(145deg,#0c1728,#131925 72%,#0b1524)}
.intro-layout{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr;min-height:850px;min-height:max(850px,100svh);padding-top:130px;padding-bottom:26px}
.intro-wordmark{position:absolute;z-index:-1;top:124px;left:48px;right:48px;height:205px;pointer-events:none;overflow:hidden}
.intro-wordmark svg{display:block;width:100%;height:100%;overflow:visible}
.intro-wordmark text{font-family:Impact,'Arial Narrow','Arial Black',sans-serif;font-size:260px;font-weight:900;letter-spacing:-3px;fill:url(#intro-title-ink)}
.intro-copy{position:relative;z-index:2;width:47%;max-width:565px;min-width:0;padding:220px 0 34px}
.intro-greeting{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;color:#c8d0d9;font:19px/1.7 var(--sans)}
.intro-name{display:inline;font:650 30px/1.45 var(--sans);letter-spacing:.035em;color:#f2d7d7;margin:0}
.intro-name>span{font:400 21px/1 var(--sans);color:#c8d0d9;margin-left:5px}
.intro-kicker{color:#8796ab;font:9px/1.7 var(--sans);letter-spacing:.22em;margin-top:8px}
.intro-role{display:flex;flex-direction:column;align-items:flex-start;gap:8px;font:650 clamp(40px,4vw,55px)/1.3 var(--sans);letter-spacing:.035em;color:#f4f1ed;margin-top:28px}
.intro-role>span{font:10px/1.8 var(--sans);color:#c18c91;letter-spacing:.22em}
.intro-experience{display:flex;align-items:baseline;gap:6px;margin:24px 0 22px;font:500 17px/1.7 var(--sans);letter-spacing:.035em;color:#efa3a7}
.intro-experience strong{font:600 20px/1.5 var(--sans)}
.intro-bio{font:14px/2.05 var(--sans);color:#b9c3d0;letter-spacing:.015em;max-width:440px}
.intro-bio p+p{margin-top:6px}
.intro-skills{display:flex;flex-wrap:wrap;gap:0;margin-top:22px;color:#9ba9bc;font:10px/1.7 var(--sans);letter-spacing:.03em}
.intro-skills>span+span:before{content:'/';margin:0 13px;color:#69788c}
.intro-actions{display:flex;flex-wrap:wrap;align-items:center;gap:25px;margin-top:29px}
.intro-actions>a{display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:47px;font:12px/1.6 var(--sans);letter-spacing:.03em;transition:background .2s,border-color .2s,color .2s}
.intro-actions>a:first-child{padding:13px 22px;border:1px solid #cf879264;border-radius:4px;background:#d3889610;color:#f6e6e3}
.intro-actions>a:first-child:hover{background:#d3889626;border-color:#edb0b8}
.intro-actions>a:last-child{gap:13px;color:#aebbc9}
.intro-actions>a:last-child:hover{color:#f2c8cc}
.intro-actions>a>span{font-size:18px;line-height:1}
.intro-portrait{position:absolute;z-index:1;right:18px;top:147px;height:calc(100% - 217px);width:54%;max-width:680px;margin:0;display:flex;justify-content:center;pointer-events:none}
.intro-portrait>img{display:block;width:auto;max-width:100%;height:auto;max-height:100%;align-self:flex-start;object-fit:contain;mask-image:linear-gradient(#000 0%,#000 48%,#000e 60%,#000a 71%,#0004 82%,#0001 90%,transparent 97%);-webkit-mask-image:linear-gradient(#000 0%,#000 48%,#000e 60%,#000a 71%,#0004 82%,#0001 90%,transparent 97%)}
.intro-caption{position:absolute;right:43px;bottom:20px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;color:#8896a8;font:8px/1.7 var(--sans);letter-spacing:.12em}
.intro-caption>span:last-child{font:12px/1.7 var(--serif);letter-spacing:.1em;color:#aab5c0}
.intro-bottom{position:relative;z-index:2;align-self:end;display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;border-top:0;padding-top:21px;color:#8e9bad;font:10px/1.8 var(--sans);letter-spacing:.06em}
.intro-bottom>a{display:flex;align-items:center;gap:22px;color:#c2cbd6}
.intro-bottom>a>span{color:#edb3b7}
.intro-bottom>a:hover{color:#f7dce0}

/* Keep the original typography in the landscape section below. */
.hero-night .hero-headline{font:400 clamp(67px,6.5vw,96px)/1.24 var(--serif);letter-spacing:-.045em;margin:32px 0 30px;text-shadow:0 3px 24px #08122120}
.hero-night .hero-headline em{display:inline-block;padding-left:.52em;position:relative;color:#e8c48c}
.hero-night .hero-headline em:before{content:'';position:absolute;width:24px;height:1px;top:57%;left:0;background:var(--accent)}

/* The cursor tip is the star, matching the spark origin exactly. */
@media(hover:hover) and (pointer:fine){
 html,body,body a,body button,body summary,body [role=button],body label,body canvas,body .poster-card{cursor:url('assets/ui/fairy-wand-1010.svg') 9 9,auto}
 body input,body textarea,body [contenteditable=true]{cursor:text}
}
@media(min-width:1600px){.intro-layout{max-width:1440px;padding-top:145px;min-height:max(950px,100svh)}.intro-wordmark{top:145px;height:230px}.intro-copy{padding-top:250px}.intro-portrait{width:56%;max-width:740px;top:177px;height:calc(100% - 254px)}.intro-bio{font-size:15px;max-width:460px}.intro-actions{margin-top:34px}.hero-night .hero-headline{font-size:106px}}
@media(max-width:1100px){.intro-layout{min-height:830px;padding-top:126px}.intro-wordmark{top:126px;left:36px;right:36px;height:180px}.intro-copy{width:49%;padding-top:190px}.intro-role{font-size:43px}.intro-bio{font-size:13px;max-width:405px}.intro-experience{font-size:15px}.intro-portrait{width:54%;right:0;top:170px;height:calc(100% - 244px)}.intro-caption{right:35px}.intro-name{font-size:28px}.hero-night .hero-headline{font-size:73px}}
@media(min-width:721px) and (max-width:900px){.intro-layout{min-height:800px}.intro-wordmark{left:26px;right:26px;height:150px;top:118px}.intro-copy{width:52%;padding-top:165px}.intro-role{font-size:37px}.intro-portrait{width:51%;right:-5px;top:190px;height:calc(100% - 265px)}.intro-bio{font-size:12px;max-width:340px}.intro-experience{font-size:14px;letter-spacing:0}.intro-actions{gap:18px}.intro-actions>a{font-size:11px;gap:16px}.intro-actions>a:first-child{padding-inline:17px}.intro-caption{right:25px;bottom:-15px}.intro-caption>span:first-child{font-size:7px}.intro-caption>span:last-child{font-size:10px}}
@media(max-width:800px){.hero-night .hero-headline{font-size:61px;line-height:1.24}}
@media(max-width:720px){
 .intro-layout{display:flex;flex-direction:column;min-height:0;padding-top:111px;padding-bottom:25px}
 .intro-wordmark{top:104px;left:23px;right:23px;height:auto;aspect-ratio:4.65;z-index:0}
 .intro-portrait{position:relative;order:0;width:calc(100% + 38px);max-width:570px;right:auto;bottom:auto;top:auto;height:auto;align-self:center;margin:25px -19px -22px;z-index:1}
 .intro-portrait>img{width:100%;height:auto;max-height:none;mask-image:linear-gradient(#000 0%,#000 48%,#000e 60%,#0009 73%,#0003 84%,transparent 96%);-webkit-mask-image:linear-gradient(#000 0%,#000 48%,#000e 60%,#0009 73%,#0003 84%,transparent 96%)}
 .intro-caption{display:none}
 .intro-copy{order:1;width:100%;max-width:none;padding:0 0 36px;z-index:2}
 .intro-greeting{font-size:18px;gap:7px}.intro-name{font-size:28px}.intro-name>span{font-size:18px}
 .intro-kicker{font-size:8px;letter-spacing:.2em;margin-top:6px}
 .intro-role{font-size:40px;line-height:1.35;margin-top:25px;gap:6px;letter-spacing:.02em}.intro-role>span{font-size:9px}
 .intro-experience{font-size:15px;margin:22px 0 21px;letter-spacing:.015em;gap:5px}.intro-experience strong{font-size:19px}
 .intro-bio{font-size:13px;line-height:2.1;max-width:490px}.intro-bio p+p{margin-top:7px}.intro-desktop-break{display:none}
 .intro-skills{font-size:9px;margin-top:21px}.intro-skills>span+span:before{margin-inline:12px}
 .intro-actions{margin-top:28px;gap:24px}.intro-actions>a{font-size:11px;min-height:46px}.intro-actions>a:first-child{padding:13px 20px;gap:25px}
 .intro-bottom{order:2;font-size:8px;letter-spacing:.02em;padding-top:22px;gap:15px}.intro-bottom>a{gap:13px;white-space:nowrap}
 .personal-intro:before{background:radial-gradient(ellipse at 90% 27%,#82455630,transparent 57%),linear-gradient(150deg,#0c1728,#141925 62%,#0b1524)}
}
@media(min-width:500px) and (max-width:720px){.intro-wordmark{left:26px;right:26px}.intro-copy{max-width:560px;margin-inline:auto}.intro-portrait{margin-bottom:-12px}}
@media(max-width:600px){.hero-night .hero-headline{font-size:clamp(53px,14.4vw,74px);line-height:1.22;margin-block:27px 25px}.hero-night .hero-headline em{padding-left:.47em}.hero-night .hero-headline em:before{width:18px}}
@media(max-width:360px){.intro-wordmark{left:19px;right:19px}.intro-name{font-size:25px}.intro-greeting{font-size:16px}.intro-role{font-size:36px}.intro-experience{font-size:13px}.intro-bio{font-size:12px}.intro-actions{gap:19px}.intro-actions>a{font-size:10px}.intro-bottom{font-size:7px}.hero-night .hero-headline{font-size:51px}}
@media(prefers-reduced-motion:reduce){.intro-actions>a{transition:none}}
