/* About is a personal editorial page with a compact career archive */
.about-page{--about-max:1060px;--edge:var(--bg)}
.about-width{width:calc(100% - 144px);max-width:var(--about-max);margin-inline:auto}
.about-page main{overflow:clip}.about-page main img{animation:none;translate:none}
.about-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center;min-height:530px;padding:45px 0 60px}
.about-kicker{color:var(--plum);margin-bottom:16px;font-weight:600}
.about-intro h1{font-size:clamp(44px,4.5vw,64px);line-height:1.04;letter-spacing:-.065em;max-width:620px;text-wrap:initial}.about-intro h1 span{color:var(--plum)}
.about-lede{max-width:435px;margin-top:24px}.about-intro .button{margin-top:28px}
.portrait-scene{position:relative;perspective:1000px;height:410px;width:100%;--rx:0deg;--ry:0deg;isolation:isolate}
.portrait-glow{position:absolute;inset:30px -20px;background:radial-gradient(ellipse,#d7bdd066,transparent 68%);filter:blur(24px);z-index:-1}
.portrait-shadow{position:absolute;bottom:3px;left:18%;width:65%;height:22px;background:#30203033;filter:blur(20px);border-radius:50%}
.portrait-paper{position:absolute;width:270px;left:50%;top:10px;margin-left:-135px;padding:12px 12px 34px;background:#fff9eb;box-shadow:0 24px 36px #25122424;rotate:6deg;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .75s ease,rotate .75s ease;animation:portraitFloat 9s ease-in-out infinite}
.portrait-paper:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:12px;background:#fff9eb;clip-path:polygon(0 0,100% 0,100% 70%,97% 45%,93% 83%,89% 50%,85% 85%,82% 45%,78% 100%,74% 60%,70% 83%,66% 40%,62% 88%,58% 60%,54% 90%,50% 42%,46% 75%,42% 55%,38% 92%,34% 55%,30% 78%,26% 40%,22% 92%,18% 65%,14% 95%,10% 55%,6% 85%,2% 50%,0 80%)}
.portrait-paper img{width:100%;height:300px;object-fit:cover;object-position:center 35%;clip-path:polygon(0 0,100% 0,100% 98%,98% 100%,0 100%)}
.portrait-paper figcaption{font-family:'Bradley Hand','Segoe Print','Comic Sans MS',cursive;font-size:16px;color:#685363;padding-top:14px;text-align:center}
.portrait-tape{position:absolute;z-index:2;left:calc(50% - 46px);top:-14px;width:92px;height:32px;rotate:-10deg;background:linear-gradient(110deg,#c7af8380,#e9d3a5af,#c7af8380);backdrop-filter:blur(2px);clip-path:polygon(2% 0,98% 0,100% 15%,97% 33%,100% 58%,98% 83%,100% 100%,1% 100%,3% 75%,0 55%,2% 30%,0 10%)}
.portrait-tag{position:absolute;bottom:16px;left:0;padding:15px 22px;border-radius:15px;background:linear-gradient(120deg,#fff9,#ffffff36);border:1px solid #fff8;backdrop-filter:blur(18px);box-shadow:inset 0 1px #fff9,0 12px 25px #3020300d;rotate:-5deg;color:var(--ink);line-height:1.5;transition:rotate .7s,translate .7s}
.portrait-scene:hover .portrait-paper{rotate:1deg}.portrait-scene:hover .portrait-tag{rotate:-2deg;translate:-5px 5px}
@keyframes portraitFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
:root[data-theme=dark] .portrait-tag{background:linear-gradient(120deg,#8d758c70,#44374980);border-color:#e5cce955;box-shadow:inset 0 1px #fff3,0 12px 25px #0002}
.about-experience{padding:38px 0 65px;scroll-margin-top:25px}.about-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:45px;margin-bottom:32px}.about-section-heading>p{max-width:340px}.about-section-heading h2{line-height:1.12}.about-section-heading .about-kicker{margin-bottom:12px}
.current-role{position:relative;background:var(--surface);border-radius:20px;padding:32px;box-shadow:inset 0 1px 0 #fff6,0 12px 36px #30233008}
.role-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:25px}.role-label,.period{color:var(--plum)}.role-header h3,.role-card header h3{font-size:var(--heading);font-weight:500;letter-spacing:-.045em;margin:6px 0}.current-pill{display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:30px;background:var(--bg);color:var(--muted)}.current-pill i{width:7px;height:7px;background:#87a488;border-radius:50%;box-shadow:0 0 0 4px #8baf8915}
.career-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:16px}.career-moment{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--bg);border-radius:10px;min-width:0}.career-moment h3{margin-top:3px}.career-moment>p:not(.period){max-width:390px}.career-moment>a,.moment-links,.moment-skill{margin-top:auto;padding-top:5px;align-self:flex-start}.moment-links{display:flex;gap:22px}.moment-skill{color:var(--muted)}
.earlier-roles{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.role-card{background:var(--surface);border-radius:18px;padding:30px;display:grid;grid-template-rows:auto repeat(3,1fr);gap:20px}.role-card header{padding-bottom:8px}.project-line{display:grid;grid-template-columns:1fr 1.25fr;gap:20px;align-items:start}.project-line>span{color:var(--muted)}.project-line a,.project-line strong{font-weight:600;color:var(--ink)}.project-line a{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--line)}.project-line a:hover{text-decoration-color:var(--plum)}.role-takeaway{background:var(--lilac);padding:15px 18px;border-radius:8px;align-self:start}
.thinking-cutout{padding:65px 0;background:var(--lilac);clip-path:polygon(0 12px,19% 12px,21% 0,79% 0,81% 12px,100% 12px,100% calc(100% - 12px),81% calc(100% - 12px),79% 100%,21% 100%,19% calc(100% - 12px),0 calc(100% - 12px))}
.thinking-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.thinking-grid article{background:var(--glass);padding:22px 26px 27px;border-radius:15px;box-shadow:inset 0 1px #fff5}.thinking-grid h3{margin-bottom:10px}.thinking-art{position:relative;height:100px;margin-bottom:20px;display:flex;justify-content:center;align-items:center;gap:8px}.thinking-art i{display:block;position:absolute;background:linear-gradient(135deg,#fff9,#dbc6dc85);box-shadow:inset 0 1px #fffc,0 8px 14px #49304a15;border:1px solid #fff8;transition:transform .6s}.art-observe i{width:53px;height:64px;border-radius:8px;rotate:-12deg;left:calc(50% - 54px)}.art-observe i:nth-child(2){rotate:10deg;left:calc(50% - 10px);background:linear-gradient(135deg,#fff9,#e8c3a2a0)}.art-observe i:nth-child(3){width:50px;height:50px;border-radius:50%;left:calc(50% - 17px);background:#ffffff55;backdrop-filter:blur(3px);box-shadow:inset 0 0 0 6px #fff7,0 8px 14px #49304a15}.art-observe span{position:absolute;width:9px;height:32px;border-radius:9px;background:#b198b0;rotate:-36deg;left:calc(50% + 30px);top:65px}.art-connect:before{content:"";width:130px;height:1px;background:#a88ca3}.art-connect i{width:38px;height:38px;border-radius:12px;left:calc(50% - 82px)}.art-connect i:nth-child(2){left:calc(50% - 19px);width:40px;height:52px;background:linear-gradient(135deg,#fff9,#e8c3a2)}.art-connect i:nth-child(3){left:calc(50% + 45px)}.art-refine i{width:88px;height:61px;border-radius:10px;rotate:-13deg;translate:-12px 1px}.art-refine i:nth-child(2){rotate:5deg;translate:5px 0;background:linear-gradient(135deg,#fff9,#e8c3a2c0)}.art-refine i:nth-child(3){width:40px;height:40px;border-radius:50%;rotate:0deg;translate:43px 18px;background:linear-gradient(135deg,#effbe8,#a9c1a1)}.art-refine span{position:absolute;width:15px;height:9px;border-left:2px solid #4d7043;border-bottom:2px solid #4d7043;rotate:-45deg;translate:43px 16px}.thinking-grid article:hover .thinking-art i{transform:translateY(-5px)}
.life-section{padding:65px 0 25px}.life-reel{--reel-width:310px;--reel-height:235px;--reel-gap:20px;margin-top:0;padding:15px 0 22px}.life-reel .toward-left{animation-duration:52s}.life-reel .reel-frame{border-radius:6px;background:var(--surface2)}.life-reel .reel-frame img{object-fit:cover}.life-reel .life-4 img{object-position:center 38%}.life-reel .life-5 img{object-position:center 65%}.about-outro{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:22px}.about-page .footer{margin-top:25px}
@media(max-width:1000px){.about-width{width:calc(100% - 80px)}.about-hero{gap:25px;grid-template-columns:1.2fr 1fr}.portrait-paper{width:240px;margin-left:-120px}.portrait-paper img{height:280px}.portrait-scene{height:390px}.portrait-tag{left:-10px;bottom:12px;padding:12px 18px}.current-role{padding:24px}.career-moment{padding:22px}.earlier-roles{gap:20px}.role-card{padding:24px}.project-line{grid-template-columns:1fr;gap:4px}.thinking-grid{gap:16px}.thinking-grid article{padding:20px}.about-intro h1{font-size:50px}}
@media(max-width:700px){.about-width{width:calc(100% - 48px)}.about-hero{grid-template-columns:1fr;gap:20px;padding:24px 0 26px;min-height:0}.about-intro h1{font-size:44px;max-width:430px}.about-lede{margin-top:20px;max-width:410px}.about-intro .button{margin-top:22px}.portrait-scene{width:310px;max-width:100%;height:360px;justify-self:center;margin-top:10px}.portrait-paper{width:226px;margin-left:-105px;top:15px}.portrait-paper img{height:247px}.portrait-paper figcaption{white-space:nowrap;font-size:16px}.portrait-tag{bottom:2px;left:0;padding:10px 17px}.about-experience{padding:28px 0 44px}.about-section-heading{display:block;margin-bottom:24px}.about-section-heading>p{margin-top:16px}.role-header{display:block}.current-pill{position:absolute;right:20px;top:20px;padding:4px 10px}.role-header .role-label{padding-right:78px}.role-header h3,.role-card header h3{font-size:var(--heading)}.current-role{padding:23px 18px 18px;border-radius:16px}.career-grid{grid-template-columns:1fr;gap:12px}.career-moment{padding:20px;gap:9px}.earlier-roles{grid-template-columns:1fr;gap:18px;margin-top:18px}.role-card{padding:25px;gap:22px;grid-template-rows:auto}.project-line{grid-template-columns:1fr 1.2fr;gap:15px}.thinking-cutout{padding:44px 0}.thinking-grid{grid-template-columns:1fr;gap:14px}.thinking-grid article{position:relative;display:grid;grid-template-columns:80px 1fr;gap:0 20px;padding:22px 20px}.thinking-art{grid-row:1/3;height:100%;margin:0;scale:.72}.thinking-grid h3{margin:0 0 6px}.thinking-grid article>p{grid-column:2}.thinking-art.art-observe span{top:calc(50% + 15px)}.life-section{padding-top:44px}.life-reel{--reel-width:250px;--reel-height:200px;--reel-gap:14px;padding:12px 0 18px}.about-outro{display:block;padding-top:15px}.about-outro .button{margin-top:20px}}
@media(max-width:360px){.about-intro h1{font-size:40px}.project-line{grid-template-columns:1fr;gap:4px}.thinking-grid article{grid-template-columns:65px 1fr;gap:0 14px}.thinking-art{scale:.6}.portrait-paper figcaption{font-size:15px}}
@media(prefers-reduced-motion:reduce){.portrait-paper{animation:none;transform:none}.portrait-scene:hover .portrait-paper{rotate:6deg}.portrait-scene:hover .portrait-tag{translate:none;rotate:-5deg}.life-reel .reel-group{grid-template-columns:repeat(3,1fr)}.life-reel .reel-frame{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce) and (max-width:700px){.life-reel .reel-group{grid-template-columns:1fr 1fr}}
