:root{
  /* Brand */
  --brand-500:#ff2f90; /* Primär-CTA */
  --brand-600:#e02080; /* Active */
  --brand-400:#ff4fa0; /* Hover/Focus ring */
  --accent-neutral:#f79aac; /* Pill neutral border */
  --danger:#ff0000;

  /* Neutral */
  --bg:#FCFAF8;
  --bg-alt:#f5f6f7;          /* Seitenhintergrund/Flächen */
  --panel:#ffffff;           /* Panels/Sheet */
  --panel-alt:#F7F3F0;
  --line:#E6E1DC;
  --line-strong:#D4CEC8;    /* stärkere Rahmen (2px) */

  --text-strong:#1F1B1A;
  --text:#2B2625;
  --text-soft:#5F5855;
  --text-muted:#8E8581;
  /* Shape & spacing */
  --r:2px;                   /* globaler Radius */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px; --space-8:32px;

  /* Focus (ohne Glow) */
  --focus-ring: 0 0 0 2px color-mix(in oklab, var(--brand-400) 65%, transparent);

  --font-ui: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fs-200:14px; --fs-300:16px; --fs-400:18px; --fs-500:20px; --fs-700:28px; --fs-900:42px;
  --lh-tight:1.25; --lh:1.5;
  --w-reg:400; --w-med:500; --w-semi:600; --w-bold:700;
}

/* Consolidated CSS for Home page: home template, hero and landing snippets */
.ka-left { justify-content:flex-start; }
.ka-right { justify-content:flex-end; }
.ka-center { justify-content:center; }
.ka-mb-1 { margin-bottom: 1rem !important ; }
.ka-mb-2 { margin-bottom: 2rem !important; }
.ka-mb-3 { margin-bottom: 3rem !important; }
.ka-mb-4 { margin-bottom: 4rem !important; }
.ka-mb-6 { margin-bottom: 6rem !important; }
.ka-mt-1 { margin-top:1rem !important; }
.ka-mt-2 { margin-top:2rem !important; }
.ka-mt-3 { margin-top:3rem !important; }
.ka-mt-4 { margin-top:4rem !important; }
.ka-mt-6 { margin-top:6rem !important; }
.ka-ml-1 { margin-left:1rem !important; }
.ka-ml-2 { margin-left:2rem !important; }
.ka-ml-3 { margin-left:3rem !important; }
.ka-ml-4 { margin-left:4rem !important; }
.ka-ml-6 { margin-left:6rem !important; }
.ka-mr-1 { margin-right:1rem !important; }
.ka-mr-2 { margin-right:2rem !important; }
.ka-mr-3 { margin-right:3rem !important; }
.ka-mr-4 { margin-right:4rem !important; }
.ka-mr-6 { margin-right:6rem !important; }
.ka-my-1 { margin-top:1rem !important; margin-bottom:1rem !important; }
.ka-my-2 { margin-top:2rem !important; margin-bottom:2rem !important; }
.ka-my-3 { margin-top:3rem !important; margin-bottom:3rem !important; }
.ka-my-4 { margin-top:4rem !important; margin-bottom:4rem !important; }
.ka-my-6 { margin-top:6rem !important; margin-bottom:6rem !important; }
.ka-pt-1 { padding-top:1rem !important; }
.ka-pt-2 { padding-top:2rem !important; }
.ka-pt-3 { padding-top:3rem !important; }
.ka-pt-4 { padding-top:4rem !important; }
.ka-pb-1 { padding-bottom:1rem !important; }
.ka-pb-2 { padding-bottom:2rem !important; }
.ka-pb-3 { padding-bottom:3rem !important; }
.ka-pb-4 { padding-bottom:4rem !important; }
.ka-text-center { text-align:center; }
.ka-text-left { text-align:left; }
.ka-text-right { text-align:right; }

