:root {
  --paper: #f5f1e8;
  --light-paper: #fbf8f0;
  --ink: #173e43;
  --text: #23464a;
  --muted: #485b5d;
  --deep: #103b40;
  --rule: #c7cdc0;
  --blue: #079bb9;
  --blue-ink: #00586c;
  --blue-pale: #e5eff0;
  --yellow: #f9b000;
  --gold: #f8d382;
  --footer-text: #edf0e6;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Segoe UI', system-ui, sans-serif;
  --gutter: clamp(1rem, 4.2vw, 3.5rem);
  --measure: 66ch;
  --wrap: 74rem;
  --section: clamp(3rem, 7.6vw, 7rem);
  color-scheme: light;
  background: var(--paper);
  color: var(--text);
  font-family: var(--sans);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-block-start: 1.25rem; }
body { margin: 0; font-size: 1rem; line-height: 1.6; }
body, input, textarea { caret-color: var(--blue-ink); }
::selection { background: #f7d68b; color: var(--deep); }
img { display: block; max-inline-size: 100%; block-size: auto; }
figure, p, ul { margin: 0; }
a { color: var(--blue-ink); text-decoration-thickness: .08em; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: .13em; }
:focus-visible { outline: 2px solid var(--blue-ink); outline-offset: 4px; }
main:focus, .routes:focus { outline: 0; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
h1, h2, h3 { margin: 0; color: var(--ink); font-family: var(--serif); font-weight: 400; text-wrap: balance; }
h1 { font-size: clamp(2.2rem, 8vw, 4.5rem); line-height: 1.04; letter-spacing: -.035em; }
h2 { font-size: clamp(1.85rem, 4.4vw, 3.15rem); line-height: 1.12; letter-spacing: -.026em; }
h3 { font-size: clamp(1.3rem, 3.1vw, 2rem); line-height: 1.2; letter-spacing: -.02em; }
svg { flex: none; }
.wrap { width: min(calc(100% - 2 * var(--gutter)), var(--wrap)); margin-inline: auto; }
.skip { position: fixed; inset: .5rem auto auto .5rem; z-index: 10; transform: translateY(-180%); padding: .65rem 1rem; background: var(--light-paper); font-weight: 650; }
.skip:focus { transform: none; }

.masthead { position: relative; z-index: 2; background: var(--paper); border-block-end: 1px solid var(--rule); }
.masthead-inner { width: min(calc(100% - 2 * var(--gutter)), 82rem); min-height: 4rem; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; }
.logo { display: flex; align-items: center; min-height: 3rem; }
.logo img { width: clamp(9rem, 16vw, 12rem); }
.primary { display: none; }
.masthead ul { margin: 0; padding: 0; list-style: none; }
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
.masthead summary, .masthead nav a { display: flex; align-items: center; gap: .35rem; min-height: 44px; color: var(--ink); font-weight: 650; text-decoration: none; }
.masthead nav a:hover, .masthead summary:hover { color: var(--blue-ink); text-decoration: underline; text-decoration-color: var(--blue); }
.mobile-menu > summary { padding-inline: .5rem; font-size: .92rem; }
.mobile-menu > nav { position: absolute; inset: 100% 0 auto; max-height: min(74vh, 37rem); overflow-y: auto; background: var(--light-paper); border-block-start: 1px solid var(--rule); border-block-end: 3px solid var(--blue); padding: .5rem var(--gutter) 1rem; }
.mobile-menu > nav > ul > li + li { border-block-start: 1px solid var(--rule); }
.mobile-menu .nav-group ul { padding-inline-start: 1rem; margin-block-end: .4rem; }
.mobile-menu .nav-group ul a { font-weight: 500; }
.nav-group summary, .guide-contents summary { justify-content: space-between; }
.nav-group .chevron, .guide-contents .chevron, .faq-row .chevron { width: 1.1rem; height: 1.1rem; color: var(--blue-ink); }
details[open] > summary .chevron { transform: rotate(180deg); }
.masthead a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; }

.skyline-photo { height: clamp(10.5rem, 51.5vw, 22rem); overflow: clip; background: var(--blue-pale); }
.skyline-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 44%; }
.skyline figcaption { padding-block: .55rem; font-size: .83rem; color: var(--muted); }
.skyline figcaption::before { content: ''; display: inline-block; inline-size: 1.4rem; block-size: 2px; margin: 0 .45rem .24em 0; background: var(--yellow); }
.intro { display: grid; gap: 1rem; padding-block: .75rem 1.6rem; }
.intro h1 { max-width: 20ch; }
.intro-action p { max-width: 34ch; margin-block-end: .95rem; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.45; }
.solid-link { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 44px; padding: .5rem .95rem; border: 1px solid var(--deep); background: var(--deep); color: var(--light-paper); font-weight: 650; text-decoration: none; }
.solid-link:hover { background: var(--blue-ink); color: var(--light-paper); }
.arrow-link { display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; font-weight: 650; }
.arrow-link svg { color: var(--blue-ink); }
.routes { border-block: 1px solid var(--rule); }
.routes ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; padding: 0; }
.routes li:nth-child(2n) { border-inline-start: 1px solid var(--rule); }
.routes li:nth-child(n+3) { border-block-start: 1px solid var(--rule); }
.routes a { min-height: 4.8rem; display: flex; justify-content: space-between; align-items: center; gap: .4rem; padding: .65rem .55rem; color: var(--ink); text-decoration: none; }
.routes strong, .routes a span span { display: block; }
.routes strong { font-family: var(--serif); font-size: clamp(1.1rem, 2.45vw, 1.55rem); font-weight: 400; line-height: 1.18; }
.routes a span span { margin-block-start: .22rem; font-size: .84rem; line-height: 1.35; color: var(--muted); }
.routes svg { color: var(--blue-ink); width: 1rem; }
.routes a:hover { background: var(--blue-pale); }

