/* ============================================================
   womens — Women's editorial-lifestyle page template
   Chrome-less (own masthead + footer), accent re-tinted via the
   Women's Accent / Dark Accent settings (scoped palette emitted
   in niriv_head_styles). Scoped under body.niriv-womens.
   ============================================================ */
html:has(body.niriv-womens),
body.niriv-womens {
    overflow-x: clip;
}
body.niriv-womens {
    font-family: 'Fira Sans', 'FiraGO', system-ui, -apple-system, sans-serif;
    background: hsl(var(--background));
    color: hsl(var(--foreground));
}
body.niriv-womens #main-content {
    padding-top: 0 !important;
}
body.niriv-womens a {
    text-decoration: none;
}
body.niriv-womens img {
    max-width: 100%;
}

/* ---------- shared layout ---------- */
.wms-wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 16px;
}
@media (min-width: 1024px) {
    .wms-wrap {
        padding: 0 24px;
    }
}
.wms-section {
    margin-top: 38px;
}

/* Section header: heading + inline rule starting right after the text */
.wms-sechead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    border-bottom: 1px solid hsl(var(--border));
    padding-bottom: 10px;
}
.wms-sechead h2 {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: hsl(var(--foreground));
    margin: 0;
}
.wms-sechead h2 .wms-sechead-accent {
    color: hsl(var(--primary));
}
.wms-sechead.wms-sechead-line {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 18px;
}
.wms-sechead.wms-sechead-line::after {
    content: '';
    flex: 1 1 auto;
    height: 1px;
    background: hsl(var(--border));
    margin-left: 16px;
}
.wms-sechead a.wms-seeall {
    font-size: 12.5px;
    font-weight: 700;
    color: hsl(var(--primary));
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.wms-sechead a.wms-seeall:hover {
    text-decoration: underline;
}

/* ---------- masthead ---------- */
.wms-header {
    background: hsl(var(--card));
    border-bottom: 1px solid hsl(var(--border));
    position: relative;
    z-index: 50;
}
.wms-header-top {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 64px;
}
.wms-brand {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    min-height: 44px;
}
.wms-brand img {
    height: 34px;
    width: auto;
}
.wms-brand-name {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-weight: 800;
    letter-spacing: -0.02em;
    font-size: 20px;
    color: hsl(var(--foreground));
    white-space: nowrap;
}
.wms-brand-name .wms-brand-word {
    color: hsl(var(--primary));
}
.wms-nav {
    display: none;
    align-items: center;
    gap: 2px;
    margin-left: 6px;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}
.wms-nav::-webkit-scrollbar {
    display: none;
}
@media (min-width: 1024px) {
    .wms-nav {
        display: flex;
    }
}
.wms-nav a {
    font-size: 13px;
    font-weight: 600;
    color: hsl(var(--muted-foreground));
    padding: 6px 10px;
    border-radius: 999px;
    white-space: nowrap;
    transition: color 0.15s ease, background 0.15s ease;
}
.wms-nav a:hover {
    color: hsl(var(--primary));
    background: hsl(var(--accent));
}
.wms-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    flex-shrink: 0;
}
.wms-ps-btn {
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 14px 0 12px;
    border-radius: var(--radius);
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    color: hsl(var(--foreground));
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
    white-space: nowrap;
}
.wms-ps-btn:hover {
    background: hsl(var(--accent));
    border-color: hsl(var(--border) / 0.8);
}
.wms-ps-btn:active {
    transform: translateY(1px);
}
.wms-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 38px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    color: hsl(var(--foreground));
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.1s ease;
    white-space: nowrap;
}
.wms-btn:hover {
    background: hsl(var(--accent));
    border-color: hsl(var(--border) / 0.8);
}
.wms-btn:active {
    transform: translateY(1px);
}
.wms-btn-primary {
    background: hsl(var(--primary));
    border-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}
.wms-btn-primary:hover {
    background: hsl(var(--primary));
    opacity: 0.92;
    color: hsl(var(--primary-foreground));
}
.wms-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    width: 38px;
    border-radius: 999px;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    color: hsl(var(--foreground));
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.wms-icon-btn:hover {
    background: hsl(var(--accent));
}

