/*
Theme Name: KFZ Service Krenz
Theme URI: https://example.com/kfz-service-krenz
Author: OpenAI
Author URI: https://openai.com
Description: Modernes, responsives WordPress-Theme für eine KFZ-Meisterwerkstatt. Mit Startseiten-Sektionen für Leistungen, Werkstatt, Öffnungszeiten, Kontakt und Call-to-Action.
Version: 2.3.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: kfz-service-krenz
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, blog, one-column, two-columns
*/

:root {
  --kfz-bg: #05060b;
  --kfz-surface: #0d1017;
  --kfz-surface-2: #141922;
  --kfz-text: #f6f7f8;
  --kfz-muted: #aeb5bf;
  --kfz-accent: #19a93b;
  --kfz-accent-hover: #23c54a;
  --kfz-border: rgba(255,255,255,.10);
  --kfz-radius: 18px;
  --kfz-shadow: 0 18px 55px rgba(0,0,0,.28);
  --kfz-container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--kfz-bg);
  color: var(--kfz-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--kfz-accent-hover); }
button, input, textarea, select { font: inherit; }
.container { width: min(100% - 2rem, var(--kfz-container)); margin-inline: auto; }
.section { padding: 86px 0; }
.section--muted { background: var(--kfz-surface); }
.section-kicker { margin: 0 0 8px; color: var(--kfz-accent); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: .8rem; }
.section-title { margin: 0 0 18px; font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.08; letter-spacing: -.035em; }
.section-intro { max-width: 720px; color: var(--kfz-muted); font-size: 1.08rem; }