.season, .selection, .essentials, .writers { margin-block-start: var(--section); }
.season { display: grid; background: var(--deep); color: var(--footer-text); }
.season-photo { aspect-ratio: 16 / 10; overflow: clip; }
.season-photo img, .story-photo img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.035); }
.season-copy { padding: clamp(1.4rem, 4vw, 3.5rem); align-self: center; }
.season-copy::before { content: ''; display: block; width: 2rem; height: 3px; background: var(--yellow); margin-block-end: .85rem; }
.season h2 { color: var(--light-paper); }
.season p { max-width: 37ch; margin-block: .65rem .4rem; }
.season .arrow-link, .season .arrow-link svg { color: var(--gold); }
.season :focus-visible, .footer :focus-visible { outline-color: var(--gold); }
.section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 1rem; border-block-start: 1px solid var(--rule); padding-block: .75rem 1rem; }
.stories, .stories-small { display: grid; gap: 1rem; }
.story-link { display: grid; grid-template-columns: minmax(5rem, 30%) 1fr; gap: .9rem; align-items: center; min-height: 5rem; color: var(--text); text-decoration: none; }
.story-main .story-link { grid-template-columns: 1fr; gap: .65rem; }
.story-photo { aspect-ratio: 4 / 3; overflow: clip; background: var(--blue-pale); }
.story-main .story-photo { aspect-ratio: 16 / 9; }
.story-copy p { margin-block-start: .25rem; color: var(--muted); line-height: 1.45; }
.story-link:hover h3 { text-decoration: underline; text-decoration-color: var(--blue); text-underline-offset: .15em; }
.stories-small .story { border-block-start: 1px solid var(--rule); padding-block-start: .85rem; }
.essentials { border-block-start: 3px solid var(--blue); padding-block-start: 1rem; }
.essentials ul { padding: 0; list-style: none; margin-block-start: .55rem; }
.essentials li { border-block-end: 1px solid var(--rule); }
.essentials a { display: flex; justify-content: space-between; align-items: center; min-height: 46px; gap: .5rem; padding: .5rem 0; }
.writers { display: grid; gap: 1.4rem; align-items: center; margin-block-end: var(--section); }
.writer-photos { display: flex; flex-wrap: wrap; gap: 1rem; }
.writer-photos figure, .profile figure { max-width: 9.4rem; }
.writer-photos img, .profile img { inline-size: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--blue-pale); }
.writer-photos figcaption, .profile figcaption { margin-block-start: .25rem; font-size: .84rem; color: var(--muted); }
.writer-copy p { max-width: 55ch; margin-block: .55rem .35rem; }

