:root {
  --ink: #10251d;
  --paper: #f3efe5;
  --sand: #ddd2bd;
  --red: #b94d32;
  --orange: #e5844f;
  --sage: #98a892;
  --white: #fffdf7;
  --line: rgba(16, 37, 29, .16);
  --shadow: 0 24px 70px rgba(54, 45, 32, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; overflow-x: hidden; }
a { color: inherit; }
button, input { font: inherit; }
img, svg, iframe { max-width: 100%; }
a, button { -webkit-tap-highlight-color: transparent; }

.site-header { height: 72px; padding: 0 clamp(20px, 5vw, 76px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(243,239,229,.92); backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 20; }
.brand { display: flex; gap: 12px; align-items: center; text-decoration: none; font-weight: 750; letter-spacing: -.02em; }
.brand-mark { width: 32px; height: 32px; border-radius: 50% 50% 46% 54%; display: grid; place-items: center; color: var(--white); background: var(--red); font-family: Georgia, serif; font-style: italic; }
.trip-chip { display: flex; gap: 9px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.trip-chip span { padding: 8px 11px; border: 1px solid var(--line); border-radius: 999px; }

main { overflow: hidden; }
.hero { min-height: 690px; padding: 100px clamp(20px, 8vw, 124px) 70px; background: var(--ink); color: var(--white); position: relative; isolation: isolate; }
.hero-visual { position: absolute; z-index: -1; width: min(52vw,760px); aspect-ratio: 1; right: -6%; top: 4%; margin: 0; overflow: hidden; border-radius: 48% 52% 45% 55%; background: var(--red); }
.hero-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(16,37,29,.35),transparent 38%), linear-gradient(0deg,rgba(16,37,29,.18),transparent 45%); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 69% center; filter: saturate(.8) contrast(1.02); transform: scale(1.04); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.hero:hover .hero-visual img { transform: scale(1); filter: saturate(.95) contrast(1.03); }
.hero::before { content: ""; position: absolute; width: min(36vw, 500px); height: 210px; right: 8%; bottom: 11%; z-index: -1; background: repeating-linear-gradient(0deg, transparent 0 18px, rgba(255,255,255,.17) 19px 20px); transform: rotate(-5deg); mask-image: linear-gradient(to right, transparent, black 30%); }
.eyebrow, .kicker { font-size: 12px; letter-spacing: .15em; text-transform: uppercase; font-weight: 760; }
.hero .eyebrow { color: #d7b69b; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(64px, 9vw, 132px); line-height: .82; font-weight: 500; letter-spacing: -.07em; margin: 34px 0; max-width: 850px; }
h1 em { color: #e39a69; font-weight: inherit; }
.hero-copy { width: 100%; max-width: 590px; color: rgba(255,253,247,.73); line-height: 1.7; font-size: clamp(17px, 2vw, 21px); }
.hero-actions { display: flex; gap: 12px; margin-top: 34px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 21px; border-radius: 999px; text-decoration: none; font-weight: 720; font-size: 14px; }
.button.primary { background: var(--white); color: var(--ink); }
.button.ghost { border: 1px solid rgba(255,255,255,.28); color: var(--white); }
.route-line { display: flex; align-items: center; gap: 18px; width: min(610px, 100%); margin-top: 80px; }
.route-line div { display: flex; flex-direction: column; min-width: 0; }
.route-line strong { font-size: 24px; letter-spacing: .04em; }
.route-line span { color: rgba(255,255,255,.55); font-size: 12px; }
.route-line i { height: 1px; flex: 1; background: rgba(255,255,255,.34); position: relative; }
.route-line i::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }

.section-nav { padding: 8px clamp(20px, 5vw, 76px); display: flex; gap: 24px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; border-bottom: 1px solid var(--line); background: var(--white); }
.section-nav::-webkit-scrollbar, .map-place-buttons::-webkit-scrollbar { display: none; }
.section-nav a { min-height: 48px; display: inline-flex; align-items: center; white-space: nowrap; text-decoration: none; font-size: 12px; font-weight: 750; text-transform: uppercase; letter-spacing: .09em; }
.readiness { display: grid; grid-template-columns: 1fr minmax(220px,.8fr) 1fr; gap: clamp(28px,5vw,72px); align-items: center; padding: 34px clamp(20px,8vw,124px); color: var(--white); background: var(--red); }
.readiness .kicker { margin: 0 0 8px; color: #f6c5a5; }
.readiness h2 { margin: 0; font: 500 clamp(27px,3vw,42px)/1 Georgia,serif; letter-spacing: -.035em; }
.readiness-meter { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.22); }
.readiness-meter span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--white); transition: width .35s ease; }
.readiness-next { display: grid; gap: 5px; padding-left: 24px; border-left: 1px solid rgba(255,255,255,.28); }
.readiness-next span { color: #f6c5a5; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.readiness-next strong { font-size: 14px; line-height: 1.35; }
.readiness-next a { width: fit-content; margin-top: 3px; color: rgba(255,255,255,.76); font-size: 12px; font-weight: 760; text-underline-offset: 4px; }
.visual-story { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(360px,.88fr); min-height: 690px; background: #dfd2bd; border-bottom: 1px solid var(--line); }
.visual-story-image { position: relative; min-height: 620px; margin: 0; overflow: hidden; }
.visual-story-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(16,37,29,.38),transparent 38%); pointer-events: none; }
.visual-story-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.visual-story:hover .visual-story-image img { transform: scale(1.025); }
.visual-story-image figcaption { position: absolute; z-index: 1; left: 30px; bottom: 26px; color: var(--white); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.visual-story-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(48px,7vw,100px); }
.visual-story-copy h2 { margin: 20px 0 24px; font: 500 clamp(48px,5.6vw,82px)/.92 Georgia,serif; letter-spacing: -.055em; }
.visual-story-copy h2 em { color: var(--red); font-weight: inherit; }
.visual-story-copy > p:not(.kicker) { max-width: 560px; color: rgba(16,37,29,.68); font-size: 17px; line-height: 1.7; }
.trip-rhythm { display: grid; grid-template-columns: repeat(3,1fr); margin: 28px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.trip-rhythm div { padding: 18px 12px 18px 0; }
.trip-rhythm div + div { padding-left: 12px; border-left: 1px solid var(--line); }
.trip-rhythm span,.trip-rhythm small { display: block; color: rgba(16,37,29,.53); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.trip-rhythm strong { display: block; margin: 9px 0 5px; font: 500 18px Georgia,serif; }
.visual-story-copy .text-link { width: fit-content; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: none; }
.section { padding: 110px clamp(20px, 8vw, 124px); border-bottom: 1px solid var(--line); }
.section-heading { display: grid; grid-template-columns: .8fr 2fr; gap: 50px; align-items: end; margin-bottom: 64px; }
.section-heading h2, .next-section h2, .booking-checklist h2 { font-family: Georgia, serif; font-size: clamp(48px, 7vw, 92px); font-weight: 500; line-height: .94; letter-spacing: -.055em; margin: 0; }
.section-number { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; }
.kicker { color: var(--red); margin: 16px 0 0; }
.points-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.points-card { padding: 34px; min-height: 300px; border-radius: 22px; display: flex; flex-direction: column; box-shadow: var(--shadow); }
.points-card.chase { background: var(--ink); color: var(--white); }
.points-card.delta { background: var(--white); }
.points-card > span { text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-weight: 760; opacity: .65; }
.points-card > strong { font-family: Georgia, serif; font-size: clamp(62px, 8vw, 100px); line-height: 1; font-weight: 500; letter-spacing: -.06em; margin-top: 20px; }
.points-card > p { margin: 3px 0 auto; opacity: .62; }
.value-row { display: flex; justify-content: space-between; padding-top: 15px; margin-top: 15px; border-top: 1px solid currentColor; border-color: rgba(127,127,127,.3); font-size: 14px; }
.recommendation { margin: 22px 0; padding: 34px; display: grid; grid-template-columns: 180px 1fr; gap: 26px; border-radius: 22px; background: var(--red); color: var(--white); }
.rec-label { text-transform: uppercase; letter-spacing: .1em; font-size: 11px; font-weight: 800; }
.recommendation h3 { font-family: Georgia, serif; font-size: clamp(28px, 4vw, 48px); line-height: 1.05; margin: 0; font-weight: 500; }
.recommendation p { color: rgba(255,255,255,.77); line-height: 1.65; max-width: 800px; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; background: var(--white); }
.step { padding: 30px; min-height: 355px; display: flex; flex-direction: column; }
.step + .step { border-left: 1px solid var(--line); }
.step-top { display: flex; justify-content: space-between; align-items: center; }
.step-top > span { width: 34px; height: 34px; border-radius: 50%; background: var(--sand); display: grid; place-items: center; font-weight: 800; }
.step-top small, .mode { color: var(--red); text-transform: uppercase; font-weight: 780; letter-spacing: .1em; }
.step h3, .transport-grid h3, .stay-feature h3 { font-family: Georgia, serif; font-weight: 500; font-size: 30px; letter-spacing: -.025em; margin: 28px 0 8px; }
.step p, .transport-grid p, .stay-feature p { line-height: 1.6; color: rgba(16,37,29,.68); }
.threshold { padding: 14px 0; margin-top: auto; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; font-size: 13px; }
.threshold strong { font-size: 18px; }
.text-link { margin-top: 18px; font-weight: 760; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.decision-note { display: flex; gap: 20px; padding: 24px 28px; margin-top: 20px; border: 1px solid var(--line); border-radius: 14px; }
.decision-note p { margin: 0; color: rgba(16,37,29,.7); }

.budget-section { background: #eadbc4; }
.budget-intro { max-width: 720px; margin: 22px 0 0; color: rgba(16,37,29,.66); font-size: 16px; line-height: 1.65; }
.budget-scenarios { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-bottom: 18px; }
.budget-scenarios article { min-height: 350px; padding: 28px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,253,247,.7); }
.budget-scenarios article.recommended { color: var(--white); background: var(--ink); border-color: var(--ink); }
.budget-scenarios span, .budget-breakdown-head span, .budget-total span { color: var(--red); text-transform: uppercase; letter-spacing: .1em; font-size: 10px; font-weight: 820; }
.budget-scenarios .recommended span { color: #efa375; }
.tier-label { display: flex; justify-content: space-between; gap: 18px; align-items: start; }
.tier-label em { max-width: 130px; color: rgba(16,37,29,.55); font: 700 9px/1.35 Inter,sans-serif; letter-spacing: .07em; text-align: right; text-transform: uppercase; }
.budget-scenarios .recommended .tier-label em { color: rgba(255,255,255,.58); }
.budget-scenarios strong { display: block; margin: 32px 0 7px; font: 500 clamp(33px,3.2vw,48px)/1 Georgia,serif; letter-spacing: -.045em; }
.budget-scenarios small { color: rgba(16,37,29,.55); font-size: 11px; font-weight: 740; }
.budget-scenarios .recommended small { color: rgba(255,255,255,.58); }
.budget-tier ul { margin: 22px 0; padding: 0; list-style: none; }
.budget-tier li { position: relative; margin: 9px 0; padding-left: 17px; color: rgba(16,37,29,.74); font-size: 12px; line-height: 1.45; }
.budget-tier li::before { content: ""; position: absolute; left: 0; top: .52em; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.budget-tier.recommended li { color: rgba(255,255,255,.76); }
.budget-tier.recommended li::before { background: #efa375; }
.budget-scenarios p { margin: auto 0 0; color: rgba(16,37,29,.62); font-size: 13px; line-height: 1.55; }
.budget-scenarios .recommended p { color: rgba(255,255,255,.66); }
.budget-tier.lean { background: #f5eee1; }
.budget-tier.fallback { background: rgba(255,253,247,.42); }
.cheaper-playbook { margin: 18px 0; padding: clamp(26px,4vw,42px); border: 1px solid var(--line); border-radius: 22px; background: #fffdf7; }
.cheaper-playbook-head { display: grid; grid-template-columns: 180px 1fr; gap: 28px; align-items: start; margin-bottom: 30px; }
.cheaper-playbook-head span, .savings-grid strong { color: var(--red); font-size: 10px; font-weight: 820; letter-spacing: .1em; text-transform: uppercase; }
.cheaper-playbook h3 { margin: 0; max-width: 690px; font: 500 clamp(30px,4vw,48px)/1.02 Georgia,serif; letter-spacing: -.04em; }
.savings-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.savings-grid article { padding: 25px 24px 25px 0; }
.savings-grid article + article { padding-left: 24px; border-left: 1px solid var(--line); }
.savings-grid h4 { margin: 12px 0 9px; font: 500 22px/1.08 Georgia,serif; }
.savings-grid p, .price-source-note { color: rgba(16,37,29,.63); font-size: 12px; line-height: 1.55; }
.savings-grid p { margin: 0; }
.price-source-note { margin: 20px 0 0; }
.budget-breakdown { overflow: hidden; border-radius: 22px; background: var(--white); box-shadow: var(--shadow); }
.budget-breakdown-head { display: flex; justify-content: space-between; gap: 30px; align-items: end; padding: 28px 30px; border-bottom: 1px solid var(--line); }
.budget-breakdown-head h3 { margin: 9px 0 0; font: 500 31px/1 Georgia,serif; letter-spacing: -.035em; }
.budget-breakdown-head > strong { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.budget-row { display: grid; grid-template-columns: 1fr auto; gap: 28px; align-items: center; padding: 17px 30px; border-bottom: 1px solid var(--line); }
.budget-row div > strong { display: block; font-size: 14px; }
.budget-row small { display: block; margin-top: 4px; color: rgba(16,37,29,.56); font-size: 11px; line-height: 1.4; }
.budget-row > b { font: 500 22px Georgia,serif; white-space: nowrap; }
.budget-row.verified div > strong::after { content: "Published price"; margin-left: 9px; color: var(--red); font: 800 8px Inter,sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.budget-total { display: flex; justify-content: space-between; gap: 30px; align-items: center; padding: 25px 30px; color: var(--white); background: var(--red); }
.budget-total span { color: #ffd0b5; }
.budget-total small { display: block; margin-top: 5px; color: rgba(255,255,255,.68); }
.budget-total > strong { font: 500 clamp(32px,4vw,50px)/1 Georgia,serif; letter-spacing: -.04em; white-space: nowrap; }
.budget-note { display: grid; grid-template-columns: 190px 1fr; gap: 25px; margin-top: 16px; padding: 22px 26px; border: 1px solid var(--line); border-radius: 16px; }
.budget-note p { margin: 0; color: rgba(16,37,29,.66); line-height: 1.55; }

.calendar-section { background: #dcd2bd; }
.calendar-controls { display: flex; gap: 6px; margin: -20px 0 24px; }
.calendar-note { display: flex; gap: 16px; align-items: baseline; margin: 0 0 20px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,253,247,.58); }
.calendar-note strong { flex: 0 0 auto; color: var(--red); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.calendar-note p { margin: 0; color: rgba(16,37,29,.65); font-size: 12px; line-height: 1.5; }
.view-button { border: 1px solid var(--line); background: transparent; border-radius: 999px; padding: 10px 15px; cursor: pointer; color: var(--ink); }
.view-button.active { background: var(--ink); color: var(--white); }
.calendar { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.day { min-height: 350px; padding: 24px; background: rgba(255,253,247,.72); border-radius: 18px; display: flex; flex-direction: column; }
.day.travel-day { background: var(--ink); color: var(--white); }
.date { display: grid; grid-template-columns: 1fr auto; align-items: start; border-bottom: 1px solid currentColor; border-color: rgba(127,127,127,.3); padding-bottom: 18px; }
.date span { text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-weight: 800; }
.date strong { font-family: Georgia, serif; font-size: 52px; font-weight: 500; line-height: .8; grid-row: span 2; }
.date small { opacity: .55; }
.day-body { padding-top: 22px; }
.tag { display: inline-block; color: var(--red); text-transform: uppercase; letter-spacing: .1em; font-size: 10px; font-weight: 820; }
.travel-day .tag { color: #e69a69; }
.day h3 { font-family: Georgia, serif; font-size: 24px; line-height: 1.08; font-weight: 500; margin: 15px 0; }
.day p, .day li { font-size: 13px; line-height: 1.55; opacity: .68; }
.day ul { padding-left: 18px; }
.timed-list { display: grid; gap: 11px; padding: 0 !important; margin: 18px 0; list-style: none; }
.timed-list li { display: grid; grid-template-columns: 112px 1fr; gap: 10px; align-items: baseline; opacity: 1; }
.timed-list time { color: var(--red); font-size: 10px; font-weight: 820; letter-spacing: .05em; text-transform: uppercase; }
.travel-day .timed-list time { color: #e69a69; }
.timed-list span { color: rgba(16,37,29,.68); }
.travel-day .timed-list span { color: rgba(255,255,255,.68); }
.time-options { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(127,127,127,.28); }
.time-options > strong { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.time-options ul { margin: 9px 0 0; padding-left: 17px; }
.time-options li { margin: 6px 0; }
.time-options b { color: inherit; }
.calendar.timeline { display: flex; flex-direction: column; gap: 8px; }
.calendar.timeline .day { min-height: 0; padding: 26px 28px; display: grid; grid-template-columns: 140px 1fr; }
.calendar.timeline .date { border: 0; padding: 0 20px 0 0; }
.calendar.timeline .day-body { padding: 0 0 0 28px; border-left: 1px solid rgba(127,127,127,.3); }

.section-heading.compact { margin-bottom: 48px; }
.transport-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--white); border-radius: 22px; overflow: hidden; border: 1px solid var(--line); }
.transport-grid article { padding: 28px; min-height: 280px; }
.transport-grid article + article { border-left: 1px solid var(--line); }
.mode { font-size: 10px; }
.timing-band { display: grid; grid-template-columns: 1fr 1fr; margin-top: 20px; background: var(--ink); color: var(--white); border-radius: 22px; overflow: hidden; }
.timing-band div { padding: 32px; }
.timing-band div + div { border-left: 1px solid rgba(255,255,255,.18); }
.timing-band span { display: block; color: #e69a69; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.timing-band strong { display: block; font-family: Georgia, serif; font-size: 32px; margin-top: 12px; }
.timing-band p { color: rgba(255,255,255,.65); margin-bottom: 0; }

.stay-layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: 20px; }
.stay-feature { background: var(--red); color: var(--white); border-radius: 22px; padding: 42px; min-height: 360px; }
.stay-feature .tag { color: #f0be9e; }
.stay-feature h3 { font-size: clamp(34px, 4vw, 56px); }
.stay-feature p { color: rgba(255,255,255,.72); max-width: 580px; }
.hotel-list { border-radius: 22px; overflow: hidden; border: 1px solid var(--line); background: var(--white); }
.hotel-list div { padding: 22px 25px; display: flex; flex-direction: column; gap: 4px; }
.hotel-list div + div { border-top: 1px solid var(--line); }
.hotel-list span { color: rgba(16,37,29,.6); font-size: 13px; }

.booking-checklist { background: var(--ink); color: var(--white); display: grid; grid-template-columns: 1fr 1.2fr; gap: 70px; }
.booking-checklist h2 { font-size: clamp(45px, 5vw, 70px); margin-top: 14px; }
.booking-checklist > div > p:last-child { color: rgba(255,255,255,.62); line-height: 1.6; }
.checklist { border-top: 1px solid rgba(255,255,255,.2); }
.checklist label { display: flex; align-items: center; gap: 14px; padding: 18px 2px; border-bottom: 1px solid rgba(255,255,255,.2); cursor: pointer; }
.checklist input { appearance: none; width: 22px; height: 22px; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; display: grid; place-items: center; }
.checklist input:checked { background: var(--orange); border-color: var(--orange); }
.checklist input:checked::after { content: "✓"; color: var(--ink); font-weight: 900; font-size: 14px; }
.checklist input:checked + span { text-decoration: line-through; opacity: .5; }

.packing-section { background: #e4d8c4; }
.packing-heading { display: grid; grid-template-columns: .65fr 1.8fr; gap: 50px; align-items: end; }
.packing-heading h2 { margin: 0; font: 500 clamp(52px,7vw,96px)/.92 Georgia,serif; letter-spacing: -.055em; }
.packing-heading h2 em { color: var(--red); font-weight: inherit; }
.packing-heading > div:last-child > p { max-width: 720px; color: rgba(16,37,29,.65); font-size: 17px; line-height: 1.65; }
.packing-progress { display: grid; grid-template-columns: 260px 1fr; gap: 30px; align-items: center; margin: 52px 0 22px; padding: 22px 26px; color: var(--white); background: var(--red); border-radius: 16px; }
.packing-progress div:first-child { display: grid; gap: 5px; }
.packing-progress span { color: #f7c6a7; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.packing-progress strong { font: 500 24px Georgia,serif; }
.packing-meter { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.24); }
.packing-meter span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--white); transition: width .35s ease; }
.packing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.packing-group { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--white); }
.packing-group.featured { color: var(--white); background: var(--ink); }
.packing-group-head { display: flex; gap: 15px; align-items: center; padding: 26px; border-bottom: 1px solid var(--line); }
.packing-group.featured .packing-group-head { border-color: rgba(255,255,255,.18); }
.packing-group-head > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 10px; opacity: .65; }
.packing-group-head small { color: var(--red); font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.packing-group.featured .packing-group-head small { color: #efa375; }
.packing-group h3 { margin: 5px 0 0; font: 500 28px Georgia,serif; }
.packing-group label { display: flex; gap: 13px; align-items: flex-start; padding: 18px 22px; cursor: pointer; }
.packing-group label + label { border-top: 1px solid var(--line); }
.packing-group.featured label + label { border-color: rgba(255,255,255,.16); }
.packing-group input { appearance: none; width: 21px; height: 21px; flex: 0 0 auto; display: grid; place-items: center; margin-top: 1px; border: 1px solid rgba(16,37,29,.35); border-radius: 50%; }
.packing-group.featured input { border-color: rgba(255,255,255,.5); }
.packing-group input:checked { border-color: var(--red); background: var(--red); }
.packing-group input:checked::after { content: "✓"; color: var(--white); font-size: 12px; font-weight: 900; }
.packing-group label > span { display: grid; gap: 4px; }
.packing-group label strong { font-size: 13px; line-height: 1.3; }
.packing-group label small { color: rgba(16,37,29,.58); font-size: 11px; line-height: 1.4; }
.packing-group.featured label small { color: rgba(255,255,255,.58); }
.packing-group input:checked + span { opacity: .5; }
.packing-group input:checked + span strong { text-decoration: line-through; }
.packing-note { display: flex; gap: 26px; margin-top: 16px; padding: 22px 26px; border-radius: 16px; color: var(--white); background: var(--ink); }
.packing-note strong { flex: 0 0 auto; color: #efa375; font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
.packing-note p { margin: 0; color: rgba(255,255,255,.68); line-height: 1.55; }

.next-section { text-align: center; background: var(--white); }
.next-section h2 { margin: 20px auto; }
.next-section > p:not(.kicker) { max-width: 670px; margin: 0 auto; color: rgba(16,37,29,.68); line-height: 1.7; }
.coming-soon { display: inline-flex; padding: 14px 20px; border: 1px solid var(--line); border-radius: 999px; margin-top: 30px; text-transform: uppercase; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.dark-button { background: var(--ink); color: var(--white); margin-top: 30px; }
.page-switch { display: flex; padding: 4px; border: 1px solid var(--line); border-radius: 999px; }
.page-switch a { padding: 7px 13px; border-radius: 999px; text-decoration: none; font-size: 12px; font-weight: 760; }
.page-switch a { min-height: 38px; display: inline-flex; align-items: center; }
.page-switch a.active { color: var(--white); background: var(--ink); }
.attractions-hero { min-height: 650px; padding: 110px clamp(20px, 8vw, 124px) 80px; display: grid; grid-template-columns: 1.65fr .65fr; align-items: end; gap: 50px; color: var(--white); background: var(--red); position: relative; overflow: hidden; }
.attractions-hero::after { content: ""; position: absolute; width: 480px; height: 480px; border: 1px solid rgba(255,255,255,.22); border-radius: 46% 54% 55% 45%; right: -160px; top: -170px; box-shadow: 0 0 0 60px rgba(255,255,255,.04), 0 0 0 120px rgba(255,255,255,.025); }
.attractions-hero h1 { margin: 28px 0; font-size: clamp(64px, 8.5vw, 120px); position: relative; z-index: 1; }
.attractions-hero h1 em { color: #f0bd9b; }
.attractions-hero > div > p { max-width: 690px; color: rgba(255,255,255,.76); font-size: 19px; line-height: 1.7; }
.attractions-hero .eyebrow { color: #f5c6a8; }
.best-mix { padding: 28px; background: var(--ink); border-radius: 20px; display: flex; flex-direction: column; position: relative; z-index: 1; box-shadow: var(--shadow); }
.best-mix > span { color: #e99a6b; text-transform: uppercase; letter-spacing: .1em; font-size: 10px; font-weight: 800; margin-bottom: 20px; }
.best-mix strong { font-family: Georgia, serif; font-size: 27px; font-weight: 500; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.18); }
.best-mix small { color: rgba(255,255,255,.55); padding-top: 16px; }
.attractions-nav { background: var(--ink); color: var(--white); border-color: rgba(255,255,255,.13); }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.filter-button { min-height: 44px; border: 1px solid var(--line); border-radius: 999px; background: transparent; padding: 10px 16px; color: var(--ink); cursor: pointer; }
.filter-button.active { background: var(--ink); color: var(--white); }
.attraction-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.attraction-card { display: grid; grid-template-columns: 210px 1fr; min-height: 420px; border: 1px solid var(--line); border-radius: 22px; background: var(--white); overflow: hidden; }
.attraction-card.hidden { display: none; }
.card-art { min-height: 100%; margin: 0; position: relative; overflow: hidden; background: var(--red); }
.card-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(10,24,19,.24),transparent 38%,rgba(10,24,19,.5)); pointer-events: none; }
.card-art img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.attraction-card:hover .card-art img { transform: scale(1.035); }
.card-art.cathedral img { object-position: 47% center; }
.card-art.jeep img { object-position: 58% center; }
.card-art.stars img { object-position: 54% center; }
.card-art.bridge img { object-position: 48% center; }
.card-art span { position: absolute; left: 20px; top: 20px; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; color: var(--white); background: rgba(10,24,19,.2); backdrop-filter: blur(8px); font-size: 11px; z-index: 2; }
.card-art figcaption { position: absolute; right: 12px; bottom: 11px; z-index: 2; max-width: calc(100% - 24px); text-align: right; }
.card-art figcaption a { color: rgba(255,255,255,.78); font-size: 8px; line-height: 1.3; text-decoration: none; text-shadow: 0 1px 6px rgba(0,0,0,.65); }
.card-art figcaption a:hover { color: var(--white); text-decoration: underline; }
.card-content { padding: 28px; display: flex; flex-direction: column; }
.card-flags { display: flex; justify-content: space-between; gap: 10px; color: var(--red); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; font-weight: 820; }
.card-content h3 { font-family: Georgia, serif; font-size: 35px; font-weight: 500; letter-spacing: -.03em; margin: 26px 0 10px; }
.card-content > p { color: rgba(16,37,29,.67); line-height: 1.55; margin: 0 0 22px; }
.card-content dl { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: auto 0 22px; }
.card-content dl div { padding-top: 11px; border-top: 1px solid var(--line); }
.card-content dt { color: rgba(16,37,29,.48); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.card-content dd { margin: 4px 0 0; font-size: 12px; font-weight: 720; line-height: 1.35; }
.card-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); padding-top: 17px; font-size: 12px; font-weight: 760; }
.card-actions a { text-underline-offset: 4px; }
.card-actions label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.card-actions input { appearance: none; width: 18px; height: 18px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; }
.card-actions input:checked { background: var(--red); }
.card-actions input:checked::after { content: "✓"; color: var(--white); font-size: 11px; font-weight: 900; }
.save-note { color: rgba(16,37,29,.55); font-size: 12px; text-align: right; }
.schedule-section { background: var(--ink); color: var(--white); }
.schedule-section .section-number { border-color: rgba(255,255,255,.28); }
.experience-calendar { border-top: 1px solid rgba(255,255,255,.2); }
.experience-calendar > article { display: grid; grid-template-columns: 120px 1fr; padding: 28px 0; border-bottom: 1px solid rgba(255,255,255,.2); }
.experience-date span { display: block; color: #e99a6b; text-transform: uppercase; letter-spacing: .1em; font-size: 11px; font-weight: 800; }
.experience-date strong { font-family: Georgia,serif; font-size: 70px; font-weight: 500; line-height: 1; }
.experience-flow { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.experience-flow > div { padding: 18px; min-height: 145px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; }
.experience-flow > div.highlight { background: var(--red); border-color: var(--red); }
.experience-flow > div.night { background: #273e39; }
.experience-flow time { display: block; color: #e99a6b; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 15px; }
.experience-flow .highlight time { color: #ffd1b6; }
.experience-flow strong { font-family: Georgia,serif; font-size: 21px; font-weight: 500; }
.experience-flow p { color: rgba(255,255,255,.58); font-size: 12px; line-height: 1.45; }
.alternative-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; background: var(--white); }
.alternative-grid article { min-height: 260px; padding: 28px; }
.alternative-grid article + article { border-left: 1px solid var(--line); }
.alternative-grid span { color: var(--red); text-transform: uppercase; font-size: 10px; letter-spacing: .09em; font-weight: 800; }
.alternative-grid h3 { font-family: Georgia,serif; font-size: 28px; font-weight: 500; margin: 30px 0 10px; }
.alternative-grid p { color: rgba(16,37,29,.65); line-height: 1.55; }
.alternative-grid a { font-weight: 760; font-size: 13px; text-underline-offset: 4px; }
.field-notes { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; background: #ded2bb; }
.field-notes h2 { font-family: Georgia,serif; font-size: clamp(50px,6vw,82px); line-height: .95; font-weight: 500; letter-spacing: -.05em; }
.notes-list > div { display: grid; grid-template-columns: 45px 1fr; gap: 15px; border-top: 1px solid var(--line); padding: 20px 0; }
.notes-list span { color: var(--red); font-weight: 800; }
.notes-list p { margin: 0; line-height: 1.55; }
.attraction-footer-cta { background: var(--white); }
.dining-section { background: #e3d7c2; }
.dining-intro { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: end; margin-bottom: 34px; }
.dining-intro > p { max-width: 700px; color: rgba(16,37,29,.68); font-size: 18px; line-height: 1.65; }
.dining-intro > div { border-top: 1px solid var(--line); padding-top: 15px; }
.dining-intro span { display: block; color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 10px; font-weight: 800; }
.dining-intro strong { display: block; margin-top: 8px; }
.restaurant-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.restaurant-card { min-height: 295px; padding: 28px; display: grid; grid-template-columns: 45px 1fr; gap: 20px; border-radius: 18px; border: 1px solid var(--line); background: var(--white); }
.restaurant-card.recommended { background: var(--ink); color: var(--white); }
.restaurant-card.special { background: var(--red); color: var(--white); }
.restaurant-rank { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; opacity: .7; }
.restaurant-card span { color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.restaurant-card.recommended span, .restaurant-card.special span { color: #f0b18b; }
.restaurant-card h3 { font-family: Georgia,serif; font-size: 31px; font-weight: 500; margin: 18px 0 8px; }
.restaurant-card p { line-height: 1.55; color: rgba(16,37,29,.65); }
.restaurant-card.recommended p, .restaurant-card.special p { color: rgba(255,255,255,.68); }
.restaurant-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0; }
.restaurant-meta b { padding: 6px 9px; border: 1px solid currentColor; border-radius: 999px; font-size: 9px; text-transform: uppercase; letter-spacing: .06em; opacity: .68; }
.restaurant-card a { font-size: 12px; font-weight: 780; text-underline-offset: 4px; }
.dinner-map { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 20px; border-radius: 18px; background: var(--white); border: 1px solid var(--line); overflow: hidden; }
.dinner-map > div { padding: 22px; }
.dinner-map > div + div { border-left: 1px solid var(--line); }
.dinner-map span { display: block; color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 10px; font-weight: 800; }
.dinner-map strong { display: block; font-family: Georgia,serif; font-size: 24px; margin-top: 10px; }
.dinner-map p { color: rgba(16,37,29,.58); font-size: 12px; }
.extras-section { background: var(--white); }
.extras-grid { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; }
.extras-grid article { padding: 26px; min-height: 355px; display: flex; flex-direction: column; }
.extras-grid article + article { border-left: 1px solid var(--line); }
.extra-number { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: var(--sand); margin-bottom: 35px; font-size: 11px; font-weight: 800; }
.extras-grid article > span { color: var(--red); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; font-weight: 800; }
.extras-grid h3 { font-family: Georgia,serif; font-weight: 500; font-size: 28px; line-height: 1.05; margin: 16px 0 10px; }
.extras-grid p { color: rgba(16,37,29,.65); line-height: 1.55; }
.extra-access { margin-top: auto; padding: 13px 0; border-top: 1px solid var(--line); font-size: 11px; font-weight: 740; }
.extras-grid a { font-size: 12px; font-weight: 780; text-underline-offset: 4px; }
.weather-backup { display: grid; grid-template-columns: 220px 1fr; gap: 20px; padding: 24px 28px; margin-top: 18px; border-radius: 16px; color: var(--white); background: var(--red); }
.weather-backup span { text-transform: uppercase; letter-spacing: .09em; font-size: 10px; font-weight: 800; }
.weather-backup p { margin: 0; color: rgba(255,255,255,.72); }
.map-section { background: #d8c5a6; }
.map-intro { display: grid; grid-template-columns: 1.4fr .8fr; gap: 50px; align-items: end; margin-bottom: 34px; }
.map-intro > p { margin: 0; max-width: 760px; font-size: 18px; line-height: 1.65; color: rgba(16,37,29,.7); }
.map-intro > div { padding: 18px 0; border-top: 1px solid var(--line); }
.map-intro span, .ride-plan-title span { display: block; color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 10px; font-weight: 800; }
.map-intro strong { display: block; margin: 8px 0 5px; font-size: 17px; }
.map-intro small { color: rgba(16,37,29,.57); }
.live-map-panel { margin-bottom: 26px; overflow: hidden; border-radius: 24px; background: var(--white); box-shadow: var(--shadow); }
.live-map-toolbar { display: grid; grid-template-columns: 210px 1fr; gap: 24px; align-items: center; padding: 22px 26px; }
.live-map-toolbar > div:first-child span { display: block; color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.live-map-toolbar > div:first-child strong { display: block; margin-top: 7px; font: 500 22px Georgia,serif; }
.map-place-buttons { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.map-place-buttons button { min-height: 42px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: transparent; font-size: 10px; font-weight: 760; cursor: pointer; }
.map-place-buttons button:hover, .map-place-buttons button:focus-visible { border-color: var(--red); }
.map-place-buttons button.active { color: var(--white); border-color: var(--red); background: var(--red); }
.google-map-frame { height: min(61vw, 610px); min-height: 470px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #e8e2d5; }
.google-map-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.live-map-footer { display: flex; justify-content: space-between; gap: 30px; align-items: center; padding: 18px 26px; }
.live-map-footer p { margin: 0; color: rgba(16,37,29,.58); font-size: 12px; }
.live-map-footer a { font-size: 12px; font-weight: 800; white-space: nowrap; text-underline-offset: 4px; }
.visitor-map-feature { margin: 42px 0 12px; padding: clamp(22px,4vw,42px); border-radius: 28px; color: var(--white); background: var(--ink); }
.visitor-map-head { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: end; margin-bottom: 26px; }
.visitor-map-head span { color: #efa375; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.visitor-map-head h3 { margin: 11px 0 0; font: 500 clamp(36px,4vw,56px)/1 Georgia,serif; letter-spacing: -.04em; }
.visitor-map-head p { margin: 0; color: rgba(255,255,255,.65); line-height: 1.6; }
.visitor-map-art { margin: 0; overflow: hidden; border-radius: 20px; background: #e6d8c2; }
.visitor-map-art a { display: block; overflow: hidden; }
.visitor-map-art img { display: block; width: 100%; height: auto; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.visitor-map-art a:hover img { transform: scale(1.012); }
.visitor-map-art figcaption { display: flex; justify-content: space-between; gap: 20px; padding: 13px 18px; color: rgba(16,37,29,.62); background: var(--white); font-size: 9px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.visitor-map-actions { display: grid; grid-template-columns: auto auto 1fr; gap: 22px; align-items: center; margin-top: 20px; }
.visitor-map-actions .button { margin: 0; background: var(--white); color: var(--ink); }
.visitor-map-actions > a:not(.button) { color: #efaa82; font-size: 12px; font-weight: 800; text-underline-offset: 4px; white-space: nowrap; }
.visitor-map-actions p { justify-self: end; max-width: 520px; margin: 0; color: rgba(255,255,255,.62); font-size: 12px; line-height: 1.5; text-align: right; }
.orientation-label { display: flex; justify-content: space-between; gap: 30px; align-items: baseline; margin: 44px 0 16px; }
.orientation-label span { color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 10px; font-weight: 800; }
.orientation-label p { margin: 0; color: rgba(16,37,29,.58); font-size: 12px; }
.map-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(330px,.65fr); overflow: hidden; border-radius: 24px; background: var(--white); box-shadow: var(--shadow); }
.sedona-map { margin: 0; padding: 22px; background: #efe4d1; }
.sedona-map svg { display: block; width: 100%; height: auto; }
.sedona-map figcaption { padding: 13px 3px 0; color: rgba(16,37,29,.55); font-size: 11px; }
.map-zone rect { fill: #fffdf7; opacity: .92; filter: url(#mapShadow); }
.map-zone text { fill: #10251d; font: 800 13px Inter, sans-serif; letter-spacing: 1.5px; }
.map-zone .zone-note { font-size: 11px; font-weight: 650; letter-spacing: 0; fill: #53625a; }
.road-label { fill: #6b695b; font: 800 11px Inter, sans-serif; letter-spacing: 1px; }
.trail-label { fill: #8f3828; font: 800 11px Inter, sans-serif; letter-spacing: 1.2px; }
.map-distance rect { fill: rgba(16,37,29,.82); }
.map-distance text { fill: #fffdf7; text-anchor: middle; font: 800 7px Inter,sans-serif; letter-spacing: .45px; }
.map-pin { cursor: pointer; outline: none; }
.map-pin circle { fill: #b94d32; stroke: #fffdf7; stroke-width: 4; filter: url(#mapShadow); }
.map-pin text { text-anchor: middle; fill: white; font: 800 12px Inter, sans-serif; }
.map-pin circle, .map-pin text { transition: transform .2s ease, fill .2s ease; transform-box: fill-box; transform-origin: center; }
.map-pin:hover circle, .map-pin:focus-visible circle, .map-pin.is-active circle { fill: #10251d; transform: scale(1.2); }
.map-pin:hover text, .map-pin:focus-visible text, .map-pin.is-active text { transform: scale(1.08); }
.map-key { padding: 20px 26px; display: flex; flex-direction: column; justify-content: center; }
.map-key > div { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; padding: 14px 8px; border-bottom: 1px solid var(--line); border-radius: 12px; transition: background .2s ease, transform .2s ease; }
.map-key > div:last-child { border-bottom: 0; }
.map-key > div.is-active { background: #f3e6d2; transform: translateX(-5px); }
.map-key > div > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: white; font-size: 11px; font-weight: 800; }
.map-key p { margin: 0; color: rgba(16,37,29,.6); font-size: 11px; line-height: 1.4; }
.map-key p strong { display: block; color: var(--ink); font-size: 13px; }
.map-key p small { display: block; max-height: 0; overflow: hidden; opacity: 0; color: var(--red); font-size: 9px; font-weight: 760; line-height: 1.35; transition: max-height .25s ease, opacity .2s ease, margin .2s ease; }
.map-key > div.is-active p small { max-height: 40px; margin-top: 5px; opacity: 1; }
.map-key a { font-size: 10px; font-weight: 800; text-underline-offset: 3px; white-space: nowrap; }
.mobility-heading { display: flex; align-items: end; justify-content: space-between; margin: 70px 0 24px; }
.mobility-heading h3 { margin: 0; font: 500 clamp(32px,4vw,52px) Georgia,serif; letter-spacing: -.04em; }
.mobility-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.mobility-grid article { min-height: 330px; padding: 26px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: var(--white); }
.mobility-grid article.recommended { color: var(--white); background: var(--ink); }
.mobility-grid article > span { color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.mobility-grid article.recommended > span { color: #efa375; }
.mobility-grid h4 { margin: 28px 0 8px; font: 500 29px Georgia,serif; }
.mobility-grid article > strong { min-height: 34px; font-size: 12px; }
.mobility-grid p { color: rgba(16,37,29,.64); font-size: 13px; line-height: 1.55; }
.mobility-grid article.recommended p { color: rgba(255,255,255,.65); }
.mobility-grid a { margin-top: auto; font-size: 12px; font-weight: 800; text-underline-offset: 4px; }
.dual-links { margin-top: auto; display: flex; gap: 16px; }
.ride-plan { display: grid; grid-template-columns: .65fr 1.35fr; gap: 45px; margin-top: 18px; padding: 35px; border-radius: 20px; color: var(--white); background: var(--red); }
.ride-plan-title h3 { margin: 18px 0 0; font: 500 38px/1 Georgia,serif; }
.ride-plan-title span { color: #ffd0b5; }
.ride-table { border-top: 1px solid rgba(255,255,255,.28); }
.ride-row { display: grid; grid-template-columns: 145px 1fr 90px; gap: 15px; align-items: center; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.28); font-size: 12px; }
.ride-row span { color: rgba(255,255,255,.72); line-height: 1.4; }
.ride-row b { text-align: right; color: #ffd0b5; font-size: 10px; text-transform: uppercase; letter-spacing: .07em; }
.transport-note { display: grid; grid-template-columns: 270px 1fr; gap: 25px; align-items: start; margin-top: 18px; padding: 22px 26px; border: 1px solid var(--line); border-radius: 16px; }
.transport-note p { margin: 0; color: rgba(16,37,29,.65); line-height: 1.55; }
.groome-cta { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; margin-top: 18px; padding: 30px; border-radius: 18px; color: var(--white); background: var(--ink); }
.groome-cta span { color: #efa375; text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.groome-cta h3 { margin: 10px 0 6px; font: 500 30px Georgia,serif; }
.groome-cta p { margin: 0; max-width: 720px; color: rgba(255,255,255,.65); line-height: 1.5; }
.groome-cta > div:last-child { display: flex; flex-direction: column; align-items: center; gap: 13px; }
.groome-cta .button { margin: 0; white-space: nowrap; }
.groome-cta > div:last-child > a:last-child { color: rgba(255,255,255,.72); font-size: 11px; }
.airport-booking { margin-top: 55px; padding: 34px; border-radius: 24px; background: #ded2bb; }
.airport-booking-head { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 26px; }
.airport-booking-head h3 { margin: 12px 0 0; font: 500 42px Georgia,serif; letter-spacing: -.03em; }
.airport-booking-head > p { margin: 0; color: rgba(16,37,29,.66); line-height: 1.6; }
.transfer-option-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 12px; }
.transfer-option { min-height: 330px; padding: 26px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: var(--white); }
.transfer-option.recommended { color: var(--white); background: var(--ink); }
.transfer-option > span { color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.transfer-option.recommended > span { color: #efa375; }
.transfer-option h4 { margin: 28px 0 8px; font: 500 29px Georgia,serif; }
.transfer-option > strong { font-size: 12px; }
.transfer-option p { color: rgba(16,37,29,.64); font-size: 13px; line-height: 1.55; }
.transfer-option.recommended p { color: rgba(255,255,255,.65); }
.booking-links { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: auto; }
.booking-links a { font-size: 11px; font-weight: 800; text-underline-offset: 4px; }
.booking-links .button { margin: 0; text-decoration: none; }
.transfer-advice { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,253,247,.55); }
.transfer-advice > div { padding: 20px; }
.transfer-advice > div + div { border-left: 1px solid var(--line); }
.transfer-advice span { color: var(--red); text-transform: uppercase; letter-spacing: .09em; font-size: 9px; font-weight: 800; }
.transfer-advice strong { display: block; margin: 8px 0; font-size: 13px; }
.transfer-advice p { margin: 0; color: rgba(16,37,29,.6); font-size: 11px; line-height: 1.5; }
footer { display: flex; justify-content: space-between; gap: 30px; padding: 32px clamp(20px, 5vw, 76px); background: var(--white); font-size: 13px; }

@media (max-width: 1100px) {
  .attraction-grid { grid-template-columns: 1fr; }
  .mobility-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  .trip-chip span:first-child { display: none; }
  .hero { min-height: 640px; }
  .hero-visual { width: 76vw; right: -29%; opacity: .62; }
  .section-heading { grid-template-columns: 1fr; gap: 24px; }
  .points-grid, .stay-layout, .booking-checklist { grid-template-columns: 1fr; }
  .packing-heading { grid-template-columns: 1fr; gap: 24px; }
  .packing-grid { grid-template-columns: 1fr 1fr; }
  .packing-group.featured { grid-column: 1 / -1; }
  .steps, .transport-grid { grid-template-columns: 1fr 1fr; }
  .step + .step, .transport-grid article + article { border-left: 0; }
  .step:nth-child(2), .transport-grid article:nth-child(even) { border-left: 1px solid var(--line); }
  .step:nth-child(3), .transport-grid article:nth-child(n+3) { border-top: 1px solid var(--line); }
  .calendar { grid-template-columns: 1fr 1fr; }
  .readiness { grid-template-columns: 1fr 1fr; }
  .readiness-meter { grid-column: 1 / -1; grid-row: 2; }
  .visual-story { grid-template-columns: 1fr; }
  .visual-story-image { min-height: 520px; }
  .day:first-child { grid-column: span 2; }
  .attractions-hero { grid-template-columns: 1fr; }
  .best-mix { max-width: 420px; }
  .attraction-grid { grid-template-columns: 1fr; }
  .experience-flow { grid-template-columns: 1fr 1fr; }
  .field-notes { grid-template-columns: 1fr; gap: 30px; }
  .dining-intro { grid-template-columns: 1fr; }
  .map-layout, .ride-plan { grid-template-columns: 1fr; }
  .live-map-toolbar { grid-template-columns: 1fr; }
  .visitor-map-head { grid-template-columns: 1fr; gap: 18px; }
  .visitor-map-actions { grid-template-columns: auto 1fr; }
  .visitor-map-actions p { grid-column: 1 / -1; justify-self: start; text-align: left; }
  .map-place-buttons { justify-content: flex-start; }
  .map-key { display: grid; grid-template-columns: 1fr 1fr; }
  .map-key > div:nth-child(odd) { padding-right: 14px; }
  .mobility-grid { grid-template-columns: 1fr 1fr; }
  .transfer-option-grid { grid-template-columns: 1fr; }
  .budget-scenarios { grid-template-columns: 1fr; }
  .budget-scenarios article { min-height: 220px; }
  .cheaper-playbook-head { grid-template-columns: 1fr; gap: 12px; }
  .savings-grid { grid-template-columns: 1fr; }
  .savings-grid article { padding: 22px 0; }
  .savings-grid article + article { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
  .transfer-option { min-height: 280px; }
  .dinner-map, .extras-grid { grid-template-columns: 1fr 1fr; }
  .dinner-map > div:nth-child(3), .extras-grid article:nth-child(n+3) { border-top: 1px solid var(--line); }
  .dinner-map > div:nth-child(3), .extras-grid article:nth-child(3) { border-left: 0; }
}

@media (max-width: 760px) {
  .section-nav { gap: 18px; padding-inline: 20px; scroll-snap-type: inline proximity; }
  .section-nav a { min-height: 46px; scroll-snap-align: start; }
  .section-heading { margin-bottom: 44px; }
  .section-heading h2, .next-section h2, .booking-checklist h2 { font-size: clamp(44px, 13vw, 62px); }
  .card-content h3 { font-size: 32px; }
  .map-place-buttons { scrollbar-width: none; scroll-snap-type: inline proximity; }
  .map-place-buttons button { min-height: 44px; scroll-snap-align: start; }
}

@media (max-width: 620px) {
  .site-header { height: 64px; }
  .brand > span:last-child { display: none; }
  .trip-chip { gap: 5px; min-width: 0; }
  .trip-chip span:not(:nth-child(2)) { display: none; }
  .trip-chip span { padding: 7px 8px; font-size: 10px; }
  .hero { padding-top: 78px; min-height: 660px; }
  .hero-visual { width: 112vw; right: -67%; top: 4%; opacity: .58; }
  .readiness { grid-template-columns: 1fr; gap: 20px; padding-block: 30px; }
  .readiness-meter { grid-column: auto; grid-row: auto; }
  .readiness-next { padding: 18px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.28); }
  .readiness-next a { min-height: 44px; display: inline-flex; align-items: center; }
  .visual-story-image { min-height: 420px; }
  .visual-story-copy { padding: 58px 20px 66px; }
  .visual-story-copy h2 { font-size: 52px; }
  .trip-rhythm { grid-template-columns: 1fr; }
  .trip-rhythm div { padding: 15px 0; }
  .trip-rhythm div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
  h1 { font-size: 62px; }
  .hero-actions { align-items: stretch; flex-direction: column; max-width: 260px; }
  .route-line { margin-top: 65px; gap: 9px; max-width: 100%; }
  .route-line strong { font-size: 18px; }
  .section { padding: 72px 20px; }
  .points-grid, .steps, .transport-grid, .timing-band, .calendar { grid-template-columns: 1fr; }
  .points-card { min-height: 275px; padding: 26px; }
  .points-card > strong { font-size: 66px; }
  .recommendation { grid-template-columns: 1fr; padding: 26px; }
  .step:nth-child(2), .transport-grid article:nth-child(even), .timing-band div + div { border-left: 0; }
  .step + .step, .transport-grid article + article, .timing-band div + div { border-top: 1px solid var(--line); }
  .decision-note { flex-direction: column; }
  .day:first-child { grid-column: auto; }
  .calendar.timeline .day { grid-template-columns: 1fr; }
  .calendar.timeline .day-body { border-left: 0; border-top: 1px solid rgba(127,127,127,.3); padding: 18px 0 0; margin-top: 18px; }
  .calendar-note { align-items: flex-start; flex-direction: column; gap: 6px; }
  .timed-list li { grid-template-columns: 1fr; gap: 2px; }
  .stay-feature { padding: 28px; }
  .packing-heading h2 { font-size: 53px; }
  .packing-progress { grid-template-columns: 1fr; gap: 14px; margin-top: 38px; }
  .packing-grid { grid-template-columns: 1fr; }
  .packing-group.featured { grid-column: auto; }
  .packing-note { flex-direction: column; gap: 8px; }
  footer { flex-direction: column; }
  .page-switch a { min-height: 40px; padding: 7px 10px; }
  .attractions-hero { min-height: 720px; padding-top: 80px; }
  .attractions-hero h1 { font-size: 58px; }
  .attractions-hero > div > p { font-size: 16px; }
  .attraction-card { grid-template-columns: 1fr; }
  .card-art { min-height: 220px; }
  .card-art img { position: absolute; inset: 0; }
  .card-content dl { grid-template-columns: 1fr; }
  .card-actions { align-items: flex-start; flex-direction: column; }
  .experience-calendar > article { grid-template-columns: 1fr; gap: 20px; }
  .experience-flow { grid-template-columns: 1fr; }
  .alternative-grid { grid-template-columns: 1fr; }
  .alternative-grid article + article { border-left: 0; border-top: 1px solid var(--line); }
  .restaurant-grid, .dinner-map, .extras-grid { grid-template-columns: 1fr; }
  .map-intro, .mobility-grid, .transport-note { grid-template-columns: 1fr; }
  .groome-cta, .airport-booking-head, .transfer-advice { grid-template-columns: 1fr; }
  .groome-cta > div:last-child { align-items: flex-start; }
  .airport-booking { padding: 24px; }
  .airport-booking-head h3 { font-size: 34px; }
  .transfer-advice > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .live-map-toolbar { padding: 20px; }
  .visitor-map-feature { margin-inline: -4px; padding: 20px; border-radius: 20px; }
  .visitor-map-art { border-radius: 14px; overflow-x: auto; }
  .visitor-map-art a { width: 820px; max-width: none; }
  .visitor-map-art figcaption { position: sticky; left: 0; width: calc(100vw - 72px); flex-direction: column; gap: 4px; }
  .visitor-map-actions { grid-template-columns: 1fr; align-items: stretch; }
  .visitor-map-actions .button { width: 100%; }
  .visitor-map-actions > a:not(.button) { min-height: 44px; display: inline-flex; align-items: center; }
  .map-place-buttons { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding-bottom: 5px; }
  .map-place-buttons button { flex: 0 0 auto; }
  .google-map-frame { height: min(128vw, 510px); min-height: 430px; }
  .live-map-footer, .orientation-label { align-items: flex-start; flex-direction: column; gap: 10px; }
  .map-layout { border-radius: 18px; }
  .sedona-map { padding: 10px; }
  .map-key { grid-template-columns: 1fr; padding: 12px 20px; }
  .map-key > div:nth-child(odd) { padding-right: 0; }
  .map-key > div { grid-template-columns: 32px 1fr; }
  .map-key a { grid-column: 2; }
  .mobility-heading { display: block; }
  .mobility-heading h3 { margin-top: 14px; }
  .mobility-grid article { min-height: 300px; }
  .ride-plan { padding: 25px; gap: 25px; }
  .ride-row { grid-template-columns: 1fr; gap: 5px; padding: 15px 0; }
  .ride-row b { text-align: left; }
  .restaurant-card { grid-template-columns: 38px 1fr; padding: 22px; }
  .dinner-map > div + div, .extras-grid article + article { border-left: 0; border-top: 1px solid var(--line); }
  .weather-backup { grid-template-columns: 1fr; }
  .card-actions a, .restaurant-card a, .extras-grid a, .alternative-grid a, .map-key a { min-height: 44px; display: inline-flex; align-items: center; }
  .booking-links { align-items: stretch; flex-direction: column; }
  .booking-links a { min-height: 44px; display: inline-flex; align-items: center; }
  .booking-links .button { width: 100%; }
  .live-map-footer a { min-height: 44px; display: inline-flex; align-items: center; }
  .transport-note { gap: 10px; }
  .budget-breakdown-head, .budget-total, .budget-note { align-items: flex-start; flex-direction: column; }
  .budget-note { display: flex; gap: 8px; }
  .budget-row { grid-template-columns: 1fr; gap: 10px; padding: 18px 22px; }
  .budget-row > b { font-size: 25px; }
  .budget-total > strong { white-space: normal; }
}

@media (max-width: 380px) {
  .site-header { padding-inline: 16px; }
  .page-switch a { padding-inline: 8px; font-size: 11px; }
  .hero, .attractions-hero { padding-inline: 20px; }
  h1 { font-size: 56px; }
  .attractions-hero h1 { font-size: 52px; }
  .points-card > strong { font-size: 60px; }
  .restaurant-card { grid-template-columns: 1fr; }
  .restaurant-rank { margin-bottom: 4px; }
  .groome-cta, .airport-booking, .ride-plan { padding: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-visual img,.visual-story-image img,.reveal { transition: none; }
  .reveal { opacity: 1; transform: none; }
}