/* Extracted from views/frontend/free-webinar.blade.php */
:root {
        --wine: #862736;
        --wine-hover: #9c2e40;
        --wine-light-solid: #f4e8ea;
        --cream: #faf8f5;
        --green: #2e7d32;
        --green-bg: #e8f5e9;
        --text-primary: #1a1a1a;
        --text-secondary: #5a5550;
        --text-muted: #8a8580;
        --border: rgba(0, 0, 0, 0.08);
        --border-strong: rgba(0, 0, 0, 0.12);
        --font-display: 'Playfair Display', Georgia, serif;
        --font-body: 'Source Sans 3', -apple-system, sans-serif;
        --radius: 10px;
        --radius-lg: 14px;
        --fw-max-width: 1100px;
    }

    /* ── HERO ──────────────────────────────────────────── */
    .webinar-hero {
        background: linear-gradient(135deg, #1c1917, #2a2520);
        color: #fff;
        padding: 3.5rem 0;
    }

    .webinar-hero__container {
        max-width: var(--fw-max-width);
        margin: 0 auto;
        padding: 0 2rem;
    }

    .webinar-hero__inner {
        display: grid;
        grid-template-columns: 1fr 400px;
        gap: 3rem;
        align-items: start;
    }

    .webinar-hero__badge {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        font-size: 0.65rem;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        background: var(--wine);
        padding: 0.3rem 0.75rem;
        border-radius: 20px;
        margin-bottom: 1rem;
        font-family: var(--font-body);
    }

    .webinar-hero__badge-dot {
        width: 6px; height: 6px;
        border-radius: 50%;
        background: #4caf50;
        animation: pulse 2s infinite;
    }

    @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.4} }

    .webinar-hero__title {
        font-family: var(--font-display);
        font-size: 2.25rem;
        font-weight: 700;
        line-height: 1.15;
        margin-bottom: 0.75rem;
    }

    .webinar-hero__meta {
        display: flex;
        align-items: center;
        gap: 1.25rem;
        font-size: 0.9rem;
        color: rgba(255,255,255,0.6);
        margin-bottom: 1.5rem;
        font-family: var(--font-body);
    }

    .webinar-hero__meta-item {
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .webinar-hero__meta-item svg { width: 16px; height: 16px; stroke: rgba(255,255,255,0.4); }

    .webinar-hero__host {
        display: flex;
        align-items: center;
        gap: 0.85rem;
        margin-bottom: 1.5rem;
    }

    .webinar-hero__host-avatar {
        width: 48px; height: 48px;
        border-radius: 50%;
        background: linear-gradient(135deg, #e8e4df, #d4cec6);
        flex-shrink: 0;
        overflow: hidden;
    }

    .webinar-hero__host-avatar img { width: 100%; height: 100%; object-fit: cover; }

    .webinar-hero__host-name { font-size: 0.9rem; font-weight: 600; font-family: var(--font-body); }
    .webinar-hero__host-role { font-size: 0.75rem; color: rgba(255,255,255,0.5); font-family: var(--font-body); }

    /* Countdown */
    .countdown {
        display: flex;
        gap: 0.75rem;
        margin-bottom: 1.5rem;
    }

    .countdown__unit {
        text-align: center;
        background: rgba(255,255,255,0.08);
        border-radius: 8px;
        padding: 0.65rem 0.85rem;
        min-width: 60px;
    }

    .countdown__number {
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1;
        font-variant-numeric: tabular-nums;
        font-family: var(--font-body);
    }

    .countdown__label {
        font-size: 0.55rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: rgba(255,255,255,0.5);
        margin-top: 3px;
        font-family: var(--font-body);
    }

    /* ── REGISTRATION FORM ─────────────────────────────── */
    .reg-card {
        background: #fff;
        border-radius: var(--radius-lg);
        padding: 2rem;
        color: var(--text-primary);
    }

    .reg-card__title {
        font-size: 1.1rem;
        font-weight: 700;
        margin-bottom: 0.25rem;
        font-family: var(--font-body);
    }

    .reg-card__sub {
        font-size: 0.8rem;
        color: var(--text-muted);
        margin-bottom: 1.25rem;
        font-family: var(--font-body);
    }

    .reg-card__spots {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        font-size: 0.72rem;
        font-weight: 600;
        color: var(--green);
        background: var(--green-bg);
        padding: 0.25rem 0.65rem;
        border-radius: 20px;
        margin-bottom: 1rem;
        font-family: var(--font-body);
    }

    .fw-form-group {
        margin-bottom: 0.85rem;
    }

    .fw-form-group label {
        display: block;
        font-size: 0.75rem;
        font-weight: 600;
        margin-bottom: 0.3rem;
        font-family: var(--font-body);
    }

    .fw-form-group input {
        width: 100%;
        padding: 0.65rem 0.85rem;
        border: 1px solid var(--border-strong);
        border-radius: 6px;
        font-family: var(--font-body);
        font-size: 0.875rem;
        outline: none;
    }

    .fw-form-group input:focus { border-color: var(--wine); }

    /* Consent checkboxes */
    .consent-group {
        margin: 1rem 0;
    }

    .consent-item {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .consent-item input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin-top: 2px;
        accent-color: var(--wine);
        flex-shrink: 0;
    }

    .consent-item label {
        font-size: 0.72rem;
        color: var(--text-secondary);
        line-height: 1.5;
        font-family: var(--font-body);
    }

    .consent-item label a {
        color: var(--wine);
        text-decoration: none;
    }

    .reg-btn {
        width: 100%;
        padding: 0.85rem;
        background: var(--wine);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-family: var(--font-body);
        font-size: 0.95rem;
        font-weight: 700;
        cursor: pointer;
        transition: background 0.15s;
    }

    .reg-btn:hover { background: var(--wine-hover); }
    .reg-btn:disabled { opacity: 0.5; cursor: not-allowed; }

    .reg-note {
        font-size: 0.68rem;
        color: var(--text-muted);
        text-align: center;
        margin-top: 0.65rem;
        font-family: var(--font-body);
    }

    /* ── REPRISE STATE ───────────────── */
    .reprise-card {
        background: #fff;
        border-radius: var(--radius-lg);
        padding: 2rem;
        color: var(--text-primary);
        text-align: center;
    }

    .reprise-card__badge {
        display: inline-block;
        font-size: 0.65rem;
        font-weight: 600;
        color: var(--wine);
        background: var(--wine-light-solid);
        padding: 0.25rem 0.65rem;
        border-radius: 20px;
        margin-bottom: 0.75rem;
        font-family: var(--font-body);
    }

    .reprise-card__title {
        font-size: 1.1rem;
        font-weight: 700;
        margin-bottom: 0.35rem;
        font-family: var(--font-body);
    }

    .reprise-card__sub {
        font-size: 0.8rem;
        color: var(--text-muted);
        margin-bottom: 1.25rem;
        font-family: var(--font-body);
    }

    /* ── SUCCESS STATE ───────────────── */
    .success-card {
        background: #fff;
        border-radius: var(--radius-lg);
        padding: 2rem;
        color: var(--text-primary);
        text-align: center;
    }

    .success-card__icon {
        width: 48px; height: 48px;
        border-radius: 50%;
        background: var(--green-bg);
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1rem;
    }

    .success-card__icon svg { width: 24px; height: 24px; }

    /* ── CONTENT SECTION ───────────────────────────────── */
    .webinar-content {
        padding: 3.5rem 0;
    }

    .webinar-content__container {
        max-width: var(--fw-max-width);
        margin: 0 auto;
        padding: 0 2rem;
    }

    .webinar-content__inner {
        display: grid;
        grid-template-columns: 1fr 340px;
        gap: 3rem;
        align-items: start;
    }

    .content-heading {
        font-family: var(--font-display);
        font-size: 1.35rem;
        font-weight: 700;
        margin-bottom: 1rem;
    }

    .content-text {
        font-size: 0.95rem;
        color: var(--text-secondary);
        line-height: 1.8;
        margin-bottom: 1.5rem;
        font-family: var(--font-body);
    }

    /* Feature list */
    .feature-list {
        margin-bottom: 1.5rem;
    }

    .feature-list__title {
        font-size: 0.95rem;
        font-weight: 700;
        margin-top: 0;
        margin-bottom: 0.65rem;
        font-family: var(--font-body);
    }

    .feature-list__item {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 0.4rem 0;
        font-size: 0.9rem;
        color: var(--text-secondary);
        line-height: 1.5;
        font-family: var(--font-body);
    }

    .feature-list__item svg { width: 18px; height: 18px; stroke: var(--green); flex-shrink: 0; margin-top: 2px; }

    /* Audience list */
    .audience-list {
        background: var(--cream);
        border-radius: var(--radius);
        padding: 1.5rem;
        margin-bottom: 1.5rem;
    }

    .audience-list__title {
        font-size: 0.9rem;
        font-weight: 700;
        margin-top: 0;
        margin-bottom: 0.5rem;
        font-family: var(--font-body);
    }

    .audience-list__item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.35rem 0;
        font-size: 0.85rem;
        color: var(--text-secondary);
        font-family: var(--font-body);
    }

    .audience-list__item::before {
        content: '\2192';
        color: var(--wine);
        font-weight: 600;
    }

    /* ── SIDEBAR ────────────────────────── */
    .sidebar-cta {
        background: var(--cream);
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        padding: 1.5rem;
        margin-bottom: 1.25rem;
    }

    .sidebar-cta__title {
        font-size: 0.9rem;
        font-weight: 700;
        margin-bottom: 0.35rem;
        font-family: var(--font-body);
    }

    .sidebar-cta__desc {
        font-size: 0.8rem;
        color: var(--text-muted);
        line-height: 1.5;
        margin-bottom: 1rem;
        font-family: var(--font-body);
    }

    .sidebar-cta__btn {
        display: block;
        text-align: center;
        padding: 0.65rem;
        background: var(--wine);
        color: #fff;
        border-radius: 6px;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.825rem;
        font-family: var(--font-body);
    }

    .sidebar-cta__btn:hover { background: var(--wine-hover); color: #fff; text-decoration: none; }

    .sidebar-cta__note {
        font-size: 0.68rem;
        color: var(--text-muted);
        text-align: center;
        margin-top: 0.5rem;
        font-family: var(--font-body);
    }

    /* Earlybird mini */
    .earlybird-mini {
        background: linear-gradient(135deg, #1c1917, #2a2520);
        border-radius: var(--radius-lg);
        padding: 1.5rem;
        color: #fff;
        text-align: center;
    }

    .earlybird-mini__badge {
        display: inline-block;
        font-size: 0.55rem;
        font-weight: 700;
        color: #1c1917;
        background: #ffd54f;
        padding: 0.15rem 0.5rem;
        border-radius: 3px;
        margin-bottom: 0.5rem;
        font-family: var(--font-body);
    }

    .earlybird-mini__title {
        font-size: 0.9rem;
        font-weight: 700;
        margin-bottom: 0.15rem;
        font-family: var(--font-body);
    }

    .earlybird-mini__price {
        font-family: var(--font-display);
        font-size: 1.5rem;
        font-weight: 700;
        color: #ffd54f;
    }

    .earlybird-mini__original {
        font-size: 0.75rem;
        color: rgba(255,255,255,0.4);
        text-decoration: line-through;
        font-family: var(--font-body);
    }

    .earlybird-mini__btn {
        display: block;
        margin-top: 0.85rem;
        padding: 0.6rem;
        background: var(--wine);
        color: #fff;
        border-radius: 6px;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.8rem;
        font-family: var(--font-body);
    }

    .earlybird-mini__btn:hover { background: var(--wine-hover); color: #fff; text-decoration: none; }

    /* Error alert */
    .fw-alert {
        background: #fef2f2;
        border: 1px solid #fecaca;
        border-radius: 8px;
        padding: 0.75rem 1rem;
        margin-bottom: 1rem;
        font-size: 0.8rem;
        color: #991b1b;
        font-family: var(--font-body);
    }

    @media (max-width: 768px) {
        .webinar-hero__inner { grid-template-columns: 1fr; }
        .webinar-content__inner { grid-template-columns: 1fr; }
        .webinar-hero__meta { flex-wrap: wrap; gap: 0.75rem; }
    }