/* Wine & Cream 2026-09-15: converted from the dark ember theme */
/* ============================================
   SPEED DATE TAMPA — SHARED STYLES
   Ported from legacy style-main.css
   Used across all pages via _Layout.cshtml

   Page-specific styles go in PageName.cshtml.css
   (auto-scoped by CSS Isolation)
   ============================================ */

/* ============================================
   CSS VARIABLES
   ============================================ */

/* Speed Date Tampa palette -- "Wine & Cream" (owner-approved direction D, 2026-09-15): a LIGHT site. Wine is the one
   action colour, plum ink the text, blush cream the ground. Variable NAMES are kept for reference stability (they date
   from the violet NY Minute base and the dark "Last Light" pass), so read the comments, not the names:
   --text-light is the PRIMARY TEXT (dark plum) and --background-dark is the PAGE GROUND (cream).
   Canonical tokens live in sdt.css (--sdt-*); these mirror them for the older page stylesheets. */
:root {
    --primary-purple: #a10a4d;   /* wine (primary action) */
    --deep-purple: #7d0839;      /* wine, pressed */
    --dark-purple: #ffffff;      /* text on wine fills */
    --accent-rose: #c0185a;      /* rose: the readable accent for small text on cream (was "soft coral on dark") */
    --accent-coral: #a10a4d;     /* wine */
    --accent-gold: #c0185a;      /* rose (was candle gold) */
    --text-light: #2b1520;       /* plum ink: primary text */
    --text-gray: #6e4a5a;        /* secondary text */
    --text-muted: #9a7b88;       /* captions */
    --background-dark: #fff6f8;  /* page ground: blush cream */
    --background-medium: #ffffff;/* cards */
    --background-light: #fdecf2; /* deeper blush band */
}

/* ============================================
   BASE STYLES
   ============================================ */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: var(--background-dark);
    color: var(--text-light);
    line-height: 1.6;
}

/* ============================================
   NAVIGATION
   ============================================ */

nav {
    position: fixed;
    top: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 0;
    box-shadow: 0 2px 20px rgba(74, 8, 38, 0.18);
}

.nav-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    font-size: 1.8rem;
    font-weight: bold;
    color: var(--text-light);
    text-decoration: none;
}

.logo span {
    color: var(--sdt-wine);
}

.nav-links {
    display: flex;
    gap: 2.5rem;
    list-style: none;
    align-items: center;
}

.nav-links a {
    color: var(--text-light);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.3s;
    letter-spacing: 0.5px;
}

.nav-links a:hover {
    color: var(--primary-purple);
}

.nav-links a.nav-active {
    border-bottom: 2px solid var(--sdt-wine);
    padding-bottom: 4px;
}

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 5px;
    z-index: 1001;
}

.hamburger span {
    width: 25px;
    height: 3px;
    background: var(--sdt-ink);
    transition: all 0.3s;
    border-radius: 3px;
}

.hamburger.active span:nth-child(1) {
    transform: rotate(45deg) translate(8px, 8px);
}

.hamburger.active span:nth-child(2) {
    opacity: 0;
}

.hamburger.active span:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -7px);
}

.mobile-menu {
    display: none;
    position: fixed;
    top: 80px;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    padding: 2rem;
    z-index: 999;
    box-shadow: 0 10px 30px rgba(74, 8, 38, 0.18);
}

.mobile-menu.active {
    display: block;
}

.mobile-menu ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.mobile-menu ul li a {
    color: var(--text-light);
    text-decoration: none;
    font-size: 1.1rem;
    font-weight: 500;
    display: block;
    padding: 0.5rem 0;
    transition: color 0.3s;
}

.mobile-menu ul li a:hover {
    color: var(--sdt-wine);
}