/* Topic pill row */
.wms-pills {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 2px 14px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.wms-pills::-webkit-scrollbar {
    display: none;
}
.wms-pill {
    flex: 0 0 auto;
    border: 1px solid hsl(var(--border));
    border-radius: 999px;
    padding: 7px 13px;
    color: hsl(var(--muted-foreground));
    background: hsl(var(--card));
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s ease;
}
.wms-pill:hover {
    color: hsl(var(--primary));
    border-color: hsl(var(--primary) / 0.35);
}
.wms-pill-active {
    background: hsl(var(--primary));
    border-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}
.wms-pill-active:hover {
    color: hsl(var(--primary-foreground));
}

/* ---------- welcome banner ---------- */
.wms-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-radius: var(--radius);
    padding: 22px 20px;
    border: 1px solid hsl(var(--border) / 0.6);
    background:
        radial-gradient(circle at 92% 8%, hsl(var(--primary) / 0.22), transparent 40%),
        radial-gradient(circle at 6% 100%, hsl(var(--primary) / 0.10), transparent 45%),
        linear-gradient(135deg, hsl(var(--primary) / 0.08), hsl(var(--card)) 72%);
    overflow: hidden;
    position: relative;
    margin-top: 0;
}
.wms-welcome-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: hsl(var(--primary));
}
.wms-welcome h1 {
    font-size: 30px;
    font-weight: 850;
    letter-spacing: -0.03em;
    margin: 8px 0 0;
    color: hsl(var(--foreground));
    line-height: 1.05;
}
.wms-welcome h1 .wms-welcome-accent {
    color: hsl(var(--primary));
}
.wms-welcome-copy > p {
    margin: 10px 0 0;
    max-width: 520px;
    font-size: 14px;
    line-height: 1.55;
    color: hsl(var(--muted-foreground));
}
.wms-welcome-art {
    position: relative;
    z-index: 1;
    flex: 0 0 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: hsl(var(--primary));
    border: 1px dashed hsl(var(--primary) / 0.3);
    border-radius: 50%;
    transform: rotate(6deg);
    background: hsl(var(--primary) / 0.06);
}
.wms-welcome-art i {
    transform: rotate(-6deg);
}
@media (max-width: 639px) {
    .wms-welcome {
        padding: 18px 16px;
    }
    .wms-welcome h1 {
        font-size: 24px;
    }
    .wms-welcome-art {
        display: none;
    }
}

/* ---------- cards ---------- */
/* Media wrappers used in markup each get overflow containment + full-bleed
   cover images (mirrors ednews). The img rules must target the wrapper
   classes actually emitted (wms_media() prints a bare <img> inside them). */
.wms-hero-media,
.wms-card-media,
.wms-row-media {
    display: block;
    position: relative;
    overflow: hidden;
    background: hsl(var(--muted));
}
.wms-hero-media img,
.wms-card-media img,
.wms-row-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.wms-ph {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 120px;
    background: linear-gradient(135deg, hsl(var(--primary) / 0.12), hsl(var(--muted)));
}
.wms-card-media .wms-ph {
    min-height: 0;
}

.wms-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 7px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: hsl(var(--muted-foreground));
}
.wms-meta .wms-meta-cat {
    color: hsl(var(--primary));
    font-weight: 700;
}
.wms-meta a.wms-meta-cat:hover {
    text-decoration: underline;
}
.wms-dot {
    opacity: 0.55;
}

