:root{--ink:#141413;--paper:#eeede5;--acid:#edff64;--muted:#b9b8ae;--line:#ffffff36;--head:Impact,"Arial Narrow","Liberation Sans Narrow",sans-serif;--body:Arial,Helvetica,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:1rem}body{margin:0;background:var(--ink);color:var(--paper);font:16px/1.55 var(--body)}a{color:inherit;text-decoration:none}a:focus-visible,summary:focus-visible{outline:3px solid #859400;outline-offset:5px}.wrap{width:min(100% - 9vw,1340px);margin:auto}.skip{position:absolute;left:1rem;top:-8rem;z-index:10;background:var(--acid);color:var(--ink);padding:1rem}.skip:focus{top:1rem}
.header{border-bottom:1px solid var(--line)}.nav{height:74px;display:flex;justify-content:space-between;align-items:center;gap:24px}.logo{display:inline-flex;flex:none}.logo img{display:block;width:auto;height:30px}.dot{color:var(--acid)}.nav nav{display:flex;gap:36px;color:var(--muted)}.nav a:hover,.footer a:hover{color:var(--acid)}.contact-link{border:1px solid var(--line);padding:9px 14px;font-size:13px;font-weight:700;white-space:nowrap}.contact-link span{margin-left:12px;color:var(--acid)}
.hero{position:relative;display:flex;flex-direction:column;min-height:min(780px,calc(100svh - 74px));background:linear-gradient(90deg,#111110 0%,#111110b0 37%,#11111015 75%),url(hero.webp) #22221f;background-size:cover;background-position:center;isolation:isolate}.hero-inner{padding-block:clamp(80px,12vh,160px) 78px;flex:1}.nav nav a,.label,.hero-foot,.number,.footer>span{font:700 12px/1.4 monospace;letter-spacing:.15em}.label{display:flex;align-items:center;gap:12px;margin:0 0 30px}.label i{width:8px;height:8px;background:var(--acid);display:inline-block;flex:none}h1,h2,h3,p{margin-top:0}h1,h2{font-family:var(--head);font-weight:900;letter-spacing:-.045em;line-height:.88;margin-bottom:27px}h1{font-size:clamp(76px,12.6vw,184px)}h1 em{font-style:normal;color:var(--acid)}h2{font-size:clamp(55px,8vw,116px)}.hero-copy{max-width:410px;font-size:clamp(17px,1.6vw,22px);color:#e5e3d9;margin-bottom:28px}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:32px;background:var(--acid);color:var(--ink);font:700 14px var(--body);padding:16px 19px;border:0;cursor:pointer}.button:hover{background:#fff}.hero-foot{display:flex;justify-content:space-between;gap:12px;padding-block:18px;border-top:1px solid var(--line);color:#d2d0c7}
.about,.contact{background:var(--paper);color:var(--ink);color-scheme:light}.about-grid,.contact-grid{display:grid;grid-template-columns:1fr 2.25fr;gap:40px;padding-block:clamp(68px,10vw,145px)}.about .label i,.contact .label i{background:#727a16}.about h2{font-size:clamp(46px,6.8vw,96px)}.about p:last-child{max-width:630px;font-size:clamp(17px,2vw,23px);margin-bottom:0;color:#45443f}
.services{padding-block:clamp(70px,10vw,145px)}.services h2{margin-bottom:44px}.service-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{list-style:none;display:grid;grid-template-columns:62px 1fr 32px;gap:16px;align-items:center;padding:25px 0;cursor:pointer}summary::-webkit-details-marker{display:none}.number{color:var(--acid)}h3{font-size:clamp(24px,4.3vw,54px);line-height:1;letter-spacing:-.055em;margin:0}.toggle{width:30px;height:30px;border:1px solid var(--line);display:grid;place-items:center}.toggle::after{content:"+"}details[open] .toggle::after{content:"−"}summary:hover .toggle{background:var(--acid);color:var(--ink)}.service-body{margin:0 48px 28px 78px;display:grid;grid-template-columns:1fr .8fr;gap:35px;color:var(--muted)}.service-body p,.service-body ul{margin:0}.service-body ul{padding-left:19px}.service-body li::marker{color:var(--acid)}
.contact-grid{grid-template-columns:1.1fr 1fr;gap:clamp(32px,7vw,100px)}.contact .dot{color:#737c0c}.email{align-self:center;justify-self:start;font-size:clamp(19px,2.65vw,36px);font-weight:700;letter-spacing:-.025em;overflow-wrap:anywhere;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.24em}.email:hover{color:#535b05}.footer{display:flex;justify-content:space-between;gap:14px;align-items:center;padding-block:24px}.footer>span,.footer>a:last-child{font-size:12px;color:var(--muted)}
@media(max-width:700px){.nav{height:64px;gap:12px}.nav nav{gap:13px;font-size:13px}.logo img{height:26px}.contact-link{padding:7px;font-size:12px}.contact-link span{margin-left:3px}.hero{min-height:640px;background-position:58% center;background-image:linear-gradient(90deg,#111110c9,#1111104a),url(hero.webp)}.hero-inner{padding-block:112px 62px}.hero-foot{font-size:9px}.about-grid,.contact-grid{grid-template-columns:1fr;gap:22px}.about-grid>.label{margin:0}summary{grid-template-columns:30px 1fr 30px;gap:9px}.service-body{margin-left:39px;margin-right:10px;grid-template-columns:1fr;gap:12px}.footer>span{letter-spacing:0}}
@media(max-width:360px){h1{font-size:64px}.nav nav{gap:8px}.nav{gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.contact-link svg{vertical-align:middle;margin-left:8px;color:var(--acid)}
@media(max-width:700px){.contact-link svg{width:11px;height:11px;margin-left:2px}h1{font-size:clamp(64px,13vw,100px)}}

.selected-work{padding-block:clamp(68px,9vw,130px);border-top:1px solid var(--line);background:#191918}
.selected-work h2{margin-bottom:clamp(28px,5vw,62px)}
.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,30px)}
.work-card a{height:100%;display:flex;flex-direction:column;border:1px solid var(--line)}
.work-card a:hover{border-color:var(--acid)}
.work-card img{width:100%;aspect-ratio:1;display:block;object-fit:cover;background:#252522}
.work-card img[src="emi-martinez.webp"]{object-position:center 38%}
.work-copy{display:flex;flex:1;flex-direction:column;padding:clamp(17px,2.3vw,32px)}
.work-service{margin-bottom:12px;color:var(--acid);font:700 11px/1.5 monospace;letter-spacing:.11em;text-transform:uppercase}
.work-copy h3{font-size:clamp(26px,3vw,46px);margin-bottom:13px}
.work-description{color:var(--muted);margin-bottom:23px}
.work-link{display:flex;align-items:center;gap:9px;margin-top:auto;color:var(--acid);font-weight:700;font-size:14px}
.work-card a:hover .work-link{text-decoration:underline;text-underline-offset:.2em}
@media(max-width:700px){.work-grid{grid-template-columns:1fr;gap:20px}}
@media(max-width:390px){.nav nav{gap:7px;font-size:12px}.nav{gap:7px}}

:root[data-accent="red"]{--acid:#ef3045}
[data-accent="red"] .hero .button{background:#c8102e;color:#fff}
[data-accent="red"] .hero .button:hover{background:#a90e27}
[data-accent="red"] .about .label i,[data-accent="red"] .contact .label i{background:#a90e27}
[data-accent="red"] .contact .dot,[data-accent="red"] .email:hover{color:#a90e27}
[data-accent="red"] :focus-visible{outline-color:#a90e27}