.mobile-menu a.nav-active {
    text-decoration: underline;
    text-decoration-color: var(--sdt-wine);
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

/* ============================================
   HERO SECTION (shared base — no background)
   Page-specific hero styles are in each page's scoped CSS.
   ============================================ */

/* ============================================
   BUTTONS
   ============================================ */

.btn-primary {
    background: linear-gradient(135deg, #a10a4d, #7d0839);
    padding: 1rem 2.5rem;
    border-radius: 30px;
    color: white;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    transition: transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 5px 20px rgba(161, 10, 77, 0.4);
    display: inline-block;
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(161, 10, 77, 0.6);
}

/* Keep button text readable regardless of :visited link state
   (fixes purple-on-purple after a link button's target has been visited) */
.btn-primary:link, .btn-primary:visited,
.cta-button:link, .cta-button:visited { color: #fff; }
.btn-secondary:link, .btn-secondary:visited { color: var(--sdt-wine); } /* Wine & Cream: the ghost button now sits on cream, so its text is wine (was white on the dark ground) */
.cta-section .btn-secondary:link, .cta-section .btn-secondary:visited { color: var(--sdt-wine); }

.btn-secondary {
    background: transparent;
    padding: 1rem 2.5rem;
    border: 2px solid var(--sdt-wine);
    border-radius: 30px;
    color: var(--sdt-wine);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1rem;
    transition: all 0.3s;
    white-space: nowrap;
    display: inline-block;
}

.btn-secondary:hover {
    background: var(--sdt-wine);
    color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(161, 10, 77, 0.4);
}

.cta-button {
    background: var(--sdt-wine-lo);
    padding: 0.7rem 1.8rem;
    border-radius: 25px;
    color: white;
    text-decoration: none;
    font-weight: 600;
    transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
    box-shadow: 0 4px 15px rgba(161, 10, 77, 0.3);
    white-space: nowrap;
}

.cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(161, 10, 77, 0.5);
    background: var(--sdt-wine-hi);
    color: white;
}

/* ============================================
   SECTION STYLES
   ============================================ */

section {
    padding: 3rem 2rem;
    max-width: 1400px;
    margin: 0 auto;
}

.section-header {
    text-align: center;
    margin-bottom: 2rem;
}

.section-header h2 {
    font-size: 2.8rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.section-header p {
    font-size: 1.2rem;
    color: var(--text-gray);
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.8;
}

/* ============================================
   EVENTS SECTION (shared for events pages)
   ============================================ */

.events-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2.5rem;
}

.event-card {
    background: var(--background-medium);
    border-radius: 20px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
    border: 1px solid var(--sdt-line);
}

.event-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 40px rgba(161, 10, 77, 0.3);
    border-color: rgba(161, 10, 77, 0.3);
}

.event-image {
    width: 100%;
    height: 250px;
    background: linear-gradient(135deg, #a10a4d 0%, #7d0839 100%);
    position: relative;
}

.event-badge {
    position: absolute;
    top: 1rem;
    right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    background: var(--primary-purple);
    color: #ffffff;
}

.event-content {
    padding: 2rem;
}

.event-content h3,
.event-title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: var(--text-light);
}

.event-details {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    margin-bottom: 1.5rem;
    color: var(--text-gray);
    font-size: 0.95rem;
}

.event-details span {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.event-button {
    display: block;
    text-align: center;
    background: var(--sdt-wine);
    padding: 0.8rem;
    border-radius: 10px;
    color: white;
    text-decoration: none;
    font-weight: 600;
    transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
}

.event-button:hover {
    transform: scale(1.05);
    box-shadow: 0 5px 20px rgba(161, 10, 77, 0.5);
    background: var(--sdt-wine-lo);
}

/* ============================================
   FEATURES SECTION
   ============================================ */

.features {
    background: var(--sdt-surface);
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 3rem;
}

.feature-item {
    text-align: center;
    padding: 2.5rem;
    background: var(--background-medium);
    border-radius: 20px;
    border: 1px solid var(--sdt-line);
    transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}

.feature-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(161, 10, 77, 0.2);
    border-color: rgba(161, 10, 77, 0.3);
}

.feature-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 2rem;
    background: var(--sdt-wine);
    color: white;
}