/* Featured hero — image 40% / copy 60% */
.wms-hero {
    display: grid;
    grid-template-columns: 1fr;
    overflow: hidden;
    border-radius: var(--radius);
    background: hsl(var(--card));
}
.wms-hero-media {
    display: block;
    aspect-ratio: 16/10;
}
@media (min-width: 768px) {
    .wms-hero {
        grid-template-columns: 1fr 1fr;
    }
    /* Same stature as the editorial news top card (its media is 320px+ tall) —
       without a floor the image column shrinks to the copy height and the
       featured card looks squat next to the news one. */
    .wms-hero-media {
        aspect-ratio: auto;
        height: 100%;
        min-height: 320px;
    }
}
.wms-hero-copy {
    padding: 20px 22px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.wms-hero-copy h2 {
    margin: 10px 0 0;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.18;
    color: hsl(var(--foreground));
}
.wms-hero-copy h2 a {
    color: inherit;
}
.wms-hero-copy h2 a:hover {
    color: hsl(var(--primary));
}
.wms-hero-copy .wms-excerpt {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: hsl(var(--muted-foreground));
}
.wms-readmore {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    font-size: 13px;
    font-weight: 700;
    color: hsl(var(--primary));
}
.wms-readmore:hover {
    text-decoration: underline;
}
@media (max-width: 899px) {
    .wms-hero-copy h2 {
        font-size: 20px;
    }
    .wms-welcome h1 {
        font-size: 30px;
    }
}

/* Compact cards (For Her Picks, subcategory grids) */
.wms-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--radius);
    background: hsl(var(--card));
}
.wms-card-media {
    display: block;
    aspect-ratio: 16/10;
}
.wms-card-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 13px 14px 15px;
}
.wms-card-body h3 {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    color: hsl(var(--foreground));
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wms-card-body h3 a {
    color: inherit;
}
.wms-card-body h3 a:hover {
    color: hsl(var(--primary));
}
.wms-card-excerpt {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: hsl(var(--muted-foreground));
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wms-card .wms-meta {
    font-size: 10.5px;
}

/* Horizontal list rows inside subcategory columns */
.wms-row {
    display: flex;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid hsl(var(--border) / 0.7);
}
.wms-row:last-child {
    border-bottom: 0;
    padding-bottom: 2px;
}
.wms-row-media {
    display: block;
    flex: 0 0 92px;
    aspect-ratio: 16/10;
    border-radius: 10px;
    overflow: hidden;
    background: hsl(var(--muted));
}
.wms-row-body {
    min-width: 0;
    flex: 1;
}
.wms-row-body h4 {
    margin: 3px 0 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    color: hsl(var(--foreground));
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wms-row-body h4 a {
    color: inherit;
}
.wms-row-body h4 a:hover {
    color: hsl(var(--primary));
}
@media (max-width: 639px) {
    .wms-row-media {
        flex-basis: 84px;
    }
}

/* Category columns (split) */
.wms-split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
}
@media (min-width: 768px) {
    .wms-split {
        grid-template-columns: 1fr 1fr;
        column-gap: 32px;
    }
}
/* One subcategory only → full width with a roomier list so it never looks broken */
.wms-split.wms-split-single {
    grid-template-columns: 1fr;
    max-width: 720px;
}

/* Lifestyle strip — horizontal scroll of mini overlay cards */
.wms-strip {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(210px, 1fr);
    gap: 14px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}
.wms-strip::-webkit-scrollbar {
    display: none;
}
.wms-strip-card {
    scroll-snap-align: start;
    border-radius: var(--radius);
    overflow: hidden;
    background: hsl(var(--card));
    display: flex;
    flex-direction: column;
}
.wms-strip-card .wms-card-media {
    aspect-ratio: 16/10;
}
.wms-strip-card .wms-card-body {
    padding: 12px 13px 14px;
}
.wms-strip-card .wms-card-body h3 {
    font-size: 13.5px;
    -webkit-line-clamp: 3;
}

/* Featured editorial flow — single full-width column (no side rail) */
.wms-layout {
    margin-top: 18px;
}

/* ---------- trending (ednews-style ranked list at the end) ---------- */
.wms-ranked {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
@media (min-width: 768px) {
    .wms-ranked {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 419px) {
    .wms-ranked {
        grid-template-columns: 1fr;
    }
}
.wms-ranked-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px;
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    background: hsl(var(--card));
    transition: border-color 0.15s ease;
}
.wms-ranked-item:hover {
    border-color: hsl(var(--primary) / 0.35);
}
.wms-rank-num {
    font-size: 34px;
    font-weight: 800;
    font-style: italic;
    line-height: 1;
    color: hsl(var(--primary) / 0.75);
    flex-shrink: 0;
    min-width: 34px;
}
.wms-ranked-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.wms-ranked-title {
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.35;
    color: hsl(var(--foreground));
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wms-ranked-title a {
    color: inherit;
}
.wms-ranked-title a:hover {
    color: hsl(var(--primary));
}

/* ---------- footer ---------- */
.wms-footer {
    margin-top: 56px;
    border-top: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    padding: 40px 0 128px;
}
@media (min-width: 1024px) {
    .wms-footer {
        padding-bottom: 96px;
    }
}
.wms-footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 26px;
}
@media (min-width: 768px) {
    .wms-footer-grid {
        grid-template-columns: 1.5fr 1fr 1fr 1fr;
        gap: 28px;
    }
}
.wms-footer-brand p {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.6;
    color: hsl(var(--muted-foreground));
    max-width: 260px;
}
.wms-footer-col h4 {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: hsl(var(--foreground));
}
.wms-footer-col ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.wms-footer-col li a {
    font-size: 13.5px;
    font-weight: 500;
    color: hsl(var(--muted-foreground));
    transition: color 0.15s ease;
}
.wms-footer-col li a:hover {
    color: hsl(var(--primary));
}
.wms-footer-bottom {
    margin-top: 32px;
    padding-top: 20px;
    border-top: 1px solid hsl(var(--border));
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    font-size: 12.5px;
    color: hsl(var(--muted-foreground));
}
.wms-footer-bottom-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 14px;
}
.wms-footer-bottom-nav a {
    color: hsl(var(--muted-foreground));
}
.wms-footer-bottom-nav a:hover {
    color: hsl(var(--primary));
}

/* ---------- responsive ---------- */
@media (min-width: 768px) {
    .wms-pills {
        justify-content: center;
    }
}

/* Mobile: 10px content gutters; masthead + footer backgrounds full-bleed.
   Mirrors the ednews template: zero the global #main-content gutters and let
   .wms-wrap supply the spacing (out-specify custom.css main#main-content > *). */
@media (max-width: 1023px) {
    body.niriv-womens #main-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
@media (max-width: 767px) {
    .wms-wrap {
        padding-left: 10px;
        padding-right: 10px;
    }
    #main-content > .wms-wrap {
        padding-left: 10px;
        padding-right: 10px;
    }
    /* The FOOTER gets a wider gutter than the page above it. The 10px shared
       gutter is right for cards, because a card adds ~12px of its own padding
       and its copy lands ~22px off the edge; the footer is bare text straight
       on the band, so at 10px its heading and links read as though they are
       falling off the page. 20px gives the copy the same breathing room the
       card copy has, without pulling the band's background off the edge. */
    .wms-footer .wms-wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
    .wms-brand img {
        height: 30px;
    }
    .wms-brand-name {
        font-size: 17px;
    }
    .wms-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px 20px;
    }
    .wms-footer-brand {
        grid-column: 1 / -1;
    }
    /* The site column -- the site name over the footer menu (About, Privacy,
       Terms, NiguroBot) -- is dropped on phones. Every one of those links is
       already in the policy bar directly below it, so the column only repeats
       itself and pushes the copyright further down. */
    .wms-footer-col--site {
        display: none;
    }
    .wms-pills {
        padding-left: 0;
        padding-right: 0;
    }
}
@media (max-width: 639px) {
    .wms-card-body {
        padding: 10px;
    }
    .wms-card-body h3 {
        font-size: 13.5px;
    }
    .wms-card-body .wms-card-excerpt {
        display: none;
    }
    .wms-meta {
        font-size: 10px;
    }
    .wms-hero-copy {
        padding: 16px 16px 18px;
    }
    .wms-hero-copy h2 {
        font-size: 18px;
    }
    .wms-hero-copy .wms-excerpt {
        font-size: 13px;
    }
}

/* ============================================================
   womens single — editorial-lifestyle article reading layout
   (single-womens.php, routed for posts under the Women's category)
   ============================================================ */
.wms-single-wrap {
    padding-top: 14px;
    padding-bottom: 56px;
    /* A single story uses the same 850px column as the main news article
       (single.php). The Women's index/archive keeps the wider
       .wms-wrap limit. */
    max-width: 850px;
}
@media (min-width: 1024px) {
    /* Desktop: the page gutter is dropped so the article card is the full 850px,
       matching single.php's card exactly (the reading column inside stays 760px;
       phones/tablets keep the gutter so the card never touches the edge). */
    .wms-single-wrap {
        padding-left: 0;
        padding-right: 0;
    }
}
.wms-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: hsl(var(--muted-foreground));
    margin: 4px 0 14px;
    transition: color 0.15s ease;
}
.wms-back:hover {
    color: hsl(var(--primary));
}

