:root { --ink: #18234a; --muted: #65708b; --paper: #fffdf8; --cream: #f7f2ea; --navy: #10265b; --blue: #2779b8; --sky: #82c9e8; --coral: #e75b67; --gold: #f1bd4b; --lavender: #e9e5f8; --line: #dedcea }
* { box-sizing: border-box }

.skip-link { position: absolute; top: 0; left: 1rem; z-index: 9999; padding: 0.75rem 1rem; background: #fff; color: #000; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.footer-disclaimer { font-size: 0.75rem; font-style: italic; }
html { background: var(--cream); scroll-behavior: smooth }
body { margin: 0; color: var(--ink); background: radial-gradient(circle at 8% 0%, rgba(241, 189, 75, .2), transparent 24rem), radial-gradient(circle at 94% 35%, rgba(130, 201, 232, .18), transparent 28rem), var(--cream); font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif }
button, input, select { font: inherit }
.hero { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 12% 24%, rgba(255, 255, 255, .95) 0 1.5px, transparent 2px), radial-gradient(circle at 79% 18%, rgba(241, 189, 75, .9) 0 2px, transparent 2.5px), radial-gradient(circle at 91% 68%, rgba(255, 255, 255, .75) 0 1px, transparent 1.5px), linear-gradient(135deg, #101f53 0%, #194984 58%, #2779b8 100%); background-size: 145px 145px, 190px 190px, 110px 110px, auto; border-bottom: 7px solid var(--gold) }
.hero:after { content: ""; position: absolute; left: -2%; right: -2%; bottom: -22px; height: 34px; background: var(--cream); border-radius: 50% 50% 0 0/100% 100% 0 0 }
.hero-inner, .controls, .results, .restaurant-page, footer { width: min(1180px, calc(100% - 40px)); margin-inline: auto }
.hero-inner { padding: 56px 0 48px; display: flex; align-items: end; justify-content: space-between; gap: 48px }
/* =========================================================
   Site Header
   ========================================================= */
.site-header { position: relative; z-index: 100; background: #112257; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16); }
.site-header__inner { width: min(1180px, calc(100% - 40px)); min-height: 86px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 32px; }

/* Logo */
.site-logo { display: inline-flex; align-items: center; gap: 7px; color: #ffffff; text-decoration: none; line-height: 1; white-space: nowrap; }
.site-logo:hover, .site-logo:focus-visible { color: #ffffff; }
.site-logo__ddp { display: inline-block; font-size: clamp(2rem, 4vw, 3rem); font-weight: 900; letter-spacing: -0.08em; text-transform: uppercase; text-shadow: 2px 2px 0 #00395f, 3px 3px 0 rgba(0, 0, 0, 0.15); }
.site-logo__guide { position: relative; top: 2px; display: inline-block; padding: 7px 10px 6px; color: #ffffff; background: #f58428; border: 2px solid #ffffff; border-radius: 8px; font-size: clamp(0.85rem, 1.8vw, 1.15rem); font-weight: 800; letter-spacing: 0.02em; box-shadow: 3px 3px 0 #00395f; transform: rotate(-2deg); }

/* Desktop navigation */
.primary-nav { display: flex; align-items: center; gap: 8px; }
.primary-nav a { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 10px 15px; color: #ffffff; border-radius: 8px; font-size: 0.95rem; font-weight: 700; text-decoration: none; transition: background-color 160ms ease, color 160ms ease, transform 160ms ease; }
.primary-nav a:hover, .primary-nav a:focus-visible { color: #00558c; background: #ffffff; transform: translateY(-1px); }
.primary-nav a[aria-current="page"] { color: #ffffff; background: rgba(0, 0, 0, 0.18); box-shadow: inset 0 -3px 0 #f58428; }

/* Mobile toggle */
.nav-toggle { display: none; width: 48px; height: 44px; padding: 10px; border: 2px solid rgba(255, 255, 255, 0.75); border-radius: 8px; background: transparent; cursor: pointer; }
.nav-toggle span { display: block; width: 100%; height: 3px; margin: 4px 0; background: #ffffff; border-radius: 999px; transition: transform 180ms ease, opacity 180ms ease; }

.hero-content { max-width: 100%; flex: 1; }
.hero-content__no-stat { max-width: 95%; }
.hero .kicker { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 18px; padding: 7px 12px; color: #ffffff; background: rgba(0, 0, 0, 0.18); border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.hero h1 { max-width: 100%; margin: 0; color: #ffffff; font-size: clamp(2.35rem, 5.5vw, 5rem); font-weight: 900; line-height: 0.98; letter-spacing: -0.045em; text-wrap: balance; text-shadow: 3px 4px 0 rgba(0, 45, 76, 0.5); }
.hero .intro { max-width: 100%; margin: 25px 0 0; color: rgba(255, 255, 255, 0.92); font-size: clamp(1rem, 1.6vw, 1.25rem); line-height: 1.65; }


/* =========================================================
   Responsive header
   ========================================================= */
@media (max-width:760px) {
    .site-header__inner { width: min(100% - 28px, 1180px); min-height: 72px; }
    .site-logo__ddp { font-size: 2.15rem; }
    .site-logo__guide { padding: 6px 8px 5px; font-size: 0.8rem; }
    .nav-toggle { display: block; }
    .primary-nav { position: absolute; top: 100%; left: 0; width: 100%; padding: 12px 14px 18px; display: none; flex-direction: column; align-items: stretch; gap: 5px; background: #00558c; border-bottom: 4px solid #f58428; box-shadow: 0 10px 15px rgba(0, 0, 0, 0.2); }
    .primary-nav.is-open { display: flex; }
    .primary-nav a { width: 100%; padding: 13px 15px; }
    .hero-inner { width: min(100% - 30px, 1180px); padding: 48px 0 58px; grid-template-columns: 1fr; gap: 34px; }
    .hero h1 { font-size: clamp(2.25rem, 11vw, 3.6rem); line-height: 1; }
    .hero h1 br { display: none; }
    /*.stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }*/
    /*.stat, .stats > div { padding: 17px; }*/
    /*#signatureStat { grid-column: 1 / -1; }*/
}
@media (max-width:480px) {
    .stats { grid-template-columns: 1fr; }
    #signatureStat { grid-column: auto; }
}

/* Desktop navigation */
.primary-nav{display:flex;align-items:center;gap:10px;}
.primary-nav a{padding: 9px 13px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    color: #eef7ff;
    background: rgba(255, 255, 255, .07);
    text-decoration: none;
    font-size: .82rem;
    font-weight: 800;}
.primary-nav a:hover,
.primary-nav a:focus-visible{color:#00558c;background:#ffffff;border-color:#ffffff;box-shadow:0 4px 0 rgba(0,45,76,0.35);transform:translateY(-1px);}
.primary-nav a:active{box-shadow:0 1px 0 rgba(0,45,76,0.35);transform:translateY(2px);}
.primary-nav a[aria-current="page"]{color:#00558c;background:#ffffff;border-color:#ffffff;}
/* Featured navigation CTA */
.primary-nav .primary-nav__featured{color:var(--navy);background:var(--gold);border-color:var(--gold);box-shadow:0;}
.primary-nav .primary-nav__featured:hover,
.primary-nav .primary-nav__featured:focus-visible{color:#4b2105;background:var(--gold);border-color:#ffffff;box-shadow:0;}
@media (max-width: 760px) {
.primary-nav { position: absolute; top: 100%; left: 0; width: 100%; padding: 18px 14px 22px; display: none; flex-direction: column; align-items: stretch; gap: 10px; background: #00558c; border-bottom: 4px solid #f58428; box-shadow: 0 10px 15px rgba(0, 0, 0, 0.2); }
.primary-nav.is-open { display: flex; }
.primary-nav a { width: 100%; min-height: 48px; padding: 13px 18px; background: rgba(255, 255, 255, 0.1); border-radius: 999px; }
.primary-nav .primary-nav__featured { margin-top: 3px; }
}

.kicker, .eyebrow { margin: 0 0 12px; text-transform: uppercase; letter-spacing: .14em; font-size: .74rem; font-weight: 800 }
.kicker { color: #ffdf8a }
h1, h2, h3, p { margin-top: 0 }
h1 { max-width: 850px; margin-bottom: 18px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.5rem, 5.4vw, 5rem); line-height: .96; letter-spacing: -.035em; text-shadow: 0 4px 18px rgba(4, 16, 50, .35) }
h1:before { content: "✦"; display: block; margin-bottom: 12px; color: var(--gold); font-size: 1.5rem; line-height: 1 }
.intro { max-width: 710px; margin: 0; color: #e8f5ff; font-size: clamp(1rem, 1.8vw, 1.22rem); line-height: 1.55 }
.stats { min-width: 190px; padding: 24px; border: 1px solid rgba(255, 255, 255, .38); border-radius: 24px; background: rgba(255, 255, 255, .12); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 16px 36px rgba(5, 18, 52, .22); backdrop-filter: blur(8px) }
.stats b { display: block; color: #ffe18e; font-family: Georgia, serif; font-size: 2.2rem; line-height: 1 }
.stats small { display: block; margin: 5px 0 15px; color: #e5f3fb }
.stats small:last-child { margin-bottom: 0 }
.controls { padding: 32px 0 26px }
.label { display: block; margin-bottom: 8px; color: var(--navy); font-size: .8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase }
.search { min-height: 60px; display: flex; align-items: center; gap: 12px; padding: 0 16px 0 20px; border: 2px solid #fff; border-radius: 18px; background: #fff; box-shadow: 0 9px 28px rgba(20, 38, 91, .12) }
.search:focus-within { border-color: var(--sky); box-shadow: 0 0 0 4px rgba(130, 201, 232, .25), 0 9px 28px rgba(20, 38, 91, .12) }
.search .icon { color: var(--coral); font-size: 2rem }
.search input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 1.05rem }
.search button { padding: 8px 14px; border: 0; border-radius: 999px; color: #fff; background: var(--coral); cursor: pointer }
.status { margin: 9px 0 0; color: var(--muted); font-size: .88rem }
.service-tabs, .tabs { display: flex; gap: 8px; padding-bottom: 5px; overflow-x: auto }
.service-tabs { margin: 25px 0 8px }
.tabs { margin: 8px 0 20px }
.service-tabs button, .tabs button { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 11px 15px; border: 1px solid #cbc8df; border-radius: 999px; color: var(--navy); background: rgba(255, 255, 255, .58); font-weight: 700; cursor: pointer; transition: transform .15s ease, background .15s ease }
.service-tabs button:hover, .tabs button:hover { transform: translateY(-1px); background: #fff }
.service-tabs button { border-width: 2px; font-size: 1rem }
.service-tabs button i, .tabs button i { min-width: 25px; padding: 2px 6px; border-radius: 20px; color: var(--muted); background: var(--lavender); font-size: .72rem; font-style: normal }
.service-tabs button.active, .tabs button.active { color: #fff; border-color: var(--navy); background: linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 5px 14px rgba(16, 38, 91, .2) }
.service-tabs button.active i, .tabs button.active i { color: var(--navy); background: var(--gold) }
.picker { display: grid; grid-template-columns: 2fr 1fr; gap: 16px }
.picker select { width: 100%; min-height: 54px; padding: 0 42px 0 16px; border: 1px solid #c8c5db; border-radius: 14px; color: var(--ink); background: var(--paper); box-shadow: 0 4px 13px rgba(24, 35, 74, .06) }
.results { min-height: 400px; padding-bottom: 58px }
.controls + .results { min-height:0; padding-bottom:0; }
.card { position: relative; overflow: hidden; margin-bottom: 28px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 14px 42px rgba(24, 35, 74, .1) }
.card:before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 7px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky), var(--blue)) }
.card-head { display: flex; align-items: start; justify-content: space-between; gap: 24px; padding: 36px 34px 20px }
.eyebrow { color: var(--coral) }
.card h2 { margin-bottom: 7px; font-family: Georgia, serif; font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1 }
.location { margin: 0; color: var(--muted); line-height: 1.45 }
.source { flex: 0 0 auto; padding: 10px 14px; border: 1px solid #cac7dd; border-radius: 999px; color: var(--navy); background: #fff; text-decoration: none; font-size: .86rem; font-weight: 800 }
.source:hover { border-color: var(--gold); background: #fff8e5 }
.tags { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 34px 24px; border-bottom: 1px solid var(--line) }
.tags span { padding: 6px 10px; border-radius: 999px; color: #31506a; background: #eaf3f8; font-size: .74rem; font-weight: 700 }
.tags .signature { color: #6b3e00; background: #ffe4a5; border: 1px solid var(--gold) }
.notice { margin: 22px 34px 0; padding: 16px 18px; border: 1px solid #efd08c; border-left: 6px solid var(--gold); border-radius: 14px; color: #4b3820; background: #fff4d9; line-height: 1.5 }
.notice strong { color: #6b3e00 }
.unavailable { margin: 26px 34px 34px; padding: 26px; border: 1px dashed #bdc8ce; border-radius: 14px; color: var(--muted); background: #f8faf9 }
.period { padding: 27px 34px 35px }
.period h3 { margin-bottom: 15px; color: var(--navy); font-family: Georgia, serif; font-size: 1.45rem }
.period h3:before { content: "✧"; margin-right: 8px; color: var(--gold) }
.groups { border-top: 1px solid var(--line) }
details { border-bottom: 1px solid var(--line) }
summary { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 4px; cursor: pointer; font-weight: 800 }
.count { flex: 0 0 auto; color: var(--muted); font-size: .76rem; font-weight: 600 }
.items { padding: 0 4px 14px 22px }
.item { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px dotted #d6d3e5; line-height: 1.4 }
.item:last-child { border-bottom: 0 }
.item strong { color: var(--blue); white-space: nowrap }
.plan-icon { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid currentColor; border-radius: 50%; font-size: .66rem; font-weight: 900; letter-spacing: -.03em }
.plan-icon.qs { color: #166ba8; background: #e6f5ff }
.plan-icon.ts { color: #35316f; background: #eeebff }
.plan-icon.twots { color: #7a4d00; background: #ffe7a9 }
.plan-icon.snack { color: #9a334a; background: #ffe7ed; border-style: dashed }
.plan-icon.none { visibility: hidden }
.empty { padding: 70px 30px; text-align: center; border: 1px solid var(--line); border-radius: 24px; background: var(--paper) }
.empty h2 { margin: 10px 0; font-family: Georgia, serif; font-size: 2rem }
.legend { width: min(1180px, calc(100% - 40px)); margin: 0 auto 46px; padding: 26px 30px; border: 1px solid #d5d1e5; border-radius: 22px; background: #fff; box-shadow: 0 10px 30px rgba(24, 35, 74, .07) }
.legend h2 { margin: 0 0 6px; font-family: Georgia, serif; color: var(--navy) }
.legend>p { margin-bottom: 20px; color: var(--muted); line-height: 1.5 }
.legend-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 28px }
.legend-item { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start }
.legend-item p { margin: 1px 0 0; color: var(--muted); font-size: .88rem; line-height: 1.45 }
.legend-item strong { color: var(--ink) }
.legend-note { margin: 22px 0 0 !important; padding-top: 18px; border-top: 1px solid var(--line); font-size: .82rem !important }
footer { padding: 26px 0 42px; border-top: 1px solid #cfd6d8; color: var(--muted); font-size: .84rem; line-height: 1.5 }
footer p { max-width: 100% }
@media(max-width:720px) {
	.hero-inner { width: min(100% - 28px, 1180px); padding: 42px 0 36px; display: block }
	.stats { margin-top: 28px }
	.controls, .results, footer, .legend { width: min(100% - 24px, 1180px) }
	.picker { grid-template-columns: 1fr }
	.card-head { display: block; padding: 24px 20px 16px }
	.source { display: inline-block; margin-top: 18px }
	.tags { padding: 0 20px 20px }
	.period { padding: 24px 20px 28px }
	.item { gap: 9px; font-size: .92rem }
	.legend-grid { grid-template-columns: 1fr }
}
@media print {
	.hero, .controls, footer, .source { display: none }
	.results { width: 100% }
	.card { box-shadow: none }
}



/* =========================================================
   Homepage layout
   ========================================================= */
html { scroll-behavior: smooth; }
.home-search-section, .home-content-section { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.home-search-section { padding: clamp(42px, 7vw, 76px) 0 30px; }
.home-content-section { padding: clamp(58px, 8vw, 92px) 0; }
.home-section-heading { max-width: 100%; margin-bottom: 0px; }
.home-section-heading h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.15rem, 5vw, 3.85rem); line-height: 1; letter-spacing: -0.04em; }
.home-section-heading > p:last-child:not(.eyebrow) { margin: 16px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.68; }
.home-section-heading a { color: var(--blue); font-weight: 800; }

/* =========================================================
   Homepage hero
   ========================================================= */
.home-hero .hero-content { max-width: 100%; }
.home-hero__actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 27px; }
.home-hero__actions a { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 18px; border: 2px solid var(--gold); border-radius: 999px; color: var(--navy); background: var(--gold); font-size: 0.88rem; font-weight: 850; text-decoration: none; transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease; }
.home-hero__actions .home-hero__secondary { color: #fff; background: transparent; border-color: rgba(255, 255, 255, 0.75); }
.home-hero__actions a:hover, .home-hero__actions a:focus-visible { color: var(--navy); background: #fff; border-color: #fff; transform: translateY(-1px); }

/* =========================================================
   Search area
   ========================================================= */
.home-search-section .controls { margin-bottom: 0; }
.home-search-section .results { scroll-margin-top: 30px; }

/* =========================================================
   Full-width image features
   ========================================================= */
.home-image-feature { position: relative; min-height: clamp(390px, 46vw, 560px); margin-top: 1rem !important; margin-bottom: 1rem !important; display: flex; align-items: stretch; margin: clamp(52px, 8vw, 96px) 0; color: #fff; background-position: center; background-repeat: no-repeat; background-size: cover; isolation: isolate; }
.home-image-feature::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(9, 25, 65, 0.04), rgba(9, 25, 65, 0.18)); }
.home-image-feature--basics { background-image: url("/images/home/dining-plan-basics.webp"); }
.home-image-feature--guides { background-image: url("/images/home/planning-guides.webp"); }
.home-image-feature--about { background-image: url("/images/home/about-ddp-guide.webp"); }
.home-image-feature__overlay { width: 100%; display: flex; align-items: center; background: linear-gradient(90deg, rgba(16, 38, 91, 0.99) 0%, rgba(16, 38, 91, 0.93) 34%, rgba(16, 38, 91, 0.62) 61%, rgba(16, 38, 91, 0.18) 100%); }
.home-image-feature--right .home-image-feature__overlay { background: linear-gradient(270deg, rgba(16, 38, 91, 0.99) 0%, rgba(16, 38, 91, 0.93) 34%, rgba(16, 38, 91, 0.58) 61%, rgba(16, 38, 91, 0.16) 100%); }
.home-image-feature__inner { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding: clamp(56px, 8vw, 96px) 0; }
.home-image-feature__content { max-width: 100%; }
.home-image-feature--right .home-image-feature__content { margin-left: auto; }
.home-image-feature .eyebrow { color: var(--gold); }
.home-image-feature h2 { max-width: 100%; margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.75rem, 6vw, 5.2rem); line-height: 0.96; letter-spacing: -0.05em; }
.home-image-feature p:not(.eyebrow) { max-width: 70%; margin: 21px 0 0; color: #e9f5ff; font-size: clamp(1rem, 2vw, 1.2rem); line-height: 1.7; }
.home-image-feature a { min-height: 49px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 27px; padding: 11px 20px; border: 2px solid var(--gold); border-radius: 999px; color: var(--navy); background: var(--gold); font-weight: 850; text-decoration: none; box-shadow: 0 7px 20px rgba(5, 17, 50, 0.2); transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease; }
.home-image-feature a:hover, .home-image-feature a:focus-visible { color: var(--navy); background: #fff; border-color: #fff; transform: translateY(-2px); }
.home-image-feature a:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }

/* =========================================================
   Destination cards
   ========================================================= */
.home-destinations__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.home-destination-card { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 13px; align-items: center; min-width: 0; padding: 19px; border: 1px solid var(--line); border-radius: 18px; color: inherit; background: var(--paper); box-shadow: 0 10px 27px rgba(24, 35, 74, 0.07); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.home-destination-card:hover, .home-destination-card:focus-visible { border-color: var(--sky); box-shadow: 0 15px 32px rgba(24, 35, 74, 0.13); transform: translateY(-2px); }
.home-destination-card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.home-destination-card__icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: var(--lavender); font-size: 1.25rem; }
.home-destination-card__content { min-width: 0; }
.home-destination-card__content strong, .home-destination-card__content > span { display: block; }
.home-destination-card__content strong { color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.08rem; line-height: 1.15; }
.home-destination-card__content > span { margin-top: 4px; color: var(--muted); font-size: 0.75rem; line-height: 1.4; }
.home-destination-card__arrow { color: var(--blue); font-size: 1.25rem; font-weight: 900; }
.home-destination-card--all { color: #fff; border-color: var(--navy); background: linear-gradient(135deg, var(--navy), #285d9d); }
.home-destination-card--all .home-destination-card__icon { background: var(--gold); }
.home-destination-card--all
.home-destination-card__content strong { color: #fff; }
.home-destination-card--all
.home-destination-card__content > span { color: #e9f5ff; }
.home-destination-card--all
.home-destination-card__arrow { color: var(--gold); }

/* =========================================================
   Data statistics section
   ========================================================= */
.home-data-section { padding: clamp(56px, 8vw, 88px) 0; color: #fff; background: radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.15), transparent 260px), linear-gradient(135deg, var(--navy), #285d9d); }
.home-data-section__inner { width: min(1180px, calc(100% - 40px)); display: grid; grid-template-columns: minmax(0, 0.9fr)
minmax(0, 1.1fr); gap: clamp(34px, 6vw, 74px); align-items: center; margin-inline: auto; }
.home-data-section__heading h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.2rem, 5vw, 3.8rem); line-height: 1; letter-spacing: -0.04em; }
.home-data-section__heading .eyebrow { color: var(--gold); }
.home-data-section__heading p:not(.eyebrow) { margin: 17px 0 0; color: #e9f5ff; line-height: 1.68; }
.home-data-section__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.home-data-section__stats div { min-height: 145px; display: flex; justify-content: center; flex-direction: column; padding: 23px; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 18px; background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(5px); }
.home-data-section__stats strong { color: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.2rem, 5vw, 3.5rem); line-height: 1; }
.home-data-section__stats span { margin-top: 9px; color: #e9f5ff; font-size: 0.85rem; font-weight: 700; }

/* =========================================================
   Featured guides
   ========================================================= */
.home-guides__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.home-guide-card { position: relative; overflow: hidden; display: flex; min-width: 0; flex-direction: column; padding: 27px; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.08); }
.home-guide-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky)); }
.home-guide-card--featured { color: #fff; border-color: var(--navy); background: radial-gradient(circle at 95% 5%, rgba(255, 255, 255, 0.14), transparent 180px), linear-gradient(145deg, var(--navy), #285d9d); }

.home-guide-card--featured::before { background: var(--gold); }
.home-guide-card--coming { background: linear-gradient(145deg, rgba(233, 229, 248, 0.45), var(--paper)); }
.home-guide-card__meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 17px; }
.home-guide-card__meta span { padding: 6px 9px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.68rem; font-weight: 800; }
.home-guide-card--featured
.home-guide-card__meta span { background: var(--gold); }
.home-guide-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; line-height: 1.08; }
.home-guide-card--featured h3 { color: #fff; }
.home-guide-card h3 a { color: inherit; text-decoration: none; }
.home-guide-card h3 a:hover, .home-guide-card h3 a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.home-guide-card p { margin: 14px 0 0; color: var(--muted); line-height: 1.64; }
.home-guide-card--featured p { color: #e9f5ff; }
.home-guide-card__link { display: inline-flex; align-items: center; gap: 7px; align-self: flex-start; margin-top: auto; padding-top: 22px; color: var(--gold); font-weight: 850; text-decoration: none; }
.home-guide-card__link:hover, .home-guide-card__link:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.home-section-action { margin-top: 26px; }
.home-section-action a { min-height: 46px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 1px solid var(--navy); border-radius: 999px; color: var(--navy); font-weight: 850; text-decoration: none; }
.home-section-action a:hover, .home-section-action a:focus-visible { color: #fff; background: var(--navy); }



/* =========================================================
   Benefit cards
   ========================================================= */
.home-benefits { padding-bottom: 30px; }
.home-benefits__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.home-benefit-card { padding: 25px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 11px 29px rgba(24, 35, 74, 0.07); }
.home-benefit-card > span { width: 49px; height: 49px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 15px; background: var(--lavender); font-size: 1.35rem; }
.home-benefit-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.3rem; line-height: 1.12; }
.home-benefit-card p { margin: 11px 0 0; color: var(--muted); line-height: 1.62; }

/* =========================================================
   Homepage FAQ
   ========================================================= */
.home-faq { padding-top: 60px; }
.home-faq__list { display: grid; gap: 12px; }
.home-faq details { overflow: hidden; border: 2px solid #d9e5ec; border-radius: 17px; background: var(--paper); box-shadow: 0 4px 0 rgba(39, 121, 184, 0.09); }
.home-faq summary { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 20px; color: var(--navy); cursor: pointer; font-weight: 850; line-height: 1.4; list-style: none; }
.home-faq summary::-webkit-details-marker { display: none; }
.home-faq summary::after { content: "+"; width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border: 2px solid var(--blue); border-radius: 50%; color: var(--blue); font-size: 1.35rem; line-height: 1; }
.home-faq details[open] { border-color: var(--blue); }
.home-faq details[open] summary { color: #fff; background: var(--blue); }
.home-faq details[open] summary::after { content: "−"; color: #fff; border-color: #fff; }
.home-faq details > div { padding: 20px 22px 23px; }
.home-faq details p { margin: 0; color: var(--muted); line-height: 1.7; }
.home-faq details p + p { margin-top: 13px; }
.home-faq details a { color: var(--blue); font-weight: 800; }

/* =========================================================
   Homepage legend spacing
   ========================================================= */
main > .legend { margin-top: clamp(40px, 7vw, 72px); }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1020px) {
    .home-destinations__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-benefits__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:900px) {
    .home-data-section__inner { grid-template-columns: 1fr; }
    .home-guides__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  
}
@media (max-width:700px) {
    .home-search-section, .home-content-section, .home-data-section__inner { width: min(100% - 24px, 1180px); }
    .home-search-section { padding-top: 34px; }
    .home-content-section { padding: 52px 0; }
    .home-image-feature { min-height: 500px; margin: 44px 0; background-position: center; }
    .home-image-feature__overlay, .home-image-feature--right
    .home-image-feature__overlay { align-items: flex-end; background: linear-gradient(180deg, rgba(16, 38, 91, 0.18) 0%, rgba(16, 38, 91, 0.62) 40%, rgba(16, 38, 91, 0.98) 78%, rgba(16, 38, 91, 1) 100%); }
    .home-image-feature__inner { width: min(100% - 24px, 1180px); padding: 150px 0 36px; }
    .home-image-feature__content, .home-image-feature--right
    .home-image-feature__content { max-width: none; margin-left: 0; }
    .home-image-feature h2 { font-size: clamp(2.45rem, 12vw, 3.65rem); }
    .home-destinations__grid, .home-guides__grid, .home-benefits__grid { grid-template-columns: 1fr; }
    .home-guide-card--featured { grid-column: auto; }
    .home-guides__grid { grid-template-columns: 1fr; }
    .home-data-section__stats { grid-template-columns: 1fr 1fr; }
}
@media (max-width:520px) {
    .home-hero__actions { flex-direction: column; }
    .home-hero__actions a { width: 100%; }
    .home-destination-card { grid-template-columns: 44px minmax(0, 1fr) auto; padding: 16px; }
    .home-data-section__stats { grid-template-columns: 1fr; }
    .home-data-section__stats div { min-height: 125px; }
    .home-image-feature a { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion:reduce) {
    html { scroll-behavior: auto; }
    .home-hero__actions a, .home-image-feature a, .home-destination-card { transition: none; }
}

/* =========================================================
   Collapsible restaurant-card menus
   ========================================================= */
.card-menu-toggle { overflow: hidden; margin-top: 22px; border: 2px solid #d9e5ec; border-radius: 17px; background: var(--paper); box-shadow: 0 4px 0 rgba(39, 121, 184, 0.09); }
.card-menu-toggle > summary { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 19px; color: var(--navy); background: #eef5f8; cursor: pointer; list-style: none; transition: color 160ms ease, background-color 160ms ease; }
.card-menu-toggle > summary::-webkit-details-marker { display: none; }
.card-menu-toggle > summary:hover { background: #e3f1f8; }
.card-menu-toggle > summary:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; }
.card-menu-toggle__labels { display: grid; gap: 3px; }
.card-menu-toggle__labels strong { color: inherit; font-size: 0.92rem; }
.card-menu-toggle__labels > span { color: var(--muted); font-size: 0.76rem; font-weight: 700; }
.card-menu-toggle__icon { position: relative; width: 34px; height: 34px; flex: 0 0 auto; border: 2px solid var(--blue); border-radius: 50%; }
.card-menu-toggle__icon::before, .card-menu-toggle__icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 14px; height: 2px; border-radius: 999px; background: var(--blue); transform: translate(-50%, -50%); transition: transform 160ms ease; }
.card-menu-toggle__icon::after { transform: translate(-50%, -50%)
rotate(90deg); }
.card-menu-toggle[open] { border-color: var(--blue); }
.card-menu-toggle[open] > summary { color: #fff; background: var(--blue); }
.card-menu-toggle[open]
.card-menu-toggle__labels > span { color: #e9f5ff; }
.card-menu-toggle[open]
.card-menu-toggle__icon { border-color: #fff; }
.card-menu-toggle[open]
.card-menu-toggle__icon::before, .card-menu-toggle[open]
.card-menu-toggle__icon::after { background: #fff; }
.card-menu-toggle[open]
.card-menu-toggle__icon::after { transform: translate(-50%, -50%)
rotate(0deg); }
.card-menu-toggle__content { padding: 4px 20px 22px; }

/*
 * The first meal-period heading does not need as much
 * spacing when it appears inside the accordion.
 */
.card-menu-toggle__content > .period:first-child { margin-top: 20px; }
@media (max-width:640px) {
    .card-menu-toggle > summary { min-height: 62px; padding: 14px 15px; }
    .card-menu-toggle__content { padding: 2px 14px 17px; }
}
@media (prefers-reduced-motion:reduce) {
    .card-menu-toggle > summary, .card-menu-toggle__icon::before, .card-menu-toggle__icon::after { transition: none; }
}















/* =========================================================
   Frequently Asked Questions
   ========================================================= */
.faq-section { padding: clamp(60px, 8vw, 100px) 20px; background: radial-gradient(circle at 90% 10%, rgba(19, 110, 177, 0.08), transparent 30%), #f6f6f6; }
.faq-section__inner { width: min(1180px, 100%); margin: 0 auto; }
.faq-section__heading { max-width: 100%; margin: 0 auto 38px; text-align: center; }
.faq-section__kicker { display: inline-flex; margin: 0 0 12px; padding: 7px 13px; color: #00558c; background: #ffffff; border: 2px solid #136eb1; border-radius: 999px; font-size: 0.76rem; font-weight: 900; letter-spacing: 0.08em; line-height: 1; text-transform: uppercase; }
.faq-section__heading h2 { margin: 0; color: #00558c; font-size: clamp(2.2rem, 5vw, 3.75rem); font-weight: 900; line-height: 1; letter-spacing: -0.04em; }
.faq-section__heading > p:last-child { max-width: 100%; margin: 18px auto 0; color: #4e5b64; font-size: clamp(1rem, 1.8vw, 1.15rem); line-height: 1.65; }
.faq-list { display: grid; gap: 13px; }
.faq-item { overflow: hidden; background: #ffffff; border: 2px solid #d9e5ec; border-radius: 18px; box-shadow: 0 4px 0 rgba(0, 85, 140, 0.1); transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.faq-item:hover { border-color: #9dc3db; }
.faq-item[open] { border-color: #136eb1; box-shadow: 0 5px 0 rgba(0, 85, 140, 0.15), 0 14px 28px rgba(0, 67, 111, 0.08); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 72px; padding: 18px 22px; color: #00558c; cursor: pointer; font-size: clamp(1rem, 2vw, 1.15rem); font-weight: 850; line-height: 1.35; list-style: none; transition: color 160ms ease, background-color 160ms ease; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::marker { display: none; content: ""; }
.faq-item summary:hover { background: #f3f8fb; }
.faq-item summary:focus-visible { outline: 3px solid #f58428; outline-offset: -4px; }
.faq-item[open] summary { color: #ffffff; background: #00558c; }
.faq-icon { position: relative; flex: 0 0 auto; width: 34px; height: 34px; background: #edf6fb; border: 2px solid #136eb1; border-radius: 50%; transition: background-color 160ms ease, border-color 160ms ease, transform 200ms ease; }
.faq-icon::before,
.faq-icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 14px; height: 3px; background: #00558c; border-radius: 999px; transform: translate(-50%, -50%); transition: background-color 160ms ease, transform 200ms ease; }
.faq-icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.faq-item[open] .faq-icon { background: #f58428; border-color: #ffffff; transform: rotate(180deg); }
.faq-item[open] .faq-icon::before,
.faq-item[open] .faq-icon::after { background: #ffffff; }
.faq-item[open] .faq-icon::after { transform: translate(-50%, -50%) rotate(0); }
.faq-answer { padding: 22px 24px 26px; color: #46535c; font-size: 0.98rem; line-height: 1.7; }
.faq-answer p { margin: 0; }
.faq-answer p + p,
.faq-answer p + ul,
.faq-answer ul + p,
.faq-answer p + .faq-tip { margin-top: 15px; }
.faq-answer ul { margin-bottom: 0; padding-left: 22px; }
.faq-answer li { padding-left: 4px; }
.faq-answer li + li { margin-top: 7px; }
.faq-answer strong { color: #263944; }
.faq-tip { padding: 16px 18px; color: #303c43; background: #fff7ed; border-left: 5px solid #f58428; border-radius: 0 12px 12px 0; }
@media (max-width:600px) {
    .faq-section { padding-inline: 15px; }
    .faq-section__heading { margin-bottom: 28px; text-align: left; }
    .faq-section__heading > p:last-child { margin-left: 0; }
    .faq-item { border-radius: 14px; }
    .faq-item summary { min-height: 68px; padding: 16px 17px; gap: 15px; }
    .faq-icon { width: 30px; height: 30px; }
    .faq-answer { padding: 19px 18px 22px; }
}
@media (prefers-reduced-motion:reduce) {
    .faq-item,
    .faq-item summary,
    .faq-icon,
    .faq-icon::before,
    .faq-icon::after { transition: none; }
}
main.article {
    width: min(1180px, calc(100% - 40px));
    margin: auto;
}
.hero h1 { max-width: 100%; margin: 0 0 20px; font-family: Georgia, serif; font-size: clamp(2.8rem, 6vw, 5.5rem); line-height: .94; letter-spacing: -.045em; text-shadow: 0 4px 18px rgba(4, 16, 50, .35) }
.hero h1 span { display: block; margin-top: 13px; color: #ffe18e; font-size: .43em; line-height: 1.08 }

.dek { max-width: 100%; margin: 0; color: #e8f5ff; font-size: clamp(1.02rem, 2vw, 1.24rem); line-height: 1.6 }
.article { padding: 46px 0 72px }
.lede { display: grid; grid-template-columns: 1.35fr .8fr; gap: 28px; margin-bottom: 55px }
.lede-copy,
.rule-box { padding: 30px; border-radius: 24px }
.lede-copy { border: 1px solid var(--line); background: var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, .08) }
.lede h2,
.section-title { font-family: Georgia, serif }
.lede h2 { margin: 0 0 14px; font-size: 2rem }
.lede p { margin: 0; color: #46516e; line-height: 1.75 }
.rule-box { color: #fff; background: linear-gradient(145deg, var(--navy), #285d9d); box-shadow: 0 15px 35px rgba(16, 38, 91, .2) }
.rule-box b { display: block; color: var(--gold); font-family: Georgia, serif; font-size: 1.35rem }
.rule-box p { margin: 10px 0 0; color: #e9f5ff; line-height: 1.6 }
.section { margin-top: 64px; scroll-margin-top: 20px }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 22px }
.eyebrow { color: var(--coral) }
.section-title { margin: 0; font-size: clamp(2.15rem, 5vw, 3.7rem); line-height: .98 }
.section-note { max-width: 100%; margin: 0; color: var(--muted); line-height: 1.55 }
.photo { position: relative; overflow: hidden; height: clamp(250px, 40vw, 430px); margin: 0 0 22px; border-radius: 27px; box-shadow: 0 18px 45px rgba(24, 35, 74, .16) }
.photo img { width: 100%; height: 100%; display: block; object-fit: cover }
.photo figcaption { position: absolute; right: 14px; bottom: 14px; padding: 7px 10px; border-radius: 999px; color: #fff; background: rgba(9, 27, 69, .8); font-size: .72rem }
.swaps { display: grid; gap: 18px }
.swap { overflow: hidden; display: grid; grid-template-columns: 1fr 68px 1fr; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, .08) }
.choice { padding: 25px }
.choice.bad { background: linear-gradient(145deg, var(--rose), #fff) }
.choice.good { background: linear-gradient(145deg, #ecfaf5, #fff) }
.choice-label { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .1em; font-size: .72rem; font-weight: 900 }
.bad .choice-label { color: #b33d4c }
.good .choice-label { color: var(--green) }
.choice h3 { margin: 0 0 7px; font-family: Georgia, serif; font-size: 1.5rem; line-height: 1.08 }
.price { margin: 0 0 12px; font-family: Georgia, serif; font-size: 1.55rem; font-weight: 900 }
.bad .price { color: #b33d4c }
.good .price { color: var(--green) }
.choice p:last-of-type { margin: 0; color: #4b5670; line-height: 1.6 }
.arrow { display: grid; place-items: center; color: var(--navy); background: #fff7df; font-size: 1.75rem; font-weight: 900 }
.gain { display: inline-block; margin-top: 13px; padding: 6px 9px; border-radius: 999px; color: #fff; background: var(--green); font-size: .75rem; font-weight: 900 }
.strategy { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; margin-top: 28px }
.strategy-card { padding: 24px; border: 1px solid var(--line); border-radius: 21px; background: #fff }
.strategy-card span { display: block; margin-bottom: 12px; font-size: 1.65rem }
.strategy-card h3 { margin: 0 0 8px; font-family: Georgia, serif }
.strategy-card p { margin: 0; color: var(--muted); line-height: 1.6 }
.quick-check { margin-top: 60px; padding: 31px; border-radius: 26px; color: #fff; background: linear-gradient(135deg, #11275d, #235f96) }
.quick-check h2 { margin: 0 0 18px; font-family: Georgia, serif; font-size: 2rem }
.quick-check ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px 28px; margin: 0; padding: 0; list-style: none }
.quick-check li { position: relative; padding-left: 27px; color: #eaf6ff; line-height: 1.5 }
.quick-check li:before { content: ""; position: absolute; left: 0; color: var(--gold); font-weight: 900 }
.fine-print { margin-top: 30px; padding: 27px; border: 1px solid #d6d1e2; border-radius: 22px; background: #fff }
.fine-print h2 { margin: 0 0 10px; font-family: Georgia, serif }
.fine-print p { margin: 0; color: var(--muted); font-size: .87rem; line-height: 1.65 }
.fine-print p+p { margin-top: 9px }
.fine-print a { color: var(--blue); font-weight: 800 }
footer { padding: 30px 0 45px; color: var(--muted); text-align: center; font-size: .82rem }
footer b { color: var(--navy) }
@media(max-width:850px) {
    .site-nav-inner { align-items: flex-start; flex-direction: column; gap: 0; padding-top: 15px }
    .nav-links { width: 100% }
    .lede { grid-template-columns: 1fr }
    .swap { grid-template-columns: 1fr }
    .arrow { min-height: 52px; transform: none }
    .strategy { grid-template-columns: 1fr }
    .section-head { align-items: start; flex-direction: column }
    .section-note { max-width: none }
    .quick-check ul { grid-template-columns: 1fr }
    .photo { height: 300px }
}
@media(max-width:520px) {
    .hero-inner,
    .article,
    footer,
    .site-nav-inner { width: min(100% - 26px, 1100px) }
    .hero-inner { padding: 45px 0 }
    .article { padding-top: 26px }
    .lede-copy,
    .rule-box,
    .choice,
    .quick-check,
    .fine-print { padding: 22px }
}


/*Category Component*/

.category .cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px }
.category .card { position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: 100%; padding: 26px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 13px 34px rgba(24, 35, 74, .08) }
.category .card:before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky)) }
.rank { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, serif; font-size: 1.25rem; font-weight: 900 }
.category .card h3 { margin: 0 0 6px; font-family: Georgia, serif; font-size: 1.5rem; line-height: 1.08 }

.category-image { position: relative; overflow: hidden; height: clamp(260px, 42vw, 470px); margin-bottom: 22px; border-radius: 28px; box-shadow: 0 18px 45px rgba(24, 35, 74, .17) }
.category-image img { width: 100%; height: 100%; display: block; object-fit: cover }
.category-image figcaption { position: absolute; right: 14px; bottom: 14px; padding: 7px 10px; border-radius: 999px; color: #fff; background: rgba(9, 27, 69, .78); font-size: .72rem; backdrop-filter: blur(7px) }



/* =========================================================
   Restaurant detail pages
   ========================================================= */
.restaurant-page { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding-block: clamp(1rem, 4vw, 1rem); }

/* Breadcrumbs */
.breadcrumbs { margin: 0 0 1.5rem; font-size: 0.875rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem; margin: 0; padding: 0; list-style: none; }
.breadcrumbs li { display: inline-flex; align-items: center; color: var(--mediumGray, #7d7d7e); }
.breadcrumbs li:not(:last-child)::after { content: "/"; margin-left: 0.45rem; color: var(--lightGray, #dddddd); }
.breadcrumbs a { color: var(--darkBlue, #0075bf); font-weight: 700; text-decoration: none; }
.breadcrumbs a:hover, .breadcrumbs a:focus-visible { text-decoration: underline; }
.breadcrumbs [aria-current="page"] { color: var(--ink, #243447); font-weight: 700; }

/* Main page columns */
.restaurant-page__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 320px); gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }
.restaurant-page__layout .main-content { min-width: 0; width: 100%; }
.restaurant-page__layout .sidebar { min-width: 0; display: grid; gap: 1.25rem; }

/* Main content cards */
.restaurant-overview, .restaurant-menu, .restaurant-disclaimer { margin: 0 0 1.5rem; padding: clamp(1.25rem, 3vw, 2rem); background: #fff; border: 1px solid rgba(56, 88, 136, 0.15); border-radius: 18px; box-shadow: 0 12px 30px rgba(32, 54, 86, 0.08); }
.restaurant-overview > h2, .restaurant-menu > h2, .restaurant-disclaimer > h2 { margin-top: 0; color: var(--navy, #385888); }
.restaurant-overview > h2 { margin-bottom: 1.25rem; }

/* Restaurant facts */
.restaurant-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; }
.restaurant-facts > div { padding: 1rem; background: rgba(168, 212, 237, 0.18); border-radius: 12px; }
.restaurant-facts dt { margin-bottom: 0.25rem; color: var(--navy, #385888); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.restaurant-facts dd { margin: 0; color: var(--ink, #243447); font-weight: 700; }

/* Official link */
.restaurant-official-link { margin: 1.25rem 0 0; }
.restaurant-official-link a { display: inline-flex; align-items: center; min-height: 44px; padding: 0.7rem 1rem; color: #fff; background: var(--darkBlue, #0075bf); border-radius: 999px; font-weight: 800; text-decoration: none; }
.restaurant-official-link a:hover, .restaurant-official-link a:focus-visible { text-decoration: underline; }

/* Menu periods and groups */
.menu-period + .menu-period { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid rgba(56, 88, 136, 0.15); }
.menu-period > h3 { margin: 0 0 1.25rem; color: var(--navy, #385888); }
.menu-group + .menu-group { margin-top: 1.5rem; }
.menu-group > h4 { margin: 0 0 0.75rem; color: var(--darkBlue, #0075bf); font-size: 1rem; text-transform: uppercase; letter-spacing: 0.04em; }
.menu-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.menu-item { display: flex; justify-content: space-between; gap: 1.5rem; padding: 1rem 0; border-bottom: 1px solid rgba(56, 88, 136, 0.12); }
.menu-item:first-child { border-top: 1px solid rgba(56, 88, 136, 0.12); }
.menu-item__content { min-width: 0; }
.menu-item h3 { margin: 0; color: var(--ink, #243447); font-size: 1rem; }
.menu-item p { margin: 0.4rem 0 0; color: var(--mediumGray, #595854); line-height: 1.55; }
.menu-item__price { flex: 0 0 auto; color: var(--navy, #385888); font-weight: 800; white-space: nowrap; }

/* Sidebar cards */
.sidebar-section { padding: 1.25rem; background: #fff; border: 1px solid rgba(56, 88, 136, 0.15); border-radius: 16px; box-shadow: 0 10px 25px rgba(32, 54, 86, 0.07); }
.sidebar-section h2 { margin: 0 0 1rem; color: var(--navy, #385888); font-size: 1.15rem; }
.sidebar-section ul { display: grid; gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.sidebar-section li { line-height: 1.5; }
.sidebar-section a { color: var(--darkBlue, #0075bf); font-weight: 700; }

/* Disclaimer */
.restaurant-disclaimer { background: rgba(255, 103, 93, 0.07); border-color: rgba(255, 103, 93, 0.2); }
.restaurant-disclaimer p:last-child { margin-bottom: 0; }

/* Previous / next restaurant navigation */
.restaurant-pagination { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; align-items: center; margin-top: 2rem; }
.restaurant-pagination a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0.7rem 1rem; border: 2px solid var(--darkBlue, #0075bf); border-radius: 999px; color: var(--darkBlue, #0075bf); font-weight: 800; text-decoration: none; }
.restaurant-pagination__all { grid-column: 2; }

/* Responsive */
@media (max-width:900px) {
    .restaurant-page__layout { grid-template-columns: 1fr; }
    .restaurant-page__layout .sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:640px) {
    .restaurant-page { width: min(100% - 24px, 1180px); padding-block: 1.5rem 3rem; }
    .restaurant-facts { grid-template-columns: 1fr; }
    .restaurant-page__layout .sidebar { grid-template-columns: 1fr; }
    .menu-item { display: block; }
    .menu-item__price { display: block; margin-top: 0.5rem; }
    .restaurant-pagination { grid-template-columns: 1fr; }
    .restaurant-pagination__all { grid-column: auto; }
}

.restaurant-pagination__previous, .restaurant-pagination__next { gap: 0.75rem; }
.restaurant-pagination__previous span, .restaurant-pagination__next span { display: grid; gap: 0.15rem; }
.restaurant-pagination__previous small, .restaurant-pagination__next small { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; }
.restaurant-pagination__previous strong, .restaurant-pagination__next strong { font-size: 0.9rem; }
.restaurant-pagination__previous { justify-self: start; text-align: left; }
.restaurant-pagination__next { justify-self: end; text-align: right; }

.card-title-link { color: inherit; text-decoration: none; }
.card-title-link:hover, .card-title-link:focus-visible { color: var(--darkBlue, #0075bf); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.2em; }


.restaurant-directory-hero { padding: 4rem 0 3rem; background: radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 35%), linear-gradient(135deg, var(--navy), var(--blue)); color: #fff; }
.restaurant-directory-hero h1 { max-width: 100%; margin: 0 0 1rem; color: inherit; }
.restaurant-directory-hero__intro { max-width: 100%; margin: 0; font-size: 1.125rem; line-height: 1.7; }
.restaurant-directory-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 100%; margin-top: 2rem; }
.restaurant-directory-stat { padding: 1rem 1.25rem; border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 1rem; background: rgba(255, 255, 255, 0.12); backdrop-filter: blur(8px); }
.restaurant-directory-stat strong, .restaurant-directory-stat span { display: block; }
.restaurant-directory-stat strong { font-size: 1.75rem; }
.restaurant-directory-stat span { margin-top: 0.2rem; font-size: 0.875rem; opacity: 0.9; }
.restaurant-directory { padding: 3rem 0 5rem; }
.restaurant-directory-filters { display: grid; grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 2rem; }
.restaurant-directory-filter-group { padding: 1.5rem; border: 1px solid var(--lightGray); border-radius: 1rem; background: #fff; box-shadow: 0 10px 30px rgba(20, 43, 73, 0.08); }
.restaurant-directory-filter-group h2 { margin: 0 0 1rem; font-size: 1.15rem; }
/*.restaurant-directory-filter-links { display: flex; flex-wrap: wrap; gap: 0.65rem; }*/
/*.restaurant-directory-filter-links a { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.65rem 0.85rem; border-radius: 999px; background: var(--lightBlue); color: var(--navy); font-weight: 700; text-decoration: none; }*/
/*.restaurant-directory-filter-links a:hover, .restaurant-directory-filter-links a:focus-visible { background: var(--blue); color: #fff; }*/
/*.restaurant-directory-filter-links span { display: inline-grid; min-width: 1.6rem; min-height: 1.6rem; place-items: center; padding: 0 0.35rem; border-radius: 999px; background: rgba(255, 255, 255, 0.75); color: var(--navy); font-size: 0.75rem; }*/
.restaurant-directory-filter-links { display: flex; flex-wrap: wrap; gap: 0.65rem; }
.restaurant-filter { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.7rem 1rem; border: 1px solid rgba(20, 43, 73, 0.14); border-radius: 999px; background: #fff; color: var(--navy); font: inherit; font-size: 0.9rem; font-weight: 700; line-height: 1; cursor: pointer; box-shadow: 0 4px 12px rgba(20, 43, 73, 0.06); transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-filter:hover, .restaurant-filter:focus-visible { border-color: var(--blue); color: var(--blue); box-shadow: 0 7px 18px rgba(20, 43, 73, 0.12); transform: translateY(-1px); }
.restaurant-filter.active { border-color: var(--blue); background: var(--blue); color: #fff; box-shadow: 0 7px 18px rgba(0, 117, 191, 0.2); }
.restaurant-filter i { display: inline-grid; min-width: 1.6rem; height: 1.6rem; place-items: center; padding: 0 0.35rem; border-radius: 999px; background: var(--lightBlue); color: var(--navy); font-size: 0.72rem; font-style: normal; font-weight: 800; }
.restaurant-filter.active i { background: rgba(255, 255, 255, 0.22); color: #fff; }
.restaurant-directory-status { margin: 1.5rem 0; color: var(--darkGray); font-size: 0.9rem; font-weight: 700; }
.restaurant-directory-card[hidden], .restaurant-directory-group[hidden], .restaurant-directory-letters a[hidden] { display: none; }

@media (max-width:700px) {
    .restaurant-directory-filter-links { gap: 0.5rem; }
    .restaurant-filter { justify-content: space-between; width: 100%; }
}


.restaurant-directory-letters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 2.5rem; padding: 1rem; border-radius: 1rem; background: var(--lightGray); }
.restaurant-directory-letters a { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: 0.65rem; background: #fff; color: var(--navy); font-weight: 800; text-decoration: none; }
.restaurant-directory-letters a:hover, .restaurant-directory-letters a:focus-visible { background: var(--blue); color: #fff; }
.restaurant-directory-group { scroll-margin-top: 2rem; margin-bottom: 3rem; }
.restaurant-directory-group__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 3px solid var(--lightBlue); }
.restaurant-directory-group__heading h2 { margin: 0; font-size: 2rem; }
.restaurant-directory-group__heading a { font-size: 0.875rem; font-weight: 700; }
.restaurant-directory-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.restaurant-directory-card { min-width: 0; }
.restaurant-directory-card > a { display: flex; height: 100%; flex-direction: column; padding: 1.25rem; border: 1px solid var(--lightGray); border-radius: 1rem; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 8px 24px rgba(20, 43, 73, 0.06); transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-directory-card > a:hover, .restaurant-directory-card > a:focus-visible { border-color: var(--blue); box-shadow: 0 14px 32px rgba(20, 43, 73, 0.13); transform: translateY(-2px); }
.restaurant-directory-card__name, .restaurant-directory-card__location, .restaurant-directory-card__meta, .restaurant-directory-card__count { display: block; }
.restaurant-directory-card__name { color: var(--navy); font-size: 1.125rem; font-weight: 800; }
.restaurant-directory-card__location { margin-top: 0.4rem; color: var(--darkGray); line-height: 1.45; }
.restaurant-directory-card__meta { margin-top: 0.75rem; color: var(--blue); font-size: 0.8rem; font-weight: 700; }
.restaurant-directory-card__count { margin-top: auto; padding-top: 1rem; color: var(--mediumGray); font-size: 0.8rem; }
@media (max-width:900px) {
    .restaurant-directory-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:700px) {
    .restaurant-directory-hero { padding: 3rem 0 2.5rem; }
    .restaurant-directory-stats, .restaurant-directory-filters, .restaurant-directory-list { grid-template-columns: 1fr; }
    .restaurant-directory-filter-links { align-items: stretch; flex-direction: column; }
    .restaurant-directory-filter-links a { justify-content: space-between; }
}

.restaurant-destinations { margin: 3rem 0; padding: 2rem; background: #b7d2e7; border: 1px solid var(--borderColor); border-radius: 16px; }
.restaurant-destinations__header { margin-bottom: 2rem; }
.restaurant-destinations__header h2 { margin: 0 0 .5rem; }
.restaurant-destinations__header p { margin: 0; color: var(--textLight); max-width: 100%; }
.restaurant-destinations__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.destination-card { display: flex; flex-direction: column; justify-content: space-between; min-height: 140px; padding: 1.5rem; background: linear-gradient(180deg, #ffffff, #f8fbff); border: 1px solid #d9e7f5; border-radius: 14px; text-decoration: none; transition: transform .18s, box-shadow .18s, border-color .18s; }
.destination-card:hover { transform: translateY(-3px); border-color: var(--blue); box-shadow: 0 10px 30px rgba(0, 0, 0, .08); }
.destination-card__title { font-size: 1.2rem; font-weight: 700; color: var(--navy); }
.destination-card__count { margin: .75rem 0; color: var(--textLight); font-size: .95rem; }
.destination-card__link { margin-top: auto; font-weight: 600; color: var(--blue); }


/* =========================================================
   About page
   ========================================================= */
.about-page { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding: 32px 0 72px; }
.about-content { margin-inline: auto; }

/* Intro and standard content sections */
.about-section { position: relative; overflow: hidden; margin-bottom: 28px; padding: clamp(26px, 4vw, 40px); border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, 0.08); }
.about-section::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky), var(--blue)); }
.about-section--intro { border-left: 6px solid var(--coral); }
.about-section--intro::before { display: none; }
.about-section--mission { background: radial-gradient(circle at 95% 5%, rgba(130, 201, 232, 0.24), transparent 260px), var(--paper); }
.about-section--thanks { background: radial-gradient(circle at 95% 90%, rgba(241, 189, 75, 0.2), transparent 260px), var(--paper); }
.about-section__heading { margin-bottom: 20px; }
.about-section__heading .eyebrow { margin-bottom: 9px; }
.about-section__heading h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.35rem); line-height: 1; letter-spacing: -0.035em; }
.about-section__heading > p:last-child:not(.eyebrow) { max-width: 100%; margin: 14px 0 0; color: var(--muted); line-height: 1.65; }
.about-section__body, .about-section--intro { color: var(--ink); line-height: 1.75; }
.about-section__body p, .about-section--intro p { margin-bottom: 0; }
.about-section__body p + p, .about-section--intro p + p { margin-top: 16px; }
.about-lead { color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.25rem, 2.7vw, 1.65rem); font-weight: 700; line-height: 1.5; }

/* Pull quote */
.about-quote { position: relative; margin: 28px 0; padding: 25px 28px 25px 66px; border: 1px solid #d6d1e2; border-left: 6px solid var(--blue); border-radius: 0 18px 18px 0; background: #eef7fb; }
.about-quote::before { content: "“"; position: absolute; top: 8px; left: 20px; color: rgba(39, 121, 184, 0.24); font-family: Georgia, "Times New Roman", serif; font-size: 4.5rem; line-height: 1; }
.about-quote p { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.2rem, 3vw, 1.65rem); font-style: italic; font-weight: 700; line-height: 1.45; }

/* Feature section */
.about-features { margin-bottom: 28px; padding: clamp(26px, 4vw, 40px); border: 1px solid #d6d1e2; border-radius: 24px; background: radial-gradient(circle at 95% 5%, rgba(130, 201, 232, 0.2), transparent 260px), #eef5f8; }
.about-features__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.about-feature { display: flex; min-width: 0; flex-direction: column; padding: 25px; border: 1px solid var(--line); border-radius: 21px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.08); transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.about-feature:hover { border-color: var(--sky); box-shadow: 0 16px 34px rgba(24, 35, 74, 0.13); transform: translateY(-2px); }
.about-feature__icon { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 15px; background: var(--lavender); font-size: 1.45rem; }
.about-feature h3 { margin: 0 0 9px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; line-height: 1.12; }
.about-feature p { margin: 0 0 18px; color: var(--muted); line-height: 1.6; }
.about-feature a { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; color: var(--blue); font-weight: 800; text-decoration: none; }
.about-feature a:hover, .about-feature a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

/* Bottom call to action */
.about-explore { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 38px; padding: clamp(28px, 4vw, 44px); border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 26px; color: #fff; background: radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.18), transparent 230px), linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 16px 38px rgba(16, 38, 91, 0.2); }
.about-explore__content { max-width: 100%; }
.about-explore .eyebrow { color: var(--gold); }
.about-explore h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.25rem); line-height: 1; letter-spacing: -0.035em; }
.about-explore p { margin: 15px 0 0; color: #e9f5ff; line-height: 1.65; }
.about-explore__links { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.about-explore__links a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 1px solid rgba(255, 255, 255, 0.72); border-radius: 999px; color: #fff; background: rgba(255, 255, 255, 0.08); font-size: 0.88rem; font-weight: 800; text-decoration: none; transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease; }
.about-explore__links a:hover, .about-explore__links a:focus-visible { color: var(--navy); background: #fff; border-color: #fff; transform: translateY(-1px); }
.about-explore__links .about-explore__primary { color: var(--navy); background: var(--gold); border-color: var(--gold); }
.about-explore__links .about-explore__primary:hover, .about-explore__links .about-explore__primary:focus-visible { color: #4b2105; background: #ffcf68; border-color: #fff; }

/* Responsive */
@media (max-width:900px) {
    .about-features__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .about-explore { align-items: flex-start; flex-direction: column; }
    .about-explore__links { justify-content: flex-start; }
}
@media (max-width:640px) {
    .about-page { width: min(100% - 24px, 1180px); padding: 24px 0 50px; }
    .about-section, .about-features { padding: 24px 20px; border-radius: 20px; }
    .about-features__grid { grid-template-columns: 1fr; }
    .about-quote { padding: 60px 20px 22px; border-left-width: 1px; border-radius: 16px; }
    .about-quote::before { top: 8px; left: 18px; }
    .about-explore { padding: 26px 20px; border-radius: 20px; }
    .about-explore__links { width: 100%; flex-direction: column; }
    .about-explore__links a { width: 100%; }
}
@media (prefers-reduced-motion:reduce) {
    .about-feature, .about-explore__links a { transition: none; }
}

/* =========================================================
   Contact page
   ========================================================= */
.contact-page { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding: 32px 0 72px; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.65fr)
minmax(280px, 0.75fr); gap: 28px; align-items: start; }
.contact-card, .contact-sidebar-card, .contact-thank-you { border: 1px solid var(--line); background: var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, 0.08); }
.contact-card { position: relative; overflow: hidden; padding: clamp(26px, 4vw, 40px); border-radius: 24px; }
.contact-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky), var(--blue)); }
.contact-heading { margin-bottom: 28px; }
.contact-heading .eyebrow { margin-bottom: 9px; }
.contact-heading h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.3rem); line-height: 1; letter-spacing: -0.035em; }
.contact-heading > p:last-child { max-width: 100%; margin: 14px 0 0; color: var(--muted); line-height: 1.65; }
.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.field { margin-bottom: 22px; }
.field label { display: block; margin-bottom: 8px; color: var(--navy); font-size: 0.8rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.field label span { color: var(--coral); }
.field input, .field select, .field textarea { width: 100%; min-height: 52px; padding: 13px 15px; border: 1px solid #c8c5db; border-radius: 14px; color: var(--ink); background: #fff; font: inherit; box-shadow: 0 4px 13px rgba(24, 35, 74, 0.05); transition: border-color 160ms ease, box-shadow 160ms ease; }
.field textarea { min-height: 190px; resize: vertical; line-height: 1.55; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--sky); box-shadow: 0 0 0 4px rgba(130, 201, 232, 0.24), 0 4px 13px rgba(24, 35, 74, 0.05); }
.field-help { margin: 7px 0 0; color: var(--muted); font-size: 0.8rem; line-height: 1.45; }
.contact-form__notice { margin-bottom: 22px; padding: 15px 17px; border: 1px solid rgba(231, 91, 103, 0.35); border-left: 6px solid var(--coral); border-radius: 13px; color: #7b2632; background: #fff0f2; font-weight: 700; line-height: 1.5; }
.contact-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.contact-form__footer { display: flex; align-items: center; gap: 18px; }
.contact-form__footer p { margin: 0; color: var(--muted); font-size: 0.8rem; }
.contact-submit { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; padding: 11px 25px; border: 0; border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--navy), #285d9d); font: inherit; font-weight: 800; cursor: pointer; box-shadow: 0 6px 16px rgba(16, 38, 91, 0.22); transition: box-shadow 160ms ease, transform 160ms ease; }
.contact-submit:hover, .contact-submit:focus-visible { box-shadow: 0 9px 20px rgba(16, 38, 91, 0.28); transform: translateY(-1px); }
.contact-submit:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }

/* Sidebar */
.contact-sidebar { display: grid; gap: 18px; }
.contact-sidebar-card { padding: 25px; border-radius: 21px; }
.contact-sidebar-card .eyebrow { margin-bottom: 8px; }
.contact-sidebar-card h2 { margin: 0 0 14px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.45rem; line-height: 1.1; }
.contact-sidebar-card p { margin: 0; color: var(--muted); line-height: 1.65; }
.contact-sidebar-card p + p { margin-top: 13px; }
.contact-sidebar-card__small { padding-top: 13px; border-top: 1px solid var(--line); font-size: 0.82rem; }
.contact-checklist { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.contact-checklist li { position: relative; padding-left: 25px; color: var(--muted); line-height: 1.5; }
.contact-checklist li::before { content: "✓"; position: absolute; top: 0; left: 0; color: var(--blue); font-weight: 900; }

/* Thank-you page */
.contact-thank-you { margin-inline: auto; padding: clamp(32px, 6vw, 60px); border-radius: 26px; text-align: center; }
.contact-thank-you__icon { width: 74px; height: 74px; display: grid; place-items: center; margin: 0 auto 20px; border: 3px solid var(--blue); border-radius: 50%; color: #fff; background: var(--blue); font-size: 2rem; font-weight: 900; box-shadow: 0 9px 20px rgba(39, 121, 184, 0.22); }
.contact-thank-you h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1; }
.contact-thank-you > p:not(.eyebrow) { max-width: 100%; margin: 16px auto 0; color: var(--muted); line-height: 1.65; }
.contact-thank-you__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.contact-thank-you__links a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 1px solid var(--navy); border-radius: 999px; color: var(--navy); background: #fff; font-weight: 800; text-decoration: none; }
.contact-thank-you__links a:hover, .contact-thank-you__links a:focus-visible { color: #fff; background: var(--navy); }
.contact-thank-you__links .contact-thank-you__primary { color: var(--navy); background: var(--gold); border-color: var(--gold); }

/* Responsive */
@media (max-width:900px) {
    .contact-layout { grid-template-columns: 1fr; }
    .contact-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:640px) {
    .contact-page { width: min(100% - 24px, 1180px); padding: 24px 0 50px; }
    .contact-card, .contact-thank-you { padding: 24px 20px; border-radius: 20px; }
    .contact-grid, .contact-sidebar { grid-template-columns: 1fr; }
    .contact-form__footer { align-items: stretch; flex-direction: column; }
    .contact-submit { width: 100%; }
    .contact-thank-you__links { flex-direction: column; }
    .contact-thank-you__links a { width: 100%; }
}
@media (prefers-reduced-motion:reduce) {
    .contact-submit, .field input, .field select, .field textarea { transition: none; }
}

/* =========================================================
   Guide listing and category pages
   ========================================================= */
.guides-page { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding: 32px 0 72px; }
.guide-listing-hero .hero-content { max-width: 100%; }

/* Shared headings */
.guides-section-heading { max-width: 100%; margin-bottom: 26px; }
.guides-section-heading h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.1rem, 5vw, 3.75rem); line-height: 1; letter-spacing: -0.04em; }
.guides-section-heading > p:last-child:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); line-height: 1.68; }

/* Main guide hub introduction */
.guides-intro { display: grid; grid-template-columns: minmax(0, 1.35fr)
minmax(280px, 0.65fr); gap: 28px; margin-bottom: 58px; }
.guides-intro__content, .guides-intro__highlight { border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, 0.08); }
.guides-intro__content { padding: clamp(27px, 4vw, 40px); }
.guides-intro__content h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.4rem); line-height: 1; letter-spacing: -0.035em; }
.guides-intro__content p:not(.eyebrow) { color: var(--muted); line-height: 1.72; }
.guides-intro__content h2 + p { margin-top: 16px; }
.guides-intro__content p + p { margin-top: 14px; }
.guides-intro__highlight { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-content: center; padding: 26px; color: #fff; background: radial-gradient(circle at 95% 5%, rgba(255, 255, 255, 0.16), transparent 180px), linear-gradient(135deg, var(--navy), #285d9d); }
.guides-intro__highlight > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-size: 1.2rem; font-weight: 900; }
.guides-intro__highlight strong { display: block; margin-bottom: 7px; color: var(--gold); font-size: 0.76rem; letter-spacing: 0.06em; text-transform: uppercase; }
.guides-intro__highlight a { color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; font-weight: 800; line-height: 1.2; }
.guides-intro__highlight p { margin: 11px 0 0; color: #e9f5ff; font-size: 0.88rem; line-height: 1.55; }

/* Guide category cards */
.guide-categories { margin-bottom: 66px; }
.guide-categories__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.guide-category-card { position: relative; overflow: hidden; display: flex; min-width: 0; min-height: 100%; flex-direction: column; padding: 27px; border: 1px solid var(--line); border-radius: 23px; color: inherit; background: var(--paper); box-shadow: 0 13px 34px rgba(24, 35, 74, 0.08); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.guide-category-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--coral), var(--gold), var(--sky)); }
.guide-category-card:hover, .guide-category-card:focus-visible { border-color: var(--sky); box-shadow: 0 17px 38px rgba(24, 35, 74, 0.13); transform: translateY(-3px); }
.guide-category-card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.guide-category-card--featured { color: #fff; border-color: var(--navy); background: radial-gradient(circle at 95% 5%, rgba(255, 255, 255, 0.14), transparent 190px), linear-gradient(145deg, var(--navy), #285d9d); }
.guide-category-card--featured::before { background: var(--gold); }
.guide-category-card__icon { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 15px; color: var(--navy); background: var(--lavender); font-size: 1.4rem; font-weight: 900; }
.guide-category-card--featured .guide-category-card__icon { background: var(--gold); }
.guide-category-card__eyebrow { margin-bottom: 8px; color: var(--coral); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.09em; text-transform: uppercase; }
.guide-category-card--featured .guide-category-card__eyebrow { color: var(--gold); }
.guide-category-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; line-height: 1.08; }
.guide-category-card--featured h3 { color: #fff; }
.guide-category-card p { margin: 13px 0 21px; color: var(--muted); line-height: 1.62; }
.guide-category-card--featured p { color: #e9f5ff; }
.guide-category-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; color: var(--blue); font-weight: 800; }
.guide-category-card--featured .guide-category-card__link { color: var(--gold); }

/* Featured guide */
.featured-guides { margin-bottom: 66px; }
.featured-guide-card { display: grid; grid-template-columns: minmax(0, 1.35fr)
minmax(290px, 0.65fr); overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: var(--paper); box-shadow: 0 15px 40px rgba(24, 35, 74, 0.1); }
.featured-guide-card__content { padding: clamp(28px, 4vw, 44px); }
.featured-guide-card__meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 17px; }
.featured-guide-card__meta span { padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.72rem; font-weight: 800; }
.featured-guide-card h3 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.25rem); line-height: 1; letter-spacing: -0.035em; }
.featured-guide-card h3 a { color: var(--navy); text-decoration: none; }
.featured-guide-card h3 a:hover, .featured-guide-card h3 a:focus-visible { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.featured-guide-card__content > p { margin: 18px 0 0; color: var(--muted); line-height: 1.7; }
.featured-guide-card__content ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 20px; margin: 22px 0 0; padding: 0; list-style: none; }
.featured-guide-card__content li { position: relative; padding-left: 24px; color: #46516e; line-height: 1.5; }
.featured-guide-card__content li::before { content: "✓"; position: absolute; left: 0; color: var(--blue); font-weight: 900; }
.featured-guide-card__button, .guide-listing-card__button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 46px; margin-top: 25px; padding: 10px 18px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--navy), #285d9d); font-weight: 800; text-decoration: none; }
.featured-guide-card__button:hover, .featured-guide-card__button:focus-visible, .guide-listing-card__button:hover, .guide-listing-card__button:focus-visible { color: var(--navy); background: var(--gold); }
.featured-guide-card__visual { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; padding: 35px; color: #fff; text-align: center; background: radial-gradient(circle at 15% 10%, rgba(255, 255, 255, 0.16), transparent 140px), linear-gradient(145deg, var(--blue), var(--navy)); }
.featured-guide-card__visual-mark { width: 92px; height: 92px; display: grid; place-items: center; border: 4px solid #fff; border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.65rem; font-weight: 900; box-shadow: 0 10px 25px rgba(5, 18, 52, 0.24); }
.featured-guide-card__visual strong { font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; }
.featured-guide-card__visual > span:last-child { color: #e9f5ff; font-size: 0.82rem; line-height: 1.5; }

/* Planning category introduction */
.guide-category-intro { display: grid; grid-template-columns: minmax(0, 1.25fr)
minmax(300px, 0.75fr); gap: 28px; margin-bottom: 58px; padding: clamp(28px, 4vw, 42px); border: 1px solid var(--line); border-radius: 25px; background: radial-gradient(circle at 95% 5%, rgba(130, 201, 232, 0.22), transparent 250px), var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, 0.08); }
.guide-category-intro h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.1rem, 4.8vw, 3.55rem); line-height: 1; letter-spacing: -0.035em; }
.guide-category-intro > div:first-child > p:last-child { margin: 16px 0 0; color: var(--muted); line-height: 1.7; }
.guide-category-intro__facts { display: grid; gap: 11px; }
.guide-category-intro__facts div { padding: 15px 17px; border: 1px solid rgba(39, 121, 184, 0.15); border-radius: 15px; background: rgba(255, 255, 255, 0.78); }
.guide-category-intro__facts strong, .guide-category-intro__facts span { display: block; }
.guide-category-intro__facts strong { color: var(--navy); }
.guide-category-intro__facts span { margin-top: 4px; color: var(--muted); font-size: 0.8rem; }

/* Guide listing cards */
.guide-listing-section { margin-bottom: 62px; }
.guide-listing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.guide-listing-card { display: flex; min-width: 0; flex-direction: column; padding: 26px; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.08); }
.guide-listing-card--coming { background: linear-gradient(145deg, rgba(233, 229, 248, 0.48), var(--paper)); }
.guide-listing-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.guide-listing-card__icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--navy); background: var(--gold); font-size: 1.2rem; font-weight: 900; }
.guide-listing-card__meta { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.guide-listing-card__meta span { padding: 5px 8px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.67rem; font-weight: 800; }
.guide-listing-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; line-height: 1.1; }
.guide-listing-card h3 a { color: inherit; text-decoration: none; }
.guide-listing-card h3 a:hover, .guide-listing-card h3 a:focus-visible { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }
.guide-listing-card > p:not(.eyebrow) { margin: 14px 0 0; color: var(--muted); line-height: 1.62; }
.guide-listing-card__topics { display: flex; flex-wrap: wrap; gap: 7px; margin: 18px 0 0; padding: 0; list-style: none; }
.guide-listing-card__topics li { padding: 6px 9px; border-radius: 999px; color: #31506a; background: #eaf3f8; font-size: 0.72rem; font-weight: 700; }
.guide-listing-card__button { align-self: flex-start; margin-top: auto; padding-top: 10px; }

/* Category recommendation note */
.guide-category-note { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 20px; margin-bottom: 50px; padding: clamp(26px, 4vw, 38px); border: 1px solid #efd08c; border-left: 7px solid var(--gold); border-radius: 20px; background: #fff6df; }
.guide-category-note__icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: var(--gold); font-size: 1.6rem; }
.guide-category-note h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.75rem, 4vw, 2.65rem); line-height: 1.05; }
.guide-category-note p:not(.eyebrow) { margin: 12px 0 0; color: #554525; line-height: 1.65; }
.guide-category-note a { display: inline-flex; gap: 7px; margin-top: 16px; color: var(--blue); font-weight: 800; }

/* Shared CTA */
.guides-cta { display: flex; align-items: center; justify-content: space-between; gap: 34px; padding: clamp(28px, 4vw, 44px); border-radius: 26px; color: #fff; background: radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.17), transparent 230px), linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 16px 38px rgba(16, 38, 91, 0.2); }
.guides-cta > div:first-child { max-width: 100%; }
.guides-cta .eyebrow { color: var(--gold); }
.guides-cta h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.3rem); line-height: 1; letter-spacing: -0.035em; }
.guides-cta p { margin: 15px 0 0; color: #e9f5ff; line-height: 1.65; }
.guides-cta__links { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.guides-cta__links a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 1px solid rgba(255, 255, 255, 0.72); border-radius: 999px; color: #fff; background: rgba(255, 255, 255, 0.08); font-weight: 800; text-decoration: none; }
.guides-cta__links a:hover, .guides-cta__links a:focus-visible { color: var(--navy); background: #fff; border-color: #fff; }
.guides-cta__links .guides-cta__primary { color: var(--navy); background: var(--gold); border-color: var(--gold); }

/* Responsive */
@media (max-width:960px) {
    .guides-intro, .guide-category-intro, .featured-guide-card { grid-template-columns: 1fr; }
    .guide-categories__grid, .guide-listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .featured-guide-card__visual { min-height: 300px; }
    .guides-cta { align-items: flex-start; flex-direction: column; }
    .guides-cta__links { justify-content: flex-start; }
}
@media (max-width:700px) {
    .guides-page { width: min(100% - 24px, 1180px); padding: 24px 0 50px; }
    .guide-categories__grid, .guide-listing-grid, .featured-guide-card__content ul { grid-template-columns: 1fr; }
    .guides-intro__content, .guides-intro__highlight, .guide-category-intro, .guide-category-card, .featured-guide-card__content, .guide-listing-card, .guide-category-note, .guides-cta { padding: 22px; border-radius: 19px; }
    .guide-category-note { grid-template-columns: 1fr; }
    .guides-cta__links { width: 100%; flex-direction: column; }
    .guides-cta__links a { width: 100%; }
}
@media (prefers-reduced-motion:reduce) {
    .guide-category-card { transition: none; }
}

/* =========================================================
   Guide detail pages
   ========================================================= */
.guide-page { width: min(1180px, calc(100% - 40px)); margin-inline: auto; padding: 32px 0 72px; }
.guide-hero h1 span { display: block; margin-top: 14px; color: var(--gold); font-size: 0.42em; line-height: 1.1; }
.guide-hero__meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 26px; }
.guide-hero__meta span { display: grid; gap: 3px; color: rgba(255, 255, 255, 0.88); font-size: 0.86rem; }
.guide-hero__meta strong { color: var(--gold); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; }

/* At-a-glance panel */
.guide-glance { display: grid; grid-template-columns: minmax(0, 1.15fr)
minmax(350px, 0.85fr); gap: 30px; margin-bottom: 38px; padding: clamp(26px, 4vw, 40px); border: 1px solid var(--line); border-radius: 26px; background: radial-gradient(circle at 95% 5%, rgba(130, 201, 232, 0.24), transparent 260px), var(--paper); box-shadow: 0 14px 38px rgba(24, 35, 74, 0.09); }
.guide-glance__intro h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.5rem); line-height: 1; letter-spacing: -0.035em; }
.guide-glance__intro > p:last-child { max-width: 100%; margin: 16px 0 0; color: var(--muted); line-height: 1.7; }
.guide-glance__details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.guide-glance__item { display: flex; align-items: flex-start; gap: 11px; padding: 15px; border: 1px solid rgba(39, 121, 184, 0.15); border-radius: 16px; background: rgba(255, 255, 255, 0.78); }
.guide-glance__icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-weight: 900; }
.guide-glance__item strong, .guide-glance__item div > span { display: block; }
.guide-glance__item strong { color: var(--navy); line-height: 1.25; }
.guide-glance__item div > span { margin-top: 4px; color: var(--muted); font-size: 0.78rem; line-height: 1.4; }

/* Main layout */
.guide-layout { display: grid; grid-template-columns: minmax(220px, 270px) minmax(0, 1fr); gap: clamp(28px, 5vw, 58px); align-items: start; }
.guide-sidebar { min-width: 0; }
.guide-toc { position: sticky; top: 24px; padding: 23px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 10px 28px rgba(24, 35, 74, 0.07); }
.guide-toc .eyebrow { margin-bottom: 15px; }
.guide-toc ol { gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: guide-toc; }
.guide-toc li { counter-increment: guide-toc; border-top: 1px solid var(--line); }
.guide-toc li:last-child { border-bottom: 1px solid var(--line); }
.guide-toc a { position: relative; display: block; padding: 11px 4px 11px 29px; color: var(--navy); font-size: 0.82rem; font-weight: 700; line-height: 1.4; text-decoration: none; }
.guide-toc a::before { content: counter(guide-toc, decimal-leading-zero); position: absolute; top: 12px; left: 0; color: var(--coral); font-size: 0.68rem; font-weight: 900; }
.guide-toc a:hover, .guide-toc a:focus-visible { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }

/* Article typography */
.guide-article { min-width: 0; }
.guide-introduction, .guide-section, .guide-takeaways, .guide-source-note { scroll-margin-top: 24px; }
.guide-introduction { margin-bottom: 34px; padding: clamp(26px, 4vw, 38px); border: 1px solid var(--line); border-left: 6px solid var(--coral); border-radius: 20px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.07); }
.guide-introduction p { margin-bottom: 0; color: #46516e; line-height: 1.78; }
.guide-introduction p + p { margin-top: 16px; }
.guide-lead { color: var(--navy) !important; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.25rem, 2.8vw, 1.7rem); font-weight: 700; line-height: 1.5 !important; }
.guide-section { margin-top: 60px; }
.guide-section-heading { margin-bottom: 23px; }
.guide-section-heading h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.45rem); line-height: 1; letter-spacing: -0.035em; }
.guide-section-heading > p:last-child:not(.eyebrow) { max-width: 100%; margin: 14px 0 0; color: var(--muted); line-height: 1.65; }
.guide-section > p { color: #46516e; line-height: 1.78; }
.guide-section > p + p { margin-top: 17px; }

/* Key takeaways */
.guide-takeaways { padding: clamp(26px, 4vw, 38px); border-radius: 24px; color: #fff; background: radial-gradient(circle at 95% 5%, rgba(255, 255, 255, 0.16), transparent 230px), linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 15px 36px rgba(16, 38, 91, 0.19); }
.guide-takeaways .eyebrow { color: var(--gold); }
.guide-takeaways h2 { color: #fff; }
.guide-takeaways ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 26px; margin: 0; padding: 0; list-style: none; }
.guide-takeaways li { position: relative; padding-left: 27px; color: #e9f5ff; line-height: 1.55; }
.guide-takeaways li::before { content: "✓"; position: absolute; top: 0; left: 0; color: var(--gold); font-weight: 900; }

/* Plan comparison */
.guide-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.guide-plan-card { position: relative; display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--line); border-radius: 23px; background: var(--paper); box-shadow: 0 13px 34px rgba(24, 35, 74, 0.08); }
.guide-plan-card--featured { border: 2px solid var(--blue); }
.guide-plan-card__badge { position: absolute; top: -13px; right: 20px; padding: 7px 12px; border-radius: 999px; color: var(--navy); background: var(--gold); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; }
.guide-plan-card__heading h3 { margin: 0 0 14px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.08; }
.guide-plan-card > p { color: var(--muted); line-height: 1.65; }
.guide-plan-card__label { margin: 7px 0 10px; color: var(--navy) !important; font-size: 0.76rem; font-weight: 900; letter-spacing: 0.07em; text-transform: uppercase; }
.guide-plan-card ul { display: grid; gap: 9px; margin: 0 0 22px; padding: 0; list-style: none; }
.guide-plan-card li { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border-radius: 12px; color: #40506d; background: #eef5f8; }
.guide-plan-card li strong { width: 29px; height: 29px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); }
.guide-plan-card__best-for { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); font-size: 0.87rem; }
.guide-plan-card__best-for strong { color: var(--navy); }

/* Tips and notes */
.guide-tip { display: flex; gap: 17px; margin-top: 27px; padding: 21px; border: 1px solid #efd08c; border-left: 6px solid var(--gold); border-radius: 16px; background: #fff6df; }
.guide-tip__icon { flex: 0 0 auto; font-size: 1.6rem; }
.guide-tip p { margin: 0; color: #554525; line-height: 1.6; }
.guide-tip__title { margin-bottom: 5px !important; color: #6b3e00 !important; font-weight: 900; }
.guide-note { margin-top: 24px; padding: 17px 19px; border: 1px solid #c8dce9; border-left: 6px solid var(--blue); border-radius: 14px; color: #40506d; background: #eef7fb; line-height: 1.6; }
.guide-note strong { color: var(--navy); }

/* Credit cards */
.guide-credit-list { display: grid; gap: 17px; }
.guide-credit-card { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 20px; padding: 25px; border: 1px solid var(--line); border-radius: 21px; background: var(--paper); box-shadow: 0 11px 30px rgba(24, 35, 74, 0.07); }
.guide-credit-card__icon { width: 58px; height: 58px; display: grid; place-items: center; border: 3px solid var(--blue); border-radius: 50%; color: var(--blue); background: #e6f5ff; font-size: 0.82rem; font-weight: 900; }
.guide-credit-card h3 { margin: 0 0 10px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.5rem; }
.guide-credit-card p { margin: 0; color: var(--muted); line-height: 1.68; }
.guide-credit-card p + p { margin-top: 12px; }
.guide-credit-card a { display: inline-flex; align-items: center; gap: 6px; margin-top: 15px; color: var(--blue); font-weight: 800; text-decoration: none; }
.guide-credit-card a:hover, .guide-credit-card a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

/* Two-column lists */
.guide-two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 25px; }
.guide-list-card { padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); }
.guide-list-card h3 { margin: 0 0 14px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; }
.guide-list-card ul { display: grid; gap: 8px; margin: 0; padding-left: 21px; color: var(--muted); line-height: 1.55; }

/* Numbered steps */
.guide-steps { display: grid; gap: 15px; margin-top: 25px; }
.guide-step { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 17px; align-items: start; padding: 21px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); }
.guide-step > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; font-weight: 900; }
.guide-step h3 { margin: 0 0 6px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; }
.guide-step p { margin: 0; color: var(--muted); line-height: 1.6; }

/* Mistakes */
.guide-mistakes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.guide-mistakes article { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 14px; padding: 21px; border: 1px solid #ead2d7; border-radius: 18px; background: #fff5f6; }
.guide-mistakes article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--coral); font-size: 1.2rem; font-weight: 900; }
.guide-mistakes h3 { margin: 0 0 6px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.15rem; line-height: 1.2; }
.guide-mistakes p { margin: 0; color: var(--muted); line-height: 1.55; }

/* Guide FAQ */
.guide-faq__list { display: grid; gap: 12px; }
.guide-faq details { overflow: hidden; border: 2px solid #d9e5ec; border-radius: 17px; background: var(--paper); box-shadow: 0 4px 0 rgba(39, 121, 184, 0.09); }
.guide-faq summary { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 20px; color: var(--navy); cursor: pointer; font-weight: 850; line-height: 1.4; list-style: none; }
.guide-faq summary::-webkit-details-marker { display: none; }
.guide-faq summary::after { content: "+"; width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border: 2px solid var(--blue); border-radius: 50%; color: var(--blue); font-size: 1.35rem; line-height: 1; }
.guide-faq details[open] { border-color: var(--blue); }
.guide-faq details[open] summary { color: #fff; background: var(--blue); }
.guide-faq details[open] summary::after { content: "−"; color: #fff; border-color: #fff; }
.guide-faq details > div { padding: 20px 22px 23px; }
.guide-faq details p { margin: 0; color: var(--muted); line-height: 1.7; }

/* Source note */
.guide-source-note { margin-top: 50px; padding: 25px; border: 1px solid var(--line); border-radius: 20px; background: #f8faf9; }
.guide-source-note h2 { margin: 0 0 9px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.45rem; }
.guide-source-note p { margin: 0; color: var(--muted); line-height: 1.65; }
.guide-source-note a { display: inline-flex; gap: 6px; margin-top: 14px; color: var(--blue); font-weight: 800; }

/* Related guides */
.guide-related { margin-top: 70px; padding-top: 44px; border-top: 1px solid var(--line); }
.guide-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.guide-related__grid > a { display: flex; min-width: 0; flex-direction: column; padding: 24px; border: 1px solid var(--line); border-radius: 21px; color: inherit; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.07); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.guide-related__grid > a:hover, .guide-related__grid > a:focus-visible { border-color: var(--sky); box-shadow: 0 16px 35px rgba(24, 35, 74, 0.12); transform: translateY(-2px); }
.guide-related__category { margin-bottom: 11px; color: var(--coral); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.guide-related__grid strong { color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.4rem; line-height: 1.15; }
.guide-related__grid strong + span { margin-top: 12px; color: var(--muted); line-height: 1.55; }

/* Bottom CTA */
.guide-cta { display: flex; align-items: center; justify-content: space-between; gap: 34px; margin-top: 48px; padding: clamp(28px, 4vw, 44px); border-radius: 26px; color: #fff; background: radial-gradient(circle at 92% 8%, rgba(255, 255, 255, 0.17), transparent 230px), linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 16px 38px rgba(16, 38, 91, 0.2); }
.guide-cta > div:first-child { max-width: 100%; }
.guide-cta .eyebrow { color: var(--gold); }
.guide-cta h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4.5vw, 3.3rem); line-height: 1; letter-spacing: -0.035em; }
.guide-cta p { margin: 15px 0 0; color: #e9f5ff; line-height: 1.65; }
.guide-cta__links { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.guide-cta__links a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 1px solid rgba(255, 255, 255, 0.72); border-radius: 999px; color: #fff; background: rgba(255, 255, 255, 0.08); font-weight: 800; text-decoration: none; }
.guide-cta__links a:hover, .guide-cta__links a:focus-visible { color: var(--navy); background: #fff; border-color: #fff; }
.guide-cta__links .guide-cta__primary { color: var(--navy); background: var(--gold); border-color: var(--gold); }

/* Responsive */
@media (max-width:960px) {
    .guide-glance { grid-template-columns: 1fr; }
    .guide-layout { grid-template-columns: 1fr; }
    .guide-toc { position: static; }
    .guide-toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 22px; }
    .guide-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .guide-cta { align-items: flex-start; flex-direction: column; }
    .guide-cta__links { justify-content: flex-start; }
}
@media (max-width:720px) {
    .guide-page { width: min(100% - 24px, 1180px); padding: 24px 0 50px; }
    .guide-glance__details, .guide-plan-grid, .guide-two-column, .guide-mistakes, .guide-takeaways ul, .guide-related__grid { grid-template-columns: 1fr; }
    .guide-toc ol { grid-template-columns: 1fr; }
    .guide-credit-card { grid-template-columns: 1fr; }
    .guide-credit-card__icon { width: 48px; height: 48px; }
    .guide-cta__links { width: 100%; flex-direction: column; }
    .guide-cta__links a { width: 100%; }
}
@media (max-width:520px) {
    .guide-glance, .guide-introduction, .guide-takeaways, .guide-plan-card, .guide-credit-card, .guide-list-card, .guide-step, .guide-related__grid > a, .guide-cta { padding: 22px; border-radius: 19px; }
    .guide-hero__meta { display: grid; grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion:reduce) {
    .guide-related__grid > a { transition: none; }
}
/* =========================================================
   Guide layout and automatic table of contents
   ========================================================= */
.guide-layout { display: grid; grid-template-columns: minmax(230px, 280px)
minmax(0, 1fr); gap: clamp(30px, 5vw, 60px); align-items: start; }

/*
 * Sticky must be applied to the inner TOC rather than the
 * entire grid column.
 */
.guide-sidebar { min-width: 0; align-self: stretch; }

/*
 * Adjust this value if your header later becomes fixed.
 *
 * Current header:
 *     top: 24px;
 *
 * Fixed header around 86px tall:
 *     top: 110px;
 */
.guide-toc { position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 10px 28px rgba(24, 35, 74, 0.07); }
.guide-toc__heading { padding: 22px 22px 15px; border-bottom: 1px solid var(--line); }
.guide-toc__heading .eyebrow { margin: 0; }
.guide-toc__toggle { display: none; }
.guide-toc__list { max-height: calc(100vh - 130px); overflow-y: auto; overscroll-behavior: contain; margin: 0; padding: 7px 15px 15px; list-style: none; counter-reset: guide-toc; scrollbar-width: thin; scrollbar-color: var(--sky) transparent; }
.guide-toc__list::-webkit-scrollbar { width: 7px; }
.guide-toc__list::-webkit-scrollbar-track { background: transparent; }
.guide-toc__list::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--sky); }
.guide-toc__item { counter-increment: guide-toc; border-bottom: 1px solid var(--line); }
.guide-toc__item:last-child { border-bottom: 0; }
.guide-toc__link { position: relative; display: block; padding: 12px 8px 12px 36px; border-radius: 10px; color: var(--navy); font-size: 0.82rem; font-weight: 700; line-height: 1.4; text-decoration: none; transition: color 160ms ease, background-color 160ms ease, padding-left 160ms ease; }
.guide-toc__link::before { content: counter(guide-toc, decimal-leading-zero); position: absolute; top: 13px; left: 8px; color: var(--coral); font-size: 0.66rem; font-weight: 900; letter-spacing: 0.02em; }
.guide-toc__link:hover, .guide-toc__link:focus-visible { color: var(--blue); background: rgba(130, 201, 232, 0.15); }
.guide-toc__link:focus-visible { outline: 3px solid var(--gold); outline-offset: 1px; }

/* Active section */
.guide-toc__link.is-active { padding-left: 40px; color: #fff; background: linear-gradient(135deg, var(--navy), #285d9d); box-shadow: 0 5px 14px rgba(16, 38, 91, 0.16); }
.guide-toc__link.is-active::before { color: var(--gold); }
.guide-toc__link.is-active::after { content: ""; position: absolute; top: 50%; left: 25px; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); transform: translateY(-50%); }

/*
 * Scroll destination spacing.
 *
 * Increase this if a fixed header would otherwise cover
 * the section heading.
 */
.guide-section, .guide-takeaways, .guide-source-note, .guide-faq { scroll-margin-top: 32px; }

/* Optional completion state for sections above the active one */
.guide-toc__link.is-passed { color: var(--muted); }
.guide-toc__link.is-passed::before { content: "✓"; color: var(--blue); font-size: 0.78rem; }

/* =========================================================
   Tablet
   ========================================================= */
@media (max-width:960px) {
    .guide-layout { grid-template-columns: 1fr; gap: 30px; }
    .guide-sidebar { position: relative; z-index: 10; }
    .guide-toc { position: static; max-height: none; overflow: visible; }
    .guide-toc__heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 19px; border-bottom: 0; }
    .guide-toc__toggle { display: inline-flex; align-items: center; gap: 9px; min-height: 40px; padding: 8px 13px; border: 1px solid var(--blue); border-radius: 999px; color: var(--navy); background: #fff; font: inherit; font-size: 0.78rem; font-weight: 800; cursor: pointer; }
    .guide-toc__toggle:hover, .guide-toc__toggle:focus-visible { color: #fff; background: var(--blue); }
    .guide-toc__toggle:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
    .guide-toc__toggle span:last-child { font-size: 1.2rem; line-height: 1; }
    .guide-toc__list { display: none; max-height: none; overflow: visible; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; padding: 5px 18px 18px; border-top: 1px solid var(--line); }
    .guide-toc.is-open .guide-toc__list { display: grid; }
}

/* =========================================================
   Mobile
   ========================================================= */
@media (max-width:640px) {
    .guide-toc { border-radius: 16px; }
    .guide-toc__heading { align-items: flex-start; flex-direction: column; gap: 11px; }
    .guide-toc__toggle { width: 100%; justify-content: space-between; }
    .guide-toc__list { grid-template-columns: 1fr; }
    .guide-toc__link { font-size: 0.85rem; }
}
@media (prefers-reduced-motion:reduce) {
    .guide-toc__link { transition: none; }
}


/* =========================================================
   Restaurant guide recommendation cards
   ========================================================= */
.guide-restaurant-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.guide-restaurant-card { display: flex; min-width: 0; flex-direction: column; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 11px 30px rgba(24, 35, 74, 0.08); }
.guide-restaurant-card__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.guide-restaurant-card__heading > div { min-width: 0; }
.guide-restaurant-card__heading .eyebrow { margin-bottom: 7px; }
.guide-restaurant-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 3vw, 1.7rem); line-height: 1.1; }
.guide-restaurant-card h3 a { color: inherit; text-decoration: none; }
.guide-restaurant-card h3 a:hover, .guide-restaurant-card h3 a:focus-visible { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.guide-restaurant-card__service { flex: 0 0 auto; max-width: 145px; padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.68rem; font-weight: 850; line-height: 1.3; text-align: center; }
.guide-restaurant-card > p { margin: 0; color: var(--muted); line-height: 1.65; }
.guide-restaurant-card > p + p { margin-top: 13px; }
.guide-restaurant-card__best { padding-top: 13px; border-top: 1px solid var(--line); }
.guide-restaurant-card__best strong { color: var(--navy); }
.guide-restaurant-card__note { padding: 12px 14px; border-left: 4px solid var(--gold); border-radius: 0 12px 12px 0; color: #554525 !important; background: #fff6df; font-size: 0.84rem; }
.guide-restaurant-card__note strong { color: var(--navy); }
.guide-restaurant-card__link { display: inline-flex; align-items: center; gap: 7px; align-self: flex-start; margin-top: auto; padding-top: 20px; color: var(--blue); font-weight: 850; text-decoration: none; }
.guide-restaurant-card__link:hover, .guide-restaurant-card__link:focus-visible { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* Give consecutive restaurant sections consistent spacing */
.guide-section + .guide-section { margin-top: clamp(48px, 7vw, 76px); }

/* =========================================================
   Responsive restaurant cards
   ========================================================= */
@media (max-width:780px) {
    .guide-restaurant-grid { grid-template-columns: 1fr; }
}
@media (max-width:540px) {
    .guide-restaurant-card { padding: 19px; border-radius: 17px; }
    .guide-restaurant-card__heading { flex-direction: column; gap: 11px; }
    .guide-restaurant-card__service { max-width: none; align-self: flex-start; }
}


```css
/* =========================================================
   Food Guide modules
   ========================================================= */

/* Quick-pick cards */
.food-guide-picks__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 25px; }
.food-guide-pick { position: relative; display: flex; min-width: 0; min-height: 190px; flex-direction: column; padding: 23px; border: 1px solid var(--line); border-radius: 20px; color: inherit; background: var(--paper); box-shadow: 0 11px 30px rgba(24, 35, 74, 0.08); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.food-guide-pick:hover, .food-guide-pick:focus-visible { border-color: var(--sky); box-shadow: 0 16px 35px rgba(24, 35, 74, 0.13); transform: translateY(-2px); }
.food-guide-pick:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.food-guide-pick--primary { color: #fff; border-color: var(--navy); background: radial-gradient(circle at 95% 5%, rgba(255, 255, 255, 0.16), transparent 180px), linear-gradient(145deg, var(--navy), #285d9d); }
.food-guide-pick__rank { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.2rem; font-weight: 900; }
.food-guide-pick__badge { align-self: flex-start; margin-bottom: 10px; padding: 5px 9px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.67rem; font-weight: 850; letter-spacing: 0.04em; text-transform: uppercase; }
.food-guide-pick--primary .food-guide-pick__badge { background: var(--gold); }
.food-guide-pick strong { color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; line-height: 1.1; }
.food-guide-pick--primary strong { color: #fff; }
.food-guide-pick > span:last-child { margin-top: 10px; color: var(--muted); line-height: 1.55; }
.food-guide-pick--primary > span:last-child { color: #e9f5ff; }

/* Comparison table */
.food-guide-table-wrap { overflow-x: auto; margin-top: 25px; border: 1px solid var(--line); border-radius: 19px; background: var(--paper); box-shadow: 0 10px 28px rgba(24, 35, 74, 0.07); }
.food-guide-table { width: 100%; border-collapse: collapse; text-align: left; }
.food-guide-table th, .food-guide-table td { padding: 15px 17px; border-bottom: 1px solid var(--line); vertical-align: top; }
.food-guide-table thead th { color: #fff; background: var(--navy); font-size: 0.76rem; letter-spacing: 0.04em; text-transform: uppercase; }
.food-guide-table tbody th { color: var(--navy); font-weight: 850; }
.food-guide-table tbody tr:last-child th, .food-guide-table tbody tr:last-child td { border-bottom: 0; }
.food-guide-table tbody tr:nth-child(even) { background: #f7fafc; }
.food-guide-table a { color: var(--blue); text-decoration: none; }
.food-guide-table a:hover, .food-guide-table a:focus-visible { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* Ranked recommendation cards */
.food-guide-ranking { display: grid; gap: 20px; margin-top: 25px; }
.food-guide-ranked-card { display: grid; grid-template-columns: 76px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 12px 32px rgba(24, 35, 74, 0.08); }
.food-guide-ranked-card__rank { display: flex; justify-content: center; padding-top: 24px; background: linear-gradient(180deg, var(--navy), #285d9d); }
.food-guide-ranked-card__rank span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.3rem; font-weight: 900; }
.food-guide-ranked-card__body { min-width: 0; padding: 25px; }
.food-guide-ranked-card__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.food-guide-ranked-card__heading > div:first-child { min-width: 0; }
.food-guide-ranked-card h3 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.55rem, 3vw, 2rem); line-height: 1.08; }
.food-guide-ranked-card h3 a { color: inherit; text-decoration: none; }
.food-guide-ranked-card h3 a:hover, .food-guide-ranked-card h3 a:focus-visible { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.food-guide-ranked-card__badges { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.food-guide-badge { padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.67rem; font-weight: 850; line-height: 1.25; }
.food-guide-badge--editor { background: var(--gold); }
.food-guide-ranked-card__body > p { margin: 16px 0 0; color: var(--muted); line-height: 1.67; }
.food-guide-ranked-card__details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-top: 20px; }
.food-guide-ranked-card__details p { margin: 0; padding: 14px; border-radius: 14px; color: var(--muted); background: #f3f7fa; font-size: 0.83rem; line-height: 1.55; }
.food-guide-ranked-card__details strong { display: block; margin-bottom: 4px; color: var(--navy); }
.food-guide-ranked-card__link { display: inline-flex; align-items: center; gap: 7px; margin-top: 21px; color: var(--blue); font-weight: 850; text-decoration: none; }
.food-guide-ranked-card__link:hover, .food-guide-ranked-card__link:focus-visible { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }

/* Honorable mentions */
.food-guide-mentions__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 24px; }
.food-guide-mention { display: flex; min-width: 0; flex-direction: column; padding: 21px; border: 1px solid var(--line); border-radius: 18px; color: inherit; background: var(--paper); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.food-guide-mention:hover, .food-guide-mention:focus-visible { border-color: var(--sky); box-shadow: 0 12px 28px rgba(24, 35, 74, 0.11); transform: translateY(-2px); }
.food-guide-mention > span:first-child { color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.food-guide-mention strong { margin-top: 7px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.2rem; line-height: 1.12; }
.food-guide-mention p { margin: 11px 0 0; color: var(--muted); line-height: 1.55; }
.food-guide-mention__link { display: inline-flex; gap: 6px; margin-top: auto; padding-top: 17px; color: var(--blue); font-weight: 850; }

/* Responsive */
@media (max-width:900px) {
   .food-guide-picks__grid, .food-guide-mentions__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
   .food-guide-ranked-card__details { grid-template-columns: 1fr; }
}
@media (max-width:700px) {
   .food-guide-picks__grid, .food-guide-mentions__grid { grid-template-columns: 1fr; }
   .food-guide-ranked-card { grid-template-columns: 1fr; }
   .food-guide-ranked-card__rank { justify-content: flex-start; padding: 17px 20px; }
   .food-guide-ranked-card__body { padding: 21px; }
   .food-guide-ranked-card__heading { flex-direction: column; gap: 13px; }
   .food-guide-ranked-card__badges { justify-content: flex-start; }
}
@media (max-width:520px) {
   .food-guide-table th, .food-guide-table td { padding: 13px; }
}
@media (prefers-reduced-motion:reduce) {
   .food-guide-pick, .food-guide-mention { transition: none; }
}


/* =========================================================
   Collapsible restaurant menu
   ========================================================= */
.restaurant-menu { position: relative; overflow: hidden; }
.restaurant-menu::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }
.restaurant-menu__collapsible { position: relative; overflow: hidden; max-height: 300px; transition: max-height 350ms ease; }
.restaurant-menu__collapsible.is-expanded { max-height: none; overflow: visible; }

/*
 * The content remains in the document. Only its visible
 * container is limited while collapsed.
 */
.restaurant-menu__content { position: relative; }

/*
 * Bottom fade signals that more menu content is available.
 */
.restaurant-menu__fade { position: absolute; right: 0; bottom: 0; left: 0; height: 115px; pointer-events: none; background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9) 58%, var(--paper) 100%); transition: opacity 180ms ease, visibility 180ms ease; }
.restaurant-menu__collapsible.is-expanded
.restaurant-menu__fade { opacity: 0; visibility: hidden; }
.restaurant-menu__toggle { position: relative; z-index: 2; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; margin: 18px auto 0; padding: 11px 20px; border: 0; border-radius: 999px; color: #fff; background: var(--blue); box-shadow: 0 8px 20px rgba(24, 35, 74, 0.16); font: inherit; font-weight: 850; cursor: pointer; transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-menu__toggle:hover { background: var(--navy); box-shadow: 0 11px 25px rgba(24, 35, 74, 0.2); transform: translateY(-1px); }
.restaurant-menu__toggle:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.restaurant-menu__toggle-icon { display: inline-block; font-size: 1rem; transition: transform 220ms ease; }
.restaurant-menu__toggle[aria-expanded="true"]
.restaurant-menu__toggle-icon { transform: rotate(180deg); }

/*
 * Hide the control when the full menu is already shorter than
 * the collapsed height.
 */
.restaurant-menu__toggle[hidden], .restaurant-menu__fade[hidden] { display: none; }
@media (max-width:600px) {
   .restaurant-menu__collapsible { max-height: 280px; }
   .restaurant-menu__fade { height: 100px; }
   .restaurant-menu__toggle { width: 100%; max-width: 260px; }
}
@media (prefers-reduced-motion:reduce) {
   .restaurant-menu__collapsible, .restaurant-menu__fade, .restaurant-menu__toggle, .restaurant-menu__toggle-icon { transition: none; }
}
/* =========================================================
   Restaurant before-you-visit callout
   ========================================================= */
.restaurant-before-visit { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: clamp(18px, 3vw, 26px); overflow: hidden; margin-top: clamp(30px, 5vw, 48px); padding: clamp(24px, 4vw, 36px); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 22px; color: #fff; background: radial-gradient(circle at 100% 0, rgba(255, 255, 255, 0.15), transparent 240px), linear-gradient(145deg, var(--navy), var(--blue)); box-shadow: 0 14px 34px rgba(24, 35, 74, 0.18); }
.restaurant-before-visit::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--sky), var(--gold)); }
.restaurant-before-visit__icon { width: 52px; height: 52px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 50%; color: var(--navy); background: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.65rem; font-weight: 900; line-height: 1; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16); }
.restaurant-before-visit__content { min-width: 0; }
.restaurant-before-visit .eyebrow { margin: 0 0 7px; color: #d8efff; }
.restaurant-before-visit h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.45rem, 3vw, 1.9rem); line-height: 1.12; }
.restaurant-before-visit__content > p:last-child { max-width: 760px; margin: 14px 0 0; color: #eaf6ff; line-height: 1.7; }
@media (max-width:560px) {
   .restaurant-before-visit { grid-template-columns: 1fr; gap: 16px; padding: 22px; border-radius: 18px; }
   .restaurant-before-visit__icon { width: 46px; height: 46px; font-size: 1.4rem; }
}

/* =========================================================
   Restaurant page: Featured In
   ========================================================= */
.restaurant-featured-in { margin-top: clamp(38px, 6vw, 68px); padding: clamp(24px, 4vw, 38px); border: 1px solid var(--line); border-radius: 24px; background: radial-gradient(circle at 100% 0, rgba(131, 198, 235, 0.18), transparent 260px), var(--paper); box-shadow: 0 14px 36px rgba(24, 35, 74, 0.08); }
.restaurant-featured-in__heading { max-width: 720px; }
.restaurant-featured-in__heading h2 { margin: 5px 0 0; color: var(--navy); }
.restaurant-featured-in__heading > p:last-child { margin: 12px 0 0; color: var(--muted); line-height: 1.65; }
.restaurant-featured-in__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 24px; }
.restaurant-featured-in__card { display: flex; min-width: 0; min-height: 150px; flex-direction: column; padding: 20px; border: 1px solid var(--line); border-radius: 18px; color: inherit; background: #fff; text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-featured-in__card:hover, .restaurant-featured-in__card:focus-visible { border-color: var(--sky); box-shadow: 0 12px 28px rgba(24, 35, 74, 0.12); transform: translateY(-2px); }
.restaurant-featured-in__card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.restaurant-featured-in__category { color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.restaurant-featured-in__card strong { margin-top: 8px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.18rem; line-height: 1.15; }
.restaurant-featured-in__badge { align-self: flex-start; margin-top: auto; padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.68rem; font-weight: 850; }
@media (max-width:850px) {
    .restaurant-featured-in__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px) {
    .restaurant-featured-in { padding: 20px; border-radius: 19px; }
    .restaurant-featured-in__grid { grid-template-columns: 1fr; }
    .restaurant-featured-in__card { min-height: 0; }
    .restaurant-featured-in__badge { margin-top: 16px; }
}
@media (prefers-reduced-motion:reduce) {
    .restaurant-featured-in__card { transition: none; }
}

/* =========================================================
   Restaurant page: Featured In
   ========================================================= */
.restaurant-featured-in { margin-top: clamp(38px, 6vw, 68px); padding: clamp(24px, 4vw, 38px); border: 1px solid var(--line); border-radius: 24px; background: radial-gradient(circle at 100% 0, rgba(131, 198, 235, 0.18), transparent 260px), var(--paper); box-shadow: 0 14px 36px rgba(24, 35, 74, 0.08); }
.restaurant-featured-in__heading { max-width: 720px; }
.restaurant-featured-in__heading h2 { margin: 5px 0 0; color: var(--navy); }
.restaurant-featured-in__heading > p:last-child { margin: 12px 0 0; color: var(--muted); line-height: 1.65; }
.restaurant-featured-in__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 24px; }
.restaurant-featured-in__card { display: flex; min-width: 0; min-height: 150px; flex-direction: column; padding: 20px; border: 1px solid var(--line); border-radius: 18px; color: inherit; background: #fff; text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-featured-in__card:hover, .restaurant-featured-in__card:focus-visible { border-color: var(--sky); box-shadow: 0 12px 28px rgba(24, 35, 74, 0.12); transform: translateY(-2px); }
.restaurant-featured-in__card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.restaurant-featured-in__category { color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.restaurant-featured-in__card strong { margin-top: 8px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.18rem; line-height: 1.15; }
.restaurant-featured-in__badge { align-self: flex-start; margin-top: auto; padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.68rem; font-weight: 850; }
@media (max-width:850px) {
   .restaurant-featured-in__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px) {
   .restaurant-featured-in { padding: 20px; border-radius: 19px; }
   .restaurant-featured-in__grid { grid-template-columns: 1fr; }
   .restaurant-featured-in__card { min-height: 0; }
   .restaurant-featured-in__badge { margin-top: 16px; }
}
@media (prefers-reduced-motion:reduce) {
   .restaurant-featured-in__card { transition: none; }
}

/* =========================================================
   Restaurant page knowledge hubs
   ========================================================= */
.restaurant-hub { position: relative; overflow: hidden; margin-top: clamp(36px, 6vw, 64px); padding: clamp(24px, 4vw, 38px); border: 1px solid var(--line); border-radius: 24px; background: radial-gradient(circle at 100% 0, rgba(131, 198, 235, 0.17), transparent 250px), var(--paper); box-shadow: 0 14px 36px rgba(24, 35, 74, 0.08); }
.restaurant-hub::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }
.restaurant-hub__heading { max-width: 720px; }
.restaurant-hub__heading h2 { margin: 5px 0 0; color: var(--navy); }
.restaurant-hub__heading > p:last-child { margin: 12px 0 0; color: var(--muted); line-height: 1.65; }
.restaurant-hub__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 24px; }
.restaurant-hub-card { display: flex; min-width: 0; min-height: 155px; flex-direction: column; padding: 20px; border: 1px solid var(--line); border-radius: 18px; color: inherit; background: #fff; text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.restaurant-hub-card:hover, .restaurant-hub-card:focus-visible { border-color: var(--sky); box-shadow: 0 12px 28px rgba(24, 35, 74, 0.12); transform: translateY(-2px); }
.restaurant-hub-card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.restaurant-hub-card__eyebrow { color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.restaurant-hub-card strong { margin-top: 8px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.18rem; line-height: 1.15; }
.restaurant-hub-card__meta { margin-top: 10px; color: var(--muted); font-size: 0.82rem; line-height: 1.4; }
.restaurant-hub-card__badge { align-self: flex-start; margin-top: auto; padding: 6px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.68rem; font-weight: 850; }
.restaurant-hub-card__link { margin-top: auto; padding-top: 16px; color: var(--blue); font-weight: 850; }
@media (max-width:850px) {
    .restaurant-hub__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px) {
    .restaurant-hub { padding: 20px; border-radius: 19px; }
    .restaurant-hub__grid { grid-template-columns: 1fr; }
    .restaurant-hub-card { min-height: 0; }
    .restaurant-hub-card__badge, .restaurant-hub-card__link { margin-top: 16px; }
}
@media (prefers-reduced-motion:reduce) {
    .restaurant-hub-card { transition: none; }
}

/* =========================================================
   Restaurant supporting content
   ========================================================= */
.sidebar { display: grid; align-content: start; gap: clamp(22px, 4vw, 32px); }
/*
 * Shared visual treatment
 */
.sidebar-section { position: relative; overflow: hidden; padding: clamp(22px, 4vw, 32px); border: 1px solid var(--line); border-radius: 21px; background: var(--paper); box-shadow: 0 12px 30px rgba(24, 35, 74, 0.08); }
/*
 * Colored top accents
 */
.sidebar-section::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }
/*
 * Give each sidebar card a subtle variation while keeping
 * the shared design system.
 */
.sidebar-section--details::before { background: linear-gradient(90deg, var(--blue), var(--sky)); }
.sidebar-section--explore::before { background: linear-gradient(90deg, var(--coral), var(--gold)); }
/* =========================================================
   Shared headings
   ========================================================= */
.sidebar-section .eyebrow { margin: 0 0 7px; }
.sidebar-section h2 { margin: 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.35rem, 2.5vw, 1.7rem); line-height: 1.12; }
/*.restaurant-before-visit > p:last-child { margin: 14px 0 0; color: var(--muted); line-height: 1.7; }*/

/* =========================================================
   Restaurant Details
   ========================================================= */
.sidebar-details { display: grid; gap: 0; margin: 20px 0 0; padding: 0; list-style: none; }
.sidebar-details li { display: grid; gap: 6px; padding: 15px 0; border-top: 1px solid var(--line); }
.sidebar-details li:first-child { padding-top: 0; border-top: 0; }
.sidebar-details li:last-child { padding-bottom: 0; }
.sidebar-details strong { color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.sidebar-details span { color: var(--navy); font-weight: 750; line-height: 1.5; overflow-wrap: anywhere; }

/* =========================================================
   Explore More
   ========================================================= */
.sidebar-links { display: grid; gap: 11px; margin: 20px 0 0; padding: 0; list-style: none; }
.sidebar-links li { margin: 0; }
.sidebar-links a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; color: var(--navy); background: #fff; font-weight: 800; line-height: 1.4; text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease; }
.sidebar-links a:hover, .sidebar-links a:focus-visible { border-color: var(--sky); color: var(--blue); box-shadow: 0 9px 22px rgba(24, 35, 74, 0.11); transform: translateY(-1px); }
.sidebar-links a:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.sidebar-links a > span:first-child { min-width: 0; }
.sidebar-links a > span:last-child { flex: 0 0 auto; color: var(--blue); font-size: 1.05rem; }

/* =========================================================
Layout spacing
========================================================= */
.restaurant-before-visit { margin-top: clamp(30px, 5vw, 48px); margin-bottom: clamp(30px, 5vw, 48px); }

/*
 * This protects against older sidebar rules that may add
 * margins directly to each section.
 */
.sidebar .sidebar-section { margin: 0; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:700px) {
   .sidebar { gap: 20px; }
   .restaurant-before-visit, .sidebar-section { padding: 21px; border-radius: 18px; }
}
@media (prefers-reduced-motion:reduce) {
   .sidebar-links a { transition: none; }
}


/* =========================================================
   Guide restaurant spotlights
   ========================================================= */
.restaurant-spotlight-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 18px; margin-top: 26px; }
.restaurant-spotlight { position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden; padding: clamp(22px, 4vw, 30px); border: 1px solid var(--line); border-radius: 22px; background: radial-gradient(circle at 100% 0, rgba(131, 198, 235, 0.14), transparent 230px), var(--paper); box-shadow: 0 13px 32px rgba(24, 35, 74, 0.09); }

/*
 * Shared colored accent used throughout DDP Guide.
 */
.restaurant-spotlight::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }

/* =========================================================
   Header
   ========================================================= */
.restaurant-spotlight__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.restaurant-spotlight__header > div { min-width: 0; }
.restaurant-spotlight__header .eyebrow { margin: 0 0 7px; }
.restaurant-spotlight__header h3 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.45rem, 3vw, 1.85rem); line-height: 1.08; }
.restaurant-spotlight__header h3 a { color: var(--navy); text-decoration: none; }
.restaurant-spotlight__header h3 a:hover { color: var(--blue); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.restaurant-spotlight__header h3 a:focus-visible { border-radius: 4px; outline: 3px solid var(--gold); outline-offset: 4px; }
.restaurant-spotlight__type { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; color: var(--navy); background: var(--lavender); font-size: 0.67rem; font-weight: 850; line-height: 1.2; text-align: center; }

/* =========================================================
   Description and chips
   ========================================================= */
.restaurant-spotlight__summary { margin: 17px 0 0; color: var(--muted); line-height: 1.68; }
.restaurant-spotlight__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.restaurant-spotlight__chips span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--navy); background: #fff; font-size: 0.7rem; font-weight: 800; }

/* =========================================================
   Ratings
   ========================================================= */
.restaurant-spotlight__ratings { display: grid; gap: 15px; margin-top: 24px; padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255, 255, 255, 0.72); }
.restaurant-spotlight__rating { display: grid; gap: 9px; }
.restaurant-spotlight__rating > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.restaurant-spotlight__rating strong { color: var(--navy); font-size: 0.8rem; }
.restaurant-spotlight__rating > div:first-child span { color: var(--muted); font-size: 0.72rem; font-weight: 750; }
.restaurant-spotlight__meter { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
.restaurant-spotlight__meter span { height: 6px; border-radius: 999px; background: #dbe4ea; }
.restaurant-spotlight__meter span.is-filled { background: linear-gradient(90deg, var(--blue), var(--sky)); }

/* =========================================================
   Recommendation highlights
   ========================================================= */
.restaurant-spotlight__highlights { margin-top: 22px; }
.restaurant-spotlight__label { margin: 0; color: var(--coral); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
.restaurant-spotlight__highlights ul { display: grid; gap: 10px; margin: 13px 0 0; padding: 0; list-style: none; }
.restaurant-spotlight__highlights li { position: relative; padding-left: 27px; color: var(--muted); line-height: 1.52; }
.restaurant-spotlight__highlights li::before { content: "✓"; position: absolute; top: 1px; left: 0; width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-size: 0.68rem; font-weight: 900; }

/* =========================================================
   Footer
   ========================================================= */
.restaurant-spotlight__footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-top: auto; padding-top: 26px; }
.restaurant-spotlight__price { display: grid; gap: 4px; }
.restaurant-spotlight__price span { color: var(--muted); font-size: 0.68rem; font-weight: 750; }
.restaurant-spotlight__price strong { color: var(--navy); letter-spacing: 0.08em; }
.restaurant-spotlight__link { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--blue); font-weight: 850; line-height: 1.35; text-align: right; text-decoration: none; }
.restaurant-spotlight__link:hover { color: var(--navy); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.restaurant-spotlight__link:focus-visible { border-radius: 4px; outline: 3px solid var(--gold); outline-offset: 4px; }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:900px) {
   .restaurant-spotlight-grid { grid-template-columns: 1fr; }
}
@media (max-width:580px) {
   .restaurant-spotlight { padding: 21px; border-radius: 18px; }
   .restaurant-spotlight__header { flex-direction: column; gap: 13px; }
   .restaurant-spotlight__type { align-self: flex-start; }
   .restaurant-spotlight__rating
   > div:first-child { align-items: flex-start; flex-direction: column; gap: 3px; }
   .restaurant-spotlight__footer { align-items: flex-start; flex-direction: column; }
   .restaurant-spotlight__link { justify-content: flex-start; text-align: left; }
}
@media (prefers-reduced-motion:reduce) {
   .restaurant-spotlight, .restaurant-spotlight__header h3 a, .restaurant-spotlight__link { transition: none; }
}
.guide-comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.guide-comparison-card { position: relative; overflow: hidden; padding: clamp(22px, 4vw, 30px); border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 13px 32px rgba(24, 35, 74, 0.09); }
.guide-comparison-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }
.guide-comparison-card h3 { margin: 6px 0 0; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.4rem, 3vw, 1.8rem); }
.guide-comparison-card ul { display: grid; gap: 9px; margin: 20px 0 0; padding-left: 20px; color: var(--muted); }
.guide-comparison-card > p:last-child { margin: 22px 0 0; color: var(--muted); line-height: 1.65; }
@media (max-width:760px) {
   .guide-comparison-grid { grid-template-columns: 1fr; }
}
/* Monorail vacation-guide route */
.guide-route { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: 12px; margin-top: 25px; }
.guide-route > a { position: relative; display: flex; min-width: 0; min-height: 170px; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 19px; color: inherit; background: var(--paper); box-shadow: 0 11px 28px rgba(24, 35, 74, 0.08); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.guide-route > a::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; border-radius: 19px 19px 0 0; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)); }
.guide-route > a:hover, .guide-route > a:focus-visible { border-color: var(--sky); box-shadow: 0 15px 32px rgba(24, 35, 74, 0.13); transform: translateY(-2px); }
.guide-route > a:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.guide-route > a > span:first-child { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--gold); font-weight: 900; }
.guide-route strong { margin-top: 16px; color: var(--navy); font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; line-height: 1.15; }
.guide-route small { margin-top: 8px; color: var(--muted); font-size: 0.82rem; line-height: 1.5; }
.guide-route__connector { display: grid; place-items: center; color: var(--blue); font-size: 1.4rem; font-weight: 900; }
@media (max-width:850px) {
   .guide-route { grid-template-columns: 1fr; }
   .guide-route__connector { transform: rotate(90deg); }
   .guide-route > a { min-height: 0; }
}
@media (prefers-reduced-motion:reduce) {
   .guide-route > a { transition: none; }


/* Restaurant directory */
.restaurant-directory { width: min(1180px, calc(100% - 36px)); margin: 0 auto; padding: 28px 0 70px }
.restaurant-directory-hero__stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 26px }
.restaurant-directory-hero__stats>div { display: grid; gap: 3px; padding: 14px 16px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 16px; background: rgba(255, 255, 255, .12) }
.restaurant-directory-hero__stats strong { font-size: 1.3rem }
.restaurant-directory-hero__stats span { font-size: .76rem; font-weight: 700 }
.restaurant-directory__intro { display: flex; justify-content: space-between; gap: 28px; margin-top: 26px }
.restaurant-directory__intro>div:first-child { max-width: 760px }
.restaurant-directory__updated { display: grid; align-content: start; gap: 4px; min-width: 180px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper) }
.restaurant-directory__updated span { color: var(--muted); font-size: .72rem; font-weight: 700 }
.restaurant-directory-controls { display: grid; gap: 22px; margin-top: 30px; padding: clamp(20px, 4vw, 28px); border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 12px 30px rgba(24, 35, 74, .08) }
.restaurant-directory-controls__group .eyebrow { margin-bottom: 10px }
.restaurant-directory-filters { display: flex; flex-wrap: wrap; gap: 8px }
.restaurant-directory-filters button { padding: 9px 13px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--navy); font: inherit; font-size: .76rem; font-weight: 800; cursor: pointer }
.restaurant-directory-filters button:hover, .restaurant-directory-filters button.active { border-color: var(--blue); background: var(--blue); color: #fff }
.restaurant-directory-search { display: grid; gap: 8px }
.restaurant-directory-search label { color: var(--navy); font-size: .78rem; font-weight: 800 }
.restaurant-directory-search input { width: 100%; padding: 13px 15px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: var(--ink); font: inherit }
.restaurant-directory-status { margin-top: 20px; color: var(--muted) }
.restaurant-directory-alpha { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px }
.restaurant-directory-alpha a { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--navy); font-size: .78rem; font-weight: 850; text-decoration: none }
.restaurant-directory-alpha a:hover { border-color: var(--blue); color: var(--blue) }
.restaurant-directory-list { display: grid; gap: 36px; margin-top: 30px }
.restaurant-directory-letter-group { scroll-margin-top: 30px }
.restaurant-directory-letter-group__heading { display: flex; align-items: center; gap: 13px; margin-bottom: 16px }
.restaurant-directory-letter-group__heading>span { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border-radius: 13px; background: var(--navy); color: #fff; font-weight: 900 }
.restaurant-directory-letter-group__heading h2 { margin: 0 }
.restaurant-directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px }
.restaurant-directory-card { position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden; padding: 21px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: 0 10px 26px rgba(24, 35, 74, .07) }
.restaurant-directory-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--blue), var(--sky), var(--gold)) }
.restaurant-directory-card__heading { display: flex; justify-content: space-between; gap: 16px }
.restaurant-directory-card__heading h3 { margin: 4px 0 0 }
.restaurant-directory-card__heading h3 a { color: var(--navy); text-decoration: none }
.restaurant-directory-card__heading h3 a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 4px }
.restaurant-directory-card__service { align-self: flex-start; flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: var(--lavender); color: var(--navy); font-size: .68rem; font-weight: 850 }
.restaurant-directory-card__meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px }
.restaurant-directory-card__meta span { padding: 6px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .68rem; font-weight: 750 }
.restaurant-directory-card__link { display: inline-flex; align-items: center; gap: 7px; margin-top: auto; padding-top: 20px; color: var(--blue); font-weight: 850; text-decoration: none }
.restaurant-directory-empty { margin-top: 30px; padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); text-align: center }
.restaurant-directory-cta { margin-top: 46px }
@media(max-width:800px) {
   .restaurant-directory-hero__stats, .restaurant-directory-grid { grid-template-columns: 1fr 1fr }
   .restaurant-directory__intro { flex-direction: column }
   .restaurant-directory__updated { min-width: 0 }
}
@media(max-width:560px) {
   .restaurant-directory { width: min(100% - 24px, 1180px) }
   .restaurant-directory-hero__stats, .restaurant-directory-grid { grid-template-columns: 1fr }
   .restaurant-directory-card__heading { flex-direction: column }
   .restaurant-directory-card__service { align-self: flex-start }
}