.feature-item h3 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: var(--sdt-ink);
}

.feature-item p {
    color: var(--text-gray);
    line-height: 1.7;
}

/* ============================================
   TESTIMONIALS SECTION
   ============================================ */

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2.5rem;
}

.testimonial-card {
    background: var(--background-medium);
    padding: 2.5rem;
    border-radius: 20px;
    border: 1px solid var(--sdt-line);
    position: relative;
    transition: all 0.3s;
}

.testimonial-card:hover {
    border-color: rgba(161, 10, 77, 0.3);
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(161, 10, 77, 0.2);
}

.testimonial-card::before {
    content: '\201C';
    position: absolute;
    top: 1rem;
    left: 1.5rem;
    font-size: 5rem;
    opacity: 0.3;
    font-family: Georgia, serif;
    color: var(--primary-purple);
}

.testimonial-text {
    font-style: italic;
    color: var(--text-gray);
    margin-bottom: 1.5rem;
    line-height: 1.8;
    position: relative;
    z-index: 1;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.author-info h4 {
    font-size: 1rem;
    color: var(--text-light);
}

.author-info p {
    font-size: 0.85rem;
    color: var(--text-muted);
}

/* ============================================
   CTA SECTION
   ============================================ */

.cta-section {
    background: linear-gradient(135deg, #a10a4d, #7d0839);
    padding: 4rem 2rem;
    text-align: center;
    border-radius: 30px;
    margin: 2rem 2rem 4rem;
    box-shadow: 0 15px 50px rgba(74, 8, 38, 0.18);
    position: relative;
    overflow: hidden;
}

.cta-section h2 {
    font-size: 3rem;
    margin-bottom: 1rem;
    color: #ffffff;
    position: relative;
    z-index: 1;
}

.cta-section p {
    font-size: 1.3rem;
    margin-bottom: 2rem;
    opacity: 0.9;
    color: #ffffff;
    position: relative;
    z-index: 1;
}

.cta-section .btn-secondary {
    background: white;
    color: var(--sdt-wine);
    border: none;
    position: relative;
    z-index: 1;
}

.cta-section .btn-secondary:hover {
    background: #fff0f5;
    transform: translateY(-3px);
}

/* ============================================
   FOOTER
   ============================================ */

footer {
    background: var(--background-medium);
    padding: 4rem 2rem 2rem;
    border-top: 1px solid var(--sdt-line);
}

.footer-content {
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem;
    margin-bottom: 3rem;
}

.footer-section.company-contact {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.company-info h3 {
    color: var(--primary-purple);
    margin-bottom: 1rem;
    font-size: 1.3rem;
    font-weight: 700;
}

.company-info p {
    color: var(--text-gray);
    line-height: 1.8;
    margin-bottom: 0;
}

.contact-info h3,
.contact-info h4 {
    color: var(--primary-purple);
    margin-bottom: 1rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.contact-info ul {
    list-style: none;
}

.contact-info ul li {
    margin-bottom: 0.5rem;
}

.contact-info ul li a {
    color: var(--text-gray);
    text-decoration: none;
    transition: color 0.3s;
}

.contact-info ul li a:hover {
    color: var(--primary-purple);
}

.footer-section.quick-links {
    display: flex;
    flex-direction: column;
}

.footer-section.quick-links ul {
    display: grid;
    grid-template-columns: auto auto;
    gap: 0.5rem 2.5rem;
    list-style: none;
    justify-content: start;
}

.footer-section h3 {
    font-size: 1.3rem;
    margin-bottom: 1.5rem;
    color: var(--sdt-wine);
}

.footer-section ul {
    list-style: none;
}

.footer-section ul li {
    margin-bottom: 0.8rem;
}

.footer-section a {
    color: var(--text-gray);
    text-decoration: none;
    transition: color 0.3s;
}

.footer-section a:hover {
    color: var(--primary-purple);
}

.footer-bottom {
    text-align: center;
    padding-top: 2rem;
    border-top: 1px solid var(--sdt-line);
    color: var(--text-gray);
    font-size: 0.9rem;
}

/* Footer Form Inputs */
.footer-input {
    padding: 0.8rem;
    background: #ffffff;
    border: 1px solid var(--sdt-hair);
    border-radius: 5px;
    color: var(--sdt-ink);
    font-size: 0.95rem;
    width: 100%;
}

.footer-select {
    flex: 1;
    padding: 0.8rem;
    border-radius: 5px;
    border: 1px solid var(--sdt-hair);
    background: #ffffff;
    color: var(--sdt-ink);
    font-size: 0.95rem;
}

#nl-age {
    font-size: 0.95rem;
    -moz-appearance: textfield;
}

#nl-age::-webkit-outer-spin-button,
#nl-age::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.footer-btn {
    padding: 0.8rem;
    background: linear-gradient(135deg, #a10a4d, #7d0839);
    border: none;
    border-radius: 5px;
    color: white;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
}

.footer-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(161, 10, 77, 0.4);
}

/* ============================================
   FORM STYLES (shared across contact, login, etc.)
   ============================================ */

.form-group {
    margin-bottom: 1.5rem;
}

.form-label {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sdt-ink);
    margin-bottom: 0.5rem;
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: 0.9rem;
    border-radius: 8px;
    border: 1px solid var(--sdt-hair);
    background: #ffffff;
    color: var(--sdt-ink);
    font-size: 1rem;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    transition: all 0.3s;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--sdt-wine);
    box-shadow: 0 0 0 3px rgba(161, 10, 77, 0.15);
}

