.directory-page { background:#f5f8f7; }
.directory-page .directory-intro { max-width:1240px; padding:25px 24px 28px; }
.directory-intro .breadcrumbs { margin:0 0 28px; font-size:11px; }
.directory-intro h1 { font-size:38px; line-height:1.15; letter-spacing:-1.2px; max-width:900px; }
.directory-intro .sub { margin-top:14px; max-width:740px; font-size:14px; line-height:1.7; }
.directory-jump { display:inline-flex; gap:20px; margin-top:19px; color:var(--accent-dark); font-size:13px; font-weight:800; text-decoration:none; border-bottom:1px solid #aac6c8; padding-bottom:5px; }
.directory-page .directory-wrap { max-width:1240px; padding:0 24px 32px; }
.directory-page .local-overview { background:transparent; border:0; padding:0; margin:0 0 32px; }
.directory-page .local-overview > .eyebrow { display:none; }
.directory-page .local-overview > h2 { font-size:22px; letter-spacing:-.4px; margin:0 0 18px; }
.local-stats { display:flex; gap:36px; margin:0 0 14px; padding:18px 0; border-top:1px solid #dce6e3; border-bottom:1px solid #dce6e3; }
.local-stats > div { display:flex; gap:8px; align-items:baseline; }
.local-stats strong { font-size:26px; letter-spacing:-.8px; font-variant-numeric:tabular-nums; }
.local-stats span { font-size:12px; color:var(--muted); }
.directory-page .local-overview > .seo-note-text { font-size:11px!important; margin:9px 0 20px; }
.directory-page .local-overview .seo-comparison-grid { gap:22px; }
.directory-page .local-fuel-ranking { background:#fff; border:1px solid #d8e4e1; border-radius:15px; padding:24px; position:relative; overflow:hidden; }
.local-fuel-ranking::before { content:''; position:absolute; inset:0 0 auto; height:4px; background:#247285; }
.local-fuel-ranking:nth-child(2)::before { background:#708363; }
.directory-page .local-fuel-ranking h3 { font-size:24px; margin:8px 0 12px; letter-spacing:-.6px; }
.directory-page .local-fuel-min { padding-bottom:16px; border-bottom:1px solid var(--border); color:var(--muted); }
.local-fuel-min > strong { color:var(--accent-dark); font-size:25px; letter-spacing:-.6px; }
.directory-page .seo-ranking { counter-reset:rank; margin:0; }
.directory-page .seo-ranking li { counter-increment:rank; position:relative; gap:12px; padding:15px 0; }
.directory-page .seo-ranking li::before { content:counter(rank,decimal-leading-zero); font-size:12px; color:#869b9c; font-variant-numeric:tabular-nums; width:20px; flex:0 0 20px; }
.directory-page .seo-ranking li > a { flex:1; min-width:0; font-size:13px; font-weight:800; }
.directory-page .seo-ranking li > a small { font-size:10px; line-height:1.5; overflow-wrap:anywhere; }
.directory-page .seo-ranking li > strong { font-size:16px; color:var(--text); }
.directory-page .seo-ranking li:first-child > strong { color:#147553; }
.directory-page .local-saving { background:#edf6ef; color:#2e6045; border-radius:8px; padding:12px; margin:17px 0 0; font-size:12px; }
.local-services { margin-top:20px; border-top:1px solid var(--border); }
.local-services summary { cursor:pointer; padding:17px 0; color:var(--accent-dark); font-size:13px; font-weight:800; }
.directory-filters { background:#fff; border:1px solid #cedfdf; border-radius:12px; margin:28px 0; scroll-margin-top:90px; }
.directory-filters > summary { display:flex; justify-content:space-between; align-items:center; padding:18px 20px; cursor:pointer; list-style:none; }
.directory-filters > summary::-webkit-details-marker { display:none; }
.directory-filters > summary strong { display:block; font-size:14px; }
.directory-filters > summary small { display:block; color:var(--muted); font-size:11px; margin-top:5px; }
.filter-summary-end { display:flex; align-items:center; gap:16px; font-size:24px; color:var(--accent-dark); }
#filterActiveCount { font-size:12px; background:#edf4f4; padding:5px 9px; border-radius:6px; }
.directory-filters[open] .filter-summary-end > span:last-child { transform:rotate(45deg); }
.directory-page .directory-filters .filters { box-shadow:none; border:0; border-top:1px solid var(--border); border-radius:0 0 12px 12px; padding:20px; grid-template-columns:repeat(4,minmax(0,1fr)); }
.directory-filters .check-field { grid-column:auto; }
.directory-results-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:36px 0 18px; scroll-margin-top:90px; }
.directory-results-heading h2 { margin:0; font-size:25px; letter-spacing:-.6px; }
.directory-results-heading .eyebrow { margin-bottom:9px; }
.directory-results-heading .meta { margin:0; padding:0; background:transparent; border:0; font-size:11px; gap:12px; }
.directory-results-heading .meta strong { color:var(--accent-dark); }
.directory-page .pager { margin-bottom:16px; }
.directory-stations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.directory-station { display:flex; flex-direction:column; min-width:0; padding:20px; border:1px solid #dce5e3; border-radius:12px; background:#fff; }
.directory-station-heading { display:flex; gap:11px; align-items:center; min-width:0; }
.directory-brand-logo { width:52px; height:52px; flex:0 0 52px; padding:5px; display:grid; place-items:center; background:#fff; border:1px solid #e4ebea; border-radius:10px; }
.directory-brand-logo img { display:block; width:100%; height:100%; max-width:40px; max-height:40px; object-fit:contain; }
.directory-station-heading > div { min-width:0; flex:1; }
.directory-station h3 { margin:0 0 4px; font-size:14px; overflow-wrap:anywhere; }
.directory-station h3 a { color:var(--text); text-decoration:none; }
.directory-station h3 a:hover { color:var(--accent); }
.directory-station-heading > div > span { font-size:10px; color:var(--muted); }
.directory-lowcost { color:#287047; background:#ecf6ed; padding:4px 6px; border-radius:5px; font-size:9px; font-weight:800; white-space:nowrap; }
.directory-address { color:#526870; font-size:11px; line-height:1.6; margin:17px 0 6px; overflow-wrap:anywhere; }
.directory-hours { color:var(--muted); font-size:11px; line-height:1.6; margin:0 0 16px; }
.directory-hours > span { font-weight:800; color:#405c65; }
.directory-fuels { border-top:1px solid #edf0ef; padding:10px 0; flex:1; }
.directory-fuels .local-price-line { min-width:0; font-size:11px; line-height:1.6; padding:6px 0; margin:0; }
.directory-fuels .local-price-line strong { font-size:13px; color:var(--accent-dark); white-space:nowrap; }
.directory-selected-price { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px; background:#eff7f5; border-radius:8px; font-size:11px; }
.directory-selected-price strong { font-size:22px; white-space:nowrap; color:var(--accent-dark); }
.directory-selected-price small { font-size:10px; }
.directory-station-actions { display:flex; align-items:center; gap:8px; padding-top:13px; border-top:1px solid #edf0ef; margin-top:8px; }
.directory-station-actions .btn { flex:1; font-size:11px; padding:9px; text-align:center; }
.directory-station-actions .favorite-btn { font-size:10px; border-radius:8px; padding:8px; min-height:36px; }
.directory-page .directory-wrap > .seo-area:last-child { margin-top:36px; border:0; border-top:1px solid var(--border); border-radius:0; background:transparent; padding:25px 0 0; }
.directory-page .directory-wrap > .seo-area:last-child h2 { font-size:22px; }
.directory-page .directory-wrap > .seo-area:last-child .seo-link-grid a { padding:14px; border:1px solid #dae5e2; border-radius:9px; background:#fff; }
@media(max-width:1050px) { .directory-stations { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) {
 .directory-page .directory-intro { padding:24px 16px; }
 .directory-intro h1 { font-size:29px; }
 .directory-intro .sub { font-size:12px; line-height:1.7; margin-top:12px; }
 .directory-intro .eyebrow { font-size:9px; }
 .directory-page .directory-wrap { padding:0 14px 25px; }
 .directory-page .local-overview > h2 { font-size:19px; }
 .local-stats { justify-content:space-between; gap:10px; }
 .local-stats > div { display:flex; flex-direction:column; gap:2px; }
 .local-stats strong { font-size:25px; }
 .local-stats span { font-size:10px; }
 .directory-page .local-fuel-ranking { padding:19px 16px; }
 .directory-page .local-fuel-ranking h3 { font-size:23px; }
 .local-fuel-min > strong { font-size:23px; }
 .directory-page .seo-ranking li { gap:9px; }
 .directory-page .seo-ranking li > strong { font-size:14px; }
 .directory-page .local-overview .seo-comparison-grid { grid-template-columns:1fr; gap:16px; }
 .directory-page .directory-filters .filters { grid-template-columns:repeat(2,minmax(0,1fr)); padding:15px; }
 .directory-results-heading { flex-direction:column; align-items:start; gap:12px; }
 .directory-results-heading .meta { display:flex; flex-wrap:wrap; }
 .directory-stations { grid-template-columns:1fr; gap:14px; }
 .directory-station { padding:18px; }
 .directory-station h3 { font-size:16px; }
 .directory-station-actions .btn, .directory-station-actions .favorite-btn { min-height:42px; font-size:12px; }
 .directory-fuels .local-price-line { font-size:12px; }
}
@media(prefers-reduced-motion:no-preference) {
 .directory-intro { animation:directory-arrive .35s ease-out; }
 @keyframes directory-arrive { from { opacity:.4; transform:translateY(6px); } to { opacity:1; transform:none; } }
}