.wms-single-card {
    position: relative;
    background: hsl(var(--card));
    border-radius: var(--radius);
    overflow: hidden;
}
.wms-single-head {
    width: 100%;
    /* 760px reading measure + the 24px side padding each side, so the headline,
       standfirst and byline line up with single.php's 760px inner column. */
    max-width: 808px;
    margin-left: auto;
    margin-right: auto;
    padding: 26px 24px 20px;
}
.wms-single-kicker {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}
.wms-single-cat {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    background: hsl(var(--primary) / 0.12);
    color: hsl(var(--primary));
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    transition: background 0.15s ease, color 0.15s ease;
}
.wms-single-cat:hover {
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}
.wms-single-title {
    font-size: 30px;
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -0.025em;
    color: hsl(var(--foreground));
    margin: 0 0 12px;
    max-width: 100%;
}
.wms-single-excerpt {
    font-size: 15px;
    line-height: 1.65;
    color: hsl(var(--muted-foreground));
    margin: 0 0 16px;
    max-width: 100%;
}
.wms-single-byline {
    display: flex;
    align-items: center;
    gap: 10px;
}
.wms-single-avatar {
    flex-shrink: 0;
    border-radius: 999px;
    overflow: hidden;
    line-height: 0;
}
.wms-single-byline-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.wms-single-author {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13.5px;
    font-weight: 700;
    color: hsl(var(--foreground));
    white-space: nowrap;
}
.wms-single-author svg {
    flex: none;
}
.wms-single-author a {
    color: inherit;
}
.wms-single-author a:hover {
    color: hsl(var(--primary));
}
.wms-single-date {
    font-size: 12px;
    color: hsl(var(--muted-foreground));
}

