/* =============================================================================
   OWW — EDUCATION HUB PAGE
   assets/css/page-education.css | Version: 3.7.0
   Scope: .oww-education / body.oww-page--education
   ============================================================================= */

/* ── HERO ─────────────────────────────────────────────────────────────────── */

.oww-education__hero {
    padding:   clamp(6rem, 14vw, 10rem) 0 clamp(4rem, 8vw, 6rem);
    position:  relative;
    overflow:  hidden;
}

.oww-education__hero::before {
    content:    '';
    position:   absolute;
    inset:      0;
    background: radial-gradient(ellipse 60% 50% at 20% 0%, rgba(205,165,100,.07) 0%, transparent 70%);
    pointer-events: none;
}

.oww-education__hero-eyebrow {
    display:        block;
    font-size:      .65rem;
    font-weight:    700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  var(--oww-space-md);
}

.oww-education__hero-title {
    font-family: var(--oww-ff-display);
    font-size:   clamp(2.2rem, 6vw, 4.5rem);
    font-weight: 200;
    color:       var(--oww-cream);
    line-height: 1.05;
    margin:      0 0 var(--oww-space-lg);
    max-width:   640px;
}

.oww-education__hero-copy {
    font-size:   clamp(.95rem, 1.5vw, 1.1rem);
    line-height: 1.75;
    color:       var(--oww-cream-muted);
    max-width:   520px;
    margin:      0;
}

/* ── LEARNING PATHS GRID ──────────────────────────────────────────────────── */

.oww-education__paths {
    padding:    clamp(3rem, 6vw, 5rem) 0;
}

.oww-education__paths-header {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.oww-education__paths-title {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.4rem, 3vw, 2rem);
    font-weight: 300;
    color:       var(--oww-cream);
    margin:      0 0 .5rem;
}

.oww-education__paths-desc {
    font-size: .9rem;
    color:     var(--oww-cream-muted);
    margin:    0;
}

.oww-education__paths-grid {
    display:               grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap:                   1.25rem;
}

@media (min-width: 768px)  { .oww-education__paths-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .oww-education__paths-grid { grid-template-columns: repeat(4, 1fr); } }

/* ── LEARNING PATH CARD ───────────────────────────────────────────────────── */

.oww-edu-card {
    background:     var(--oww-bg-card);
    border:         1px solid var(--oww-bronze-10);
    border-radius:  var(--oww-radius-md);
    padding:        1.75rem 1.5rem;
    display:        flex;
    flex-direction: column;
    gap:            1rem;
    text-decoration: none;
    position:       relative;
    overflow:       hidden;
    transition:     border-color .25s var(--oww-ease-out),
                    transform    .25s var(--oww-ease-out),
                    box-shadow   .25s var(--oww-ease-out);
}

.oww-edu-card:hover:not(.oww-edu-card--locked) {
    border-color: var(--oww-bronze-30);
    transform:    translateY(-3px);
    box-shadow:   var(--oww-shadow-md);
}

.oww-edu-card--locked { cursor: default; opacity: .65; }

.oww-edu-card__status {
    display:        inline-flex;
    align-items:    center;
    font-size:      .6rem;
    font-weight:    700;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding:        .25em .65em;
    border-radius:  4px;
    align-self:     flex-start;
}

.oww-edu-card__status--live {
    color:      var(--oww-bg-dark);
    background: var(--oww-amber);
}

.oww-edu-card__status--soon {
    color:        var(--oww-cream-faint);
    background:   rgba(245,240,232,.07);
    border:       1px solid rgba(245,240,232,.12);
}

.oww-edu-card__icon {
    width:  36px;
    height: 36px;
    color:  var(--oww-amber);
    opacity: .8;
}

.oww-edu-card__title {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.15rem, 2vw, 1.4rem);
    font-weight: 400;
    color:       var(--oww-cream);
    line-height: 1.2;
    margin:      0;
}

.oww-edu-card__desc {
    font-size:   .85rem;
    color:       var(--oww-cream-muted);
    line-height: 1.65;
    margin:      0;
    flex:        1;
}

.oww-edu-card__cta {
    display:     flex;
    align-items: center;
    gap:         .35rem;
    font-size:   .75rem;
    font-weight: 600;
    color:       var(--oww-amber);
    margin-top:  auto;
    padding-top: .75rem;
    border-top:  1px solid var(--oww-bronze-10);
}

.oww-edu-card--locked .oww-edu-card__cta { color: var(--oww-cream-faint); }

/* ── CREDENTIALS STRIP ────────────────────────────────────────────────────── */

.oww-education__credentials {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             clamp(1rem, 3vw, 2.5rem);
    flex-wrap:       wrap;
    padding:         2rem 0;
    border-top:      1px solid var(--oww-bronze-20);
    border-bottom:   1px solid var(--oww-bronze-20);
    margin:          clamp(3rem, 6vw, 5rem) 0;
}

.oww-education__cred {
    display:        flex;
    align-items:    center;
    gap:            .5rem;
    font-size:      .7rem;
    font-weight:    600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color:          var(--oww-cream-muted);
}

.oww-education__cred-dot {
    width:     5px;
    height:    5px;
    background: var(--oww-amber);
    border-radius: 50%;
    flex-shrink: 0;
}

/* ── PHILOSOPHY QUOTE ─────────────────────────────────────────────────────── */

.oww-education__philosophy {
    text-align:    center;
    padding:       clamp(3rem, 6vw, 5rem) 0;
    margin-bottom: clamp(3rem, 6vw, 5rem);
}

.oww-education__philosophy blockquote {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.4rem, 3.5vw, 2.2rem);
    font-weight: 300;
    font-style:  italic;
    color:       var(--oww-cream);
    max-width:   600px;
    margin:      0 auto var(--oww-space-lg);
    line-height: 1.45;
}

.oww-education__philosophy cite {
    font-size:      .7rem;
    font-weight:    600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    font-style:     normal;
}

/* ── DUAL CTA ─────────────────────────────────────────────────────────────── */

.oww-education__cta-row {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             1rem;
    flex-wrap:       wrap;
    margin-bottom:   clamp(3rem, 6vw, 5rem);
}

@media (prefers-reduced-motion: reduce) {
    .oww-edu-card { transition: none; }
}