.form-textarea {
    resize: vertical;
    min-height: 120px;
}

.btn-submit {
    background: linear-gradient(135deg, #a10a4d, #7d0839);
    color: white;
    padding: 1rem 3rem;
    border: none;
    border-radius: 30px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
    box-shadow: 0 5px 20px rgba(161, 10, 77, 0.4);
}

.btn-submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(161, 10, 77, 0.6);
}

/* ============================================
   ANIMATIONS
   ============================================ */

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    animation: fadeInUp 0.8s ease-out;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

@media (max-width: 1024px) {
    .nav-links {
        display: none;
    }

    .hamburger {
        display: flex;
    }

    .hero h1 {
        font-size: 2.5rem;
    }

    .hero p {
        font-size: 1.1rem;
    }

    .hero-about h1 {
        font-size: 2.5rem;
    }

    .section-header h2 {
        font-size: 2rem;
    }

    .cta-section h2 {
        font-size: 2rem;
    }

    #testimonials {
        display: none;
    }

    section {
        padding: 2rem 1.5rem;
    }

    .section-header {
        margin-bottom: 1.5rem;
    }

    .footer-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .footer-section.quick-links ul {
        grid-template-columns: auto auto;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .section-header h2,
    .cta-section h2 {
        font-size: 1.6rem;
    }
}

/* ============================================
   SHARED ABOUT / NICHE PAGE LAYOUT
   Used by About, and all niche SEO landing pages.
   ============================================ */