.guide { padding-block: clamp(1.5rem, 4.8vw, 4rem) var(--section); }
.guide-head { margin-block-end: clamp(1.5rem, 4.6vw, 3.4rem); }
.guide-head h1 { max-width: 21ch; }
.guide-head h1::after { content: ''; display: block; margin-block-start: .65rem; width: 3.25rem; height: 3px; background: linear-gradient(90deg, var(--blue) 0 72%, var(--yellow) 72%); }
.breadcrumb { display: flex; align-items: center; gap: .6rem; margin-block-end: .4rem; font-size: .88rem; }
.breadcrumb a { display: flex; align-items: center; min-height: 44px; }
.guide-byline { margin-block-start: .9rem; color: var(--muted); font-size: .92rem; }
.guide-lead { max-width: var(--measure); margin-block-start: 1.05rem; font-size: clamp(1.08rem, 1.8vw, 1.28rem); line-height: 1.55; }
.guide-lead p + p { margin-block-start: .7rem; }
.route-graphic { display: block; color: var(--blue); margin-block: 1rem -.4rem; }
.route-graphic circle { fill: var(--yellow); stroke: var(--deep); stroke-width: 1; }
.guide-layout { display: grid; align-items: start; gap: 1.5rem; }
.guide-contents { border-block: 1px solid var(--rule); min-width: 0; }
.guide-contents summary { display: flex; align-items: center; gap: .75rem; min-height: 48px; color: var(--ink); font-weight: 650; }
.guide-contents ul { list-style: none; padding: 0 0 .7rem; }
.guide-contents li + li { border-block-start: 1px solid var(--rule); }
.guide-contents a { display: flex; align-items: center; min-height: 44px; padding: .35rem 0; font-size: .93rem; line-height: 1.35; }
.article-body { min-width: 0; font-size: 1.035rem; line-height: 1.7; overflow-wrap: break-word; }
.article-body section + section { margin-block-start: clamp(1.9rem, 4vw, 3.4rem); }
.article-body h2 { font-size: clamp(1.7rem, 3.2vw, 2.55rem); margin-block-end: .55rem; }
.article-body h3 { margin-block: .9rem .35rem; }
.article-body p, .article-body > ul, .article-body section > ul { max-width: var(--measure); }
.article-body p + p, .article-body p + ul, .article-body ul + p, .article-body figure + p { margin-block-start: .85rem; }
.article-body ul, .article-body ol { padding-inline-start: 1.3rem; }
.article-body li + li { margin-block-start: .35rem; }
.article-body a { overflow-wrap: anywhere; }
.article-body .wp-block-table { margin-block: 1rem; overflow-x: auto; }
.article-body table { border-collapse: collapse; width: 100%; font-size: .94rem; font-variant-numeric: tabular-nums; }
.article-body th, .article-body td { padding: .65rem .55rem; border-block-end: 1px solid var(--rule); text-align: start; vertical-align: top; overflow-wrap: anywhere; }
.article-body th { background: var(--blue-pale); color: var(--deep); }
.article-body td:first-child { width: 33%; }
.article-body figcaption { color: var(--muted); font-size: .85rem; padding-block-start: .3rem; }
.article-body blockquote { max-width: var(--measure); margin: 1rem 0; padding: 1rem; background: var(--blue-pale); }

