/*
Theme Name: Magazine Grid
Version: 2.1.0
Requires at least: 6.6
Requires PHP: 8.2
Text Domain: magazine-grid
License: GPL-2.0-or-later
*/
:root {
    --white:#fff;
    --ink:#111827;
    --orange:#e85c27;
    --blue:#2453d4;
    --grey:#e5e7eb;
    --frame:80rem;
}
* {
    box-sizing:border-box;
}
html {
    scroll-behavior:smooth;
}
body {
    margin:0;
    background:var(--white);
    color:var(--ink);
    font:1rem/1.55 Arial,Helvetica,sans-serif;
}
a {
    color:inherit;
    text-decoration-color:var(--orange);
    text-underline-offset:.2em;
}
a:focus-visible,summary:focus-visible {
    outline:4px solid var(--blue);
    outline-offset:3px;
}
img {
    max-width:100%;
    height:auto;
}
.skip-link {
    position:fixed;
    top:-5rem;
    left:1rem;
    padding:.8rem;
    color:white;
    background:var(--blue);
    z-index:8;
}
.skip-link:focus {
    top:1rem;
}
.magazine-header {
    width:min(100% - 2rem,var(--frame));
    margin:auto;
    border-bottom:4px solid var(--ink);
}
.header-bar {
    display:flex;
    justify-content:space-between;
    align-items:end;
    padding:1.5rem 0 .7rem;
}
.magazine-logo {
    font-size:clamp(1.8rem,4vw,3.3rem);
    font-weight:900;
    letter-spacing:-.06em;
    text-decoration:none;
    text-transform:uppercase;
}
.menu {
    display:flex;
    flex-wrap:wrap;
    gap:1.5rem;
    list-style:none;
    margin:0;
    padding:.7rem 0;
    border-top:1px solid var(--grey);
    font-size:.78rem;
    font-weight:800;
    text-transform:uppercase;
}
.magazine-front,.channel-archive,.magazine-page,.listing-channel,.listing-profile {
    width:min(100% - 2rem,var(--frame));
    margin:auto;
    padding-block:2rem 5rem;
}
.cover-line,.grid-heading {
    display:flex;
    justify-content:space-between;
    padding:.5rem 0;
    border-bottom:1px solid var(--ink);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.lead-package {
    display:grid;
    grid-template-columns:1fr 1.5fr;
    gap:2rem;
    padding:2rem 0 3rem;
}
.channel-line {
    color:var(--orange);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}
h1,h2,h3 {
    line-height:1.03;
    letter-spacing:-.025em;
}
h1 {
    margin:.2em 0;
    font-size:clamp(3rem,7vw,6.5rem);
}
.lead-deck {
    font-size:1.25rem;
    line-height:1.35;
}
.lead-visual {
    margin:0;
}
.lead-visual img {
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
}
figcaption {
    padding:.4rem 0;
    font-size:.8rem;
    color:#4b5563;
}
.newsroom-layout {
    display:grid;
    grid-template-columns:minmax(0,3fr) minmax(15rem,1fr);
    gap:2rem;
    border-top:5px solid var(--ink);
    padding-top:1rem;
}
.feature-grid {
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:1rem;
}
.feature-grid>.grid-heading {
    grid-column:1/-1;
}
.story-tile {
    grid-column:span 3;
    border-bottom:1px solid var(--ink);
}
.story-tile--wide {
    grid-column:span 4;
    grid-row:span 2;
}
.story-tile--tall {
    grid-column:span 2;
}
.tile-image img {
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
}
.story-tile--tall .tile-image img {
    aspect-ratio:3/4;
}
.story-tile h2,.story-tile h3 {
    margin:.25rem 0;
    font-size:1.55rem;
}
.story-tile--wide h2 {
    font-size:clamp(2rem,4vw,3.5rem);
}
.listing-rail {
    border-left:1px solid var(--ink);
    padding-left:1.5rem;
}
.listing-rail>header {
    border-bottom:4px solid var(--ink);
}
.rail-listing {
    display:grid;
    grid-template-columns:5rem 1fr;
    gap:.8rem;
    padding:1.2rem 0;
    border-bottom:1px solid var(--grey);
}
.rail-listing img {
    width:100%;
    aspect-ratio:1;
    object-fit:cover;
}
.rail-listing h3 {
    margin:0;
}
.verified-dot {
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    color:#19623a;
    font-size:.7rem;
    font-weight:800;
    text-transform:uppercase;
}
.verified-dot::before {
    content:'';
    width:.55rem;
    height:.55rem;
    border-radius:50%;
    background:currentColor;
}
.rail-briefing {
    margin-top:2rem;
    padding-top:1rem;
    border-top:4px solid var(--orange);
}
.rail-briefing details {
    padding:.8rem 0;
    border-bottom:1px solid var(--grey);
}
.long-read {
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:3rem;
    margin:5rem 0;
    padding-top:1rem;
    border-top:5px solid var(--blue);
}
.long-read-copy {
    max-width:48rem;
}
.long-read-copy p:first-child {
    font-size:1.2rem;
}
.photo-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1rem;
    margin-block:4rem;
}
.photo-grid>header {
    grid-column:1/-1;
    border-bottom:4px solid var(--ink);
}
.photo-grid figure {
    margin:0;
}
.photo-grid img {
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover;
}
.photo-grid figure:nth-of-type(1) {
    grid-column:span 2;
}
.editor-notes {
    display:grid;
    grid-template-columns:1fr 3fr;
    gap:2rem;
    border-top:5px solid var(--orange);
}
.editor-notes>div {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
}
.editor-notes article {
    border-bottom:1px solid var(--grey);
}
.channel-heading,.magazine-page article>header,.listing-channel>header,.listing-profile article>header {
    max-width:60rem;
    margin-bottom:3rem;
}
.archive-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1.5rem;
}
.archive-grid .story-tile--wide {
    grid-column:span 2;
}
.magazine-page article {
    max-width:64rem;
    margin:auto;
}
.article-body {
    max-width:46rem;
    margin:auto;
}
.article-lead img,.profile-lead img {
    width:100%;
    max-height:42rem;
    object-fit:cover;
}
.listing-board {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1rem;
}
.listing-board article {
    padding:1.5rem;
    border:1px solid var(--ink);
}
.profile-grid {
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:3rem;
    margin-top:3rem;
}
.profile-meta {
    align-self:start;
    padding:1.25rem;
    color:white;
    background:var(--ink);
}
.magazine-footer {
    display:grid;
    grid-template-columns:2fr 1fr auto;
    gap:2rem;
    width:min(100% - 2rem,var(--frame));
    margin:auto;
    padding:2rem 0;
    border-top:5px solid var(--ink);
}
.nav-links {
    display:flex;
    justify-content:space-between;
    margin-top:2rem;
}
@media(max-width:58rem){
    .lead-package,.newsroom-layout,.long-read,.editor-notes,.profile-grid {
        grid-template-columns:1fr;
    }
    .listing-rail {
        border-left:0;
        border-top:5px solid var(--ink);
        padding:1rem 0 0;
    }
    .archive-grid,.listing-board {
        grid-template-columns:1fr 1fr;
    }
}
@media(max-width:36rem){
    .feature-grid {
        display:block;
    }
    .story-tile {
        margin-bottom:1.5rem;
    }
    .photo-grid,.archive-grid,.listing-board,.editor-notes>div {
        grid-template-columns:1fr;
    }
    .photo-grid figure:nth-of-type(1) {
        grid-column:auto;
    }
    .magazine-footer {
        grid-template-columns:1fr;
    }
}
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after {
        scroll-behavior:auto!important;
        transition:none!important;
        animation:none!important;
    }
}
@media(forced-colors:active){
    .story-tile,.listing-board article,.listing-rail {
        border-color:CanvasText;
    }
}