* { box-sizing: border-box; margin: 0; padding: 0; }

/* Root font-size is the rem baseline — every font-size in this file
   uses rem (against this 125% baseline) so the whole page scales by
   changing only this one value. 125% (not 100%) is the default size,
   chosen for readability over the typical 16px baseline. */
html { font-size: 125%; }

/* ── Skip link ── */
.skip-link {
    position: absolute;
    top: -48px;
    left: 0;
    background: #111;
    color: #fff;
    padding: 10px 18px;
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    text-decoration: none;
    z-index: 100;
    transition: top 0.1s;
}
.skip-link:focus { top: 0; }

/* ── Accessibility bar ── */
.accessibility-bar {
    border-bottom: 1px solid #c8c8c8;
    padding: 8px 24px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.a11y-toggle {
    background: #fff;
    color: #111;
    border: 1px solid #111;
    font-family: 'Inter', sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 12px;
    cursor: pointer;
}
.a11y-toggle:hover { background: #111; color: #fff; }
.a11y-toggle[aria-pressed="true"] { background: #111; color: #fff; }

/* ── Sans-serif accessibility mode ── */
html.font-sans .masthead h1,
html.font-sans .about-section h2,
html.font-sans .print-guide-callout a,
html.font-sans .events-heading h2,
html.font-sans .day-name,
html.font-sans .event-title,
html.font-sans .archive-heading h2,
html.font-sans .archive-item-title,
html.font-sans .extras-heading h2,
html.font-sans .extras-quote-text,
html.font-sans .extras-stat-value,
html.font-sans .extras-pick-title,
html.font-sans .extras-pick-blurb {
    font-family: 'Inter', sans-serif;
}

body {
    background-color: #f5f2ee;
    color: #111;
    font-family: 'Inter', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.6;
}

/* Links are underlined so they're distinguishable without relying on color */
a { color: inherit; text-decoration: underline; }
a:hover { text-decoration: none; }

/* Visible keyboard focus indicator for all interactive elements */
:focus-visible {
    outline: 3px solid #111;
    outline-offset: 3px;
}

/* ── Masthead ── */
.masthead {
    max-width: 860px;
    margin: 0 auto;
    padding: 32px 24px 0;
}

.masthead-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 3px double #111;
    padding-bottom: 6px;
    margin-bottom: 10px;
    font-size: 0.625rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.masthead h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(2.625rem, 8vw, 5rem);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -1px;
    line-height: 0.9;
    text-align: center;
}

.masthead-subtitle {
    font-family: 'Inter', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 5px;
    margin-top: 10px;
    color: #111;
}

.masthead-rule {
    border: none;
    border-top: 4px double #111;
    margin-top: 14px;
    margin-bottom: 14px;
}

/* ── About strip ── */
.about-strip {
    background: #111;
    color: #fff;
    text-align: center;
    padding: 14px 24px;
    font-family: 'Inter', sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* ── About section ── */
.about-section {
    max-width: 860px;
    margin: 0 auto;
    padding: 36px 24px;
    border-bottom: 4px double #111;
}

.about-section h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.625rem;
    font-weight: 900;
    margin-bottom: 14px;
    letter-spacing: -0.3px;
}

.about-section p {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: #111;
    max-width: 640px;
}

.about-section p + p { margin-top: 12px; }

.print-guide-callout {
    border: 2px solid #111;
    margin-top: 18px;
    padding: 14px 16px;
    max-width: 640px;
}

.print-guide-callout strong {
    display: block;
    font-size: 0.625rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.print-guide-callout a {
    display: inline-block;
    font-family: 'Playfair Display', serif;
    font-size: 1.375rem;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.2px;
}

.print-guide-callout span {
    display: block;
    font-size: 0.75rem;
    line-height: 1.5;
    margin-top: 7px;
    color: #111;
}

/* ── Events section ── */
.events-section {
    max-width: 860px;
    margin: 0 auto;
    padding: 36px 24px 48px;
}

.events-heading {
    font-family: 'Inter', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    border-bottom: 4px double #111;
    padding-bottom: 8px;
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.events-heading h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.375rem;
    font-weight: 900;
    letter-spacing: -0.3px;
    text-transform: none;
}

.events-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

@media (max-width: 640px) {
    .events-grid { grid-template-columns: 1fr; }
    .day-column:not(:last-child) {
        border-right: none !important;
        border-bottom: 1px solid #c8c8c8;
        padding-bottom: 24px;
    }
}

.day-column {
    display: flex;
    flex-direction: column;
    padding: 0 16px;
}
.day-column:first-child { padding-left: 0; }
.day-column:last-child  { padding-right: 0; }
.day-column:not(:last-child) { border-right: 1px solid #c8c8c8; }

/* Day header */
.day-title {
    background: #111;
    color: #fff;
    text-align: center;
    padding: 8px 10px 7px;
    margin-bottom: 16px;
}

.day-name-row {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
}

/* h3 inside .day-title */
.day-name {
    font-family: 'Playfair Display', serif;
    font-size: 1.25rem;
    font-weight: 900;
    font-style: italic;
    line-height: 1;
    color: #fff;
}

.day-sep {
    font-size: 0.625rem;
    color: #aaa;
}

.day-date {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #ccc;
}

.day-weather {
    font-size: 0.6875rem;
    font-weight: 500;
    color: #ccc;
    margin-top: 3px;
    letter-spacing: 0.2px;
    text-transform: uppercase;
}

/* Events list */
.events-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* h4 section labels */
.events-section-label {
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #333;
    border-bottom: 1px solid #ddd;
    padding-bottom: 3px;
    margin: 14px 0 8px;
}
.events-section-label:first-child { margin-top: 0; }

.event {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e8e8e8;
}
.event:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

.event-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3px;
}

.event-time {
    font-size: 0.6875rem;
    font-weight: 900;
    letter-spacing: 0.1px;
}

.event-tag {
    font-family: 'Inter', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 3px 6px 2px;
    line-height: 1;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #111;
    color: #fff;
}

.event-title {
    font-family: 'Playfair Display', serif;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 2px;
}

.event-venue {
    font-size: 0.625rem;
    font-weight: 500;
    text-transform: uppercase;
    color: #333;
    letter-spacing: 0.2px;
}

/* ── This week's print extras ── */
.extras-section {
    max-width: 860px;
    margin: 0 auto;
    padding: 36px 24px 48px;
    border-bottom: 4px double #111;
}

.extras-heading {
    font-family: 'Inter', sans-serif;
    border-bottom: 4px double #111;
    padding-bottom: 8px;
    margin-bottom: 16px;
}

.extras-heading h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.375rem;
    font-weight: 900;
    letter-spacing: -0.3px;
}

.extras-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 640px) {
    .extras-grid { grid-template-columns: 1fr; }
}

.extras-card {
    border: 2px solid #111;
    padding: 12px 14px;
}

.extras-card-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 6px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.extras-card-label .tag-icon { width: 10px; height: 10px; margin-right: 4px; }

.extras-card-body {
    font-size: 0.8125rem;
    line-height: 1.55;
    color: #111;
}

.extras-history-year {
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
}

.extras-quote-text {
    font-family: 'Playfair Display', serif;
    font-style: italic;
}

.extras-quote-attribution {
    font-size: 0.6875rem;
    margin-top: 6px;
    color: #333;
}

.extras-venue-zone {
    font-weight: 700;
    margin-top: 8px;
}
.extras-venue-zone:first-child { margin-top: 0; }

.extras-venue-list {
    font-size: 0.75rem;
    color: #333;
}

.extras-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 6px;
}
.extras-stat-row:last-child { margin-bottom: 0; }

