@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root{--bg:#080b10;--panel:#0d1219;--panel2:#111823;--text:#f3eee4;--muted:#9da6b2;--gold:#d9b16f;--orange:#ff5a1f;--blue:#18aef5;--line:#26303b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:42px 42px}
.ambient{position:fixed;width:38vw;height:38vw;filter:blur(110px);opacity:.07;border-radius:50%;pointer-events:none}.ambient-orange{background:var(--orange);left:-20vw;top:15vh}.ambient-blue{background:var(--blue);right:-20vw;top:35vh}
.site-header{height:76px;padding:0 clamp(24px,5vw,80px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1c232c;background:rgba(8,11,16,.82);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-family:Cinzel,serif;font-size:.85rem;letter-spacing:.08em}.brand b{color:var(--gold)}.brand-mark{width:35px;height:35px;border:1px solid var(--gold);display:grid;place-items:center;transform:rotate(45deg);font-family:Cinzel,serif;font-weight:800}.brand-mark::first-line{transform:rotate(-45deg)}
nav{display:flex;gap:32px}nav a,footer a{color:var(--muted);text-decoration:none;font-size:.82rem;text-transform:uppercase;letter-spacing:.13em}nav a:hover,footer a:hover{color:var(--text)}.menu{display:none;background:none;border:0;color:white;font-size:1.5rem}
.hero{min-height:calc(100vh - 76px);display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;max-width:1500px;margin:auto;padding:60px clamp(24px,5vw,80px)}
.hero-copy{position:relative;z-index:3}.eyebrow{color:var(--gold);font-size:.72rem;font-weight:700;letter-spacing:.24em;margin:0 0 18px}.hero h1{font-family:Cinzel,serif;font-size:clamp(4rem,7vw,8rem);line-height:.82;margin:0;letter-spacing:-.055em}.hero h1 span{color:transparent;-webkit-text-stroke:1px var(--gold)}
.lede{max-width:560px;color:#c0c7d0;line-height:1.75;font-size:1.05rem;margin:32px 0}.actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-block;padding:14px 19px;text-decoration:none;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;border:1px solid var(--line)}.primary{color:#090b0f;background:linear-gradient(110deg,#f1d19b,var(--gold))}.ghost{color:var(--text);background:#10151c}.button:hover{transform:translateY(-1px)}
.hero-art{position:relative;min-height:650px;display:grid;place-items:center}.hero-art img{width:min(850px,62vw);max-width:100%;position:relative;z-index:2;filter:drop-shadow(0 35px 50px #000)}.sigil{position:absolute;width:68%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(217,177,111,.24);box-shadow:0 0 90px rgba(255,90,31,.08),0 0 120px rgba(24,174,245,.06)}.sigil:before,.sigil:after{content:"";position:absolute;inset:7%;border:1px solid rgba(217,177,111,.1);border-radius:50%}.sigil:after{inset:50% -20%;height:1px;border:0;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.manifesto{border-block:1px solid var(--line);padding:22px 5vw;display:flex;justify-content:center;align-items:center;gap:24px;background:#0a0e13;color:#aeb6c0;font-family:Cinzel,serif;font-size:.72rem;letter-spacing:.14em}.manifesto i{width:5px;height:5px;background:var(--gold);transform:rotate(45deg)}
.section{max-width:1320px;margin:auto;padding:120px clamp(24px,5vw,80px)}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}.section h2{font-family:Cinzel,serif;font-size:clamp(2.4rem,4vw,4.8rem);line-height:1;margin:0}.section-heading>p{max-width:470px;color:var(--muted);line-height:1.7}
.projects{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.project{position:relative;min-height:360px;padding:32px;border:1px solid var(--line);background:linear-gradient(145deg,#111822,#0b1016);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.project:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,90,31,.05),transparent 40%,rgba(24,174,245,.05));opacity:0;transition:.25s}.project:hover:before{opacity:1}.project.featured{grid-column:span 2;min-height:410px;background:radial-gradient(circle at 90% 30%,rgba(255,90,31,.12),transparent 30%),radial-gradient(circle at 100% 90%,rgba(24,174,245,.08),transparent 30%),#10161e}.project-number{font-family:Cinzel,serif;color:#46515e;font-size:.8rem}.project-body{max-width:760px;position:relative;z-index:2}.status{display:inline-block;border:1px solid #394451;padding:5px 8px;font-size:.58rem;letter-spacing:.15em;color:#aeb7c2;margin-bottom:18px}.status.live{border-color:#8b673b;color:#e3bc7b}.status.dev{border-color:#23516a;color:#55c2f5}.project-type{color:#697482;font-size:.64rem;letter-spacing:.16em}.project h3{font-family:Cinzel,serif;font-size:clamp(2rem,3vw,3.5rem);margin:8px 0 12px}.project p{color:#aeb7c2;line-height:1.7}.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.tags span{font-size:.65rem;padding:6px 9px;background:#171e27;color:#8f9aa6}.project-glyph{position:absolute;right:35px;bottom:15px;font-family:Cinzel,serif;font-size:8rem;color:#fff;opacity:.025}.future{border-style:dashed}
.about{display:grid;grid-template-columns:.55fr 1fr;gap:80px;align-items:center;border-top:1px solid var(--line)}.about-mark{font-family:Cinzel,serif;font-weight:800;font-size:clamp(7rem,15vw,14rem);color:transparent;-webkit-text-stroke:1px #2c3743;position:relative}.about-mark:after{content:"";position:absolute;width:90px;height:3px;background:linear-gradient(90deg,var(--orange),var(--blue));left:8px;bottom:5px}.about p:not(.eyebrow){color:#aeb7c2;line-height:1.8;max-width:680px}
.contact{text-align:center;border:1px solid var(--line);background:radial-gradient(circle at 50% 0,rgba(217,177,111,.08),transparent 45%);margin-bottom:90px}.contact p{color:var(--muted);max-width:620px;margin:20px auto 30px;line-height:1.7}.contact small{display:block;color:#56616d;margin-top:12px}
footer{border-top:1px solid var(--line);min-height:140px;padding:35px clamp(24px,5vw,80px);display:flex;align-items:center;justify-content:space-between;gap:30px;color:#65707d;font-size:.72rem}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:90px}.hero-art{min-height:auto;margin-top:35px}.hero-art img{width:100%}.projects{grid-template-columns:1fr}.project.featured{grid-column:auto}.section-heading{display:block}.section-heading>p{margin-top:20px}.about{grid-template-columns:1fr;gap:25px}.manifesto{overflow:auto;justify-content:flex-start;white-space:nowrap}.menu{display:block}nav{display:none;position:absolute;top:76px;left:0;right:0;background:#0b1016;padding:25px;flex-direction:column;border-bottom:1px solid var(--line)}nav.open{display:flex}footer{flex-direction:column;align-items:flex-start}.hero h1{font-size:clamp(3.8rem,18vw,6rem)}}
/* Keep long studio names and navigation targets readable on small screens. */
section[id]{scroll-margin-top:96px}
.hero-copy,.hero-art,.project-body{min-width:0}
.project h3{overflow-wrap:anywhere}
.button{max-width:100%;overflow-wrap:anywhere}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
@media(max-width:600px){
  .hero h1{font-size:clamp(2.5rem,12.5vw,4.5rem);line-height:.95}
  .site-header .brand{font-size:.65rem;letter-spacing:.04em;gap:10px}
  .brand-mark{flex-shrink:0}
  .project{padding:24px}
  .contact .button{letter-spacing:.04em;font-size:.65rem;padding:14px 12px}
  .manifesto{white-space:normal;flex-direction:column;gap:10px;text-align:center}
  .manifesto p{margin:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
