/* Loaded exclusively by the magazine homepage in Style2027. */
html:has(.magazine-home) {
    --code-header-height-expanded: 72px;
    --code-logo-width-expanded: 150px;
    --code-menu-offset-expanded: 16px;
    --code-page-offset-desktop: 72px 0 0 0;
}

body:has(.magazine-home) {
    --code-header-height-expanded: 72px;
    --code-menu-offset-expanded: 16px;
}

body:has(.magazine-home) #header {
    color: #fff !important;
    border-bottom: 0;
}

body:has(.magazine-home) #header .headerImageNormal {
    display: none !important;
}

body:has(.magazine-home) #header .headerImageWhite {
    display: block !important;
}

body:has(.magazine-home) #header #menu a {
    color: #fff !important;
}

.magazine-home {
    --magazine-ink: #202124;
    --magazine-muted: #555b63;
    --magazine-rule: #d9dce0;
    --magazine-link: #995000;
    color: var(--magazine-ink);
    font-family: var(--code-font-ui);
    font-size: 1rem;
    line-height: 1.5;
}

.magazine-home *,
.magazine-home *::before,
.magazine-home *::after {
    box-sizing: border-box;
}

#page .magazine-home :is(h1, h2, h3, p, ol) {
    margin: 0;
    padding: 0;
    text-align: left;
}

#page .magazine-home :is(h1, h2, h3) {
    color: inherit;
    font-family: var(--code-font-editorial);
    font-weight: 700;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

#page .magazine-home h1 { font-size: clamp(2rem, 3.2vw, 3rem); }
#page .magazine-home h2 { font-size: clamp(1.75rem, 2.5vw, 2.25rem); }
#page .magazine-home h3 { font-size: 1.5rem; }

.magazine-home a,
.magazine-home a:visited {
    color: var(--magazine-link);
    text-underline-offset: .2em;
}

.magazine-home a:hover { text-decoration-thickness: 2px; }
.magazine-home a:focus-visible { outline: 3px solid var(--code-color-action); outline-offset: 4px; }
.magazine-home img { display: block; max-width: 100%; }

.magazine-home-inner {
    width: min(100% - 64px, 1200px);
    margin-inline: auto;
}

.magazine-home-masthead {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: #fff;
    background-color: var(--magazine-issue-accent, #102238);
}

#page .magazine-home-masthead.hero-header-panel {
    padding-top: 50px;
}

.magazine-home-artwork {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}

.magazine-home-artwork img {
    width: 100%;
    max-width: none;
    height: 100%;
    position: absolute;
    top: 0;
    object-fit: cover;
    object-position: 65% 45%;
    opacity: .3;
}

.magazine-home-artwork img[hidden] { display: none; }

.magazine-home-artwork::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--magazine-issue-accent) 72%, transparent),
        color-mix(in srgb, var(--magazine-issue-accent) 50%, transparent) 55%,
        color-mix(in srgb, var(--magazine-issue-accent) 15%, transparent));
}

@media (min-width: 900px) {
    #page .magazine-home-masthead.hero-header-panel { padding-top: 72px; }
}

@media (max-width: 899px) {
    .magazine-home-artwork img { object-position: 72% center; opacity: .24; }
}

.magazine-home-intro {
    display: grid;
    grid-template-columns: 175px minmax(0, 1fr);
    align-items: center;
    gap: 40px;
    padding-block: 28px 32px;
}

.magazine-home-cover img {
    width: 175px;
    height: auto;
    border-radius: 3px;
}

