/* ==========================================================================
   Fendt-Caravan · Override 2027 (V04-Look) für die verbliebenen Alt-Seiten
   --------------------------------------------------------------------------
   Wird per TypoScript NUR auf Seiten OHNE Snippet geladen (page.layout != 3)
   und als LETZTE CSS (nach dem 2022_css) -> gewinnt per Quell-Reihenfolge.
   Schriften: self-hosted unter /fendt_2027/fonts/ (dort bereits deployt).
   Iteration 1: Schriften, Farb-Tokens, Typografie, Buttons, Links, Footer,
   Nav-Schrift. Nav-Layout/Feinschliff folgt nach Screenshot.
   ========================================================================== */

/* ---- Schriften (identisch zur V04-Haendlerseite) ------------------------- */
@font-face{font-family:'Saira';font-style:normal;font-weight:400;font-display:swap;src:url('/fendt_2027/fonts/saira-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Saira';font-style:normal;font-weight:500;font-display:swap;src:url('/fendt_2027/fonts/saira-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Saira';font-style:normal;font-weight:600;font-display:swap;src:url('/fendt_2027/fonts/saira-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Saira';font-style:normal;font-weight:700;font-display:swap;src:url('/fendt_2027/fonts/saira-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Saira';font-style:normal;font-weight:800;font-display:swap;src:url('/fendt_2027/fonts/saira-latin-800-normal.woff2') format('woff2')}
@font-face{font-family:'Titillium Web';font-style:normal;font-weight:300;font-display:swap;src:url('/fendt_2027/fonts/titillium-web-latin-300-normal.woff2') format('woff2')}
@font-face{font-family:'Titillium Web';font-style:normal;font-weight:400;font-display:swap;src:url('/fendt_2027/fonts/titillium-web-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Titillium Web';font-style:normal;font-weight:600;font-display:swap;src:url('/fendt_2027/fonts/titillium-web-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Titillium Web';font-style:normal;font-weight:700;font-display:swap;src:url('/fendt_2027/fonts/titillium-web-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Saira Variable';font-style:normal;font-weight:100 900;font-stretch:50% 125%;font-display:swap;src:url('/fendt_2027/fonts/saira-variable.woff2') format('woff2-variations')}

/* ---- V04-Tokens auf die vorhandenen CSS-Variablen mappen ----------------- */
/* Diese :root-Regel wird nach variables.css geladen und gewinnt -> alle per
   var(--fendt-caravan_blau) gefärbten Elemente ziehen automatisch nach. */
:root{
  --fendt-caravan_blau:#005279;   /* V04-Blau (vorher #004972) */
  --txt_color:#2a2f33;            /* Fliesstext dunkler/neutraler */
  --txt_color-light:#5b6b74;
  --button-radius:8px;
}

/* ---- Grundtypografie ----------------------------------------------------- */
body{font-family:'Titillium Web',system-ui,'Segoe UI',Arial,sans-serif !important;color:#2a2f33}
p,li,dd,dt,label,input,textarea,select,figcaption,blockquote,small,span,a,button,td,th{
  font-family:'Titillium Web',system-ui,Arial,sans-serif !important;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,
.main-nav,.main-nav a,.main-navi a,.nav-top a,.lang-switch a,.aktuelles-navi a,
.button-nav a,.fixed-side-button a,.footer-copyright{
  font-family:'Saira','Titillium Web',sans-serif !important;
}
h1,h2,h3,h4{color:#005279}

/* ---- Links --------------------------------------------------------------- */
a{color:#005279}
a:hover,a:focus{color:#00405f}

/* ---- Buttons (generisch, V04) ------------------------------------------- */
.btn,button,input[type="submit"],input[type="button"],a.button,.button{
  font-family:'Saira','Titillium Web',sans-serif !important;font-weight:600;border-radius:8px;
}
.btn-primary,.button--primary{background:#005279 !important;border-color:#005279 !important;color:#fff !important}
.btn-primary:hover,.btn-primary:focus{background:#00405f !important;border-color:#00405f !important}

/* ---- Fixed-Side-Flyin (Kaufberater/Konfigurator/adfendture) --------------
   Im V04-Design gibt es keine seitlichen Tabs -> komplett ausblenden
   (die Snippet-Seiten haben sie ebenfalls nicht). Kaufberater/Konfigurator
   sind über das Menü erreichbar. */
.fixed-side-wrapper{display:none !important}

/* ---- Header/Nav: sichtbare Leiste (nav-part-one) explizit auf V04-Schrift -- */
/* Hohe Spezifitaet der navigation.css gezielt ueberschreiben. */
header nav.main-nav .cont-nnn li.nav-level-bau > a,
header nav.main-nav .cont-nnn .nav-top .konfigurator-link a,
header nav.main-nav .cont-nnn .nav-top .katalog-link a,
header nav.main-nav .cont-nnn .haendler-link,
header nav.main-nav .cont-nnn .haendler-link a,
header nav.main-nav .cont-nnn .xtra-katalog-or-aanbod,
header nav.main-nav .cont-nnn .xtra-katalog-or-aanbod a,
header nav.main-nav .lang-switch a,
header nav.main-nav .main-navi a{
  font-family:'Saira','Titillium Web',sans-serif !important;
  letter-spacing:.03em;
}

/* ---- Footer (V04-dunkel) ------------------------------------------------- */
footer{background:#222;color:#cfd3d6}
footer a{color:#cfd3d6}
footer a:hover,footer a:focus{color:#fff}
footer .footer-social a{color:#cfd3d6;font-size:22px;line-height:1}
footer .footer-copyright{color:#9aa4ab}

/* ==========================================================================
   Katalog-Formular (EXT:form) auf V04 – scoped auf .catalougue-form,
   damit nur dieses Formular betroffen ist. Feinschliff live nach Deploy.
   ========================================================================== */
.catalougue-form{padding:48px 0}
.catalougue-form .tx-form,.catalougue-form .tx-form form{max-width:1080px;margin:0 auto}

/* Labels */
.catalougue-form label{font-family:'Saira','Titillium Web',sans-serif !important;font-weight:600;color:#2a2f33;font-size:.95rem;margin-bottom:6px;display:inline-block}

/* Eingabefelder */
.catalougue-form input[type="text"],
.catalougue-form input[type="email"],
.catalougue-form input[type="tel"],
.catalougue-form input[type="number"],
.catalougue-form input[type="search"],
.catalougue-form select,
.catalougue-form textarea{
  width:100%;padding:12px 14px;border:1.5px solid #e2e8ec;border-radius:10px;background:#fff;
  font:inherit;color:#2a2f33;line-height:1.4;transition:border-color .15s ease,box-shadow .15s ease;box-sizing:border-box
}
.catalougue-form textarea{min-height:120px;resize:vertical}
.catalougue-form input:focus,
.catalougue-form select:focus,
.catalougue-form textarea:focus{outline:0;border-color:#005279;box-shadow:0 0 0 3px rgba(0,82,121,.15)}
.catalougue-form input::placeholder,.catalougue-form textarea::placeholder{color:#98a4ac}

/* Abstände */
.catalougue-form .form-group{margin-bottom:18px}
.catalougue-form .form-text{color:#5b6b74;font-size:.85rem;margin-top:4px}
.catalougue-form .required-note{color:#5b6b74;font-size:.85rem}
.catalougue-form .error-message,.catalougue-form .error.form-text{color:#dc3545;font-size:.85rem;margin-top:4px}
.catalougue-form .has-error input,.catalougue-form .has-error select,.catalougue-form .has-error textarea{border-color:#dc3545}

/* Checkboxen / Radios */
.catalougue-form input[type="checkbox"],
.catalougue-form input[type="radio"]{width:18px;height:18px;accent-color:#005279;vertical-align:-3px;margin-right:8px}
.catalougue-form .type-check label,.catalougue-form .type-check-katalog label{font-weight:400;color:#2a2f33}

/* Buttons (Absenden / PDF-Download) */
.catalougue-form .button,
.catalougue-form .nnn-btn,
.catalougue-form .button-2025,
.catalougue-form button[type="submit"],
.catalougue-form input[type="submit"]{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:#005279;color:#fff !important;border:0;border-radius:8px;padding:14px 28px;
  font-family:'Saira','Titillium Web',sans-serif !important;font-weight:600;font-size:1rem;
  cursor:pointer;text-decoration:none;transition:background-color .15s ease
}
.catalougue-form .button:hover,
.catalougue-form .nnn-btn:hover,
.catalougue-form .button-2025:hover,
.catalougue-form button[type="submit"]:hover,
.catalougue-form input[type="submit"]:hover{background:#00405f;color:#fff !important}
.catalougue-form .button[disabled],
.catalougue-form button[disabled],
.catalougue-form input[type="submit"][disabled]{opacity:.45;cursor:not-allowed}
/* „zurück"-Button sekundär */
.catalougue-form .type-button.previous .button,
.catalougue-form .previous .button{background:#fff;color:#005279 !important;border:1.5px solid #005279}
.catalougue-form .previous .button:hover{background:#eef3f6;color:#005279 !important}

/* Katalog-Auswahl-Karten */
.catalougue-form .kataloge{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin:0 0 18px;padding:0;list-style:none}
.catalougue-form .kataloge .type-check-katalog{border:1.5px solid #e2e8ec;border-radius:12px;padding:14px;background:#fff}
.catalougue-form .downloads-extra{margin-top:22px}
.catalougue-form .alert-info{background:#eef4f8;border:1px solid #cfe0ea;color:#2a2f33;border-radius:10px;padding:12px 14px;font-size:.92rem}

/* Versandhinweis-Box auf der Katalog-Seite (fluxcontentprovider .s-txt/.bg-box-2025)
   an V04 angepasst: helle Section statt dunklem Band + soft-blaue Info-Box. */
.catalougue-form .s-txt{background:transparent;padding:36px 0 4px}
.catalougue-form .bg-box-2025{background:#eef4f8;border:1px solid #cfe0ea;border-radius:12px;padding:22px 26px;box-shadow:0 4px 16px rgba(0,40,65,.06)}
.catalougue-form .bg-box-2025 h2{color:#005279;margin:0 0 6px}
.catalougue-form .bg-box-2025 p,.catalougue-form .bg-box-2025{color:#2a2f33}

/* Unterseiten-Teaser (SubpagesTeaser / Aktuelles-Übersicht) auf V04.
   Deckt beide Markups ab: h2+a.button (SubpagesTeaser) und h3+span.nnn-btn
   (Alt-Aktuelles), jeweils Bild- und Text-Variante (ohne Bild). */
.subpage-uebersicht{background:#fff;padding:56px 0}
.subpage-uebersicht .row{display:flex;flex-wrap:wrap}
.subpage-uebersicht [class*="col-"]{margin-bottom:26px;display:flex}
.subpage-uebersicht [class*="col-"] > a{display:flex;width:100%;text-decoration:none}
.subpage-uebersicht .subpage-teaser{position:relative;display:flex;flex-direction:column;justify-content:flex-end;width:100%;min-height:300px;border-radius:16px;overflow:hidden;padding:26px 28px;box-sizing:border-box;background-size:cover;background-position:center;box-shadow:0 8px 26px rgba(0,40,65,.12);transition:transform .2s,box-shadow .2s,background .2s,border-color .2s}
.subpage-uebersicht .subpage-teaser:hover,.subpage-uebersicht a:hover .subpage-teaser{transform:translateY(-4px);box-shadow:0 16px 36px rgba(0,40,65,.18)}
.subpage-uebersicht .subpage-teaser[style*="url"]::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,20,32,0) 30%,rgba(0,20,32,.72));z-index:1}
.subpage-uebersicht .subpage-teaser > *{position:static;z-index:2}
.subpage-uebersicht .subpage-teaser h2,.subpage-uebersicht .subpage-teaser h3{position:static;margin:0 0 16px;color:#fff;font-family:'Saira Variable','Saira',sans-serif;font-weight:700;font-size:1.5rem;line-height:1.15}
.subpage-uebersicht .subpage-teaser .button,.subpage-uebersicht .subpage-teaser .nnn-btn{position:static;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;background:#005279;color:#fff !important;border:0;border-radius:8px;padding:11px 20px;font-family:'Saira','Titillium Web',sans-serif;font-weight:600;text-decoration:none}
.subpage-uebersicht .subpage-teaser .button:hover,.subpage-uebersicht .subpage-teaser .nnn-btn:hover{background:#00405f}
/* Text-Kachel (ohne Hintergrundbild): soft-blau, blaue Schrift, Inhalt oben */
.subpage-uebersicht .subpage-teaser:not([style*="url"]){min-height:190px;justify-content:flex-start;background:#f2f6f8;border:1px solid #e2e8ec}
.subpage-uebersicht .subpage-teaser:not([style*="url"]) h2,.subpage-uebersicht .subpage-teaser:not([style*="url"]) h3{color:#005279}
.subpage-uebersicht .subpage-teaser:not([style*="url"]) .button,.subpage-uebersicht .subpage-teaser:not([style*="url"]) .nnn-btn{margin-top:auto}
.subpage-uebersicht .subpage-teaser:not([style*="url"]):hover{background:#fff;border-color:#cfe0ea}

/* Katalog-Bestätigung (Confirmation-Finisher) als V04-Erfolgsbox */
.catalougue-form .kat-success{display:flex;align-items:flex-start;gap:16px;max-width:1080px;margin:26px auto;background:#e7f4ec;border:1px solid #bfe3cd;border-radius:12px;padding:22px 26px}
.catalougue-form .kat-success .ic{font-size:30px;line-height:1;color:#1a8a4f;flex:none}
.catalougue-form .kat-success .tx{color:#1f3d2b;font-size:1rem;line-height:1.55}
.catalougue-form .kat-success .tx strong{display:block;font-family:'Saira','Titillium Web',sans-serif;font-weight:700;font-size:1.2rem;color:#14663a;margin-bottom:3px}

/* Aktuelles-Übersicht (Live-Markup .cont-nnn a) – elegante Overlay-Karten:
   Landscape statt quadratisch, Titel + Button unten über Verlauf, Hover-Lift. */
section.subpage-uebersicht{margin-bottom:0 !important;background:#fff;padding:52px 0}
section.subpage-uebersicht .cont-nnn a{display:flex !important;width:100%;margin-bottom:28px}
section.subpage-uebersicht .cont-nnn a .subpage-teaser{padding-top:0 !important;height:330px;width:100%;margin-bottom:0 !important;border-radius:16px;overflow:hidden;box-shadow:0 8px 26px rgba(0,40,65,.12);transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column;justify-content:flex-end}
section.subpage-uebersicht .cont-nnn a:hover .subpage-teaser{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,40,65,.20)}
section.subpage-uebersicht .cont-nnn a .subpage-teaser::before{display:none !important}
section.subpage-uebersicht .cont-nnn a .subpage-teaser::after{top:auto !important;bottom:0 !important;height:75% !important;background:linear-gradient(180deg,rgba(0,42,64,0),rgba(0,42,64,.85)) !important;z-index:1 !important}
section.subpage-uebersicht .cont-nnn a .subpage-teaser h3{position:static !important;top:auto !important;left:auto !important;right:auto !important;z-index:2;margin:0 0 14px !important;padding:0 26px !important;font-family:'Saira Variable','Saira',sans-serif;font-weight:700;font-size:1.5rem;line-height:1.15;text-shadow:0 2px 12px rgba(0,0,0,.4)}
section.subpage-uebersicht .cont-nnn a .subpage-teaser span.nnn-btn{position:static !important;bottom:auto !important;right:auto !important;z-index:2;align-self:flex-start;margin:0 26px 26px !important;background:#005279 !important;border-color:#005279 !important;color:#fff !important;border-radius:8px;padding:10px 20px}
section.subpage-uebersicht .cont-nnn a:hover .subpage-teaser span.nnn-btn{background:#00405f !important;border-color:#00405f !important}

/* Teaser-Button "mehr erfahren": einfaches Chevron -> Doppel-Chevron (wie Megamenü) */
.subpage-uebersicht .subpage-teaser .nnn-btn .bi-chevron-right::before{content:"\f280"}

/* ===== V04-Anpassung: Inhalt der News-/Detailseiten =====
   Seiten mit eigenem Header-Banner (.b-header, z. B. Aktuelles-Detailseiten):
   die alte dunkle s-txt-Section + graue bg-box-2025-Karte werden zum cleanen,
   weissen V04-Textblock (zentriert, blaue Saira-Ueberschriften, lesbarer Fliesstext). */
body:has(.b-header) section.s-txt{background:#fff !important;padding:44px 0 64px}
body:has(.b-header) section.s-txt .cont-nnn{padding:0 24px}
body:has(.b-header) section.s-txt .bg-box-2025{background:transparent !important;max-width:920px;margin:0 auto;padding:0 !important;border-radius:0 !important}
body:has(.b-header) section.s-txt .bg-box-2025 h1,
body:has(.b-header) section.s-txt .bg-box-2025 h2,
body:has(.b-header) section.s-txt .bg-box-2025 h3{font-family:'Saira Variable','Saira','Titillium Web',sans-serif;color:#005279 !important;line-height:1.15}
body:has(.b-header) section.s-txt .bg-box-2025 h2{font-size:clamp(1.5rem,2.6vw,2.15rem);font-weight:800;margin:0 0 22px}
body:has(.b-header) section.s-txt .bg-box-2025 h3{font-size:clamp(1.2rem,2vw,1.5rem);font-weight:700;margin:30px 0 12px}
body:has(.b-header) section.s-txt .bg-box-2025 p{font-size:1.06rem;line-height:1.75;color:#2a2f33;margin:0 0 18px}
body:has(.b-header) section.s-txt .bg-box-2025 p:last-child{margin-bottom:0}
@media(max-width:820px){
  body:has(.b-header) section.s-txt{padding:28px 0 40px}
  body:has(.b-header) section.s-txt .cont-nnn{padding:0 18px}
}