/*
Theme Name: Katja Borasch
Theme URI: https://katja-borasch.info/
Author: Michael Minuth
Description: Barrierebewusstes, mit Gutenberg und Website-Editor vollständig bearbeitbares Praxis-Theme nach Praxis.dc.html. Enthält Kontaktformular ohne Datenbankablage und statischen Login-Platzhalter.
Version: 2.0.1
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: katja-borasch
*/
:root {
 --kb-espresso:#2A211B; --kb-bronze:#9C7A4B; --kb-salbei:#8A8B6C; --kb-sand:#E7DAC6;
 --kb-cream:#FBF8F3; --kb-ink:#4a3f33; --kb-muted:#8a7c6a;
 --kb-heading:'Cormorant Garamond', Georgia,serif;
 --kb-body:'Inter',Arial,sans-serif;
}
*,*::before,*::after {box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--kb-cream);color:var(--kb-espresso);font-family:var(--kb-body);-webkit-font-smoothing:antialiased}
:where(h1,h2,h3,h4,h5,h6){font-family:var(--kb-heading);font-weight:500;margin:0}
:where(a){color:var(--kb-bronze);text-decoration:none}
:where(a:hover){color:var(--kb-espresso)}
:where(p){margin:0 0 1rem}
:where(img){max-width:100%;height:auto}
:where(button,input,textarea){font:inherit}
:focus-visible{outline:2px solid var(--kb-bronze);outline-offset:4px}
.wp-site-blocks{max-width:1440px;margin:0 auto;overflow:clip;background:var(--kb-cream)}
.wp-site-blocks > *{margin-block-start:0}
.wp-block-group.has-global-padding{padding-inline:0}
/* Header: exact desktop measurements from Praxis.dc.html. */
.kb-header{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:40px 96px 0;font-size:15px;color:#6b5d4d;font-weight:500;min-height:58px}
.kb-header .wp-block-site-title{margin:0;white-space:nowrap;font-family:var(--kb-body);font-size:15px;font-weight:500;line-height:1.5}
.kb-header .wp-block-site-title a{color:inherit}
.kb-header .wp-block-navigation{font-size:15px}
.kb-header .wp-block-navigation__container{gap:40px}
.kb-header .wp-block-navigation-item__content{color:#6b5d4d}
.kb-header .wp-block-navigation-item__content:hover{color:var(--kb-espresso)}
.kb-header .kb-login-link{font-size:13px;letter-spacing:.01em;color:var(--kb-bronze);border:1px solid var(--kb-bronze);padding:8px 12px;border-radius:2px;display:inline-block;cursor:default}
.kb-header .kb-header-right{display:flex;align-items:center;gap:32px;flex-wrap:nowrap}
/* Buttons */
.kb-button .wp-block-button__link,.kb-contact-form button[type=submit]{display:inline-block;background:var(--kb-espresso);color:var(--kb-cream);border:0;border-radius:2px;font:600 15px/1.5 var(--kb-body);letter-spacing:.02em;padding:15px 30px;cursor:pointer;text-align:center}
.kb-button .wp-block-button__link:hover,.kb-contact-form button[type=submit]:hover{background:#443626;color:var(--kb-cream)}
.kb-divider{width:48px;height:2px;background:var(--kb-bronze);flex:none;margin:0}
.kb-hero{display:flex;gap:80px;align-items:center;min-height:620px;padding:60px 96px 100px}
.kb-hero .wp-block-columns{display:flex;gap:80px;align-items:center;margin:0;width:100%}
.kb-hero .wp-block-column:first-child{flex:1 1 0;display:flex;flex-direction:column;align-items:flex-start;gap:26px;min-width:0}
.kb-hero .wp-block-column:nth-child(2){flex:.8 1 0;min-width:0}
.kb-hero h1{font-size:46px;line-height:1.25;max-width:560px;letter-spacing:0}
.kb-hero .kb-hero-description{font-size:18px;line-height:1.75;color:var(--kb-ink);max-width:480px;font-weight:400;margin:0}
.kb-hero .wp-block-buttons{margin-top:8px}
.kb-hero figure{width:100%;height:480px;margin:0;background:var(--kb-salbei);overflow:hidden}
.kb-hero figure img{width:100%;height:100%;object-fit:cover;object-position:60% 25%;display:block}
.kb-schwerpunkte{background:var(--kb-espresso);color:var(--kb-sand);padding:100px 96px}
.kb-schwerpunkte .kb-narrow{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:26px}
.kb-schwerpunkte .kb-divider{background:var(--kb-sand)}
.kb-schwerpunkte h2{font-size:30px;line-height:1.2;color:var(--kb-sand)}
.kb-schwerpunkte p{font-size:17px;line-height:1.9;color:#cfc3ae;font-weight:400;margin:0}
.kb-about{padding:100px 96px;display:flex;gap:80px}
.kb-about > .wp-block-columns{display:flex;gap:80px;margin:0;width:100%}
.kb-about .wp-block-column{display:flex;flex-direction:column;gap:22px;min-width:0}
.kb-about h2{font-size:30px;line-height:1.2;color:var(--kb-espresso)}
.kb-about p{font-size:16px;line-height:1.85;color:var(--kb-ink);margin:0}
.kb-facts{padding:90px 96px;background:var(--kb-sand)}
.kb-facts .wp-block-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin:0}
.kb-facts .wp-block-column{display:flex;flex-direction:column;gap:12px;min-width:0}
.kb-facts h3{font-size:20px;line-height:1.2;color:var(--kb-espresso)}
.kb-facts p{font-size:15px;line-height:1.7;color:var(--kb-ink);margin:0}
.kb-reviews{padding:100px 96px;background:var(--kb-cream)}
.kb-reviews .kb-review-inner{max-width:1000px;margin:auto;display:flex;flex-direction:column;gap:40px}
.kb-reviews h2{font-size:30px;color:var(--kb-espresso)}
.kb-reviews .kb-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.kb-reviews .kb-review-item{background:var(--kb-sand);padding:28px;display:block;min-width:0}
.kb-reviews .kb-review-quote{font-size:16px;line-height:1.7;color:var(--kb-ink);font-style:italic;margin:0 0 14px}
.kb-reviews .kb-review-person{font-size:14px;color:var(--kb-muted);margin:0}
.kb-cta{padding:90px 96px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:26px}
.kb-cta h2{font-size:28px;color:var(--kb-espresso)}
.kb-footer{padding:32px 96px;border-top:1px solid #ddd0ba;text-align:center}
.kb-footer p{font-size:13px;color:var(--kb-muted);margin:0}
.kb-footer-nav{display:flex;gap:16px;justify-content:center;align-items:center;margin-top:15px;font-size:13px;flex-wrap:wrap}
.kb-footer-nav a{color:var(--kb-muted)}
.kb-footer-nav a:hover{text-decoration:underline}
.kb-copyright{display:block;margin-top:12px;font-size:12px;color:var(--kb-muted)}
/* Standard subpages and block editor content */
.kb-content{padding:72px 96px 110px;max-width:1040px;margin:0 auto!important}
.kb-content h1{font-size:46px;line-height:1.18;margin:0 0 30px}
.kb-content h2{font-size:30px;line-height:1.25;margin:36px 0 14px}
.kb-content h3{font-size:23px;margin:25px 0 12px}
.kb-content p,.kb-content li{font-size:16px;line-height:1.85;color:var(--kb-ink)}
.kb-content :where(p,ul,ol){margin:0 0 15px}
.kb-content a{text-decoration:underline;text-underline-offset:3px}
.kb-content .kb-contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:64px;margin-top:40px;align-items:start}
.kb-contact-form label{font-size:15px;color:var(--kb-ink);display:block;margin-bottom:7px;font-weight:500}
.kb-contact-form input:not([type=checkbox]),.kb-contact-form textarea{display:block;width:100%;max-width:100%;background:#fff;border:1px solid #b8a994;border-radius:2px;padding:12px 14px;color:var(--kb-espresso)}
.kb-contact-form textarea{min-height:140px;resize:vertical}
.kb-contact-form .kb-field{margin-bottom:18px}
.kb-contact-form .kb-check{display:flex;align-items:flex-start;gap:9px;margin:0 0 18px;font-weight:400;line-height:1.5;cursor:pointer}
.kb-contact-form .kb-check input{margin-top:5px;flex:none}
.kb-contact-form .kb-note{font-size:13px;color:var(--kb-muted);line-height:1.6}
.kb-form-message{border-left:3px solid var(--kb-salbei);padding:12px 16px;background:#f0eee5;margin:0 0 20px}
.kb-hp-field{position:absolute!important;left:-9999px!important;height:1px!important;overflow:hidden!important}
.kb-contact-form .kb-form-help{display:block;text-align:right;font-size:12px;color:var(--kb-muted);margin-top:3px}
/* Editor helpers and access */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1100px){
 .kb-header{padding:30px 48px 0}
 .kb-hero{padding:60px 48px 85px;gap:52px}
 .kb-hero .wp-block-columns{gap:52px}
 .kb-hero h1{font-size:42px}
 .kb-schwerpunkte,.kb-about,.kb-facts,.kb-reviews,.kb-cta{padding-left:48px;padding-right:48px}
 .kb-footer{padding-left:48px;padding-right:48px}
 .kb-about .wp-block-columns{gap:50px}
 .kb-content{padding:60px 48px 85px}
}
@media(max-width:782px){
 .kb-header{padding:20px 24px 0;gap:12px;align-items:center}
 .kb-header .kb-header-right{gap:12px}
 .kb-header .kb-login-link{padding:7px 10px}
 .kb-header .wp-block-navigation__container{gap:14px}
 .kb-header .wp-block-navigation-item__content{font-size:14px}
 .kb-hero{padding:55px 24px 65px;min-height:0}
 .kb-hero .wp-block-columns{flex-direction:column;gap:38px;align-items:stretch}
 .kb-hero .wp-block-column:first-child,.kb-hero .wp-block-column:nth-child(2){flex:1 1 auto;width:100%}
 .kb-hero h1{font-size:40px}
 .kb-hero .kb-hero-description{font-size:17px}
 .kb-hero figure{height:440px}
 .kb-schwerpunkte,.kb-about,.kb-reviews{padding:65px 24px}
 .kb-about .wp-block-columns{flex-direction:column;gap:55px}
 .kb-facts{padding:65px 24px}
 .kb-facts .wp-block-columns{gap:30px}
 .kb-cta{padding:70px 24px}
 .kb-footer{padding:28px 24px}
 .kb-content{padding:55px 24px 75px}
 .kb-content .kb-contact-grid{grid-template-columns:1fr;gap:35px}
}
@media(max-width:600px){
 .kb-header .kb-header-right{gap:10px}
 .kb-header .wp-block-navigation__responsive-container-open{display:flex}
 .kb-header .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}
 .kb-header .wp-block-site-title{font-size:14px}
 .kb-hero h1{font-size:35px}
 .kb-hero figure{height:340px}
 .kb-facts .wp-block-columns{grid-template-columns:1fr;gap:28px}
 .kb-reviews .kb-review-grid{grid-template-columns:1fr;gap:20px}
 .kb-schwerpunkte h2,.kb-about h2,.kb-reviews h2{font-size:28px}
 .kb-content h1{font-size:37px}
 .kb-content h2{font-size:27px}
 .kb-header .wp-block-navigation__responsive-container.is-menu-open{background:var(--kb-cream);color:var(--kb-espresso);padding:24px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Device-specific optional content visibility from block Advanced > CSS class. */
@media (min-width:1101px){.kb-tablet-only,.kb-mobile-only{display:none!important}}
@media (min-width:601px) and (max-width:1100px){.kb-desktop-only,.kb-mobile-only{display:none!important}}
@media (max-width:600px){.kb-desktop-only,.kb-tablet-only{display:none!important}}

/* Header and navigation: full editor fidelity with adaptive breakpoints. */
.kb-header .wp-block-navigation__responsive-container.is-menu-open{box-sizing:border-box}
.kb-header .wp-block-navigation__responsive-container.is-menu-open *{box-sizing:border-box}
.kb-header .wp-block-navigation__responsive-container-open:focus-visible,.kb-header .wp-block-navigation__responsive-container-close:focus-visible{outline:2px solid var(--kb-bronze);outline-offset:4px}
@media(max-width:700px){
.kb-header{position:relative}
.kb-header .wp-block-navigation__responsive-container-open{display:flex!important}
.kb-header .wp-block-navigation__responsive-container:not(.is-menu-open){display:none!important}
.kb-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog{width:100%}
.kb-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{max-width:100%}
.kb-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{line-height:1.25}
}
/* Never hide device-specific editor blocks while editing. */
.editor-styles-wrapper .kb-desktop-only,.editor-styles-wrapper .kb-tablet-only,.editor-styles-wrapper .kb-mobile-only{display:block!important}

/* SeelenRevolte 2.5 Group Step Card controls, styled with the Praxis original palette. */
.kb-step-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:28px;align-items:stretch;margin-inline:auto;}
.kb-step{position:relative;isolation:isolate;min-height:220px;background:var(--kb-step-bg,var(--kb-sand));border-top:3px solid var(--kb-step-accent,var(--kb-bronze));padding:30px 26px;transition:transform .25s ease,border-color .25s ease,background-color .25s ease;}
.kb-step:hover,.kb-step:focus-within{background:var(--kb-step-hover-bg,var(--kb-step-bg,var(--kb-sand)));border-top-color:var(--kb-step-hover-accent,var(--kb-step-accent,var(--kb-bronze)));transform:var(--kb-step-hover-transform,translateY(-5px));}
.kb-step:hover{cursor:var(--kb-step-cursor,default)}
.kb-step .kb-step-number{font-family:var(--kb-heading);color:var(--kb-bronze);font-size:14px;letter-spacing:.08em;margin-bottom:14px}
.kb-step :is(h2,h3,h4){color:var(--kb-espresso);font-size:27px;margin-bottom:14px}
.kb-step p{line-height:1.75;color:var(--kb-ink)}
.kb-step-hitarea{position:absolute;inset:0;z-index:1;display:block;border-radius:inherit;}
.kb-step-hitarea:focus-visible{outline:3px solid var(--kb-bronze);outline-offset:4px}
.kb-step-linked{cursor:pointer}
.kb-step-linked .wp-block-buttons,.kb-step-linked a:not(.kb-step-hitarea){position:relative;z-index:2}
@media(prefers-reduced-motion:reduce){.kb-step{transition:none!important}.kb-step:hover,.kb-step:focus-within{transform:none!important}}
@media(max-width:782px){.kb-step-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:600px){.kb-step-grid{grid-template-columns:1fr}}
html.kb-mobile-menu-open,body.kb-mobile-menu-open{overflow:hidden}


/* --------------------------------------------------------------
   Version 2.0.1 – smartphone layout / WordPress navigation
   The rules below are deliberately mobile-scoped: the original
   desktop and wide-tablet 2.0 design remain unchanged.
   -------------------------------------------------------------- */
@media (max-width: 782px) {
  /* The outer "About" group was itself a flex row. Combined with
     core/columns' responsive flex-basis rules, a second column could
     be pushed beyond the visible area or collapsed on small screens. */
  .wp-site-blocks .kb-about {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  .wp-site-blocks .kb-about > .wp-block-columns,
  .wp-site-blocks .kb-about .wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 40px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  .wp-site-blocks .kb-about .wp-block-columns > .wp-block-column {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-basis: auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .wp-site-blocks .kb-about .wp-block-column > :is(.kb-divider,h2,p) {
    max-width: 100%;
    overflow-wrap: break-word;
  }
  /* Always use the accessible WordPress modal navigation on phones
     and small tablets; don't rely on core's default 600px breakpoint. */
  .kb-header .wp-block-navigation__responsive-container-open {
    display: inline-flex !important;
    position: relative;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    padding: 0;
    color: var(--kb-espresso);
    background: var(--kb-cream);
    border: 1px solid var(--kb-bronze);
    border-radius: 5px;
    cursor: pointer;
    touch-action: manipulation;
  }
  /* WordPress ships a two-line SVG for this button. Replace only
     the picture, NOT the button or its WP accessibility behavior. */
  .kb-header .wp-block-navigation__responsive-container-open svg {
    display: none !important;
  }
  .kb-header .wp-block-navigation__responsive-container-open::before {
    content: "";
    display: block;
    width: 25px;
    height: 2.5px;
    border-radius: 2px;
    background: currentColor;
    box-shadow: 0 -8px 0 currentColor, 0 8px 0 currentColor;
  }
  .kb-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    padding: max(20px, env(safe-area-inset-top))
             max(22px, env(safe-area-inset-right))
             max(30px, env(safe-area-inset-bottom))
             max(22px, env(safe-area-inset-left)) !important;
    margin: 0 !important;
    background: var(--kb-cream) !important;
    color: var(--kb-espresso) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
  }
  /* Don't clip the fixed menu within the bounded page wrapper. */
  .wp-site-blocks:has(.kb-header .wp-block-navigation__responsive-container.is-menu-open),
  html.kb-mobile-menu-open .wp-site-blocks {
    overflow: visible !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation__responsive-close,
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation__responsive-dialog {
    width: 100% !important;
    max-width: 520px !important;
    margin-inline: auto !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation__responsive-container-close {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    margin-left: auto !important;
    margin-right: 0 !important;
    padding: 0;
    border: 1px solid var(--kb-bronze);
    border-radius: 5px;
    color: var(--kb-espresso);
    background: transparent;
    cursor: pointer;
    touch-action: manipulation;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation__responsive-container-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: none !important;
    padding-top: 36px !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: 100% !important;
    font-size: 21px !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation-item {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation-item__content {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 62px !important;
    padding: 15px 8px !important;
    border-bottom: 1px solid #ddd0ba;
    font-family: var(--kb-body) !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    color: var(--kb-espresso) !important;
    white-space: normal !important;
    text-align: left !important;
    touch-action: manipulation;
  }
  .kb-header .wp-block-navigation__responsive-container.is-menu-open
     .wp-block-navigation-item__content:where(:hover,:focus-visible) {
    color: var(--kb-bronze) !important;
    background: #f1e9dd;
  }
  .kb-header .wp-block-navigation__responsive-container-open:focus-visible,
  .kb-header .wp-block-navigation__responsive-container-close:focus-visible {
    outline: 3px solid var(--kb-bronze);
    outline-offset: 3px;
  }
}
@media (max-width: 600px) {
  .kb-header .kb-header-right { gap: 12px; }
  .kb-header .wp-block-site-title { min-width: 0; white-space: normal; }
  .wp-site-blocks .kb-about { padding: 65px 24px !important; }
}