/* ---------- Theme ---------- */
:root{
  --container: 1280px;  /* max content width for desktop (~1600px viewport) */
  --bg: #0b1220;            /* dark background */
  --bg-alt: #0e1628;        /* slight variation */
  --text: #e5eaf3;          /* light text */
  --muted:#9fb0cc;          /* muted */
  --accent:#4cc9f0;         /* accent */
  --accent-2:#4895ef;       /* accent darker */
  --card: #101a2e;          /* cards */
  --border: rgba(159,176,204,.2);
}
*{box-sizing:border-box}
html,body{height:100%;}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Noto Sans',sans-serif;}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:rgba(11,18,32,.6);backdrop-filter:saturate(140%) blur(6px);border-bottom:1px solid var(--border)}
.brand-wrap{display:flex;align-items:center;gap:10px}
.brand-logo{width:40px;height:auto;display:block}
.brand{font-weight:700;letter-spacing:.2px}
.site-nav{display:flex;gap:14px}
.site-nav a{color:var(--text);opacity:.9;text-decoration:none;padding:6px 10px;border-radius:6px}
.site-nav a:hover{background:rgba(76,201,240,.15);opacity:1}

/* ---------- Scroll snap container ---------- */
main{height:100vh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-padding-top:32px; /* keeps titles visible under header */}
.section{min-height:100vh;display:flex;align-items:center;scroll-snap-align:start;padding:48px 20px 40px}
.section--dark{background:linear-gradient(180deg, rgba(255,255,255,.02), transparent)}
.section--alt{background:linear-gradient(180deg, rgba(72,149,239,.06), rgba(76,201,240,.04))}
.section--light{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02))}

/* ---------- Content layout ---------- */
.content{max-width:var(--container);margin-left:calc((100vw - var(--container))/4);margin-right:calc((100vw - var(--container))*3/4)}
.content h1,.content h2{margin:0 0 12px 0}
.content p{color:var(--muted)}

/* Reduce left whitespace on large screens; re-center on smaller screens */
@media (max-width: 1024px){.content{margin-left:auto;margin-right:auto;padding:0 16px}}

.image-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.image-row img{width:100%;height:auto;display:block}
@media (max-width: 820px){.image-row{grid-template-columns:1fr}}

.album-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:16px}
.album-grid a{display:block}
.album-grid img{width:100%;height:auto;border-radius:8px;border:1px solid var(--border)}
@media (max-width: 1200px){.album-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width: 900px){.album-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width: 640px){.album-grid{grid-template-columns:repeat(2,1fr)}}

.contact-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;margin-top:10px}
@media (max-width: 900px){.contact-layout{grid-template-columns:1fr}}
.contact-list{list-style:none;padding:0;margin:0}
.contact-list li{padding:6px 0;border-bottom:1px dashed var(--border)}

.contact-form{display:grid;gap:10px;background:var(--card);padding:16px;border-radius:10px;border:1px solid var(--border)}
.contact-form label{display:grid;gap:6px}
.contact-form input,.contact-form textarea{padding:10px;border-radius:8px;border:1px solid var(--border);background:#0b1529;color:var(--text)}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--accent)}
.button{display:inline-block;background:var(--accent);color:#031229;padding:10px 14px;border-radius:8px;font-weight:700;border:0;cursor:pointer}
.button:hover{background:var(--accent-2)}
.form-note{font-size:.875rem;color:var(--muted)}

/* ---------- Lightbox ---------- */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;flex-direction:column;padding:20px}
.lightbox.open{display:flex}
.lightbox img{max-width:95vw;max-height:75vh;margin-bottom:10px;border-radius:8px}
.lightbox-close{position:absolute;top:14px;right:16px;font-size:28px;line-height:1;background:transparent;border:0;color:#fff;cursor:pointer}
.lightbox-arrows{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;pointer-events:none}
.lightbox-arrows .prev,.lightbox-arrows .next{pointer-events:auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:22px;cursor:pointer}
#lightbox-caption{color:#cbd5e1;margin:0}

/* ---------- Footer ---------- */
.site-footer{position:relative;z-index:1;padding:24px 20px;border-top:1px solid var(--border);color:var(--muted);text-align:center}