:root{--muted:#5e5b55;--ease:cubic-bezier(.22,1,.36,1)}
/* Legibility is shared across desktop and mobile. */
.mono,.eyebrow,.nav-links,.nav-cta,.menu-button,.brand small,.small-link,.hero-actions a,.filter,.footer-links,.copyright,.skill-tracks span,.timeline-readout{font-size:11px;letter-spacing:.055em}
.project-meta,.carousel-caption p,.carousel-caption button,.carousel-count,.brand-card p,.brand-stat-label,.brand-stat-note,.brand-data-note,.brand-page-subtitle,.field label,.detail-meta,.detail-roles,.project-video-card p,.lightbox-top,.lightbox-bottom,.lightbox-fullscreen,.lightbox-original,.lightbox-close,.send{font-size:12px!important;letter-spacing:.035em!important}
.brand small{opacity:1;line-height:1.5}.brand-card p{line-height:1.55;overflow-wrap:anywhere}.brand-copy{min-width:0}
.work .eyebrow,.work .filter,.work-intro,.work .carousel-caption p,.carousel-count,#project-detail .eyebrow,#project-detail .detail-meta,#project-detail .project-video-card p,.contact .eyebrow,.contact .label,.contact .field label,.contact-info,.copyright{color:#bdb9b0}
.contact input::placeholder,.contact textarea::placeholder{color:#aaa69d}.contact-email{overflow-wrap:anywhere}
:is(a,button,input,select,textarea):focus-visible{outline:2px solid #b1623f;outline-offset:5px}
.nav{grid-template-columns:1.2fr auto 1fr}.nav-links{gap:clamp(17px,2.6vw,38px)}
/* About uses a distinct, restrained dark scene. */
.practice{background:#1f1e1b;color:var(--paper);padding-block:var(--sec-pad)}
.practice .eyebrow,.about-heading>p,.about-stats span,.timeline-readout,.timeline-clip p,.about-closing,.timeline-help,.skill-tracks span{color:var(--muted)}
.about-heading{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:clamp(30px,5vw,72px)}.about-heading h2{font-size:clamp(48px,6.3vw,88px);line-height:.95;letter-spacing:-.065em}.about-heading>p{font-size:clamp(16px,1.45vw,20px)}
.about-stats{grid-template-columns:1.3fr 1fr 1fr 1fr;margin:54px 0 64px;border-color:#bbb5ab;align-items:center}.about-stats>div{border-color:#bbb5ab}.about-stats strong{font-size:clamp(40px,5vw,68px)}.about-stats>div:first-child strong{font-size:clamp(56px,7vw,94px)}.about-stats span{font-size:12px;letter-spacing:.045em}.about-stats .digit-window{display:inline-block;overflow:hidden;vertical-align:bottom}.about-stats .digit-reel{display:inline-block;animation:digit-arrive .75s var(--ease) both;animation-delay:var(--digit-delay)}
@keyframes digit-arrive{from{transform:translateY(105%);opacity:.1}to{transform:none;opacity:1}}
.timeline-scroll{position:relative}.timeline-block{padding:30px 0 26px;border-block:1px solid #bbb5ab;background:var(--paper)}.timeline-top{align-items:center;gap:16px}.timeline-help{font-size:12px;line-height:1.5;margin:14px 0 0}.timeline-rail{margin-top:74px;border-radius:3px;padding-top:0;--position:0%}.timeline-rail:focus-within{outline:2px solid #975033;outline-offset:13px}.timeline-rail:before{background:#a29a8c}.timeline-progress{background:#8b482e;width:100%!important;transform:scaleX(var(--progress,0));transform-origin:left;transition:transform .3s var(--ease)}
.timeline-playhead{position:absolute;left:var(--position);top:-14px;width:1px;height:40px;background:#8b482e;pointer-events:none;transition:left .3s var(--ease)}.timeline-playhead:before{content:'';position:absolute;left:-5px;top:8px;width:11px;height:11px;background:#8b482e;border:2px solid var(--paper);border-radius:50%}.timeline-playhead>span{position:absolute;top:-28px;left:0;transform:translateX(-50%);padding:5px 8px;font:11px var(--mono);white-space:nowrap;background:#252620;color:#f4f1ea}.timeline-playhead.at-start>span{transform:none}.timeline-playhead.at-end>span{transform:translateX(-100%)}
.timeline-scrubber{inset:-20px 0 auto;margin:0;width:100%;height:44px;z-index:2;touch-action:pan-y}.timeline-points{position:relative;padding-top:22px;display:flex;justify-content:space-between}.timeline-points button{position:relative;min-height:44px;min-width:44px;padding:10px 0;border:0;background:none;color:#5e5b55;font:11px var(--mono);letter-spacing:.035em;cursor:pointer}.timeline-points button:first-child{text-align:left}.timeline-points button:last-child{text-align:right}.timeline-points button[aria-pressed=true]{color:#6d331f;font-weight:500}.timeline-points i{display:inline-block;width:5px;height:7px;background:#a39a87;margin-right:6px;clip-path:polygon(0 0,100% 0,100% 70%,50% 55%,0 70%)}.timeline-points button[aria-pressed=true] i{background:#975033}.timeline-clip{min-height:145px}.timeline-clip h3{max-width:100%;font-size:clamp(30px,3.8vw,48px)}.about-closing{margin:18px 0 0;font-size:13px}
.software-strip{padding-top:42px}.software-strip ul{display:flex;flex-wrap:wrap;gap:0;list-style:none;padding:0;margin:18px 0 0}.software-strip li{font-size:14px;line-height:1.5;padding:10px 18px 10px 0;margin-right:18px;border-bottom:1px solid #bbb5ab}.skill-tracks{border-color:#bbb5ab;margin-top:30px}.skill-tracks>div{border-color:#bbb5ab}.skill-tracks>div:hover{color:#6d331f}
.brands{background:#e8e3da}.contact,.footer{background:#121310}
.project-hover-media{transition:none!important}.project-hover-media.is-playing{animation:cut-grain .12s steps(2)}@keyframes cut-grain{from{opacity:.6}to{opacity:1}}
.detail,.detail.open{filter:none;transform:none}.detail{transition:opacity .15s,visibility .15s}.detail.open .detail-content{animation:detail-clip-in .3s var(--ease)}@keyframes detail-clip-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.carousel-media,.carousel-media img{user-select:none;-webkit-user-drag:none}
@media(min-width:901px) and (prefers-reduced-motion:no-preference){.timeline-scroll{min-height:1050px}.timeline-block{position:sticky;top:110px}}
@media(max-width:900px){.nav{grid-template-columns:1fr auto}.nav-cta{display:none}.about-heading{grid-template-columns:1fr;gap:24px}.about-heading h2,.about-heading>p{grid-column:auto;grid-row:auto}.about-heading h2{margin-bottom:0}.about-heading>p{max-width:650px}.timeline-help{font-size:12px}}
@media(max-width:760px){.about-heading h2{font-size:clamp(44px,10.7vw,68px)}.about-stats{grid-template-columns:1fr 1fr}.about-stats strong{font-size:46px}.about-stats>div:first-child strong{font-size:62px}.timeline-clip{grid-template-columns:1fr;min-height:150px;gap:6px}.timeline-clip p{margin:0}.brand-grid{grid-template-columns:1fr}.brand-card{grid-template-columns:44px minmax(0,1fr) 20px}.brand-card h3{font-size:16px}.lightbox-bottom{gap:12px;flex-wrap:wrap}.lightbox-controls{flex-wrap:wrap}.footer-links{font-size:11px}.footer .brand{max-width:100%}.brand small{font-size:11px}.contact-email{font-size:clamp(17px,4.9vw,26px)}}
@media(prefers-reduced-motion:reduce){.about-stats .digit-reel,.detail.open .detail-content{animation:none}.timeline-scroll{min-height:0}.timeline-block{position:static}.timeline-progress,.timeline-playhead{transition:none}.work:before{display:none}}
@media(hover:none){.work:before{display:none}.project-hover-media{display:none}}
.about-stats strong span{font:inherit;letter-spacing:inherit;color:inherit;margin:0}
.about-stats strong .digit-window,.about-stats strong .digit-reel{display:inline-block}
.work .carousel-slide{opacity:1}
.project-comparison{--split:50%;margin-top:50px}.comparison-frames{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:10px}.comparison-frames img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#111}.comparison-after{clip-path:inset(0 calc(100% - var(--split)) 0 0)}.comparison-line{position:absolute;left:var(--split);top:0;bottom:0;width:1px;background:#f4f1ea}.project-comparison label{display:block;margin-top:15px;font:12px var(--mono)}.project-comparison input{display:block;width:100%;margin-top:15px;accent-color:#c8b994}
.work .carousel-slide:not(.is-active) .carousel-media{opacity:.65}
.work .work-carousel.preview-active .carousel-slide:not(.is-previewing){opacity:1;filter:none}
.work .work-carousel.preview-active .carousel-slide:not(.is-previewing) .carousel-media{opacity:.35}
#project-detail .detail-columns p{color:#bdb9b0}
@media(max-width:760px){.about-heading>p{margin-top:24px}}
@media(hover:hover) and (pointer:fine){.carousel-media{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='34'%3E%3Crect x='1' y='1' width='68' height='32' rx='3' fill='%23171814' stroke='%23f4f1ea'/%3E%3Ccircle cx='13' cy='17' r='3' fill='%23c7a17d'/%3E%3Ctext x='23' y='21' fill='%23f4f1ea' font-size='11' font-family='monospace'%3EPLAY%3C/text%3E%3C/svg%3E") 8 8,pointer}}
/* Keep playback navigation on one row on narrow screens. */
@media(max-width:600px){.lightbox-bottom{flex-direction:column;align-items:stretch;gap:12px}.lightbox-controls{display:grid!important;grid-template-columns:38px 1fr 38px;gap:8px!important}.lightbox-original{grid-column:1/-1;justify-self:start}.lightbox-count,#lightbox-count{text-align:center}.lightbox-arrow{justify-self:center}}