/* =============================================================================
   OWW — ARTICLE / WANDERINGS POST PAGE
   assets/css/page-article.css | Version: 3.7.2
   Scope: is_singular('post') — all Wanderings column articles
   Loaded: enqueue.php → is_singular('post')

   NOTE: This file was rebuilt in v3.7.2 after being accidentally overwritten
   during packaging in the previous release.
   ============================================================================= */

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

.oww-article__hero {
    padding:   clamp(5rem, 12vw, 8rem) 0 clamp(3rem, 6vw, 4.5rem);
    position:  relative;
    overflow:  hidden;
}

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

.oww-article__series {
    display:        flex;
    align-items:    center;
    gap:            .5rem;
    font-size:      .62rem;
    font-weight:    700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  var(--oww-space-md);
}

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

.oww-article__title {
    font-family:  var(--oww-ff-display);
    font-size:    clamp(2.2rem, 7vw, 5rem);
    font-weight:  200;
    color:        var(--oww-cream);
    line-height:  1.05;
    margin:       0 0 .75rem;
    letter-spacing: -.02em;
}

.oww-article__subtitle {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1rem, 2.2vw, 1.4rem);
    font-weight: 300;
    font-style:  italic;
    color:       var(--oww-amber);
    margin:      0 0 var(--oww-space-lg);
}

.oww-article__meta {
    display:     flex;
    align-items: center;
    gap:         1rem;
    flex-wrap:   wrap;
}

.oww-article__meta-author {
    font-size:   .78rem;
    font-weight: 600;
    color:       var(--oww-cream-muted);
}

.oww-article__meta-sep { color: var(--oww-bronze-30); font-size: .7rem; }

.oww-article__meta-pub {
    display:     flex;
    align-items: center;
    gap:         .35rem;
    font-size:   .72rem;
    color:       var(--oww-cream-faint);
    font-style:  italic;
}

.oww-article__meta-pub-link {
    color:           var(--oww-amber);
    text-decoration: none;
    font-style:      normal;
    font-weight:     600;
}

.oww-article__meta-pub-link:hover { opacity: .75; }


/* ── OPENING PULL QUOTE ───────────────────────────────────────────────────── */

.oww-article__lede {
    padding:       clamp(2rem, 4vw, 3.5rem) 0;
    border-top:    1px solid var(--oww-bronze-20);
    border-bottom: 1px solid var(--oww-bronze-20);
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.oww-article__lede blockquote {
    font-family:  var(--oww-ff-display);
    font-size:    clamp(1.15rem, 2.5vw, 1.7rem);
    font-weight:  300;
    font-style:   italic;
    color:        var(--oww-cream);
    line-height:  1.6;
    max-width:    720px;
    margin:       0;
    padding-left: clamp(1.5rem, 4vw, 3rem);
    border-left:  3px solid var(--oww-amber-deep);
}


/* ── SERIES INTRO ─────────────────────────────────────────────────────────── */

.oww-article__series-intro {
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    max-width:     680px;
}

.oww-article__series-intro p {
    font-size:   clamp(.95rem, 1.5vw, 1.05rem);
    line-height: 1.8;
    color:       var(--oww-cream-muted);
    margin:      0 0 1rem;
}

.oww-article__series-intro p:last-child { margin-bottom: 0; }


/* ── PAIRING AT A GLANCE ──────────────────────────────────────────────────── */

.oww-article__pairing { margin-bottom: clamp(2.5rem, 5vw, 4rem); }

.oww-article__pairing-heading {
    font-family:    var(--oww-ff-body);
    font-size:      .62rem;
    font-weight:    700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  1rem;
}

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

@media (min-width: 640px) {
    .oww-article__pairing-grid { grid-template-columns: repeat(2, 1fr); }
}

.oww-pairing-card {
    background:    var(--oww-bg-card);
    border:        1px solid var(--oww-bronze-10);
    border-top:    3px solid var(--oww-amber-deep);
    border-radius: var(--oww-radius-md);
    padding:       1.5rem;
    display:       flex;
    flex-direction: column;
    gap:           .75rem;
}

.oww-pairing-card__type {
    font-size:      .58rem;
    font-weight:    700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color:          var(--oww-amber);
}

.oww-pairing-card__name {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.1rem, 2.2vw, 1.4rem);
    font-weight: 400;
    color:       var(--oww-cream);
    line-height: 1.2;
    margin:      0;
}

.oww-pairing-card__details {
    list-style:  none;
    padding:     0;
    margin:      0;
    border-top:  1px solid var(--oww-bronze-10);
    padding-top: .75rem;
}

.oww-pairing-card__details li {
    display:     flex;
    gap:         .5rem;
    font-size:   .8rem;
    color:       var(--oww-cream-muted);
    padding:     .2rem 0;
    line-height: 1.4;
}

.oww-pairing-card__details li::before {
    content:     '·';
    color:       var(--oww-amber);
    flex-shrink: 0;
}


/* ── IN BRIEF ─────────────────────────────────────────────────────────────── */

