:root{ --bg:#0b1020; --text:#e5e7eb; --muted:#94a3b8; --border:#243247; --brand:#38bdf8 }
*{box-sizing:border-box}
html,body{height:100%}
html, body { overflow-x: hidden; scroll-behavior: smooth; }
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial;background:var(--bg);color:var(--text)}
a{color:var(--brand);text-decoration:none}
header{position:sticky;top:0;z-index:10;background:rgba(10,15,32,.7);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.nav{max-width:1100px;margin:0 auto;padding:12px 16px;display:flex;gap:16px;align-items:center;justify-content:space-between}
.nav a{color:var(--muted);font-weight:700}
.nav a:hover{color:var(--text)}
main{display:block}
.page{padding:18px 0 32px; scroll-margin-top: 70px;}
.page h1{font-size:clamp(28px,5vw,44px);line-height:1.1;margin:8px 16px}
.page p.lead{color:var(--muted);margin:0 16px 14px;max-width:70ch}


/* Contact text size */
#contact .lead{ font-size:1.15rem; line-height:1.4 }
@media (min-width:600px){ #contact .lead{ font-size:1.5rem } }
@media (min-width:1024px){ #contact .lead{ font-size:1.9rem } }



.section{max-width:880px;margin:22px auto;padding:0 16px}
.section h2{margin:0 0 6px}
.section p{color:var(--muted);margin:0 0 10px}

/* Full-bleed rows with no left gap */
.fullbleed{
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  max-width: 100vw;
  background:#0a0f20;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.fullbleed img, .fullbleed svg{
  display:block;
  width:100%;
  height:auto;
}

footer{border-top:1px solid var(--border);color:var(--muted);text-align:center;padding:22px 16px}



/* --- Bigger gaps between full-bleed images and centered text blocks --- */

/* more space ABOVE text after a full-bleed image */
.fullbleed + h1,
.fullbleed + p.lead,
.fullbleed + .section{
  margin-top: clamp(56px, 10vw, 220px);
}

/* space BEFORE a full-bleed image when it follows text */
h1 + .fullbleed,
p.lead + .fullbleed,
.section + .fullbleed{
  margin-top: clamp(28px, 6vw, 96px);
}

/* give the centered text sections more breathing room overall */
.section{
  margin: clamp(36px, 6vw, 120px) auto;
}

/* slightly larger bottom margin for lead paragraphs */
.page p.lead{
  margin: 0 16px clamp(22px, 3vw, 40px);
}