:root{
  --bg:#08090b;--panel:#101216;--panel2:#15171c;--text:#f5f5f2;--muted:#92959d;
  --line:#24272e;--accent:#d9ff48;--max:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
.site-header{position:fixed;top:0;left:0;right:0;height:78px;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(8,9,11,.78);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}
.logo{font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:-.06em;font-size:1.25rem}.logo span:first-child{color:#fff}.logo .dot{color:var(--accent)}
.nav{display:flex;align-items:center;gap:2rem;font-size:.85rem;color:#bfc1c6}.nav a{transition:.2s}.nav a:hover{color:#fff}.nav-cta{border:1px solid var(--line);padding:.65rem 1rem;border-radius:99px;color:#fff!important}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:1.5rem}
.hero{min-height:92vh;max-width:var(--max);margin:auto;padding:150px 5vw 80px;display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:6vw}
.eyebrow{color:var(--accent);font-size:.72rem;font-weight:700;letter-spacing:.18em;margin-bottom:1.2rem}
h1,h2{font-family:"Space Grotesk",sans-serif;line-height:.94;letter-spacing:-.06em}
h1{font-size:clamp(4rem,8vw,7.8rem)}h1 span,h2 span{color:var(--accent)}
.hero-text{max-width:560px;color:var(--muted);font-size:1.05rem;margin:2rem 0}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap}.button{padding:.9rem 1.2rem;border-radius:99px;font-weight:700;font-size:.88rem}.primary{background:var(--accent);color:#08090b}.ghost{border:1px solid var(--line)}
.hero-visual{position:relative}.hero-card{aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#1b1e25,#0d0e11);border:1px solid var(--line);box-shadow:0 30px 80px rgba(0,0,0,.35)}.hero-card img{width:100%;height:100%;object-fit:cover}.placeholder{display:grid!important;place-items:center;background:radial-gradient(circle at 50% 35%,#30343c,#0c0d10 65%)}.placeholder-label{color:#676b75;font-size:.7rem;letter-spacing:.16em}.floating-tag{position:absolute;bottom:28px;left:-35px;background:var(--accent);color:#0a0b0c;padding:14px 17px;font-size:.62rem;letter-spacing:.12em;line-height:1.35;transform:rotate(-4deg);box-shadow:0 15px 35px rgba(0,0,0,.4)}.floating-tag strong{font-size:.85rem}
.intro-strip{border-block:1px solid var(--line);display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;padding:22px 5vw;color:#8d9098;font-size:.78rem}.intro-strip span{color:var(--accent);font-weight:700}
.section{max-width:var(--max);margin:auto;padding:120px 5vw}.section-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:42px}h2{font-size:clamp(3rem,6vw,5.7rem)}.section-copy{max-width:360px;color:var(--muted);font-size:.92rem}
.filter-row{display:flex;gap:.5rem;margin-bottom:24px;flex-wrap:wrap}.filter{background:none;border:1px solid var(--line);color:#aaa;padding:.55rem .9rem;border-radius:99px;cursor:pointer}.filter.active,.filter:hover{background:var(--accent);color:#090a0b;border-color:var(--accent)}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project-card{min-width:0}.project-image{position:relative;aspect-ratio:1/1.08;background:#111319;border-radius:12px;overflow:hidden;border:1px solid var(--line)}.project-card.tall .project-image{aspect-ratio:1/1.35}.project-card.wide{grid-column:span 2}.project-card.wide .project-image{aspect-ratio:2/1.08}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.project-card:hover img{transform:scale(1.04)}.project-image>span{position:absolute;top:14px;left:14px;background:rgba(0,0,0,.6);padding:5px 8px;border-radius:5px;font-size:.65rem}.project-meta{display:flex;justify-content:space-between;gap:20px;padding:12px 2px 20px}.project-meta h3{font-size:.92rem}.project-meta p{font-size:.72rem;color:var(--muted)}
.video-section{border-top:1px solid var(--line)}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.video-card video{width:100%;display:block;aspect-ratio:16/10;object-fit:cover;background:#111;border-radius:12px;border:1px solid var(--line)}.video-card div{padding:14px 2px}.video-card span{font-size:.65rem;color:var(--accent);letter-spacing:.15em}.video-card h3{font-size:1rem;margin-top:4px}
.about{max-width:none;border-block:1px solid var(--line);display:grid;grid-template-columns:.5fr 1fr 1fr;gap:5vw;background:#0b0c0f}.about-number{font-family:"Space Grotesk";font-size:5rem;color:#262930}.about-copy{color:var(--muted);max-width:450px}.about-copy p+p{margin-top:1.2rem}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.contact-panel{padding-top:1rem}.contact-panel>p{color:var(--muted);max-width:400px}.contact-link{display:inline-flex;gap:1rem;margin:2rem 0;font-family:"Space Grotesk";font-size:clamp(1.3rem,3vw,2.4rem);border-bottom:1px solid var(--line);padding-bottom:8px}.contact-link span{color:var(--accent)}.socials{display:flex;gap:1.2rem;font-size:.8rem;color:#aaa}.socials a:hover{color:var(--accent)}
footer{border-top:1px solid var(--line);padding:30px 5vw;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#686b73;font-size:.72rem}footer a:hover{color:#fff}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:50;display:none;place-items:center;padding:5vw}.lightbox.open{display:grid}.lightbox img{max-width:95vw;max-height:90vh;object-fit:contain;border-radius:10px}.lightbox-close{position:absolute;right:30px;top:20px;background:none;border:0;color:#fff;font-size:2.5rem;cursor:pointer}
@media(max-width:850px){
 .nav{display:none;position:absolute;top:78px;left:0;right:0;background:#0b0c0f;padding:20px 5vw;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}
 .nav.open{display:flex}.menu-toggle{display:block}.hero{grid-template-columns:1fr;padding-top:125px}.hero-visual{max-width:520px;width:100%;margin:auto}
 .project-grid{grid-template-columns:1fr 1fr}.project-card.wide{grid-column:span 2}.video-grid,.contact,.about{grid-template-columns:1fr}.about-number{display:none}.section{padding-block:85px}
}
@media(max-width:520px){
 h1{font-size:3.7rem}.section-heading{display:block}.section-copy{margin-top:20px}.project-grid{grid-template-columns:1fr}.project-card.wide{grid-column:auto}.project-card.wide .project-image{aspect-ratio:1/1.08}.floating-tag{left:10px}.intro-strip{justify-content:flex-start;gap:.7rem}
 footer{flex-direction:column;align-items:flex-start}
}