/* ============================================================
   Speed Date Tampa -- HOMEPAGE v2 (/index_2), 2026-09-15. Loaded AFTER sdt-home.css on the v2 page only
   (body class "sdt-home sdt-home2"). Owner feedback on v1: copy too cute, the card over the hero photo
   hides the photo, online nights read like a hidden footnote, "why it works" text too long for its photo,
   and the crowd section had eleven boxes. This file only adds/overrides what v2 needs; v1 is untouched.
   ============================================================ */

/* ---------- HERO: photo stands alone (no card over it), a small caption chip only ---------- */
.sdt-home2 .sdt-hero__media { aspect-ratio: 4 / 3.6; }
.sdt-home2 .sdt-hero__veil { background: linear-gradient(180deg, rgba(161,10,77,.03) 0%, rgba(161,10,77,.06) 60%, rgba(58,18,38,.35) 100%); }
.sdt-hero__cap { position: absolute; left: 18px; bottom: 18px; z-index: 2; display: inline-flex; align-items: center; gap: .5rem;
    background: rgba(255,255,255,.94); border: 1px solid var(--sdt-line); border-radius: 100px; padding: .5rem .95rem;
    font-size: .84rem; font-weight: 600; color: var(--sdt-ink); text-decoration: none; max-width: calc(100% - 36px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
a.sdt-hero__cap:hover { color: var(--sdt-wine); }
.sdt-hero__cap i, .sdt-hero__cap svg { width: 15px; height: 15px; color: var(--sdt-wine); flex: none; }

/* ---------- ONLINE NIGHTS: a real section, photo left, copy right ---------- */
.sdt-online { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.sdt-online__media { position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--sdt-surface); box-shadow: var(--sdt-shadow); }
.sdt-online__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sdt-online__badge { position: absolute; left: 1.1rem; top: 1.1rem; z-index: 2; display: inline-flex; align-items: center; gap: .5rem;
    background: var(--sdt-wine); color: #fff; border-radius: 100px; padding: .5rem .9rem; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sdt-online__badge i, .sdt-online__badge svg { width: 14px; height: 14px; }
.sdt-online .sdt-head { margin-bottom: 0; }
.sdt-online__list { list-style: none; margin: 1.4rem 0 1.8rem; padding: 0; display: grid; gap: .7rem; }
.sdt-online__list li { display: flex; align-items: flex-start; gap: .7rem; color: var(--sdt-dim); font-size: 1rem; }
.sdt-online__list i, .sdt-online__list svg { width: 18px; height: 18px; color: var(--sdt-wine); flex: none; margin-top: .2rem; }
.sdt-online__list strong { color: var(--sdt-ink); font-weight: 700; }

/* ---------- WHY IT WORKS: shorter copy, taller photo, three facts ---------- */
.sdt-home2 .sdt-split__media { aspect-ratio: 4 / 4.6; }
.sdt-home2 .sdt-facts li { padding: .9rem 0; }
.sdt-home2 .sdt-facts span { font-size: .95rem; }

/* ---------- FIND YOUR CROWD: pills instead of eleven cards ---------- */
.sdt-pills { display: flex; flex-wrap: wrap; gap: .6rem; }
.sdt-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .62rem 1.1rem; border-radius: 999px; text-decoration: none;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.28); color: #fff; font-size: .95rem; font-weight: 600;
    transition: background .18s, border-color .18s, transform .18s; backdrop-filter: blur(6px); }
.sdt-pill:hover { background: #fff; color: var(--sdt-wine); border-color: #fff; transform: translateY(-2px); }
.sdt-pill--strong { background: #fff; color: var(--sdt-wine); border-color: #fff; }
.sdt-pill--strong:hover { background: #ffd0e0; border-color: #ffd0e0; }
.sdt-pill i, .sdt-pill svg { width: 15px; height: 15px; }
.sdt-home2 .sdt-crowd__label { margin: 1.8rem 0 .8rem; }
.sdt-home .sdt-crowd__foot { margin-top: 1.8rem; color: rgba(255,243,246,.7); font-size: .95rem; }   /* .sdt-home p zeroes margins, so the selector must outweigh it */
.sdt-crowd__foot a { color: #ffd0e0; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- WHERE WE MEET: same links, lighter treatment (directory rows, not shadowed boxes) ---------- */
.sdt-home2 .sdt-area { box-shadow: none; background: var(--sdt-card); padding: 1.1rem 2.2rem 1.1rem 1.2rem; border-radius: 14px; }
.sdt-home2 .sdt-area strong { font-size: 1.05rem; }
.sdt-home2 .sdt-area span { font-size: .85rem; }
.sdt-home2 .sdt-areas { gap: .75rem; }

@media (max-width: 1020px) {
    .sdt-online { grid-template-columns: 1fr; }
    .sdt-online__media { max-width: 720px; }
}
@media (max-width: 720px) {
    .sdt-home2 .sdt-hero__media { aspect-ratio: 4 / 3; }
    .sdt-home2 .sdt-hero__img { position: absolute; height: 100%; }
    .sdt-home2 .sdt-hero__veil { display: block; }
    .sdt-online__media { aspect-ratio: 16 / 11; }
}