
:root{--char:#2E2A21;--char2:#24211a;--olive:#435206;--gold:#DEC649;--apple:#ED5633;--honey:#FBEBBA;--white:#fff;--rule:rgba(251,235,186,.18);--disp:'Marcellus',Georgia,serif;--sub:'Inter Tight',Arial,sans-serif;--body:'Red Hat Display','Inter Tight',system-ui,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--char);color:var(--honey);font:300 17.5px/1.65 var(--body)}
body:after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:99;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img,video{max-width:100%;display:block}a{color:var(--gold);text-underline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:100;background:var(--gold);color:var(--char);padding:8px 12px}
h1,h2,h3{font-family:var(--disp);font-weight:400;color:var(--white);line-height:1.02;margin:.15em 0 .35em;letter-spacing:-.01em}
h1{font-size:clamp(2.6rem,9vw,6.2rem)}h2{font-size:clamp(2rem,5.6vw,3.9rem)}h3{font-size:1.6rem}
.k{font:800 .74rem/1.2 var(--sub);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 .6em}
.lead{font-size:1.2rem;max-width:36em}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(46,42,33,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:center;justify-content:space-between;max-width:1320px;margin:0 auto;padding:8px 20px}
.brandlink{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--honey);padding:4px}
.brandlink img{height:46px;width:auto}.brandlink span{font:800 .7rem var(--sub);letter-spacing:.22em}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:22px;align-items:center}
.nav a{color:var(--honey);text-decoration:none;font:700 .78rem var(--sub);letter-spacing:.14em;text-transform:uppercase}
.nav a:hover,.nav a[aria-current=page]{color:var(--gold)}
.btn{display:inline-block;background:var(--apple);color:#fff!important;padding:14px 24px;text-decoration:none;font:800 .82rem var(--sub);letter-spacing:.16em;text-transform:uppercase;border:0;cursor:pointer;transition:transform .15s}
.btn:hover{transform:translateY(-2px) rotate(-1deg)}.btn.ghost{background:transparent;outline:2px solid var(--gold);outline-offset:-2px;color:var(--gold)!important}
.nav .btn{padding:10px 16px}
#mt{display:none;background:none;border:1px solid var(--gold);color:var(--gold);font:800 .72rem var(--sub);letter-spacing:.16em;padding:10px 14px;text-transform:uppercase}
@media(max-width:1020px){#mt{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--char);border-bottom:1px solid var(--rule);padding:22px 20px}.nav.open{display:block}.nav ul{flex-direction:column;align-items:flex-start;gap:18px}.brandlink span{display:none}}
/* home hero v2: full uncropped photo, type on a solid band */
.hh{background:var(--char2);border-bottom:1px solid var(--rule)}
.hh .wrap{max-width:1440px;margin:0 auto;display:flex;flex-direction:column}
.hh figure{margin:0;position:relative;background:#000}
.hh figure img{display:block;width:100%;height:auto;aspect-ratio:1293/1724}
.hh figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 14px 10px;font:700 .6rem/1.3 var(--sub);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.8);background:linear-gradient(180deg,transparent,rgba(0,0,0,.65))}
.hh .txt{padding:26px 20px 30px;display:flex;flex-direction:column;justify-content:center}
.hh .logo{display:none}
.hh h1{font-size:clamp(2.5rem,11vw,3.4rem);line-height:1.02;margin:.15em 0 .3em}
.hh .lead{font-size:1.05rem;color:var(--honey);margin:0}
.hh .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hh .rule{width:56px;height:4px;background:var(--apple);margin:0 0 16px}
@media(max-width:719px){.hh figure img{aspect-ratio:1293/1450;max-height:calc(100svh - 63px - 250px);min-height:300px;object-fit:cover;object-position:50% 55%}.hh .txt{padding:20px 20px 26px}.hh .k{font-size:.66rem}.hh .lead{font-size:.98rem}.hh .ctas{margin-top:18px}.hh .ctas .btn{padding:13px 18px}.hh .rule{display:none}}
@media(min-width:720px){
 .hh .wrap{flex-direction:row-reverse;align-items:center}
 .hh figure{flex:0 0 auto;width:min(50vw,calc((100svh - 63px)*.75));border-left:1px solid var(--rule)}
 .hh figure img{max-height:calc(100svh - 63px);object-fit:cover;object-position:50% 45%}
 .hh .txt{flex:1;padding:48px clamp(28px,5vw,80px)}
 .hh .logo{display:none}
 .hh h1{font-size:clamp(2.8rem,5.2vw,5rem)}
 .hh .k{white-space:nowrap}
 .hh .lead{font-size:1.2rem;max-width:30em}
 .hh .ctas{margin-top:32px}}
@media(min-width:1024px){.hh .logo{display:block;width:clamp(72px,6.5vw,104px);margin-bottom:22px}}
@media(min-width:720px) and (max-width:1023px){.hh h1{font-size:clamp(2.4rem,5.4vw,3.2rem)}.hh .lead{font-size:1.05rem}}
/* hero */
.hero{position:relative;min-height:calc(100svh - 63px);display:grid;align-items:end;overflow:hidden;background:#000}
.hero>img,.hero>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 35%,rgba(36,33,26,.92))}
.hero .in{position:relative;z-index:2;max-width:1320px;width:100%;margin:0 auto;padding:40px 20px 54px}
.hero .credit{position:absolute;z-index:3;right:16px;top:14px;font:700 .62rem var(--sub);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75);writing-mode:vertical-rl}
.hero.short{min-height:62svh}
.hero .logo{width:min(128px,30vw);margin-bottom:18px}
/* rail sections */
.sec{border-top:1px solid var(--rule)}
.rail{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:1fr}
.rail>.side{display:none}
@media(min-width:900px){.rail{grid-template-columns:120px 1fr}.rail>.side{display:flex;flex-direction:column;align-items:center;gap:18px;border-right:1px solid var(--rule);padding:40px 0}.side b{font:800 .8rem var(--sub);color:var(--gold)}.side i{writing-mode:vertical-rl;transform:rotate(180deg);font:800 .62rem var(--sub);letter-spacing:.3em;font-style:normal;opacity:.7}}
.body{padding:64px 20px;position:relative;min-width:0}.split>*{min-width:0}
@media(min-width:900px){.body{padding:96px 56px}}
.num{position:absolute;right:20px;bottom:10px;font:400 clamp(3rem,9vw,7rem) var(--disp);opacity:.14;color:var(--white);pointer-events:none}
.olive{background:var(--olive)}.honey{background:var(--honey);color:var(--char)}.honey h2,.honey h3,.honey h1{color:var(--char)}.honey .k{color:var(--olive)}.honey a{color:var(--olive)}.honey .num{color:var(--char)}
.gold{background:var(--gold);color:var(--char)}.gold h2{color:var(--char)}.gold .k{color:var(--char)}
.dark{background:var(--char2)}
.split{display:grid;gap:40px;align-items:center}@media(min-width:900px){.split{grid-template-columns:1.05fr .95fr}.split.rev>:first-child{order:2}}
figure{margin:0;position:relative}figure img{width:100%;height:100%;object-fit:cover}
figcaption{font:700 .62rem var(--sub);letter-spacing:.14em;text-transform:uppercase;opacity:.7;margin-top:8px}
.tall img{aspect-ratio:4/5}.wide img{aspect-ratio:3/2}.sq img{aspect-ratio:1}
/* skate stay party */
.ssp{display:grid;grid-template-columns:1fr}@media(min-width:720px){.ssp{grid-template-columns:repeat(3,1fr)}}
.ssp a{position:relative;display:block;aspect-ratio:16/10;border-bottom:1px solid var(--rule);overflow:hidden;color:#fff;text-decoration:none;border-right:1px solid var(--rule)}
.ssp img{width:100%;height:100%;object-fit:cover;object-position:var(--op,50% 50%);transition:transform .6s}@media(min-width:720px){.ssp a{aspect-ratio:4/5;border-bottom:0}.ssp img{object-position:var(--opd,50% 50%)}}.ssp a:hover img{transform:scale(1.05)}
.ssp a:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.8))}
.ssp div{position:absolute;z-index:2;left:24px;bottom:22px;right:24px}.ssp h3{font-size:clamp(2.4rem,5vw,3.6rem);margin:0}.ssp p{margin:0;font-size:1rem}
/* marquee */
.marq{overflow:hidden;background:var(--apple);color:#fff;border-block:2px solid var(--char);white-space:nowrap}
.marq div{display:inline-block;padding:12px 0;font:900 1rem var(--sub);letter-spacing:.24em;animation:mq 28s linear infinite}
@keyframes mq{to{transform:translateX(-50%)}}
/* spec sheet */
.spec{display:grid;grid-template-columns:1fr;border-top:1px solid currentColor}
@media(min-width:700px){.spec{grid-template-columns:1fr 1fr;column-gap:40px}}
.spec div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(46,42,33,.25);padding:12px 0}
.spec b{font:800 .78rem var(--sub);letter-spacing:.12em;text-transform:uppercase}.spec span{text-align:right}
.dark .spec div,.sec:not(.honey):not(.gold) .spec div{border-color:var(--rule)}
/* galleries */
.gal{display:grid;gap:6px;grid-template-columns:repeat(2,1fr)}@media(min-width:800px){.gal{grid-template-columns:repeat(4,1fr)}}
.gal img{aspect-ratio:1;object-fit:cover;width:100%}.gal .big{grid-column:span 2;grid-row:span 2}.gal .big img{aspect-ratio:auto;height:100%}
.strip{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}.strip figure{flex:0 0 min(78vw,420px);scroll-snap-align:start}.strip img{aspect-ratio:3/4}
.crew{display:grid;gap:1px;background:var(--rule);grid-template-columns:repeat(2,1fr)}@media(min-width:800px){.crew{grid-template-columns:repeat(4,1fr)}}
.crew div{background:var(--char);padding:26px 20px}.crew h3{font-size:1.5rem;margin:0}
.cards{display:grid;gap:1px;background:var(--rule);grid-template-columns:1fr}@media(min-width:800px){.cards{grid-template-columns:repeat(3,1fr)}}
.cards>div{background:inherit;padding:28px}.olive .cards>div{background:var(--olive)}.dark .cards>div{background:var(--char2)}
.cards .n{font:400 3rem var(--disp);color:var(--gold);line-height:1}
.steps{counter-reset:s;list-style:none;padding:0;display:grid;gap:16px}.steps li{counter-increment:s;display:flex;gap:16px;align-items:baseline}.steps li:before{content:"0" counter(s);font:400 2.2rem var(--disp);color:var(--apple)}
.eyes{height:84px;background:url(/img/mural-wall2-sm.webp) center 38%/cover;filter:contrast(1.1);border-block:1px solid var(--rule)}
.todo{display:inline-block;background:repeating-linear-gradient(45deg,#ED5633 0 10px,#c9441f 10px 20px);color:#fff;font:800 .72rem/1.4 var(--sub);letter-spacing:.06em;padding:6px 10px;margin:6px 0}
/* forms */
form label{display:block;margin:18px 0 6px;font:800 .74rem var(--sub);letter-spacing:.14em;text-transform:uppercase}
form input,form select,form textarea{width:100%;padding:13px 14px;border:1px solid rgba(46,42,33,.35);background:#fff;border-radius:0;font:400 16px var(--body);color:var(--char)}
form input:focus,form select:focus,form textarea:focus{outline:3px solid var(--apple);outline-offset:0}
.row2{display:grid;gap:0 18px}@media(min-width:640px){.row2{grid-template-columns:1fr 1fr}}
details{border-bottom:1px solid var(--rule);padding:16px 0}summary{cursor:pointer;font:800 .9rem var(--sub);letter-spacing:.08em;text-transform:uppercase;color:var(--white)}details p{margin:.6em 0 0}
/* footer */
footer{background:#000;color:var(--honey);padding:64px 20px 40px}
footer .in{max-width:1320px;margin:0 auto;display:grid;gap:36px}@media(min-width:900px){footer .in{grid-template-columns:auto 1fr auto;align-items:end}}
footer .flogo{padding:12px}footer .flogo img{width:150px}
footer ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,auto);gap:8px 28px;justify-content:start}
footer a{color:var(--honey);text-decoration:none;font:700 .76rem var(--sub);letter-spacing:.14em;text-transform:uppercase}footer a:hover{color:var(--gold)}
footer small{display:block;margin-top:30px;opacity:.6;font-size:.8rem;max-width:1320px;margin-inline:auto}
/* motion */
.rv{opacity:0;clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.7,0,.2,1),opacity .2s}
.rv.in{opacity:1;clip-path:inset(0 0 0 0)}
.brandlink:hover img{animation:flip .5s ease}
@keyframes flip{40%{transform:rotate(-8deg) translateY(-3px)}80%{transform:rotate(4deg)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;clip-path:none}}
