/*
Theme Name: WetterCube
Theme URI: https://wettercube.de
Author: Jan Althaus
Description: Block-Theme für wettercube.de im hellen WetterCube-Design (weiß, Himmelblau, Orange, Navy). Zweisprachig (Deutsch, Englisch) ohne Zusatz-Plugin.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wettercube
*/

:root{--wc-himmel:#87ceeb;--wc-himmel-dunkel:#2b7fa3;--wc-kachel:#e0f7ff;--wc-flaeche:#f5fbfe;--wc-rand:#b9d6e4;--wc-text2:#4b5563;--wc-orange:#ce4b11;--wc-gruen:#0fa64a;--wc-navy:#0b2545}
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased}
a{text-underline-offset:3px}
img{max-width:100%;height:auto}
.wp-site-blocks>*{margin-block-start:0!important;margin-block-end:0!important}

/* Kopf */
.wc-kopf{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.93);backdrop-filter:blur(8px);border-bottom:1px solid #e5eef3}
.admin-bar .wc-kopf{top:32px}
.wc-kopf-in{max-width:1120px;margin:0 auto;padding:0 20px;height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.wc-marke{font-weight:600;font-size:26px;letter-spacing:-.5px;color:#111!important;text-decoration:none!important}
.wc-marke span{color:var(--wc-himmel)}
.wc-nav{display:flex;align-items:center;gap:22px}
.wc-nav a{text-decoration:none;color:#111;font-size:15px;font-weight:500}
.wc-nav a:hover{color:var(--wc-himmel-dunkel)}
.wc-nav a.wc-nav-knopf{background:var(--wc-navy);color:#fff;padding:9px 16px;border-radius:999px}
.wc-nav a.wc-nav-knopf:hover{color:#fff;background:#13355f}
.wc-sprache{display:inline-flex;align-items:center;gap:7px;font-size:13px;letter-spacing:.06em;border:1px solid var(--wc-rand);padding:4px 11px 4px 9px;border-radius:999px;color:var(--wc-himmel-dunkel)!important}
.wc-flagge{width:20px;height:auto;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.18);flex:none}
.wc-burger,.wc-burger-an{display:none}
@media(max-width:900px){
  .wc-burger{display:block;cursor:pointer;font-size:28px;line-height:1;padding:6px 10px;color:#111}
  .wc-nav{display:none;position:absolute;left:0;right:0;top:68px;background:#fff;flex-direction:column;align-items:flex-start;gap:0;padding:8px 20px 18px;border-bottom:1px solid #e5eef3}
  .wc-nav a{padding:10px 0;width:100%}
  .wc-burger-an:checked~.wc-nav{display:flex}
}

/* Sektionen der Startseite und der Produktseiten */
.wc-sektion{padding:68px 20px!important}
.wc-sektion.wc-hinweise{padding:30px 20px 10px!important}
.wc-sektion.wc-hinweise .wc-box{margin:14px 0}
.wc-hell{background:var(--wc-flaeche)}
.wc-hero{background:linear-gradient(180deg,var(--wc-kachel) 0%,#fff 100%);padding:64px 20px 40px!important}
.wc-hero h1{font-size:clamp(2.1rem,4.4vw,2.9rem);line-height:1.12;letter-spacing:-1px}
.wc-hero h1 em{font-style:normal;color:var(--wc-himmel-dunkel)}
.wc-klein{font-size:13px!important;letter-spacing:.14em;text-transform:uppercase;color:var(--wc-himmel-dunkel);font-weight:600;margin-bottom:6px}
.wc-lead{font-size:1.15rem;color:var(--wc-text2)}
.wc-geraet{background:#14181f;border-radius:26px;padding:16px;box-shadow:0 30px 60px -20px rgba(11,37,69,.45);margin:0}
.wc-geraet img{border-radius:10px;width:100%;display:block}
.wc-zeile{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;font-size:14px;color:var(--wc-text2)}
.wc-zeile span{background:#fff;border:1px solid var(--wc-rand);padding:4px 12px;border-radius:999px}
.wc-raster{display:grid;gap:16px;margin-top:26px}
.wc-raster.r3{grid-template-columns:repeat(3,1fr)}
.wc-raster.r5{grid-template-columns:repeat(5,1fr);gap:14px}
.wc-raster.r2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.wc-raster.r3,.wc-raster.r2{grid-template-columns:1fr}.wc-raster.r5{grid-template-columns:1fr 1fr}}
.wc-karte{background:#fff;border:1px solid var(--wc-rand);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:6px}
.wc-karte p{margin:0}
.wc-karte.entw{border-color:var(--wc-himmel);box-shadow:0 0 0 3px #e6f6fd}
.wc-karte.plan{border-style:dashed;color:var(--wc-text2)}
.wc-karte .wc-name{font-size:1.25rem;font-weight:600;letter-spacing:-.3px;color:#111}
.wc-karte .wc-q{font-size:13px;color:var(--wc-text2);letter-spacing:.05em}
.wc-karte .wc-name a{color:#111;text-decoration:none}
.wc-karte .wc-name a:hover{text-decoration:underline}
.wc-karte small,.wc-karte .wc-kurz{color:var(--wc-text2);font-size:14px}
.wc-pille{align-self:flex-start;display:inline-block;font-size:12px!important;font-weight:700;padding:3px 10px;border-radius:999px;background:#111;color:#fff}
.wc-pille.entw{background:var(--wc-himmel);color:#06324a}
.wc-pille.plan{background:#fff;color:#6b7280;border:1px dashed #9ca3af}
.wc-fk{background:var(--wc-kachel);border:1px solid var(--wc-rand);border-radius:16px;padding:20px}
.wc-fk h3{margin:6px 0 6px;font-size:1.2rem;font-weight:600}
.wc-fk p{margin:0;color:var(--wc-text2);font-size:15px}
.wc-fk .wc-sym{font-size:26px;line-height:1.2}
.wc-bild{border:1px solid var(--wc-rand);border-radius:12px;overflow:hidden}
.wc-bild img{display:block;width:100%}
.wc-bild figcaption,.wp-block-image.wc-bild figcaption{font-size:13px;color:var(--wc-text2);text-align:center;padding:6px}
.wc-frei{background:var(--wc-navy);color:#e6eef6;border-radius:20px;padding:34px 38px!important}
.wc-frei h2,.wc-frei h3,.wc-frei strong,.wc-frei b{color:#fff}
.wc-frei p,.wc-frei li{color:#c4d3e3}
.wc-frei a{color:var(--wc-himmel)}
.wc-frei .wc-klein{color:var(--wc-himmel)}
.wc-modul{background:#fff;border:1px dashed var(--wc-himmel);border-radius:16px;padding:16px 20px}
.wc-box{margin:24px 0;border:1px solid var(--wc-rand);border-left:5px solid var(--wc-himmel);border-radius:10px;padding:14px 18px;background:var(--wc-flaeche)}
.wc-box.warn{border-left-color:var(--wc-orange);background:#fff7f2}

/* Knoepfe */
.wp-block-button__link{border-radius:12px!important;font-weight:600;padding:13px 22px!important}
.wp-block-button.is-style-outline .wp-block-button__link{background:#fff;color:var(--wc-navy);border:2px solid var(--wc-himmel)}

/* Tabellen (Vergleich) */
.wp-block-table table{border-collapse:collapse;width:100%;font-size:15px}
.wp-block-table th{background:var(--wc-kachel);text-align:left}
.wp-block-table td,.wp-block-table th{border:1px solid var(--wc-rand);padding:9px 12px;vertical-align:top}
.wp-block-table figure,.wp-block-table{overflow-x:auto}

/* Fuss */
.wc-fuss{background:#0a1626;color:#9fb1c4;padding:40px 20px;font-size:14px}
.wc-fuss-in{max-width:1120px;margin:0 auto;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.wc-fuss a{color:#cfe3f1;margin-right:16px;text-decoration:none}
.wc-fuss a:hover{text-decoration:underline}
.wc-fuss b{color:#fff}
.wc-fuss .wc-pico{display:block;margin-top:10px;font-size:13px}

/* Kontaktformular */
.wc-form{max-width:100%}
.wc-form label{display:block;font-weight:600;margin:14px 0 4px}
.wc-form input[type=text],.wc-form input[type=email],.wc-form textarea{width:100%;padding:11px 13px;border:1px solid var(--wc-rand);border-radius:10px;font:inherit;background:#fff}
.wc-form input:focus,.wc-form textarea:focus{outline:2px solid var(--wc-himmel);border-color:var(--wc-himmel)}
.wc-form .wc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.wc-form .wc-einwilligung label{font-weight:400;font-size:14px;display:flex;gap:10px;align-items:flex-start}
.wc-form button{margin-top:18px;background:var(--wc-navy);color:#fff;border:0;border-radius:12px;padding:13px 24px;font:inherit;font-weight:600;cursor:pointer}
.wc-form button:hover{background:#13355f}
.wc-meldung{padding:14px 18px;border-radius:10px;margin-bottom:18px}
.wc-meldung.ok{background:#e9f9ef;border:1px solid #9fdcb4}
.wc-meldung.fehler{background:#fff1f1;border:1px solid #f0aaaa}

/* Blog */
.wc-beitrag-karte{background:#fff;border:1px solid var(--wc-rand);border-radius:16px;padding:20px}
.wc-beitrag-karte h2{font-size:1.4rem;margin:0 0 6px}
.wc-datum{font-size:13px;color:var(--wc-text2)}

/* Hardware-Assistent */
.wc-assistent{margin:20px 0;border:1px solid var(--wc-rand);border-radius:14px;padding:20px;background:var(--wc-flaeche)}
.wc-assistent-form fieldset{border:0;margin:0 0 10px;padding:0}
.wc-assistent-form legend{font-weight:600;margin-bottom:6px;padding:0}
.wc-assistent-form label{display:block;margin:4px 0;cursor:pointer}
.wc-assistent-form input{margin-right:6px}
.wc-assistent-hinweis{margin:14px 0 0;font-weight:500;color:var(--wc-orange)}
.wc-assistent-liste{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.wc-assistent-karte{background:#fff;border:1px solid var(--wc-rand);border-radius:12px;padding:14px 18px}
.wc-assistent-karte h3{margin:0 0 6px;font-size:18px}
.wc-assistent-karte ul{margin:6px 0;padding-left:18px;font-size:15px}
.wc-assistent-karte.passt{border-color:var(--wc-gruen);box-shadow:0 0 0 2px rgba(15,166,74,.15)}
.wc-assistent-karte.passt-nicht{opacity:.62}
.wc-assistent-passt{margin:0 0 4px;color:var(--wc-gruen);font-weight:600;font-size:14px}
.wc-assistent-gruende{margin:4px 0;color:var(--wc-orange);font-size:14px}
.wc-assistent-link{font-weight:500}
