:root {
    --site-width: 1180px;
    --site-gutter: 28px;
    --site-gap: 14px;
    --site-banner: #c9d8bc;
    --site-ink: #40576e;
}

/* One heading scale for every public page, including both place templates. */
body h1, body[class] h1 {
    font: 400 21px/1.3 var(--body-font, Georgia), "Times New Roman", serif !important;
    letter-spacing: normal !important;
    color: var(--ink) !important;
    margin-block-start: 0 !important;
}
body h2, body[class] h2 { font-size: 18px !important; line-height: 1.35 !important; }
body h3, body[class] h3 { font-size: 16px !important; line-height: 1.4 !important; }
body h4, body[class] h4 { font-size: 14px !important; line-height: 1.4 !important; }
body h5, body[class] h5 { font-size: 13px !important; line-height: 1.4 !important; }
body h6, body[class] h6 { font-size: 12px !important; line-height: 1.4 !important; }

body.skin-monet .hero h1.event-search-intro,
body.skin-monet h1.source-search-intro,
body.skin-monet .results-head h1,
body.skin-monet .source-results-head h1{
    font-family:"Libre Caslon Display",Georgia,serif!important;
}

body > main {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--site-width);
    margin-inline: auto;
    padding: 24px var(--site-gutter) 72px;
}

body.homepage > main {
    width: min(1800px, 100%);
    max-width: 1800px;
    padding: 0 clamp(20px, 4vw, 72px) 70px;
}

body > .masthead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 116px;
    padding: 24px max(var(--site-gutter), calc((100% - var(--site-width)) / 2 + var(--site-gutter)));
    background: #f1ede5;
    border-bottom: 0;
}

.masthead .brand,
.masthead p {
    position: static;
    inset: auto;
}

.masthead .brand strong {
    font: normal clamp(26px, 2.5vw, 40px)/.95 'Libre Caslon Display', Georgia, serif;
    letter-spacing: 0;
    color: var(--site-ink);
}

.masthead .brand strong span { color: #ad719c; }
.masthead .brand-mark { width: 68px; height: 68px; }

body > .site-header {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--site-width);
    padding-inline: var(--site-gutter);
}

body > .event-banner {
    display: flex;
    align-items: center;
    min-height: 74px;
    padding: 14px 0;
    background: var(--site-banner);
    color: var(--site-ink);
}

.event-banner .banner-content {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    width: 100%;
    max-width: var(--site-width);
    padding-inline: var(--site-gutter);
    margin-inline: auto;
}