.faq-row { border-block-start: 1px solid var(--rule); scroll-margin-block-start: 1rem; }
.faq-row:last-child { border-block-end: 1px solid var(--rule); }
.faq-row summary { padding: .9rem 0; }
.faq-row summary h2 { margin: 0; display: flex; align-items: center; justify-content: space-between; gap: .8rem; font-size: clamp(1.3rem, 3vw, 1.95rem); }
.faq-row[open] > summary h2 { color: var(--blue-ink); }
.faq-row > div { padding-block: 0 1.15rem; }
.faq-row > div p { max-width: var(--measure); }
.journey-list ul { list-style: none; padding: 0; max-width: none; display: grid; gap: .8rem 1.3rem; }
.journey-list li { border-block-start: 1px solid var(--rule); padding: .65rem 0 0; }
.journey-list li > a:first-child { display: block; font-family: var(--serif); font-size: 1.35rem; line-height: 1.22; text-decoration-color: var(--blue); }
.profiles { display: grid; gap: 1.2rem; }
.profile { display: grid; grid-template-columns: minmax(6.5rem, 9.4rem) 1fr; align-items: start; gap: .85rem; }
.profile figcaption { line-height: 1.25; }
.emergency-numbers { display: grid; gap: .65rem; padding: 0; list-style: none; margin-block-end: .8rem; }
.emergency-numbers li { padding: .7rem .85rem; border-block-start: 2px solid var(--blue-ink); background: var(--light-paper); }
.emergency-numbers li:last-child { border-block-start-color: var(--rule); background: var(--blue-pale); }
.emergency-numbers strong { font-size: clamp(1.7rem, 5vw, 2.35rem); color: var(--deep); font-variant-numeric: tabular-nums; line-height: 1.15; }
.emergency-numbers p { font-size: 1rem; }

