@import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap');
:root{--paper:#f0eee7;--ink:#090a0c;--accent:#79cfff;--orange:#ff593f;--muted:#afb0b7}
body{background:var(--ink);color:var(--paper);background-image:radial-gradient(ellipse at 90% 15%,#79cfff09,transparent 35%)}
.header{border-bottom:1px solid #ffffff24;padding-top:18px;padding-bottom:18px;position:relative;z-index:2;background:#090a0cf0}
.brand{display:flex;align-items:center;gap:14px;letter-spacing:0}.brand img{display:block;width:145px;height:auto}.brand-art{font:700 10px 'DM Sans',Arial,sans-serif;letter-spacing:2px;color:var(--accent);max-width:70px;line-height:1.7}.brand i{display:none}
nav{font-size:12px;text-transform:uppercase;letter-spacing:1px}nav a:last-child{border-color:var(--orange)}nav a:hover{color:var(--accent)}
.hero{padding-top:90px;padding-bottom:85px;min-height:710px;isolation:isolate;background-image:radial-gradient(circle at 80% 38%,#ff593f12,transparent 40%),radial-gradient(circle at 15% 80%,#79cfff0c,transparent 40%)}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.2;background-image:radial-gradient(#eee 0.6px,transparent .9px);background-size:7px 9px;mask-image:linear-gradient(110deg,black,transparent 75%);pointer-events:none}
.hero .eyebrow{color:var(--accent)}.dot{background:var(--orange);box-shadow:0 0 15px #ff593f77}
h1{font-size:clamp(82px,10.8vw,165px);font-style:italic;line-height:.94;letter-spacing:-2px;transform:rotate(-2deg);transform-origin:left center;margin:36px 0 40px;text-shadow:4px 5px 0 #090a0c}h1 span{color:var(--orange);text-shadow:3px 4px 0 #090a0c,5px 6px 0 var(--accent)}
.hero-bottom{gap:45px}.hero-bottom p{color:#b9bac2;max-width:320px}.button{background:var(--accent);color:var(--ink);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--orange);transform:rotate(-1deg);font-weight:700}.button:hover{background:#a0deff;box-shadow:3px 3px 0 var(--orange)}
.hero-mark{top:35px;right:5%;height:610px;width:310px;font-size:initial;transform:rotate(13deg);opacity:.85;z-index:-1}.hero-mark img{height:100%;width:100%;object-fit:contain;filter:drop-shadow(12px 12px 0 #ff593f)}
.hero-tag{position:absolute;right:5%;bottom:45px;font:24px 'Permanent Marker',cursive;color:var(--accent);transform:rotate(-9deg)}
.paint-strip{display:flex;justify-content:center;align-items:center;gap:36px;padding:14px 18px;background:var(--orange);color:var(--ink);font:700 22px 'Barlow Condensed',Impact,sans-serif;letter-spacing:2px;transform:skewY(-1.4deg);position:relative;z-index:2;overflow:hidden}.paint-strip span{white-space:nowrap}.paint-strip img{height:38px;width:22px;transform:rotate(12deg)}
.work{position:relative;padding-top:85px;background-color:#101115;background-image:linear-gradient(90deg,#ffffff03 1px,transparent 1px),linear-gradient(#ffffff03 1px,transparent 1px);background-size:110px 55px}.work:after{content:'';position:absolute;right:4%;top:85px;width:130px;height:240px;background:url('assets/question-mark.svg') center/contain no-repeat;opacity:.07;pointer-events:none}.section-top{position:relative;z-index:1}.section-top h2{font-style:italic;text-transform:uppercase}.section-top p{color:#b9bac2}
.empty{position:relative;border:1px dashed #79cfff55;background:#090a0c66;padding:50px 20px}.empty>span{display:inline-block;width:75px;height:145px;font-size:0;background:url('assets/question-mark.svg') center/contain no-repeat;transform:rotate(-9deg)}.empty h3{font-family:'Permanent Marker',cursive;font-weight:400;font-size:28px}.empty a{display:inline-block;border-bottom:2px solid var(--orange);padding-bottom:6px}
.project-image{border:1px solid #ffffff22;box-shadow:5px 5px 0 #ff593f;transform:rotate(-.7deg)}.project:nth-child(even) .project-image{transform:rotate(.7deg);box-shadow:5px 5px 0 var(--accent)}.project-meta{padding-top:5px}.project h3{text-transform:uppercase;font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px}.project-arrow{border-color:var(--accent);color:var(--accent)}
.contact{position:relative;isolation:isolate;overflow:hidden;background:var(--orange);color:var(--ink);padding-top:85px;padding-bottom:85px}.contact h2{position:relative;z-index:1;font-style:italic;font-weight:800}.contact em{font-family:'Permanent Marker',cursive;text-transform:none;font-size:.85em;color:var(--paper);text-shadow:3px 3px 0 var(--ink)}.contact .eyebrow,.contact .email,.contact p{position:relative;z-index:1}.contact-mark{position:absolute;right:4%;top:20px;height:110%;width:32%;transform:rotate(15deg);opacity:.38;z-index:-1}.email{font-weight:600;font-size:clamp(19px,3vw,34px)}
footer{background:#090a0c;color:var(--paper);gap:30px;padding-top:35px;padding-bottom:35px}footer .brand img{width:110px}footer a:not(.brand){color:var(--accent)}footer p,footer small{color:#b9bac2}
dialog{background:#101115;color:var(--paper);border:1px solid #79cfff55;box-shadow:8px 8px 0 #ff593f55}.gallery-header .eyebrow{color:var(--accent)}.close{color:var(--paper);border-color:#79cfff66}.viewer>button{background:var(--accent);color:var(--ink)}.viewer figcaption{color:#b9bac2}#thumbnails button[aria-current=true]{border-color:var(--accent)}
a:focus-visible,button:focus-visible{outline-color:var(--accent)}
.current-work{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 6%;background:#171b23;border-top:1px solid #79cfff55}.current-work .eyebrow{color:var(--accent);font-size:10px}.current-work p{font:26px 'Permanent Marker',cursive;margin:8px 0 0}.facebook-feature{display:flex;align-items:center;gap:18px;background:var(--accent);color:var(--ink);padding:18px 24px;font-size:14px;font-weight:700;box-shadow:5px 5px 0 var(--orange);transform:rotate(-1deg)}.facebook-feature:hover{background:#b0e4ff}.facebook-icon{font:bold 30px Arial,sans-serif}.facebook-feature>span:last-child{margin-left:12px}@media(max-width:700px){.current-work{align-items:flex-start;flex-direction:column;padding:26px 6%}.facebook-feature{font-size:12px;padding:15px 18px;gap:12px;max-width:100%}.current-work p{font-size:23px}}
.local-intro{padding:48px 6% 60px;border-top:1px solid #ffffff24;background:#101115}.local-intro .eyebrow{color:var(--accent)}.local-intro h2{text-transform:uppercase;font-style:italic;font-size:clamp(40px,5vw,64px);margin:18px 0 22px}.local-intro p{max-width:780px;color:#c4c5cb;font-size:15px;line-height:1.9}.local-intro a{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
@media(min-width:1500px){.hero{padding-left:10%;padding-right:10%}.hero-mark{right:12%}}
@media(max-width:900px){.hero-mark{right:-6%;opacity:.5;width:270px}.hero-tag{font-size:20px}.hero-bottom{gap:24px}.paint-strip{gap:20px;font-size:18px}.paint-strip span:last-child{display:none}}
@media(max-width:700px){.brand{gap:8px}.brand img{width:105px}.brand-art{font-size:8px;max-width:45px}nav{font-size:9px;gap:12px;letter-spacing:.3px}.hero{min-height:590px;padding-top:60px;padding-bottom:80px}h1{font-size:clamp(66px,14.8vw,104px);letter-spacing:-1px;margin-top:35px;line-height:1.05}.hero-mark{height:400px;width:210px;top:65px;right:-55px;opacity:.35}.hero-tag{bottom:25px;right:8%;font-size:18px}.hero-bottom p{font-size:13px}.button{font-size:12px;padding:18px 20px;gap:20px}.hero .eyebrow{font-size:9px;letter-spacing:1.4px}.paint-strip{font-size:15px;gap:14px;padding:10px}.paint-strip img{height:28px;width:16px}.work{padding-top:55px}.empty h3{font-size:23px}.contact{padding-top:55px;padding-bottom:55px}.contact h2{font-size:clamp(48px,12vw,78px)}.contact-mark{width:50%;right:-10%;opacity:.25}.email span{margin-left:8px}footer{gap:18px}}