/* From site/snippets/home/hero.php */
.ka-hero-section .absolute.inset-0 {
  background: linear-gradient(
    to bottom,
    #f79aac,
    #fba2a6,
    #fdadab,
    #fec6b3,
    #ffe0c3,
    #fff0d8,
    #fff6ea,
    #fcfaf8
  );
}

/* Explicit hero sizes (moved from inline) */
#hero.ka-hero-section { height: 75vh; min-height: 600px; }

/* Gradient background for hero (moved from inline) */
.ka-hero-bg {
  background-image: linear-gradient(to bottom,#f79aac, #fba2a6,#fdadab,#fec6b3,#ffe0c3,#fff0d8,#fff6ea, #fcfaf8);
}

/* Replacement classes for Tailwind utilities used in hero.php */
.ka-hero { position: relative; overflow: hidden; }
.ka-hero-bg { position: absolute; inset: 0; }
.ka-hero-inner {
  position: relative; z-index: 10; height: 100%;
  display: flex; align-items: center; justify-content: center;
  padding-left: 1rem; padding-right: 1rem;
}
.ka-hero-content { text-align: center; max-width: 56rem; margin-left: auto; margin-right: auto; padding-top: 4rem; padding-bottom: 4rem; }
.ka-hero-search { max-width: 600px; margin-left: auto; margin-right: auto; position: relative; }
.ka-hero-form { position: relative; }

/* Search input wrapper positioning */
.ka-search-input-wrapper { position: relative; }

/* Add outline to input when showing suggestions - more specific selector */
.showing-suggestions .ka-search-input-wrapper #address-input {
  width: 100%;
  padding: 1rem 3rem 1rem 1.5rem;
  font-size: 1.125rem;
  border: 0;                 /* alte Border entfernen */
  outline: 0.5rem solid rgba(255, 255, 255, 0.5) !important;
  outline-offset: 0;
  border-radius: 9999px;     /* Pill */
  background: #fff;
  transition: all .2s ease;
  position: relative; z-index: 10;

  /* Hairline via inset shadow: rendert zuverlässiger als border:.5px */
  box-shadow: 0 0 0 0.5px var(--accent-neutral) inset;
}

/* Footer moved to assets/css/style.css */

/* Focus (Keyboard) – scharf, nicht glowy */
.ka-search-input-wrapper:focus-within {
  outline: none !important;
  box-shadow: none !important;
}

/* Remove focus outline */
#address-input:focus { 
  outline: none !important; 
  box-shadow: none; 
}

/* Ruhestand (z. B. wenn nicht fokussiert) */
.search:not(.is-focused) #address-input{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;   /* … am Ende */
}

/* Beim Fokus normal scrollen lassen */
.search.is-focused #address-input{
  white-space: nowrap;
  overflow-x: auto;          /* mobil: native horizontal scroll */
  text-overflow: clip;
}

/* Kleine Komfortsache: Scrollbar ausblenden auf iOS */
.search.is-focused #address-input::-webkit-scrollbar{ display:none; }

/* Autocomplete dropdown styling */
#autocomplete-suggestions {
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  padding: 0.5rem 0;
  margin: 0 2rem;
  background-color: rgba(255, 255, 255, 0.5) !important;
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
  z-index: 1000 !important; /* replicate z-50 intent */
}

/* Individual suggestion items */
.suggestion-item {
  color: #666666;
  font-weight: 400;
  padding: 0.625rem 2rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.suggestion-item:last-child { 
  border-bottom: none; 
}
.suggestion-item:hover { 
  background-color: rgba(255, 255, 255, 0.3); 
  cursor: pointer; 
}
.suggestion-item.bg-blue-50 { 
  background-color: #eff6ff; 
}

/* Search button states (neutral + hover + disabled) */
#search-submit{
  background: transparent;
  color: #6b7280;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
#search-submit:hover:not(:disabled){
  background: #f3f4f6;
}
#search-submit:disabled{
  opacity: .5;
  cursor: not-allowed;
}