.hero-about {
    background: linear-gradient(rgba(58, 18, 38, 0.7), rgba(58, 18, 38, 0.85)),
                url("/images/tampa-singles-social-under-palm-lights-1600.webp") center/cover;
    height: 60vh;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.hero-about h1 { font-size: 3.5rem; font-weight: 700; margin-bottom: 1rem; color: #ffffff; }
.hero-about p { font-size: 1.3rem; color: rgba(255, 255, 255, 0.85); }

.about-page-content { padding: 4rem 2rem; }

.content-wrapper-two-col {
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 4rem;
    align-items: start;
}

.about-main-content { max-width: 800px; }

.about-intro { text-align: left; margin-bottom: 4rem; }
.about-intro h2 { font-size: 2.5rem; color: var(--sdt-ink); margin-bottom: 1.5rem; }  /* cream: the site rides the dark Last Light canvas */
.about-intro p { font-size: 1.2rem; color: var(--sdt-dim); line-height: 1.8; }
.about-intro p + p, .about-section p + p { margin-top: 1rem; } /* 2026-08-30: region + long-form town copy have multi-paragraph bodies */

.about-section {
    margin-bottom: 3rem;
    padding: 2.5rem;
    background: var(--background-medium);
    border-radius: 20px;
    border: 1px solid var(--sdt-line);
    transition: all 0.3s;
}
.about-section:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(161, 10, 77, 0.2);
    border-color: rgba(161, 10, 77, 0.3);
}
.highlight-section {
    /* opaque dark rose (both ends dark) so the card's light text stays readable */
    background: linear-gradient(135deg, var(--sdt-blush), var(--sdt-surface));
    border-color: rgba(161, 10, 77, 0.5);
}
.about-icon { font-size: 3rem; margin-bottom: 1rem; color: var(--sdt-wine); }
.about-icon svg { width: 40px; height: 40px; }
.about-section h3 { font-size: 1.8rem; color: var(--sdt-ink); margin-bottom: 1rem; }
.about-section p { font-size: 1.1rem; color: var(--text-gray); line-height: 1.8; }
.about-section a { color: var(--sdt-wine); text-decoration: none; font-weight: 600; }
.about-section a:hover { text-decoration: underline; }

/* In-body text links (2026-08-30). Links inside paragraphs / list items anywhere in <main> that carry no class
   of their own get the house link colour instead of the browser-default blue. :where() keeps specificity at
   zero, so every existing rule (nav, footer, chips, buttons, .location-list, .ix2-comm, .about-section) still wins. */
:where(main p, main li) a:where(:not([class])) { color: var(--sdt-wine); text-decoration: none; font-weight: 600; }
:where(main p, main li) a:where(:not([class])):hover,
:where(main p, main li) a:where(:not([class])):focus-visible { text-decoration: underline; }

.about-sidebar { position: sticky; top: 100px; }

.sidebar-card {
    background: var(--background-medium);
    border-radius: 20px;
    padding: 2rem;
    margin-bottom: 2rem;
    border: 1px solid var(--sdt-line);
    transition: all 0.3s;
}
.sidebar-card:hover {
    border-color: rgba(161, 10, 77, 0.3);
    box-shadow: 0 5px 20px rgba(161, 10, 77, 0.2);
}
.sidebar-card h3 { font-size: 1.3rem; color: var(--sdt-wine); margin-bottom: 1.5rem; text-align: center; }
.sidebar-card h4 { color: var(--primary-purple); margin-bottom: 0.5rem; }
.sidebar-card p { color: var(--text-gray); font-style: italic; }
.sidebar-card.highlight-card {
    background: linear-gradient(135deg, var(--sdt-blush), var(--sdt-surface));
    border-color: rgba(161, 10, 77, 0.5);
}
.sidebar-link {
    display: inline-block;
    color: var(--sdt-wine);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s;
}
.sidebar-link:hover { color: var(--sdt-wine-lo); }

/* Coverage/highlights list in sidebar */
.coverage-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.coverage-list li {
    padding: 0.6rem 0;
    border-bottom: 1px solid var(--sdt-line);
    color: var(--text-gray);
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.coverage-list li::before {
    content: '';
    width: 6px;
    height: 6px;
    background: var(--sdt-wine);
    border-radius: 50%;
    flex-shrink: 0;
}
.coverage-list li:last-child { border-bottom: none; }

/* Sidebar stats */
.sidebar-stat {
    text-align: center;
    padding: 0.8rem 0;
    border-bottom: 1px solid var(--sdt-line);
}
.sidebar-stat:last-child { border-bottom: none; }
.sidebar-stat-number {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--sdt-wine);
    line-height: 1.2;
}
.sidebar-stat-label {
    font-size: 0.85rem;
    color: var(--text-gray);
    margin-top: 0.2rem;
}

/* Location page sidebar lists */
.location-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.location-list li { margin-bottom: 0.6rem; }
.location-list li a {
    color: var(--text-gray);
    text-decoration: none;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    background: rgba(161, 10, 77, 0.03);
}
.location-list li a:hover {
    color: var(--sdt-rose);
    background: rgba(161, 10, 77, 0.18);
    padding-left: 1.1rem;
}

.benefits-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem 0;
}
.benefits-list li {
    color: var(--text-gray);
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
    padding-left: 0.3rem;
}

