/* chattanooga-weekend-from-atlanta r4d.css: v1.3 design layer (card-art r4d, Oct 25 2026). Structure follows the Marrakech r4d layer. No important-flag overrides. Colours: only this guide's own theme.css tokens (light #1f4f52 / dark #0f2c2e header). */
html body .site-header { background: var(--berry-deep); color: var(--on-deep); }
/* --- accents: this guide's own pattern and transition, decorative, empty bands only --- */
main > section.overview, main > section.route, main > section.planning, main > section.faq, main > section.related, header.hero, footer.eat-footer { position: relative; }
html body .hero::before, html body .route::after, html body .eat-footer::after { content: ""; position: absolute; pointer-events: none; z-index: 0; background-repeat: no-repeat; }
html body .hero::before { left: 0; right: 0; top: 6px; height: 48px; background: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/light/pattern-cha-incline-ties.svg") repeat-x center / 96px 48px; opacity: .14; -webkit-mask: linear-gradient(90deg, transparent, #1f4f52 18%, #1f4f52 82%, transparent); mask: linear-gradient(90deg, transparent, #1f4f52 18%, #1f4f52 82%, transparent); }
html body .route::after { left: 0; right: 0; bottom: 8px; height: 40px; background: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/light/transition-cha-river-bend.svg") repeat-x center / auto 100%; opacity: .30; }
html body .eat-footer::after { right: -34px; top: 12px; width: 116px; height: 116px; background: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/light/pattern-cha-incline-ties.svg") no-repeat center / 100% 100%; opacity: .10; }
footer.eat-footer { overflow: hidden; }
/* --- moment scene (figure.r4-moment, full-bleed, before The route) --- */
html body main figure.r4-moment { margin: 0; background: var(--berry-deep); color: var(--on-deep); }
html body main figure.r4-moment img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
html body main figure.r4-moment figcaption { padding: 12px 20px 16px; font-style: italic; color: var(--on-deep); }
html body main figure.r4-moment figcaption .credit { display: block; font-style: normal; font-size: .82em; color: var(--hero-soft); }
/* --- props (r4-prop, last child of the anchor; never on the hero or the first day) --- */
html body main .r4-prop { display: block; position: absolute; z-index: 4; pointer-events: none; height: auto; filter: drop-shadow(0 12px 14px rgba(18, 21, 21, .45)); }
html, body { overflow-x: clip; }
html body main .r4-anchor { position: relative; }
@media (max-width: 700px) {
 html body .hero::before { content: none; }
}
/* --- prop bands (Oct 25 rev 7): each prop sits in a dedicated empty band BETWEEN sections, above The route, the FAQ and Keep exploring (related); layout change = extra margin-top on those three sections to make room; site.css full-bleed clip-path on these sections is widened upward by exactly the band height so the prop is not clipped --- */
@media (min-width: 701px) {
 html body main .r4-prop.r4-prop--cha-turtle { top: -260px; right: 6%; height: 220px; width: auto; max-width: 52vw; transform: rotate(4deg); }
 html body main .r4-prop.r4-prop--cha-incline { top: -260px; left: 6%; height: 220px; width: auto; max-width: 52vw; transform: rotate(-4deg); }
 html body main .r4-prop.r4-prop--cha-loco { top: -260px; right: 6%; height: 220px; width: auto; max-width: 52vw; transform: rotate(4deg); }
 html body main > section.route, html body main > section.faq, html body main > section.related { margin-top: 300px; clip-path: inset(-300px -100vmax 0); }
}
@media (max-width: 700px) {
 html body main .r4-prop.r4-prop--cha-turtle { top: -165px; right: 6%; height: 130px; width: auto; max-width: 52vw; transform: rotate(4deg); }
 html body main .r4-prop.r4-prop--cha-incline { top: -165px; left: 6%; height: 130px; width: auto; max-width: 52vw; transform: rotate(-4deg); }
 html body main .r4-prop.r4-prop--cha-loco { top: -165px; right: 6%; height: 130px; width: auto; max-width: 52vw; transform: rotate(4deg); }
 html body main > section.route, html body main > section.faq, html body main > section.related { margin-top: 200px; clip-path: inset(-200px -100vmax 0); }
}
/* --- dark block: own dark palette (#0f2c2e header, #121515 page) --- */
@media (prefers-color-scheme: dark) {
 html body .site-header { background: var(--berry-deep); color: var(--on-deep); }
 html body .hero::before { background-image: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/dark/pattern-cha-incline-ties.svg"); opacity: .12; }
 html body .route::after { background-image: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/dark/transition-cha-river-bend.svg"); opacity: .20; }
 html body .eat-footer::after { background-image: url("/chattanooga-weekend-from-atlanta/assets/theme/patterns/dark/pattern-cha-incline-ties.svg"); }
 html body main figure.r4-moment { background: var(--berry-deep); }
 html body main figure.r4-moment img { filter: brightness(.9); }
 html body main .r4-prop { filter: drop-shadow(0 10px 12px rgba(18, 21, 21, .6)) brightness(.94); }
}
/* --- U3 section divider (card-art/divider.svg): tone-on-tone cha linework in the empty band above the section kicker; replaces the site.css gradient bar for these two sections only --- */
html body main > section.route::before, html body main > section.overview::before { content: ""; display: block; height: 12px; margin: 0 0 26px; background: url("/chattanooga-weekend-from-atlanta/assets/theme/divider.svg") repeat-x 0 50% / 192px 12px; opacity: 1; }
@media (prefers-color-scheme: dark) { html body main > section.route::before, html body main > section.overview::before { background-image: url("/chattanooga-weekend-from-atlanta/assets/theme/divider-dark.svg"); } }

/* hideprops-20261025: batch go-live, props kept in DOM but hidden (owner DU waiver) */
html body main .r4-prop.r4-prop, html body main img.r4-prop.r4-prop { display: none; }
