:root{--bg:#701d1c;--accent:#ffc872;--cream:#f9fcf4;--muted:#d9a99a;--ink:#371314;--line:rgba(249,252,244,.24);--shadow:0 24px 70px rgba(40,5,5,.32)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--cream);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.site-nav{position:fixed;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px 4vw;color:var(--cream);mix-blend-mode:normal}.wordmark{font-size:clamp(1.15rem,2vw,1.65rem);font-weight:800;letter-spacing:-.06em}.desktop-nav{display:flex;gap:2rem;font-size:.9rem}.desktop-nav a{opacity:.75;transition:.25s}.desktop-nav a:hover{color:var(--accent);opacity:1}.nav-cta,.button{display:inline-flex;align-items:center;gap:18px;border-radius:999px;padding:14px 22px;font-size:.9rem;font-weight:700}.nav-cta{background:var(--cream);color:var(--ink)}.nav-cta span,.button span,.text-link span,.email span{font-size:1.15em}.menu-toggle{display:none;background:var(--cream);border:0;border-radius:50%;width:46px;height:46px}.menu-toggle span{display:block;width:16px;height:2px;margin:4px auto;background:var(--ink)}.section-pad{padding-left:8vw;padding-right:8vw}.hero{min-height:100svh;position:relative;display:flex;align-items:center;overflow:hidden;padding-top:110px}.hero-backdrop{position:absolute;z-index:0;left:4vw;top:14vh;font-size:clamp(7rem,20vw,22rem);line-height:.75;font-weight:900;letter-spacing:-.09em;color:rgba(255,200,114,.14);white-space:nowrap}.hero-copy{position:relative;z-index:3;width:min(600px,58vw)}.eyebrow,.section-kicker{margin:0 0 22px;color:var(--accent);font-size:.74rem;letter-spacing:.15em;text-transform:uppercase}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:8px}.hero h1{font-size:clamp(3.5rem,7vw,7.8rem);line-height:.9;letter-spacing:-.075em;margin:0;max-width:700px}.hero h1 em{color:var(--accent);font-style:normal}.hero-intro{max-width:380px;margin:30px 0;font-size:1rem;line-height:1.55;color:var(--muted)}.hero-actions{display:flex;align-items:center;gap:24px}.button-light{background:var(--cream);color:var(--ink)}.button-light:hover{background:var(--accent)}.button-outline{border:1px solid var(--line);padding:13px 20px}.text-link{font-weight:700;border-bottom:1px solid var(--accent);padding-bottom:5px}.hero-portrait{position:absolute;z-index:2;right:11vw;bottom:-5vh;width:min(38vw,520px);aspect-ratio:1/1.2;overflow:hidden;border:12px solid var(--cream);box-shadow:var(--shadow);transform:rotate(4deg);background:#fff}.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 24%;mix-blend-mode:multiply}.collage{position:absolute;z-index:3;width:clamp(150px,18vw,270px);filter:drop-shadow(0 20px 20px rgba(30,0,0,.26));object-fit:contain}.badge{right:34vw;top:20vh;transform:rotate(-13deg)}.keyboard{right:5vw;bottom:7vh;transform:rotate(9deg);width:clamp(190px,25vw,360px)}.scribble{position:absolute;z-index:4;right:5vw;top:15vh;color:var(--accent);font-family:cursive;font-size:1.1rem;transform:rotate(8deg)}.scroll-cue{position:absolute;bottom:28px;left:8vw;font-size:.75rem;letter-spacing:.1em;color:var(--muted);display:flex;align-items:center;gap:10px}.scroll-cue span{width:32px;height:1px;background:var(--accent)}.manifesto{min-height:95vh;padding-top:17vh;padding-bottom:18vh;display:flex;flex-direction:column;justify-content:center}.manifesto h2,.section-heading h2,.about h2,.notes h2,.books h2,.footer h2{font-size:clamp(3.2rem,7.6vw,8.7rem);line-height:.9;letter-spacing:-.08em;margin:0}.manifesto h2 span,.section-heading h2 span,.about h2 span,.notes h2 span,.books h2 span,.footer h2 span{color:var(--accent)}.manifesto-sub{font-size:1.1rem;color:var(--muted);margin-top:35px}.work{padding-top:10vh;padding-bottom:17vh}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:70px}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.work-card{min-height:460px;padding:26px;position:relative;overflow:hidden;box-shadow:var(--shadow);transition:transform .35s}.work-card:hover{transform:translateY(-10px) rotate(-1deg)}.card-yellow{background:var(--accent);color:var(--ink)}.card-cream{background:var(--cream);color:var(--ink)}.card-red{background:#8d2a25}.card-top{display:flex;justify-content:space-between;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;opacity:.7}.play-mark{font-size:4rem;margin-top:75px}.work-card h3{font-size:2.6rem;line-height:.92;letter-spacing:-.06em;margin:30px 0 12px}.work-card p{font-size:.8rem;opacity:.7}.placeholder-photo{height:180px;margin-top:60px;display:grid;place-items:center;border:1px dashed currentColor;color:var(--muted);font-size:.8rem}.orbit{font-size:9rem;margin:70px 0 0 20px;color:var(--accent);transform:rotate(22deg)}.about{min-height:100vh;background:var(--cream);color:var(--ink);display:flex;align-items:center;gap:11vw;padding-top:15vh;padding-bottom:15vh}.about .section-kicker{color:#a74738}.about-stamp{width:260px;height:260px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:900;font-size:2.7rem;line-height:.82;letter-spacing:-.08em;transform:rotate(-14deg);flex:none}.about-stamp span{color:#a74738;font-size:3rem}.about-content{max-width:580px}.about-content h2{margin-bottom:35px}.about-content p{max-width:460px;line-height:1.65;color:#73403d}.about-content .text-link{display:inline-block;margin-top:20px;color:var(--ink);border-color:#a74738}.notes{padding-top:16vh;padding-bottom:15vh}.live-pill{border:1px solid var(--line);padding:10px 15px;border-radius:999px;font-size:.7rem;color:var(--muted)}.live-pill i{display:inline-block;width:7px;height:7px;background:#83d59a;border-radius:50%;margin-right:7px}.timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:150px 1fr 30px;align-items:center;gap:30px;padding:33px 0;border-bottom:1px solid var(--line)}.timeline-item time{color:var(--accent);font-size:.7rem;letter-spacing:.1em}.timeline-item h3{font-size:1.5rem;margin:0 0 7px;letter-spacing:-.04em}.timeline-item p{margin:0;color:var(--muted);font-size:.9rem}.timeline-item>span{font-size:1.5rem}.quote{min-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#611816}.quote-mark{font-size:8rem;color:var(--accent);height:65px;line-height:1}.quote blockquote{font-size:clamp(2.3rem,5vw,5.3rem);line-height:.98;letter-spacing:-.07em;margin:0}.quote p{color:var(--muted);font-size:.8rem;margin-top:30px}.books{min-height:95vh;display:flex;align-items:center;justify-content:space-between;gap:60px}.book-copy{max-width:540px}.book-copy>p:not(.section-kicker){color:var(--muted);line-height:1.6;max-width:360px;margin:30px 0}.book-stack{position:relative;width:380px;height:430px;margin-right:8vw}.book{position:absolute;width:260px;height:350px;padding:28px;font-weight:900;font-size:2.5rem;line-height:.85;letter-spacing:-.08em;box-shadow:var(--shadow)}.book small{display:block;font-size:.6rem;letter-spacing:.08em;margin-top:25px}.book-back{background:#ae3e32;right:0;top:0;transform:rotate(12deg)}.book-front{background:var(--accent);color:var(--ink);left:0;bottom:0;transform:rotate(-8deg)}.footer{background:var(--cream);color:var(--ink);padding-top:14vh;padding-bottom:30px}.footer .section-kicker{color:#a74738}.footer h2{font-size:clamp(3.8rem,9vw,10rem)}.email{display:inline-block;font-size:1.15rem;margin-top:40px;border-bottom:2px solid #a74738;padding-bottom:8px}.footer-bottom{border-top:1px solid rgba(55,19,20,.2);margin-top:18vh;padding-top:18px;display:flex;justify-content:space-between;font-size:.75rem;color:#8a5d59}.footer-bottom div{display:flex;gap:22px}.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:translateY(0)}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.28s}
@media(max-width:760px){.site-nav{padding:16px 20px}.desktop-nav{display:none}.desktop-nav.mobile-open{display:flex;position:absolute;top:76px;left:20px;right:20px;padding:18px 20px;flex-direction:column;gap:16px;background:var(--cream);color:var(--ink);border-radius:20px;box-shadow:var(--shadow)}.nav-cta{padding:11px 15px;font-size:.78rem;margin-left:auto;margin-right:10px}.menu-toggle{display:block}.section-pad{padding-left:22px;padding-right:22px}.hero{min-height:860px;padding-top:120px;align-items:flex-start}.hero-backdrop{font-size:5.5rem;top:150px;left:12px;line-height:.8}.hero-copy{width:100%;text-align:left}.hero h1{font-size:3.5rem;max-width:330px}.hero-intro{font-size:.9rem;max-width:280px;margin:25px 0}.hero-actions{gap:16px}.hero-portrait{right:34px;bottom:110px;width:280px;height:350px;border-width:8px;transform:rotate(3deg)}.collage{width:135px}.badge{right:14px;top:270px;transform:rotate(12deg)}.keyboard{right:-10px;bottom:26px;width:220px;transform:rotate(7deg)}.scribble{top:auto;right:23px;bottom:280px;font-size:.9rem}.scroll-cue{display:none}.manifesto{min-height:640px;padding-top:130px;padding-bottom:130px}.manifesto h2,.section-heading h2,.about h2,.notes h2,.books h2,.footer h2{font-size:3.5rem}.section-heading{align-items:start;flex-direction:column;gap:25px;margin-bottom:40px}.work{padding-top:90px;padding-bottom:120px}.work-grid{grid-template-columns:1fr;gap:16px}.work-card{min-height:370px}.work-card h3{font-size:2.3rem}.about{min-height:800px;display:block;padding-top:100px;padding-bottom:100px}.about-stamp{width:160px;height:160px;font-size:1.8rem;margin:0 0 70px auto}.about-content h2{margin-bottom:28px}.timeline-item{grid-template-columns:80px 1fr 18px;gap:13px;padding:25px 0}.timeline-item h3{font-size:1.15rem}.timeline-item p{font-size:.78rem;line-height:1.4}.quote{min-height:650px;padding-left:28px;padding-right:28px}.quote blockquote{font-size:2.55rem}.books{min-height:780px;display:block;padding-top:110px;padding-bottom:110px}.book-stack{width:290px;height:300px;margin:80px auto 0}.book{width:190px;height:260px;font-size:1.8rem;padding:20px}.footer{padding-top:100px}.footer-bottom{margin-top:120px;display:block;line-height:2}.footer-bottom div{gap:14px;flex-wrap:wrap}.email{font-size:.95rem}}

/* Hero composition tuned to the reference: oversized name, face rising from the bottom, edge stickers. */
.hero{min-height:100svh;padding-top:0;align-items:stretch}.hero-backdrop{top:7vh;left:2.3vw;font-size:clamp(7.5rem,19vw,20rem);line-height:.8;color:var(--accent);opacity:1;z-index:0}.hero-portrait{z-index:2;right:50%;bottom:-25vh;transform:translateX(50%);width:min(54vw,780px);height:auto;aspect-ratio:1/1.16;border:0;box-shadow:none;background:transparent;overflow:visible}.hero-portrait img{width:100%;height:100%;object-fit:contain;object-position:center bottom;mix-blend-mode:normal}.collage{z-index:3}.badge{right:43%;top:18%;width:clamp(160px,20vw,290px);transform:rotate(-12deg)}.keyboard{right:22%;bottom:18%;width:clamp(210px,28vw,420px);transform:rotate(8deg)}.hero-latest{position:absolute;z-index:4;left:0;bottom:6vh;width:245px;padding:16px 22px 18px 28px;background:var(--accent);color:var(--ink);transform:rotate(-8deg);clip-path:polygon(3% 8%,94% 0,100% 85%,8% 100%);display:flex;flex-direction:column;gap:5px}.latest-pill{align-self:flex-start;background:var(--cream);border-radius:999px;padding:9px 18px;font-weight:800;font-size:.78rem;transform:rotate(3deg);margin-bottom:8px}.hero-latest strong{font-size:1.15rem}.hero-latest small{font-size:.74rem;opacity:.75}.latest-arrow{position:absolute;right:22px;bottom:16px;font-size:1.4rem}.hero-socials{position:absolute;right:3vw;bottom:6vh;z-index:4;display:flex;gap:12px}.hero-socials a{width:52px;height:52px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:1.1rem;color:var(--cream);transition:.25s}.hero-socials a:hover{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.wordmark{display:none}.desktop-nav{display:none}.site-nav{justify-content:flex-end;gap:12px}.menu-toggle{display:grid;place-content:center}
.hero-portrait{bottom:-36vh;width:min(64vw,900px);aspect-ratio:1/1.08}.hero-portrait img{transform:scale(1.32) translateY(9%)}
.hero-backdrop{text-align:center;left:50%;transform:translateX(-50%);width:100%;letter-spacing:-.1em}
@media(max-width:760px){.hero{min-height:820px;padding-top:0}.hero-backdrop{top:12vh;left:50%;font-size:clamp(5rem,22vw,7.5rem);line-height:.82;white-space:nowrap}.hero-portrait{right:50%;bottom:-12vh;width:105vw;height:auto;aspect-ratio:1/1.12}.hero-portrait img{transform:scale(1.2) translateY(7%)}.badge{right:47%;top:25%;width:30vw;min-width:112px}.keyboard{right:3%;bottom:13%;width:53vw;min-width:190px}.hero-latest{left:-8px;bottom:9vh;width:180px;padding:11px 16px 13px 20px}.latest-pill{font-size:.68rem;padding:7px 13px;margin-bottom:4px}.hero-latest strong{font-size:.92rem}.hero-latest small{font-size:.62rem}.latest-arrow{right:15px;bottom:12px}.hero-socials{right:18px;bottom:3vh;gap:7px}.hero-socials a{width:37px;height:37px;font-size:.8rem}.hero .scroll-cue{display:none}}

/* Peel reveal: mirrors the reference site's data-scroll-peel card approach with a clipped duplicate layer and curled edge. */
.portrait-base{position:relative;z-index:1}.head-peel{position:absolute;inset:0;z-index:5;clip-path:polygon(0 0,100% 0,100% 49%,91% 56%,76% 53%,62% 59%,46% 55%,29% 60%,13% 55%,0 59%);transform-origin:72% 55%;pointer-events:none}.head-peel>img{position:absolute;inset:0}.peel-curl{position:absolute;right:8%;top:49%;width:24%;height:12%;background:linear-gradient(145deg,#f9fcf4 0 42%,#dccfc1 45% 60%,#a88b7b 61% 100%);clip-path:polygon(0 0,100% 0,74% 100%,16% 72%);filter:drop-shadow(0 12px 10px rgba(40,5,5,.25));transform:rotate(-7deg);opacity:.96}.head-peel.is-peeling{animation:peelAway 1.65s cubic-bezier(.2,.75,.25,1) forwards}.head-peel.is-peeling .peel-curl{animation:curlAway 1.65s cubic-bezier(.2,.75,.25,1) forwards}@keyframes peelAway{0%{clip-path:polygon(0 0,100% 0,100% 49%,91% 56%,76% 53%,62% 59%,46% 55%,29% 60%,13% 55%,0 59%);transform:rotate(0) translate(0,0)}55%{clip-path:polygon(0 0,100% 0,100% 25%,86% 37%,68% 29%,50% 40%,31% 31%,14% 39%,0 28%);transform:rotate(-8deg) translate(-3%,-12%)}100%{clip-path:polygon(0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0);transform:rotate(-18deg) translate(-12%,-45%)}}@keyframes curlAway{0%{transform:rotate(-7deg) translate(0,0);opacity:.96}55%{transform:rotate(-15deg) translate(-20%,-35%)}100%{transform:rotate(-25deg) translate(-120%,-130%);opacity:0}}
@media(prefers-reduced-motion:reduce){.head-peel.is-peeling,.head-peel.is-peeling .peel-curl{animation:none}.head-peel{clip-path:polygon(0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0)}}

/* Closed portrait -> finished torn-open composite, centered like the reference hero. */
.hero-portrait{right:50%;bottom:-36vh;transform:translateX(50%);width:min(64vw,900px);aspect-ratio:1/1.08;overflow:visible;background:transparent}.portrait-closed,.portrait-open{position:absolute!important;inset:0;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center bottom!important;transform:scale(1.32) translateY(9%)!important;mix-blend-mode:normal!important}.portrait-closed{z-index:1;opacity:1}.portrait-open{z-index:2;opacity:0;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}.hero-portrait .peel-curl{position:absolute;z-index:4;right:10%;top:42%;width:24%;height:13%;background:linear-gradient(145deg,#f9fcf4 0 42%,#dccfc1 45% 60%,#a88b7b 61% 100%);clip-path:polygon(0 0,100% 0,74% 100%,16% 72%);filter:drop-shadow(0 12px 10px rgba(40,5,5,.25));transform:rotate(-7deg);opacity:.96}.hero-portrait.is-peeling .portrait-closed{animation:closedPeel 1.65s cubic-bezier(.2,.75,.25,1) forwards}.hero-portrait.is-peeling .portrait-open{animation:openPeel 1.65s cubic-bezier(.2,.75,.25,1) forwards}.hero-portrait.is-peeling .peel-curl{animation:curlPeel 1.65s cubic-bezier(.2,.75,.25,1) forwards}@keyframes closedPeel{0%,35%{clip-path:inset(0 0 0 0);opacity:1}100%{clip-path:polygon(0 0,100% 0,100% 24%,82% 38%,63% 29%,46% 41%,27% 32%,12% 39%,0 28%);opacity:0}}@keyframes openPeel{0%{opacity:0;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}45%{opacity:1;clip-path:polygon(0 67%,100% 67%,100% 67%,0 67%)}100%{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes curlPeel{0%{transform:rotate(-7deg) translate(0,0);opacity:.96}55%{transform:rotate(-15deg) translate(-22%,-35%)}100%{transform:rotate(-25deg) translate(-150%,-145%);opacity:0}}
@media(max-width:760px){.hero-portrait{right:50%;bottom:-12vh;width:105vw;aspect-ratio:1/1.12}.portrait-closed,.portrait-open{transform:scale(1.2) translateY(7%)!important}.hero-portrait .peel-curl{right:8%;top:40%;width:28%;height:12%}}
@media(prefers-reduced-motion:reduce){.hero-portrait .portrait-closed{display:none}.hero-portrait .portrait-open{opacity:1;clip-path:none}.hero-portrait .peel-curl{display:none}}

/* Run on first paint as well as via JS, so file:// previews always show the peel. */
.hero-portrait.reveal,.hero-portrait.reveal.visible{transform:translateX(50%)!important}
.portrait-closed{animation:closedPeel 1.65s cubic-bezier(.2,.75,.25,1) .42s both}
.portrait-open{animation:openPeel 1.65s cubic-bezier(.2,.75,.25,1) .42s both}
.hero-portrait .peel-curl{animation:curlPeel 1.65s cubic-bezier(.2,.75,.25,1) .42s both}
@media(prefers-reduced-motion:reduce){.portrait-closed,.portrait-open,.hero-portrait .peel-curl{animation:none}}

/* Main hero: a closed collage portrait peels open to reveal two clickable thoughts. */
.hero-art{position:absolute;z-index:3;left:50%;bottom:-34vh;width:min(66vw,920px);aspect-ratio:1/1.08;transform:translateX(-50%);pointer-events:none}.person-closed{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;z-index:2}.brain-zone{position:absolute;z-index:4;left:3%;top:3%;width:94%;height:43%;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);opacity:0;pointer-events:none;animation:brainReveal 1.55s cubic-bezier(.2,.75,.25,1) .55s forwards}.brain-zone:before{content:"";position:absolute;left:10%;right:10%;top:48%;height:42%;background:#651817;border-radius:50% 50% 35% 35%;filter:blur(3px);opacity:.95}.brain-object{position:absolute;display:block;pointer-events:auto;filter:drop-shadow(0 16px 13px rgba(40,5,5,.3));transition:transform .28s ease,filter .28s ease;outline:none}.brain-object img{display:block;width:100%;height:auto}.brain-object span{position:absolute;left:50%;bottom:-28px;transform:translateX(-50%) translateY(8px);background:var(--cream);color:var(--ink);border-radius:999px;padding:7px 12px;font-size:.7rem;font-weight:800;white-space:nowrap;opacity:0;transition:.22s}.brain-object:hover,.brain-object:focus-visible{filter:drop-shadow(0 22px 17px rgba(40,5,5,.42));transform:translateY(-10px) rotate(0deg) scale(1.06)}.brain-object:hover span,.brain-object:focus-visible span{opacity:1;transform:translateX(-50%) translateY(0)}.brain-badge{left:8%;top:0;width:34%;transform:rotate(-12deg)}.brain-keyboard{right:5%;top:1%;width:59%;transform:rotate(8deg)}.brain-core{position:absolute;z-index:3;left:42%;top:28%;width:22%;height:48%;background:#f28e9e;border-radius:52% 45% 48% 45%;box-shadow:inset 8px 0 0 rgba(255,200,114,.2),0 14px 24px rgba(40,5,5,.3);transform:rotate(-9deg)}.paper-flap{position:absolute;z-index:6;left:3%;top:26%;width:94%;height:23%;background:var(--cream);clip-path:polygon(0 8%,8% 18%,17% 12%,28% 23%,39% 13%,51% 25%,63% 12%,74% 21%,87% 10%,100% 18%,96% 66%,84% 58%,72% 70%,60% 57%,47% 69%,34% 58%,21% 71%,8% 58%,0 66%);filter:drop-shadow(0 12px 7px rgba(40,5,5,.25));transform-origin:74% 18%;animation:flapPeel 1.55s cubic-bezier(.2,.75,.25,1) .55s forwards;pointer-events:none}.flap-curl{position:absolute;right:7%;top:20%;width:19%;height:65%;background:linear-gradient(145deg,#f9fcf4 0 38%,#dbcabd 42% 58%,#a78677 60%);clip-path:polygon(0 0,100% 8%,76% 100%,14% 82%);transform:rotate(-9deg);filter:drop-shadow(0 10px 8px rgba(40,5,5,.22));animation:curlPeel2 1.55s cubic-bezier(.2,.75,.25,1) .55s forwards}@keyframes brainReveal{0%{opacity:0;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}45%{opacity:1;clip-path:polygon(0 56%,100% 56%,100% 100%,0 100%)}100%{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes flapPeel{0%,30%{transform:rotate(0) translate(0,0);opacity:1}100%{transform:rotate(-16deg) translate(-12%,-88%);opacity:0}}@keyframes curlPeel2{0%{transform:rotate(-9deg) translate(0,0);opacity:1}100%{transform:rotate(-22deg) translate(-150%,-120%);opacity:0}}
@media(max-width:760px){.hero-art{left:50%;bottom:-12vh;width:108vw;aspect-ratio:1/1.08}.brain-zone{top:5%;height:43%}.paper-flap{top:26%;height:22%}.brain-badge{left:6%;width:35%}.brain-keyboard{right:2%;width:61%}.brain-core{left:40%;top:30%;width:23%;height:45%}.brain-object span{font-size:.6rem;padding:6px 9px;bottom:-24px}}
@media(prefers-reduced-motion:reduce){.brain-zone,.paper-flap,.flap-curl{animation:none}.brain-zone{opacity:1;clip-path:none}.paper-flap{display:none}}

/* The objects sit behind the torn portrait, so only the portion inside the opening is visible. */
.hero-art{z-index:3}.person-closed{z-index:5!important;content:url('assets/profile-torn-thin.png')}.brain-zone{z-index:2!important;top:-2%;height:39%;opacity:0;clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);animation:brainReveal 1.45s cubic-bezier(.2,.75,.25,1) .55s forwards}.brain-zone:before{z-index:-1;left:11%;right:11%;top:49%;height:44%;background:#5f1516}.brain-object{z-index:2}.brain-badge{left:7%;top:-10%;width:37%;transform:rotate(-12deg)}.brain-keyboard{right:3%;top:-14%;width:62%;transform:rotate(8deg)}
@media(max-width:760px){.brain-zone{top:0;height:39%}.brain-badge{left:3%;top:-7%;width:37%}.brain-keyboard{right:-2%;top:-8%;width:64%}}

/* Final depth pass: dark cast shadow behind the cutout + tighter, upright thoughts. */
.hero-art{isolation:isolate;bottom:calc(-34vh - 150px)}
.hero-backdrop{font-size:clamp(5.5rem,13vw,13rem)}
.hero-subtitle{position:absolute;z-index:1;top:28vh;left:50%;width:min(92vw,920px);transform:translateX(-50%);margin:0;text-align:center;color:var(--cream);font-size:clamp(.78rem,1.25vw,1rem);font-weight:600;letter-spacing:.02em;line-height:1.5}
.person-closed{z-index:5!important;filter:none!important}
.brain-zone{isolation:isolate;z-index:2!important;left:6%;width:88%;top:-1%;height:40%}
.brain-zone:before{z-index:0;left:9%;right:9%;top:39%;height:58%;background:#2a0a0b;border-radius:52% 48% 38% 38%;filter:blur(4px);opacity:.98;box-shadow:inset 0 -24px 24px rgba(0,0,0,.38),0 16px 25px rgba(0,0,0,.3)}
.brain-object{z-index:2;filter:drop-shadow(0 16px 13px rgba(0,0,0,.42))}
.brain-badge{left:calc(15% + 85px);top:calc(2% + 50px);width:30%;transform:rotate(-8deg);transform-origin:52% 88%}
.brain-keyboard{right:calc(22% + 100px);top:calc(-20% + 235px);width:45%;transform:rotate(82deg);transform-origin:52% 78%}
.brain-badge:hover,.brain-badge:focus-visible{transform:translateY(-10px) rotate(-8deg) scale(1.06)}
.brain-keyboard:hover,.brain-keyboard:focus-visible{transform:translateY(-10px) rotate(82deg) scale(1.06)}
.brain-zone:before{display:none!important}
.brain-console{right:calc(2% + 115px);top:calc(-20% + 255px);width:34%;z-index:1!important;transform:scaleX(-1) rotate(-8deg);transform-origin:52% 80%}
.brain-console:hover,.brain-console:focus-visible{transform:translateY(-10px) scaleX(-1) rotate(-8deg) scale(1.06)}
@media(max-width:760px){
  .brain-zone{left:4%;width:92%;top:0;height:40%}
  .brain-zone:before{left:7%;right:7%;top:39%;height:58%}
  .brain-badge{left:calc(10% + 85px);top:calc(2% + 50px);width:31%}
  .hero-art{bottom:calc(-12vh - 150px)}
  .hero-backdrop{font-size:clamp(4.5rem,18vw,6rem)}
  .hero-subtitle{top:27vh;width:88vw;font-size:.72rem;line-height:1.55}
  .brain-keyboard{right:calc(14% + 100px);top:calc(-15% + 235px);width:46%}
  .brain-console{right:41px;top:calc(-15% + 255px);width:34%}
}

/* Editorial American poster typography. */
body{font-family:"Avenir Next","Trebuchet MS","PingFang SC","Hiragino Sans GB",sans-serif}
.hero-backdrop,.manifesto h2,.section-heading h2,.about h2,.notes h2,.books h2,.footer h2,.work-card h3,.book,.wordmark,.nav-cta,.button{font-family:"Arial Black","Avenir Next Condensed","Impact","PingFang SC","Hiragino Sans GB",sans-serif;font-weight:900}
.hero-backdrop{font-size:clamp(4.3rem,10vw,10.5rem);letter-spacing:-.12em}
.hero-subtitle{font-family:"Avenir Next","Trebuchet MS","PingFang SC","Hiragino Sans GB",sans-serif;font-weight:700;letter-spacing:.015em}
@media(max-width:760px){.hero-backdrop{font-size:clamp(3.25rem,15vw,5rem)}}
.product-card-image{display:block;width:100%;height:210px;margin:24px 0 22px;object-fit:cover;border:2px solid rgba(55,19,20,.2);box-shadow:0 12px 22px rgba(40,5,5,.18)}
.card-cream .product-card-image{border-color:rgba(55,19,20,.16)}
@media(max-width:760px){.product-card-image{height:165px;margin:20px 0 18px}}

/* AccordionGallery (React Bits JS-CSS behavior, ported for this static page). */
.accordion-gallery{--ag-gap:14px;--ag-radius:18px;display:flex;gap:var(--ag-gap);width:100%;height:500px;perspective:1400px;perspective-origin:50% 50%;}
.ag-panel{position:relative;display:block;flex:1 1 0;min-width:0;overflow:hidden;border-radius:var(--ag-radius);background:#2a0a0b;text-decoration:none;outline:none;transform-style:preserve-3d;transform-origin:center;transition:flex-grow .62s cubic-bezier(.2,.75,.25,1),transform .62s cubic-bezier(.2,.75,.25,1);box-shadow:0 18px 34px -20px rgba(0,0,0,.65);will-change:flex-grow,transform;}
.ag-panel:focus-visible{box-shadow:0 0 0 3px var(--accent),0 18px 34px -20px rgba(0,0,0,.65)}
.ag-panel__frame{position:absolute;inset:0;overflow:hidden;border-radius:inherit}
.ag-panel__media{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;filter:grayscale(1) brightness(.72);transform:scale(1.08);transition:filter .62s cubic-bezier(.2,.75,.25,1),transform .62s cubic-bezier(.2,.75,.25,1)}
.ag-panel__overlay{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(55,19,20,.02) 38%,rgba(25,5,6,.86) 100%);opacity:.72;transition:opacity .62s ease}
.ag-panel__label{position:absolute;left:22px;right:22px;bottom:22px;z-index:2;display:flex;align-items:center;gap:12px;pointer-events:none;opacity:0;transform:translateX(-12px);transition:opacity .42s ease,transform .42s ease}
.ag-panel__bar{width:4px;height:30px;flex:none;border-radius:4px;background:var(--accent);box-shadow:0 0 14px rgba(255,200,114,.55)}
.ag-panel__text{color:var(--cream);font-size:clamp(1rem,1.7vw,1.5rem);font-weight:900;white-space:nowrap;text-shadow:0 2px 14px rgba(0,0,0,.55)}
.ag-panel.is-active{transform:rotateY(0deg)}
.ag-panel.is-active .ag-panel__media{filter:grayscale(0) brightness(1);transform:scale(1)}
.ag-panel.is-active .ag-panel__overlay{opacity:.5}
.ag-panel.is-active .ag-panel__label{opacity:1;transform:translateX(0)}
.accordion-gallery.is-vertical{height:620px;flex-direction:column;perspective:none}
.accordion-gallery.is-vertical .ag-panel{min-height:84px;transform:none!important}
.accordion-gallery.is-vertical .ag-panel__media{transform:scale(1.04)}
@media(max-width:760px){.accordion-gallery{height:430px;gap:10px}.ag-panel__label{left:16px;right:16px;bottom:16px}.ag-panel__text{font-size:1rem}}
@media(max-width:520px){.accordion-gallery{height:620px;flex-direction:column;perspective:none}.ag-panel{min-height:84px;transform:none!important}.ag-panel__media{transform:scale(1.04)}.ag-panel__label{bottom:16px}}
@media(prefers-reduced-motion:reduce){.ag-panel,.ag-panel__media,.ag-panel__overlay,.ag-panel__label{transition:none}}

/* SplitText-style character reveal for the hero subtitle. */
.hero-subtitle[data-split-text]{overflow:hidden;display:inline-block;vertical-align:top}
.hero-subtitle[data-split-text].split-ready .split-char{display:inline-block;opacity:0;transform:translateY(40px);will-change:transform,opacity}
.hero-subtitle[data-split-text].split-ready.split-visible .split-char{animation:splitCharIn .72s cubic-bezier(.2,.75,.25,1) forwards;animation-delay:calc(var(--split-index) * 50ms)}
@keyframes splitCharIn{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.hero-subtitle[data-split-text].split-ready .split-char{opacity:1;transform:none;animation:none}}

/* Internship experience timeline. */
.experience{padding-top:14vh;padding-bottom:18vh}
.experience-timeline{border-top:1px solid var(--line)}
.experience-item{display:grid;grid-template-columns:150px 1fr 34px;align-items:start;gap:32px;padding:34px 0;border-bottom:1px solid var(--line)}
.experience-year{color:var(--accent);font-family:"Arial Black","Avenir Next Condensed","Impact","PingFang SC",sans-serif;font-size:clamp(2.2rem,4vw,4rem);line-height:.9;letter-spacing:-.08em}
.experience-copy{max-width:680px}
.experience-role{margin:0 0 12px;color:var(--accent);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.experience-copy h3{margin:0 0 10px;font-size:clamp(1.5rem,2.8vw,2.5rem);line-height:1;letter-spacing:-.05em}
.experience-meta{margin:0 0 14px;color:var(--muted)!important;font-size:.78rem!important;letter-spacing:.04em}
.experience-copy>p:last-child{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}
.experience-item>span{font-size:1.5rem;color:var(--accent)}
@media(max-width:760px){.experience{padding-top:90px;padding-bottom:110px}.experience-item{grid-template-columns:76px 1fr 18px;gap:14px;padding:26px 0}.experience-year{font-size:2rem}.experience-role{font-size:.62rem;letter-spacing:.08em}.experience-copy h3{font-size:1.35rem}.experience-copy>p:last-child{font-size:.78rem}.experience-item>span{font-size:1.15rem}}

/* Final object offsets from the latest visual pass. */
.brain-badge{left:calc(15% + 65px)}
.brain-keyboard{right:calc(22% + 120px)}
.brain-console{right:calc(2% + 160px)}
@media(max-width:760px){
  .brain-badge{left:calc(10% + 65px)}
  .brain-keyboard{right:calc(14% + 120px)}
  .brain-console{right:86px}
}

/* Contact card: a lightweight CSS lanyard treatment for the static file:// build. */
.footer{position:relative;overflow:hidden;min-height:620px}
.footer-title{position:relative;z-index:2;max-width:62%}
.contact-lanyard{position:absolute;z-index:3;top:9vh;right:8vw;width:220px;height:390px;display:block;perspective:900px;transform:rotate(6deg);transform-origin:top center;animation:lanyardSwing 5.8s ease-in-out infinite}
.contact-lanyard__loop{position:absolute;top:0;left:50%;width:48px;height:30px;transform:translateX(-50%);border:7px solid #7b403c;border-bottom:0;border-radius:30px 30px 0 0}
.contact-lanyard__strap{position:absolute;z-index:1;top:22px;left:50%;width:32px;height:116px;transform:translateX(-50%);background:repeating-linear-gradient(135deg,#7b403c 0 8px,#a75a4e 8px 14px);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%);box-shadow:0 8px 12px rgba(55,19,20,.22)}
.contact-lanyard__card{position:absolute;top:104px;left:50%;width:190px;height:252px;transform:translateX(-50%) rotateY(0deg);transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.75,.25,1);filter:drop-shadow(0 18px 18px rgba(55,19,20,.28))}
.contact-lanyard__card::before{content:"";position:absolute;z-index:2;top:-13px;left:50%;width:54px;height:26px;transform:translateX(-50%);border:5px solid #7b403c;border-bottom:0;border-radius:24px 24px 0 0;background:transparent}
.contact-lanyard__card-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;padding:24px 16px 16px;background:var(--cream);border:5px solid #7b403c;border-radius:14px;backface-visibility:hidden;color:var(--ink);overflow:hidden}
.contact-lanyard__card-inner::before{content:"";position:absolute;inset:7px;border:1px solid rgba(123,64,60,.35);border-radius:8px;pointer-events:none}
.contact-lanyard__card img{position:relative;z-index:1;width:128px;height:128px;object-fit:contain;background:#fff;border:7px solid #fff;margin:0 0 15px;box-shadow:0 5px 0 #7b403c}
.contact-lanyard__card strong{position:relative;z-index:1;font-family:"Arial Black","Avenir Next Condensed",sans-serif;font-size:1.05rem;letter-spacing:-.04em}
.contact-lanyard__card small{position:relative;z-index:1;margin-top:8px;font-size:.5rem;letter-spacing:.12em;color:#8a5d59}
.contact-lanyard:hover{animation-play-state:paused}
.contact-lanyard:hover .contact-lanyard__card{transform:translateX(-50%) rotateY(-9deg) rotateZ(-3deg) translateY(-8px)}
@keyframes lanyardSwing{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-3deg) translateY(5px)}}
@media(max-width:760px){
  .footer{min-height:760px}
  .footer-title{max-width:none}
  .contact-lanyard{position:relative;top:auto;right:auto;margin:85px auto 0;width:200px;height:350px;transform:rotate(4deg)}
  .contact-lanyard__card{width:176px;height:234px;top:96px}
  .contact-lanyard__card img{width:116px;height:116px;margin-bottom:12px}
  .contact-lanyard__card strong{font-size:.95rem}
}

/* Contact details replace the single placeholder email on the final page. */
.contact-details{display:flex;flex-direction:column;gap:.35em;font-family:"Avenir Next","Trebuchet MS","PingFang SC","Hiragino Sans GB",sans-serif!important;font-size:clamp(1rem,1.45vw,1.25rem)!important;font-weight:500!important;line-height:1.55!important;letter-spacing:.01em!important;margin:0!important}
.contact-details .contact-line{display:block;color:var(--ink)}
.contact-details a{color:#a74738;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px;transition:color .2s ease}
.contact-details a:hover{color:var(--bg)}
@media(max-width:760px){.contact-details{font-size:1rem!important;line-height:1.55!important;letter-spacing:0!important;gap:.28em}.contact-details a{text-underline-offset:4px}}

/* Keep the featured-work section compact enough to scan in one viewport. */
.work{padding-top:6vh;padding-bottom:8vh}
.work .section-heading{margin-bottom:30px}
.work .section-heading h2{font-size:clamp(2.6rem,5.5vw,5.8rem);line-height:.86}
.work .section-kicker{margin-bottom:14px}
.accordion-gallery{height:min(56vh,460px)}
@media(max-width:760px){
  .work{padding-top:54px;padding-bottom:70px}
  .work .section-heading{margin-bottom:24px}
  .work .section-heading h2{font-size:clamp(2.5rem,10vw,4.2rem)}
  .accordion-gallery{height:390px}
}
@media(max-width:520px){.accordion-gallery{height:500px}}

/* Pointer gaze states: all portraits share one frame so the eyes can change without a layout jump. */
.person-state{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;z-index:5;pointer-events:none;opacity:0;transition:opacity .18s ease}
.person-state-center{opacity:1}
.person-state.is-active{opacity:1}
@media(prefers-reduced-motion:reduce){.person-state{transition:none}}

/* Detailed internship bullets keep the timeline informative without losing the editorial rhythm. */
.experience-copy{max-width:820px}
.experience-bullets{display:grid;gap:11px;margin:0;padding-left:1.25em;color:var(--muted);font-size:.9rem;line-height:1.62}
.experience-bullets li{padding-left:.2em}
.experience-bullets strong{color:var(--cream);font-weight:700}
@media(max-width:760px){.experience-bullets{gap:9px;font-size:.78rem;line-height:1.55;padding-left:1.1em}.experience-bullets li{padding-left:.05em}.experience-bullets strong{color:var(--cream)}}