/* Location page inline CTA button */
.btn-primary {
    display: inline-block;
    background: linear-gradient(135deg, #a10a4d, #7d0839);
    padding: 1rem 2rem;
    border-radius: 30px;
    color: white;
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    box-shadow: 0 4px 15px rgba(161, 10, 77, 0.4);
    transition: all 0.3s ease;
    margin-top: 1rem;
}
.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(161, 10, 77, 0.6);
}

@media (max-width: 768px) {
    .hero-about h1 { font-size: 2rem; }
    .hero-about p { font-size: 1.1rem; }
    .content-wrapper-two-col { grid-template-columns: 1fr; gap: 2rem; }
    .about-sidebar { position: static; }
    .about-main-content { max-width: 100%; }
    .about-intro h2 { font-size: 1.8rem; }
    .about-section { padding: 1.5rem; }
    .about-section h3 { font-size: 1.4rem; }
}

/* ============================================
   PAGE-SPECIFIC OVERRIDES (via body class)
   ============================================ */

/* Events page: minimal footer (copyright only) */
.events-page footer { padding-top: 0; }
.events-page footer .footer-content { display: none; }
.events-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Event details page: minimal footer (copyright only) */
.event-details-page footer { padding-top: 0; }
.event-details-page footer .footer-content { display: none; }
.event-details-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Contact page: minimal footer (copyright only) */
.contact-page footer { padding-top: 0; }
.contact-page footer .footer-content { display: none; }
.contact-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Login page: minimal footer (copyright only) */
.login-page footer { padding-top: 0; }
.login-page footer .footer-content { display: none; }
.login-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Why Choose Us page: minimal footer (copyright only) */
.whychooseus-page footer { padding-top: 0; }
.whychooseus-page footer .footer-content { display: none; }
.whychooseus-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Testimonials page: minimal footer (copyright only) */
.testimonials-page footer { padding-top: 0; }
.testimonials-page footer .footer-content { display: none; }
.testimonials-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Legal page: minimal footer (copyright only) */
.legal-page footer { padding-top: 0; }
.legal-page footer .footer-content { display: none; }
.legal-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* What is Speed Dating page: minimal footer (copyright only) */
.whatissd-page footer { padding-top: 0; }
.whatissd-page footer .footer-content { display: none; }
.whatissd-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Privacy page: minimal footer (copyright only) */
.privacy-page footer { padding-top: 0; }
.privacy-page footer .footer-content { display: none; }
.privacy-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Careers page: minimal footer (copyright only) */
.careers-page footer { padding-top: 0; }
.careers-page footer .footer-content { display: none; }
.careers-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* FAQ page: minimal footer (copyright only) */
.faq-page footer { padding-top: 0; }
.faq-page footer .footer-content { display: none; }
.faq-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Videos page: minimal footer (copyright only) */
.videos-page footer { padding-top: 0; }
.videos-page footer .footer-content { display: none; }
.videos-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Tell a Friend page: minimal footer (copyright only) */
.tellafriend-page footer { padding-top: 0; }
.tellafriend-page footer .footer-content { display: none; }
.tellafriend-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Venues page: minimal footer (copyright only) */
.venues-page footer { padding-top: 0; }
.venues-page footer .footer-content { display: none; }
.venues-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Sitemap page: minimal footer (copyright only) */
.sitemap-page footer { padding-top: 0; }
.sitemap-page footer .footer-content { display: none; }
.sitemap-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Niche speed dating page (legacy body class): minimal footer (copyright only) */
.nyc-speeddating-page footer { padding-top: 0; }
.nyc-speeddating-page footer .footer-content { display: none; }
.nyc-speeddating-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Gift page: minimal footer (copyright only) */
.gift-page footer { padding-top: 0; }
.gift-page footer .footer-content { display: none; }
.gift-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Gift Register page: minimal footer (copyright only) */
.gift-register-page footer { padding-top: 0; }
.gift-register-page footer .footer-content { display: none; }
.gift-register-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Promo Codes page: minimal footer (copyright only) */
.promo-codes-page footer { padding-top: 0; }
.promo-codes-page footer .footer-content { display: none; }
.promo-codes-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Blog page: minimal footer (copyright only) */
.blog-page footer { padding-top: 0; }
.blog-page footer .footer-content { display: none; }
.blog-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Blog article page: minimal footer (copyright only) */
.blog-article-page footer { padding-top: 0; }
.blog-article-page footer .footer-content { display: none; }
.blog-article-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* Niche speed dating pages: minimal footer (copyright only) */
.niche-dating-page footer { padding-top: 0; }
.niche-dating-page footer .footer-content { display: none; }
.niche-dating-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.register-view-page footer { padding-top: 0; }
.register-view-page footer .footer-content { display: none; }
.register-view-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.waitinglist-page footer { padding-top: 0; }
.waitinglist-page footer .footer-content { display: none; }
.waitinglist-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.mailing-list-page footer { padding-top: 0; }
.mailing-list-page footer .footer-content { display: none; }
.mailing-list-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.register-session-page footer { padding-top: 0; }
.register-session-page footer .footer-content { display: none; }
.register-session-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.error-page footer { padding-top: 0; }
.error-page footer .footer-content { display: none; }
.error-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.not-found-page footer { padding-top: 0; }
.not-found-page footer .footer-content { display: none; }
.not-found-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}
.wl-register-session-page footer { padding-top: 0; }
.wl-register-session-page footer .footer-content { display: none; }
.wl-register-session-page footer .footer-bottom {
    padding: 20px 0;
    margin-top: 0;
    border-top: none;
}

