/* UNIDOMO Ratgeber-Übersicht (Namensraum uni-rg) */
#vue-app .uni-rg{--rg-navy:#123A5E;--rg-blue:#399CD7;--rg-orange:#FA7108;--rg-green:#004514;--rg-bg:#F2F5F7;--rg-line:#E8ECEF;--rg-text:#2b3440;--rg-muted:#5b6876;color:var(--rg-text);font-size:16px;line-height:1.55}
#vue-app .uni-rg *{box-sizing:border-box}
#vue-app .uni-rg a{text-decoration:none}
#vue-app .uni-rg h1,#vue-app .uni-rg h2,#vue-app .uni-rg h3{color:var(--rg-navy);font-weight:700;line-height:1.25;margin:0}
#vue-app .uni-rg p{margin:0}
#vue-app .uni-rg svg{width:28px;height:28px;flex:0 0 auto}

/* Kopfbereich */
#vue-app .uni-rg-hero{background:var(--rg-bg);border-radius:12px;padding:32px 28px;margin-bottom:32px}
#vue-app .uni-rg-hero h1{font-size:30px;margin-bottom:12px}
#vue-app .uni-rg-hero p{max-width:760px;color:var(--rg-muted);font-size:17px}
#vue-app .uni-rg-trust{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:16px;font-size:14px;font-weight:600;color:var(--rg-navy)}
#vue-app .uni-rg-trust span::before{content:"✓";color:var(--rg-green);margin-right:6px}

/* Auswahl Heizungsart */
#vue-app .uni-rg-pick h2{font-size:22px;margin-bottom:6px}
#vue-app .uni-rg-pick > p{color:var(--rg-muted);margin-bottom:18px}
#vue-app .uni-rg-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:44px}
#vue-app .uni-rg-tile{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--rg-line);border-radius:10px;padding:16px;color:var(--rg-navy);transition:border-color .15s,box-shadow .15s,transform .15s}
#vue-app .uni-rg-tile:hover,#vue-app .uni-rg-tile:focus{border-color:var(--rg-blue);box-shadow:0 4px 14px rgba(18,58,94,.10);transform:translateY(-2px)}
#vue-app .uni-rg-ico{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--rg-bg);color:var(--rg-blue);flex:0 0 48px}
#vue-app .uni-rg-tile strong{display:block;font-size:16px;line-height:1.25}
#vue-app .uni-rg-tile small{display:block;color:var(--rg-muted);font-size:13px;margin-top:2px}

/* Abschnitte */
#vue-app .uni-rg-sec{padding-top:8px;margin-bottom:44px;scroll-margin-top:110px}
#vue-app .uni-rg-sec-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-bottom:2px solid var(--rg-line);padding-bottom:12px;margin-bottom:18px}
#vue-app .uni-rg-sec-head h2{font-size:24px}
#vue-app .uni-rg-sec-head p{color:var(--rg-muted);font-size:15px;flex:1 1 260px}
#vue-app .uni-rg-shop{font-weight:600;color:var(--rg-blue);font-size:15px;white-space:nowrap}
#vue-app .uni-rg-shop:hover{color:var(--rg-navy)}

/* Karten */
#vue-app .uni-rg-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#vue-app .uni-rg-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rg-line);border-radius:10px;padding:18px;color:var(--rg-text);transition:border-color .15s,box-shadow .15s}
#vue-app .uni-rg-card:hover,#vue-app .uni-rg-card:focus{border-color:var(--rg-blue);box-shadow:0 4px 14px rgba(18,58,94,.10)}
#vue-app .uni-rg-card.is-main{background:var(--rg-navy);border-color:var(--rg-navy)}
#vue-app .uni-rg-card.is-main h3,#vue-app .uni-rg-card.is-main p,#vue-app .uni-rg-card.is-main .uni-rg-more{color:#fff}
#vue-app .uni-rg-badge{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--rg-navy);background:var(--rg-bg);border-radius:20px;padding:3px 10px;margin-bottom:10px}
#vue-app .uni-rg-card.is-main .uni-rg-badge{background:var(--rg-orange);color:#fff}
#vue-app .uni-rg-card h3{font-size:17px;margin-bottom:6px}
#vue-app .uni-rg-card p{color:var(--rg-muted);font-size:15px;flex:1}
#vue-app .uni-rg-more{margin-top:12px;font-weight:600;font-size:14px;color:var(--rg-blue)}

/* Fußzeile je Abschnitt */
#vue-app .uni-rg-related{display:flex;flex-wrap:wrap;align-items:center;row-gap:6px;background:var(--rg-bg);border-radius:10px;padding:14px 18px;margin-top:16px;font-size:15px}
#vue-app .uni-rg-related strong{color:var(--rg-navy);margin-right:6px}
#vue-app .uni-rg-related a{color:var(--rg-blue);font-weight:600;white-space:nowrap}
#vue-app .uni-rg-related a:hover{color:var(--rg-navy)}
#vue-app .uni-rg-related + .uni-rg-related{margin-top:8px}
#vue-app .uni-rg-sep{color:var(--rg-muted);margin:0 6px}
#vue-app .uni-rg-top{display:inline-block;margin-top:12px;font-size:14px;color:var(--rg-muted)}
#vue-app .uni-rg-top:hover{color:var(--rg-navy)}

