:root{--ink:#103d32;--green:#08734a;--gold:#ffd45a;--muted:#536c60;--paper:#f5f8f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}a{color:inherit}button,input,select{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c09000;outline-offset:4px}.skip{position:absolute;left:8px;top:-90px}.skip:focus{top:8px;z-index:5;background:white;padding:12px}.wrap{max-width:1200px;margin:auto;padding:0 28px}.header{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:96px}.brand{text-decoration:none;font-weight:800;font-size:23px;letter-spacing:-.8px;display:flex;align-items:center;gap:12px;line-height:1.2}.brand img{width:45px;height:45px;border-radius:12px}.brand small{display:block;font-size:9px;letter-spacing:2px;font-weight:600;margin-top:6px}nav{display:flex;gap:26px;align-items:center}nav a{text-decoration:none;font-size:14px;font-weight:600}.btn{display:inline-block;background:var(--ink);color:white;text-decoration:none;border:0;border-radius:13px;padding:14px 22px;cursor:pointer;font-weight:700;text-align:center}.gold{background:var(--gold);color:var(--ink)}.hero{display:grid;grid-template-columns:1.02fr 1fr;align-items:center;gap:40px;padding:54px 0 38px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--green)}h1{font-size:clamp(36px,4.6vw,64px);line-height:1.06;letter-spacing:-2.8px;margin:22px 0}h1 em{font-style:normal;color:var(--green)}.lead{font-size:18px;color:var(--muted);max-width:620px;margin-bottom:28px}.hero figure{margin:0;position:relative;border-radius:28px;overflow:hidden;background:#e2eadf;min-height:410px;display:flex;align-items:center}.hero figure img{width:100%;height:410px;object-fit:cover}.hero figcaption{position:absolute;bottom:24px;left:24px;right:24px;border-radius:16px;background:#ffffffee;padding:16px 20px;display:flex;justify-content:space-between;gap:12px;font-size:12px}.hero figcaption strong{display:block;font-size:17px}.search{background:white;padding:26px;border:1px solid #dce6de;border-radius:23px;box-shadow:0 14px 36px #103d3208;margin-bottom:25px}.search h2{font-size:20px;margin:0 0 18px}.search-row{display:flex;gap:14px;align-items:end;flex-wrap:wrap}.field{flex:1;min-width:160px;position:relative}.field label{display:block;font-size:12px;font-weight:700;margin-bottom:7px}.field input,.field select{width:100%;background:var(--paper);border:1px solid #cfdbd1;border-radius:10px;padding:13px;color:var(--ink);min-height:51px}.search p{font-size:12px;color:var(--muted);margin:12px 0 0}.suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #cbdace;border-radius:10px;box-shadow:0 12px 30px #103d3222;z-index:3;max-height:260px;overflow:auto}.suggestions:empty{display:none}.suggestions button{border:0;border-bottom:1px solid #edf0ed;background:white;display:block;width:100%;text-align:left;padding:12px;color:var(--ink);cursor:pointer}.suggestions button:hover,.suggestions button:focus{background:#fff3cf}.trust{display:flex;justify-content:space-between;gap:24px;border-bottom:1px solid #d9e4db;padding:16px 0 30px;font-size:13px;color:var(--muted)}section{padding:48px 0}h2{font-size:clamp(26px,3vw,36px);line-height:1.2;letter-spacing:-1px;margin:12px 0 22px}h3{font-size:20px;line-height:1.3;margin:12px 0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{background:white;border:1px solid #dce6de;border-radius:20px;padding:26px;text-decoration:none}.card p{font-size:14px;color:var(--muted);margin-bottom:0}.number{font-size:12px;color:var(--green);font-weight:800;letter-spacing:2px}.app{background:var(--ink);border-radius:28px;color:white;display:grid;grid-template-columns:1.4fr 1fr;padding:44px;gap:50px;align-items:center}.app p{color:#c3d4cb}.app .eyebrow{color:var(--gold)}.badges{display:flex;gap:12px;flex-wrap:wrap}.badge{border:1px solid #789388;border-radius:13px;padding:13px 18px;flex:1;min-width:145px;font-size:17px;font-weight:700}.badge span{display:block;color:var(--gold);font-size:12px;font-weight:500;margin-top:6px}.links{display:flex;gap:12px;flex-wrap:wrap}.links a{background:white;border:1px solid #dce6de;padding:12px 20px;border-radius:12px;text-decoration:none;font-weight:600}.links a:hover{border-color:var(--green)}details{border-bottom:1px solid #d8e2db;padding:18px 0}summary{font-weight:700;cursor:pointer}details p{color:var(--muted);max-width:850px}footer{border-top:1px solid #d8e2db;padding:35px 0;font-size:13px;color:var(--muted)}footer .wrap{display:flex;justify-content:space-between;gap:25px;flex-wrap:wrap}footer a{margin-right:18px}.article{max-width:860px;padding:35px 0 65px}.article h1{font-size:44px;line-height:1.15}.article h2{font-size:26px;margin-top:35px}.article p{color:var(--muted)}.breadcrumb{font-size:13px;color:var(--muted)}@media(max-width:900px){nav{gap:15px}nav a:not(.btn){display:none}.hero{gap:25px}.hero figure,.hero figure img{min-height:340px;height:340px}.grid{grid-template-columns:1fr 1fr}.app{gap:24px;padding:30px}}@media(max-width:620px){.wrap{padding:0 20px}.header{min-height:80px;gap:12px}.brand{font-size:17px}.brand img{width:36px;height:36px}.brand small{font-size:7px}nav .btn{font-size:12px;padding:10px 12px}.hero{grid-template-columns:1fr;padding-top:25px;gap:10px}h1{letter-spacing:-1.5px}.hero figure,.hero figure img{min-height:235px;height:235px}.hero figcaption{bottom:15px;left:15px;right:15px;padding:12px}.hero figcaption strong{font-size:14px}.lead{font-size:16px}.search{padding:20px}.search-row{display:block}.field{margin-bottom:13px}.search .btn{width:100%}.trust{gap:14px;flex-wrap:wrap;font-size:12px}.grid{grid-template-columns:1fr}.app{grid-template-columns:1fr;padding:27px;gap:20px}section{padding:30px 0}.article h1{font-size:36px}.links a{padding:10px 15px}footer .wrap{display:block}footer a{display:inline-block;margin-top:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Web comparison and generous desktop branding */
.brand{font-size:30px}.brand img{width:70px;height:70px}.brand small{font-size:10px}.header{min-height:120px}.map-panel{background:white;border:1px solid #dce6de;border-radius:24px;padding:25px;margin:20px 0}.map-toolbar,.results-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.map-toolbar h2{font-size:27px;margin:10px 0}.map-filters{display:flex;gap:20px;margin:18px 0;flex-wrap:wrap}select{padding:10px;border:1px solid #cadacf;border-radius:9px;background:white;color:var(--ink)}.map-filters label,.results-toolbar label{font-size:14px;font-weight:600;display:flex;gap:10px;align-items:center}#map-status{color:var(--muted);font-size:14px}#station-map{height:440px;border-radius:16px;z-index:0;background:#e5ede5}.price-marker{background:var(--ink);color:white;border:2px solid white;border-radius:20px;padding:5px 10px;width:max-content!important;height:auto!important;font-weight:750;font-size:12px;box-shadow:0 2px 7px #1235}.price-marker.unavailable{background:#677168}.station-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.station-card{display:flex;flex-direction:column;gap:12px;text-decoration:none;padding:25px;border:1px solid #dce6de;background:white;border-radius:20px}.station-card:hover{border-color:var(--green);box-shadow:0 10px 25px #1231}.station-card h3{margin:0}.station-card p{margin:0;font-size:14px;color:var(--muted)}.station-card strong{font-size:28px}.station-card small{color:var(--muted)}.station-card .detail-link{margin-top:auto;font-weight:700;color:var(--green)}.alert-banner{display:flex;gap:25px;align-items:center;justify-content:space-between;padding:27px 30px;border-radius:20px;background:var(--ink);color:white;margin:24px 0}.alert-banner strong{font-size:22px}.alert-banner p{margin:6px 0;color:#ccdbd3;font-size:14px}.results-heading{padding:35px 0 10px}.results-heading h1{font-size:48px}.leaflet-popup-content{font:14px/1.6 system-ui;max-width:230px}.leaflet-popup-content a{display:block;font-weight:700;margin-top:10px}.leaflet-control-attribution{font-size:10px}
@media(max-width:1000px){.brand{font-size:24px}.station-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.alert-banner{flex-wrap:wrap}}@media(max-width:620px){.brand{font-size:20px;gap:8px}.brand img{width:48px;height:48px}.brand small{font-size:7px;letter-spacing:1.2px}.header{min-height:96px}.station-grid{grid-template-columns:1fr}.map-panel{padding:16px}#station-map{height:330px}.results-heading h1{font-size:36px}.map-toolbar h2{font-size:23px}.alert-banner{padding:22px}.alert-banner .btn{width:100%}.map-filters{gap:10px}}

/* Horizontal station rows at every screen size */
.station-grid{display:flex;flex-direction:column;gap:12px}.station-card{display:grid;grid-template-columns:80px minmax(0,1fr) auto auto;gap:24px;align-items:center;padding:22px 26px;border-radius:16px}.station-logo{object-fit:contain;background:white;width:72px;height:64px}.station-copy{display:flex;flex-direction:column;gap:6px}.station-prices{display:flex;flex-direction:column;text-align:right;gap:4px}.station-card .detail-link{margin:0;font-size:14px}.station-card h3{font-size:19px}.station-card strong{font-size:26px}.station-card small{font-size:12px}.station-prices strong{max-width:190px}.station-card:hover{transform:none}@media(max-width:700px){.station-card{grid-template-columns:56px minmax(0,1fr) auto;gap:12px;padding:18px 14px}.station-logo{width:52px;height:52px}.station-card .detail-link{grid-column:2/4;font-size:12px}.station-card h3{font-size:16px}.station-card strong{font-size:19px;max-width:110px}.station-card p{font-size:12px}.station-copy small{font-size:11px}}

.fuel-color{display:inline-block;width:13px;height:13px;border-radius:50%;background:var(--fuel-color,#2E9B59)}.fuel-label::before{content:"";display:inline-block;width:10px;height:10px;background:var(--fuel-color,#2E9B59);border-radius:50%;margin-right:7px}.price-marker{border-bottom:5px solid var(--fuel-color,#2E9B59)}

.google-price-marker{background:#103d32;color:white;border:2px solid white;border-bottom:5px solid var(--fuel-color,#2E9B59);border-radius:18px;padding:5px 9px;font:750 12px system-ui;box-shadow:0 2px 7px #1235}.google-price-marker.unavailable{background:#677168}
