/* ========== IMAGE MAP (edit only these if you ever swap) ========== */
:root{
  /* 1 = HERO */
  --img-hero: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/e127c5b2-faca-4da9-85fb-6769a0a7abe0.png");

  /* 2 = SITE BACKGROUND */
  --img-bg: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-04_29_22-PM.png");

  /* 3 = AUX (subtle band) */
  --img-aux: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-07_14_41-PM.png");

  /* 4–7 = TEXTURES (apply via .tx-1 .. .tx-4) */
  --tx-1: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-07_38_37-PM.png");
  --tx-2: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-09_12_02-PM.png");
  --tx-3: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-09_12_57-PM.png");
  --tx-4: url("https://mediumaquamarine-fly-950993.hostingersite.com/wp-content/uploads/2025/10/ChatGPT-Image-Oct-17-2025-09_20_52-PM.png");

  /* Color system */
  --bg:#0d0f10; --ink:#e7e7e7; --muted:#a6a6a6;
  --accent:#ffd84d; --ring:#2a2d2f; --card:#121415;
}

/* ========== BASE ========== */
*{box-sizing:border-box}
html,body{margin:0}
body{
  background: var(--bg);
  color: var(--ink);
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  line-height:1.5;

  /* Site-wide background (image #2) with subtle overlay */
  background-image:
    linear-gradient(rgba(0,0,0,.60), rgba(0,0,0,.60)),
    var(--img-bg);
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}
a{color:var(--accent);text-decoration:none}
h1,h2,h3{line-height:1.2;margin:0 0 .45rem}
.section{max-width:1100px;margin:0 auto;padding:64px 20px}

/* ========== NAV ========== */
.nav{
  position:fixed;inset:0 auto auto 0;right:0;height:64px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;z-index:50;
  background:rgba(10,12,13,.6);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--ring);
}
.nav a{color:var(--ink);margin-left:16px}
.brand{display:flex;align-items:center;gap:10px}
.logo{
  width:34px;height:34px;border-radius:8px;
  background-image: var(--img-hero);
  background-size: cover;background-position:center;
  border:1px solid var(--ring);
}
.brand-name{font-weight:700}

/* ========== HERO (image #1) ========== */
.hero{
  height:82vh;min-height:520px;margin-top:64px;
  position:relative;display:grid;place-items:center;border-bottom:1px solid var(--ring);
  background-image:
    linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.55)),
    var(--img-hero);
  background-size:cover;background-position:center;
}
.hero__scrim{display:none} /* reserved */
.hero__inner{text-align:center;padding:0 18px}
.hero h1{font-size:clamp(30px,5vw,56px)}
.sub{color:var(--muted);margin:.5rem 0 1.1rem}
.row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{padding:10px 16px;border-radius:12px;border:1px solid var(--ring)}
.btn.primary{background:var(--accent);color:#111;border:none;font-weight:700}
.btn.ghost{background:transparent;color:var(--ink)}

/* ========== BAND with AUX (image #3 blended) ========== */
.band-aux{
  position:relative;border-block:1px solid var(--ring);
  background:
    linear-gradient(rgba(13,15,16,.78), rgba(13,15,16,.78)),
    var(--img-aux);
  background-size:cover;background-position:center;
  border-left:1px solid transparent;border-right:1px solid transparent;
}

/* ========== CARDS + TEXTURE UTILS (images #4–#7) ========== */
.cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:14px;margin-top:18px
}
.card{
  border:1px solid var(--ring);border-radius:14px;padding:16px;
  background:linear-gradient(160deg,rgba(18,20,21,.95),rgba(12,14,15,.95));
}
.tx-1{ background-image: linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)), var(--tx-1); background-size:cover; background-position:center; }
.tx-2{ background-image: linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)), var(--tx-2); background-size:cover; background-position:center; }
.tx-3{ background-image: linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)), var(--tx-3); background-size:cover; background-position:center; }
.tx-4{ background-image: linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)), var(--tx-4); background-size:cover; background-position:center; }

/* ========== CONTACT / FOOTER ========== */
.contact{
  display:grid;gap:8px;background:linear-gradient(160deg,#141618,#101214);
  border:1px solid var(--ring);border-radius:14px;padding:16px
}
.fine{color:var(--muted);margin:0}
.footer{padding:24px 16px;text-align:center;color:var(--muted);border-top:1px solid var(--ring)}