*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Helvetica Neue',Arial,sans-serif;background:#0f0e0d;color:#d4d0c8;line-height:1.6;}
a{color:inherit;text-decoration:none;}

nav{background:#0f0e0d;padding:0 48px;height:64px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;border-bottom:1px solid #1e1c1a;}
.logo{font-size:16px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:#e8e4de;}
.logo em{color:#e84040;font-style:normal;}
.nav-links{display:flex;gap:36px;}
.nav-links a{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#5a5650;}
.nav-links a:hover{color:#d4d0c8;}
.nav-cta{border:1px solid #e84040;color:#e84040!important;padding:9px 22px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;}
.nav-cta:hover{background:#e84040;color:#0f0e0d!important;}

.hero{min-height:90vh;display:flex;align-items:flex-end;padding:80px 48px;position:relative;overflow:hidden;background:#0f0e0d;}
.hero::before{content:'';position:absolute;top:-10%;right:10%;width:40%;height:80%;background:radial-gradient(ellipse,rgba(232,64,64,.07) 0%,transparent 70%);}
.hero::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#e84040,transparent);}
.hero-inner{position:relative;z-index:1;max-width:800px;}
.hero-tag{font-size:10px;letter-spacing:5px;text-transform:uppercase;color:#e84040;margin-bottom:28px;}
.hero h1{font-size:72px;font-weight:900;line-height:1;letter-spacing:-3px;margin-bottom:28px;color:#e8e4de;}
.hero h1 span{color:#3a3832;}
.hero-sub{font-size:18px;color:#6e6a62;line-height:1.7;margin-bottom:44px;max-width:480px;}
.hero-btns{display:flex;gap:16px;flex-wrap:wrap;}
.btn-primary{display:inline-block;background:#e84040;color:#0f0e0d;padding:14px 36px;font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;}
.btn-primary:hover{background:#d03030;}
.btn-ghost{display:inline-block;border:1px solid #2e2c28;color:#5a5650;padding:14px 36px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;}
.btn-ghost:hover{border-color:#5a5650;color:#d4d0c8;}

.stats{background:#0a0908;border-top:1px solid #1e1c1a;border-bottom:1px solid #1e1c1a;padding:40px 48px;display:flex;justify-content:space-around;flex-wrap:wrap;gap:32px;}
.stat-num{font-size:48px;font-weight:900;color:#e8e4de;letter-spacing:-2px;line-height:1;}
.stat-num span{color:#e84040;}
.stat-label{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:#4a4640;margin-top:8px;}

.work{padding:100px 48px;max-width:1200px;margin:0 auto;}
.work-hdr{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:60px;flex-wrap:wrap;gap:20px;}
.section-tag{font-size:10px;letter-spacing:4px;text-transform:uppercase;color:#e84040;margin-bottom:12px;}
.section-title{font-size:44px;font-weight:900;letter-spacing:-2px;color:#e8e4de;}
.section-title span{color:#3a3832;}
.work-link{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#5a5650;border-bottom:1px solid #2e2c28;padding-bottom:2px;}
.work-link:hover{color:#d4d0c8;border-color:#5a5650;}
.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;}
.work-card{background:#0a0908;aspect-ratio:16/10;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;position:relative;overflow:hidden;cursor:pointer;}
.work-card:first-child{grid-row:span 2;aspect-ratio:auto;}
.work-card-bg{position:absolute;inset:0;transition:transform .4s;}
.work-card:hover .work-card-bg{transform:scale(1.04);}
.wc-1 .work-card-bg{background:linear-gradient(160deg,#1a1510 0%,#0a0908 100%);}
.wc-2 .work-card-bg{background:linear-gradient(160deg,#1a1218 0%,#0a0908 100%);}
.wc-3 .work-card-bg{background:linear-gradient(160deg,#1a1a10 0%,#0a0908 100%);}
.work-card-inner{position:relative;z-index:1;}
.work-cat{font-size:9px;letter-spacing:3px;text-transform:uppercase;color:#e84040;margin-bottom:8px;}
.work-name{font-size:20px;font-weight:800;letter-spacing:-0.5px;color:#e8e4de;}

.services{background:#080706;padding:100px 48px;}
.services-inner{max-width:1100px;margin:0 auto;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid #1a1816;margin-top:60px;}
.service-box{padding:40px 32px;border:1px solid #1a1816;}
.service-num{font-size:11px;letter-spacing:2px;color:#3a3632;margin-bottom:24px;}
.service-name{font-size:22px;font-weight:800;letter-spacing:-0.5px;color:#e8e4de;margin-bottom:14px;}
.service-desc{font-size:13px;color:#5a5650;line-height:1.7;}

footer{padding:60px 48px;border-top:1px solid #1a1816;}
.footer-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;}
.footer-logo{font-size:14px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:#e8e4de;}
.footer-logo em{color:#e84040;font-style:normal;}
.footer-links{display:flex;gap:28px;}
.footer-links a{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#3a3632;}
.footer-links a:hover{color:#8a8680;}
.footer-copy{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#2a2826;}

@media(max-width:768px){
  nav,.hero,.stats,.work,.services{padding-left:24px;padding-right:24px;}
  .hero h1{font-size:44px;}
  .work-grid{grid-template-columns:1fr;}
  .work-card:first-child{grid-row:auto;aspect-ratio:16/10;}
  .services-grid{grid-template-columns:1fr;}
  footer{padding:32px 24px;}
  .footer-inner{flex-direction:column;}
}