.extras-stat-label {
    text-transform: uppercase;
    letter-spacing: 0.2px;
    color: #333;
    font-size: 0.6875rem;
}

.extras-stat-value {
    font-weight: 700;
    font-family: 'Playfair Display', serif;
    font-size: 0.9375rem;
}

.extras-card-pick {
    border-top-width: 4px;
}

.extras-pick-title {
    font-family: 'Playfair Display', serif;
    font-size: 0.9375rem;
    font-weight: 900;
    line-height: 1.2;
    margin-bottom: 4px;
}

.extras-pick-meta {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding-bottom: 6px;
    margin-bottom: 6px;
    border-bottom: 1px solid #ccc;
    color: #111;
}

.extras-pick-blurb {
    font-family: 'Playfair Display', serif;
    font-style: italic;
    font-weight: 700;
}

/* ── Previous editions ── */
.archive-section {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 24px 48px;
}

.archive-heading {
    font-family: 'Inter', sans-serif;
    border-bottom: 4px double #111;
    padding-bottom: 8px;
    margin-bottom: 16px;
}

.archive-heading h2 {
    font-family: 'Playfair Display', serif;
    font-size: 1.375rem;
    font-weight: 900;
    letter-spacing: -0.3px;
}

.archive-load-more {
    display: block;
    margin: 16px auto 0;
    background: #fff;
    color: #111;
    border: 1px solid #111;
    font-family: 'Inter', sans-serif;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 8px 20px;
    cursor: pointer;
}
.archive-load-more:hover { background: #111; color: #fff; }

.archive-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.archive-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px solid #e8e8e8;
}
.archive-item:last-child { border-bottom: none; }

.archive-item-title {
    font-family: 'Playfair Display', serif;
    font-size: 0.9375rem;
    font-weight: 700;
}

/* ── Footer ── */
.site-footer {
    border-top: 4px double #111;
    max-width: 860px;
    margin: 0 auto;
    padding: 14px 24px 48px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-size: 0.625rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 500;
    color: #111;
    gap: 6px;
}

.site-footer-links {
    border-top: 1px solid #ddd;
    padding-top: 10px;
    text-align: center;
    font-size: 0.625rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.footer-credit {
    text-transform: none;
    font-size: 0.625rem;
    letter-spacing: 0.3px;
    font-weight: 400;
    font-style: italic;
}