/* Ratchet Learning — Teal/Gold Theme */

[data-brand="rl"] {
    --color-primary: #0d9488;
    --color-primary-rgb: 13, 148, 136;
    --color-primary-dark: #0f766e;
    --color-primary-light: #14b8a6;
    /* Warm gold accent replaces the original slate (#334155) which produced
       a monochromatic cool palette where every accent read as shadow. The
       teal↔gold pairing is complementary-adjacent, gives the hero headline
       real contrast against the dark-teal gradient, and warms up the page
       without fighting the book's editorial tone. */
    --color-accent: #d4a574;
    --color-accent-rgb: 212, 165, 116;
    --color-accent-bright: #fbbf24;

    --color-bg: #f8fafb;
    --color-bg-elevated: #ffffff;
    --color-bg-card: #ffffff;
    --color-bg-card-hover: #f0fdfa;
    --color-bg-subtle: #e0f2f1;

    --color-text: #0f172a;
    --color-text-secondary: #475569;
    --color-text-tertiary: #5f7390;
    --color-text-inverse: #ffffff;

    --color-border: rgba(15, 23, 42, 0.08);
    --color-border-hover: rgba(15, 23, 42, 0.15);

    --gradient-hero: linear-gradient(135deg, #134e4a 0%, #0f766e 40%, #0f172a 100%);
    --gradient-accent: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
    /* Hero gradient-text goes teal→bright amber so "Forward only." reads as a
       highlight on the dark hero instead of sinking into it (previous teal→slate
       rendered as ghost text at low contrast). Both endpoints chosen to clear
       WCAG AA against the dark-teal hero background. */
    --gradient-text: linear-gradient(135deg, #14b8a6 0%, #fbbf24 100%);
    --gradient-card: linear-gradient(145deg, rgba(13,148,136,0.03) 0%, rgba(212,165,116,0.04) 100%);
    --gradient-glow: radial-gradient(ellipse at 50% 0%, rgba(13,148,136,0.12) 0%, transparent 60%);

    --pattern-dots: radial-gradient(circle, rgba(15,23,42,0.04) 1px, transparent 1px);
    --pattern-size: 24px 24px;

    color-scheme: light;
}

/* Hero text on gradient */
[data-brand="rl"] .hero--gradient { color: #fff; }
[data-brand="rl"] .hero--gradient .hero__subtitle { color: rgba(255,255,255,0.85); }
[data-brand="rl"] .hero--gradient .hero__eyebrow {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
    color: #ffffff;
}

/* Header on gradient hero */
[data-brand="rl"] .site-header { color: #ffffff; }
[data-brand="rl"] .site-header .nav-link { color: rgba(255, 255, 255, 0.85); }
[data-brand="rl"] .site-header .nav-link:hover { color: #ffffff; background: rgba(255, 255, 255, 0.15); }
[data-brand="rl"] .site-header .logo { color: #ffffff; }
[data-brand="rl"] .site-header.scrolled { background: rgba(255, 255, 255, 0.95); }
[data-brand="rl"] .site-header.scrolled .nav-link { color: var(--color-text-secondary); }
[data-brand="rl"] .site-header.scrolled .nav-link:hover { color: var(--color-text); background: var(--color-border); }
[data-brand="rl"] .site-header.scrolled .logo { color: var(--color-text); }

/* Five Verbs list — the spine of the book, on /about */
[data-brand="rl"] .verbs-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    max-width: 680px;
    margin: 0 auto;
}
[data-brand="rl"] .verbs-list__item {
    display: flex;
    gap: var(--space-4);
    align-items: flex-start;
    padding: var(--space-4);
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    transition: border-color 0.2s ease, transform 0.2s ease;
}
[data-brand="rl"] .verbs-list__item:hover {
    border-color: var(--color-primary);
    transform: translateX(4px);
}
[data-brand="rl"] .verbs-list__num {
    font-family: 'Playfair Display', serif;
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1;
    min-width: 3ch;
    letter-spacing: var(--tracking-tight);
}
[data-brand="rl"] .verbs-list__body { flex: 1; }
[data-brand="rl"] .verbs-list__verb {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-text);
    margin: 0 0 var(--space-2) 0;
    letter-spacing: var(--tracking-tight);
}
[data-brand="rl"] .verbs-list__text {
    color: var(--color-text-secondary);
    line-height: var(--leading-relaxed);
    margin: 0;
}