.oww-article__in-brief { margin-bottom: clamp(2.5rem, 5vw, 4rem); }

.oww-article__in-brief-heading {
    font-family:    var(--oww-ff-display);
    font-size:      clamp(1.2rem, 2.5vw, 1.6rem);
    font-weight:    300;
    color:          var(--oww-cream);
    margin:         0 0 1.5rem;
    padding-bottom: 1rem;
    border-bottom:  1px solid var(--oww-bronze-10);
}

.oww-article__notes { display: flex; flex-direction: column; gap: 2rem; }

.oww-article__note { max-width: 640px; }

.oww-article__note-label {
    display:        block;
    font-size:      .6rem;
    font-weight:    700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  .5rem;
}

.oww-article__note p {
    font-size:   .95rem;
    line-height: 1.75;
    color:       var(--oww-cream-muted);
    margin:      0;
}


/* ── PAIRING VERDICT ──────────────────────────────────────────────────────── */

.oww-article__verdict {
    background:    var(--oww-bg-mid);
    border:        1px solid var(--oww-bronze-20);
    border-radius: var(--oww-radius-lg);
    padding:       clamp(1.5rem, 3vw, 2.5rem);
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    position:      relative;
    overflow:      hidden;
}

.oww-article__verdict::before {
    content:    '';
    position:   absolute;
    top:        0;
    left:       0;
    right:      0;
    height:     2px;
    background: linear-gradient(90deg, transparent, var(--oww-amber-deep) 30%, var(--oww-amber) 50%, var(--oww-amber-deep) 70%, transparent);
}

.oww-article__verdict-label {
    display:        block;
    font-size:      .58rem;
    font-weight:    700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  .75rem;
}

.oww-article__verdict p {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.1rem, 2.5vw, 1.5rem);
    font-weight: 300;
    font-style:  italic;
    color:       var(--oww-cream);
    line-height: 1.5;
    margin:      0;
}


/* ── READ FULL ARTICLE CTA ────────────────────────────────────────────────── */

.oww-article__full-cta {
    background:    var(--oww-bg-card);
    border:        1px solid var(--oww-bronze-20);
    border-radius: var(--oww-radius-lg);
    padding:       clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 4vw, 3rem);
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    display:       flex;
    gap:           2.5rem;
    align-items:   center;
    flex-wrap:     wrap;
}

.oww-article__full-cta-copy { flex: 1; min-width: 240px; }

.oww-article__full-cta-eyebrow {
    display:        block;
    font-size:      .6rem;
    font-weight:    700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color:          var(--oww-amber);
    margin-bottom:  .6rem;
}

.oww-article__full-cta h3 {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.15rem, 2.5vw, 1.5rem);
    font-weight: 300;
    color:       var(--oww-cream);
    margin:      0 0 .5rem;
}

.oww-article__full-cta p {
    font-size:   .875rem;
    color:       var(--oww-cream-muted);
    line-height: 1.65;
    margin:      0;
}

@media (max-width: 640px) {
    .oww-article__full-cta { flex-direction: column; }
}


/* ── BEHIND THE POUR (exclusive OWW content) ──────────────────────────────── */

.oww-article__exclusive {
    padding:       clamp(2rem, 4vw, 3.5rem) 0;
    border-top:    1px solid var(--oww-bronze-20);
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.oww-article__exclusive-label {
    display:        inline-flex;
    align-items:    center;
    gap:            .4rem;
    font-size:      .6rem;
    font-weight:    700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color:          var(--oww-bg-dark);
    background:     var(--oww-amber);
    padding:        .28em .75em;
    border-radius:  4px;
    margin-bottom:  1.25rem;
}

.oww-article__exclusive h3 {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.2rem, 2.5vw, 1.6rem);
    font-weight: 300;
    color:       var(--oww-cream);
    margin:      0 0 1rem;
}

.oww-article__exclusive p {
    font-size:   clamp(.9rem, 1.4vw, 1rem);
    line-height: 1.85;
    color:       var(--oww-cream-muted);
    max-width:   640px;
    margin:      0 0 1rem;
}

.oww-article__exclusive p:last-child { margin-bottom: 0; }


/* ── SERIES FOOTER CTA ────────────────────────────────────────────────────── */

.oww-article__series-footer {
    background:    var(--oww-bg-mid);
    border:        1px solid var(--oww-bronze-20);
    border-radius: var(--oww-radius-lg);
    padding:       clamp(2rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem);
    text-align:    center;
    margin-bottom: clamp(3rem, 6vw, 5rem);
}

.oww-article__series-footer h3 {
    font-family: var(--oww-ff-display);
    font-size:   clamp(1.2rem, 2.5vw, 1.6rem);
    font-weight: 300;
    color:       var(--oww-cream);
    margin:      0 0 .6rem;
}

.oww-article__series-footer p {
    font-size:   .9rem;
    color:       var(--oww-cream-muted);
    max-width:   400px;
    margin:      0 auto 1.5rem;
}