:root{--ink:#0b0b0c;--panel:#141416;--soft:#1d1d20;--paper:#f5f3ed;--muted:#aaa8a1;--lime:#c7ff38;--orange:#ff5c35;--purple:#8c62ff;--blue:#35b8ff;--line:#303034}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font-family:"DM Sans",sans-serif;font-size:16px;line-height:1.55}
.site-header{height:156px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,5vw,76px);border-bottom:1px solid var(--line);position:relative;z-index:5}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-size:.78rem;line-height:1.05;letter-spacing:.08em;text-transform:uppercase}
.brand b{color:var(--lime)}
.brand-mark{display:grid;place-items:center;width:45px;height:45px;background:var(--lime);color:var(--ink);font-family:Anton,sans-serif;font-size:1.15rem;transform:rotate(-4deg)}
nav{display:flex;align-items:center;gap:32px}
nav a{color:var(--paper);text-decoration:none;font-size:.9rem;font-weight:600}
nav a:hover{color:var(--lime)}
.nav-cta{border:1px solid var(--lime);padding:10px 16px}
.hero{min-height:calc(100vh - 88px);padding:clamp(72px,10vw,150px) clamp(22px,7vw,110px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);align-items:center;gap:6vw;overflow:hidden}
.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-weight:700;font-size:.76rem;color:var(--lime);margin:0 0 18px}
.hero h1,.section-heading h2,.order-intro h2{font-family:Anton,sans-serif;text-transform:uppercase;line-height:.93;font-weight:400;margin:0}
.hero h1{font-size:clamp(3.8rem,8.2vw,8rem);letter-spacing:-.02em}
.hero h1 em{font-style:normal;color:var(--lime)}
.intro{max-width:660px;color:#cac8c1;font-size:clamp(1.05rem,1.7vw,1.35rem);margin:28px 0 34px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:1px solid transparent;font:700 .9rem "DM Sans",sans-serif;text-decoration:none;cursor:pointer}
.primary{background:var(--lime);color:var(--ink)}
.primary:hover{background:#dcff7c}
.ghost{border-color:#56565c;color:var(--paper)}
.ghost:hover{border-color:var(--paper)}
.hero-art{position:relative;min-height:410px;display:grid;place-items:center}
.ring{position:absolute;border:1px solid #3e3e42;border-radius:50%}
.ring-one{width:390px;height:390px}
.ring-two{width:290px;height:290px;border-color:var(--lime);opacity:.45}
.maker-stamp{width:225px;height:225px;border-radius:50%;background:var(--orange);display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(8deg);box-shadow:18px 18px 0 var(--purple)}
.maker-stamp strong{font-family:Anton,sans-serif;font-size:3rem;line-height:1}
.maker-stamp span{letter-spacing:.16em;font-size:.68rem}
.maker-stamp b{margin-top:18px;border-top:1px solid #2a0c06;padding-top:8px}
.work,.process,.order-section{padding:clamp(80px,10vw,140px) clamp(22px,7vw,110px)}
.work{background:var(--paper);color:var(--ink)}
.section-heading{display:grid;grid-template-columns:1fr 1.6fr;gap:20px;align-items:end;margin-bottom:52px}
.section-heading .eyebrow{grid-column:1/-1;color:#587900;margin:0}
.section-heading h2,.order-intro h2{font-size:clamp(3rem,6vw,6rem)}
.section-heading>p:last-child{max-width:590px;color:#55545a;margin:0;font-size:1.08rem}
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.work-card{min-height:310px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s ease}
.work-card:hover{transform:translateY(-5px)}
.work-card span{font-weight:700}
.work-card p{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;margin:0}
.work-card h3{font-family:Anton,sans-serif;text-transform:uppercase;font-size:clamp(2rem,4vw,4rem);font-weight:400;line-height:1;margin:5px 0 0}
.orange{background:var(--orange)}
.purple{background:var(--purple)}
.green{background:var(--lime)}
.blue{background:var(--blue)}
.photo-note{font-size:.78rem;color:#777;margin:16px 0 0}
.process{background:var(--panel)}
.section-heading.compact{display:block}
.section-heading.compact .eyebrow{color:var(--lime);margin-bottom:16px}
.process ol{list-style:none;margin:50px 0 0;padding:0;border-top:1px solid var(--line)}
.process li{display:grid;grid-template-columns:100px 1fr;gap:20px;padding:34px 0;border-bottom:1px solid var(--line);max-width:940px}
.process li>b{font-family:Anton,sans-serif;color:var(--lime);font-size:2.5rem;font-weight:400}
.process h3{font-size:1.45rem;margin:0 0 6px}
.process li p{margin:0;color:var(--muted);max-width:650px}
.order-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(50px,8vw,130px);background:#0e0e10}
.order-intro{position:sticky;top:40px;align-self:start}
.order-intro>p:not(.eyebrow){color:var(--muted);font-size:1.08rem}
.trust-note{margin-top:40px;padding:20px;border-left:3px solid var(--lime);display:flex;flex-direction:column}
.trust-note span{color:var(--muted);margin-top:4px}
form{background:var(--panel);border:1px solid var(--line);padding:clamp(22px,4vw,44px)}
label{display:block;font-size:.88rem;font-weight:700;margin-bottom:20px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
input,select,textarea{width:100%;margin-top:8px;background:#0c0c0e;border:1px solid #434348;color:var(--paper);font:inherit;padding:14px;border-radius:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--lime);outline-offset:1px}
input::file-selector-button{background:var(--soft);color:var(--paper);border:0;padding:8px;margin-right:12px}
small{display:block;color:var(--muted);margin-top:5px;font-weight:400}
.submit{width:100%;border:0}
.form-status{min-height:24px;color:var(--lime);font-size:.9rem;margin:14px 0 0}
footer{border-top:1px solid var(--line);padding:42px clamp(22px,5vw,76px);display:grid;grid-template-columns:1fr 1.5fr auto;gap:30px;color:var(--muted);font-size:.82rem}
footer b{color:var(--paper);text-transform:uppercase}
footer p{margin:4px 0}
footer>p{max-width:540px}
@media(max-width:820px){nav>a:not(.nav-cta){display:none}
.hero{grid-template-columns:1fr;min-height:auto;padding-top:80px}
.hero-art{min-height:310px}
.ring-one{width:300px;height:300px}
.ring-two{width:230px;height:230px}
.maker-stamp{width:180px;height:180px}
.maker-stamp strong{font-size:2.4rem}
.section-heading,.order-section{grid-template-columns:1fr}
.gallery-grid{grid-template-columns:1fr}
.work-card{min-height:230px}
.order-intro{position:static}
.field-row{grid-template-columns:1fr}
.process li{grid-template-columns:65px 1fr}
footer{grid-template-columns:1fr}
}
@media(max-width:480px){.site-header{height:116px}
.brand-mark{width:40px;height:40px}
.nav-cta{padding:9px 11px}
.hero h1{font-size:3.35rem}
.hero-art{min-height:270px}
.ring-one{width:260px;height:260px}
.ring-two{width:205px;height:205px}
.maker-stamp{width:155px;height:155px;box-shadow:11px 11px 0 var(--purple)}
.maker-stamp strong{font-size:2rem}
.work,.process,.order-section{padding-left:18px;padding-right:18px}
}

.brand{gap:0}
.brand-logo{display:block;width:180px;height:140px;object-fit:contain;filter:invert(1)}
.attachment-note{display:flex;flex-direction:column;gap:3px;margin:4px 0 22px;padding:15px 17px;border:1px dashed #55555b;color:var(--paper);font-size:.9rem}
.attachment-note span{color:var(--muted)}
@media(max-width:480px){.brand-logo{width:138px;height:104px}}

.portfolio-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.portfolio-item{grid-column:span 4;position:relative;min-height:470px;margin:0;overflow:hidden;background:#171719}
.portfolio-item.wide{grid-column:span 8}
.portfolio-item.landscape{grid-column:span 6;min-height:390px}
.portfolio-item.short{min-height:330px}
.portfolio-item img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease}
.portfolio-item:hover img{transform:scale(1.025)}
.portfolio-item figcaption{position:absolute;inset:auto 0 0;padding:50px 22px 20px;display:flex;flex-direction:column;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.88))}
.portfolio-item figcaption b{font-size:1rem;text-transform:uppercase;letter-spacing:.08em}
.portfolio-item figcaption span{font-size:.82rem;color:#d6d3ca;margin-top:2px}
@media(max-width:900px){.portfolio-item,.portfolio-item.wide{grid-column:span 6}.portfolio-item.landscape{grid-column:span 12}}
@media(max-width:600px){.portfolio-grid{grid-template-columns:1fr}.portfolio-item,.portfolio-item.wide,.portfolio-item.landscape{grid-column:1;min-height:420px}.portfolio-item.landscape,.portfolio-item.short{min-height:300px}}

.hero{grid-template-columns:minmax(0,1fr);min-height:auto;padding-top:clamp(82px,10vw,130px);padding-bottom:clamp(82px,10vw,130px)}
.hero-copy{max-width:1050px}

.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.category-tile{position:relative;display:block;min-height:470px;overflow:hidden;background:#171719;color:#fff;text-decoration:none}
.category-tile img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .45s ease}
.category-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 30%,rgba(0,0,0,.9) 100%)}
.category-tile:hover img{transform:scale(1.025)}
.category-number{position:absolute;z-index:1;top:26px;left:28px;display:block;color:var(--lime);font-weight:700;letter-spacing:.18em;font-size:.75rem;text-transform:uppercase}
.category-copy{position:absolute;z-index:1;inset:auto 0 0;padding:32px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:5px 20px}
.category-copy small{grid-column:1/-1;color:var(--lime);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase}
.category-copy strong{font:400 clamp(2.3rem,4vw,4.2rem)/.95 Anton,sans-serif;text-transform:uppercase}
.category-copy b{font-size:2rem;line-height:1}
.category-tile h3{margin:7px 0 6px;font:400 clamp(2.3rem,5vw,4.8rem)/.95 Anton,sans-serif;text-transform:uppercase}
.category-tile-copy>span:last-child{font-weight:700}
.more-categories{color:#666;margin:18px 0 0}
.examples-hero{padding:clamp(70px,9vw,125px) clamp(22px,7vw,110px) clamp(46px,6vw,80px);max-width:1100px}
.back-link{display:inline-block;margin-bottom:52px;color:var(--paper);text-decoration:none;font-weight:700}
.back-link:hover{color:var(--lime)}
.examples-hero h1{margin:0;font:400 clamp(3.8rem,8vw,7.7rem)/.92 Anton,sans-serif;text-transform:uppercase}
.examples-hero h1 em{color:var(--lime);font-style:normal}
.examples-hero>p:last-child{max-width:680px;margin:28px 0 0;color:var(--muted);font-size:1.15rem}
.examples-grid{padding:0 clamp(22px,7vw,110px) clamp(80px,10vw,140px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.example-card{grid-column:span 4;position:relative;min-height:460px;margin:0;overflow:hidden;background:var(--panel)}
.example-card.wide{grid-column:span 8}
.example-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .4s ease}
.example-card:hover img{transform:scale(1.025)}
.example-card figcaption{position:absolute;inset:auto 0 0;padding:54px 20px 18px;background:linear-gradient(transparent,rgba(0,0,0,.9));color:#fff;font-weight:700}
.examples-cta{padding:clamp(70px,9vw,120px) clamp(22px,7vw,110px);text-align:center;background:var(--panel)}
.examples-cta h2{margin:0 0 30px;font:400 clamp(2.5rem,5vw,5rem)/1 Anton,sans-serif;text-transform:uppercase}
@media(max-width:900px){.example-card,.example-card.wide{grid-column:span 6}}
@media(max-width:700px){.category-grid{grid-template-columns:1fr}.category-tile{min-height:390px}.category-copy{padding:24px}.examples-grid{grid-template-columns:1fr;padding-left:18px;padding-right:18px}.example-card,.example-card.wide{grid-column:1;min-height:400px}.examples-hero{padding-left:18px;padding-right:18px}.back-link{margin-bottom:36px}}
