/* ==========================================================================
   NPGEM SRL — custom styles on top of the inherited NOVA theme (main.css).
   Scoped under .npg-* so it never collides with the base theme.
   Brand color reused from the theme: #f16722 (NOVA orange).
   ========================================================================== */

:root { --npg-orange: #f16722; --npg-ink: #171619; }

/* ---- Hero (homepage) ---- */
.npg-hero {
    position: relative; height: min(520px, 44.43vw); min-height: 440px;
    display: flex; align-items: center; color: #fff;
    background-color: #d9500e;
    background-image:
        linear-gradient(90deg, rgba(23,22,25,.6) 0%, rgba(23,22,25,.2) 52%, rgba(23,22,25,0) 78%),
        url(/themes/vreaulanova-md/assets/img/npgem-hero-wide.webp?v=2);
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat;
}
.npg-hero h1 { color: #fff; font-size: clamp(2rem, 2.92vw, 2.7rem); line-height: 1.15; margin-bottom: 18px; text-align: left; text-shadow: 0 2px 14px rgba(0,0,0,.45); }
.npg-hero p { font-size: 1.2rem; max-width: 560px; margin-bottom: 26px; opacity: .95; text-shadow: 0 1px 10px rgba(0,0,0,.4); }
.npg-hero .primary-button { margin-right: 12px; }
.npg-hero .btn-outline-hero {
    display: inline-block; color: #fff; border: 2px solid #fff; padding: 12px 28px; border-radius: 8px;
    font-family: "DM Sans Bold"; text-transform: uppercase; font-size: 14px;
}
.npg-hero .btn-outline-hero:hover { background: #fff; color: var(--npg-orange); }

/* ---- Co-brand nav logo (NOVA Power and Gas | NPGEM) ---- */
.npg-cobrand { display: inline-flex; align-items: center; gap: 16px; }
.logo-nav.npg-cobrand { width: auto; height: auto; }
.npg-cobrand.hidden { display: none; }
.npg-cobrand img { display: block; width: auto; }
.npg-cobrand-nova { height: 40px; }
.npg-cobrand-npgem { height: 44px; }
.npg-cobrand-sep { flex: 0 0 auto; width: 2px; height: 40px; background: rgba(255,255,255,.55); }
.npg-cobrand-sep--dark { background: rgba(23,22,25,.22); }
@media (max-width: 991px) {
    .npg-cobrand { gap: 10px; }
    .npg-cobrand-nova { height: 30px; }
    .npg-cobrand-npgem { height: 33px; }
    .npg-cobrand-sep { height: 30px; }
}

/* ---- Inner-page header band ---- */
.npg-page-header {
    background: #f16722; color: #fff; padding: 56px 0; margin-bottom: 0;
}
.npg-page-header h1 { color: #fff; margin-bottom: 0; }

/* ---- Generic section ---- */
.npg-section { padding: 60px 0; }
.npg-section .lead-text { font-size: 1.05rem; color: #45444a; line-height: 1.7; }
.text-center .title-section,
.npg-cta-band .title-section,
.ml-auto.mr-auto .title-section { text-align: center; }

/* Alternating section background: override the inherited NOVA peach (#faebd7) with a neutral gray */
.bg-gray1 { background-color: #eaece9; border-color: rgba(0, 0, 0, .05); }

/* ---- Interactive distribution-zone map (Raphael SVG) ---- */
.npg-zone-map { position: relative; width: 100%; max-width: 100%; margin-left: auto; margin-right: auto; }
.npg-zone-map-canvas { width: 100%; aspect-ratio: 1356 / 902; }
.npg-zone-map-canvas svg { display: block; width: 100%; height: 100%; }
.npg-zone-map svg [tabindex]:focus, .npg-zone-map svg [tabindex]:focus-visible { outline: none; }
.npg-zone-map-tooltip { position: absolute; z-index: 4; display: none; pointer-events: none; padding: 9px 13px; border-radius: 12px; background: var(--npg-ink); color: #fff; font-size: 13px; line-height: 1.35; white-space: nowrap; box-shadow: 0 14px 30px rgba(0,0,0,.22); transform: translate(14px, 14px); }
.npg-zone-map-tooltip strong { display: block; font-weight: 700; }
.npg-zone-map-tooltip span { opacity: .8; }
.npg-zone-card.is-active { border: 2px solid var(--npg-orange); box-shadow: 0 12px 34px rgba(241,103,34,.20); }

/* ---- Cards ---- */
.npg-zone-card { background: #fff; border-radius: 12px; padding: 22px; box-shadow: 0 8px 30px rgba(0,0,0,.06); }
.npg-zone-card h4 { color: var(--npg-orange); margin-bottom: 8px; }
.npg-zone-card .zone-tag { font-size: .8rem; color: #8c8c8c; }
.npg-card { background:#fff; border-radius:12px; padding:24px; box-shadow:0 8px 30px rgba(0,0,0,.06); height:100%; }
.npg-media-shadow { box-shadow: 0 8px 30px rgba(0,0,0,.4); }
.npg-card h3, .npg-card h4 { color: var(--npg-ink); }

/* ---- Accordion (ANRE decisions / connection guide) — matches the NOVA FAQ look:
       orange header bars, white bold text, white chevron, spaced rounded items ---- */
.npg-accordion .npg-acc-item {
    border-radius: 8px; overflow: hidden; margin-bottom: 12px;
    box-shadow: 0 4px 14px rgba(241, 103, 34, .12);
}
.npg-accordion .npg-acc-head {
    width:100%; text-align:left; background: var(--npg-orange); border:0; padding:18px 22px;
    font-family:'DM Sans Bold'; font-weight:700; font-size:18px; color:#fff;
    display:flex; justify-content:space-between; align-items:center; gap:16px; cursor:pointer;
}
.npg-accordion .npg-acc-head:hover { color:#fff; opacity:.95; }
.npg-accordion .npg-acc-head:focus:not(:focus-visible) { outline: none; }
.npg-accordion .npg-acc-head:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
.npg-accordion .npg-acc-head .npg-acc-icon { transition: transform .2s ease; color:#fff; }
.npg-accordion .npg-acc-item.open .npg-acc-head .npg-acc-icon { transform: rotate(180deg); }
.npg-accordion .npg-acc-body { padding:18px 22px; color:#516074; line-height:1.7; background:#fff; display:none; }
.npg-accordion .npg-acc-item.open .npg-acc-body { display:block; }

/* ---- Doc / link list ---- */
.npg-doclist { list-style:none; padding:0; margin:0; }
.npg-doclist li { padding:12px 0; border-bottom:1px solid #eee; }
.npg-doclist li a { color:var(--npg-ink); font-weight:500; }
.npg-doclist li a:hover { color:var(--npg-orange); }
.npg-doclist li i { color:var(--npg-orange); margin-right:8px; }

/* ---- Regulated-tariff table (energie: preturi reglementate) ---- */
.npg-table-wrap { overflow-x:auto; }
.npg-tariff-table { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 8px 30px rgba(0,0,0,.06); }
.npg-tariff-table caption { caption-side:top; text-align:left; font-family:'DM Sans Bold'; font-weight:700; color:var(--npg-ink); padding:0 0 10px; }
.npg-tariff-table th, .npg-tariff-table td { padding:14px 18px; text-align:left; border-bottom:1px solid #eee; }
.npg-tariff-table thead th { background:var(--npg-orange); color:#fff; font-family:'DM Sans Bold'; font-weight:700; }
.npg-tariff-table tbody tr:last-child td { border-bottom:0; }
.npg-tariff-table td.npg-tariff-val { font-weight:700; color:var(--npg-ink); white-space:nowrap; }
.npg-tariff-note { font-size:.9rem; color:#6b6a70; margin-top:12px; line-height:1.6; }
.npg-tariff-note a { color:var(--npg-orange); }

/* ---- Testimonials ---- */
.npg-testimonial { background:#fff; border-radius:12px; padding:26px; box-shadow:0 8px 30px rgba(0,0,0,.06); height:100%; }
.npg-testimonial .stars { color:var(--npg-orange); margin-bottom:10px; }
.npg-testimonial .who { font-weight:600; margin-top:12px; }

/* ---- CTA band ---- */
.npg-cta-band { background:var(--npg-orange); color:#fff; border-radius:16px; padding:44px; text-align:center; }
.npg-cta-band h2 { color:#fff; }
.npg-cta-band .btn-white {
    display:inline-block; background:#fff; color:var(--npg-orange); padding:14px 34px; border-radius:10px;
    font-family:"DM Sans Bold"; text-transform:uppercase; font-size:15px; margin-top:8px;
}

/* ---- Forms: reference-style floating-label inputs + selects (as on vreaulanova reclamatii) ---- */
.npg-ajax-form .row { margin-bottom: 25px; }
@media (max-width: 767px) {
    /* The two col-md-6 fields stack on phones with no gap between them (name/company, email/phone);
       give the top one the same 25px rhythm as the space between rows. */
    .npg-ajax-form .row > .col-md-6:first-child { margin-bottom: 25px; }
}
.npg-ajax-form .input-select { border: 1.6px solid rgba(221,211,201,.6); padding-top: 24px; padding-bottom: 10px; }
.npg-ajax-form input.input-select, .npg-ajax-form textarea.input-select { cursor: text; }
.npg-ajax-form textarea.input-select { min-height: 120px; line-height: 1.6; }
.npg-ajax-form .input-select::placeholder { color: rgba(93,93,92,.5); opacity: 1; }
.npg-ajax-form textarea.input-select:focus ~ .placeholder-floating,
.npg-ajax-form textarea.input-select:not(:focus):valid ~ .placeholder-floating { top: 8px; left: 19px; font-size: 11px; opacity: 1; }
/* self-contained chevron (no external CDN), matching the reference look */
.npg-ajax-form select.input-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23171619' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-color: #fff;
}
/* honeypot: kept in the DOM for bots, removed from view/tab order for humans */
.npg-ajax-form .npg-hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; pointer-events:none; }
.npg-form-success { align-items:center; gap:12px; background:#e7f7ec; border:1px solid #b7e4c7; color:#1a7f37; border-radius:12px; padding:20px 24px; font-weight:500; }
.npg-form-success:not(.hidden) { display:flex; }
.npg-form-success i { font-size:24px; }
.npg-form-error { margin-top:14px; color:#c1121f; font-weight:500; }

/* ---- Cookie consent: center banner + preferences modal (group-standard look) ---- */
.npgem-cc { position: fixed; inset: 0; z-index: 100000; }
.npgem-cc:not([hidden]) { display: flex; align-items: center; justify-content: center; padding: 20px; }
.npgem-cc-backdrop { position: absolute; inset: 0; background: rgba(23,22,25,.55); }
.npgem-cc-card { position: relative; z-index: 1; background: #fff; border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0,0,0,.28); width: 100%; max-width: 440px; }
.npgem-cc-banner { padding: 26px; }
.npgem-cc-text { font-size: .95rem; line-height: 1.6; color: #45444a; margin: 0 0 18px; }
.npgem-cc-text a { color: var(--npg-orange); text-decoration: underline; }
.npgem-cc-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.npgem-cc-btn { border: 0; border-radius: 10px; padding: 12px 22px; font-family: "DM Sans Bold";
    font-weight: 700; font-size: 14px; cursor: pointer; }
.npgem-cc-btn-accept { background: var(--npg-orange); color: #fff; }
.npgem-cc-btn-accept:hover { opacity: .92; }
.npgem-cc-btn-reject { background: var(--npg-ink); color: #fff; }
.npgem-cc-btn-reject:hover { opacity: .9; }
.npgem-cc-textlink { background: none; border: 0; color: var(--npg-ink); text-decoration: underline;
    font-size: 14px; cursor: pointer; padding: 8px 4px; margin-left: auto; }
.npgem-cc-modal { max-width: 460px; overflow: hidden; }
.npgem-cc-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px 4px; }
.npgem-cc-modal-head h3 { margin: 0; font-size: 1.15rem; }
.npgem-cc-close { background: none; border: 0; font-size: 24px; line-height: 1; color: #8c8c8c; cursor: pointer; }
.npgem-cc-modal-body { padding: 8px 24px; max-height: 52vh; overflow-y: auto; }
.npgem-cc-cat { padding: 16px 0; border-bottom: 1px solid #eee; }
.npgem-cc-cat:last-child { border-bottom: 0; }
.npgem-cc-cat-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.npgem-cc-cat-title { font-weight: 600; color: var(--npg-ink); }
.npgem-cc-always { color: var(--npg-orange); font-size: .85rem; font-weight: 600; white-space: nowrap; }
.npgem-cc-cat-desc { font-size: .85rem; line-height: 1.55; color: #6b6a70; margin: 0; }
.npgem-cc-modal-foot { padding: 16px 24px 22px; }
.npgem-cc-save { width: 100%; }
.npgem-cc-switch { position: relative; display: inline-block; width: 46px; height: 26px; flex: 0 0 auto; }
.npgem-cc-switch input { opacity: 0; width: 0; height: 0; }
.npgem-cc-slider { position: absolute; inset: 0; background: #ccc; border-radius: 26px; transition: .2s; cursor: pointer; }
.npgem-cc-slider::before { content: ""; position: absolute; height: 20px; width: 20px; left: 3px; top: 3px;
    background: #fff; border-radius: 50%; transition: .2s; }
.npgem-cc-switch input:checked + .npgem-cc-slider { background: var(--npg-orange); }
.npgem-cc-switch input:checked + .npgem-cc-slider::before { transform: translateX(20px); }
@media (max-width: 520px) {
    .npgem-cc-actions { flex-direction: column; align-items: stretch; }
    .npgem-cc-textlink { margin-left: 0; text-align: center; }
}

/* ---- Brand-align the inherited secondary button to NOVA orange ---- */
.secondary-button { border-color: var(--npg-orange); color: var(--npg-orange); }
.secondary-button:hover { background-color: var(--npg-orange); border-color: var(--npg-orange); color: #fff; }
/* Suport contact cards: the button grows for longer content (e.g. the e-mail) instead of the fixed 215px. */
.npg-card .secondary-button { width: auto; min-width: 215px; }

/* ---- Footer: social (left) + co-brand NOVA | NPGEM (right). Mobile: stacked & centered
       (social row, then NOVA, then NPGEM). From lg (>=992px): one row, social left / co-brand right. ---- */
footer .footer-social-row { display: flex; flex-direction: column; align-items: center; gap: 16px; margin: 8px 0 28px; text-align: center; }
footer .footer-social-row .social { display: flex; justify-content: center; margin: 0; }
footer .footer-cobrand { display: flex; align-items: center; gap: 16px; }
footer .footer-cobrand-link { display: inline-flex; }
footer .footer-cobrand img { display: block; width: auto; }
footer .footer-cobrand-nova { height: 40px; }
footer .footer-cobrand-npgem { height: 44px; }
footer .footer-cobrand-sep { flex: 0 0 auto; width: 2px; height: 40px; background: rgba(255,255,255,.55); }
@media (min-width: 992px) {
    footer .footer-social-row { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px 20px; flex-wrap: nowrap; }
    footer .footer-social-row .social { justify-content: flex-start; }
}
@media (max-width: 991px) {
    footer .footer-cobrand { flex-direction: column; gap: 14px; }
    footer .footer-cobrand-sep { display: none; }
}
@media (max-width: 991px) {
    footer .copyright-row { border-top: 0; }
    .npg-hero {
        height: auto; min-height: 460px;
        background:
            linear-gradient(rgba(23,22,25,.4), rgba(23,22,25,.4)),
            url(/themes/vreaulanova-md/assets/img/npgem-hero-mobile.webp) center/cover no-repeat;
        background-color: #d9500e;
    }
}

@media (max-width: 650px) {
    .npg-hero h1 { font-size: 2.1rem; }
    .npg-hero .primary-button { margin-right: 0; margin-bottom: 12px; }
    .npg-page-header { padding: 40px 0; }
}