/* Cloud Storage auf Produkt- und Konfigurationsseite (Support\StorageProduct, Vorlage im booking-Theme
   HwProductDetailElement.twig, Block product_detail_description). Nur geladen, wenn das Produkt zum Modul NhStorage gehört
   (storefront/layouts/meta.twig). Farben aus den Flächen-Variablen des Themes (--s-*), damit hell und dunkel stimmen. */

.nh-pdp .nh-sto { display: block; }
.nh-pdp .nh-sto__lead { margin: 0 0 22px; font-size: 15.5px; line-height: 1.55; color: var(--s-text, #14171c); }
.nh-pdp .nh-sto__title {
    margin: 0 0 6px; font-size: 12px !important; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
    color: var(--s-muted, #5a6478); font-family: inherit !important; line-height: 1.4;
}

/* Datenblatt: Bezeichnung links, Wert rechts, feine Linien – keine Kacheln */
.nh-pdp .nh-sto__facts { margin: 0; padding: 0; border-top: 1px solid var(--s-line, #e3e6ee); }
.nh-pdp .nh-sto__row {
    display: grid; grid-template-columns: minmax(150px, 34%) minmax(0, 1fr); gap: 4px 20px;
    padding: 12px 0; border-bottom: 1px solid var(--s-line, #e3e6ee);
}
.nh-pdp .nh-sto__row dt {
    display: flex; align-items: baseline; gap: 10px; margin: 0;
    font-size: 14px; font-weight: 500; color: var(--s-muted, #5a6478);
}
.nh-pdp .nh-sto__row dt i { flex: 0 0 16px; text-align: center; font-size: 13px; color: var(--s-muted, #5a6478); opacity: .8; }
.nh-pdp .nh-sto__row dd { margin: 0; font-size: 14.5px; font-weight: 600; line-height: 1.45; color: var(--s-text, #14171c); }
.nh-pdp .nh-sto__sub { display: block; margin-top: 2px; font-size: 13px; font-weight: 400; color: var(--s-muted, #5a6478); }

.nh-pdp .nh-sto__note { margin: 16px 0 0; font-size: 13px; line-height: 1.55; color: var(--s-muted, #5a6478); }

/* Bild aus dem Speicher-Panel im schlichten Fenster */
.nh-pdp .nh-sto__shot { margin: 26px 0 0; }
.nh-pdp .nh-sto__frame { overflow: hidden; border: 1px solid var(--s-line, #e3e6ee); border-radius: 10px; background: var(--s-raised, #fff); }
.nh-pdp .nh-sto__bar {
    display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px;
    border-bottom: 1px solid var(--s-line, #e3e6ee);
}
.nh-pdp .nh-sto__bar i { width: 8px; height: 8px; border-radius: 50%; background: var(--s-line, #e3e6ee); }
.nh-pdp .nh-sto__bar span { margin-left: 8px; font: 500 11px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--s-muted, #5a6478); }
.nh-pdp .nh-sto__img { display: block; width: 100%; height: auto; }
.nh-pdp .nh-sto__img--dark { display: none; }
html.nh-dark .nh-pdp .nh-sto__img--light { display: none; }
html.nh-dark .nh-pdp .nh-sto__img--dark { display: block; }
.nh-pdp .nh-sto__shot figcaption { margin-top: 10px; font-size: 13px; color: var(--s-muted, #5a6478); }

/* Rechte Spalte: Steuerhinweis über Hostwares Zusammenfassung (statt des doppelten Preiskopfs) */
.nh-pdp .nh-sto-vat {
    position: relative; z-index: 11; margin: 2px 0 0; padding: 11px 20px;
    border-bottom: 1px solid var(--s-line, rgba(15, 23, 42, .10)); background: var(--s-panel, #ffffff);
    font-size: 13px; line-height: 1.5; color: var(--s-muted, #5a6478);
}

@media (max-width: 575.98px) {
    .nh-pdp .nh-sto__row { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 11px 0; }
    .nh-pdp .nh-sto__lead { font-size: 15px; }
}