/* ---------- Base ---------- */
:root{
  --bg:#0e0a12;
  --panel:#1a151f;
  --ink:#efe7f3;
  --muted:#b8a9c2;
  --pop1:#f10587;
  --pop2:#b256ff;
  --radius:20px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --gap:clamp(16px, 2vw, 28px);
  --pad:clamp(16px, 2.2vw, 32px);
  --card-pad:clamp(18px, 2.2vw, 34px);
  --max:1200px;
}

*{box-sizing:border-box}
html,body{
  margin:0;padding:0;
  background:radial-gradient(1200px 600px at 50% -200px, #2a0f2d 0, var(--bg) 40%, var(--bg) 100%);
  color:var(--ink);
  font-family:Archivo,system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  line-height:1.45
}
img{max-width:100%;display:block;border:0}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px var(--pad);
  background:rgba(14,10,18,.7);backdrop-filter:saturate(160%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.06)
}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:800;letter-spacing:.2px}
.brand-logo{width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.nav a{color:var(--ink);opacity:.9;text-decoration:none;margin-left:18px}
#nav-toggle{display:none}.hamburger{display:none}

/* ---------- Layout ---------- */
.container{max-width:var(--max);margin:auto;padding:0 var(--pad)}
.section{padding:clamp(52px, 7.2vw, 100px) 0}
.section-alt{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00))}
.two-col{display:grid;gap:var(--gap)}
@media (min-width: 960px){ .two-col{grid-template-columns: 1.1fr .9fr;align-items:start} }
.two-col-divas{row-gap:var(--gap)}
.no-stretch{align-self:start}
.section > .container > * { min-width:0; }

/* ---------- Type ---------- */
.section h2{font-family:Prata,serif;font-weight:400;font-size:clamp(26px,3vw,44px);margin:0 0 16px}
.lead{max-width:900px;color:var(--muted);font-size:clamp(16px,1.4vw,18px);margin:0 0 22px}
.ticks{list-style:none;padding:0;margin:18px 0 0}
.ticks li{margin:8px 0 0;position:relative;padding-left:22px}
.ticks li::before{content:"✦";position:absolute;left:0;top:0;color:var(--pop1)}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden}
.hero-inner{max-width:var(--max);margin:auto;padding:clamp(40px,6vw,80px) var(--pad) clamp(32px,5vw,56px)}
.hero-inner--center{text-align:center}
.hero .spark{font-family:Prata,serif;font-weight:400;font-size:clamp(28px, 4vw, 54px);margin:12px 0}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.cta-row--center{justify-content:center}

/* --- HERO LOGO: remove any visible line, add breathing room --- */
.hero-logo-wrap{
  margin-top:clamp(18px, 3.2vw, 38px);
  margin-bottom:clamp(54px, 6.5vw, 88px); /* ≈ 3/4" on desktop */
  display:flex;justify-content:center;
  border:none !important; outline:none !important; box-shadow:none !important; background:transparent !important;
  overflow:hidden; /* hide any baked-in edge pixels */
}
.hero-logo{
  width:100%;height:auto;object-fit:contain;
  border:0 !important; outline:0 !important; box-shadow:none !important; background:transparent !important;
}
/* Crop 1–8px from the PNG edges to nuke a baked-in hairline without touching the artwork */
#divasLogo{
  -webkit-clip-path: inset(clamp(1px, .5vw, 8px) round clamp(10px, 2vw, 28px));
          clip-path: inset(clamp(1px, .5vw, 8px) round clamp(10px, 2vw, 28px));
}

.hero-logo--divas{max-width:clamp(640px, 62vw, 1100px)}
@media (min-width: 1280px){ .hero-logo--divas{max-width:clamp(760px, 62vw, 1100px)} }

.bg-glow{position:absolute;inset:-20% -10% auto -10%;height:70%;background:radial-gradient(60% 60% at 50% 20%, rgba(241,5,135,.25), transparent 70%);pointer-events:none}