.wms-single-media img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 520px;
    object-fit: cover;
}
.wms-single-media-ph {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    background:
        radial-gradient(circle at 28% 22%, hsl(var(--primary) / 0.65), transparent 62%),
        linear-gradient(135deg, hsl(var(--primary)) 0%, hsl(var(--primary) / 0.88) 55%, hsl(var(--primary) / 0.7) 100%);
    color: #fff;
    font-size: 26px;
    font-weight: 800;
    letter-spacing: 2px;
    text-shadow: 0 2px 8px rgb(0 0 0 / 0.35);
}
.wms-single-caption {
    padding: 8px 24px 0;
    text-align: center;
    font-size: 12px;
    color: hsl(var(--muted-foreground));
}
/* Head + article body share one centered reading column inside the card
   (equal left/right gutters) while the featured image above stays full-bleed
   edge-to-edge. */
.wms-single-body {
    width: 100%;
    /* 760px of body copy + 24px padding each side = single.php's inner column. */
    max-width: 808px;
    margin-left: auto;
    margin-right: auto;
    padding: 22px 24px 26px;
}
.wms-single-body .wms-article-content {
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.wms-single-body .wms-article-content p,
.wms-single-body .wms-article-content h1,
.wms-single-body .wms-article-content h2,
.wms-single-body .wms-article-content h3,
.wms-single-body .wms-article-content h4,
.wms-single-body .wms-article-content ul,
.wms-single-body .wms-article-content ol,
.wms-single-body .wms-article-content blockquote,
.wms-single-body .wms-article-content figure,
.wms-single-body .wms-article-content pre,
.wms-single-body .wms-article-content table {
    max-width: 100%;
}
.wms-live-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: hsl(0 84% 50%);
    background: hsl(0 84% 60% / 0.12);
    margin-bottom: 14px;
}
.wms-live-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: hsl(0 84% 50%);
    animation: live-pulse 1.5s ease-in-out infinite;
}
.wms-goto-updates {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #fff;
    background: hsl(135 45% 26%);
    margin: 0 0 14px 8px;
}
.wms-ended-chip {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    color: hsl(160 84% 40%);
    background: hsl(160 84% 40% / 0.14);
    margin-bottom: 14px;
}
.wms-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: hsl(var(--foreground));
    background: hsl(var(--primary) / 0.1);
    transition: background 0.15s ease, color 0.15s ease;
}
.wms-tag:hover {
    background: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}

