/* Colour chapters and compact, layered compositions for Robin's portfolio. */
:root{--paper:#e7ddc9;--ink:#262119;--ash:#665f54;--line:#cabfae;--accent:#7c2d3a;--ash-dark:#c4cbbb;}
html{scroll-behavior:smooth;scroll-padding-top:82px;overflow-x:clip;}
body{overflow-x:clip;line-height:1.6;}
::selection{background:#c6d69c;color:#15251c;}
h1,h2,h3{ text-wrap:balance; }
p{text-wrap:pretty;}
.wrap{max-width:1240px;padding-inline:clamp(24px,5vw,64px);}
.nav{background:#e7ddc9ed;border-color:#26211925;}
.nav .wrap{height:76px;gap:20px;}
.nav-contact{margin-left:auto;font-size:.82rem;border-bottom:1px solid currentColor;}
.langtoggle{flex-shrink:0;}
.langtoggle button{min-height:40px;}
.hero{padding:70px 0 84px;background:var(--paper);}
.hero .wrap{grid-template-columns:1.05fr 1fr;max-width:1240px;gap:50px;align-items:center;}
.intro-label{font-size:.73rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;margin-bottom:22px;color:var(--ash);}
.hero-copy h1{font-size:clamp(3.6rem,6.1vw,5.6rem);line-height:1.01;letter-spacing:-.06em;max-width:10ch;overflow:visible;}
.hero-copy h1 span{transform:none;animation:none;}
.hero-copy h1 .hero-emphasis{color:var(--accent);}
.hero-copy p.sub{font-size:1.05rem;max-width:35ch;margin-top:26px;}
.hero-copy .cta-row{margin-top:28px;}
.pill-cta{background:var(--accent);color:#fff8ec;border-radius:7px;padding:13px 12px 13px 22px;gap:20px;}
.pill-cta .arrow{background:transparent;}
.hero-visual{width:100%;height:490px;margin:0;isolation:isolate;--mx:0px;--my:0px;}
.hero-plane{display:none;}
.hero-main{position:absolute;left:12%;top:0;width:57%;transform:translate(var(--mx),var(--my));box-shadow:12px 22px 34px #49281c35;transition:transform .3s ease;background:#362020;border:7px solid #362020;border-radius:12px;overflow:hidden;}
.hero-main img{width:100%;height:350px;object-fit:cover;object-position:top;}
.hero-main figcaption,.hero-small figcaption{padding:12px;color:#f5e2ce;font-size:.7rem;line-height:1.4;}
.hero-small{position:absolute;right:-2%;top:45%;width:54%;transform:translate(calc(var(--mx)*-1),calc(var(--my)*-1));transition:transform .3s ease;background:#2c1d2a;border:6px solid #2c1d2a;border-radius:10px;box-shadow:8px 18px 24px #49281c40;overflow:hidden;}
.hero-small img{width:100%;}
.hero-note{position:absolute;bottom:-10px;left:0;background:var(--accent);color:#ffead1;padding:13px 18px;display:flex;align-items:center;gap:12px;max-width:235px;transform:rotate(-4deg);box-shadow:3px 8px 0 #26211912;font-size:.75rem;line-height:1.4;}
.note-mark{font-family:var(--display);font-size:2.8rem;line-height:1;letter-spacing:-.12em;padding-right:8px;}
.project{padding:90px 0;border:0;overflow:clip;}
.project .wrap{gap:60px;}
.project[data-project="pizzeria"]{background:#4a2418;color:#fff0dd;--ash:#ffe0c5;--tint:#ffe0c5;--line:#ffffff40;}
.project[data-project="teamjakt"]{background:#172c24;color:#e6edce;--ash:#c4cebd;--ash-dark:#c4cebd;--line:#dbe7bd40;}
.project[data-project="ilana"]{background:#49313f;color:#f4dcca;--ash:#e2bfcc;--line:#e2bfcc40;--tint:#e2bfcc;}
.project .project-copy h3{font-size:clamp(2.5rem,4.8vw,4.2rem);line-height:1.05;max-width:12ch;letter-spacing:-.045em;}
.project-status{font-size:.73rem!important;letter-spacing:.06em;text-transform:uppercase;margin-bottom:18px;}
.project .project-copy>p{font-size:1rem;max-width:36ch;}
.project .project-copy{order:0!important;}
.project .chips{gap:8px;margin-top:24px;}
.project .chip{color:inherit;border:0;border-bottom:1px solid currentColor;padding:3px 0;margin-right:12px;border-radius:0;font-family:'Geist',sans-serif;font-size:.74rem;}
.project .pill-cta{background:#fff0dd;color:#613020;}
.project[data-project="ilana"] .pill-cta{background:#f0c4cd;color:#49313f;}
.project-preview{position:relative;min-height:555px;display:flex;align-items:center;justify-content:center;padding-right:90px;}
.project-preview .device{background:#41251e;box-shadow:10px 25px 35px #381e2830;border-radius:25px;}
.project-preview .device-wrap{width:250px;margin:0;flex-shrink:0;}
.project-closeup{position:absolute;right:0;bottom:0;width:230px;box-shadow:8px 15px 30px #27192040;}
.evidence-open{border:1px solid #ffffff30;background:#102019;color:inherit;border-radius:9px;overflow:hidden;cursor:zoom-in;padding:0;display:block;font:inherit;}
.evidence-open>span{display:block;padding:11px 14px;font-size:.75rem;text-align:right;background:#ffffff0c;color:inherit;}
.project-closeup img{width:100%;max-height:310px;object-fit:cover;object-position:top;}
.project[data-project="ilana"] .project-preview{padding-right:130px;}
.project[data-project="ilana"] .project-preview .device{background:#281a22;}
.project[data-project="ilana"] .project-closeup{right:0;bottom:20px;background:#291d24;}
.project.stack .wrap{grid-template-columns:1fr 1fr;align-items:center;}
.project.featured .wrap{grid-template-columns:.8fr 1.2fr;align-items:start;}
.project.featured .pill-cta{background:transparent;border:1px solid #bec9ab;color:#e6edce;padding:9px 12px 9px 18px;}
.case-heading{font-family:var(--display);font-size:2rem;line-height:1.15;margin-top:60px;max-width:12ch;letter-spacing:-.03em;}
.case-intro{font-size:.9rem!important;}
.choices{margin:0;min-width:0;}
.choices-panel{opacity:1;transform:none;transition:none;margin:0;}
.choices-tabs{display:flex;gap:0;border-bottom:1px solid #bec9ab50;margin-bottom:24px;}
.choice-tab{border:0;border-radius:0;flex:1;min-height:52px;padding:12px 8px;color:#c4cebd;font-size:.83rem;border-bottom:3px solid transparent;}
.choice-tab.active{background:transparent;color:#e6edce;border-color:#d8e5ae;}
.choices-body{display:flex;flex-direction:column;gap:0;}
.choices-body .evidence-open{order:-1;align-self:center;width:100%;background:#0d1b16;margin-bottom:22px;}
.choices-img{width:100%;height:440px;max-width:none;object-fit:contain;border:0;border-radius:0;}
.choices-body p{margin-top:10px;font-size:.92rem;line-height:1.6;}
.choices-need{font-size:1.2rem!important;color:#e6edce!important;}
.choices-evidence{font-size:.8rem!important;}
.detail-lane{padding-top:65px;padding-bottom:70px;margin-top:0;margin-bottom:0;background:var(--paper);max-width:none;color:var(--ink);}
.detail-heading,.strip{max-width:1112px;margin-inline:auto;}
.detail-shot{flex-basis:245px;}
.detail-open{background:#271d25;border-color:var(--line);}
.detail-controls button{background:transparent;color:var(--ink);border-color:var(--line);}
.how{background:var(--paper);padding:75px 0;border:0;}
.how>.wrap{display:grid;grid-template-columns:1.1fr 1fr;column-gap:70px;}
.how h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.1;grid-row:1 / span 3;max-width:9ch;}
.step{grid-column:2;border-color:var(--line);padding:21px 0;}
.step:first-of-type{border-top:0;padding-top:0;}
.step:last-child{border-bottom:0;}
.step .desc{color:var(--ash);line-height:1.6;}
.about{background:var(--paper);padding:85px 0;border:0;color:var(--ink);}
.about>.wrap{display:grid;grid-template-columns:.85fr 1fr;gap:80px;align-items:center;}
.portrait{position:relative;max-width:390px;}
.portrait img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:3px;box-shadow:12px 17px 0 #00000022;}
.portrait figcaption{font-size:.75rem;margin-top:25px;}
.about h2{font-size:clamp(2.7rem,4.8vw,4.3rem);line-height:1.06;letter-spacing:-.045em;max-width:12ch;margin-bottom:25px;}
.about p{color:var(--ash);line-height:1.7;max-width:37ch;}
.text-link{display:inline-block;border-bottom:1px solid currentColor;margin-top:25px;font-size:.88rem;}
.contact{background:var(--ink);color:#ffead1;padding:85px 0;text-align:left;border:0;}
.contact h2{font-size:clamp(3rem,6.5vw,6rem);line-height:1.05;max-width:13ch;letter-spacing:-.05em;}
.contact-intro{max-width:43ch;margin:25px 0;color:#ffe0c5;}
.contact .pill-cta{background:var(--accent);color:#ffead1;}
.contact a.mono{color:#ffead1!important;font-family:inherit;font-size:1rem!important;}
footer{background:var(--ink);color:#ffead1;border-color:#ffead140;}
footer .wrap{gap:20px;}
a:focus-visible,button:focus-visible{outline:3px solid currentColor;outline-offset:5px;}
.reveal-el{transition:opacity .65s ease,transform .65s ease;}
@media(max-width:859px){
 .hero{padding:45px 0 60px;}.hero .wrap{grid-template-columns:1fr;gap:42px;max-width:640px;}
 .hero-copy h1{font-size:clamp(3rem,10vw,4.8rem);max-width:12ch;}
 .hero-visual{height:400px;width:min(100%,420px);margin:0 auto;}
 .hero-main img{height:275px;}.hero-small{top:44%;right:1%;}.hero-note{bottom:0;}
 .project{padding:60px 0;}.project .wrap,.project.stack .wrap,.project.featured .wrap{grid-template-columns:1fr;gap:38px;}
 .project .project-copy h3{max-width:17ch;font-size:clamp(2.5rem,8vw,3.7rem);}
 .project .project-copy>p{max-width:47ch;}.project-preview{width:min(100%,470px);margin:auto;}
 .case-heading{margin-top:32px;max-width:none;font-size:1.7rem;}.choices-img{height:400px;}
 .how>.wrap{grid-template-columns:1fr;gap:0;}.how h2{grid-row:auto;max-width:none;margin-bottom:30px;}.step{grid-column:1;}
 .about>.wrap{gap:50px;grid-template-columns:1fr 1fr;}.about h2{font-size:2.7rem;}
}
@media(max-width:540px){
 .nav .wrap{height:64px;gap:8px;}.nav-contact{display:none;}.langtoggle{margin-left:auto;}.wordmark{font-size:1rem;}
 .intro-label{font-size:.65rem;letter-spacing:.05em;margin-bottom:18px;}
 .hero-copy p.sub{font-size:1rem;margin-top:20px;}.hero-copy .cta-row{margin-top:23px;}
 .hero-visual{height:350px;}.hero-main{left:9%;width:58%;}.hero-main img{height:230px;}.hero-small{width:53%;top:44%;}
 .hero-main figcaption,.hero-small figcaption{font-size:.6rem;padding:9px;}.hero-note{max-width:200px;font-size:.66rem;padding:10px 13px;bottom:0;}
 .project-preview{min-height:450px;padding-right:55px;}.project-preview .device-wrap{width:205px;}.project-closeup{width:165px;bottom:10px;}.project-closeup img{max-height:235px;}
 .project[data-project="ilana"] .project-preview{padding-right:70px;}.project[data-project="ilana"] .project-closeup{bottom:0;}
 .choices-img{height:330px;}.choice-tab{font-size:.73rem;}.choices-need{font-size:1.05rem!important;}
 .about>.wrap{grid-template-columns:1fr;gap:45px;}.portrait{width:85%;margin:0 auto;}.about h2{font-size:3rem;}
 .about,.how,.contact{padding:60px 0;}.contact h2{font-size:3.3rem;}
 footer .wrap{flex-direction:column;align-items:flex-start;}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto;}
 *,*::before,*::after{animation:none!important;transition:none!important;}
 .hero-visual,.hero-copy p.sub,.hero-copy .cta-row,.reveal-el{opacity:1!important;}
}

.project-closeup{z-index:2;}
.portrait img{object-position:center 42%;}
@media(min-width:860px){.hero-copy h1{max-width:11ch;}}
footer .wrap,footer a:hover{color:#ffead1;}