/* Typing / Invalid -> Rot (Icon rot, zarter roter BG) */
.typing #search-submit,
.invalid #search-submit{
  background: rgba(255,0,0,0.15);
  color: rgb(255,0,0);
}

/* Valid -> Magenta (tint, nicht vollflächig) */
.valid #search-submit{
  background: var(--brand-500);
  color: #fff;
}

.valid #search-submit:hover{
  background: var(--brand-400);
}

/* Additional replication of inline styles from hero */
#address-input { border: 1px solid #fdcbb4; margin-bottom: 0.5rem; }
#search-submit { margin-top: -0.25rem; }

/* Input and submit positioning/visuals to replace utilities */
#address-input {
  width: 100%; padding: 1rem 3rem 1rem 1.5rem; font-size: 1.125rem;
  border-radius: 9999px; background: #fff; transition: all .2s ease; position: relative; z-index: 10;
}
#search-submit {
  position: absolute; right: .5rem; top: 50%; transform: translateY(-50%);
  width: 2.5rem; height: 2.5rem; border-radius: 9999px;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s ease;
  z-index: 10;
  border: none; /* Explicitly remove border */
}
#search-submit:disabled { opacity: .5; cursor: not-allowed; }

/* Loading state für Input */
#address-input:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  background-color: #f9f9f9;
}

/* Search Button Spinner */
.search-spinner {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: relative;
  animation: rotate 1s linear infinite;
}

.search-spinner::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  inset: 0px;
  border-radius: 50%;
  border: 2px solid #FFF;
  animation: prixClipFix 2s linear infinite;
}

@keyframes rotate {
  100% { transform: rotate(360deg) }
}

@keyframes prixClipFix {
  0%   { clip-path: polygon(50% 50%,0 0,0 0,0 0,0 0,0 0) }
  25%  { clip-path: polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0) }
  50%  { clip-path: polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%) }
  75%  { clip-path: polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%) }
  100% { clip-path: polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0) }
}

/* Generic helpers replacing utilities used in hero.php */
.hidden { display: none !important; }
#validation-feedback { margin-top: .5rem; font-size: .875rem; }
#search-error { margin-top: .5rem; font-size: .875rem; color: #dc2626; }

/* From site/snippets/home/landing.php */
#ka-landing-container { 
  display: grid; 
  grid-template-columns: 1fr; 
}

/* 3x2 Grid for the steps >768 = 1 Spalte */
.ka-grid-explainer { 
  display:grid; 
  grid-template-columns:1fr; 
  column-gap:3rem; 
  row-gap: 1.5rem;
  margin: 0 auto; 
}

/* Min-Width "reset" to prevent the elements to prevent downsizing on mobile*/
.ka-grid-explainer, .ka-step, .ka-step-content, .ka-fore, .ka-back { 
  min-width: 0; 
}

.ka-grid-explainer > .ka-step { 
  overflow: visible; 
}

