/* Extracted from views/frontend/course/show.blade.php */
/* ══════════════════════════════════════════════════════
       CSS VARIABLES
       ══════════════════════════════════════════════════════ */
    .rk-page {
        --wine: #862736;
        --wine-hover: #9c2e40;
        --wine-light: #f4e8ea;
        --cream: #faf8f5;
        --green: #2e7d32;
        --green-bg: #e8f5e9;
        --blue: #1565c0;
        --blue-bg: #e3f2fd;
        --text: #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;
        --max-width: 1100px;
        font-family: var(--font-body);
        color: var(--text);
        -webkit-font-smoothing: antialiased;
    }

    .rk-page * { box-sizing: border-box; }
    .rk-container { max-width: var(--max-width); margin: 0 auto; padding: 0 2rem; }

    /* ══════════════════════════════════════════════════════
       HERO
       ══════════════════════════════════════════════════════ */
    .rk-hero { padding: 4rem 0 3rem; }

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

    .rk-hero__eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.7rem;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: var(--wine);
        margin-bottom: 0.75rem;
    }

    .rk-hero__eyebrow-dot {
        width: 6px; height: 6px;
        border-radius: 50%;
        background: var(--green);
        animation: rkPulse 2s infinite;
    }

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

    .rk-hero__title {
        font-family: var(--font-display);
        font-size: 2.5rem;
        font-weight: 700;
        line-height: 1.15;
        margin-bottom: 0.5rem;
    }

    .rk-hero__title em { color: var(--wine); font-style: italic; }

    .rk-hero__desc {
        font-size: 1rem;
        color: var(--text-secondary);
        line-height: 1.7;
        margin-bottom: 1.5rem;
        max-width: 520px;
    }

    .rk-hero__ctas { display: flex; gap: 0.75rem; margin-bottom: 2rem; }

    .rk-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        padding: 0.75rem 1.5rem;
        border-radius: 8px;
        font-family: var(--font-body);
        font-size: 0.9rem;
        font-weight: 600;
        text-decoration: none;
        cursor: pointer;
        border: none;
        transition: all 0.15s;
    }

    .rk-btn--primary { background: var(--wine); color: #fff; }
    .rk-btn--primary:hover { background: var(--wine-hover); color: #fff; }
    .rk-btn--outline { background: transparent; color: var(--wine); border: 1.5px solid var(--wine); }
    .rk-btn--outline:hover { background: var(--wine); color: #fff; }

    .rk-hero__trust {
        display: flex;
        gap: 1.5rem;
        font-size: 0.8rem;
        color: var(--text-muted);
    }

    .rk-hero__trust-item {
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .rk-hero__trust-item svg { width: 16px; height: 16px; stroke: var(--green); }

    .rk-hero__image {
        border-radius: var(--radius-lg);
        overflow: hidden;
        margin-bottom: 1rem;
        height: 220px;
        background: #e8e4df;
    }

    .rk-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }

    .rk-hero__quick-price {
        background: var(--cream);
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        padding: 1.5rem;
    }

    .rk-hero__quick-price-label {
        font-size: 0.7rem;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: var(--text-muted);
        margin-bottom: 0.5rem;
    }

    .rk-hero__quick-price-row {
        display: flex;
        align-items: baseline;
        gap: 0.5rem;
        margin-bottom: 0.35rem;
    }

    .rk-hero__quick-price-amount {
        font-family: var(--font-display);
        font-size: 2rem;
        font-weight: 700;
        color: var(--wine);
    }

    .rk-hero__quick-price-original {
        font-size: 0.85rem;
        color: var(--text-muted);
        text-decoration: line-through;
    }

    .rk-hero__quick-price-save {
        display: inline-block;
        font-size: 0.65rem;
        font-weight: 600;
        color: var(--green);
        background: var(--green-bg);
        padding: 0.15rem 0.45rem;
        border-radius: 3px;
        margin-bottom: 0.75rem;
    }

    .rk-hero__quick-price-note {
        font-size: 0.72rem;
        color: var(--text-muted);
    }

    /* ══════════════════════════════════════════════════════
       SECTION TITLES
       ══════════════════════════════════════════════════════ */
    .rk-section-title {
        font-family: var(--font-display);
        font-size: 1.75rem;
        font-weight: 700;
        text-align: center;
        margin-bottom: 0.5rem;
    }

    .rk-section-sub {
        text-align: center;
        font-size: 0.95rem;
        color: var(--text-secondary);
        margin-bottom: 2.5rem;
    }

    /* ══════════════════════════════════════════════════════
       KURSPLAN TIMELINE
       ══════════════════════════════════════════════════════ */
    .rk-kursplan { padding: 4rem 0; }

    .rk-timeline {
        position: relative;
        max-width: 720px;
        margin: 0 auto;
    }

    .rk-timeline::before {
        content: '';
        position: absolute;
        left: 28px;
        top: 0;
        bottom: 0;
        width: 2px;
        background: var(--border);
    }

    .rk-timeline-item {
        display: flex;
        gap: 1.25rem;
        padding-bottom: 1.75rem;
        position: relative;
    }

    .rk-timeline-item:last-child { padding-bottom: 0; }

    .rk-timeline-item__marker {
        width: 56px;
        flex-shrink: 0;
        text-align: center;
    }

    .rk-timeline-item__week {
        width: 56px; height: 56px;
        border-radius: 50%;
        background: #fff;
        border: 2px solid var(--border);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 1;
    }

    .rk-timeline-item__week-num {
        font-size: 1rem;
        font-weight: 700;
        color: var(--wine);
        line-height: 1;
    }

    .rk-timeline-item__week-label {
        font-size: 0.5rem;
        font-weight: 600;
        text-transform: uppercase;
        color: var(--text-muted);
    }

    .rk-timeline-item__content {
        background: #fff;
        border: 1px solid var(--border);
        border-radius: var(--radius);
        padding: 1.25rem;
        flex: 1;
        transition: box-shadow 0.15s;
    }

    .rk-timeline-item__content:hover {
        box-shadow: 0 2px 12px rgba(0,0,0,0.04);
    }

    .rk-timeline-item__title {
        font-size: 0.95rem;
        font-weight: 700;
        color: var(--text);
        margin-bottom: 0.25rem;
    }

    .rk-timeline-item__date {
        font-size: 0.72rem;
        color: var(--text-muted);
        margin-bottom: 0.5rem;
    }

    /* ══════════════════════════════════════════════════════
       PACKAGES
       ══════════════════════════════════════════════════════ */
    .rk-packages { padding: 4rem 0; background: var(--cream); }

    .rk-package-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
        align-items: start;
    }

    .rk-package-card {
        background: #fff;
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        overflow: hidden;
        transition: box-shadow 0.15s;
    }

    .rk-package-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.06); }

    .rk-package-card--popular {
        border: 2px solid var(--wine);
        position: relative;
        transform: scale(1.03);
    }

    .rk-package-card__popular-badge {
        position: absolute;
        top: 0; left: 0; right: 0;
        background: var(--wine);
        color: #fff;
        font-size: 0.65rem;
        font-weight: 700;
        letter-spacing: 1px;
        text-transform: uppercase;
        text-align: center;
        padding: 0.35rem;
    }

    .rk-package-card__header {
        padding: 2rem 1.5rem 1.25rem;
        text-align: center;
    }

    .rk-package-card--popular .rk-package-card__header {
        padding-top: 2.75rem;
    }

    .rk-package-card__name {
        font-size: 0.7rem;
        font-weight: 600;
        letter-spacing: 1.5px;
        text-transform: uppercase;
        color: var(--text-muted);
        margin-bottom: 0.5rem;
    }

    .rk-package-card__price {
        font-family: var(--font-display);
        font-size: 2.25rem;
        font-weight: 700;
        color: var(--wine);
        line-height: 1;
        margin-bottom: 0.25rem;
    }

    .rk-package-card__original {
        font-size: 0.825rem;
        color: var(--text-muted);
        text-decoration: line-through;
    }

    .rk-package-card__save {
        display: inline-block;
        font-size: 0.65rem;
        font-weight: 600;
        color: var(--green);
        background: var(--green-bg);
        padding: 0.15rem 0.5rem;
        border-radius: 3px;
        margin-top: 0.35rem;
    }

    .rk-package-card__features {
        padding: 0 1.5rem 1.5rem;
        font-size: 0.8rem;
        color: var(--text-secondary);
        line-height: 1.8;
    }

    .rk-package-card__features .checkmark {
        color: var(--green);
        margin-right: 0.25rem;
    }

    .rk-package-card__cta { padding: 0 1.5rem 1.5rem; }
    .rk-package-card__cta .rk-btn { width: 100%; justify-content: center; }

    /* ══════════════════════════════════════════════════════
       TESTIMONIALS
       ══════════════════════════════════════════════════════ */
    .rk-testimonials { padding: 4rem 0; }

    .rk-testimonial-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }

    .rk-testimonial-card {
        background: var(--cream);
        border-radius: var(--radius-lg);
        padding: 1.75rem;
    }

    .rk-testimonial-card__stars {
        color: #ffa000;
        font-size: 0.9rem;
        margin-bottom: 0.75rem;
    }

    .rk-testimonial-card__text {
        font-size: 0.875rem;
        color: var(--text-secondary);
        line-height: 1.7;
        font-style: italic;
        margin-bottom: 0.85rem;
    }

    .rk-testimonial-card__author {
        font-size: 0.78rem;
        font-weight: 600;
        color: var(--text);
    }

    .rk-testimonial-card__avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        object-fit: cover;
        margin-bottom: 0.5rem;
    }

    .rk-testimonial-card video {
        width: 100%;
        border-radius: var(--radius);
        margin-bottom: 0.75rem;
    }

    /* ══════════════════════════════════════════════════════
       RISK-FREE
       ══════════════════════════════════════════════════════ */
    .rk-risk-free { padding: 3.5rem 0; background: var(--cream); }

    .rk-risk-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }

    .rk-risk-card { text-align: center; padding: 1.5rem; }

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

    .rk-risk-card__icon svg { width: 24px; height: 24px; stroke: var(--green); }

    .rk-risk-card__title {
        font-size: 1rem;
        font-weight: 700;
        margin-bottom: 0.25rem;
    }

    .rk-risk-card__desc {
        font-size: 0.825rem;
        color: var(--text-secondary);
        line-height: 1.5;
    }

    /* ══════════════════════════════════════════════════════
       FINAL CTA
       ══════════════════════════════════════════════════════ */
    .rk-final-cta { padding: 4rem 0; text-align: center; }

    .rk-final-cta__title {
        font-family: var(--font-display);
        font-size: 1.75rem;
        font-weight: 700;
        margin-bottom: 0.5rem;
    }

    .rk-final-cta__sub {
        font-size: 0.95rem;
        color: var(--text-secondary);
        margin-bottom: 1.5rem;
    }

    /* ══════════════════════════════════════════════════════
       FREE COURSE FORM
       ══════════════════════════════════════════════════════ */
    .rk-free-form { padding: 2.5rem 0; background: var(--cream); }
    .rk-free-form__inner { max-width: 500px; margin: 0 auto; }
    .rk-free-form input[type="text"],
    .rk-free-form input[type="email"] {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid var(--border-strong);
        border-radius: var(--radius);
        font-family: var(--font-body);
        font-size: 0.9rem;
        margin-bottom: 0.75rem;
    }

    /* ══════════════════════════════════════════════════════
       WEBINAR CAROUSEL (kurs 17)
       ══════════════════════════════════════════════════════ */
    .rk-webinars { padding: 4rem 0; }

    .rk-webinar-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }

    .rk-webinar-card {
        background: #fff;
        border: 1px solid var(--border);
        border-radius: var(--radius-lg);
        overflow: hidden;
    }

    .rk-webinar-card__thumb {
        height: 160px;
        background-size: cover;
        background-position: center 20%;
        background-color: #e8e4df;
    }

    .rk-webinar-card__body { padding: 1.25rem; }

    .rk-webinar-card__date {
        font-size: 0.72rem;
        color: var(--text-muted);
        margin-bottom: 0.35rem;
    }

    .rk-webinar-card__title {
        font-size: 1rem;
        font-weight: 700;
        margin-bottom: 0.5rem;
    }

    .rk-webinar-card__desc {
        font-size: 0.825rem;
        color: var(--text-secondary);
        line-height: 1.6;
    }

    /* ══════════════════════════════════════════════════════
       RESPONSIVE
       ══════════════════════════════════════════════════════ */
    @media (max-width: 768px) {
        .rk-hero__inner { grid-template-columns: 1fr; }
        .rk-package-grid { grid-template-columns: 1fr; }
        .rk-package-card--popular { transform: none; }
        .rk-testimonial-grid { grid-template-columns: 1fr; }
        .rk-risk-grid { grid-template-columns: 1fr; }
        .rk-hero__trust { flex-wrap: wrap; gap: 0.75rem; }
        .rk-hero__title { font-size: 2rem; }
        .rk-webinar-grid { grid-template-columns: 1fr; }
    }