/* ---------- Buttons ---------- */
.btn{border:0;border-radius:999px;padding:12px 18px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--shadow)}
.btn-primary{background:linear-gradient(90deg, var(--pop1), var(--pop2));color:white}
.btn-ghost{background:#231829;color:var(--ink);box-shadow:inset 0 0 0 2px rgba(255,255,255,.08)}
.btn-outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px rgba(255,255,255,.18)}

/* ---------- Cards ---------- */
.cards{display:grid;gap:var(--gap)}
@media (min-width: 960px){ .cards{grid-template-columns: 1.2fr .8fr} }
.cards-2{grid-template-columns:1fr}
@media (min-width:960px){ .cards-2{grid-template-columns:1fr 1fr} }

.card{
  background:var(--panel);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.06);
}
.card .card-body{padding:var(--card-pad)}
@media (min-width:1100px){ .card .card-body{padding:36px} }
.card h3{margin:0 0 10px;font-size:clamp(20px,1.8vw,28px);font-family:Prata,serif;font-weight:400}
.card p{margin:0 0 16px;color:var(--muted)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.btn-row--tight{gap:10px}
.card-empty{display:flex;align-items:center;justify-content:center;min-height:100%}
.card-empty .center{text-align:center}
.compact{ max-width:560px; width:100%; justify-self:end }

/* Media frames used in info cards */
.media-frame{
  width:100%;
  aspect-ratio: 16 / 9;
  background:#0b0910;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.poster{
  width:100%;height:100%;
  object-fit:contain;
  object-position:center;
  padding:12px;
}

/* ---------- Forms ---------- */
.form.card{padding-top:22px;padding-bottom:22px}
.form label{display:block;margin-bottom:12px}
.form label span{display:block;margin:0 0 6px;font-weight:600}
.form input,.form textarea{
  width:100%;background:#231829;border:1px solid rgba(255,255,255,.08);
  color:var(--ink);padding:12px;border-radius:12px
}
.form .btn{margin-top:6px}

/* ---------- Gallery (Gen Con photos) ---------- */
.gallery{display:grid;gap:var(--gap)}
@media (min-width:700px){ .gallery{grid-template-columns:1fr 1fr} }
@media (min-width:1100px){ .gallery{grid-template-columns:1fr 1fr 1fr} }
.gallery .tile{
  border-radius:var(--radius);
  overflow:hidden;
  background:#0b0910;
  border:1px solid rgba(255,255,255,.06)
}
/* FULL images — no cropping, no fixed aspect ratio */
.gallery .tile img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
}

/* ---------- Glass ---------- */
.glass{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08)}

/* ---------- Footer ---------- */
.site-footer{padding:36px 0 56px;border-top:1px solid rgba(255,255,255,.06);margin-top:30px}
.footer-grid{display:grid;gap:10px;align-items:center}
@media (min-width: 800px){
  .footer-grid{grid-template-columns: 1fr auto 1fr}
  .footer-nav{justify-self:center}
}
.footer-nav a{color:var(--ink);opacity:.8;text-decoration:none;margin:0 10px}

/* Pink-outlined link (white text + subtle pink stroke) — only used where we add the class */
.link-pink-outline{
  color:#fff !important;
  -webkit-text-fill-color:#fff;                  /* Chrome/Safari */
  -webkit-text-stroke:0.8px rgba(241,5,135,.60); /* light pink outline */
  text-shadow:                                    /* Firefox fallback */
    0 0 0.6px rgba(241,5,135,.55),
    0 0 1.2px rgba(241,5,135,.35);
  text-decoration:none;                           /* no underline */
}
.link-pink-outline:hover,
.link-pink-outline:focus-visible{
  -webkit-text-stroke:1px rgba(241,5,135,.85);
  text-shadow:
    0 0 0.8px rgba(241,5,135,.8),
    0 0 1.6px rgba(241,5,135,.5);
}