/*
Theme Name: KnowledgeWerk
Theme URI: https://www.knowledgewerk.com
Author: KnowledgeWerk / Jonas Hartmann
Author URI: https://www.knowledgewerk.com
Description: Individuelles WordPress-Theme für KnowledgeWerk – Wissens-Architektur, KI-Readiness und Change Management für den DACH-Mittelstand. Migriert und rekonstruiert aus Wix, gebaut auf reinem Gutenberg (Block-Editor), ohne Page-Builder-Abhängigkeit.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: knowledgewerk
*/

/* ---------------------------------------------------------------------
   0. Custom properties / Design Tokens
--------------------------------------------------------------------- */
:root{
  --kw-navy: #122A4F;
  --kw-navy-dark: #0B1B33;
  --kw-blue: #2F5FD6;
  --kw-blue-light: #EAF0FA;
  --kw-grey-bg: #F4F6FB;
  --kw-white: #FFFFFF;
  --kw-text: #253449;
  --kw-text-muted: #5B6B85;
  --kw-border: #E1E7F2;
  --kw-radius: 10px;
  --kw-max-width: 1200px;
  --kw-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------------------------------------------------------------------
   1. Reset & base
--------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--kw-font);
  color: var(--kw-text);
  background: var(--kw-white);
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color: var(--kw-blue); text-decoration:none; }
a:hover{ text-decoration:underline; }
h1,h2,h3,h4,h5{
  font-family: var(--kw-font);
  color: var(--kw-navy);
  line-height:1.2;
  font-weight:700;
  margin:0 0 .6em;
}
h1{ font-size: clamp(2rem, 4vw, 3rem); }
h2{ font-size: clamp(1.5rem, 3vw, 2.1rem); }
h3{ font-size: 1.3rem; }
p{ margin:0 0 1.1em; }
.screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}
.skip-link{
  position:absolute; left:-999px; top:0; background:var(--kw-navy); color:#fff;
  padding:12px 20px; z-index:10000; border-radius:0 0 8px 0;
}
.skip-link:focus{ left:0; }

/* ---------------------------------------------------------------------
   2. Layout helpers
--------------------------------------------------------------------- */
.kw-container{ max-width: var(--kw-max-width); margin:0 auto; padding:0 24px; }
.site-main{ overflow-x:hidden; }
.has-text-align-center{ text-align:center; }
.has-text-align-center .wp-block-buttons{ justify-content:center; }

/* Constrain default block content (paragraphs/headings not inside a group) */
.site-main > .wp-block-group,
.site-main > .wp-block-cover{ width:100%; }
.entry-content > *:not(.wp-block-group):not(.wp-block-cover):not(.wp-block-columns),
.entry-content{ max-width: 820px; margin-left:auto; margin-right:auto; padding:0 24px; }
.entry-content .wp-block-group{ max-width:none; }