/* Für alle Heizungen */
#vue-app .uni-rg-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#vue-app .uni-rg-col{background:#fff;border:1px solid var(--rg-line);border-top:4px solid var(--rg-blue);border-radius:10px;padding:18px}
#vue-app .uni-rg-col h3{font-size:18px;margin-bottom:10px}
#vue-app .uni-rg-col ul{list-style:none;margin:0;padding:0}
#vue-app .uni-rg-col li{border-top:1px solid var(--rg-line)}
#vue-app .uni-rg-col li:first-child{border-top:0}
#vue-app .uni-rg-col li a{display:block;padding:10px 0;color:var(--rg-navy);font-weight:600}
#vue-app .uni-rg-col li a span{display:block;font-weight:400;font-size:14px;color:var(--rg-muted)}
#vue-app .uni-rg-col li a:hover{color:var(--rg-blue)}

/* Rechner */
#vue-app .uni-rg-tool{display:flex;align-items:center;gap:20px;flex-wrap:wrap;background:var(--rg-navy);color:#fff;border-radius:12px;padding:24px 28px;margin-bottom:44px}
#vue-app .uni-rg-tool .uni-rg-ico{background:rgba(255,255,255,.12);color:#fff}
#vue-app .uni-rg-tool h2{color:#fff;font-size:22px;margin-bottom:4px}
#vue-app .uni-rg-tool p{color:#dbe6f0}
#vue-app .uni-rg-tool > div{flex:1 1 300px}
#vue-app .uni-rg-btn{display:inline-block;background:var(--rg-orange);color:#fff;font-weight:700;border-radius:8px;padding:12px 22px;white-space:nowrap}
#vue-app .uni-rg-btn:hover{background:#e0650a;color:#fff}

/* Rechner & Tools (mehrere Rechner) */
#vue-app .uni-rg-tools{background:var(--rg-navy);border-radius:12px;padding:28px;margin-bottom:44px;scroll-margin-top:110px}
#vue-app .uni-rg-tools > h2{color:#fff;font-size:24px;margin-bottom:6px}
#vue-app .uni-rg-tools > p{color:#dbe6f0;margin-bottom:20px;max-width:760px}
#vue-app .uni-rg-tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#vue-app .uni-rg-tcard{display:flex;flex-direction:column;background:#fff;border-radius:10px;padding:20px;color:var(--rg-text);transition:transform .15s,box-shadow .15s}
#vue-app .uni-rg-tcard:hover,#vue-app .uni-rg-tcard:focus{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.25)}
#vue-app .uni-rg-tcard .uni-rg-ico{margin-bottom:12px}
#vue-app .uni-rg-tcard h3{font-size:18px;margin-bottom:6px}
#vue-app .uni-rg-tcard p{color:var(--rg-muted);font-size:15px;flex:1}
#vue-app .uni-rg-tbtn{align-self:flex-start;margin-top:14px;background:var(--rg-orange);color:#fff;font-weight:700;font-size:15px;border-radius:8px;padding:9px 16px}
#vue-app .uni-rg-tcard:hover .uni-rg-tbtn{background:#e0650a}

/* Weitere Systeme, Beratung */
#vue-app .uni-rg-subhead{font-size:20px;margin-bottom:14px}
#vue-app .uni-rg-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:44px}
#vue-app .uni-rg-chips a{border:1px solid var(--rg-line);border-radius:20px;padding:7px 16px;color:var(--rg-navy);font-weight:600;font-size:14px;background:#fff}
#vue-app .uni-rg-chips a:hover{border-color:var(--rg-blue);color:var(--rg-blue)}
#vue-app .uni-rg-help{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:24px}
#vue-app .uni-rg-box{background:var(--rg-bg);border-left:5px solid var(--rg-green);border-radius:10px;padding:22px 24px}
#vue-app .uni-rg-box h2{font-size:21px;margin-bottom:8px}
#vue-app .uni-rg-box p{color:var(--rg-muted);margin-bottom:12px}
#vue-app .uni-rg-phone{font-size:20px;font-weight:700;color:var(--rg-navy)}
#vue-app .uni-rg-box.is-blue{border-left-color:var(--rg-blue)}
#vue-app .uni-rg-box ul{list-style:none;margin:0;padding:0}
#vue-app .uni-rg-box li a{display:block;padding:6px 0;color:var(--rg-blue);font-weight:600}
#vue-app .uni-rg-box li a:hover{color:var(--rg-navy)}

