/* Use the website spacing tokens; keep these values in assets/css/spacing.css. */
:root { --gutter:var(--page-gutter); }
.section-shell { width:100%; max-width:var(--content-max); padding-inline:var(--page-gutter); }
.site-header { padding-inline:max(var(--page-gutter), calc((100vw - var(--content-max)) / 2 + var(--page-gutter))); }
#brochure-pages > .brochure-page { padding-block:var(--page-top-padding); align-content:start; background-color:var(--navy); }
/* Match the website's navy surfaces, including every featured card. */
#brochure-pages .team-card,
#hospitality .hospitality-detail,
#hospitality .food-cards > article,
#partnership .main-partnership,
#contact .contact-panel,
#booking .booking-surface { background-color:var(--panel); }
#hospitality .hospitality-option[aria-pressed=true],
.fullscreen-button:hover,
.fullscreen-button[aria-pressed=true] { background-color:var(--panel); }
#sponsorship .sponsor-table tbody td[data-col] { background-color:transparent; }
#sponsorship .sponsor-table tbody tr:hover { background-color:#ffffff08; }
#brochure-pages .champions-hero { column-gap:var(--layout-gap); row-gap:var(--heading-gap); align-items:start; }
#brochure-pages .champions-hero .hero-copy { padding:0; }
#brochure-pages .champions-hero .hero-visual { align-self:start; padding-top:0; }
#brochure-pages .champions-hero .chapter-strip { margin-top:0; }
#brochure-pages .section-heading,
#brochure-pages .village-heading { margin-bottom:var(--heading-gap); }
.village-layout,
.village-includes,
.impact-layout,
#hospitality .hospitality-layout,
#contact .contact-layout,
#booking.booking-page { column-gap:var(--layout-gap); row-gap:var(--layout-gap); }
.village-photo-grid { width:100%; max-height:none; }
.village-includes { margin-top:var(--section-padding); padding-top:var(--heading-gap); }
#hospitality .hospitality-layout { min-height:0; align-items:start; }
#hospitality .hospitality-heading { margin-bottom:var(--heading-gap); }
#hospitality .food-heading { margin-top:var(--heading-gap); margin-bottom:var(--space-md); }
#contact.brochure-page { align-items:flex-start; }
#sponsorship > .eyebrow { align-self:start; }

/* Independent columns prevent the company grid stretching the aftermovie. */
#event { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--layout-gap); align-items:start; }
.event-story,
.event-details { display:grid; min-width:0; align-content:start; gap:var(--space-md); }
.event-details { gap:var(--heading-gap); }
#event .event-story > *,
#event .event-details > * { grid-column:auto; grid-row:auto; margin:0; }
#event .event-intro { display:block; padding:0; }
#event .event-intro > .lead { max-width:none; }
#event .event-format { margin:0; padding:0; border:0; }
#event .event-wide { height:auto; aspect-ratio:16/9; }
#event .video-feature { padding-block:var(--space-md); gap:var(--space-sm); align-self:start; flex-wrap:wrap; }
#event .past-companies { grid-template-columns:1fr; padding-top:var(--space-md); border-top:1px solid var(--line); gap:12px; }

/* Direct mobile return link; desktop retains the existing Event Page item. */
.brochure-mobile-back { display:none; }
@media(max-width:1050px) {
    .site-header > .brochure-mobile-back { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:44px; flex-shrink:0; margin-left:auto; margin-right:8px; padding:8px; border:1px solid #ffdd6d80; color:var(--yellow); font-size:13px; font-weight:800; white-space:nowrap; }
    .brochure-mobile-back svg { flex-shrink:0; }
    .brochure-mobile-back:focus-visible { outline:2px solid var(--yellow); outline-offset:3px; }
    .site-header .menu-toggle { margin-left:0; padding-inline:10px; gap:8px; }
    .site-header .fullscreen-button { margin-left:8px; }
    .site-header nav .brochure-event-link { display:none; }
}
@media(max-width:360px) {
    .site-header > .brochure-mobile-back { font-size:12px; gap:4px; padding-inline:6px; margin-right:6px; }
    .brochure-mobile-back svg { width:16px; height:16px; }
    .site-header .menu-toggle { font-size:12px; padding-inline:6px; gap:6px; }
    .site-header .fullscreen-button { margin-left:6px; }
}
@media(max-width:900px) {
    #brochure-pages .champions-hero,
    .village-layout,
    .impact-layout,
    #hospitality .hospitality-layout,
    #contact .contact-layout,
    #booking.booking-page { grid-template-columns:minmax(0,1fr); }
    #event { grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "intro" "format" "photo" "video" "companies"; }
    .event-story,
    .event-details { display:contents; }
    #event .section-heading { grid-area:heading; }
    #event .event-intro { grid-area:intro; }
    #event .event-format { grid-area:format; }
    #event .event-wide { grid-area:photo; }
    #event .video-feature { grid-area:video; }
    #event .past-companies { grid-area:companies; }
    #event .past-companies { padding-top:0; border-top:0; }
    .village-stories { gap:var(--layout-gap); }
    #booking .booking-intro { position:static; padding-inline:0; }
}

/* The same mobile type and column widths in every package view. */
@media(max-width:800px) {
    #sponsorship .table-scroll { container-type:inline-size; margin-top:12px; }
    #sponsorship .mobile-table-hint { display:block; margin-top:0; margin-bottom:0; font-size:13px; color:var(--yellow); }
    #sponsorship .horizontal-heading { margin-bottom:var(--space-md); }
    #sponsorship .sponsor-table { width:204cqw; min-width:0; font-size:14px; }
    #sponsorship .sponsor-table.single-package { width:100%; }
    #sponsorship .sponsor-table th:first-child { width:48cqw; position:sticky; left:0; z-index:1; background:var(--navy); padding-left:0; padding-right:12px; }
    #sponsorship .sponsor-table :is(th,td)[data-col] { width:52cqw; padding-inline:12px; }
    #sponsorship .sponsor-table :is(th,td) { padding-block:15px; font-size:14px; overflow-wrap:anywhere; }
    #sponsorship .sponsor-table thead span { font-size:22px; }
    #sponsorship .sponsor-table thead strong { font-size:30px; white-space:nowrap; }
    #sponsorship .sponsor-table .benefit-label { gap:9px; }
    #sponsorship .sponsor-table .benefit-label .icon { width:18px; height:18px; }
    #sponsorship .sponsor-table .text-link { gap:8px; font-size:13px; }
    #sponsorship .sponsor-notes { margin-top:var(--space-md); }
}
/* Match the website's dropdown arrow size, inset and text clearance. */
#booking .form-field select {
    -webkit-appearance:none;
    appearance:none;
    padding-right:44px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 14px center;
    background-size:16px 16px;
}
@media(forced-colors:active) {
    #booking .form-field select { -webkit-appearance:auto; appearance:auto; background-image:none; padding-right:12px; }
}
@media print {
    .brochure-mobile-back { display:none!important; }
    #sponsorship .table-scroll { container-type:normal; }
    #sponsorship .sponsor-table { width:100%; }
}