/* ---------------------------------------------------------------------
   3. Header
--------------------------------------------------------------------- */
.site-header{
  background: var(--kw-blue-light);
  position: sticky; top:0; z-index: 999;
  border-bottom: 1px solid #d9e3f5;
}
.site-header-inner{
  max-width: var(--kw-max-width); margin:0 auto; padding: 16px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.site-logo{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.25rem; color:var(--kw-navy); }
.site-logo:hover{ text-decoration:none; }
.site-logo svg{ display:block; }
.primary-nav ul{ list-style:none; display:flex; gap:28px; margin:0; padding:0; }
.primary-nav a,
.primary-nav a:visited{ color: var(--kw-navy); font-weight:600; font-size:.97rem; }
.primary-nav a:hover{ color: var(--kw-blue); text-decoration:none; }
.primary-nav a[aria-current="page"]{ color: var(--kw-blue); }
.nav-toggle{
  display:none; background:none; border:none; cursor:pointer; padding:8px;
}
.nav-toggle span{ display:block; width:26px; height:2px; background:var(--kw-navy); margin:5px 0; }
.header-cta{
  background: var(--kw-blue); color:#fff !important; padding:10px 20px; border-radius: 30px;
  font-weight:600; font-size:.92rem; white-space:nowrap;
}
.header-cta:hover{ background: var(--kw-navy); text-decoration:none; }

.kw-lang-switch{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%; border:1.5px solid var(--kw-navy);
  color:var(--kw-navy) !important; font-weight:700; font-size:.78rem; letter-spacing:.02em;
  text-decoration:none !important; flex-shrink:0;
}
.kw-lang-switch:hover{ background:var(--kw-navy); color:#fff !important; }

@media (max-width: 880px){
  .nav-toggle{ display:block; }
  .primary-nav{
    display:none; position:absolute; left:0; right:0; top:100%;
    background:var(--kw-blue-light); border-bottom:1px solid #d9e3f5; padding:16px 24px;
  }
  .primary-nav.is-open{ display:block; }
  .primary-nav ul{ flex-direction:column; gap:16px; }
  .header-cta{ display:none; }
}

/* ---------------------------------------------------------------------
   3b. Core block-library structural essentials
   WordPress enqueues its own block-library stylesheet automatically for
   every theme (wp-includes/css/dist/block-library/style.css), which is
   what normally provides this structural layout CSS (flex layout for
   columns/buttons, cover background positioning, etc.). These rules are
   a defensive baseline only, in case that stylesheet is ever dequeued.
--------------------------------------------------------------------- */
.wp-block-columns{ display:flex; flex-wrap:wrap; }
.wp-block-column{ flex-grow:1; flex-basis:0; }
@media (max-width: 700px){ .wp-block-columns{ flex-wrap:wrap !important; } .wp-block-column{ flex-basis:100%; } }

.wp-block-buttons{ display:flex; flex-wrap:wrap; }
.wp-block-button__link{ text-decoration:none; }

.wp-block-cover{
  position:relative; display:flex; align-items:center; justify-content:center;
  overflow:hidden; background-color: var(--kw-navy-dark);
}
.wp-block-cover__background{ position:absolute; inset:0; z-index:1; }
.wp-block-cover__image-background{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.wp-block-cover__inner-container{ position:relative; z-index:2; width:100%; }
.has-background-dim.has-background-dim-10{ opacity:.1; }
.has-background-dim.has-background-dim-20{ opacity:.2; }
.has-background-dim.has-background-dim-30{ opacity:.3; }
.has-background-dim.has-background-dim-40{ opacity:.4; }
.has-background-dim.has-background-dim-50{ opacity:.5; }
.has-background-dim.has-background-dim-60{ opacity:.6; }
.has-background-dim.has-background-dim-70{ opacity:.7; }
.has-background-dim.has-background-dim-80{ opacity:.8; }
.has-background-dim.has-background-dim-90{ opacity:.9; }
.has-background-dim.has-background-dim-100{ opacity:1; }

/* ---------------------------------------------------------------------
   4. Core blocks – general
--------------------------------------------------------------------- */
.wp-block-group{ width:100%; }
.entry-content .wp-block-group > *,
.site-main .wp-block-group > .kw-container{ max-width: var(--kw-max-width); margin-left:auto; margin-right:auto; }
.wp-block-group{ padding-left:24px; padding-right:24px; }
.wp-block-group > *{ max-width: var(--kw-max-width); margin-left:auto; margin-right:auto; }

.wp-block-columns{ max-width: var(--kw-max-width); margin:0 auto; gap: 32px !important; }
.wp-block-column{ min-width:0; }

.wp-block-button__link{
  border-radius: 30px !important; padding: 14px 30px !important; font-weight:600;
  display:inline-block; transition: opacity .15s ease;
}
.wp-block-button__link:hover{ opacity:.88; text-decoration:none; }
.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important; border:2px solid currentColor;
}
.wp-block-buttons{ gap:16px !important; }

.wp-block-list{ padding-left:1.3em; }
.wp-block-list li{ margin-bottom:.5em; }

.wp-block-quote{
  border-left:4px solid var(--kw-blue); margin:2em auto; padding:.5em 0 .5em 1.5em;
  font-size:1.15rem; font-style:italic; color:var(--kw-navy); max-width: var(--kw-max-width);
}
.wp-block-quote cite{ display:block; margin-top:.6em; font-style:normal; font-weight:600; color:var(--kw-text-muted); font-size:.9rem; }

.wp-block-separator{ border:none; border-top:1px solid var(--kw-border); max-width: var(--kw-max-width); margin:2.5em auto; }

.wp-block-image{ margin: 0 auto 1.5em; max-width: var(--kw-max-width); }
.wp-block-image img{ border-radius: var(--kw-radius); }
.wp-block-image figcaption{ text-align:center; color:var(--kw-text-muted); font-size:.9rem; margin-top:.5em; }

/* ---------------------------------------------------------------------
   5. Hero (cover block)
--------------------------------------------------------------------- */
.wp-block-cover.kw-hero{ border-radius:0; }
.kw-hero .wp-block-cover__inner-container{
  max-width: var(--kw-max-width); margin:0 auto; padding: 60px 24px; width:100%;
}
.kw-hero-inner h1{ margin-bottom:.4em; }
.kw-eyebrow{
  text-transform:uppercase; letter-spacing:.08em; font-weight:700; font-size:.82rem; margin-bottom:1em !important;
}

/* ---------------------------------------------------------------------
   6. CTA section
--------------------------------------------------------------------- */
.kw-cta{ text-align:center; }
.kw-cta h2, .kw-cta p{ max-width:700px; margin-left:auto; margin-right:auto; }

/* ---------------------------------------------------------------------
   7. Feature cards / stat columns
--------------------------------------------------------------------- */
.kw-feature-card{
  background: var(--kw-white); border:1px solid var(--kw-border); border-radius: var(--kw-radius);
  padding: 28px; height:100%;
}
.kw-stat-number{
  font-size:2.4rem; font-weight:800; color: var(--kw-blue); margin-bottom:.1em !important; text-align:center;
}
.kw-stat-label{ text-align:center; color:var(--kw-text-muted); margin-bottom:0 !important; }

/* ---------------------------------------------------------------------
   7b. FAQ block (kw_faq / FAQPage-matched Q&A)
--------------------------------------------------------------------- */
.kw-faq{ max-width:840px; margin-left:auto; margin-right:auto; }
.kw-faq-question{
  margin-top:1.6em !important; margin-bottom:.4em !important;
  padding-top:1.2em; border-top:1px solid var(--kw-border);
  font-size:1.15rem; color: var(--kw-navy);
}
.kw-faq > .kw-faq-question:first-of-type{ border-top:none; padding-top:0; }
.kw-faq-answer{ color:var(--kw-text-muted); margin-bottom:0 !important; }

/* ---------------------------------------------------------------------
   8. Blog / Wissens-Hub
--------------------------------------------------------------------- */
.kw-post-grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap:32px;
  max-width: var(--kw-max-width); margin: 0 auto; padding: 0 24px 64px;
}
.kw-post-card{
  border:1px solid var(--kw-border); border-radius: var(--kw-radius); overflow:hidden;
  display:flex; flex-direction:column; background:#fff; transition: box-shadow .2s ease, transform .2s ease;
}
.kw-post-card:hover{ box-shadow: 0 12px 28px rgba(18,42,79,.12); transform: translateY(-2px); }
.kw-post-card img{ aspect-ratio: 16/10; object-fit:cover; }
.kw-post-card-body{ padding:22px 22px 26px; display:flex; flex-direction:column; flex:1; }
.kw-post-category{
  text-transform:uppercase; font-size:.72rem; font-weight:700; letter-spacing:.05em; color: var(--kw-blue); margin-bottom:.6em;
}
.kw-post-card h2, .kw-post-card h3{ font-size:1.15rem; margin-bottom:.5em; }
.kw-post-card a.kw-post-title-link{ color:var(--kw-navy); text-decoration:none; }
.kw-post-card a.kw-post-title-link:hover{ color:var(--kw-blue); }
.kw-post-excerpt{ color:var(--kw-text-muted); font-size:.95rem; flex:1; }
.kw-post-meta{ color:var(--kw-text-muted); font-size:.82rem; margin-top:1em; }

.single-post .entry-header{ max-width:820px; margin: 48px auto 8px; padding:0 24px; }
.single-post .entry-header .kw-post-category{ display:block; }
.single-post .entry-header h1{ margin-top:.3em; }
.single-post .entry-meta{ color:var(--kw-text-muted); font-size:.92rem; margin-bottom:2em; }
.single-post .entry-content{ padding-top:1.5em; }
.single-post .featured-image{ max-width: var(--kw-max-width); margin: 0 auto 2em; padding:0 24px; }
.single-post .featured-image img{ border-radius: var(--kw-radius); width:100%; aspect-ratio:21/8; object-fit:cover; }

/* ---------------------------------------------------------------------
   9. Contact form (Contact Form 7 look & feel)
--------------------------------------------------------------------- */
.wpcf7-form, .kw-contact-fallback{ max-width:560px; }
.wpcf7-form p{ margin-bottom:1.1em; }
.wpcf7-form label{ display:block; font-weight:600; margin-bottom:.4em; color:var(--kw-navy); }
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel],
.wpcf7-form select,
.wpcf7-form textarea{
  width:100%; padding:12px 14px; border:1px solid var(--kw-border); border-radius:8px; font-family:var(--kw-font); font-size:1rem;
}
.wpcf7-form input[type=submit]{
  background:var(--kw-blue); color:#fff; border:none; padding:14px 30px; border-radius:30px; font-weight:600; cursor:pointer; font-size:1rem;
}
.wpcf7-form input[type=submit]:hover{ background:var(--kw-navy); }
.wpcf7-form input[type=submit]:disabled{ background:#aeb9cf; cursor:not-allowed; }
.kw-hp-field{ position:absolute !important; left:-9999px !important; top:-9999px !important; height:0; overflow:hidden; }
.kw-form-success{
  background:#e9f7ef; border:1px solid #a9dfc0; color:#1c6b3d; padding:14px 16px; border-radius:8px; font-weight:600;
}
.kw-form-error{
  background:#fdecec; border:1px solid #f0b4b4; color:#9c2b2b; padding:14px 16px; border-radius:8px; font-weight:600;
}

/* ---------------------------------------------------------------------
   11. Cookie consent banner
--------------------------------------------------------------------- */
.kw-cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:1200;
  background: var(--kw-navy-dark); color:#e7edf9; box-shadow:0 -6px 24px rgba(0,0,0,.25);
}
.kw-cookie-banner[hidden]{ display:none; }
.kw-cookie-banner-inner{
  max-width: var(--kw-max-width); margin:0 auto; padding:20px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.kw-cookie-banner-inner p{ margin:0; font-size:.92rem; max-width:640px; }
.kw-cookie-banner-inner a{ color:#fff; text-decoration:underline; }
.kw-cookie-banner-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.kw-cookie-btn{
  border-radius:30px; padding:11px 22px; font-weight:600; font-size:.9rem; cursor:pointer; border:2px solid transparent;
}
.kw-cookie-btn-primary{ background:var(--kw-blue); color:#fff; }
.kw-cookie-btn-primary:hover{ background:#4a72e0; }
.kw-cookie-btn-secondary{ background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.kw-cookie-btn-secondary:hover{ border-color:#fff; }

/* ---------------------------------------------------------------------
   10. Footer
--------------------------------------------------------------------- */
.site-footer{ background: var(--kw-navy); color:#cfd9ee; margin-top:0; }
.site-footer a{ color:#e7edf9; }
.site-footer a:hover{ color:#fff; }
.footer-columns{
  max-width: var(--kw-max-width); margin:0 auto; padding: 64px 24px 40px;
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap:32px;
}
.footer-columns h3{ color:#fff; font-size:1rem; margin-bottom:1em; }
.footer-columns ul{ list-style:none; margin:0; padding:0; }
.footer-columns li{ margin-bottom:.6em; font-size:.92rem; }
.footer-brand p{ color:#a9b8d6; font-size:.92rem; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding: 20px 24px; text-align:center;
  font-size:.85rem; color:#8fa0c4;
}
@media (max-width: 880px){
  .footer-columns{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px){
  .footer-columns{ grid-template-columns: 1fr; }
  .wp-block-columns{ flex-wrap:wrap !important; }
}


/* ---------------------------------------------------------------------
   12. Visual refresh - depth, gradients, motion (flat white background
   felt too plain; this adds subtle energy without changing structure)
--------------------------------------------------------------------- */
body{
  background:
    radial-gradient(1100px 520px at 12% -8%, rgba(47,95,214,.08), transparent 60%),
    radial-gradient(900px 480px at 100% 0%, rgba(18,42,79,.06), transparent 55%),
    var(--kw-white);
}

.wp-block-group.has-background[style*="F4F6FB"]{
  background-image: linear-gradient(180deg, rgba(47,95,214,.04), rgba(47,95,214,0) 45%) !important;
}

.wp-block-cover{
  background-image:
    radial-gradient(760px 420px at 85% -10%, rgba(47,95,214,.35), transparent 60%),
    linear-gradient(135deg, var(--kw-navy) 0%, var(--kw-navy-dark) 100%);
}

.kw-cta{ position:relative; overflow:hidden; }
.kw-cta::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(600px 320px at 15% 110%, rgba(255,255,255,.10), transparent 60%);
}
.kw-cta > *{ position:relative; z-index:1; }

.wp-block-button__link{
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
  box-shadow: 0 6px 16px rgba(47,95,214,.22);
}
.wp-block-button__link:hover{
  opacity:1; transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(47,95,214,.32);
}
.wp-block-button.is-style-outline .wp-block-button__link{ box-shadow:none; }

.kw-feature-card{
  border-top:3px solid var(--kw-blue);
  box-shadow: 0 4px 18px rgba(18,42,79,.07);
  transition: transform .2s ease, box-shadow .2s ease;
}
.kw-feature-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(18,42,79,.15);
}

.site-header{ box-shadow: 0 1px 0 rgba(18,42,79,.06), 0 8px 24px rgba(18,42,79,.05); }

.wp-block-image img{ transition: transform .3s ease; }
.wp-block-image a:hover img{ transform: scale(1.02); }

.kw-post-card img{ transition: transform .35s ease; }
.kw-post-card:hover img{ transform: scale(1.04); }


/* ---------------------------------------------------------------------
   13. Design overhaul v2 - real visual identity: section rhythm, texture,
   stat band, image treatments, badges. Goes further than the v1 subtle
   pass because flat white sections still read as plain.
--------------------------------------------------------------------- */

/* Alternate section rhythm: give plain white groups a faint dot texture
   so large text-only sections are not bare */
.wp-block-group.has-background[style*="FFFFFF"]{
  background-image: radial-gradient(rgba(18,42,79,.06) 1px, transparent 1px);
  background-size: 22px 22px;
  background-position: -6px -6px;
}
.wp-block-group.has-background[style*="FFFFFF"] > *{ position:relative; z-index:1; }

/* Eyebrow / kicker label styling (small caps line above H1/H2) */
.kw-eyebrow, p.has-text-align-left > strong:first-child:only-child{
  display:inline-block;
}

/* Stat band - full-bleed dark section for big numbers/claims */
.kw-stat-band{
  position:relative;
  background:
    radial-gradient(700px 380px at 90% 0%, rgba(47,95,214,.35), transparent 60%),
    linear-gradient(135deg, var(--kw-navy) 0%, var(--kw-navy-dark) 100%);
  color:#fff;
  overflow:hidden;
}
.kw-stat-band::before{
  content:"";
  position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 26px 26px;
  pointer-events:none;
}
.kw-stat-band > *{ position:relative; z-index:1; }
.kw-stat-band h2{ color:#fff; }
.kw-stat-band p{ color:#dbe4f5; }
.kw-stat-band .kw-stat-number{
  font-size:clamp(48px,7vw,84px);
  font-weight:800;
  line-height:1;
  background:linear-gradient(90deg,#fff,#bcd0f5);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Feature card polish (extends v1 .kw-feature-card) */
.kw-feature-card{
  background:var(--kw-white);
  border-radius:var(--kw-radius);
  padding:28px 24px;
}
.kw-feature-card .kw-feature-icon{
  width:48px; height:48px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:var(--kw-blue-light);
  color:var(--kw-blue);
  font-size:22px; font-weight:700;
  margin-bottom:16px;
}

/* Image framing used across content pages for real photography */
.kw-photo{
  border-radius:var(--kw-radius);
  overflow:hidden;
  box-shadow:0 18px 40px rgba(18,42,79,.16);
}
.kw-photo img{ display:block; width:100%; height:100%; object-fit:cover; }
.kw-photo-caption{
  font-size:13px; color:#5b6b85; margin-top:8px;
}

/* Portrait / bio image ring */
.kw-portrait img{
  border-radius:var(--kw-radius);
  box-shadow:0 14px 34px rgba(18,42,79,.18);
}

/* Section badge / pill (used for geo tags e.g. "Rhein-Main", "DACH") */
.kw-pill{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 14px;
  border-radius:999px;
  background:var(--kw-blue-light);
  color:var(--kw-navy);
  font-size:13px; font-weight:600;
  letter-spacing:.02em;
}
.kw-pill + .kw-pill{ margin-left:8px; }

/* Divider accent between major sections */
.kw-divider{
  height:3px; width:64px; border-radius:2px;
  background:linear-gradient(90deg,var(--kw-blue),var(--kw-navy));
  margin:0 auto 20px;
}
.has-text-align-left + .kw-divider, .kw-divider.is-left{ margin-left:0; }

/* Two-column media/text layout spacing polish */
.wp-block-columns.kw-media-row{ align-items:center; gap:48px; }

/* Hero fix: ensure cover block never shows a broken-image glyph if bg fails */
.wp-block-cover__image-background, .wp-block-cover img{ object-fit:cover; }


/* ---------------------------------------------------------------------
   14. Fix: custom color-palette classes had no CSS mapping, so every
   "backgroundColor":"kw-grey-bg" / "white" / "kw-navy" etc. block was
   silently rendering with NO background at all (transparent/white) -
   the intended alternating section rhythm never actually appeared,
   which is the real reason pages read as an unbroken wall of white.
   Also calms the base white down from clinical #fff and reduces the
   oversized hero/intro paragraph text.
--------------------------------------------------------------------- */
.has-kw-navy-background-color{ background-color: var(--kw-navy) !important; }
.has-kw-navy-dark-background-color{ background-color: var(--kw-navy-dark) !important; }
.has-kw-blue-background-color{ background-color: var(--kw-blue) !important; }
.has-kw-blue-light-background-color{ background-color: var(--kw-blue-light) !important; }
.has-kw-grey-bg-background-color{ background-color: var(--kw-grey-bg) !important; }
.has-white-background-color{ background-color: var(--kw-white) !important; }
.has-kw-navy-color{ color: var(--kw-navy) !important; }
.has-kw-text-color{ color: var(--kw-text) !important; }

/* Soften the base white so it stops reading as stark/clinical */
:root{ --kw-white: #FCFDFE; }

/* Apply the subtle texture to the CLASS now that it actually paints,
   not just to the old inline-style-hex selector (kept for safety) */
.wp-block-group.has-white-background-color,
.wp-block-group.has-background[style*="FFFFFF"]{
  background-image: radial-gradient(rgba(18,42,79,.07) 1px, transparent 1px);
  background-size: 22px 22px;
  background-position: -6px -6px;
}
.wp-block-group.has-white-background-color > *,
.wp-block-group.has-background[style*="FFFFFF"] > *{ position:relative; z-index:1; }

/* Grey sections get a touch more presence so the alternation reads clearly */
.wp-block-group.has-kw-grey-bg-background-color{
  background-image: linear-gradient(180deg, rgba(47,95,214,.05), rgba(47,95,214,0) 55%);
}

/* A thin top accent line wherever a light section follows another light
   section, so consecutive white/grey blocks don't blur into one slab */
.wp-block-group.has-white-background-color + .wp-block-group.has-white-background-color,
.wp-block-group.has-kw-grey-bg-background-color + .wp-block-group.has-white-background-color,
.wp-block-group.has-white-background-color + .wp-block-group.has-kw-grey-bg-background-color{
  border-top: 1px solid rgba(18,42,79,.08);
}

/* Rein in oversized intro paragraphs (was rendering ~1.5em, felt like a
   blog pull-quote instead of hero subtext) */
.has-large-font-size{ font-size: 19px !important; line-height: 1.6 !important; }


/* ---------------------------------------------------------------------
   15. Fix: the dark-navy CTA band ("kw-cta") sat directly on top of the
   equally dark-navy footer with almost no visible seam between them -
   the two blocks visually merged into one slab. Switch the CTA to the
   site's vivid blue accent so it reads as its own moment and creates a
   clear boundary against the footer below it.
--------------------------------------------------------------------- */
.wp-block-group.kw-cta{
  background: linear-gradient(135deg, var(--kw-blue) 0%, #1d47ad 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.kw-cta::before{
  background: radial-gradient(600px 320px at 15% 110%, rgba(255,255,255,.16), transparent 60%);
}