/*
Theme Name: ECoTherm
Theme URI: https://eco-therm.info/
Author: Darazi & Walter Consulting GbR
Description: Individuelles WordPress-Theme für ECoTherm – Wasser, Wärme & Klima. Basierend auf dem bereitgestellten Entwurf.
Version: 1.0.1
Text Domain: ecotherm
*/

:root { --ec-blue:#1e3a5f; --ec-red:#ef4444; --ec-slate:#64748b; --ec-border:#e2e8f0; }
html { scroll-behavior:smooth; }
body { margin:0; background:#ffffff; font-family: 'Public Sans', Arial, sans-serif; color: #475569; }
* { box-sizing:border-box; }
h1, h2, h3, h4, h5, h6 { font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif; }
a { color:#1e3a5f; text-decoration:none; }
a:hover { color:#ef4444; }
input, textarea, button { font-family:'Public Sans',Arial,sans-serif; }
input::placeholder, textarea::placeholder { color:#94a3b8; }
.site-shell { width:100%; max-width: none; margin: 0; background: #ffffff; overflow: hidden; }
.site-container { width:min(1216px, calc(100% - 48px)) !important; margin-left:auto !important; margin-right:auto !important; }

.header-inner { position:relative; }
.mobile-menu-toggle { display:none; width:44px; height:44px; padding:10px; border:0; border-radius:6px; background:#fff; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.mobile-menu-toggle span { display:block; width:22px; height:2px; background:#1e3a5f; transition:transform .2s ease,opacity .2s ease; }
.header-inner.menu-open .mobile-menu-toggle span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.header-inner.menu-open .mobile-menu-toggle span:nth-child(2) { opacity:0; }
.header-inner.menu-open .mobile-menu-toggle span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.custom-logo-link { display:block; line-height:0; }
.custom-logo { max-height:56px; width:auto; }
.ecotherm-hp { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.contact-status { margin:0 0 22px; padding:14px 16px; border-radius:4px; font-size:14px; line-height:20px; }
.contact-status.success { background:#ecfdf5; color:#166534; border:1px solid #bbf7d0; }
.contact-status.error { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.page-content { width:min(960px, calc(100% - 48px)); margin:0 auto; padding:80px 0 110px; min-height:60vh; color:#334155; font-family:'Public Sans',Arial,sans-serif; font-size:17px; line-height:1.75; }
.page-content h1,.page-content h2,.page-content h3 { color:var(--ec-blue); font-family:'Barlow Condensed','Arial Narrow',Arial,sans-serif; }
.page-content h1 { font-size:52px; line-height:1.05; text-transform:uppercase; }
.page-content a { text-decoration:underline; }

.site-footer {
    background: #0f172a;
    padding: 64px 0 36px;
    color: #cbd5e1;
}

.footer-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 56px;
    align-items: start;
    padding-top: 0 !important;
}

.footer-logo-wrap {
    width: 230px;
    height: 48px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-logo {
    width: 222px;
    height: 40px;
    object-fit: contain;
    display: block;
}

.footer-tagline {
    margin-top: 26px;
    font-size: 16px;
    line-height: 24px;
    color: #cbd5e1;
}

.footer-address {
    margin-top: 19px;
    font-size: 14px;
    line-height: 20px;
    color: #64748b;
}

.footer-heading {
    font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #ffffff;
}

.footer-list {
    margin-top: 21px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.footer-list-item {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    font-size: 16px;
    line-height: 20px;
    color: #cbd5e1;
}

.footer-list-item svg {
    flex: 0 0 auto;
    color: #94a3b8;
}

.footer-contact-link {
    width: fit-content;
    color: #cbd5e1;
}

.footer-contact-link:hover {
    color: #ffffff;
}

.footer-emergency-button {
    margin-top: 20px;
    width: 173px;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 22px;
    background: #ef4444;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
}

.footer-emergency-button:hover {
    color: #ffffff;
    background: #dc3f3f;
}

.footer-divider {
    height: 1px;
    margin-top: 34px !important;
    background: #1e3a5f;
}

.footer-legal-nav {
    margin-top: 34px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    text-align: center;
    color: #64748b;
}

.footer-legal-nav a {
    color: #64748b;
    text-decoration: none;
    transition: color .2s ease;
}

.footer-legal-nav a:hover {
    color: #ffffff;
}

.footer-legal-separator {
    color: #64748b;
}

.footer-copyright {
    margin-top: 34px !important;
    text-align: center;
    font-size: 14px;
    line-height: 20px;
    color: #64748b;
}

@media (max-width: 1280px) {
  .site-shell { max-width:none; }
  .header-inner { width:min(1120px, calc(100% - 48px)) !important; }
  .hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; column-gap:48px !important; }
  .hero-section { height:auto !important; padding-bottom:80px; }
  .hero-grid { padding-top:80px !important; }
  .hero-copy h1 { font-size:52px !important; line-height:1 !important; }
  .hero-copy p { font-size:18px !important; }
  .hero-image-card { height:460px !important; }
  .services-section,.about-section,.contact-section,.site-footer { height:auto !important; }
  .services-section { padding-bottom:90px; }
  .services-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:24px !important; }
  .service-card { height:auto !important; min-height:553px; }
  .about-section { padding-bottom:96px; }
  .about-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; column-gap:48px !important; }
  .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .contact-section { padding-bottom:96px; }
  .contact-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; column-gap:36px !important; }
  .contact-form-card { height:auto !important; }
  .contact-form-card input,.contact-form-card textarea,.contact-form-card button { max-width:100%; }
}

@media (max-width: 900px) {
  .footer-grid { grid-template-columns:1fr 1fr !important; gap:50px 42px !important; }
  .footer-contact-column { grid-column:1 / -1; }

  .site-header { height:auto !important; }
  .header-inner { height:72px !important; }
  .site-logo-img { height:46px !important; max-width:200px; object-fit:contain; }
  .mobile-menu-toggle { display:flex; margin-left:auto; }
  .desktop-nav { display:none !important; position:absolute; z-index:50; top:64px; left:0; right:0; padding:18px 22px; background:#ffffff; border:1px solid #e2e8f0; box-shadow:0 14px 34px rgba(30,58,95,.14); flex-direction:column; align-items:flex-start !important; gap:16px !important; }
  .header-inner.menu-open .desktop-nav { display:flex !important; }
  .header-phone { width:auto !important; min-width:196px; padding:0 16px; }
  .hero-grid { display:flex !important; flex-direction:column; padding-top:56px !important; gap:42px; }
  .hero-copy h1 { font-size:48px !important; line-height:1.02 !important; max-width:650px; }
  .hero-copy > div[style*="align-items: stretch"] { flex-wrap:wrap; }
  .hero-copy > div[style*="align-items: stretch"] > a { width:auto !important; min-width:240px; flex:1; }
  .hero-media-wrap { width:100%; max-width:680px; margin:0 auto !important; }
  .hero-image-card { height:470px !important; }
  .services-inner,.about-grid,.contact-inner { padding-top:72px !important; }
  .services-grid { grid-template-columns:1fr !important; max-width:620px; margin-left:auto; margin-right:auto; }
  .service-card { min-height:0; }
  .service-image { height:270px !important; }
  .about-grid { grid-template-columns:1fr !important; row-gap:54px; }
  .about-grid > div:first-child > div[style*="width: 576px"] { width:100% !important; }
  .stats-grid { max-width:620px; }
  .contact-grid { grid-template-columns:1fr !important; row-gap:32px; max-width:680px; margin-left:auto; margin-right:auto; }
  .contact-form-card { padding:32px !important; }
  .contact-form-card > input,.contact-form-card textarea,.contact-form-card button { width:100% !important; }
  .contact-form-card > div[style*="grid-template-columns: 239px 239px"] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; column-gap:20px !important; }
  .contact-form-card > div[style*="grid-template-columns: 239px 239px"] input { width:100% !important; }
  .contact-details-card { height:auto !important; min-height:410px; }
}

@media (max-width: 600px) {
  .site-footer { padding-top:50px; padding-bottom:30px; }
  .footer-grid { grid-template-columns:1fr !important; gap:42px !important; }
  .footer-contact-column { grid-column:auto; }
  .footer-divider { margin-top:44px !important; }
  .footer-legal-nav { margin-top:30px !important; gap:5px; }
  .footer-copyright { margin-top:24px !important; padding:0 16px; }

  .site-container,.page-content { width:calc(100% - 32px) !important; }
  .header-inner { width:calc(100% - 28px) !important; height:66px !important; gap:10px; }
  .site-logo-img { height:38px !important; max-width:150px; }
  .header-phone { min-width:0; width:46px !important; height:46px !important; border-radius:50% !important; padding:0 !important; }
  .header-phone span { display:none; }
  .hero-grid { padding-top:42px !important; }
  .hero-copy h1 { margin-top:22px !important; font-size:39px !important; line-height:1.03 !important; }
  .hero-copy p { font-size:17px !important; line-height:26px !important; }
  .hero-copy > div[style*="align-items: stretch"] { display:grid !important; grid-template-columns:1fr !important; gap:12px !important; }
  .hero-copy > div[style*="align-items: stretch"] > a { width:100% !important; min-width:0; height:66px !important; padding:0 22px !important; }
  .hero-copy > div[style*="font-size: 14px"] { flex-wrap:wrap; gap:14px 20px !important; }
  .hero-image-card { height:320px !important; }
  .hero-media-wrap > div[style*="position: absolute"] { left:12px !important; top:auto !important; bottom:-26px !important; width:145px !important; height:90px !important; padding:16px !important; }
  .hero-media-wrap > div[style*="position: absolute"] > div:first-child { font-size:30px !important; line-height:32px !important; }
  .services-section { padding-bottom:64px; }
  .services-inner,.about-grid,.contact-inner { padding-top:58px !important; }
  .services-inner h2,.about-grid h2,.contact-inner h2 { font-size:40px !important; line-height:1.05 !important; }
  .services-inner > p,.about-grid p,.contact-inner > p { font-size:16px !important; line-height:26px !important; }
  .services-grid { margin-top:42px !important; }
  .service-image { height:220px !important; }
  .service-body { padding:26px !important; }
  .about-section { padding-bottom:64px; }
  .about-grid > div:first-child > div[style*="height: 98px"] { height:auto !important; min-height:98px; padding:16px !important; align-items:flex-start !important; flex-direction:column; }
  .about-grid > div:first-child > div[style*="height: 98px"] > div:first-child { width:100% !important; max-width:230px; }
  .stats-grid { grid-template-columns:1fr 1fr !important; gap:12px !important; }
  .stats-grid > div { height:116px !important; }
  .stats-grid > div > div:first-child { font-size:38px !important; line-height:40px !important; }
  .contact-section { padding-bottom:64px; }
  .contact-grid { margin-top:42px !important; }
  .contact-form-card { padding:22px !important; }
  .contact-form-card > div[style*="grid-template-columns: 239px 239px"] { grid-template-columns:1fr !important; row-gap:20px; }
  .contact-form-card textarea { height:135px !important; }
  .contact-details-card { padding:24px !important; min-height:0; }
  .location-card { height:210px !important; }
}