/* EJÄIS — a professional story in four movements. */
:root{--story-ink:#102532;--story-paper:#f5eee2;--story-gold:#d3af70}
.professional-journey{position:relative;background:var(--story-paper)}
.portfolio-hero{padding:clamp(32px,5vw,80px) 0 0;background:radial-gradient(ellipse at 80% 38%,#213d49 0,transparent 54%),var(--story-ink);isolation:isolate}
.portfolio-stage{grid-template-columns:1.3fr 1fr;column-gap:3vw;align-items:center}
.portfolio-hero .hero-copy{padding:24px 0 45px;position:relative;z-index:2}
.portfolio-hero .kicker{letter-spacing:.17em;font-size:.68rem;margin-bottom:2rem}
.portfolio-hero h1{font:400 clamp(2.8rem,5.5vw,5.8rem)/1.01 var(--serif);letter-spacing:-.045em;margin:0 0 1.8rem;text-wrap:balance}
.portfolio-hero h1 span{display:block;color:#ead6b0;padding:0}
.hero-manifesto{max-width:510px;margin:-.55rem 0 1rem;color:#f4ead9;font:italic 1.08rem/1.55 var(--serif)}
.hero-role{font:400 1rem/1.6 var(--sans)}
.portfolio-hero p.lead{font:.85rem/1.75 var(--sans);color:#c3cdd1;max-width:430px}
.portfolio-hero .actions{display:flex;flex-direction:row;margin-top:1.8rem}
.portfolio-hero .btn{width:auto;font-size:.7rem;padding:.85rem 1.4rem;min-height:46px;background:#d4b478}
.hero-shortcuts{display:flex;flex-wrap:wrap;gap:.8rem 1.4rem;margin-top:1rem}
.hero-shortcuts a{margin:0;color:#c8d3d6;font:.75rem/1.7 var(--sans);text-decoration:none;text-underline-offset:5px}
.hero-shortcuts a:hover{text-decoration:underline;color:#ead6b0}
.hero-portrait{align-self:end;margin:0;padding:0;position:relative;background:transparent;overflow:visible;animation:none}
.hero-portrait img{width:100%;height:auto;min-height:0;max-height:none;object-fit:contain;mask-image:none;-webkit-mask-image:none;filter:none;transform:none}
.hero-portrait::before{content:"";display:block;position:absolute;inset:18% -10% 8%;border:0;border-radius:50%;background:radial-gradient(ellipse,rgba(211,175,112,.1),transparent 65%);z-index:-1}
.hero-portrait::after{background:linear-gradient(0deg,#102532 0,transparent 12%);pointer-events:none}
.story-opening{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center;padding:24px 0 30px;border-top:1px solid rgba(234,214,176,.2);color:#d0dade}
.story-opening>span{font:.6rem var(--sans);text-transform:uppercase;letter-spacing:.15em;color:#ead6b0}
.story-opening p{margin:0;font:1.12rem/1.4 var(--serif)}
.story-opening>a{font:2rem var(--serif);text-decoration:none;color:#ead6b0}
.chapter-nav{position:sticky;top:calc(var(--header-offset,100px) - 24px);z-index:28;background:rgba(16,37,50,.96);backdrop-filter:blur(16px);color:#f5eee2;border-top:1px solid rgba(234,214,176,.12);border-bottom:1px solid rgba(234,214,176,.16)}
.chapter-navigation{display:flex;align-items:center;gap:clamp(1rem,4vw,4rem);min-height:58px}
.chapter-counter{font:.65rem var(--sans);color:#93a5ad;white-space:nowrap;margin-right:auto;letter-spacing:.12em}
.chapter-counter b{font-weight:400;color:#ead6b0}
.chapter-nav a{font:.72rem/1.4 var(--sans);white-space:nowrap;text-decoration:none;padding:20px 0;position:relative;color:#c2cdd2}
.chapter-nav a::after{content:"";position:absolute;bottom:10px;left:0;right:0;height:1px;background:#d3af70;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.chapter-nav a[aria-current="step"],.chapter-nav a:hover{color:#ead6b0}
.chapter-nav a[aria-current="step"]::after,.chapter-nav a:hover::after{transform:scaleX(1)}
.links a[aria-current="page"]{color:#ead6b0}
.links a[aria-current="page"]::after{transform:scaleX(1)}
.story-chapter{position:relative;padding:clamp(78px,9vw,140px) 0;scroll-margin-top:calc(var(--header-offset,126px) + 58px);overflow:clip}
.chapter-light{background:var(--story-paper);color:var(--story-ink)}
.chapter-dark{background:var(--story-ink);color:var(--story-paper)}
.chapter-layout{display:grid;grid-template-columns:.55fr 1.45fr;column-gap:clamp(2rem,7vw,7rem);align-items:start}
.chapter-marker{position:sticky;top:calc(var(--header-offset,126px) + 100px)}
.chapter-number{font:400 clamp(6rem,15vw,13.5rem)/.78 var(--serif);letter-spacing:-.08em;color:#cfbd9f;display:block;margin-left:-.07em;transition:color .5s}
.chapter-dark .chapter-number{color:#36515e}
.story-chapter.is-active .chapter-number{color:#b38a4c}
.chapter-eyebrow{font:.65rem/1.6 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin:2rem 0 1.2rem;color:#795b2e}
.chapter-dark .chapter-eyebrow{color:#d3b680}
.chapter-reading{height:1px;max-width:160px;background:#d6c9b4;margin-top:2rem;overflow:hidden}
.chapter-reading i{display:block;width:var(--chapter-progress,0%);height:100%;background:#ab7f3f;transition:width .12s linear}
.chapter-dark .chapter-reading{background:#36515e}.chapter-dark .chapter-reading i{background:#d3b680}
.chapter-title{font:400 clamp(2.5rem,4.4vw,4.8rem)/1.08 var(--serif);letter-spacing:-.035em;margin:0 0 2rem;text-wrap:balance}
.chapter-title em{font-style:normal;color:#9b743c}
.chapter-dark .chapter-title em{color:#ead6b0}
.chapter-lead{font:400 clamp(1.1rem,1.7vw,1.4rem)/1.65 var(--serif);max-width:690px;margin:0 0 1.8rem}
.chapter-text{font:.92rem/1.85 var(--sans);color:#576269;margin:1.2rem 0;max-width:680px}
.chapter-dark .chapter-text,.chapter-dark .chapter-detail p{color:#c4ced2}
.chapter-detail{margin:2.2rem 0;border-top:1px solid #d5c7ae;border-bottom:1px solid #d5c7ae}
.chapter-dark .chapter-detail{border-color:#3b505b}
.chapter-detail summary{list-style:none;padding:1.25rem 2rem 1.25rem 0;cursor:pointer;font:1.05rem/1.4 var(--serif);position:relative}
.chapter-detail summary::-webkit-details-marker{display:none}
.chapter-detail summary::after{content:"+";position:absolute;right:0;color:#ac8446;font:1.3rem var(--sans)}
.chapter-detail[open] summary::after{content:"−"}
.chapter-detail p{font:.88rem/1.8 var(--sans);margin:0 0 1.1rem;color:#586268}
.practice-lines{padding:.4rem 0 .5rem}.practice-lines b{color:#172b35;font-weight:600}
.chapter-detail .verticality-source{display:inline-block;margin:0 0 1.5rem;font:.76rem var(--sans);color:#ead6b0}
.chapter-next{display:block;width:fit-content;max-width:100%;margin-top:2.8rem;text-decoration:none;font:.78rem/1.7 var(--sans);color:#795b2e;border-bottom:1px solid #b79a6c;padding-bottom:.45rem}
.chapter-dark .chapter-next{color:#ead6b0;border-color:#607075}
.solidarity-proof{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:start;margin:3rem 0;padding:2rem 0;border-top:1px solid #3b505b;border-bottom:1px solid #3b505b}
.proof-number{font:400 7rem/.9 var(--serif);color:#ead6b0}
.proof-heading{font:1.25rem/1.4 var(--serif);margin:0 0 .75rem;color:#ead6b0}
.solidarity-proof .chapter-text{margin:0}
.creation-process{margin:3rem 0;padding:2rem 0 0;border-top:1px solid #cfbfa4;border-bottom:1px solid #cfbfa4}
.process-intro{font:.65rem var(--sans);letter-spacing:.09em;text-transform:uppercase;color:#795b2e;margin:0 0 1.5rem}
.process-tabs{display:flex;gap:2rem;border-bottom:1px solid #d8cbb8}
.process-tabs button{padding:.6rem 0 1rem;border:0;border-bottom:2px solid transparent;background:none;font:1rem var(--serif);color:#677078;cursor:pointer}
.process-tabs button[aria-selected="true"]{color:#172b35;border-bottom-color:#b18a4c}
.process-panel{padding:2rem 0;min-height:225px;animation:process-appear .35s ease both}
.process-panel[hidden]{display:none}
.process-panel h3{font:400 1.7rem/1.2 var(--serif);margin:0 0 1rem;color:#172b35}
.process-panel p{font:.9rem/1.8 var(--sans);color:#586268;margin:0;max-width:640px}
.text-link{display:inline-block;color:#795b2e;margin-top:1.5rem;font:.8rem var(--sans);text-underline-offset:5px}
.palliative-letter{margin:3rem 0;padding:0 0 0 1.7rem;border-left:1px solid #c29d5f}
.palliative-letter .chapter-eyebrow{margin:0 0 1rem}
.palliative-letter h3{font:400 clamp(2rem,3.3vw,3.2rem)/1.1 var(--serif);margin:0 0 1.25rem;color:#ead6b0}
.palliative-letter p:not(.chapter-eyebrow){font:.95rem/1.85 var(--sans);color:#d4dde0}
.palliative-letter .chapter-note{font:.8rem/1.8 var(--sans)!important;color:#aabac2!important}
.chapter-dark .btn{margin-top:.4rem;background:#d4b478}
.career-facts{padding:100px 0;background:#0c1e2a;color:#f5eee2}
.facts-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(2rem,7vw,6rem);align-items:start}
.facts-heading{position:sticky;top:calc(var(--header-offset,126px) + 90px)}
.facts-heading .chapter-eyebrow{color:#d3b680;margin:0 0 1.2rem}
.facts-heading h2{font:400 clamp(2.6rem,4.7vw,4.4rem)/1.05 var(--serif);letter-spacing:-.04em;margin:0 0 1.5rem;color:#f5eee2}
.facts-heading>p:last-child{font:.88rem/1.8 var(--sans);color:#b5c5cc;max-width:320px}
.career-facts .virtual-cv{margin:0;border-top:0}
.career-facts .cv-intro{padding:0 0 1.5rem}
.career-facts .cv-title{font-size:1.6rem}
.career-facts .cv-kicker{display:none}
.career-facts .cv-summary{font-size:1.35rem}
.career-facts .cv-detail p{color:#c9d3d8}
.career-facts .actions{display:flex;gap:1rem;flex-wrap:wrap}
.career-facts .btn{font-size:.65rem}
.story-chapter .reveal{transition:opacity .8s,transform .8s}
@keyframes process-appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:850px){
 .portfolio-stage{grid-template-columns:1.2fr 1fr;gap:0 1rem}
 .portfolio-hero h1{font-size:clamp(2.45rem,5.5vw,4rem)}
 .chapter-layout{grid-template-columns:.35fr 1.65fr;gap:2.2rem}
 .chapter-number{font-size:7rem}
 .chapter-eyebrow{font-size:.6rem}
 .chapter-title{font-size:clamp(2.3rem,5vw,3.4rem)}
 .facts-layout{grid-template-columns:1fr;gap:2.5rem}.facts-heading{position:static}
 .facts-heading>p:last-child{max-width:520px}
}
@media(max-width:600px){
 .portfolio-hero{padding:38px 0 0}
 .portfolio-stage{display:flex;flex-direction:column;gap:0}
 .portfolio-hero .hero-copy{order:0;padding:0 6px 18px;width:100%;margin:0}
 .portfolio-hero .kicker{font-size:.58rem;margin-bottom:1.5rem}
 .portfolio-hero h1{font-size:clamp(2.6rem,9.5vw,3.6rem);line-height:1.04;margin-bottom:1.5rem}
 .hero-role{font-size:.85rem}.portfolio-hero p.lead{font-size:.75rem}
 .portfolio-hero .btn{font-size:.66rem;min-height:44px}
 .hero-shortcuts{gap:.5rem 1rem}.hero-shortcuts a{font-size:.7rem}
 .hero-portrait{order:1;margin:0 auto;width:min(82%,360px);height:auto;align-self:center}
 .hero-portrait img{height:auto;min-height:0;max-height:none;width:100%;object-fit:contain}
 .hero-portrait::after{background:linear-gradient(0deg,#102532 0,transparent 12%)}
 .story-opening{order:2;width:100%;display:flex;flex-wrap:wrap;gap:.6rem 1rem;padding:20px 6px 25px;margin-top:-1px}
 .story-opening>span{font-size:.55rem}.story-opening p{font-size:1rem;flex:1 1 85%}.story-opening>a{font-size:1.5rem}
 .chapter-navigation{gap:1rem;min-height:50px;overflow-x:auto;scrollbar-width:none}
 .chapter-navigation::-webkit-scrollbar{display:none}.chapter-counter{display:none}
 .chapter-nav a{font-size:.65rem;padding:17px 0;flex:1;text-align:center}
 .story-chapter{padding:64px 0;scroll-margin-top:calc(var(--header-offset,126px) + 50px)}
 .chapter-layout{display:block}.chapter-marker{position:static;display:grid;grid-template-columns:auto 1fr;align-items:end;gap:1rem;margin-bottom:2.5rem}
 .chapter-number{font-size:4.5rem;margin:0}.chapter-eyebrow{margin:0;font-size:.59rem;letter-spacing:.1em}
 .chapter-reading{grid-column:1/-1;margin-top:.75rem;max-width:none}
 .chapter-title{font-size:clamp(2.2rem,8.1vw,3rem);line-height:1.1;letter-spacing:-.025em;margin-bottom:1.6rem}
 .chapter-lead{font-size:1.16rem;line-height:1.7}.chapter-text{font-size:.88rem;line-height:1.85}
 .chapter-next{font-size:.74rem;margin-top:2rem}
 .solidarity-proof{gap:1.2rem;margin:2.2rem 0;padding:1.5rem 0}.proof-number{font-size:5rem}.proof-heading{font-size:1.12rem}
 .process-tabs{gap:1.25rem}.process-tabs button{font-size:.9rem}.process-panel{min-height:255px}.process-panel h3{font-size:1.5rem}
 .palliative-letter{padding-left:1.2rem}.palliative-letter h3{font-size:2.25rem}.palliative-letter p:not(.chapter-eyebrow){font-size:.9rem}
 .career-facts{padding:64px 0}.career-facts .cv-summary{font-size:1.2rem}.facts-heading h2{font-size:2.8rem}
 .portfolio-hero .sound{font-size:.47rem;top:9px;right:12px;padding:.45rem .6rem}
}
@media(prefers-reduced-motion:reduce){.process-panel{animation:none}.chapter-reading i,.chapter-number{transition:none}}
.universe-sound{display:block!important;top:92px}
@media(max-width:850px){.universe-sound{top:122px}}