.wms-single-comments {
    margin-top: 18px;
    background: hsl(var(--card));
    border-radius: var(--radius);
    padding: 20px 24px;
}

.wms-keep-reading {
    margin-top: 34px;
}
@media (min-width: 1024px) {
    /* The template marks the 4th Keep Reading card `lg:hidden` so desktop shows a
       single 3-column row. `.wms-read-card { display: flex }` is declared below
       Tailwind's rule in the cascade, so it needs the nudge here. */
    .wms-read-card.lg\:hidden { display: none; }
}
.wms-read-card {
    display: flex;
    flex-direction: column;
    background: hsl(var(--card));
    border-radius: var(--radius);
    overflow: hidden;
    transition: transform 0.15s ease;
}
.wms-read-card:hover {
    transform: translateY(-1px);
    border-color: hsl(var(--primary) / 0.35);
}
.wms-read-media {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: hsl(var(--muted));
}
.wms-read-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}
.wms-read-card:hover .wms-read-media img {
    transform: scale(1.03);
}
.wms-read-ph {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 30% 25%, hsl(var(--primary) / 0.5), transparent 60%),
        linear-gradient(135deg, hsl(var(--primary)) 0%, hsl(var(--primary) / 0.8) 100%);
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 2px;
}
.wms-read-body {
    padding: 13px 14px 15px;
}
.wms-read-body h3 {
    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.01em;
    margin: 0;
}
.wms-read-body h3 a {
    color: hsl(var(--foreground));
}
.wms-read-body h3 a:hover {
    color: hsl(var(--primary));
}
.wms-read-excerpt {
    font-size: 12.5px;
    line-height: 1.55;
    color: hsl(var(--muted-foreground));
    margin: 7px 0 0;
}
/* Archive cards: collapse the excerpt to a single line so every card in the
   grid stays short and even (used by category, tag and women's archives). */
.wms-read-excerpt.wms-read-line {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 639px) {
    .wms-single-head,
    .wms-single-body {
        padding-left: 16px;
        padding-right: 16px;
    }
    .wms-single-title {
        font-size: 24px;
    }
    .wms-single-caption {
        padding-left: 16px;
        padding-right: 16px;
    }
    .wms-single-comments {
        padding: 16px;
    }
    .wms-single-media-ph {
        min-height: 210px;
        font-size: 20px;
    }
}

/* ============================================================
   womens archive — subcategory pages inside the Women's tree
   (category-womens.php, routed for women's parent + subcategories)
   ============================================================ */
.wms-arch-wrap {
    padding-top: 14px;
    padding-bottom: 56px;
}
.wms-arch-hero {
    padding: 6px 0 4px;
}
.wms-arch-title {
    font-size: 32px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.025em;
    color: hsl(var(--foreground));
    margin: 12px 0 0;
}
.wms-arch-desc {
    font-size: 15px;
    line-height: 1.65;
    color: hsl(var(--muted-foreground));
    margin: 10px 0 0;
    max-width: 720px;
}
.wms-arch-count {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: hsl(var(--primary));
    margin: 12px 0 0;
}
.wms-arch-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}
.wms-arch-grid {
    margin-top: 26px;
}
.wms-arch-empty {
    text-align: center;
    padding: 64px 16px;
    color: hsl(var(--muted-foreground));
    font-size: 15px;
}
.wms-arch-empty .wms-btn {
    margin-top: 16px;
}

.wms-arch-wrap .navigation.pagination {
    display: flex;
    justify-content: center;
    margin-top: 34px;
}
.wms-arch-wrap .nav-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}
.wms-arch-wrap .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    color: hsl(var(--foreground));
    font-size: 13.5px;
    font-weight: 600;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.wms-arch-wrap .page-numbers:hover {
    background: hsl(var(--accent));
}
.wms-arch-wrap .page-numbers.current {
    background: hsl(var(--primary));
    border-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    cursor: default;
    pointer-events: none;
}
.wms-arch-wrap .page-numbers svg {
    width: 15px;
    height: 15px;
}
.wms-arch-wrap .page-numbers.dots {
    border: none;
    background: transparent;
    min-width: 24px;
}
@media (max-width: 639px) {
    .wms-arch-title {
        font-size: 25px;
    }
}

