/* Fuel Hub CSS v2 — redesigned for visual impact and scroll depth */
:root{--fh-navy:#0f1b35;--fh-petroleum:#164e63;--fh-amber:#f59e0b;--fh-amber-light:#fef3c7;--fh-green:#16a34a;--fh-green-bg:rgba(22,163,74,.1);--fh-blue:#2563eb;--fh-blue-bg:rgba(37,99,235,.1);--fh-radius:14px;--fh-radius-sm:8px;--fh-shadow:0 2px 16px rgba(0,0,0,.08);--fh-shadow-hover:0 8px 32px rgba(0,0,0,.14)}

/* ── Container ── */
.fuel-hub-container{max-width:1100px;margin:0 auto;padding:1rem 1rem 2rem}

/* ── Breadcrumb ── */
.fuel-breadcrumb{margin-bottom:1rem}.fuel-breadcrumb ol{display:flex;flex-wrap:wrap;padding:0;margin:0;list-style:none;gap:.5rem;font-size:.875rem}.fuel-breadcrumb li::after{content:"›";margin-left:.5rem;color:var(--bs-secondary-color)}.fuel-breadcrumb li:last-child::after{display:none}.fuel-breadcrumb a{color:var(--bs-link-color);text-decoration:none;font-weight:500}.fuel-breadcrumb a:hover{text-decoration:underline}

/* ── Hero Header ── */
.fuel-hub-header{position:relative;overflow:hidden;text-align:center;margin-bottom:1.5rem;padding:2.5rem 1.5rem 2rem;background:linear-gradient(145deg,var(--fh-navy) 0%,var(--fh-petroleum) 60%,#065f46 100%);border-radius:20px;color:#fff}.fuel-hub-header::before{content:"";position:absolute;top:-50%;left:-20%;width:140%;height:200%;background:radial-gradient(ellipse at 70% 40%,rgba(245,158,11,.12) 0%,transparent 60%);pointer-events:none}.fuel-hub-header h1{position:relative;font-size:2rem;font-weight:800;margin:0 0 .5rem;display:flex;align-items:center;justify-content:center;gap:.75rem;letter-spacing:-.02em}.fuel-hub-header h1 .v2-icon{width:36px;height:36px;color:var(--fh-amber);flex-shrink:0}.fuel-hub-header .subtitle{position:relative;font-size:1.05rem;opacity:.88;margin:.5rem 0 0;font-weight:500}.fuel-hub-header .intro{position:relative;max-width:640px;margin:.75rem auto 0;font-size:.9rem;opacity:.75;line-height:1.6}

/* ── Section Nav (horizontal scroll tab bar) ── */
.fsn-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -1rem 1.5rem;border-bottom:2px solid #d1fae5;background:var(--bs-body-bg);position:sticky;top:var(--nkd-header-h,56px);z-index:89}
.fsn-wrap::-webkit-scrollbar{display:none}
.fsn{display:flex;padding:0 1rem;width:max-content;min-width:100%;gap:0}
.fsn-link{display:block;padding:.65rem 1rem;font-size:.8rem;font-weight:700;color:var(--bs-secondary-color,#6b7280);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;transition:color .15s,border-color .15s;letter-spacing:.01em}
.fsn-link:hover{color:#059669;text-decoration:none}
.fsn-link.fsn-active{color:#059669;border-bottom-color:#059669}
@media(max-width:640px){.fsn-link{padding:.55rem .75rem;font-size:.76rem}}
[data-theme="dark"] .fsn-wrap{border-bottom-color:#065f46}
[data-theme="dark"] .fsn-link{color:#9ca3af}
[data-theme="dark"] .fsn-link:hover,[data-theme="dark"] .fsn-link.fsn-active{color:#34d399}
[data-theme="dark"] .fsn-link.fsn-active{border-bottom-color:#34d399}
/* Keep old icon nav classes for any external refs (hidden) */
.fuel-icon-nav{display:none}

/* ── Search Section ── */
.fuel-search-section{background:linear-gradient(145deg,var(--fh-navy) 0%,var(--fh-petroleum) 100%);border-radius:20px;padding:2rem;margin-bottom:1.75rem}.fuel-search-section.collapsed .fuel-search-content{display:none}.fuel-search-section.collapsed .fuel-search-header{margin-bottom:0}.fuel-search-toggle{display:none;align-items:center;justify-content:center;gap:.5rem;padding:.7rem 1.5rem;background:rgba(245,158,11,.2);border:2px solid rgba(245,158,11,.4);border-radius:50px;color:var(--fh-amber);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .2s;margin-top:1rem}.fuel-search-toggle:hover{background:rgba(245,158,11,.3)}.fuel-search-toggle svg{width:1rem;height:1rem}.fuel-search-section.collapsed .fuel-search-toggle{display:inline-flex}.fuel-search-section:not(.collapsed) .fuel-search-toggle{display:none}.fuel-search-header{text-align:center;margin-bottom:1.5rem}.fuel-search-header h2{font-size:1.4rem;font-weight:700;margin:0 0 .5rem;display:flex;align-items:center;justify-content:center;gap:.5rem;color:#fff}.fuel-search-header h2 svg{width:1.4rem;height:1.4rem;color:var(--fh-amber)}.fuel-search-header p{opacity:.8;margin:0;color:#fff;font-size:.9rem}.fuel-search-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem}.fuel-search-field{display:flex;flex-direction:column;gap:.4rem}.fuel-search-field label{font-size:.8rem;font-weight:600;color:rgba(255,255,255,.8);text-transform:uppercase;letter-spacing:.04em}.fuel-search-field input,.fuel-search-field select{padding:.7rem 1rem;border-radius:10px;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);color:#fff;font-size:.95rem;transition:all .2s}.fuel-search-field input::placeholder{color:rgba(255,255,255,.5)}.fuel-search-field input:focus,.fuel-search-field select:focus{outline:none;border-color:var(--fh-amber);background:rgba(255,255,255,.18)}.fuel-search-field select option{background:#0f1b35;color:#fff}.fuel-search-location-btn{background:rgba(245,158,11,.15);border:1px solid rgba(245,158,11,.3);padding:.45rem .75rem;border-radius:8px;color:var(--fh-amber);cursor:pointer;font-size:.82rem;font-weight:600;display:flex;align-items:center;gap:.4rem;transition:all .2s;margin-top:.4rem}.fuel-search-location-btn svg{width:.9rem;height:.9rem}.fuel-search-location-btn:hover{background:rgba(245,158,11,.25)}.fuel-search-submit{grid-column:1/-1;display:flex;justify-content:center;margin-top:.5rem}.fuel-search-btn{background:var(--fh-amber);color:var(--fh-navy);border:none;padding:.875rem 2.5rem;border-radius:50px;font-size:1rem;font-weight:800;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .2s;min-width:180px;justify-content:center;letter-spacing:-.01em}.fuel-search-btn svg{width:1.1rem;height:1.1rem}.fuel-search-btn:hover:not(:disabled){background:#fbbf24;transform:translateY(-2px);box-shadow:0 6px 20px rgba(245,158,11,.4)}.fuel-search-btn:disabled{opacity:.6;cursor:not-allowed}.fuel-search-btn .spinner{width:18px;height:18px;border:2px solid var(--fh-navy);border-top-color:transparent;border-radius:50%;animation:fh-spin .8s linear infinite}
@keyframes fh-spin{to{transform:rotate(360deg)}}.animate-spin{animation:fh-spin 1s linear infinite}.fuel-search-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:1rem}.fuel-search-loading-spinner{width:44px;height:44px;border:3px solid rgba(245,158,11,.2);border-top-color:var(--fh-amber);border-radius:50%;animation:fh-spin 1s linear infinite}.fuel-search-loading-text{font-size:.95rem;opacity:.8;color:rgba(255,255,255,.8)}.fuel-search-loading-dots{display:flex;gap:.3rem}.fuel-search-loading-dots span{width:7px;height:7px;background:var(--fh-amber);border-radius:50%;animation:fh-bounce 1.4s ease-in-out infinite}.fuel-search-loading-dots span:nth-child(1){animation-delay:0s}.fuel-search-loading-dots span:nth-child(2){animation-delay:.2s}.fuel-search-loading-dots span:nth-child(3){animation-delay:.4s}
@keyframes fh-bounce{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-7px)}}.fuel-search-results{margin-top:1.5rem;background:rgba(255,255,255,.08);border-radius:16px;padding:1rem;max-height:420px;overflow-y:auto}.fuel-search-results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.15)}.fuel-search-results-header h3{margin:0;font-size:1rem;font-weight:700;color:#fff}.fuel-search-results-count{background:rgba(245,158,11,.25);color:var(--fh-amber);padding:.2rem .75rem;border-radius:20px;font-size:.82rem;font-weight:700}.fuel-station-card{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.875rem 1rem;margin-bottom:.625rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;transition:background .2s}.fuel-station-card:hover{background:rgba(255,255,255,.15)}.fuel-station-card:last-child{margin-bottom:0}.fuel-station-info{flex:1}.fuel-station-name{font-weight:700;font-size:.95rem;margin-bottom:.25rem;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;color:#fff}.fuel-station-brand{display:inline-block;background:rgba(245,158,11,.25);color:var(--fh-amber);font-size:.62rem;font-weight:800;padding:.1rem .4rem;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.fuel-station-address{font-size:.82rem;opacity:.7;margin-bottom:.2rem;color:#fff}.fuel-station-distance{font-size:.78rem;opacity:.6;display:flex;align-items:center;gap:.25rem;color:#fff}.fuel-station-distance svg{width:.78rem;height:.78rem}.fuel-station-directions{display:flex;gap:.5rem;margin-top:.75rem}.fuel-dir-btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.45rem .9rem;border-radius:8px;font-size:.82rem;font-weight:700;text-decoration:none;transition:all .2s;border:none}.fuel-dir-btn svg{width:.9rem;height:.9rem}.fuel-dir-btn:hover{transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.2)}.fuel-dir-gmaps{background:linear-gradient(135deg,#4285f4,#1a73e8);color:#fff!important}.fuel-dir-waze{background:linear-gradient(135deg,#33ccff,#00b8e6);color:#fff!important}.fuel-highlight-directions{display:flex;justify-content:center;gap:.75rem;margin-top:.75rem}.fuel-highlight-directions .fuel-dir-btn{padding:.55rem 1.1rem;font-size:.9rem}.fuel-station-price{text-align:right;flex-shrink:0}.fuel-station-price-value{font-size:1.4rem;font-weight:800;color:var(--fh-amber)}.fuel-station-price-unit{font-size:.75rem;opacity:.7;color:#fff}.fuel-no-results{text-align:center;padding:2rem;opacity:.75;color:#fff}.fuel-search-error{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.4);border-radius:10px;padding:.875rem;text-align:center;margin-top:1rem;color:#fca5a5}.fuel-highlights{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin-bottom:1rem}.fuel-highlight-card{background:rgba(255,255,255,.12);border-radius:12px;padding:.875rem;text-align:center;border:2px solid transparent}.fuel-highlight-card.cheapest{border-color:rgba(34,197,94,.6);background:rgba(34,197,94,.12)}.fuel-highlight-card.nearest{border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.1)}.fuel-highlight-badge{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;display:flex;align-items:center;justify-content:center;gap:.35rem;color:rgba(255,255,255,.8)}.fuel-highlight-badge svg{width:.8rem;height:.8rem}.fuel-highlight-card.cheapest .fuel-highlight-badge{color:#86efac}.fuel-highlight-card.nearest .fuel-highlight-badge{color:#fcd34d}.fuel-highlight-name{font-weight:700;font-size:1rem;margin-bottom:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}.fuel-highlight-price{font-size:1.4rem;font-weight:800;margin-bottom:.2rem;color:var(--fh-amber)}.fuel-highlight-distance{font-size:.82rem;opacity:.7;color:#fff}

/* ── Countries Section ── */
.fuel-countries-section{margin-bottom:1.25rem;padding:.25rem .5rem}.fuel-countries-section h2{font-size:1.2rem;font-weight:700;margin:0 0 .4rem;display:flex;align-items:center;gap:.5rem;color:var(--bs-heading-color)}.fuel-countries-section h2 svg{width:1.2rem;height:1.2rem;color:var(--fh-blue)}.fuel-countries-intro{color:var(--bs-secondary-color);font-size:.88rem;margin:0}

/* ── Price Grid ── */
.fuel-price-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.875rem;margin-bottom:2rem}
@media(min-width:1024px){.fuel-price-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:768px) and (max-width:1023px){.fuel-price-grid{grid-template-columns:repeat(3,1fr)}}

/* ── Price Card ── */
.fuel-price-card{background:var(--bs-body-bg);border:1.5px solid var(--bs-border-color);border-radius:var(--fh-radius);padding:1rem 1.1rem;transition:all .2s;position:relative;display:flex;flex-direction:column;gap:.6rem}.fuel-price-card:hover{box-shadow:var(--fh-shadow-hover);transform:translateY(-2px);border-color:var(--fh-blue)}.fuel-price-card.featured{border-color:var(--fh-amber);border-width:2px}.fuel-price-card-header{display:flex;align-items:center;gap:.6rem}.fuel-card-flag{font-size:1.75rem;line-height:1;flex-shrink:0}.fuel-card-name{font-size:1rem;font-weight:700;color:var(--bs-heading-color);flex:1}.fuel-card-badge{font-size:.65rem;font-weight:700;padding:.15rem .5rem;border-radius:20px;background:var(--fh-blue-bg);color:var(--fh-blue);letter-spacing:.03em;text-transform:uppercase;border:1px solid rgba(37,99,235,.2)}.fuel-card-badge.live{background:rgba(245,158,11,.12);color:#b45309;border-color:rgba(245,158,11,.3)}.fuel-prices-row{display:flex;gap:.6rem}.fuel-price-item{flex:1;text-align:center;padding:.5rem .4rem;background:var(--bs-tertiary-bg);border-radius:var(--fh-radius-sm)}.fuel-price-label{font-size:.68rem;font-weight:700;color:var(--bs-secondary-color);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.2rem}.fuel-price-value{font-size:1.15rem;font-weight:800;color:var(--bs-heading-color)}.fuel-price-value.diesel{color:#b45309}.fuel-price-eur{font-size:.67rem;color:var(--bs-secondary-color);margin-top:.1rem}.fuel-trend{font-size:.78rem;font-weight:800;margin-left:.15rem}.fuel-trend.up{color:#dc2626}.fuel-trend.down{color:#16a34a}.fuel-price-with-trend{display:flex;align-items:center;justify-content:center}.fuel-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:.5rem;border-top:1px solid var(--bs-border-color);font-size:.76rem}.fuel-updated{color:var(--bs-secondary-color)}.fuel-card-buttons{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.2rem}.fuel-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .65rem;border-radius:6px;font-weight:700;font-size:.78rem;text-decoration:none;transition:all .2s;white-space:nowrap}.fuel-btn svg{width:.78rem;height:.78rem}.fuel-btn-search{color:var(--fh-green);background:var(--fh-green-bg);border:1px solid rgba(22,163,74,.25)}.fuel-btn-search:hover{background:rgba(22,163,74,.2);color:var(--fh-green);text-decoration:none}.fuel-btn-border{color:var(--fh-blue);background:var(--fh-blue-bg);border:1px solid rgba(37,99,235,.25)}.fuel-btn-border:hover{background:rgba(37,99,235,.2);color:var(--fh-blue);text-decoration:none}.fuel-search-link{color:var(--fh-green);text-decoration:none;font-weight:700;font-size:.8rem;display:flex;align-items:center;gap:.3rem;padding:.25rem .5rem;background:var(--fh-green-bg);border-radius:6px;transition:background .2s}.fuel-search-link svg{width:.78rem;height:.78rem}.fuel-search-link:hover{background:rgba(22,163,74,.2);text-decoration:none}

/* ── Tips Section ── */
.fuel-tips-section{background:linear-gradient(145deg,#fffbeb,#fef3c7);border:1.5px solid rgba(245,158,11,.25);border-radius:18px;padding:1.5rem;margin-bottom:1.75rem}.fuel-tips-section h2{font-size:1.15rem;font-weight:700;margin:0 0 1rem;display:flex;align-items:center;gap:.5rem;color:#92400e}.fuel-tips-section h2 svg{width:1.15rem;height:1.15rem;color:#d97706}.fuel-tips-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.625rem}.fuel-tip-item{display:flex;align-items:flex-start;gap:.75rem;background:#fff;padding:.75rem 1rem;border-radius:10px;font-size:.88rem;color:#78350f;border:1px solid rgba(245,158,11,.15);box-shadow:0 1px 3px rgba(245,158,11,.08)}.fuel-tip-item .tip-num{width:22px;height:22px;min-width:22px;background:var(--fh-amber);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.72rem;flex-shrink:0}

/* ── FAQ Section — accordion ── */
.fuel-faq-section{border-radius:18px;padding:1.5rem;margin-bottom:1.75rem;background:linear-gradient(145deg,#f0f9ff,#e0f2fe);border:1.5px solid rgba(37,99,235,.15)}.fuel-faq-section h2{font-size:1.15rem;font-weight:700;margin:0 0 1.1rem;display:flex;align-items:center;gap:.5rem;color:var(--fh-navy)}.fuel-faq-section h2 svg{width:1.15rem;height:1.15rem;color:var(--fh-blue)}.fuel-faq-list{display:flex;flex-direction:column;gap:.5rem}.fuel-faq-item{background:#fff;border-radius:10px;overflow:hidden;border:1px solid rgba(37,99,235,.1);box-shadow:0 1px 4px rgba(0,0,0,.05);transition:box-shadow .2s}.fuel-faq-item:hover{box-shadow:0 2px 12px rgba(37,99,235,.12)}.fuel-faq-question{font-weight:700;color:var(--fh-navy);display:flex;align-items:center;gap:.75rem;font-size:.95rem;padding:.875rem 1.1rem;cursor:pointer;user-select:none;list-style:none;background:none;border:none;width:100%;text-align:left;transition:background .15s}.fuel-faq-question:hover{background:rgba(37,99,235,.03)}.fuel-faq-question .faq-num{width:22px;height:22px;min-width:22px;background:var(--fh-blue);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:800;flex-shrink:0}.fuel-faq-question::after{content:"▾";margin-left:auto;font-size:.9rem;color:var(--fh-blue);transition:transform .25s;flex-shrink:0}.fuel-faq-item.open .fuel-faq-question::after{transform:rotate(-180deg)}.fuel-faq-answer{max-height:0;overflow:hidden;transition:max-height .32s ease,padding .25s ease;padding:0 1.1rem}.fuel-faq-answer div{padding-bottom:.875rem;color:#374151;font-size:.9rem;line-height:1.65;border-top:1px solid rgba(37,99,235,.08);padding-top:.625rem}.fuel-faq-item.open .fuel-faq-answer{max-height:400px;padding:0 1.1rem}

/* ── Back Link ── */
.fuel-back-link{text-align:center;margin-top:1.5rem}.fuel-back-link a{display:inline-flex;align-items:center;gap:.5rem;color:var(--bs-link-color);text-decoration:none;font-weight:600;font-size:.9rem}.fuel-back-link a:hover{text-decoration:underline}

/* ── Map ── */
.fuel-map-container{margin-bottom:1.5rem;border-radius:14px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.12)}#fuelMap{height:330px;width:100%;background:#e5e7eb}.fuel-map-toggle{display:flex;gap:.5rem;margin-bottom:1rem;justify-content:center}.fuel-map-toggle-btn{padding:.45rem .9rem;border:2px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;border-radius:8px;cursor:pointer;font-weight:700;font-size:.82rem;transition:all .2s}.fuel-map-toggle-btn.active{background:#fff;color:var(--fh-navy);border-color:#fff}.fuel-map-toggle-btn:hover:not(.active){background:rgba(255,255,255,.2)}.fuel-map-popup{text-align:center;min-width:140px}.fuel-map-popup-name{font-weight:700;font-size:.9rem;margin-bottom:4px}.fuel-map-popup-price{font-size:1.2rem;font-weight:800;color:#16a34a;margin-bottom:4px}.fuel-map-popup-distance{font-size:.78rem;color:#6b7280;margin-bottom:6px}.fuel-map-popup-btn{display:inline-block;padding:3px 9px;background:var(--fh-blue);color:#fff;border-radius:4px;text-decoration:none;font-size:.72rem;font-weight:700}.fuel-map-popup-btn:hover{background:#1d4ed8;color:#fff}

/* ── Dark theme ── */
[data-theme="dark"] .fuel-hub-header{background:linear-gradient(145deg,#0a0f1e 0%,#0c2535 60%,#052e16 100%)}
[data-theme="dark"] .fuel-search-section{background:linear-gradient(145deg,#0a0f1e 0%,#0c2535 100%)}
[data-theme="dark"] .fuel-price-card{background:#1e2433;border-color:#2d3748}
[data-theme="dark"] .fuel-price-card:hover{border-color:var(--fh-blue);box-shadow:0 6px 24px rgba(0,0,0,.4)}
[data-theme="dark"] .fuel-price-item{background:#252d3e}
[data-theme="dark"] .fuel-price-label{color:#8899a6}
[data-theme="dark"] .fuel-price-value{color:#e2e8f0}
[data-theme="dark"] .fuel-price-value.diesel{color:var(--fh-amber)}
[data-theme="dark"] .fuel-card-name{color:#e2e8f0}
[data-theme="dark"] .fuel-updated{color:#718096}
[data-theme="dark"] .fuel-tips-section{background:linear-gradient(145deg,#2a1505,#3d1a06);border-color:rgba(245,158,11,.2)}
[data-theme="dark"] .fuel-tips-section h2{color:#fcd34d}
[data-theme="dark"] .fuel-tip-item{background:#1e2433;color:#fcd34d;border-color:rgba(245,158,11,.12)}
[data-theme="dark"] .fuel-faq-section{background:linear-gradient(145deg,#0c1a2e,#0f2040);border-color:rgba(96,165,250,.2)}
[data-theme="dark"] .fuel-faq-section h2{color:#93c5fd}
[data-theme="dark"] .fuel-faq-item{background:#1e2a3e;border-color:rgba(96,165,250,.15)}
[data-theme="dark"] .fuel-faq-item:hover{box-shadow:0 2px 12px rgba(96,165,250,.12)}
[data-theme="dark"] .fuel-faq-question{color:#bfdbfe}
[data-theme="dark"] .fuel-faq-question:hover{background:rgba(96,165,250,.05)}
[data-theme="dark"] .fuel-faq-question .faq-num{background:#3b82f6}
[data-theme="dark"] .fuel-faq-question::after{color:#93c5fd}
[data-theme="dark"] .fuel-faq-answer div{color:#cbd5e1;border-top-color:rgba(96,165,250,.12)}
[data-theme="dark"] .fuel-countries-section h2{color:#93c5fd}
[data-theme="dark"] .fuel-countries-intro{color:#718096}
[data-theme="dark"] .fuel-card-badge{background:rgba(96,165,250,.12);color:#93c5fd;border-color:rgba(96,165,250,.2)}
[data-theme="dark"] .fuel-card-badge.live{background:rgba(245,158,11,.12);color:var(--fh-amber);border-color:rgba(245,158,11,.25)}

/* ── Mobile ── */
@media(max-width:768px){.fuel-hub-header h1{font-size:1.5rem}.fuel-hub-header{padding:1.75rem 1rem 1.5rem}.fuel-price-grid{grid-template-columns:1fr 1fr;gap:.625rem}.fuel-tips-list{grid-template-columns:1fr}.fuel-faq-section{padding:1.1rem 1rem}.fuel-faq-question{font-size:.9rem;padding:.75rem .875rem}.fuel-countries-section h2{font-size:1rem}.fuel-search-section{padding:1.25rem}}
@media(max-width:480px){.fuel-price-grid{grid-template-columns:1fr}.fuel-price-card{padding:.875rem}.fuel-station-card{flex-direction:column;text-align:center}.fuel-station-price{text-align:center;margin-top:.4rem}}
@media(min-width:769px){#fuelMap{height:350px}}

.fuel-calc-section{background:linear-gradient(145deg,#ecfdf5,#d1fae5);border:1.5px solid rgba(16,185,129,.3);border-radius:18px;padding:1.5rem;margin-bottom:1.75rem;scroll-margin-top:80px}
.fuel-calc-section h2{font-size:1.15rem;font-weight:700;margin:0 0 1.1rem;display:flex;align-items:center;gap:.5rem;color:#065f46}
.fuel-calc-section h2 svg{width:22px;height:22px;color:#10b981}
.fuel-calc-form{display:grid;gap:.85rem;background:#fff;padding:1.1rem;border-radius:12px;border:1px solid rgba(16,185,129,.2);box-shadow:0 1px 4px rgba(6,95,70,.06)}
.fuel-calc-row{display:flex;flex-direction:column;gap:.3rem}
.fuel-calc-row label{font-size:.82rem;font-weight:600;color:#065f46}
.fuel-calc-row input,.fuel-calc-row select{padding:.55rem .75rem;border:1px solid #a7f3d0;border-radius:8px;font-size:.95rem;background:#fff;color:#064e3b;transition:border-color .15s,box-shadow .15s}
.fuel-calc-row input:focus,.fuel-calc-row select:focus{outline:none;border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,.15)}
.fuel-calc-btn{margin-top:.25rem;padding:.7rem 1rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:0;border-radius:10px;font-size:.95rem;font-weight:700;cursor:pointer;transition:transform .08s,box-shadow .15s}
.fuel-calc-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,185,129,.3)}
.fuel-calc-btn:active{transform:translateY(0)}
.fuel-calc-results{margin-top:1rem;background:#fff;padding:1rem 1.1rem;border-radius:12px;border:1px solid rgba(16,185,129,.2)}
.fuel-calc-results h3{font-size:1rem;margin:0 0 .55rem;color:#065f46}
.fuel-calc-results p{margin:.25rem 0;font-size:.92rem;color:#064e3b}
.fuel-calc-converted{margin:.5rem 0 .75rem;padding-left:1.1rem;font-size:.86rem;color:#065f46}
.fuel-calc-converted li{margin:.1rem 0}
.fuel-calc-link{display:inline-block;margin-top:.5rem;padding:.45rem .85rem;background:#0ea5e9;color:#fff;border-radius:8px;text-decoration:none;font-size:.85rem;font-weight:600}
.fuel-calc-link:hover{background:#0284c7;color:#fff}
[data-theme="dark"] .fuel-calc-section{background:linear-gradient(145deg,#052e22,#04231a);border-color:rgba(16,185,129,.25)}
[data-theme="dark"] .fuel-calc-section h2{color:#6ee7b7}
[data-theme="dark"] .fuel-calc-section h2 svg{color:#34d399}
[data-theme="dark"] .fuel-calc-form{background:#1e2433;border-color:rgba(16,185,129,.18);box-shadow:0 1px 4px rgba(0,0,0,.25)}
[data-theme="dark"] .fuel-calc-row label{color:#6ee7b7}
[data-theme="dark"] .fuel-calc-row input,[data-theme="dark"] .fuel-calc-row select{background:#0f172a;color:#d1fae5;border-color:rgba(16,185,129,.25)}
[data-theme="dark"] .fuel-calc-row input:focus,[data-theme="dark"] .fuel-calc-row select:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,.2)}
[data-theme="dark"] .fuel-calc-results{background:#1e2433;border-color:rgba(16,185,129,.18)}
[data-theme="dark"] .fuel-calc-results h3{color:#6ee7b7}
[data-theme="dark"] .fuel-calc-results p{color:#d1fae5}
[data-theme="dark"] .fuel-calc-converted{color:#6ee7b7}
@media(max-width:600px){.fuel-calc-section{padding:1.1rem 1rem}.fuel-calc-form{padding:.9rem}}
.fuel-prices-cta-calc{display:inline-flex;align-items:center;gap:.5rem;margin-top:.75rem;padding:.55rem 1rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:10px;text-decoration:none;font-size:.9rem;font-weight:600;border:0;cursor:pointer;transition:transform .08s,box-shadow .15s}
.fuel-prices-cta-calc:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,185,129,.3);color:#fff}
.fuel-prices-cta-calc svg{width:18px;height:18px}
/* Fuel calc/compare/matrix — theme-aware tokens (unify design, dark-ready) */
:root{--fhc-surface:#fff;--fhc-surface-2:#f0fdf4;--fhc-border:#a7f3d0;--fhc-border-soft:#d1fae5;--fhc-text:#111827;--fhc-heading:#065f46;--fhc-muted:#6b7280;--fhc-faint:#888;--fhc-accent-bg:#10b981;--fhc-on-accent:#fff;--fhc-accent-text:#059669;--fhc-table-head:#f5f5f5;--fhc-table-head-green:#f0fdf4;--fhc-row-line:#eee;--fhc-row-alt:#f9fafb;--fhc-row:#fff;--fhc-link:#0d6efd;--fhc-danger:#dc2626;--fhc-cheap:#2a8f3b;--fhc-track:#e5e7eb;--fhc-chip-bg:#e5e7eb;--fhc-chip-text:#374151;--fhc-na-bg:#fafafa;--fhc-na-border:#e5e7eb;--fhc-na-text:#d1d5db;--fhc-cell-border:#e5e7eb;--fhc-matrix-head:#f0fdf4;--fhc-matrix-line:#a7f3d0;--fhc-matrix-line-soft:#d1fae5;--fhc-matrix-text:#065f46;--fhc-heat-text:#111827;--fhc-diag:#9ca3af}
[data-theme="dark"]{--fhc-surface:#0f172a;--fhc-surface-2:#06281d;--fhc-border:rgba(16,185,129,.3);--fhc-border-soft:rgba(16,185,129,.18);--fhc-text:#d1fae5;--fhc-heading:#6ee7b7;--fhc-muted:#9ca3af;--fhc-faint:#94a3b8;--fhc-accent-bg:#10b981;--fhc-on-accent:#06231a;--fhc-accent-text:#34d399;--fhc-table-head:#0e2a20;--fhc-table-head-green:#06281d;--fhc-row-line:rgba(255,255,255,.07);--fhc-row-alt:#101826;--fhc-row:#0b1220;--fhc-link:#60a5fa;--fhc-danger:#f87171;--fhc-cheap:#34d399;--fhc-track:rgba(255,255,255,.1);--fhc-chip-bg:#1f2937;--fhc-chip-text:#cbd5e1;--fhc-na-bg:#0c1422;--fhc-na-border:rgba(255,255,255,.06);--fhc-na-text:#475569;--fhc-cell-border:rgba(255,255,255,.07);--fhc-matrix-head:#06281d;--fhc-matrix-line:rgba(16,185,129,.3);--fhc-matrix-line-soft:rgba(16,185,129,.18);--fhc-matrix-text:#6ee7b7;--fhc-heat-text:#0b1220;--fhc-diag:#475569}
/* inline svg icons sit on the text baseline inside these sections */
.fuel-calc-section .v2-icon,.fuel-compare-table-wrapper .v2-icon{vertical-align:-.125em}