#page .magazine-home .magazine-home-eyebrow {
    font-family: var(--code-font-ui);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.magazine-home-masthead .magazine-home-eyebrow { color: #ffce42; }
#page .magazine-home .magazine-home-abstract { margin-top: 14px; font-size: 1rem; line-height: 1.55; max-width: 850px; }

.magazine-home-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 22px; }
.magazine-home-masthead a:not(.magazine-home-button) { color: #fff; }
.magazine-home .magazine-home-button { background: #ffca35; color: #172335; padding: 11px 22px; border-radius: 4px; font-weight: 700; text-decoration: none; }
.magazine-home-button span { margin-left: 14px; }
.magazine-home-mobile-archive { display: none; }
.magazine-home-mobile-overview { display: none; }

.magazine-home-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 36px;
    padding-block: 32px 40px;
}

.magazine-home-contents { min-width: 0; scroll-margin-top: 85px; }
#page .magazine-home .magazine-home-issue-label { margin-top: 5px; margin-bottom: 8px; color: var(--magazine-muted); font-size: .875rem; }
.magazine-home-articles { list-style: none; }
.magazine-home-article {
    display: grid;
    grid-template-columns: 34px 84px minmax(0, 1fr);
    gap: 18px;
    padding-block: 22px;
    border-bottom: 1px solid var(--magazine-rule);
    margin: 0;
}

.magazine-home-number { color: #a95a00; font-family: var(--code-font-editorial); font-size: 1.5rem; font-weight: 700; line-height: 1.2; }
.magazine-home-portraits { display: flex; flex-direction: column; gap: 8px; }
.magazine-home-portraits img { width: 84px; height: 84px; object-fit: cover; border-radius: 5px; background: #f1eeea; }
.magazine-home-article-copy { min-width: 0; overflow-wrap: anywhere; }
.magazine-home h3 a,
.magazine-home h3 a:visited { color: inherit; text-decoration: none; }
.magazine-home h3 a:hover { text-decoration: underline; }
#page .magazine-home .magazine-home-byline { margin-top: 6px; font-size: .875rem; font-weight: 600; }
.magazine-home-byline a,
.magazine-home-byline a:visited { color: inherit; text-decoration: none; }
.magazine-home-byline a:hover { text-decoration: underline; }
#page .magazine-home .magazine-home-article-abstract { margin-top: 7px; color: #41464d; font-size: .9375rem; line-height: 1.55; }

.magazine-home-sidebar { border-left: 1px solid var(--magazine-rule); padding-left: 24px; }
.magazine-home-archive { background: #f5f3f0; padding: 20px; border-radius: 5px; }
#page .magazine-home-archive h2 { font-size: 1.75rem; }
#page .magazine-home-archive > p:not(.magazine-home-eyebrow) { margin-block: 12px; font-size: .9375rem; }
.magazine-home-archive > a { font-weight: 600; }

.magazine-home-ad-row { list-style: none; margin: 0; padding: 0; }
.magazine-home-ad { display: none; width: 728px; margin: 22px auto; }
#page .magazine-home-ad > p { font-size: .6875rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 5px; }

.magazine-home-more { background: #f5f3f0; padding-block: 28px 34px; }
.magazine-home-section-heading { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; margin-bottom: 24px; }
.magazine-home-issue-shelf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.magazine-home-other-issue { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 20px; align-items: center; }
.magazine-home-other-issue + .magazine-home-other-issue { border-left: 1px solid #c9c7c4; padding-left: 32px; }
.magazine-home-other-issue img { width: 100px; height: auto; border-radius: 2px; }
.magazine-home-other-issue h3 { margin-bottom: 12px !important; }

@media (min-width: 1200px) {
    .magazine-home-ad { display: block; }
}

@media (max-width: 1199px) {
    .magazine-home-columns { grid-template-columns: minmax(0, 1fr) 235px; gap: 24px; }
    .magazine-home-sidebar { padding-left: 20px; }
}

@media (max-width: 899px) {
    .magazine-home-inner { width: min(100% - 32px, 760px); }
    .magazine-home-intro { grid-template-columns: 110px minmax(0, 1fr); gap: 22px; padding-block: 24px; align-items: start; }
    .magazine-home-columns { display: block; padding-top: 24px; }
    .magazine-home-sidebar { display: none; }
    .magazine-home-mobile-archive { display: inline; }
    .magazine-home-desktop-abstract { display: none; }
    .magazine-home-mobile-overview { display: block; margin-top: 14px; }
    .magazine-home-mobile-overview summary { cursor: pointer; list-style: none; }
    .magazine-home-mobile-overview summary::-webkit-details-marker { display: none; }
    .magazine-home-overview-preview { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
    .magazine-home-overview-more,
    .magazine-home-overview-less { display: block; font-size: .8125rem; text-decoration: underline; text-underline-offset: .2em; margin-top: 8px; }
    .magazine-home-overview-less,
    .magazine-home-mobile-overview[open] .magazine-home-overview-preview,
    .magazine-home-mobile-overview[open] .magazine-home-overview-more { display: none; }
    .magazine-home-mobile-overview[open] .magazine-home-overview-less { display: block; }
    .magazine-home-mobile-overview summary:focus-visible { outline: 3px solid var(--code-color-action); outline-offset: 4px; }
    .magazine-home-contents { scroll-margin-top: 65px; }
    .magazine-home-section-heading { flex-wrap: wrap; }
    .magazine-home-issue-shelf { grid-template-columns: 1fr; gap: 24px; }
    .magazine-home-other-issue + .magazine-home-other-issue { border-left: 0; border-top: 1px solid #c9c7c4; padding-left: 0; padding-top: 24px; }
}

@media (max-width: 540px) {
    .magazine-home-intro { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; }
    .magazine-home-intro-copy { display: contents; }
    .magazine-home-cover { grid-column: 1; grid-row: 1 / span 2; }
    .magazine-home-intro .magazine-home-eyebrow { grid-column: 2; margin-bottom: 0 !important; align-self: end; }
    .magazine-home-intro h1 { grid-column: 2; font-size: 1.625rem !important; }
    .magazine-home-mobile-overview { grid-column: 1 / -1; margin-top: 0; font-size: .9375rem; }
    #page .magazine-home .magazine-home-abstract { grid-column: 1 / -1; margin-top: 0; font-size: .9375rem; }
    .magazine-home-actions { grid-column: 1 / -1; margin-top: 0; gap: 16px; }
    .magazine-home-mobile-archive { flex-basis: 100%; font-size: .875rem; }
    .magazine-home-article { grid-template-columns: 25px 60px minmax(0, 1fr); gap: 10px; padding-block: 18px; }
    .magazine-home-portraits img { width: 60px; height: 60px; }
    .magazine-home-number { font-size: 1.25rem; }
    #page .magazine-home h3 { font-size: 1.25rem; }
    #page .magazine-home .magazine-home-byline { font-size: .8125rem; }
    .magazine-home-other-issue { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; }
}