.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 9999; background: #fff; color: #000; padding: .8rem 1rem; border-radius: 8px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(5,6,11,.88);
  backdrop-filter: blur(15px);
  border-bottom: 1px solid var(--kfz-border);
}
.header-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.site-branding img { width: auto; max-height: 68px; display: block; }
.site-title { font-weight: 900; font-size: 1.25rem; }
.main-navigation ul { display: flex; align-items: center; gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
.main-navigation a { font-weight: 700; font-size: .95rem; }
.main-navigation .current-menu-item > a { color: var(--kfz-accent); }
.menu-toggle { display: none; border: 1px solid var(--kfz-border); background: var(--kfz-surface); color: #fff; border-radius: 10px; padding: .65rem .8rem; cursor: pointer; }
.header-cta { white-space: nowrap; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .9rem 1.15rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 850;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn--primary { background: var(--kfz-accent); color: #fff; }
.btn--primary:hover { background: var(--kfz-accent-hover); color: #fff; }
.btn--ghost { border-color: var(--kfz-border); background: rgba(255,255,255,.04); }
.btn--ghost:hover { border-color: rgba(255,255,255,.25); color: #fff; }

.hero {
  position: relative;
  overflow: hidden;
  min-height: 680px;
  display: grid;
  align-items: center;
  background:
    radial-gradient(circle at 82% 28%, rgba(25,169,59,.18), transparent 27%),
    linear-gradient(115deg, rgba(5,6,11,.98) 15%, rgba(5,6,11,.86) 58%, rgba(5,6,11,.65)),
    url('assets/images/hero-garage.svg') center/cover no-repeat;
}
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 150px; background: linear-gradient(transparent, var(--kfz-bg)); pointer-events: none; }
.hero-inner { position: relative; z-index: 1; padding: 100px 0 130px; }
.hero-copy { max-width: 760px; }
.hero-badge { display: inline-flex; border: 1px solid rgba(25,169,59,.45); background: rgba(25,169,59,.10); color: #a9f4b8; border-radius: 999px; padding: .45rem .75rem; font-weight: 800; font-size: .82rem; }
.hero h1 { margin: 1.1rem 0 1.2rem; font-size: clamp(3rem, 7vw, 6rem); line-height: .98; letter-spacing: -.055em; }
.hero h1 span { color: var(--kfz-accent); }
.hero p { max-width: 700px; color: #c2c8d1; font-size: clamp(1.05rem, 2vw, 1.25rem); }
.hero-actions { display: flex; gap: .9rem; flex-wrap: wrap; margin-top: 2rem; }
.hero-trust { display: flex; gap: 1.6rem; flex-wrap: wrap; margin-top: 2.4rem; color: #c9ced6; font-weight: 750; font-size: .92rem; }
.hero-trust span::before { content: "✓"; color: var(--kfz-accent); margin-right: .45rem; font-weight: 900; }

.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 2.5rem; }
.service-card { background: linear-gradient(155deg, var(--kfz-surface-2), #0b0e14); border: 1px solid var(--kfz-border); border-radius: var(--kfz-radius); padding: 1.6rem; box-shadow: var(--kfz-shadow); }
.service-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; background: rgba(25,169,59,.13); color: var(--kfz-accent); font-size: 1.35rem; font-weight: 900; }
.service-card h3 { margin: 1.15rem 0 .55rem; font-size: 1.22rem; }
.service-card p { margin: 0; color: var(--kfz-muted); }

.about-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 4rem; }
.about-visual { min-height: 470px; border-radius: 28px; background: linear-gradient(145deg, rgba(25,169,59,.2), transparent 45%), url('assets/images/workshop.svg') center/cover no-repeat; border: 1px solid var(--kfz-border); box-shadow: var(--kfz-shadow); position: relative; overflow: hidden; }
.about-stamp { position: absolute; right: 22px; bottom: 22px; width: 155px; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; text-align: center; background: var(--kfz-accent); color: #fff; font-weight: 900; transform: rotate(-6deg); box-shadow: 0 15px 35px rgba(25,169,59,.3); }
.feature-list { display: grid; gap: .8rem; margin-top: 1.8rem; }
.feature-list div { display: flex; gap: .8rem; align-items: flex-start; color: #d4d8de; }
.feature-list div::before { content: "✓"; flex: 0 0 auto; width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: rgba(25,169,59,.15); color: var(--kfz-accent); font-weight: 900; }

.info-band { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--kfz-border); background: var(--kfz-border); border-radius: var(--kfz-radius); overflow: hidden; }
.info-item { background: var(--kfz-surface-2); padding: 1.5rem; }
.info-item strong { display: block; margin-bottom: .35rem; }
.info-item span, .info-item a { color: var(--kfz-muted); }

.cta-box { padding: clamp(2rem, 6vw, 4.5rem); border-radius: 28px; background: linear-gradient(130deg, #143d1f, #0d1710 62%, #11161f); border: 1px solid rgba(25,169,59,.32); display: flex; align-items: center; justify-content: space-between; gap: 2rem; box-shadow: var(--kfz-shadow); }
.cta-box h2 { margin: 0 0 .7rem; font-size: clamp(2rem, 4vw, 3.3rem); line-height: 1.08; }
.cta-box p { margin: 0; color: #c7d3ca; }

.content-area { padding: 70px 0; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 2.5rem; }
.post-card { padding: 1.5rem; border: 1px solid var(--kfz-border); background: var(--kfz-surface); border-radius: var(--kfz-radius); margin-bottom: 1.25rem; }
.post-card h2, .post-card h1 { margin-top: 0; }
.entry-meta { color: var(--kfz-muted); font-size: .9rem; margin-bottom: 1rem; }
.entry-content a { color: var(--kfz-accent); text-decoration: underline; }
.entry-content h2, .entry-content h3 { line-height: 1.2; }
.sidebar .widget { border: 1px solid var(--kfz-border); background: var(--kfz-surface); border-radius: var(--kfz-radius); padding: 1.25rem; margin-bottom: 1.2rem; }
.widget-title { margin-top: 0; }

.contact-form input, .contact-form textarea,
.wpcf7 input:not([type="submit"]), .wpcf7 textarea {
  width: 100%; background: #0a0d13; color: #fff; border: 1px solid var(--kfz-border); border-radius: 10px; padding: .85rem 1rem;
}
.wpcf7 input[type="submit"] { border: 0; border-radius: 999px; padding: .9rem 1.2rem; background: var(--kfz-accent); color: #fff; font-weight: 800; cursor: pointer; }

.site-footer { border-top: 1px solid var(--kfz-border); background: #030407; padding: 58px 0 24px; }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 2.5rem; }
.footer-logo { max-width: 235px; margin-bottom: 1rem; }
.site-footer h3 { margin-top: 0; }
.site-footer p, .site-footer li, .site-footer a { color: var(--kfz-muted); }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.footer-bottom { border-top: 1px solid var(--kfz-border); margin-top: 2.2rem; padding-top: 1.2rem; color: #7f8793; font-size: .9rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }

@media (max-width: 900px) {
  .menu-toggle { display: inline-flex; }
  .main-navigation { display: none; position: absolute; inset: 84px 1rem auto; padding: 1rem; border: 1px solid var(--kfz-border); border-radius: 14px; background: #0a0d13; box-shadow: var(--kfz-shadow); }
  .main-navigation.is-open { display: block; }
  .main-navigation ul { flex-direction: column; align-items: stretch; gap: .2rem; }
  .main-navigation a { display: block; padding: .75rem; }
  .header-cta { display: none; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .about-grid, .content-grid { grid-template-columns: 1fr; }
  .about-visual { min-height: 380px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .section { padding: 64px 0; }
  .header-inner { min-height: 74px; }
  .site-branding img { max-height: 58px; }
  .main-navigation { inset-block-start: 74px; }
  .hero { min-height: 590px; }
  .hero-inner { padding: 78px 0 100px; }
  .services-grid, .info-band, .footer-grid { grid-template-columns: 1fr; }
  .cta-box { align-items: flex-start; flex-direction: column; }
}

/* Ergänzungen Version 1.1 */
.services-grid--compact { grid-template-columns: repeat(4, 1fr); }
.service-card--compact { display: flex; align-items: center; gap: 1rem; padding: 1.15rem; }
.service-card--compact .service-icon { flex: 0 0 40px; width: 40px; height: 40px; }
.service-card--compact h3 { margin: 0; font-size: 1rem; line-height: 1.35; }
.about-copy { color: var(--kfz-muted); }
.about-copy p { margin: 0 0 1rem; }
.hours-list { display: grid; gap: .32rem; margin-top: .25rem; }
.hours-list > div { display: flex; justify-content: space-between; gap: 1rem; }
.hours-list > div span:first-child { color: #fff; font-weight: 650; }
.hours-list--footer > div span:first-child { color: #d8dde4; }
.hours-list--footer { max-width: 310px; color: var(--kfz-muted); font-size: .93rem; }
@media (max-width: 1050px) { .services-grid--compact { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .services-grid--compact { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .services-grid--compact { grid-template-columns: 1fr; } .hours-list > div { gap: .5rem; } }


/* Firmennews – Version 1.2 */
.section-heading-row { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 2.5rem; }
.section-heading-row .section-title { margin-bottom: .7rem; }
.section-heading-row .section-intro { margin-bottom: 0; }
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.35rem; }
.news-card { overflow: hidden; background: linear-gradient(155deg, var(--kfz-surface-2), #0b0e14); border: 1px solid var(--kfz-border); border-radius: var(--kfz-radius); box-shadow: var(--kfz-shadow); }
.news-card__image { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #090c11; }
.news-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.news-card:hover .news-card__image img { transform: scale(1.035); }
.news-placeholder { width: 100%; height: 100%; display: grid; place-items: center; padding: 1rem; background: radial-gradient(circle at 70% 20%, rgba(25,169,59,.25), transparent 35%), linear-gradient(135deg, #151b24, #07090d); color: rgba(255,255,255,.72); font-weight: 900; letter-spacing: .04em; text-align: center; }
.news-card__body { padding: 1.45rem; }
.news-card__body h2, .news-card__body h3 { margin: .25rem 0 .7rem; line-height: 1.2; }
.news-card__body h2 { font-size: 1.35rem; }
.news-card__body h3 { font-size: 1.25rem; }
.news-card__body p { color: var(--kfz-muted); margin: 0 0 1rem; }
.text-link, .back-link { color: var(--kfz-accent); font-weight: 800; }
.text-link:hover, .back-link:hover { color: var(--kfz-accent-hover); }
.news-empty { padding: 1.5rem; border: 1px dashed rgba(255,255,255,.2); border-radius: var(--kfz-radius); background: rgba(255,255,255,.025); display: grid; gap: .35rem; color: var(--kfz-muted); }
.news-empty strong { color: #fff; }
.archive-header { max-width: 800px; margin-bottom: 2.6rem; }
.news-grid--archive { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pagination-wrap { margin-top: 2.5rem; }
.nav-links { display: flex; gap: .5rem; flex-wrap: wrap; }
.page-numbers { display: inline-grid; place-items: center; min-width: 42px; height: 42px; padding: 0 .7rem; border: 1px solid var(--kfz-border); border-radius: 10px; background: var(--kfz-surface); }
.page-numbers.current { background: var(--kfz-accent); color: #fff; border-color: var(--kfz-accent); }
.article-container { max-width: 900px; }
.news-article { padding: clamp(1.35rem, 4vw, 3rem); border: 1px solid var(--kfz-border); border-radius: 24px; background: var(--kfz-surface); box-shadow: var(--kfz-shadow); }
.news-article__header { margin-top: 2rem; }
.news-article__header h1 { margin: .45rem 0 1rem; font-size: clamp(2.3rem, 6vw, 4.5rem); line-height: 1.03; letter-spacing: -.045em; }
.news-lead { color: #c7cdd5; font-size: 1.2rem; }
.news-article__image { margin: 2rem 0; overflow: hidden; border-radius: 16px; }
.news-article__image img { width: 100%; height: auto; display: block; }
.news-article .entry-content { font-size: 1.08rem; line-height: 1.8; }
.news-article .entry-content > * { max-width: 760px; }
.news-article .entry-content img, .news-article .entry-content .alignwide { max-width: 100%; }
@media (max-width: 900px) { .news-grid, .news-grid--archive { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .section-heading-row { align-items: flex-start; flex-direction: column; } .news-grid, .news-grid--archive { grid-template-columns: 1fr; } }


/* Version 1.3: kompakte Firmennews und Jobangebote */
.news-section--home { padding-top: 4.5rem; padding-bottom: 4.5rem; }
.news-grid--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.news-card--text { min-height: 100%; }
.news-card--text .news-card__body { display: flex; flex-direction: column; height: 100%; }
.news-card--text .news-card__content { color: var(--kfz-muted); line-height: 1.7; margin-top: .65rem; }
.news-card--text .news-card__content p:last-child { margin-bottom: 0; }
.jobs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.35rem; }
.job-card { padding: 1.55rem; border: 1px solid var(--kfz-border); border-radius: var(--kfz-radius); background: linear-gradient(155deg, var(--kfz-surface-2), #0b0e14); box-shadow: var(--kfz-shadow); }
.job-card h3 { margin: .35rem 0 .75rem; font-size: 1.3rem; }
.job-card p { color: var(--kfz-muted); }
.job-meta { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0 1rem; }
.job-meta span { padding: .35rem .65rem; border: 1px solid var(--kfz-border); border-radius: 999px; color: #d8dee8; font-size: .83rem; }
@media (max-width: 900px) { .news-grid--compact, .jobs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .news-grid--compact, .jobs-grid { grid-template-columns: 1fr; } }


/* Version 2.0 */
.news-section--home .section-heading-row { display:block; }
.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:3rem; align-items:start; }
.appointment-form { padding:1.6rem; border:1px solid var(--kfz-border); border-radius:var(--kfz-radius); background:var(--kfz-surface-2); display:grid; gap:1rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.appointment-form label { display:grid; gap:.35rem; font-weight:700; }
.appointment-form input,.appointment-form textarea,.news-search input { width:100%; box-sizing:border-box; background:#080b10; color:#fff; border:1px solid var(--kfz-border); border-radius:10px; padding:.85rem 1rem; }
.privacy-check { grid-template-columns:auto 1fr!important; align-items:start; font-weight:500!important; color:var(--kfz-muted); }
.privacy-check input { width:auto; margin-top:.35rem; }
.form-honeypot { position:absolute; left:-9999px; }
.form-success { color:#80e697; }.form-error { color:#ff9b9b; }.contact-note { margin-top:2rem; padding:1rem; border-left:3px solid var(--kfz-accent); background:rgba(255,255,255,.03); }
.whatsapp-float { position:fixed; right:1.2rem; bottom:1.2rem; z-index:1100; background:#25d366; color:#07150b!important; padding:.85rem 1rem; border-radius:999px; font-weight:900; box-shadow:0 12px 30px rgba(0,0,0,.35); }
.news-search { display:flex; gap:.7rem; margin-top:1.5rem; max-width:650px; }.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}
@media(max-width:640px){.form-row{grid-template-columns:1fr}.whatsapp-float{font-size:.82rem}.news-search{flex-direction:column}}


/* Version 2.3: Cookie-Information */
.cookie-notice { position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:1200; max-width:980px; margin:0 auto; padding:1rem 1.1rem; border:1px solid var(--kfz-border); border-radius:14px; background:rgba(13,16,23,.98); box-shadow:0 18px 55px rgba(0,0,0,.5); backdrop-filter:blur(12px); }
.cookie-notice[hidden] { display:none!important; }
.cookie-notice__inner { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; }
.cookie-notice__text { color:var(--kfz-muted); font-size:.94rem; line-height:1.55; }
.cookie-notice__text strong { display:block; margin-bottom:.15rem; color:#fff; font-size:1rem; }
.cookie-notice__text p { margin:0; }
.cookie-notice__text a { color:var(--kfz-accent); text-decoration:underline; text-underline-offset:2px; }
.cookie-notice__button { flex:0 0 auto; border:0; border-radius:10px; padding:.75rem 1rem; background:var(--kfz-accent); color:#fff; font-weight:850; cursor:pointer; }
.cookie-notice__button:hover,.cookie-notice__button:focus { background:var(--kfz-accent-hover); }
@media(max-width:640px){.cookie-notice{left:.65rem;right:.65rem;bottom:.65rem}.cookie-notice__inner{align-items:stretch;flex-direction:column}.cookie-notice__button{width:100%}.whatsapp-float{bottom:10.5rem}}