/* heizoel-classic.com: Seiten-CSS /heizoelpreis (Praefix .pg-heizoelpreis-) */

/* Seitenkopf bekommt unten Luft, damit die Preistafel hineinhaengen kann */
.pg-heizoelpreis-head{padding-bottom:5.25rem;}
.pg-heizoelpreis-boardwrap{padding-top:0;}
.pg-heizoelpreis-board{position:relative;z-index:1;margin-top:-3.5rem;}

/* Rechner-Karte neben ruhigem Text */
.pg-heizoelpreis-calcgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:3rem;align-items:center;}
.pg-heizoelpreis-calcgrid .c-head{margin-bottom:1.25rem;}
.pg-heizoelpreis-calcgrid .c-check-list{margin:0 0 1.25rem;}

/* Mengen-Tafel: Zahlen rechtsbuendig, Gesamtpreis fett, erste Spalte bleibt beim Scrollen stehen */
.pg-heizoelpreis-mengen td.c-num,.pg-heizoelpreis-mengen th.pg-heizoelpreis-num{text-align:right;white-space:nowrap;}
.pg-heizoelpreis-mengen td.pg-heizoelpreis-total{font-weight:700;color:var(--navy);}
.pg-heizoelpreis-mengen tbody th{white-space:nowrap;width:auto;}
.pg-heizoelpreis-mengen thead th:first-child,.pg-heizoelpreis-mengen tbody th{position:sticky;left:0;z-index:1;}
.pg-heizoelpreis-mengen tbody th{box-shadow:1px 0 0 var(--rule);}
.pg-heizoelpreis-note{font-size:.86rem;color:var(--mute);margin:.75rem 0 0;max-width:90ch;}

/* Faktoren-Tabelle */
.pg-heizoelpreis-faktoren tbody th{width:24%;}
.pg-heizoelpreis-faktoren td:last-child{color:var(--ink-2);}
.pg-heizoelpreis-faktoren td:last-child strong{color:var(--navy);}

/* Bestandteile-Kacheln: Betrag als Zahl oben */
.pg-heizoelpreis-tiles{grid-template-columns:repeat(4,minmax(0,1fr));margin:0;}
.pg-heizoelpreis-tiles .c-tile{padding:1.2rem 1.2rem 1.1rem;border-top:3px solid var(--blue);}
.pg-heizoelpreis-tiles .pg-heizoelpreis-tile__val{display:block;font-size:1.45rem;font-weight:700;color:var(--navy);line-height:1.1;margin-bottom:.35rem;font-variant-numeric:tabular-nums;}
.pg-heizoelpreis-tiles .pg-heizoelpreis-tile__val small{font-size:.8rem;font-weight:400;color:var(--mute);}

/* Sidebar-Regionenliste */
.pg-heizoelpreis-regions{list-style:none;padding:0;margin:0 0 .75rem;font-size:.93rem;columns:2;column-gap:1rem;}
.pg-heizoelpreis-regions li{break-inside:avoid;padding:.22rem 0;}

@media (max-width:991.98px){
  .pg-heizoelpreis-calcgrid{grid-template-columns:1fr;gap:2rem;}
  .pg-heizoelpreis-tiles{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:767.98px){
  .pg-heizoelpreis-head{padding-bottom:3.75rem;}
  .pg-heizoelpreis-board{margin-top:-2.25rem;}
  .pg-heizoelpreis-tiles{grid-template-columns:1fr;}
  /* Faktoren: drei Textspalten werden zu gestapelten Bloecken (Kopfzeile nur fuer Screenreader) */
  .pg-heizoelpreis-faktoren thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .pg-heizoelpreis-faktoren,.pg-heizoelpreis-faktoren tbody,.pg-heizoelpreis-faktoren tr,.pg-heizoelpreis-faktoren tbody th,.pg-heizoelpreis-faktoren td{display:block;width:auto;}
  .pg-heizoelpreis-faktoren tr{padding:1rem 1.1rem;border-bottom:1px solid var(--rule);}
  .pg-heizoelpreis-faktoren tbody tr:last-child{border-bottom:0;}
  .pg-heizoelpreis-faktoren tbody th{background:transparent;padding:0 0 .35rem;font-size:1.05rem;}
  .pg-heizoelpreis-faktoren td{padding:0 0 .45rem;border-bottom:0;}
  .pg-heizoelpreis-faktoren td:last-child{padding-bottom:0;}
}
