/* bh.css — hero /border/ coridor pe limbajul g1 (borderhero-20261026).
   Folosește componentele din g1.css (.hero .hbg .hin .htop .pill h1 .acc .sub .cards .fc);
   aici doar: lățimea completă în <main>, fundalul pe coridor, rândul de cifre-cheie,
   graficul „față în față” și ajustările de mobil. Tot ce e aici e sub .bh. */
html:has(.bh){overflow-x:clip}
main>section.bh{border-top:0;margin-top:0;padding-top:0}
.bh.hero{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-bottom:6px;overflow:hidden}
.bh .wrap{max-width:1180px;margin:0 auto;padding:0 28px}
@media(max-width:620px){.bh .wrap{padding:0 18px}}
/* fundal: aceleași reguli ca g1 /Netherlands/nl, cu desenul coridorului */
.bh .hbg::before{background:var(--bh-d) right 0 top -48px/max(100%,1240px) auto no-repeat}
html.fp-light .bh .hbg::before{background-image:var(--bh-l)}
@media(max-width:759px){.bh .hbg::before{background-size:1100px auto;background-position:right top}}
@media(max-width:599px){.bh .hbg{height:204px}.bh .hbg::before{inset:0;width:auto;height:auto;top:0;background-size:auto 140%;background-position:92% 72%}.bh .hbg::after{background:linear-gradient(180deg,transparent 56%,var(--bg) 97%)}}
/* titlul: valorile g1, peste regulile vechi din style.css */
.bh h1{font-size:clamp(34px,5.4vw,64px);line-height:1.04;letter-spacing:-.03em;font-weight:800;margin:22px 0 14px;max-width:15em;text-wrap:balance}
.bh h1 .acc{background:linear-gradient(90deg,#4fd1bb,#7ef0a9);-webkit-background-clip:text;background-clip:text;color:transparent}
html.fp-light .bh h1 .acc{background:none;color:var(--acc-h,#07564c)}
html:not(.fp-light) .bh .hin h1{filter:drop-shadow(0 0 2px var(--bg)) drop-shadow(0 0 10px var(--bg))}
.bh-crumb a{display:inline-flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-weight:700}
.bh-crumb a:hover{color:var(--acc)}
.bh-crumb .gsep{color:var(--acc);margin:0 4px}
.bh-en{color:var(--dim);font-weight:600}
/* cifrele-cheie: mesajul principal */
.bh-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:780px;margin:4px 0 14px}
.bh-kpi{margin:0;padding:12px 16px;border:1px solid color-mix(in srgb,var(--acc) 35%,var(--line2));border-radius:14px;background:color-mix(in srgb,var(--card) 84%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.bh-kpi b{display:flex;align-items:center;gap:8px;font-size:clamp(22px,2.4vw,30px);font-weight:800;letter-spacing:-.02em;line-height:1.1;white-space:nowrap}
.bh-kpi b span{overflow:hidden;text-overflow:ellipsis}
.bh-kpi small{display:block;margin-top:4px;font-size:13px;line-height:1.3;color:var(--ink2)}
.bh-win{border-color:color-mix(in srgb,var(--down) 60%,var(--line2))}
.bh-win b{color:var(--down)}
.bh .sub.bh-sub{font-size:clamp(14px,1.3vw,16px);line-height:1.55;max-width:44em;margin:0 0 6px}
.bh-note{font-size:13px;color:var(--ink2);margin:6px 0 0;padding-left:10px;border-left:2px solid var(--warn)}
/* CTA */
.bh-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:16px 0 0}
.bh-btn{display:inline-flex;align-items:center;gap:9px;min-height:46px;padding:10px 20px;border-radius:999px;background:var(--acc);color:var(--acc-ink);font-weight:700;font-size:16px;text-decoration:none;box-shadow:0 8px 24px color-mix(in srgb,var(--acc) 30%,transparent)}
.bh-btn:hover{filter:brightness(1.08)}
.bh-btn svg{width:19px;height:19px}
.bh-calc2{display:none}
/* graficul față în față (dumbbell): axă comună, mărită, cu gradații etichetate */
.bh-duel{margin:22px 0 0;padding:16px 20px 12px;border:1px solid var(--line);border-radius:var(--r,16px);background:color-mix(in srgb,var(--card) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.bh-duel .bh-duel-t{font-size:15px;line-height:1.3;letter-spacing:0;font-weight:700;margin:0 0 8px;color:var(--ink)}
.bh-rows{display:grid;gap:14px 36px}
@media(min-width:900px){.bh-rows{grid-template-columns:1fr 1fr}}
.bh-row{--c:var(--dC)}
.bh-row.bh-p{--c:var(--pC)}
.bh-rh{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 12px;margin:0;font-size:14px}
.bh-rh b{color:var(--c);font-size:13px;letter-spacing:.07em;text-transform:uppercase}
.bh-dd{color:var(--ink);font-weight:700}
.bh-track{position:relative;height:72px;margin:0 22px}
.bh-axis{position:absolute;left:-22px;right:-22px;top:46px;height:1px;background:var(--line2)}
.bh-tick{position:absolute;top:46px;transform:translateX(-50%);padding-top:8px;font-size:12px;color:var(--dim);line-height:1}
.bh-tick::before{content:"";position:absolute;left:50%;top:0;width:1px;height:5px;background:var(--line2)}
.bh-seg{position:absolute;top:43px;height:7px;border-radius:4px;background:color-mix(in srgb,var(--c) 50%,transparent)}
.bh-dot{position:absolute;top:39px;width:15px;height:15px;margin-left:-7.5px;border-radius:50%;background:var(--bg);border:3px solid var(--c)}
.bh-dot.bh-w{background:var(--c)}
.bh-lab{position:absolute;top:8px;display:flex;align-items:center;gap:6px;font-size:16px;font-weight:800;white-space:nowrap;color:var(--ink2)}
.bh-lab.l{transform:translateX(calc(-100% + 8px))}
.bh-lab.r{transform:translateX(-8px)}
.bh-lab.bh-w{color:var(--ink)}
.bh-cap{margin:2px 0 0;font-size:12px;color:var(--dim)}
/* cardurile: grila g1 fără sparkline */
.bh .cards{margin-top:16px}
.bh .fc{grid-template-columns:1fr;grid-template-areas:"h" "p" "a" "m"}
.bh .fcp{font-size:clamp(28px,3vw,36px)}
.bh .bh-u{font-size:.5em;font-weight:600;color:var(--ink2)}
.bh .fca{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bh .fcm{margin-top:0}
.bh .bh-mapcard .fcp{color:var(--lC)}
.bh .bh-jump{margin:18px 0 6px}
@media(max-width:759px){
 .bh .fc{grid-template-columns:1fr;grid-template-areas:"h" "p" "a" "m";padding:14px}
 .bh .fcp{font-size:30px}
}
@media(max-width:599px){
 .bh .hin{padding-top:160px}
 .bh h1{font-size:clamp(28px,8.4vw,36px);margin-top:8px;margin-bottom:12px}
 .bh .htop{min-height:36px}
 .bh .htop .bh-top-cta{display:none}
 .bh .bh-calc2{display:inline-flex}
 .bh-crumb{font-size:14px;gap:4px;flex-wrap:wrap}
 .bh-kpis{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
 .bh-kpi.bh-win{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px}
 .bh-kpi.bh-win small{margin:0;text-align:right}
 .bh-kpi{padding:10px 10px}
 .bh-kpi b{font-size:19px;gap:6px}
 .bh-kpi small{font-size:12px}
 .bh-btn{flex:1 1 100%;justify-content:center}
 .bh-calc2{flex:1 1 100%;justify-content:center}
 .bh-duel{padding:14px 14px 10px}
 .bh-track{margin:0 14px}
 .bh-axis{left:-14px;right:-14px}
 .bh-lab{font-size:15px}
 .bh .cards{gap:10px}
 .bh .bh-mapcard{display:none}
}
/* ===== rețeta Haaparanta (hp) — ordinea și conținutul paginii ===== */
.bh-answer{margin:2px 0 10px}
.bh-answer .bh-kpis{margin:0}
.bh-basis{margin:6px 0 0;font-size:13px;color:var(--ink2)}
.bh .sub.bh-lead{font-size:clamp(15px,1.35vw,17px);line-height:1.55;max-width:46em;margin:10px 0 4px}
.hp-cards{margin-top:18px}
.hp-cards .fc{cursor:default}
.hp-cmp{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line2);display:grid;gap:4px}
.hp-cmp p{margin:0;display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:14px}
.hp-cmp p span{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--ink2)}
.hp-cmp small{font-size:12px;color:var(--dim)}
.hp-cmp b{white-space:nowrap}
.hp-cmp .hp-w b{color:var(--down)}
.bh .fc .fca{font-size:13px}
.hp-calc{gap:10px}
.hp-ctl{display:flex;align-items:center;gap:10px;font-size:14px}
.hp-lb{min-width:64px;color:var(--ink2)}
.hp-seg{display:inline-flex;border:1px solid var(--line2);border-radius:999px;padding:3px;gap:2px}
.hp-seg button{border:0;background:none;border-radius:999px;padding:6px 12px;font-size:14px;font-weight:600;color:var(--ink2);display:inline-flex;align-items:center;gap:6px;min-height:34px}
.hp-seg button[aria-checked="true"]{background:var(--acc-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--acc)}
.hp-k{width:8px;height:8px;border-radius:50%;display:inline-block}.hp-k.kd{background:var(--dC)}.hp-k.kp{background:var(--pC)}
.hp-ctl input[type=range]{flex:1;accent-color:var(--acc);min-width:0}
.hp-ctl input[type=number]{width:72px;padding:7px 8px;border:1px solid var(--line2);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}
.hp-res{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:color-mix(in srgb,var(--bg) 55%,transparent)}
.hp-res p{margin:0;display:flex;justify-content:space-between;gap:8px;font-size:14px;padding:2px 0}
.hp-res p span{display:flex;align-items:center;gap:6px}
.hp-res .hp-rh{color:var(--ink2);font-size:13px}
.hp-res .hp-sent{display:block;margin-top:6px;font-weight:700;color:var(--down)}
.hp-fine{margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--dim);max-width:70em}
@media(min-width:760px){.hp-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* „Pregătește plinul” */
main>section.hp-plan{border:1px solid var(--line);border-radius:var(--r,16px);padding:18px 20px;margin-top:22px;background:var(--card)}
.hp-plan h2{font-size:20px;margin:0 0 6px}
.hp-plan p{margin:0 0 10px;color:var(--ink2);font-size:15px}
.hp-plan-links{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center}
.hp-plan-links a{color:var(--ink);font-weight:600;text-underline-offset:4px}
.hp-copy{border:1px solid var(--line2);background:none;border-radius:999px;padding:7px 14px;font-size:14px;font-weight:600;min-height:38px}
.hp-copy-st{font-size:13px;color:var(--down)}
/* secțiunile numerotate */
.hp-eb{color:var(--acc);font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin:0 0 6px}
/* graficul diferenței */
.hpc{margin:14px 0 0}
.hpc-leg{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink2);margin-bottom:8px}
.hpc-leg span{display:inline-flex;align-items:center;gap:6px}
.hpc-leg .k{display:inline-block;width:18px;height:3px;border-radius:2px}
.hpc-leg .kp{background:var(--pC)}.hpc-leg .kd{background:var(--dC)}
.hpc-leg .km{background:repeating-linear-gradient(90deg,var(--ink2) 0 4px,transparent 4px 7px);height:2px}
.hpc-leg .kx{width:auto;height:auto;background:none;font-style:normal;font-size:10px;color:var(--ink2)}
.hpc-box{position:relative;padding:0 0 22px 48px}
.hpc-plot{position:relative;height:clamp(200px,28vw,300px);border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--card) 70%,transparent);overflow:visible}
.hpc-plot svg{position:absolute;inset:0;width:100%;height:100%}
.hpc-g{stroke:var(--line);stroke-width:1;fill:none}
.hpc-z{stroke:var(--ink2);stroke-width:1.4;fill:none}
.hpc-l{fill:none;stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.hpc-l.hpc-p{stroke:var(--pC)}.hpc-l.hpc-d{stroke:var(--dC)}
.hpc-m{fill:none;stroke-width:1.2;stroke-dasharray:5 4;opacity:.75}
.hpc-m.hpc-p{stroke:var(--pC)}.hpc-m.hpc-d{stroke:var(--dC)}
.hpc-dot{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:2px solid var(--bg)}
.hpc-dot.hpc-p{background:var(--pC)}.hpc-dot.hpc-d{background:var(--dC)}
.hpc-zone{position:absolute;left:10px;font-size:12px;font-weight:700;color:var(--ink2);background:color-mix(in srgb,var(--card) 85%,transparent);padding:1px 6px;border-radius:6px}
.hpc-top{top:6px}.hpc-bot{bottom:6px}
.hpc-y{position:absolute;left:-48px;top:0;bottom:0;width:42px}
.hpc-y span{position:absolute;right:0;transform:translateY(-50%);font-size:12px;color:var(--dim)}
.hpc-y .hpc-u{top:-14px;transform:none}
.hpc-x{position:relative;height:20px;margin-top:4px}
.hpc-x span{position:absolute;transform:translateX(-50%);font-size:12px;color:var(--dim);white-space:nowrap}
.hpc-x span:first-child{transform:none}.hpc-x span:last-child{transform:translateX(-100%)}
.hpc-st{list-style:none;padding:0;margin:8px 0 6px;display:grid;gap:3px;font-size:14px}
@media(min-width:760px){.hpc-st{grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:repeat(3,auto);column-gap:28px}}
.hpc-s{display:inline-block;width:14px;color:var(--ink2)}
.hpc-n{font-size:12px;color:var(--dim);margin:6px 0 0;line-height:1.5}
/* 05 pagini de țară */
.hp-lcards{display:grid;gap:10px}
@media(min-width:760px){.hp-lcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hp-lc{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-decoration:none;color:var(--ink)}
.hp-lc:hover{border-color:var(--acc)}
.hp-lc b{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hp-lc small{grid-column:1;color:var(--ink2);font-size:13px}
.hp-lc>span{grid-row:1/3;grid-column:2;color:var(--acc);font-size:20px}
@media(max-width:599px){
 .hp-ctl{flex-wrap:wrap}.hp-lb{min-width:0;width:100%}
 .hpc-box{padding-left:40px}.hpc-y{left:-40px;width:36px}
 .hpc-plot{height:220px}
 main>section.hp-plan{padding:16px}
}

/* animație (variantele -anim, ca la g1/Haaparanta) + butonul de pauză; derularea lentă vine din g1.css (heupy/heupym pe .hbg::before, html.fp-hm) */
html.fp-hm .bh .hbg::before{background-image:var(--bh-da)}
html.fp-hm.fp-light .bh .hbg::before{background-image:var(--bh-la)}
.bh .htop .bh-hmb{position:static;margin-left:auto;flex:none}
@media(max-width:599px){.bh .htop .bh-hmb{position:absolute;top:12px;right:18px}}

/* §3 cardul „Coût d’un plein” tăiat la 768 → 2 coloane până la 1099 px, calculatorul pe tot rândul; §6 nota Alsace; linkuri de țară */
.bh .fc{min-width:0}
@media(min-width:760px) and (max-width:1099px){.hp-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hp-calc{grid-column:1/-1}}
.bh-alsnote{margin:6px 0 0;font-size:14px;font-weight:600;color:var(--ink)}
.hp-cty{color:inherit;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--acc) 55%,transparent);text-underline-offset:3px;display:inline-flex;align-items:center;gap:6px}
.hp-cty:hover{color:var(--acc)}
.bh-kpi .hp-cty{text-decoration-thickness:2px}
.hp-note01{margin:0 0 10px}