/* ---------- archive hero with follow aligned to the category title ---------- */
.wms-arch-hero-top {
    display: block;
}
.wms-arch-hero-main {
    min-width: 0;
    width: 100%;
}
.wms-arch-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
.wms-arch-aside {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    padding-top: 0;
    margin-top: 10px;
}
.wms-arch-aside .wms-btn {
    min-height: 34px;
    padding: 0 12px;
    gap: 6px;
    font-size: 13px;
}
.wms-arch-aside .wms-btn svg {
    width: 14px;
    height: 14px;
}
/* Keep the follow action beside the section title on phones. */
@media (max-width: 639px) {
    .wms-arch-title-row {
        align-items: center;
        gap: 8px 12px;
    }
    .wms-arch-title-row .wms-arch-title {
        flex: 1 1 170px;
        min-width: 0;
        margin-top: 10px;
    }
    .wms-arch-aside {
        align-items: flex-end;
        gap: 3px;
        margin-top: 10px;
    }
    .wms-arch-aside .wms-btn {
        min-height: 34px;
        padding: 0 12px;
    }
}
.wms-btn-following {
    background: hsl(var(--card));
    border-color: hsl(var(--primary) / 0.45);
    color: hsl(var(--primary));
}
.wms-btn-following:hover {
    background: hsl(var(--primary) / 0.08);
    border-color: hsl(var(--primary) / 0.45);
    color: hsl(var(--primary));
}

/* ---------- Read & Relate strip: desktop hover scroll arrows ---------- */
.wms-strip-wrap {
    position: relative;
}
.wms-strip-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    display: none;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card) / 0.92);
    color: hsl(var(--foreground));
    box-shadow: 0 3px 10px hsl(var(--foreground) / 0.16);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, background 0.15s ease, color 0.15s ease;
}
.wms-strip-arrow:hover {
    background: hsl(var(--accent));
}
.wms-strip-arrow--l {
    left: 6px;
}
.wms-strip-arrow--r {
    right: 6px;
}
@media (min-width: 1024px) {
    .wms-strip-arrow {
        display: inline-flex;
    }
    .wms-strip-wrap:hover .wms-strip-arrow.can-l,
    .wms-strip-wrap:hover .wms-strip-arrow.can-r {
        opacity: 1;
        pointer-events: auto;
    }
}

/* Welcome banner clears the masthead pills with the same vertical rhythm the
   editorial news template uses (its .edn-welcome sits ~28px below the header). */
.wms-wrap > .wms-section.wms-welcome {
    margin-top: 24px;
}

/* ---------- Follow / subscribe banner (editorial-news style, page bottom) ---------- */
.wms-subscribe {
    margin-top: 48px;
    border-radius: var(--radius);
    padding: 32px 20px;
    text-align: center;
    background:
        radial-gradient(circle at 15% 85%, hsl(var(--primary) / 0.14), transparent 42%),
        radial-gradient(circle at 85% 15%, hsl(var(--primary) / 0.10), transparent 40%),
        hsl(var(--muted) / 0.5);
}
.wms-subscribe .wms-sub-eyebrow {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: hsl(var(--primary));
    margin-bottom: 10px;
}
.wms-subscribe h2 {
    margin: 0 0 8px;
    font-size: clamp(22px, 3vw, 27px);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: hsl(var(--foreground));
}
.wms-subscribe h2 .wms-sub-accent {
    color: hsl(var(--primary));
}
.wms-subscribe p {
    margin: 0 0 20px;
    font-size: 14px;
    color: hsl(var(--muted-foreground));
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}
.wms-subscribe-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}
.wms-ps-btn-star {
    margin-left: 1px;
}

/* ---------- Women's social links (footer) ---------- */
.wms-socials {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0 0 14px;
}
.wms-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1px solid hsl(var(--border));
    background: hsl(var(--card));
    color: hsl(var(--muted-foreground));
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.wms-socials a:hover {
    color: hsl(var(--primary));
    border-color: hsl(var(--primary) / 0.4);
    background: hsl(var(--accent));
}
.wms-socials a svg {
    width: 17px;
    height: 17px;
}