.map-tiles { display: grid; gap: .9rem; margin-block: 1rem 1.5rem; }
.map-tile { border-block-start: 1px solid var(--rule); padding-block-start: .85rem; }
.map-link { display: grid; grid-template-columns: minmax(5.5rem, 38%) 1fr; gap: .7rem; color: var(--text); text-decoration: none; }
.map-photo { aspect-ratio: 1.415; display: grid; place-items: center; background: #fff; overflow: hidden; }
.map-photo img { width: 100%; height: 100%; object-fit: contain; }
.map-link h3 { margin: 0; font-size: 1.35rem; }
.map-link p { font-size: .9rem; line-height: 1.4; margin-block: .25rem; }
.map-link span { display: flex; align-items: center; gap: .3rem; color: var(--blue-ink); min-height: 44px; font-size: .9rem; font-weight: 650; }
.map-link small { display: block; color: var(--muted); line-height: 1.35; }
.map-link:hover span { text-decoration: underline; }

.footer { background: var(--deep); color: var(--footer-text); padding-block: clamp(1.8rem, 5vw, 4rem) 1rem; }
.footer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.15rem; }
.footer-brand { grid-column: 1 / -1; }
.footer-brand > a { font-family: var(--serif); font-size: clamp(1.85rem, 5vw, 2.75rem); line-height: 1.1; text-decoration: none; }
.footer-brand p { margin-block-start: .35rem; }
.footer a { color: var(--footer-text); }
.footer a:hover { color: var(--gold); }
.footer h2 { margin-block-end: .2rem; color: var(--gold); font: 650 1rem / 1.4 var(--sans); }
.footer ul { list-style: none; padding: 0; }
.footer li a { display: inline-flex; align-items: center; min-height: 44px; }
.footer-social { border-block-start: 1px solid #5a7b7c; margin-block-start: 1.45rem; padding-block-start: .55rem; }
.footer-social ul { display: flex; flex-wrap: wrap; gap: 0 1.15rem; }
.footer-end { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; margin-block-start: .55rem; border-block-start: 1px solid #5a7b7c; padding-block-start: .7rem; font-size: .9rem; }
.footer-end > a { display: flex; align-items: center; min-height: 44px; }

@media (min-width: 38rem) {
  .map-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .map-link { grid-template-columns: 1fr; }
  .emergency-numbers, .journey-list ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .emergency-numbers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 48rem) {
  .season { grid-template-columns: 1.12fr 1fr; }
  .season-photo { height: 100%; }
  .writers { grid-template-columns: auto 1fr; gap: 2.6rem; }
  .essentials ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
}
@media (min-width: 55rem) {
  .masthead-inner { min-height: 4.65rem; }
  .skyline-photo { height: clamp(21rem, 27vw, 30rem); }
  .skyline-photo img { object-position: center 35%; }
  .intro { grid-template-columns: minmax(0, 1.6fr) minmax(14rem, 1fr); align-items: end; gap: 1.65rem; padding-block: .6rem 1.45rem; }
  .intro h1 { max-width: 21ch; font-size: clamp(3.1rem, 5.35vw, 4.9rem); }
  .intro-action { padding-block-end: .25rem; }
  .routes ul { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .routes li:nth-child(n+3) { border-block-start: 0; }
  .routes li + li { border-inline-start: 1px solid var(--rule); }
  .routes a { padding: .75rem 1rem; }
  .stories { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2.1rem; }
  .stories-small { align-content: start; }
  .stories-small .story:first-child { border-block-start: 0; padding-block-start: 0; }
  .has-contents { grid-template-columns: minmax(0, 1fr) minmax(12rem, 15rem); column-gap: clamp(1.25rem, 4vw, 4rem); }
  .guide-contents { grid-column: 2; grid-row: 1; position: sticky; inset-block-start: 1.5rem; }
  .has-contents .article-body { grid-column: 1; grid-row: 1; }
  .article-body { font-size: 1.09rem; }
  .profiles { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1.45fr 1fr 1fr 1fr; }
  .footer-brand { grid-column: auto; }
}
@media (min-width: 64rem) {
  .primary { display: block; }
  .primary > ul { display: flex; align-items: center; gap: clamp(.6rem, 1.35vw, 1.45rem); }
  .primary > ul > li > a, .primary .nav-group > summary { font-size: .94rem; }
  .primary .nav-group { position: relative; }
  .primary .nav-group ul { position: absolute; min-width: 15rem; inset: 100% auto auto -1rem; padding: .35rem .85rem; border: 1px solid var(--rule); border-block-start: 3px solid var(--blue); background: var(--light-paper); }
  .primary .nav-group ul li + li { border-block-start: 1px solid var(--rule); }
  .primary > ul > li:last-child a { border: 1px solid var(--rule); padding-inline: .75rem; }
  .mobile-menu { display: none; }
  .map-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 27rem) {
  .profile { grid-template-columns: 1fr; }
  .map-link h3 { font-size: 1.2rem; }
}

@media (prefers-reduced-motion: no-preference) {
  .solid-link, .routes a, .masthead a { transition: background-color .18s ease, color .18s ease; }
  .arrow-link svg, .routes svg, .chevron { transition: transform .2s ease-out; }
  .arrow-link:is(:hover, :focus-visible) svg, .routes a:is(:hover, :focus-visible) svg { transform: translateX(3px); }
  .route-graphic[data-drawn] path { animation: draw-route .85s cubic-bezier(.16, 1, .3, 1) both; }
  @keyframes draw-route { from { stroke-dasharray: 100; stroke-dashoffset: 65; } to { stroke-dasharray: 100; stroke-dashoffset: 0; } }
}

body.am-magazine { color: var(--text); background: var(--paper); font-family: var(--sans); line-height: 1.6; }
.am-magazine .guide-layout > *, .am-magazine .guide-layout .article-body { margin-block: 0; }
.am-magazine .wpcf7 { max-width: 37rem; margin-block: 1rem 1.75rem; }
.am-magazine .wpcf7 label { color: var(--ink); font-weight: 650; }
.am-magazine .wpcf7 input:not([type=submit]), .am-magazine .wpcf7 textarea { width: 100%; min-height: 44px; margin-top: .35rem; padding: .5rem .65rem; color: var(--text); background: var(--light-paper); border: 1px solid var(--muted); border-radius: 0; }
.am-magazine .wpcf7 input[type=submit] { min-height: 44px; padding: .5rem 1rem; color: var(--light-paper); background: var(--deep); border: 1px solid var(--deep); border-radius: 0; }
.am-magazine .wpcf7 textarea { resize: vertical; }
.am-magazine .wpcf7 :focus-visible { outline: 2px solid var(--blue-ink); outline-offset: 4px; }
.am-magazine .privacy-body > h2:not(:first-child) { margin-block-start: 2rem; }
.am-magazine.admin-bar .guide-contents { inset-block-start: 3.7rem; }
.am-magazine.admin-bar .skip:focus { inset-block-start: 3.4rem; }
