/* ═══ CRNOV — Sub-Page Components (pages.css) ═══════════════════════════════
   Ergänzt styles.css (Landing). Nutzt DIESELBEN Tokens (var(--lime) #A1C616 Accent,
   Dach/Logo #93c020, Text #1F2418, bg-alt #F4F7F2, Archivo Black + Inter).
   VERBOTEN weiterhin: #000 hart · #5BC0DE · #00CC00 · Bento-Cards · Stock-Illustration · Google-Fonts-CDN live.
   ELEMENTOR-MAP: jede .section = 1 Container (boxed 1280). .prose = Text-Editor-Widget.
   .card = Loop-Item (Posts). .contact-form = Elementor/Fluent-Form. Reveal via data-reveal (app.js).
   ══════════════════════════════════════════════════════════════════════════ */

/* ---------- Display-Font auf Sub-Page-Headings ---------- */
.page-hero__title,.feature__name,.prose h2,.post-card__title,.cta-band__head,
.faq__q,.stat-lg__num,.split__head,.legal h2,.value__name,.ref-block__head{
  font-family:'Archivo Black','Bebas Neue',system-ui,sans-serif;
  font-weight:400;text-transform:uppercase;letter-spacing:-.03em;line-height:.94;
  overflow-wrap:break-word;hyphens:manual;
}

/* ---------- Multi-Page Nav: Active-State ---------- */
.nav__links a.is-active{color:var(--lime-dark)}
.nav__links a.is-active::after{content:"";display:block;height:2px;background:var(--lime);margin-top:3px}
.overlay__nav a.is-active{color:var(--lime)}

/* ---------- Section-Rhythmus ---------- */
.section{padding-block:var(--section)}
.section--alt{background:var(--bg-alt)}
.section--tight{padding-block:var(--block)}
.section-head{max-width:60ch;margin-bottom:clamp(2rem,1rem + 3vw,4rem)}
.section-head .eyebrow{margin-bottom:var(--space-4)}
.section-head h2{font-size:var(--fs-h2)}
.section-head p{color:var(--text-2);font-size:var(--fs-lead);margin-top:var(--space-4)}

/* ---------- Page-Hero (Sub-Page-Kopf, kleiner als Landing-Hero) ---------- */
.page-hero{
  padding-top:clamp(8rem,6rem + 8vw,12rem);
  padding-bottom:clamp(3rem,2rem + 4vw,6rem);
  position:relative;overflow:hidden;
}
.page-hero--alt{background:var(--bg-alt)}
.page-hero__inner{position:relative;z-index:2}
.page-hero__crumb{display:flex;gap:.6rem;align-items:center;font-size:var(--fs-xs);color:var(--text-3);margin-bottom:var(--space-6);flex-wrap:wrap}
.page-hero__crumb a:hover{color:var(--lime-dark)}
.page-hero__title{font-size:clamp(2.75rem,1.8rem + 5vw,6.5rem);margin:var(--space-2) 0 0}
.page-hero__title .tx-accent{color:var(--lime-dark)}
.page-hero__lead{max-width:52ch;margin-top:var(--space-6);font-size:var(--fs-lead);color:var(--text-2)}
.page-hero__accent{position:absolute;top:0;right:0;width:clamp(80px,12vw,160px);aspect-ratio:1;background:var(--lime);z-index:1;opacity:.9}

/* ---------- Prose / Longform (Artikel + Rechtstexte) ---------- */
.prose{max-width:70ch;color:var(--text)}
.prose > * + *{margin-top:1.15em}
.prose h2{font-size:var(--fs-h3);margin-top:2.2em;color:var(--text)}
.prose h3{font-family:'Inter',sans-serif;font-weight:700;font-size:1.15rem;margin-top:1.8em;letter-spacing:-.01em}
.prose p,.prose li{color:var(--text-2);line-height:1.7}
.prose strong{color:var(--text);font-weight:700}
.prose a{color:var(--lime-dark);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:var(--lime-hover)}
.prose ul,.prose ol{padding-left:1.3em}
.prose ul li{list-style:disc}
.prose ol li{list-style:decimal}
.prose li{margin-top:.5em}
.prose blockquote{border-left:3px solid var(--lime);padding-left:var(--space-5);font-size:var(--fs-lead);color:var(--text);font-style:normal}
.prose img{margin-block:1.5em;width:100%}
.prose hr{border:none;border-top:1px solid var(--border);margin-block:2.5em}
.prose code{background:var(--bg-alt);padding:.1em .4em;font-size:.9em;border:1px solid var(--border)}