/* Responsive */
@media (max-width:991px){
 #vue-app .uni-rg-tiles{grid-template-columns:repeat(3,1fr)}
 #vue-app .uni-rg-cards,#vue-app .uni-rg-cols{grid-template-columns:repeat(2,1fr)}
 #vue-app .uni-rg-help{grid-template-columns:1fr}
}
@media (max-width:767px){
 #vue-app .uni-rg-tools-grid{grid-template-columns:1fr}
}
@media (max-width:575px){
 #vue-app .uni-rg{font-size:15px}
 #vue-app .uni-rg-ico{width:40px;height:40px;flex:0 0 40px}
 #vue-app .uni-rg svg{width:22px;height:22px}
 /* Kopfbereich */
 #vue-app .uni-rg-hero{padding:20px 16px;margin-bottom:24px}
 #vue-app .uni-rg-hero h1{font-size:23px}
 #vue-app .uni-rg-hero p{font-size:15px}
 #vue-app .uni-rg-trust{gap:4px 14px;font-size:13px}
 /* Auswahl: kompakte Kacheln */
 #vue-app .uni-rg-pick h2{font-size:20px}
 #vue-app .uni-rg-pick > p{font-size:14px;margin-bottom:14px}
 #vue-app .uni-rg-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:32px}
 #vue-app .uni-rg-tile > span:last-child{min-width:0}
 #vue-app .uni-rg-tile{gap:8px;padding:10px 8px;min-height:60px}
 #vue-app .uni-rg-tile .uni-rg-ico{width:32px;height:32px;flex:0 0 32px}
 #vue-app .uni-rg-tile svg{width:18px;height:18px}
 #vue-app .uni-rg-tile strong{font-size:13.5px;hyphens:manual;-webkit-hyphens:manual}
 #vue-app .uni-rg-tile small{display:none}
 /* Abschnitte */
 #vue-app .uni-rg-sec{margin-bottom:32px}
 #vue-app .uni-rg-sec-head{gap:6px 12px;padding-bottom:10px;margin-bottom:12px}
 #vue-app .uni-rg-sec-head h2{font-size:20px;flex:1 1 0;min-width:0}
 #vue-app .uni-rg-sec-head p{flex:1 1 100%;font-size:14px}
 #vue-app .uni-rg-shop{font-size:14px;white-space:normal}
 /* Karten als kompakte Liste */
 #vue-app .uni-rg-cards{grid-template-columns:1fr;gap:8px}
 #vue-app .uni-rg-card{position:relative;padding:12px 40px 12px 14px}
 #vue-app .uni-rg-card::after{content:"›";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:26px;line-height:1;color:var(--rg-blue)}
 #vue-app .uni-rg-card.is-main::after{color:#fff}
 #vue-app .uni-rg-badge{font-size:10.5px;padding:2px 8px;margin-bottom:6px}
 #vue-app .uni-rg-card h3{font-size:16px;margin-bottom:2px}
 #vue-app .uni-rg-card p{font-size:14px;line-height:1.45}
 #vue-app .uni-rg-card .uni-rg-more{display:none}
 /* Linkzeilen als Chips */
 #vue-app .uni-rg-related{gap:8px;padding:12px;margin-top:10px;font-size:14px}
 #vue-app .uni-rg-related + .uni-rg-related{margin-top:8px}
 #vue-app .uni-rg-related strong{flex:1 1 100%;margin:0}
 #vue-app .uni-rg-related .uni-rg-sep{display:none}
 #vue-app .uni-rg-related a{white-space:normal;background:#fff;border:1px solid var(--rg-line);border-radius:20px;padding:5px 12px;line-height:1.3}
 /* Für alle Heizungen */
 #vue-app .uni-rg-cols{grid-template-columns:1fr;gap:10px}
 #vue-app .uni-rg-col{padding:14px}
 #vue-app .uni-rg-col h3{font-size:17px;margin-bottom:4px}
 #vue-app .uni-rg-col li a{padding:8px 0;font-size:15px}
 #vue-app .uni-rg-col li a span{font-size:13px}
 /* Rechner */
 #vue-app .uni-rg-tool,#vue-app .uni-rg-tools{padding:18px 14px;margin-bottom:32px}
 #vue-app .uni-rg-tools > h2{font-size:21px}
 #vue-app .uni-rg-tools > p{font-size:14px;margin-bottom:14px}
 #vue-app .uni-rg-tools-grid{gap:10px}
 #vue-app .uni-rg-tcard{display:grid;grid-template-columns:40px 1fr;column-gap:12px;padding:14px}
 #vue-app .uni-rg-tcard .uni-rg-ico{grid-row:1 / span 4;margin:0}
 #vue-app .uni-rg-tcard .uni-rg-badge{justify-self:start}
 #vue-app .uni-rg-tcard h3{font-size:16px;margin-bottom:2px}
 #vue-app .uni-rg-tcard p{font-size:14px}
 #vue-app .uni-rg-tbtn{margin-top:10px;font-size:14px;padding:8px 14px;justify-self:start}
 /* Weitere Systeme, Beratung */
 #vue-app .uni-rg-subhead{font-size:18px}
 #vue-app .uni-rg-chips{gap:8px;margin-bottom:32px}
 #vue-app .uni-rg-chips a{padding:6px 12px;font-size:13px}
 #vue-app .uni-rg-help{gap:10px}
 #vue-app .uni-rg-box{padding:16px}
 #vue-app .uni-rg-box h2{font-size:19px}
 #vue-app .uni-rg-box p{font-size:14px}
 #vue-app .uni-rg-box li a{padding:4px 0}
}