/*
Theme Name: Ullrich OHG
Theme URI: https://ullrich-ohg.de
Description: Individuelles Design für die Ullrich OHG (Zimmerei & Baugeschäft) – Child-Theme von Twenty Twenty-Five. Warme Sand/Terracotta-Optik, Fonts Bitter & Work Sans (selbst gehostet), pflegbare Kacheln über Block-Muster und ein Referenz-Bereich mit Filter.
Author: Ullrich OHG
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: ullrich
*/

/* ============================================================
   Selbst gehostete Schriften (Variable Fonts)
   ============================================================ */
@font-face{font-family:'Bitter';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('assets/fonts/bitter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Bitter';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('assets/fonts/bitter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('assets/fonts/worksans-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('assets/fonts/worksans-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ============================================================
   Grundlayout / Container
   ============================================================ */
:root{
  --u-sand:#f8f1e3; --u-ink:#33261a; --u-brown:#6f5942; --u-terra:#b4552b;
  --u-ocher:#c8811e; --u-ocher-d:#8a5a1e; --u-line:rgba(51,38,26,.12);
  --u-card-shadow:0 4px 18px rgba(80,50,15,.08); --u-card-shadow-lg:0 8px 24px rgba(80,50,15,.12);
}
.u-container{max-width:1280px;margin-inline:auto}
.u-section{padding:64px 44px}
.u-eyebrow{font:600 12px/1 'Work Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--u-ocher);margin-bottom:12px}

/* ============================================================
   Karten / Kacheln (über die Block-Klasse .u-card etc. nutzbar)
   ============================================================ */
.u-card{background:#fff;border-radius:14px;padding:24px;box-shadow:var(--u-card-shadow)}
.u-card--lg{border-radius:18px;box-shadow:0 8px 24px rgba(80,50,15,.10)}
.u-diamond{width:12px;height:12px;background:var(--u-ocher);transform:rotate(45deg);margin-bottom:16px}
.u-diamond--terra{background:var(--u-terra)}

/* Hero-Badge „50 Jahre" */
.u-badge{position:absolute;bottom:-18px;left:-18px;background:#fff;border-radius:16px;padding:16px 22px;box-shadow:0 12px 34px rgba(80,50,15,.22)}

/* Timeline */
.u-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.u-timeline::before{content:"";position:absolute;top:9px;left:12%;right:12%;height:2px;background:#e3d3b4}
.u-timeline .step{position:relative;text-align:center;padding:0 14px}
.u-timeline .step::before{content:"";display:block;width:15px;height:15px;background:var(--u-terra);transform:rotate(45deg);margin:3px auto 20px;box-shadow:0 0 0 5px var(--u-sand)}

/* ============================================================
   Referenz-Galerie + Filter
   ============================================================ */
.u-reffilter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.u-reffilter button{cursor:pointer;border:1px solid var(--u-line);background:#fff;color:var(--u-ink);
  font:600 14px/1 'Work Sans',sans-serif;padding:11px 20px;border-radius:30px;transition:.15s}
.u-reffilter button:hover{border-color:var(--u-ocher)}
.u-reffilter button.is-active{background:var(--u-terra);border-color:var(--u-terra);color:#fff}
.u-refgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.u-refcard{border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--u-card-shadow)}
.u-refcard img{width:100%;height:220px;object-fit:cover;display:block}
.u-refcard .cap{padding:16px 18px}
.u-refcard .cap h3{font:700 17px/1.25 'Bitter',serif;margin:0 0 5px;color:var(--u-ink)}
.u-refcard .cap span{font:500 13px/1.4 'Work Sans',sans-serif;color:var(--u-ocher-d)}
.u-refcard.is-hidden{display:none}

/* ============================================================
   Hauptmenü: kein Unterstrich/Rahmen bei Hover/Klick/Fokus
   ============================================================ */
header nav a{text-decoration:none;outline:none}
header nav a:hover,header nav a:focus,header nav a:active,header nav a:focus-visible{
  text-decoration:none;outline:none;box-shadow:none;border:none;color:var(--u-terra)}

/* ============================================================
   Kontaktformular (Contact Form 7)
   ============================================================ */
.wpcf7-form{max-width:640px}
.wpcf7-form p{margin:0 0 16px;font:500 14.5px/1.5 'Work Sans',sans-serif;color:#4a3826}
.wpcf7-form label{display:block;font-weight:600;margin-bottom:6px}
.wpcf7-form input[type=text],.wpcf7-form input[type=email],.wpcf7-form input[type=tel],
.wpcf7-form input[type=number],.wpcf7-form textarea{
  width:100%;box-sizing:border-box;background:#fff;border:1px solid #e0d6c4;border-radius:10px;
  padding:13px 15px;font:400 15px/1.4 'Work Sans',sans-serif;color:#33261a;transition:.15s}
.wpcf7-form input:focus,.wpcf7-form textarea:focus{outline:none;border-color:var(--u-terra);
  box-shadow:0 0 0 3px rgba(180,85,43,.13)}
.wpcf7-form textarea{min-height:150px;resize:vertical}
.wpcf7-form .wpcf7-quiz{max-width:220px}
.wpcf7-form input[type=submit]{cursor:pointer;background:var(--u-terra);color:#fff;border:none;
  border-radius:30px;font:700 15px/1 'Work Sans',sans-serif;padding:15px 34px;transition:.15s}
.wpcf7-form input[type=submit]:hover{background:var(--u-ocher-d)}
.wpcf7-spinner{margin-top:10px}

/* Footer: Spalten-Links in Creme (nicht Terracotta); Telefon/E-Mail behalten ihre Inline-Farbe */
footer a{color:inherit;transition:color .15s}
footer a:hover{color:#fff}
footer a:focus,footer a:active,footer a:focus-visible{outline:none;box-shadow:none;text-decoration:none}
footer .cli_settings_button{color:inherit !important}
footer .cli_settings_button:hover{color:#fff !important}

/* Rechtstext-Seiten (Impressum/Datenschutz) */
.u-legal h2{font:800 26px/1.2 'Bitter',serif;margin:1.6em 0 .4em;color:var(--u-ink)}
.u-legal h3{font:700 19px/1.25 'Bitter',serif;margin:1.4em 0 .3em;color:var(--u-terra)}
.u-legal p{font:400 16px/1.7 'Work Sans',sans-serif;color:#4a3826;margin:.5em 0}
.u-legal a{color:var(--u-terra)}

/* ============================================================
   Team (Design-Layout: Geschäftsleitung + Team-Grid + Werte)
   ============================================================ */
.u-gl{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.u-tg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.u-tv{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){
  .u-gl{grid-template-columns:1fr}
  .u-tg{grid-template-columns:repeat(3,minmax(0,1fr))}
  .u-tv{grid-template-columns:1fr}
}
@media(max-width:640px){
  .u-tg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-glcard{grid-template-columns:1fr !important}
  .u-glcard > img{height:240px !important}
}

/* ============================================================
   Karriere
   ============================================================ */
.u-jobs{display:flex;flex-direction:column;gap:14px}
.u-job{background:#fff;border-radius:16px;padding:22px 26px;box-shadow:var(--u-card-shadow);
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.u-job .tag{display:inline-block;font:600 11px/1 'Work Sans',sans-serif;text-transform:uppercase;letter-spacing:.06em;
  padding:6px 12px;border-radius:30px;margin-bottom:10px}
.u-job .tag.aus{color:#8a5a1e;background:#f0e2c8}
.u-job .tag.fest{color:#3a6b4f;background:#dcebe0}
.u-job h3{font:700 20px/1.2 'Bitter',serif;margin:0 0 4px;color:var(--u-ink)}
.u-job .meta{font:400 14px/1.4 'Work Sans',sans-serif;color:#6a5442;margin:0}
.u-job .apply{text-decoration:none;background:var(--u-terra);color:#fff;font-weight:700;font-size:14px;
  padding:13px 24px;border-radius:30px;white-space:nowrap}
.u-job .apply:hover{background:var(--u-ocher-d)}
.u-jobnote{font:400 14.5px/1.6 'Work Sans',sans-serif;color:#6a5442;margin:14px 2px 0}
.u-apply-note{background:#f6ecd8;border:1px solid #e6d3ad;border-radius:14px;padding:18px 22px;margin:0 0 26px;
  font:400 15px/1.65 'Work Sans',sans-serif;color:#4a3826}
.u-apply-note b{color:var(--u-ink)}

/* ============================================================
   Startseite + Footer: responsive Utility-Grids
   ============================================================ */
.u-why{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.u-footer-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:36px;padding:46px 44px 34px}

/* ============================================================
   Responsiv
   ============================================================ */
@media(max-width:900px){
  .u-section{padding:44px 22px}
  .u-timeline{grid-template-columns:1fr 1fr;gap:28px 0}
  .u-timeline::before{display:none}
  .u-refgrid{grid-template-columns:1fr 1fr}
  /* Startseite / Karriere: mehrspaltige Inline-Grids einklappen */
  .u-hero-grid{grid-template-columns:1fr !important}
  .u-kar-hero{grid-template-columns:1fr !important}
  .u-home-team{grid-template-columns:1fr 1fr !important}
  .u-home-serv{grid-template-columns:1fr 1fr !important}
  .u-why{grid-template-columns:1fr 1fr}
  .u-kar-hero > div:first-child{padding:44px 22px !important}
  /* Footer 4 -> 2 Spalten */
  .u-footer-grid{grid-template-columns:1fr 1fr;gap:28px 24px;padding:36px 22px 26px}
}
@media(max-width:600px){
  .u-refgrid{grid-template-columns:1fr}
  .u-timeline{grid-template-columns:1fr}
  .u-home-team{grid-template-columns:1fr !important}
  .u-home-serv{grid-template-columns:1fr !important}
  .u-why{grid-template-columns:1fr}
  .u-footer-grid{grid-template-columns:1fr}
  /* Seiten-Innenabstände + große Überschriften mobil verkleinern */
  .u-secx,.u-stats,.u-band{padding-left:20px !important;padding-right:20px !important}
  .u-hero-grid{padding-top:40px !important;padding-bottom:40px !important}
  .u-hero-grid h1{font-size:34px !important}
  .u-kar-hero h1{font-size:32px !important}
  /* Header/Nav mobil aufräumen */
  header nav{gap:12px 16px !important}
}