
:root{
  --night:#0D0B12;
  --ink:#1E1A24;
  --copper:#B87433;
  --moss:#6A7D5A;
  --bone:#E8E3D9;
  --moon:#C2B7FF;
  --violet:#6C4BAE;
  --gold:#C8A85A;
}
*{box-sizing:border-box}
body{margin:0;background:var(--night);color:var(--bone);font-family:Inter,system-ui,Arial,sans-serif;line-height:1.6}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;line-height:1.2;margin:0 0 .5rem}
h1{font-size:2.4rem}
h2{font-size:1.8rem;margin-top:2rem}
h3{font-size:1.3rem}
a{color:var(--moon);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 1rem}
.site-header{position:sticky;top:0;background:rgba(13,11,18,.9);backdrop-filter:blur(8px);z-index:10;border-bottom:1px solid #221c2c}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0}
.brand{display:flex;gap:.75rem;align-items:center;color:var(--bone);text-decoration:none}
.brand .logo{width:44px;height:44px;border-radius:12px;object-fit:cover;border:1px solid #2a2530}
.brand-text{display:flex;flex-direction:column}
.brand-top{font-weight:700;letter-spacing:.3px}
.brand-sub{font-size:.9rem;color:#c9c3b7}
.menu{display:flex;gap:1rem;align-items:center}
.menu a{color:var(--bone);opacity:.9}
.pill{background:var(--copper);padding:.4rem .8rem;border-radius:999px;color:#0b090f!important}
.nav-toggle{display:none}
@media(max-width:820px){
  .menu{display:none;flex-direction:column;position:absolute;top:60px;right:1rem;background:var(--ink);padding:1rem;border:1px solid #2a2530;border-radius:12px}
  .nav-toggle{display:block;background:none;color:var(--bone);border:1px solid #3a3242;border-radius:8px;padding:.3rem .6rem}
}

.hero{background:radial-gradient(1200px 600px at 20% -10%, rgba(108,75,174,.35), transparent), radial-gradient(800px 400px at 80% 10%, rgba(200,168,90,.2), transparent)}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;padding:3rem 0}
.hero-text h1 .accent{color:var(--moon)}
.hero-image img{width:100%;border-radius:18px;border:1px solid #2a2530;box-shadow:0 20px 80px rgba(0,0,0,.5)}
.cta-row{display:flex;gap:1rem;margin-top:1rem}
.btn{background:var(--copper);color:#0b090f;padding:.7rem 1rem;border-radius:12px;border:none;font-weight:700}
.btn.ghost{background:transparent;border:1px solid var(--copper);color:var(--bone)}
.btn:hover{filter:brightness(1.05)}

.features{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2rem 0}
.card{background:rgba(255,255,255,.03);border:1px solid #2a2530;border-radius:16px;padding:1rem}
.card img{width:100%;height:170px;object-fit:cover;border-radius:10px;margin-bottom:.6rem}
.card .more{display:inline-block;margin-top:.25rem}
@media(max-width:980px){.features{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.hero-inner{grid-template-columns:1fr}.features{grid-template-columns:1fr}}

.newsletter{padding:2rem 0;border-top:1px solid #221c2c;background:linear-gradient(180deg, rgba(27,22,34,.6), transparent)}
.netlify-form{display:flex;gap:.6rem;justify-content:flex-start;max-width:520px}
.netlify-form input{flex:1;padding:.7rem;border-radius:10px;border:1px solid #3a3242;background:#130f18;color:var(--bone)}
.netlify-form button{white-space:nowrap}

.site-footer{margin-top:3rem;border-top:1px solid #221c2c;padding:1.5rem 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem}
.copyright{text-align:center;color:#bdb6aa80;padding-top:1rem;font-size:.9rem;border-top:1px solid #221c2c;margin-top:1rem}
@media(max-width:820px){.footer-grid{grid-template-columns:1fr}}

.longform .lead{opacity:.9}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1rem 0}
.grid img{width:100%;height:260px;object-fit:cover;border-radius:12px;border:1px solid #2a2530}
@media(max-width:980px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.grid{grid-template-columns:1fr}.grid img{height:auto}}

.gallery{columns:3 260px;column-gap:1rem}
.gallery a{display:block;break-inside:avoid;margin-bottom:1rem}
.gallery img{width:100%;border-radius:12px;border:1px solid #2a2530}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:none;align-items:center;justify-content:center;padding:1rem}
.lightbox img{max-width:95vw;max-height:90vh;border-radius:12px;border:1px solid #555}
.lightbox.show{display:flex}

.stack label{display:block;margin:.6rem 0}
.stack input, .stack textarea, .stack select{width:100%;padding:.7rem;border-radius:10px;border:1px solid #3a3242;background:#130f18;color:var(--bone)}

.qr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.qr-grid img{width:100%;border-radius:12px;border:1px solid #2a2530;background:#fff}
.qr-grid.big img{background:#fff}
.qr-grid figure{margin:0;text-align:center}
.qr-grid figcaption{margin-top:.5rem;color:#ccc}

.tips h1{text-align:center}


/* Half black/white logo treatment */
.hero-image.split{
  position:relative;
  border-radius:18px;
  overflow:hidden;
}
.hero-image.split img{
  position:relative;
  width:100%;
  height:auto;
  display:block;
  background:linear-gradient(90deg, #0D0B12 50%, #E8E3D9 50%);
  mix-blend-mode:normal;
  padding:1.2rem;
  border-radius:18px;
  border:1px solid #2a2530;
}