/* ---------- Split (Text ↔ Media, asymmetrisch, alternierend) ---------- */
.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--gap-lg);align-items:center}
.split--reverse{direction:rtl}
.split--reverse > *{direction:ltr}
.split__head{font-size:var(--fs-h2)}
.split__body{color:var(--text-2);margin-top:var(--space-5);font-size:var(--fs-body)}
.split__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg-alt)}
.split__media img{width:100%;height:100%;object-fit:cover}
.split__media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(31,36,24,.18),transparent 55%)}

/* ---------- Feature-Blocks (Leistungen im Detail) ---------- */
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap-lg);align-items:center;padding-block:var(--block)}
.feature + .feature{border-top:1px solid var(--border)}
.feature:nth-child(even) .feature__media{order:-1}
.feature__idx{font-family:'Archivo Black',system-ui,sans-serif;font-size:clamp(2.5rem,2rem + 3vw,5rem);color:transparent;-webkit-text-stroke:1.5px var(--border-strong);line-height:1;margin-bottom:var(--space-4)}
.feature__name{font-size:var(--fs-h2);margin-bottom:var(--space-4)}
.feature__body{color:var(--text-2)}
.feature__list{margin-top:var(--space-6);display:grid;gap:.7rem}
.feature__list li{display:flex;gap:.7rem;align-items:flex-start;color:var(--text-2)}
.feature__list li::before{content:"→";color:var(--lime-dark);flex:none;font-weight:700}
.feature__media{position:relative;aspect-ratio:5/4;overflow:hidden;background:var(--bg-alt)}
.feature__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.feature:hover .feature__media img{transform:scale(1.05)}

/* ---------- Card-Grid (News-Index / generische Karten) ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(1.25rem,2vw,2rem)}
.post-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.post-card:hover{border-color:var(--lime);transform:translateY(-4px)}
.post-card__media{aspect-ratio:16/10;overflow:hidden;background:var(--bg-alt)}
.post-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.post-card:hover .post-card__media img{transform:scale(1.06)}
.post-card__body{padding:clamp(1.25rem,2vw,1.75rem);display:flex;flex-direction:column;gap:var(--space-3);flex:1}
.post-card__cat{font-size:var(--fs-2xs);font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--lime-dark)}
.post-card__title{font-size:clamp(1.25rem,1rem + 1vw,1.6rem);line-height:1.05}
.post-card__excerpt{color:var(--text-2);font-size:var(--fs-sm);flex:1}
.post-card__meta{display:flex;justify-content:space-between;align-items:center;color:var(--text-3);font-size:var(--fs-xs);margin-top:var(--space-2);border-top:1px solid var(--border);padding-top:.9rem}
.post-card__meta .arrow{color:var(--lime-dark);font-size:1.2rem;transition:transform var(--dur) var(--ease)}
.post-card:hover .arrow{transform:translateX(5px)}

/* ---------- Pills / Tags / Themen-Row ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:.6rem}
.pill{border:1px solid var(--border-strong);padding:var(--space-2) var(--space-4);font-size:var(--fs-xs);color:var(--text-2);border-radius:999px}
.pill--active,.pill:hover{border-color:var(--lime);color:var(--lime-dark)}

/* ---------- Stat-Row (groß, für Über-uns) ---------- */
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:clamp(1.5rem,3vw,3rem);border-top:1px solid var(--border);padding-top:clamp(2rem,3vw,3rem)}
.stat-lg__num{font-size:clamp(2.5rem,2rem + 4vw,5rem);color:var(--text);line-height:1}
.stat-lg__num .tx-accent{color:var(--lime-dark)}
.stat-lg__label{color:var(--text-2);margin-top:var(--space-2);font-size:var(--fs-sm)}

/* ---------- Values / Prinzipien ---------- */
.value-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(1.5rem,2.5vw,2.5rem)}
.value{border-top:2px solid var(--lime);padding-top:var(--space-5)}
.value__name{font-size:var(--fs-h3);margin-bottom:.6rem;hyphens:auto;-webkit-hyphens:auto}
.value__body{color:var(--text-2);font-size:var(--fs-sm)}