.event-banner .banner-divider { background: #a8baad; }
.event-banner a.banner-link {
    color: var(--site-ink) !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.event-banner a.banner-link:hover,
.event-banner a.banner-link:focus-visible { border-bottom-color: currentColor; }
.event-banner .banner-or { font-size: 13px; }
.travel-navigation a { color: var(--site-ink); font: 700 14px var(--ui, sans-serif); text-decoration: none; }
.travel-navigation a:hover,
.travel-navigation a[aria-current="page"] { text-decoration: underline; text-underline-offset: 5px; }
.travel-navigation b { padding: 2px 7px; border-radius: 20px; background: #faf7f2; }

.main-discovery-navigation .trip-planning-links { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 26px; font: 700 14px var(--ui, sans-serif); }
.main-discovery-navigation .trip-link-group { display: flex; align-items: center; column-gap: 21px; white-space: nowrap; }
.main-discovery-navigation .trip-link-group strong { font-size: 20px; font-weight: 800; }
.main-discovery-navigation .trip-plan-group { flex: 1 1 auto; justify-content: space-between; margin-left: 8px; padding-left: 24px; border-left: 1px solid #a8baad; }
.main-discovery-navigation a.banner-link[aria-current="page"] { text-decoration: underline; text-decoration-color: #ad719c; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }

@media (max-width: 620px) {
    .main-discovery-navigation .trip-planning-links { flex-wrap: wrap; gap: 10px 18px; }
    .main-discovery-navigation .trip-link-group { flex-wrap: wrap; gap: 8px 12px; column-gap: 16px; }
    .main-discovery-navigation .trip-plan-group { margin-left: 0; padding-left: 0; border-left: 0; }
}

body > main .source-discovery { width: 100%; max-width: none; padding-inline: 0; }
body > main .event-grid,
body > main .source-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--site-gap);
}

@media (max-width: 850px) {
    :root { --site-gutter: 20px; --site-gap: 14px; }
    body > main { padding-block: 16px 56px; }
    .event-banner .banner-content { flex-wrap: wrap; gap: 12px 20px; }
    .event-banner .event-group { flex: 1 1 100%; }
    .event-banner .banner-divider,
    .event-banner .mobile-banner-break { display: none; }
}

@media (max-width: 580px) {
    :root { --site-gutter: 14px; --site-gap: 14px; }
    body > main { padding-block: 12px 44px; }
    body > .masthead { min-height: 84px; padding-block: 18px; }
    .masthead .brand-mark { width: 48px; height: 48px; }
    .masthead .brand strong { font-size: 24px; }
    .event-banner .event-group { gap: 12px; }
    body > main .event-grid,
    body > main .source-grid { grid-template-columns: minmax(0, 1fr); }
}

.travel-navigation .banner-content { justify-content: space-between; gap: 28px; }
.travel-navigation .trip-planning-links,
.travel-navigation .travel-navigation-actions { display: flex; align-items: center; gap: 20px; }
.travel-navigation .trip-planning-links { font: 700 14px var(--ui, sans-serif); }
.travel-navigation .trip-planning-links a { font-weight: 700; text-decoration: none; }
.travel-navigation .trip-planning-links a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 850px) {
    .travel-navigation .banner-content { gap: 12px 20px; }
}
@media (max-width: 620px) {
    .travel-navigation .banner-content { align-items: flex-start; gap: 12px 20px; }
    .travel-navigation .trip-planning-links { flex-wrap: wrap; gap: 8px 14px; }
    .travel-navigation .travel-navigation-actions { gap: 14px; }
}

@media (max-width: 850px) {
    .event-banner.main-discovery-navigation .banner-content { width: 100%; }
    .event-banner.main-discovery-navigation .trip-planning-links { width: 100%; min-width: 0; flex-wrap: wrap; gap: 10px 20px; }
    .event-banner.main-discovery-navigation .trip-link-group { width: 100%; min-width: 0; justify-content: space-between; flex-wrap: wrap; white-space: normal; gap: 8px 16px; }
    .event-banner.main-discovery-navigation .trip-plan-group { flex: 1 1 100%; margin-left: 0; padding-left: 0; border-left: 0; }
}

/* Venue search establishes the banner-to-heading gap: 24 / 16 / 12px. */
:root { --site-heading-gap: 24px; }
@media(max-width:850px) { :root { --site-heading-gap: 16px; } }
@media(max-width:580px) { :root { --site-heading-gap: 12px; } }
body:not(.homepage) > main {
    margin-block-start: 0 !important;
    padding-block-start: var(--site-heading-gap) !important;
}
body > main > :is(.hero, .detail, .itinerary-head, .account-head),
body[class] > main > :is(.hero, .detail, .itinerary-head, .account-head),
body.venue-search-only > main > .source-discovery {
    margin-block-start: 0 !important;
    padding-block-start: 0 !important;
}
body > main h1 {
    margin-block-start: 0 !important;
    text-transform: none !important;
}

/* Venue title links follow the H3 scale instead of the smaller action-link style. */
body .source-card h2 > a{font:inherit!important}

/* Keep the event title and venue on consecutive lines without link margins. */
body :is(.event-card,.travel-event-card) .event-info > :is(h2,h3,h4){margin-bottom:4px!important}
body :is(.event-card,.travel-event-card) .event-info > :is(h2,h3,h4) > a,
body :is(.event-card,.travel-event-card) .event-info > p > a{display:inline!important;margin:0!important}
body :is(.event-card,.travel-event-card) .event-info > p{margin-top:0!important}

/* The Plan divider follows the body midpoint, independent of link widths. */
@media(min-width:851px){
    .event-banner.travel-navigation .banner-content{
        position:relative;
        display:grid!important;
        grid-template-columns:50% minmax(0,1fr) auto;
        gap:0!important;
    }
    .event-banner.travel-navigation .trip-planning-links{display:contents!important}
    .event-banner.travel-navigation .trip-link-group{
        grid-column:1;
        grid-row:1;
        min-width:0;
        width:auto!important;
        flex-wrap:wrap;
        padding-right:24px;
    }
    .event-banner.travel-navigation .trip-plan-group{
        grid-column:2;
        margin-left:0!important;
        padding-left:24px!important;
        padding-right:0;
        border-left:0!important;
    }
    .event-banner.travel-navigation .travel-navigation-actions{
        grid-column:3;
        grid-row:1;
        margin-left:24px;
    }
    .event-banner.travel-navigation .banner-content:has(.trip-plan-group)::before{
        content:"";
        position:absolute;
        left:50%;
        top:50%;
        transform:translate(-50%,-50%);
        width:1px;
        height:28px;
        background:#a8baad;
        pointer-events:none;
    }
}
@media(max-width:850px){
    .event-banner.travel-navigation .trip-plan-group{border-left:0!important}
}

/* Match the Plan links across main-site and travel navigation. */
.event-banner.travel-navigation .trip-plan-group{
    justify-content:flex-start;
    column-gap:21px;
    row-gap:8px;
}
@media(max-width:620px){
    .event-banner.travel-navigation .trip-plan-group{column-gap:16px}
}