/* ==========================================================================
   VALIDATION MESSAGE COLOURS  (added 2026-08-12)

   These MUST live in a global stylesheet, not in a *.cshtml.css scoped file.

   Why: ASP.NET CSS isolation rewrites `.field-validator` to
   `.field-validator[b-<scope>]`, and it stamps that b- attribute onto elements
   authored in the .cshtml. But `asp-validation-for` / `asp-validation-summary`
   are rendered by tag helpers that do NOT carry the attribute through — verified
   in the rendered HTML:

       <button b-z7wez1w1jp type="submit" class="btn-submit">      <-- has it
       <span class="field-validator field-validation-error" ...>   <-- does NOT

   So every scoped validation rule silently failed to match and the messages
   inherited the page's text colour — white on the dark registration page, i.e.
   invisible ("Please enter a First Name." etc. appeared as plain white text).

   Keying off the framework's own classes fixes this everywhere at once, since
   `field-validation-error` / `validation-summary-errors` are added by the
   framework only when there is actually an error.
   ========================================================================== */

.field-validation-error,
.validation-summary-errors {
    color: #d92d20;
    font-weight: 600;
}

.validation-summary-errors ul {
    margin: 0;
    padding-left: 1.2rem;
}

/* Dark-background pages: brand soft coral #ffa584 (owner request 2026-08-12 —
   matches the event-info-box title so the page reads as one family; ~8.6:1
   contrast on the dark shells). Was coral #ff6b6b. */