/* ---------- Referenz-Logo-Slots (Farb-Platzhalter, bis echte Logos da) ---------- */
.ref-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:clamp(1rem,1.5vw,1.5rem)}
.ref-logo{aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;padding:var(--space-6);border:1px solid var(--border);font-family:'Archivo Black',system-ui,sans-serif;text-transform:uppercase;letter-spacing:-.02em;font-size:1.5rem;color:#FFFFFF;text-align:center}

/* ---------- Kontakt-Form ---------- */
.contact-form{display:grid;gap:var(--space-5)}
.field{display:grid;gap:var(--space-2)}
.field label{font-size:var(--fs-xs);font-weight:600;color:var(--text)}
.field label .req{color:var(--lime-dark)}
.field input,.field textarea,.field select{
  font:inherit;font-size:1rem;color:var(--text);background:var(--surface);
  border:1px solid var(--border-strong);border-radius:0;padding:.9rem var(--space-4);width:100%;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--lime);box-shadow:var(--lime-glow)}
.field textarea{min-height:150px;resize:vertical}
.field--row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.form-check{display:flex;gap:.6rem;align-items:flex-start;font-size:var(--fs-xs);color:var(--text-2)}
.form-check input{width:1.1rem;height:1.1rem;flex:none;margin-top:.15rem;accent-color:var(--lime)}
.form-note{font-size:var(--fs-xs);color:var(--text-3)}

/* ---------- Info-Liste (NAP / Öffnungszeiten) ---------- */
.info-list{display:grid;gap:var(--space-6)}
.info-item__label{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.1em;color:var(--text-3);margin-bottom:.35rem}
.info-item__value{font-size:1.05rem;color:var(--text)}
.info-item__value a:hover{color:var(--lime-dark)}
.hours{display:grid;gap:.4rem}
.hours__row{display:flex;justify-content:space-between;gap:var(--space-4);padding-block:.4rem;border-bottom:1px solid var(--border);font-size:var(--fs-sm)}
.hours__row span:last-child{color:var(--text-2)}

/* ---------- FAQ (details/summary, no-JS accessible) ---------- */
.faq{display:grid;gap:0;border-top:1px solid var(--border)}
.faq__item{border-bottom:1px solid var(--border)}
.faq__item summary{list-style:none;cursor:pointer;padding:1.4rem 0;display:flex;justify-content:space-between;gap:var(--space-4);align-items:center}
.faq__item summary::-webkit-details-marker{display:none}
.faq__q{font-size:clamp(1.05rem,1rem + .5vw,1.35rem)}
.faq__item summary::after{content:"+";color:var(--lime-dark);font-size:1.5rem;flex:none;transition:transform var(--dur) var(--ease)}
.faq__item[open] summary::after{transform:rotate(45deg)}
.faq__a{color:var(--text-2);padding-bottom:1.4rem;max-width:70ch}

/* ---------- CTA-Band (reusable, invers) ---------- */
.cta-band{background:#0B0C0A;color:#F4F6E8;text-align:center;padding-block:clamp(4rem,3rem + 5vw,8rem)}
.cta-band .eyebrow{color:var(--lime)}
.cta-band__head{font-size:var(--fs-h1);margin:var(--space-4) 0}
.cta-band__head .tx-accent{color:var(--lime)}
.cta-band__lead{max-width:48ch;margin:0 auto var(--space-7);color:#A8AC9B}
.cta-band__actions{display:flex;gap:var(--space-4);justify-content:center;flex-wrap:wrap}

/* ---------- Two-col layout (content + sidebar) ---------- */
.layout-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.72fr);gap:clamp(2.5rem,5vw,5rem);align-items:start}

/* ---------- Article meta (news-artikel) ---------- */
.article-meta{display:flex;gap:var(--space-5);flex-wrap:wrap;color:var(--text-3);font-size:var(--fs-xs);margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--border)}
.article-meta .cat{color:var(--lime-dark);font-weight:600;text-transform:uppercase;letter-spacing:.08em}

/* ═══════════════ Responsive ═══════════════ */
@media (max-width:860px){
  .split,.feature,.layout-2{grid-template-columns:1fr;gap:var(--space-7)}
  .split--reverse{direction:ltr}
  .feature:nth-child(even) .feature__media{order:0}
  .field--row{grid-template-columns:1fr}
  .page-hero__accent{width:70px}
}
@media (prefers-reduced-motion:reduce){
  .post-card,.post-card__media img,.feature__media img,.faq__item summary::after,.post-card__meta .arrow{transition:none}
}