:root{--bg:#0a0b0e;--fg:#ece8e1;--muted:#8a8f99;--accent:#f0a46b;--accent2:#7aa6c9}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:64px}
body{background:var(--bg);color:var(--fg);font:300 16px/1.7 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}a{color:inherit;text-decoration:none}
h1,h2,.logo{font-family:Syne,sans-serif;letter-spacing:.02em}
.eyebrow{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}
.nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;transition:.3s}
.nav.solid{background:rgba(10,11,14,.82);backdrop-filter:blur(12px);border-bottom:1px solid #ffffff10}
.logo{font-weight:700;letter-spacing:.35em;font-size:.9rem}
.nav nav{position:fixed;inset:0;background:rgba(10,11,14,.97);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;font-size:1.4rem;opacity:0;pointer-events:none;transition:.3s}
.nav.open nav{opacity:1;pointer-events:auto}
.nav nav a{letter-spacing:.15em;text-transform:uppercase}.nav nav a:hover{color:var(--accent)}
.burger{z-index:2;background:none;border:0;width:32px;height:24px;display:flex;flex-direction:column;justify-content:center;gap:7px;cursor:pointer}
.burger span{height:1.5px;background:var(--fg);transition:.3s}.open .burger span:first-child{transform:translateY(4px) rotate(45deg)}.open .burger span:last-child{transform:translateY(-4px) rotate(-45deg)}
.hero{position:relative;height:100svh;min-height:520px;display:flex;align-items:flex-end;padding:0 1.25rem 18vh;overflow:hidden;
background:linear-gradient(180deg,#0a0b0e66,#0a0b0e00 30%,#0a0b0ecc 85%,var(--bg)),url(img/kotor-sunset.jpg) center/cover}
.bokeh{position:absolute;inset:0;pointer-events:none;background:
radial-gradient(circle at 15% 30%,#f0a46b33 0 40px,transparent 60px),radial-gradient(circle at 80% 20%,#7aa6c933 0 70px,transparent 100px),
radial-gradient(circle at 70% 70%,#f0a46b22 0 30px,transparent 50px),radial-gradient(circle at 35% 80%,#ffffff14 0 50px,transparent 80px);filter:blur(6px);animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(-30px,20px) scale(1.08)}}
.hero-text{position:relative;animation:rise 1.2s ease both}@keyframes rise{from{opacity:0;transform:translateY(30px)}}
.hero h1{font-size:clamp(3.2rem,14vw,9rem);line-height:.9;font-weight:700;text-transform:uppercase;margin:.6rem 0 .8rem;text-shadow:0 10px 40px #0008}
.tag{color:#d6d0c6;margin-bottom:1.8rem}
.btn{display:inline-block;padding:.85rem 1.8rem;border:1px solid var(--fg);background:none;color:var(--fg);font:500 .75rem Inter,sans-serif;letter-spacing:.25em;text-transform:uppercase;cursor:pointer;transition:.3s}
.btn:hover{background:var(--fg);color:var(--bg)}
.scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);color:var(--muted);animation:bob 2s infinite}@keyframes bob{50%{transform:translate(-50%,8px)}}
.section{padding:5rem 1.25rem;max-width:1400px;margin:auto}.head{margin-bottom:2.5rem}
h2{font-size:clamp(2rem,6vw,3.6rem);line-height:1.05;font-weight:500;margin-top:.5rem}
.grid{display:grid;grid-template-columns:1fr;gap:.75rem}
.grid figure{overflow:hidden;cursor:zoom-in;aspect-ratio:3/2;background:#15171c}
.grid img{width:100%;height:100%;object-fit:cover;transition:transform .8s,filter .5s;filter:saturate(.9) brightness(.92)}
.grid figure:hover img{transform:scale(1.05);filter:none}
.about{display:grid;gap:2.5rem;align-items:center}.about p:not(.eyebrow){color:#c9c4bb;margin-top:1.2rem;max-width:52ch}
.about-img{aspect-ratio:4/5;overflow:hidden}.about-img img{width:100%;height:100%;object-fit:cover}
.muted{color:var(--muted);margin-top:.8rem}
form{display:grid;gap:1.2rem;max-width:640px}
label{display:grid;gap:.4rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
input,textarea{background:transparent;border:0;border-bottom:1px solid #ffffff30;color:var(--fg);font:300 1rem Inter,sans-serif;padding:.7rem 0;outline:none;transition:.3s}
input:focus,textarea:focus{border-color:var(--accent)}form .btn{justify-self:start;margin-top:.5rem}
.insta{display:inline-block;margin-top:2.5rem;color:var(--accent);letter-spacing:.1em}
footer{text-align:center;padding:2.5rem;color:var(--muted);font-size:.75rem;letter-spacing:.2em;border-top:1px solid #ffffff10}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(5,5,7,.95);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:.3s}
.lightbox.on{opacity:1;pointer-events:auto}.lightbox img{max-width:92vw;max-height:86vh;object-fit:contain}
.lightbox button{position:absolute;background:none;border:0;color:var(--fg);font-size:2.5rem;cursor:pointer;padding:1rem}
.lb-close{top:.5rem;right:.5rem}.lb-prev{left:0}.lb-next{right:0}
.reveal{opacity:0;transform:translateY(30px);transition:1s}.reveal.in{opacity:1;transform:none}
@media(min-width:700px){.grid{grid-template-columns:repeat(2,1fr)}.grid .wide{grid-column:span 2;aspect-ratio:21/9}}
@media(min-width:960px){.nav{padding:1.4rem 3rem}.burger{display:none}
.nav nav{position:static;flex-direction:row;background:none;opacity:1;pointer-events:auto;font-size:.75rem;gap:2.5rem}
.hero{padding:0 3rem 16vh}.section{padding:8rem 3rem}
.grid{grid-template-columns:repeat(3,1fr);gap:1rem}.grid .tall{grid-row:span 2;aspect-ratio:auto}.grid .wide,.grid .wide2{grid-column:span 2;aspect-ratio:auto}
.about{grid-template-columns:1fr 1.2fr;gap:5rem}}
