/* RKV marketing relaunch: only own responsive landingpage components.
   Shared colors, fonts, buttons and navigation remain in styles.css. */
.rel-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(250px,.75fr);gap:clamp(24px,4vw,84px);align-items:center;padding-top:clamp(48px,8vw,128px);padding-bottom:clamp(56px,7vw,104px)}
.rel-hero-copy{max-width:810px}
.rel-hero h1{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(2.4rem,5.2vw,5rem);font-weight:750;line-height:1.08;letter-spacing:-.045em;margin:16px 0 24px}
.rel-hero .rel-lead{font-size:clamp(1rem,1.5vw,1.22rem);line-height:1.7;max-width:690px}
.rel-hero-aside{background:var(--rkv-bg-card,#fff);border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-card,14px);padding:clamp(22px,3vw,42px);box-shadow:var(--rkv-shadow,0 10px 28px rgba(11,51,86,.1));line-height:1.7}
.rel-hero-aside strong{display:block;font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.18rem,2vw,1.6rem);line-height:1.3;color:var(--rkv-navy,#0b3356);margin-bottom:12px}
.rel-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,48px)}
.rel-card-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.rel-card{background:var(--rkv-bg-card,#fff);border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-card,14px);padding:clamp(22px,3vw,35px);display:flex;flex-direction:column;gap:12px;min-width:0}
.rel-card h3{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.25rem,2vw,1.8rem);line-height:1.3;letter-spacing:-.025em;margin:0}
.rel-card p{margin:0;line-height:1.65}
.rel-card .button,.rel-card .text-link{margin-top:auto;align-self:flex-start}
.rel-kicker{color:var(--rkv-blue,#064b8e);font-size:.8rem;letter-spacing:.06em;font-weight:750;text-transform:uppercase}
/* Installer pains reuse the existing RKV cards, palette, grid and breakpoints. */
.rel-pain-section{background:transparent}
.rel-pain-grid .rel-card{border-color:var(--rkv-border)}
.rel-pain-grid .rel-card .rel-pain-response{margin-top:auto;padding-top:15px;border-top:1px solid var(--rkv-border,rgba(9,74,135,.16))}
.rel-pain-response strong{color:var(--rkv-navy,#0b3356)}

.rel-price{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.4rem,2vw,1.9rem);font-weight:750;color:var(--rkv-navy,#0b3356)}
.rel-price small{display:block;font-family:var(--rkv-font-body,'Manrope',sans-serif);font-size:.75rem;font-weight:500;margin-top:3px}
.rel-status{font-size:.82rem;font-weight:700;color:var(--rkv-navy,#0b3356)}
.rel-status-bookable{color:#087348}
.rel-fineprint{font-size:.91rem;line-height:1.65;margin:20px 0 0}
.rel-step-section{background:transparent}
.rel-steps{padding:0;margin:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.rel-steps li{background:var(--rkv-bg-card,#fff);padding:21px;border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-tile,12px)}
.rel-steps strong,.rel-steps span{display:block;line-height:1.55}
.rel-steps strong{font-family:var(--rkv-font-display,'Sora',sans-serif);color:var(--rkv-navy,#0b3356);margin-bottom:10px}
.rel-end{background:var(--rkv-navy-deep,#071f36);color:#fff;border-radius:var(--rkv-radius-card,14px);padding:clamp(28px,5vw,64px);margin-top:clamp(28px,5vw,65px);margin-bottom:clamp(35px,6vw,85px)}
.rel-end h2{color:#fff;font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.8rem,3.5vw,3.1rem);letter-spacing:-.035em;line-height:1.2}
.rel-end .eyebrow,.rel-end .text-link{color:var(--rkv-green,#2fdc91)}
.rel-end p{max-width:740px;line-height:1.7}
.rel-end .button{background:var(--rkv-green,#2fdc91);color:var(--rkv-navy-deep,#071f36)}
@media(max-width:980px){.rel-card-grid-three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.rel-hero{grid-template-columns:1fr;padding-top:48px}.rel-card-grid,.rel-card-grid-three{grid-template-columns:1fr}.rel-hero h1{font-size:clamp(2rem,9vw,3.3rem)}.rel-end{border-radius:var(--rkv-radius-card,22px)}.rel-steps{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.rel-hero *, .rel-card *, .rel-end *{animation:none!important;transition:none!important}}

/* Editorial route for solar/electrical/heating partners on the homepage. */
.rel-b2b-strip{display:flex;align-items:center;justify-content:space-between;gap:clamp(22px,4vw,65px);background:var(--rkv-bg-card,#fff);border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-card,14px);padding:clamp(28px,4vw,48px);margin-block:clamp(24px,4vw,60px)}
.rel-b2b-strip>div{max-width:790px}.rel-b2b-strip h2{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.55rem,2.8vw,2.7rem);line-height:1.2;letter-spacing:-.03em;margin:10px 0}.rel-b2b-strip p{line-height:1.7}.rel-b2b-strip .button{flex:none}
@media(max-width:760px){.rel-b2b-strip{flex-direction:column;align-items:flex-start}.rel-b2b-strip .button{max-width:100%}}


/* Small, first-party EVCC checkout. Uses master RKV navy, green and local fonts. */
.shop-layout{max-width:1320px;margin-inline:auto;padding-top:clamp(38px,6vw,90px);padding-bottom:clamp(40px,8vw,100px)}
.shop-heading{max-width:820px;margin-bottom:clamp(25px,4vw,54px)}
.shop-heading h1{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(2rem,4.7vw,4rem);line-height:1.12;letter-spacing:-.04em}
.shop-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,3vw,36px)}
.shop-card{min-width:0;background:var(--rkv-bg-card,#fff);border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-card,14px);padding:clamp(22px,3vw,38px)}
.shop-card h2{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.35rem,2vw,1.9rem);line-height:1.2}
.shop-card p{line-height:1.65}
.shop-total{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(2rem,3vw,3rem);line-height:1.1;color:var(--rkv-navy,#0b3356);font-weight:750;margin-bottom:0}
.shop-hint{font-size:.875rem;color:var(--rkv-navy,#0b3356);opacity:.85}
.shop-prices{margin-block:22px;padding-top:16px;border-top:1px solid var(--rkv-border,rgba(9,74,135,.16))}
.shop-prices>div{display:flex;justify-content:space-between;align-items:baseline;gap:15px;padding:10px 0}
.shop-prices dt{font-size:.875rem}.shop-prices dd{margin:0;font-weight:750;white-space:nowrap;font-variant-numeric:tabular-nums}
.shop-field{display:grid;gap:7px;margin:16px 0}.shop-field label{font-weight:650}
.shop-field input{width:100%;max-width:100%;min-height:48px;padding:10px 13px;border-radius:10px;border:1px solid var(--rkv-border,#d5dce4);background:#fff;color:var(--rkv-navy-deep,#071f36)}
.shop-field input:focus-visible,.shop-consent input:focus-visible,.shop-submit:focus-visible{outline:3px solid var(--rkv-green,#2fdc91);outline-offset:3px}
.shop-consent{display:flex;align-items:flex-start;gap:12px;font-size:.9rem;line-height:1.5;margin:22px 0}
.shop-consent input{width:22px;height:22px;margin-top:2px;flex:none}
.shop-submit{min-height:48px}
.shop-submit[disabled]{opacity:.55;cursor:wait}
@media(max-width:760px){.shop-grid{grid-template-columns:1fr}.shop-prices>div{align-items:flex-start}.shop-prices dd{white-space:normal}}
@media(prefers-reduced-motion:reduce){.shop-layout *{animation:none!important;transition:none!important}}


/* B2B contact – same first-party RKV surface; no additional layout framework. */
.rel-partner-section .section-heading{max-width:840px}
.rel-partner-form{max-width:940px;padding:clamp(20px,3vw,36px);border:1px solid var(--rkv-border,#d5dce4);background:var(--rkv-bg-card,#fff);border-radius:var(--rkv-radius-card,14px)}
.rel-partner-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.rel-partner-fields label{display:grid;align-content:start;gap:8px;font-size:.93rem;font-weight:650;line-height:1.5}
.rel-partner-fields input,.rel-partner-fields select,.rel-partner-fields textarea{width:100%;min-width:0;min-height:46px;padding:11px 13px;font:inherit;font-weight:450;color:var(--rkv-navy-deep,#071f36);background:#fff;border:1px solid var(--rkv-border,#d5dce4);border-radius:10px}
.rel-partner-fields textarea{resize:vertical;min-height:124px}
.rel-partner-wide{grid-column:1/-1}
.rel-partner-form [data-partner-status]{min-height:1.6em}
.rel-partner-form button[disabled]{opacity:.65;cursor:wait}
@media(max-width:760px){.rel-partner-fields{grid-template-columns:minmax(0,1fr);gap:14px}}

/* EVCC versus Home Assistant Energy Hub – accessible, responsive product clarity. */
.home-product-difference{max-width:1120px;margin:clamp(16px,2.5vw,28px) 0;padding:clamp(18px,2.5vw,28px);border:1px solid var(--rkv-border,rgba(9,74,135,.16));border-radius:var(--rkv-radius-card,14px);background:var(--rkv-bg-card,#fff);line-height:1.7}
.home-product-difference strong{color:var(--rkv-navy,#0b3356)}
.home-product-difference .text-link{display:inline-flex;align-items:center;margin-left:.35em}
.rel-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
.rel-compare-grid .rel-card{min-width:0;gap:14px}
.rel-compare-grid .rel-compare-hub{border-color:rgba(47,184,123,.24)}
.rel-compare-grid .rel-compare-evcc{border-color:var(--rkv-border)}
.rel-compare-points{padding-left:1.25rem;margin:0;line-height:1.65}
.rel-compare-points li{margin:.5rem 0}
.rel-compare-points li::marker{color:var(--rkv-blue,#064b8e)}
.rel-compare-hub .rel-compare-points li::marker{color:#087348}
.rel-compare-fit{margin-top:auto!important;padding-top:15px;border-top:1px solid var(--rkv-border,rgba(9,74,135,.16))}
.rel-compare-fit strong{color:var(--rkv-navy,#0b3356)}
@media(max-width:760px){.rel-compare-grid{grid-template-columns:1fr}.home-product-difference .text-link{margin-left:0;margin-top:4px}}

/* Three-offer product matrix: EVCC, Energy Hub, and Hub + Optimizer. */
.rel-feature-matrix-block{margin-top:clamp(22px,4vw,44px)}
.rel-feature-matrix-block>.section-heading{max-width:980px}
.rel-feature-matrix-block h3,.rel-market-excerpt h3{font-family:var(--rkv-font-display,'Sora',sans-serif);font-size:clamp(1.25rem,2.6vw,1.9rem);line-height:1.3;color:var(--rkv-navy,#0b3356);letter-spacing:-.025em;margin:6px 0 12px}
.rel-feature-mobile-hint{display:none;font-size:.85rem;color:var(--rkv-text-soft,#51657b)}
.rel-feature-matrix-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--rkv-border,#d5dce4);border-radius:var(--rkv-radius-card,14px);background:var(--rkv-bg-card,#fff)}
.rel-feature-matrix-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:clamp(.8rem,1vw,.91rem);color:var(--rkv-navy-deep,#071f36)}
.rel-feature-matrix-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.rel-feature-matrix-table thead{background:var(--rkv-bg-soft,#faf9f6);color:var(--rkv-navy,#0b3356)}
.rel-feature-matrix-table thead th{font-family:var(--rkv-font-display,'Sora',sans-serif);font-weight:700;text-align:left;line-height:1.35}
.rel-feature-matrix-table th,.rel-feature-matrix-table td{padding:clamp(11px,1.6vw,18px);border-bottom:1px solid var(--rkv-border,#d5dce4);vertical-align:top;overflow-wrap:anywhere;hyphens:auto}
.rel-feature-matrix-table th[scope="col"]:first-child{width:28%}
.rel-feature-matrix-table th[scope="row"]{font-weight:700;text-align:left;line-height:1.5;background:var(--rkv-bg-soft,#f7fafc)}
.rel-feature-matrix-table tbody tr:last-child>*{border-bottom:0}
.rel-feature-matrix-table td small{display:block;margin-top:6px;font-size:.75rem;line-height:1.48;color:var(--rkv-text-soft,#4b6577)}
.rel-feature-matrix-table td.rel-feature-optimizer{background:rgba(47,220,145,.07)}
.rel-feature-matrix-table thead th:last-child{background:var(--rkv-green-soft,#ecfaf2);border-left:0}
.rel-feature-state{display:inline-block;font-weight:750;font-size:.81rem;line-height:1.45}
.rel-feature-included{color:#087348}
.rel-feature-conditional{color:var(--rkv-blue,#064b8e)}
.rel-feature-optional{color:var(--rkv-blue,#064b8e)}
.rel-feature-missing{color:#526578}
.rel-feature-planned{color:#72551d}
.rel-market-excerpt{margin-top:clamp(22px,3vw,36px);padding:clamp(20px,3vw,36px);background:var(--rkv-bg-soft,#f7fafc);border:1px solid var(--rkv-border,#d5dce4);border-radius:var(--rkv-radius-card,14px)}
.rel-market-excerpt>.section-heading{max-width:930px}
.rel-market-criteria{padding-left:1.4em;margin:16px 0 22px;line-height:1.68;display:grid;gap:10px}
.rel-market-criteria strong{color:var(--rkv-navy,#0b3356)}
@media(max-width:760px){
  .rel-feature-mobile-hint{display:block}
  .rel-feature-matrix-table,.rel-feature-matrix-table tbody{display:block}
  .rel-feature-matrix-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .rel-feature-matrix-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:2px solid var(--rkv-border,#d5dce4)}
  .rel-feature-matrix-table th[scope="row"]{grid-column:1/-1;width:auto;border-bottom:1px solid var(--rkv-border,#d5dce4);padding:13px 15px}
  .rel-feature-matrix-table td{display:flex;flex-direction:column;gap:2px;min-width:0;padding:13px 15px;border-bottom:0}
  .rel-feature-matrix-table td:nth-child(2){border-right:1px solid var(--rkv-border,#d5dce4)}
  .rel-feature-matrix-table td.rel-feature-optimizer{grid-column:1/-1;border-top:1px solid var(--rkv-border,#d5dce4);border-left:2px solid rgba(47,184,123,.24)}
  .rel-feature-matrix-table td::before{content:attr(data-label);font-family:var(--rkv-font-display,'Sora',sans-serif);font-weight:800;color:var(--rkv-navy,#0b3356);margin-bottom:5px}
}

/* Supplemental offers form one quiet section with shared alignment. */
.home-addons { margin-top: clamp(48px, 6vw, 80px); padding-block: clamp(32px, 4vw, 48px); border-block: 1px solid var(--rkv-border); }
.home-addons-title { margin: 0 0 32px; font: 650 clamp(1.5rem, 3vw, 2.3rem)/1.2 var(--rkv-font-display); letter-spacing: -.035em; color: var(--rkv-navy); }
.home-addons-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 6vw, 80px); }
.home-addons-grid .rel-card { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-content: start; align-items: center; gap: 12px 16px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.home-addons-grid .home-product-icon { grid-column: 1; grid-row: 1; margin: 0; }
.home-addons-grid h4 { grid-column: 2; grid-row: 1; margin: 0; font: 650 clamp(1.15rem, 2vw, 1.45rem)/1.3 var(--rkv-font-display); letter-spacing: -.025em; color: var(--rkv-navy); }
.home-addons-grid p, .home-addons-grid .text-link { grid-column: 2; margin: 0; }
.home-addons-grid p { max-width: 42ch; color: var(--rkv-text-soft); }
.home-addons-grid .text-link { display: inline-flex; align-items: center; min-height: 44px; justify-self: start; margin-top: 4px; }
.rel-card { box-shadow: none; }
.rel-steps li { background: transparent; border: 0; border-top: 1px solid var(--rkv-border); border-radius: 0; padding: 24px 0; }
@media(max-width:760px) { .home-addons-grid { grid-template-columns: minmax(0,1fr); gap: 32px; } .home-addons-title { margin-bottom: 28px; } }
/* Editorial groups use a shared baseline instead of repeated elevated boxes. */
.rel-card { background: transparent; border: 0; border-top: 1px solid var(--rkv-border); border-radius: 0; padding: 24px 0; }
.home-addons-grid .rel-card { border: 0; padding: 0; }

/* Compact comparison with a native keyboard-accessible full view. */
.rel-feature-details { margin-top: 18px; }
.rel-feature-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 52px; padding: 14px 20px; border: 1px solid var(--rkv-border); border-radius: 14px; color: var(--rkv-navy); background: transparent; font-weight: 750; cursor: pointer; list-style: none; }
.rel-feature-details > summary::-webkit-details-marker { display: none; }
.rel-feature-details > summary:hover { background: var(--rkv-green-soft,#ecfaf2); }
.rel-feature-collapse { display: none; }
.rel-feature-details[open] .rel-feature-expand { display: none; }
.rel-feature-details[open] .rel-feature-collapse { display: inline; }
.rel-feature-details[open] .rel-feature-chevron { transform: rotate(45deg); }
.rel-feature-chevron { font-size: 1.6rem; line-height: 1; }
.rel-feature-details[open] > .rel-feature-matrix-wrap { margin-top: 18px; }
.rel-feature-matrix-block:has(.rel-feature-details[open]) .rel-feature-compact { display: none; }
@media print { .rel-feature-compact { display:none; } .rel-feature-details > .rel-feature-matrix-wrap { display:block !important; } }
/* A connected process diagram: horizontal on desktop, vertical on mobile. */
.rel-steps.rel-process { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; margin-block: 18px 32px; }
.rel-steps.rel-process > li { position: relative; border: 0; padding: 0; }
.rel-process-node { position: relative; display: grid; place-items: center; width: 100px; height: 100px; margin-bottom: 24px; border-radius: 30px; background: var(--rkv-navy); color: var(--rkv-green); }
.rel-process-node svg { width: 44px; height: 48px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rel-process-node .rel-process-number { position: absolute; top: -10px; right: -10px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--rkv-green); color: var(--rkv-navy-deep); font-size: .75rem; font-weight: 800; }
.rel-process > li:not(:last-child)::after { content: ""; position: absolute; top: 49px; left: 116px; right: -16px; height: 2px; background: linear-gradient(90deg,var(--rkv-green),rgba(47,184,123,.2)); }
.rel-process > li:not(:last-child)::before { content: ""; position: absolute; top: 45px; right: -16px; width: 10px; height: 10px; border-top: 2px solid var(--rkv-green); border-right: 2px solid var(--rkv-green); transform: rotate(45deg); }
.rel-process-copy strong { margin-bottom: 8px; }
@media(max-width:760px) {
 .rel-steps.rel-process { grid-template-columns: 1fr; gap: 32px; }
 .rel-steps.rel-process > li { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 22px; }
 .rel-process-node { width: 72px; height: 72px; margin:0; border-radius: 22px; }
 .rel-process-node svg { width: 36px; height: 40px; }
 .rel-process-copy strong { padding-top: 2px; }
 .rel-process > li:not(:last-child)::after { top: 84px; bottom: -20px; left: 35px; right: auto; width: 2px; height: auto; }
 .rel-process > li:not(:last-child)::before { top: auto; bottom: -20px; left: 31px; right: auto; transform: rotate(135deg); }
 .rel-feature-summary td { font-size:.8rem; }
}
