/* Ergänzendes CSS – nur was theme.json nicht abbilden kann. */

/* ---------- Kopfbereich ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
}
.site-header > .wp-block-group{ min-height:72px; align-items:center; }
.site-header .wp-block-navigation a:hover{ color:var(--wp--preset--color--navy); }
.site-header .wp-block-navigation .current-menu-item a{ color:var(--wp--preset--color--navy); }

/* Mobile Navigation (Overlay-Menü des Navigation-Blocks) */
@media (max-width:781px){
  .site-header .header-cta{ display:none; }
}
.wp-block-navigation__responsive-container.is-menu-open{
  background:var(--wp--preset--color--navy-dark);
  padding:var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
}
.wp-block-navigation__responsive-container.is-menu-open a{ color:#fff; font-size:1.15rem; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close{ color:var(--wp--preset--color--navy); }

/* ---------- Sektionen ---------- */
.section{ padding-block:var(--wp--preset--spacing--40); }
.section-dark{ background:var(--wp--preset--gradient--section-dark); color:#e6eef6; }
.section-dark :is(h1,h2,h3){ color:#fff; }
.section-dark p, .section-dark li{ color:#b8ccdd; }

/* ---------- Fußbereich ---------- */
.site-footer{ color:#a9bccd; }
.site-footer a{ color:#a9bccd; text-decoration:none; }
.site-footer a:hover{ color:#fff; text-decoration:underline; }
.footer-head{ text-transform:uppercase; letter-spacing:.09em; }
.footer-list{ list-style:none; padding:0; margin:0; }
.footer-list li{ margin-bottom:9px; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:var(--wp--preset--spacing--40);
  padding-top:var(--wp--preset--spacing--20);
}
.footer-bottom p{ margin:0; }

/* ---------- Zugänglichkeit ---------- */
.skip-link:focus{ position:fixed; top:10px; left:10px; z-index:1000; background:#fff; padding:10px 16px; border-radius:8px; }
:is(a,button,input,textarea,summary):focus-visible{
  outline:2px solid var(--wp--preset--color--blue); outline-offset:2px;
}
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } }

/* ==========================================================
   Sektionen der Startseite
   ========================================================== */

/* ---------- Hero ---------- */
.hero{ background:var(--wp--preset--gradient--section-dark); color:#fff; }
.hero .wp-block-columns{ align-items:center; }
.hero h1{ color:#fff; }
.hero .lead{ color:#c3d3e2; max-width:52ch; }
.hero .tag{ background:rgba(255,255,255,.12); color:#9ec7ec; }
.hero .wp-block-image img{ border-radius:10px; }
.tag{
  display:inline-block; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--wp--preset--color--blue); background:var(--wp--preset--color--blue-light);
  padding:4px 10px; border-radius:99px; font-weight:600; margin:0 0 14px;
}

/* ---------- USP ---------- */
.usp{ margin-top:-44px; position:relative; z-index:2; }
.usp .wp-block-column{
  background:#fff; border:1px solid var(--wp--preset--color--grey-100); border-radius:10px;
  padding:26px; text-align:center;
  box-shadow:var(--wp--preset--shadow--card);
}
.usp .n{
  width:38px; height:38px; border-radius:9px; margin:0 auto 14px;
  background:var(--wp--preset--color--blue-light); color:var(--wp--preset--color--blue);
  display:flex; align-items:center; justify-content:center; font-weight:700;
}
.usp p{ color:var(--wp--preset--color--grey-700); font-size:.95rem; }

/* ---------- Leistungen ---------- */
.svc{
  background:#fff; border:1px solid var(--wp--preset--color--grey-100); border-radius:10px;
  padding:28px; text-align:center;
}
.svc .ico{ width:36px; height:36px; margin:0 auto 14px; color:var(--wp--preset--color--blue); }
.svc .ico svg{ width:100%; height:100%; display:block; }
.svc ul{ list-style:none; padding:0; margin:14px 0 0; text-align:left; display:inline-block; }
.svc li{ position:relative; padding-left:20px; color:var(--wp--preset--color--grey-700); font-size:.93rem; margin-bottom:7px; }
.svc li::before{
  content:""; position:absolute; left:0; top:.55em; width:7px; height:7px;
  border-radius:2px; background:var(--wp--preset--color--blue);
}

/* ---------- Fälle ---------- */
.case{
  display:flex; gap:14px; align-items:flex-start;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  border-left:3px solid var(--wp--preset--color--blue-soft); border-radius:8px; padding:16px 18px;
}
.case svg{ width:22px; height:22px; flex:0 0 22px; color:var(--wp--preset--color--blue-soft); }
.case p{ margin:0; color:#dbe7f1; font-size:.95rem; }

/* ---------- Über mich / Werdegang ---------- */
.portrait{ float:right; width:190px; margin:8px 0 16px 26px; }
.portrait img{ border-radius:10px; width:100%; height:auto; aspect-ratio:3/4; object-fit:cover; }
.tl-wrap{ position:relative; max-height:300px; overflow:hidden; transition:max-height .45s ease; }
.tl-wrap.is-open{ max-height:none; }
.tl-wrap.is-open .tl-fade{ opacity:0; }
.tl-fade{
  position:absolute; left:0; right:0; bottom:0; height:150px; pointer-events:none; transition:opacity .3s;
  background:linear-gradient(to bottom,rgba(247,249,251,0) 0%,rgba(247,249,251,.85) 55%,var(--wp--preset--color--grey-50) 100%);
}
.tl{ border-left:2px solid var(--wp--preset--color--grey-300); margin-left:8px; padding-left:28px; display:grid; gap:30px; }
.tl .item{ position:relative; }
.tl .item::before{
  content:""; position:absolute; left:-36px; top:6px; width:14px; height:14px; border-radius:50%;
  background:var(--wp--preset--color--blue); border:3px solid var(--wp--preset--color--grey-50);
  box-shadow:0 0 0 2px var(--wp--preset--color--blue);
}
.tl .item h3{ margin:.2em 0 0; }
.tl .item p{ color:var(--wp--preset--color--grey-700); font-size:.95rem; margin:.3em 0 0; }
.tl time{ font-size:.82rem; color:var(--wp--preset--color--grey-500); font-weight:600; letter-spacing:.04em; }
.tl-more{ display:flex; justify-content:center; margin-top:-26px; position:relative; z-index:2; }
.tl-more button{
  display:inline-flex; align-items:center; gap:9px; background:#fff;
  border:1px solid var(--wp--preset--color--grey-300); color:var(--wp--preset--color--navy);
  font:600 .9rem/1 inherit; padding:11px 20px; border-radius:99px; cursor:pointer;
  box-shadow:var(--wp--preset--shadow--subtle);
}
.tl-more .plus{
  width:20px; height:20px; border-radius:50%; background:var(--wp--preset--color--blue); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:15px; line-height:1;
}

/* ---------- Referenzen ---------- */
.refs .wp-block-column img{ border-radius:10px; }
.mq{ overflow:hidden; position:relative; }
.mq-track{ display:flex; gap:24px; width:max-content; animation:mq 34s linear infinite; }
.mq:hover .mq-track, .mq:focus-within .mq-track{ animation-play-state:paused; }
.mq .ref{ width:340px; flex:0 0 340px; }
.mq .ref img{ border-radius:10px; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; }
@keyframes mq{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.mq::before,.mq::after{ content:""; position:absolute; top:0; bottom:0; width:60px; z-index:2; pointer-events:none; }
.mq::before{ left:0;  background:linear-gradient(to right,#0d2e4d,rgba(13,46,77,0)); }
.mq::after { right:0; background:linear-gradient(to left,#0b2946,rgba(11,41,70,0)); }

/* ---------- Kontaktformular ---------- */
.lm-form label{ display:block; font-size:.85rem; font-weight:600; color:var(--wp--preset--color--grey-700); margin:0 0 6px; }
.lm-form input[type=text],.lm-form input[type=email],.lm-form textarea{
  width:100%; padding:12px 14px; border:1px solid var(--wp--preset--color--grey-300);
  border-radius:8px; font:inherit; font-size:.95rem; margin-bottom:16px; background:#fff;
}
.lm-form textarea{ min-height:130px; resize:vertical; }
.lm-form .check{ display:flex; gap:10px; font-size:.85rem; color:var(--wp--preset--color--grey-700); margin-bottom:18px; }
.lm-form .check input{ width:auto; margin:3px 0 0; }
.lm-form .check label{ font-weight:400; margin:0; }
.lm-form .hp{ position:absolute; left:-9999px; }
.lm-form button{
  background:var(--wp--preset--color--navy); color:#fff; border:0; border-radius:10px;
  padding:13px 26px; font:600 .95rem/1 inherit; cursor:pointer;
}
.lm-form button:hover{ background:var(--wp--preset--color--blue); }
.lm-note{ border-radius:8px; padding:14px 16px; margin-bottom:20px; font-size:.95rem; }
.lm-note.ok{ background:#e7f6ec; border:1px solid #b7e2c6; color:#17603a; }
.lm-note.err{ background:#fdecec; border:1px solid #f5c2c2; color:#8a1f1f; }
.contact-cols .form-spacer{ height:calc(2.1rem * 1.2 + .5em); }

/* ---------- Responsive ---------- */
@media (max-width:781px){
  .usp{ margin-top:32px; }
  .portrait{ float:none; width:100%; max-width:260px; margin:0 0 20px; }
  .mq .ref{ width:260px; flex:0 0 260px; }
  .contact-cols .form-spacer{ display:none; }
}