.ka-step { 
  display:grid; 
  grid-template-columns:1fr; 
  grid-template-rows:min-content;
  max-width: 350px;
  overflow: visible;
}
.ka-step-spacer { display:block; }
.ka-step-content { 
  display:grid; 
  grid-template-columns:1fr; 
  grid-template-rows:min-content;
}
.ka-step-content { 
  transition: transform .3s ease; 
  will-change: transform; 
}
@media (hover:hover){ 
  .ka-step-content:hover { 
    transform: translateY(-4px); 
  } 
}
.ka-step-bg { 
  grid-area:1 / 1; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  z-index:0; 
  pointer-events:none; 
  user-select:none; 
}
.ka-step-fore { 
  grid-area:1 / 1; 
  z-index:1; 
  display:flex; 
  flex-direction:column; 
  align-items:center; 
  justify-content:center; 
  text-align:center; 
}
.ka-step-number { 
  font-size:12rem; 
  font-weight:800; 
  line-height: .8 !important; 
  background-image:linear-gradient(180deg,#f4f3f1,#ECE9E6); 
  color: transparent; 
  background-clip: text; 
  -webkit-background-clip:text; 
  -webkit-text-fill-color:transparent; 
  white-space:nowrap; 
}

.ka-sub { font-size: 1.25rem; line-height: 1.6; color: var(--text); }
.ka-p { font-size: 1.1rem; line-height: 1.5; color: var(--text); margin: 0; }
.ka-strong { font-weight: 700; color:rgb(39, 22, 17); }
.ka-back { grid-area: 1 / 1; display:flex; align-items:center; z-index:-1; pointer-events:none; user-select:none; }

.ka-back .word { 
  font-size: 4rem; 
  font-weight:700; 
  line-height:1.1; 
  background-image: linear-gradient(180deg, #f4f3f1, #ECE9E6); 
  color: transparent; 
  background-clip: text; 
  -webkit-background-clip:text; 
  -webkit-text-fill-color:transparent; 
  white-space:nowrap;
  max-width:100%; 
  overflow:hidden; 
}

.ka-bullets { 
  display:flex; 
  flex-direction:column; 
  gap:.5rem; 
}
.bullet-text { 
  font-size:.9rem !important; 
  line-height:1.6 !important; 
  margin:0 !important; 
  color: var(--text); 
}

.bullet-key { 
  font-weight:600; 
  color: var(--text); 
  margin-right:0.3rem;
}
.step-text { 
  font-size:1.2rem; 
  line-height:1.6; 
  color: var(--text); 
}

/* Inline responsive spacer controls for Explainer steps */
.spacer-lg, .spacer-md { display: none; }

/* CTA after steps: replicate anchor styles */
.ka-button {
  background-color: rgb(234, 56, 145) !important;
  color: #ffffff !important;
  padding: 0.75rem 2rem;
  border-radius: 2px !important;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: none !important;
  transition: filter .15s ease;
  outline: none !important;
}

/* Problem/Solution headings and bullets are covered above. Buttons replication: */
.ka-fore.ka-text-left a[href="#"] {
  background-color: rgb(234, 56, 145) !important;
  color: #ffffff !important;
  padding: 0.75rem 2rem;
  border-radius: 2px !important;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: none !important;
  transition: filter .15s ease;
  outline: none !important;
}
.ka-fore.ka-text-right a[href="#"] {
  background-color: #ea3891 !important;
  color: #ffffff !important;
  padding: 0.75rem 2rem;
  border-radius: 2px !important;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: none !important;
  transition: filter .15s ease;
  outline: none !important;
}

/* FAQ styles */
.ka-landing-faq-wrap{
  width:100%;
  max-width:1000px;
  margin:0 auto
}
.ka-landing-faq-group{
  background:transparent;
  border:1px solid #ece9e6;
  border-radius:2px;
  overflow:hidden
}
.ka-landing-faq{
  border-top:.5px solid #ECE9E6
}
.ka-landing-faq:first-child{
  border-top:none
}
.ka-landing-faq-q{
  list-style:none;
  cursor:pointer;
  padding:.8rem 1rem .8rem 1rem;
  position:relative;
  display:flex;
  align-items:center
}
.ka-landing-faq-q::-webkit-details-marker{display:none}
.ka-faq-arrow{margin-left:auto;color:#ea3891;transition:transform .2s ease}
.ka-landing-faq[open] .ka-faq-arrow{transform:rotate(180deg)}
.ka-landing-faq-a{padding:16px;background:#ECE9E6;}
.ka-landing-faq-q:focus,
.ka-landing-faq-q:focus-visible,
.ka-landing-faq:focus-within summary{ outline:none !important; box-shadow:none !important; }
.ka-landing-faq-q{ -webkit-tap-highlight-color: transparent; }
.ka-faq-word { font-size: clamp(10rem, 20vw, 18rem); line-height:1.1; justify-self:center; align-self:center; width:100%; }
.ka-back .word.ka-faq-word { font-size: clamp(10rem, 20vw, 18rem); }

/* Data & Insights section */
.ka-landing .ka-fore { align-self: start; }
.ka-data-sec { position: relative; --data-size: clamp(6rem, 10vw, 10rem); min-height: calc(var(--data-size) * 1.1); }
.ka-data-sec .ka-back { position: absolute; top: calc(var(--data-size) * 0.08 + 2rem); left: 0; right: 0; display: block; }
.ka-data-word { font-size: var(--data-size); line-height:1.1; justify-self:center; align-self:center; width:100%; }

/* SEO blocks and lists */
.ka-seo-card{
  border:1px solid #ECE9E6;
  border-radius:2px
}
.ka-seo-summary{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 16px
}
.ka-seo-summary .ka-seo-arrow{
  margin-left:auto;color:#ea3891;
  transition:transform .2s ease
}
.ka-seo-summary:focus, .ka-seo-summary:focus-visible, .ka-seo-card:focus, .ka-seo-card:focus-visible,.ka-seo-card:focus-within { 
  outline: none !important; 
  box-shadow: none !important; 
}
details.ka-seo-card[open] .ka-seo-arrow{
  transform:rotate(180deg)
}
.ka-seo-body{
  padding:12px 16px;
  background:transparent
}
.ka-seo-list{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr; row-gap:8px }

.kpi-dot{
  margin-left:auto;
  color:var(--text);
}
.ka-seo-kpis{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
.kpi{ background:#fff; border:.5px solid #ECE9E6; border-radius:8px; padding:12px 16px; display:flex; flex-direction:column; gap:4px }
.kpi-value{
  font-weight:700;
  color:#31051b;
  font-size:1.25rem
}
.kpi-label{
  color:var(--text);
}
/* Most N-W-O-S Kitas grid */
.ka-geo-grid{
  display:grid;
  grid-template-columns:1fr;
  row-gap:16px;
  justify-items:center
}

.ka-geo-card{
  --card-max: 560px; 
  width:100%; 
  max-width:var(--card-max); 
  display:grid;
  grid-template-columns:1fr;
  position:relative;
  border:1px solid #ECE9E6;
  border-radius:2px;
  padding:12px 16px;
  background:transparent;
  place-items:center;
  justify-self:center
}
.ka-geo-card .ka-back{
  grid-area:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:0
}
.ka-geo-card .ka-fore{
  grid-area:1 / 1;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:4px
}
.ka-geo-word{
  font-size:clamp(6rem,12vw,14rem);
  line-height:1.1;
  -webkit-text-fill-color:transparent;
  color: transparent; 
  background-clip: text; 
  -webkit-background-clip:text;
  background-image:linear-gradient(180deg,#f4f3f1,#ECE9E6);
  font-weight:700;
  white-space:nowrap
}

/* Concepts grid */
.ka-concepts-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px
}

.ka-concept-card{
  border:.5px solid #ECE9E6;
  border-radius:2px;padding:12px 16px;
  display:flex;flex-direction:column;
  align-items:center;
  justify-content:center;
  background:transparent
}
.ka-concept-label{
  color:var(--text);
  font-weight:600
}
.ka-concept-count{
  font-weight:300;
  color:#31051b;
  font-size:1.25rem}
.ka-concepts-sec{position:relative}
.ka-concepts-sec .ka-back{
  position:absolute;
  top:0;
  right:0;
  display:block
}
.ka-concepts-word{
  font-size:clamp(4rem,10vw,10rem);
  line-height:1.1;
  -webkit-text-fill-color:transparent;
  color: transparent; 
  background-clip: text; 
  -webkit-background-clip:text;
  background-image:linear-gradient(180deg,#f4f3f1,#ECE9E6);
  font-weight:700;
  text-align:right;
  white-space:nowrap
}

/* Compare block */
.ka-compare { 
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr;
  width:100%;
  max-width:800px;
  margin:auto
}
.ka-col-1 {
  grid-column:1;
  text-align:left;
  align-items:center;
  justify-content:flex-start
}
.ka-col-2 {
  grid-column:2;
  text-align:right;
  align-items:center;
  justify-content:flex-end
}
.ka-row-full {
  grid-area:1 / 1 / 2 / 3;
  text-align:center;
  align-items:center;
  justify-content:center
}
.ka-back {
  font-size:clamp(3rem,8vw,6rem);
  line-height:1.1;
  -webkit-text-fill-color:transparent;
  color: transparent; 
  background-clip: text; 
  -webkit-background-clip:text;
  background-image:linear-gradient(180deg,#f4f3f1,#ECE9E6);
  font-weight:700;
  color:transparent;
  display:flex;
  align-items:center
}
/* moved to consolidated media block */

.ka-landing-faq-wrap{width:100%;max-width:1000px;margin:0 auto}
.ka-landing-faq-group{background:transparent;border:1px solid #ece9e6;border-radius:2px;overflow:hidden}
.ka-landing-faq{border-top:.5px solid #ECE9E6}
.ka-landing-faq:first-child{border-top:none}
.ka-landing-faq-q{list-style:none;cursor:pointer;padding:.8rem 1rem .8rem 1rem;position:relative;display:flex;align-items:center}
.ka-landing-faq-q::-webkit-details-marker{display:none}
.ka-faq-arrow{margin-left:auto;color:#ea3891;transition:transform .2s ease}
.ka-landing-faq[open] .ka-faq-arrow{transform:rotate(180deg)}
.ka-landing-faq-a{padding:16px;background:#ffffff;}
.ka-landing-faq-q:focus,
.ka-landing-faq-q:focus-visible,
.ka-landing-faq:focus-within summary{outline:none !important;box-shadow:none !important;}
.ka-landing-faq-q{ -webkit-tap-highlight-color: transparent; }
.ka-faq-word { font-size: clamp(10rem, 20vw, 18rem); line-height:1.1; justify-self:center; align-self:center; width:100%; }
.ka-back .word.ka-faq-word { font-size: clamp(10rem, 20vw, 18rem); }

.ka-geo-grid{display:grid;grid-template-columns:1fr;row-gap:16px;justify-items:center}
/* moved to consolidated media block */
.ka-geo-card{--card-max:560px;width:100%;max-width:var(--card-max);display:grid;grid-template-columns:1fr;position:relative;border:1px solid #ECE9E6;border-radius:2px;padding:12px 16px;background:transparent;place-items:center;justify-self:center}
.ka-geo-card .ka-back{grid-area:1 / 1;display:flex;align-items:center;justify-content:center;z-index:0}
.ka-geo-card .ka-fore{grid-area:1 / 1;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px}
.ka-geo-word{font-size:clamp(6rem,12vw,14rem);line-height:1.1;-webkit-text-fill-color:transparent;color:transparent;background-clip:text;-webkit-background-clip:text;background-image:linear-gradient(180deg,#f4f3f1,#ECE9E6);font-weight:700;white-space:nowrap}
.ka-seo-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kpi{background:#fff;border:.5px solid #ECE9E6;border-radius:8px;padding:12px 16px;display:flex;flex-direction:column;gap:4px}
.kpi-value{font-weight:700;color:#31051b;font-size:1.25rem}
.kpi-label{color:#430725}

.ka-seo-card{border:1px solid #ECE9E6;border-radius:2px}
.ka-seo-summary{display:flex;align-items:center;gap:8px;padding:12px 16px}
.ka-seo-summary .ka-seo-arrow{margin-left:auto;color:#ea3891;transition:transform .2s ease}
.ka-seo-summary:focus,
.ka-seo-summary:focus-visible,
.ka-seo-card:focus,
.ka-seo-card:focus-visible,
.ka-seo-card:focus-within {outline:none !important;box-shadow:none !important;}
details.ka-seo-card[open] .ka-seo-arrow{transform:rotate(180deg)}
.ka-seo-body{padding:12px 16px;background:transparent}
.ka-seo-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;row-gap:8px}
.kpi-dot{margin-left:auto;color:#430725}
.ka-data-word{font-size:var(--data-size);line-height:1.1;justify-self:center;align-self:center;width:100%}
.ka-back .word.ka-data-word{font-size:clamp(6rem,10vw,10rem);font-weight:700}
.ka-fore--vcenter{align-self:center}
.ka-fore--top{align-self:start}
.ka-data-sec{position:relative;--data-size:clamp(6rem,10vw,10rem);min-height:calc(var(--data-size) * 1.1)}
.ka-data-sec .ka-back{position:absolute;top:calc(var(--data-size) * 0.08 + 2rem);left:0;right:0;display:block}

.ka-chipset{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-block;padding:.35rem .6rem;border:.5px solid #ECE9E6;border-radius:9999px;color:#430725;text-decoration:none}
.chip:hover{background:#ECE9E6}

/* Keyword style */
.bullet-keyword{font-weight:700}

.ka-seo-note{display:flex;flex-direction:column;gap:2rem}

/* Responsive */
/* 480px > 767px */
/* Consolidated media queries */
@media (min-width: 480px) {
  .ka-h2-hero { font-size: 1.5rem; line-height: 1.5rem; }
  .ka-landing-faq-q{ padding:.8rem 2rem .8rem 1rem; }
  .bullet-text { font-size:1rem !important; }
  .space-y { margin: 2rem 0; }
  .no-mobile { display:block; }
  .ka-back .word { font-size: 6rem; }
}

@media (min-width: 640px) {
  .ka-hero-inner { padding-left: 1.5rem; padding-right: 1.5rem; }
}

@media (min-width: 768px) {
  .ka-h2-hero { font-size: 1.5rem; line-height: 2.5rem; }
  .ka-geo-grid{ grid-template-columns:1fr 1fr; column-gap:16px; row-gap:16px; grid-template-areas:"geo-a geo-a" "geo-b geo-c" "geo-d geo-d"; justify-items:center }
  .ka-geo-a{ grid-area:geo-a }
  .ka-geo-b{ grid-area:geo-b }
  .ka-geo-c{ grid-area:geo-c }
  .ka-geo-d{ grid-area:geo-d }
  .ka-landing-faq-q{ padding:.8rem 3rem .8rem 1rem; }
  .ka-grid-explainer { grid-template-columns:1fr 1fr; row-gap: 0 !important; }
  .ka-grid-explainer > .ka-step:nth-child(3), .ka-grid-explainer > .ka-step:nth-child(4) { margin-top: -2rem; }
  .ka-step-number { font-size:14rem; font-weight:700; }
  .bullet-text { font-size:1.1rem !important; }
  .ka-h2-oversize { font-size: 2.25rem; line-height: 2.5rem; }
  .ka-h2 { font-size: 1.875rem; }
  .space-y { margin: 1rem 0; }
  .spacer-md { display:block }
  .spacer-lg { display: none; }
  .ka-seo-kpis{ grid-template-columns:repeat(4,1fr) }
  .ka-seo-list{ grid-template-columns:1fr 1fr }
}

@media (min-width: 1024px) {
  .ka-hero-inner { padding-left: 2rem; padding-right: 2rem; }
  .ka-h2-hero { font-size: 1.75rem; line-height: 2.5rem; }
  .ka-landing-faq-q{ padding:.8rem 4rem .8rem 1rem; }
  .ka-grid-explainer { grid-template-columns:1fr 1fr 1fr; row-gap: 0 !important; }
  .ka-grid-explainer > .ka-step:nth-child(4), .ka-grid-explainer > .ka-step:nth-child(5), .ka-grid-explainer > .ka-step:nth-child(6) { margin-top: -3rem; }
  .ka-step-number { font-size:16rem; }
  .bullet-text { font-size:1.2rem !important; }
  .space-y { margin: 0 !important; }
  .spacer-lg { display:block }
  .spacer-md { display: none; }
}