/*
Theme Name: Linar Motion
Version: 1.1
*/
*{box-sizing:border-box}body{margin:0;background:#f8f5ed;color:#211e1b;font:17px/1.55 'Helvetica Neue',Arial,sans-serif}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}a:focus-visible{outline:3px solid #7858d6;outline-offset:4px}header,main,footer{max-width:1440px;margin:auto;padding-inline:clamp(20px,5vw,85px)}nav,nav div,footer,.tabs{display:flex;align-items:center;gap:20px}nav{height:76px;justify-content:space-between;border-bottom:1px solid #bab4a9}nav a{display:inline-flex;align-items:center;gap:10px}.logo{background:#22201c;color:#fff;padding:4px 9px;border-radius:7px;font:italic bold 20px Georgia}.logo span,h1 span{color:#da5528}main{padding-block:64px;min-height:65vh}.case{display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;gap:5%}.eyebrow,.tabs,footer{font:13px/1.5 ui-monospace,monospace}.eyebrow{margin:0 0 24px}h1,h2,p{margin:0}h1{font-size:clamp(52px,7.4vw,110px);letter-spacing:-.08em;line-height:1.02;overflow-wrap:anywhere}h1 i{font:italic 1em Georgia;color:#b34423}.lead{font-size:clamp(19px,2.2vw,30px);margin:24px 0;max-width:30ch}.button{display:inline-block;background:#211e1b;color:white;padding:12px 20px;border-radius:30px}.art{position:relative;isolation:isolate;overflow:hidden;height:clamp(300px,36vw,540px);background:var(--t);border-radius:16px;display:grid;place-items:center}.art span{font:italic clamp(65px,9vw,150px)/1 Georgia;letter-spacing:-.1em;position:absolute;color:#0005;white-space:nowrap;z-index:-1}.art img{height:82%;max-width:70%;width:auto;object-fit:contain;border-radius:16px;box-shadow:10px 16px 28px #31231a40;transform:rotate(6deg)}.panel{display:none}.panel b{display:block;margin:10px 0}.tabs{flex-wrap:wrap;gap:6px}.tabs label{cursor:pointer;padding:5px 9px;border:1px solid #aea698;border-radius:20px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:36px 22px;margin-top:32px}.grid .art{height:320px}.grid h2{margin-top:9px}.body{max-width:620px;margin:30px 0}.body p{margin:7px 0 19px}.body h2{font-size:23px}.case{margin:30px 0}footer{border-top:1px solid #c3bcaf;flex-wrap:wrap;padding-block:24px}footer span{margin-right:auto}@media(max-width:740px){.case,.grid{grid-template-columns:1fr;gap:28px}main{padding-block:36px}.grid .art{height:290px}nav{gap:9px}nav strong{font-size:14px}nav div{gap:12px}}
#project-0:checked~.p0{display:block}#project-0:checked~.tabs label[for="project-0"]{background:#211e1b;color:white}#project-0:focus-visible~.tabs label[for="project-0"]{outline:3px solid #7858d6}
#project-1:checked~.p1{display:block}#project-1:checked~.tabs label[for="project-1"]{background:#211e1b;color:white}#project-1:focus-visible~.tabs label[for="project-1"]{outline:3px solid #7858d6}
#project-2:checked~.p2{display:block}#project-2:checked~.tabs label[for="project-2"]{background:#211e1b;color:white}#project-2:focus-visible~.tabs label[for="project-2"]{outline:3px solid #7858d6}
#project-3:checked~.p3{display:block}#project-3:checked~.tabs label[for="project-3"]{background:#211e1b;color:white}#project-3:focus-visible~.tabs label[for="project-3"]{outline:3px solid #7858d6}
#project-4:checked~.p4{display:block}#project-4:checked~.tabs label[for="project-4"]{background:#211e1b;color:white}#project-4:focus-visible~.tabs label[for="project-4"]{outline:3px solid #7858d6}

body{background:#f8f7f2;color:#202421}header,main,footer{max-width:1360px}.portrait,.chapter{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,6vw,100px);align-items:center}.portrait{padding-bottom:65px}.portrait h1{font-size:clamp(52px,6.6vw,102px);line-height:.97}.portrait h1 i{color:#3c624d}.portrait figure{margin:0;background:#d4dbcf;border-radius:48% 48% 8px 8px;overflow:hidden;aspect-ratio:4/5}.portrait figure img{width:100%;height:100%;object-fit:cover}.summary{font-size:clamp(22px,2.3vw,34px);line-height:1.21;margin:24px 0 14px;letter-spacing:-.035em}.story,.copy p,.history p{max-width:56ch;color:#444e46}.portrait .button{margin:22px 12px 0 0}.bio-link,.read{text-decoration:underline;text-underline-offset:5px}.section-title,.history h2{font-size:clamp(40px,6vw,82px);letter-spacing:-.07em;line-height:1.1}.chapter{padding:44px 0;border-bottom:1px solid #c5cbc2}.chapter:nth-of-type(even) .showcase{order:2}.showcase{background:radial-gradient(ellipse at 35% 30%,#ffffff77,transparent 70%),var(--tone);display:grid;place-items:center;height:clamp(360px,40vw,540px);border-radius:8px}.showcase a{height:85%;display:block}.showcase img{display:block;height:100%;width:auto;border-radius:18px;box-shadow:10px 20px 32px #15231e40;transform:rotate(-4deg);transition:transform .55s}.showcase a:hover img{transform:rotate(0)}.copy h2{font-size:clamp(44px,5.8vw,84px);line-height:1;letter-spacing:-.07em}.copy h3{font:italic clamp(22px,2.5vw,36px)/1.15 Georgia;margin:15px 0}.copy small{display:block;margin:20px 0;font:13px ui-monospace,monospace}.history{margin:58px 0 22px}.history dl{display:grid;grid-template-columns:minmax(100px,1fr) 3fr;gap:22px;border-top:1px solid #bdc6bb;padding-top:24px}.history dd{margin:0}.detail{margin-bottom:22px}
@media(max-width:740px){.portrait,.chapter{grid-template-columns:1fr}.portrait figure{max-height:360px;width:min(100%,350px);justify-self:center}.chapter:nth-of-type(even) .showcase{order:0}.chapter{padding:28px 0}.history dl{display:block}.history dt{margin-top:20px}.portrait{padding-bottom:36px}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}.portrait>div{animation:intro .65s both}.portrait figure{animation:intro .85s .08s both}.chapter.enter .showcase{animation:intro .85s cubic-bezier(.2,.7,.2,1) both}.chapter.enter .copy{animation:intro .7s .12s both}@keyframes intro{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}@view-transition{navigation:auto}::view-transition-old(root){animation-duration:.2s}::view-transition-new(root){animation-duration:.35s}}
@media(max-width:740px){.portrait,.chapter{grid-template-columns:minmax(0,1fr)}.portrait h1{font-size:clamp(42px,12vw,72px)}footer{gap:12px}.showcase{min-width:0}.showcase a{max-width:88%;height:auto}.showcase img{max-width:100%;max-height:310px;height:auto;width:auto}.copy{min-width:0}}

/* Dark portfolio and framed project posters */
:root{color-scheme:dark}
body{background:#101213;color:#eeeFEA}
nav,footer,.chapter,.history dl{border-color:#363a3c}
header,main,footer{max-width:1280px}
.logo{background:#d5e4cb;color:#141918}
.logo span,h1 span,.portrait h1 i{color:#adc4a5}
.story,.copy p,.history p,.grid p{color:#c0c6c4}
.eyebrow,.copy small,footer{color:#b3bfba}
.button{background:#cee1c4;color:#111911}
.portrait{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.portrait figure{width:100%;max-width:365px;aspect-ratio:1;justify-self:center;border-radius:18px;background:#202524;border:1px solid #383d3b}
.portrait figure img{display:block;object-fit:contain}
.chapter{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,5vw,72px)}
.showcase,.grid .art{position:relative;isolation:isolate;overflow:hidden;border-radius:16px;background:radial-gradient(ellipse at 50% 38%,color-mix(in srgb,var(--tone,var(--t)) 24%,#191b20),#1a1d20 85%);border:1px solid #393e40}
.showcase{height:clamp(330px,39vw,470px)}
.showcase:before,.grid .art span{color:color-mix(in srgb,var(--tone,var(--t)) 35%,#272b30);font:italic clamp(62px,7.4vw,104px)/1 Georgia;letter-spacing:-.085em;white-space:nowrap}
.showcase:before{content:attr(data-name);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.showcase a{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;height:auto;max-width:none}
.showcase img,.grid .art img{position:relative;box-sizing:content-box;width:auto;height:79%;max-width:68%;max-height:none;object-fit:contain;border:4px solid #191b1e;border-radius:20px;box-shadow:8px 15px 25px #0008;transform:rotate(-6deg)}
.chapter:nth-of-type(even) .showcase img{transform:rotate(6deg)}
.showcase a:hover img,.showcase a:focus-visible img{transform:rotate(0)}
@media(max-width:740px){.portrait,.chapter{grid-template-columns:minmax(0,1fr)}.portrait figure{width:min(100%,340px)}.showcase{height:clamp(300px,80vw,400px)}.showcase:before,.grid .art span{font-size:clamp(56px,14vw,96px)}}
@media(prefers-reduced-motion:reduce){.showcase img,.grid .art img{transition:none}}