.register-session-page .field-validation-error,
.register-session-page .validation-summary-errors,
.wl-register-session-page .field-validation-error,
.wl-register-session-page .validation-summary-errors {
    color: var(--sdt-rose);
}

/* The summary is a block-level alert, so give it a visible container too —
   the scoped .validation-summary rule never applied for the same reason. */
.validation-summary-errors {
    background: rgba(198, 40, 40, 0.10);
    border: 1px solid rgba(198, 40, 40, 0.35);
    border-radius: 8px;
    padding: 0.85rem 1.25rem;
    margin-bottom: 1.25rem;
}

/* ==========================================================================
   UNIFORM VALIDATION UX  (added 2026-08-12, owner-approved redesign)

   Pairs with wwwroot/js/form-validate.js (instant client-side validation).
   The JS uses the framework's OWN classes (field-validation-error on the
   message span, input-validation-error on the input), and the server renders
   the same classes on a failed POST — so these rules style both paths.

   Owner's picks: brand soft-coral #ffa584 message text + icon (2026-08-12 —
   initially coral #ff6b6b, changed same day to match the event-info-box accent);
   error border in the site's BRAND ember #f07a52 (same color a focused field
   turns), so no new border color is introduced; business notices ("you are
   already registered") are amber .biz-notice, distinct from errors; login
   failures stay red.
   ========================================================================== */

/* All Speed Date Tampa public forms sit in dark sections — soft coral there.
   (The body-class rules above stay for the register pages' full-dark shells.) */
.sdt-sec--dark .field-validation-error,
.sdt-sec--dark .validation-summary-errors {
    color: var(--sdt-rose);
}

/* Match the summary box's tint to the coral family on dark sections too
   (the global red tint below still applies on light/admin contexts). */
.sdt-sec--dark .validation-summary-errors,
.register-session-page .validation-summary-errors,
.wl-register-session-page .validation-summary-errors {
    background: var(--sdt-blush);
    border-color: rgba(161, 10, 77, 0.35);
}

/* Field-level message: block under the field, with a small alert icon.
   span-scoped so table/summary uses of the class elsewhere are unaffected. */
span.field-validation-error {
    display: flex;
    align-items: center;
    gap: 0.38rem;
    margin-top: 0.35rem;
    font-size: 0.875rem;
}

span.field-validation-error::before {
    content: "";
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    background-color: currentColor;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12.5"/><circle cx="12" cy="16.4" r="0.6" fill="black"/></svg>') center / contain no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.4" stroke-linecap="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12.5"/><circle cx="12" cy="16.4" r="0.6" fill="black"/></svg>') center / contain no-repeat;
}

/* Empty (valid-state) spans must not reserve space or show a stray icon. */
span.field-validation-valid::before { content: none; }
span.field-validation-valid { margin-top: 0; }

/* Error border on the field: the site's brand ember — the same color the field
   turns on focus, per the owner's direction (no separate error border color).
   !important because the scoped per-page .form-input rules load after site.css. */
.input-validation-error,
select.input-validation-error,
textarea.input-validation-error {
    border-color: var(--sdt-wine) !important;
    box-shadow: 0 0 0 3px rgba(161, 10, 77, 0.22) !important;
}

/* Business notice — "you are already registered for this event" and friends.
   Amber, with a warning icon supplied inline in the markup. NOT for real
   errors: logins and processing failures keep the red treatments above. */
.biz-notice {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    background: rgba(255, 176, 32, 0.10);
    border: 1px solid rgba(255, 176, 32, 0.42);
    border-radius: 10px;
    padding: 0.9rem 1.15rem;
    margin-bottom: 1.25rem;
    color: #8a5200;
    font-size: 0.95rem;
}

.biz-notice svg { flex: 0 0 auto; margin-top: 2px; }

.biz-notice strong {
    display: block;
    margin-bottom: 2px;
}

.biz-notice .biz-notice-sub {
    opacity: 0.85;
    font-size: 0.89rem;
}
