/* =============================================================
   SEOGEO Performance — Dezenter Analyse-Hinweis (Leistungsseiten)
   Zwei Ausführungen:
     · Variante 1  →  .analyse-mini   (Score-Ring + Zeile + Text-Link)
     · Variante 3  →  .analyse-nudge  (Karte mit Akzentrand + Ghost-Button)
   -------------------------------------------------------------
   Ergänzt style.css (nutzt dessen CSS-Variablen). Nur neue Klassen,
   überschreibt nichts. Auf den Leistungsseiten einbinden NACH style.css:
     <link rel="stylesheet" href="../css/analyse-mini.css?v=1">
   Platzierung: direkt ÜBER dem Abschluss-CTA (siehe EINBAU-ANLEITUNG.md).
   ============================================================= */

/* ===================== Variante 1 ===================== */
.analyse-mini{
  background:var(--color-bg);
  border-top:1px solid var(--color-light-1);
  border-bottom:1px solid var(--color-light-1);
  padding:2.25rem 0;
}
/* Optionaler heller Grün-Ton statt Weiß: class="analyse-mini analyse-mini--tint" */
.analyse-mini--tint{background:var(--color-light-3);background-image:none;}
.analyse-mini-inner{display:flex;align-items:center;gap:1.5rem;max-width:960px;margin:0 auto;}.analyse-mini-chip{
  flex:none;width:70px;height:70px;border-radius:50%;
  background:conic-gradient(var(--color-neon-1) 68%, var(--color-light-2) 0);
  display:flex;align-items:center;justify-content:center;position:relative;
}
.analyse-mini-chip::before{content:"";position:absolute;inset:7px;background:var(--color-bg);border-radius:50%;}
.analyse-mini-chip span{position:relative;font-family:var(--font-headline);font-size:1.25rem;color:var(--color-dark-1);}
.analyse-mini-text{flex:1;min-width:0;}
.analyse-mini-text strong{display:block;font-family:var(--font-headline);font-size:1.3rem;color:var(--color-dark-1);line-height:1.2;margin-bottom:.2rem;}
.analyse-mini-text span{font-size:1.02rem;color:var(--color-muted);line-height:1.45;}
.analyse-mini-link{
  flex:none;color:var(--color-dark-1);font-weight:700;font-size:1.1rem;
  text-decoration:underline;text-decoration-color:var(--color-neon-1);
  text-decoration-thickness:3px;text-underline-offset:4px;white-space:nowrap;transition:color .15s ease;
}
.analyse-mini-link:hover{color:var(--color-dark-2);}
@media (max-width:600px){
  .analyse-mini-inner{flex-wrap:wrap;gap:1rem;}
  .analyse-mini-link{width:100%;}
}

/* ===================== Variante 3 ===================== */
/* Dunkles Conversion-Band: dunkelgrüne Karte + Neon-Button. Poppt garantiert
   auf JEDEM Nachbar (weiß ODER hellgrün) und liest sich als das kostenlose
   Angebot / der Lead-Magnet. Ersetzt die alte helle Karte, die als
   .analyse-nudge--onlight weiß-auf-weiß verschwand. */
.analyse-nudge{background:var(--color-bg);padding:2.75rem 0;}
.analyse-nudge-card{
  max-width:960px;margin:0 auto;display:flex;align-items:center;gap:1.5rem;
  background:var(--color-dark-1);border:1px solid var(--color-dark-1);
  border-left:6px solid var(--color-neon-1);border-radius:var(--radius);
  padding:1.6rem 1.85rem;box-shadow:0 12px 34px rgba(13,43,26,.20);
}
.analyse-nudge-ic{
  width:58px;height:58px;flex:none;border-radius:12px;
  background:rgba(61,224,41,0.14);border:1px solid rgba(61,224,41,0.35);
  display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;
}
.analyse-nudge-text{flex:1;min-width:0;}
.analyse-nudge-text strong{display:block;font-family:var(--font-headline);font-size:1.3rem;color:#fff;line-height:1.2;margin-bottom:.25rem;}
.analyse-nudge-text span{font-size:1.02rem;color:var(--color-light-2);line-height:1.45;}
.analyse-nudge-btn{
  flex:none;border:2px solid var(--color-neon-1);color:var(--color-dark-1);background:var(--color-neon-1);
  font-weight:700;font-size:1rem;padding:.75rem 1.4rem;border-radius:999px;white-space:nowrap;
  text-decoration:none;box-shadow:0 4px 0 rgba(0,0,0,.28);
  transition:background .15s ease,transform .12s ease,box-shadow .12s ease;
}
.analyse-nudge-btn:hover{background:var(--color-neon-2);transform:translateY(-1px);box-shadow:0 6px 0 rgba(0,0,0,.28);}
@media (max-width:600px){
  .analyse-nudge-card{flex-wrap:wrap;}
  .analyse-nudge-btn{width:100%;text-align:center;}
}

/* --onlight bleibt kompatibel: nur noch neutraler (weißer) Sektions-Hintergrund.
   Die dunkle Karte ist jetzt in JEDER Variante sichtbar. */
.analyse-nudge--onlight{background:var(--color-bg);}

/* ===================== Variante 4 — Großer Score-Banner (.abx) =====================
   Abschluss-Banner „Kostenlose Analyse" im Website-Check-Look der Homepage:
   dunkles Conversion-Band, links Tool-Card mit Score-Ring, rechts Text + CTA.
   Ersetzt den schmalen .analyse-nudge auf Leistungs- und Stadtseiten und bringt
   die score-demo-Card-Styles selbst mit (analyse-tool.css ist dort NICHT eingebunden). */
.abx{background:var(--color-dark-1);padding:var(--section-pad) 0;}
.abx-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(3rem,5vw,4.5rem);align-items:center;max-width:1200px;margin:0 auto;}
.abx-visual{display:flex;justify-content:center;padding:6px;}
.abx-eyebrow{display:inline-block;font-family:var(--font-headline);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--color-neon-1);background:rgba(61,224,41,.15);padding:.35rem .75rem;border-radius:6px;margin-bottom:1rem;}
.abx-text h2{color:#fff;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.12;margin:0 0 .9rem;}
.abx-text > p{color:var(--color-light-2);font-size:1.05rem;line-height:1.5;margin:0 0 1.4rem;max-width:46ch;}
.abx-list{list-style:none;margin:0 0 1.6rem;padding:0;display:grid;gap:.7rem;}
.abx-list li{position:relative;padding-left:1.9rem;color:var(--color-light-2);font-size:.98rem;line-height:1.4;margin:0;}
.abx-list li::before{content:"✓";position:absolute;left:0;top:0;color:var(--color-neon-1);font-weight:800;}
.abx-list strong{color:#fff;}
.abx-text .analyse-nudge-btn{display:inline-block;}
.abx-note{margin:1.5rem 0 0;font-size:.85rem;color:rgba(255,255,255,.6);}
/* Score-Card (aus analyse-tool.css übernommen, Schatten fürs dunkle Band gedämpft) */
.abx .score-demo{background:var(--color-bg);border-radius:14px;box-shadow:0 20px 44px rgba(0,0,0,.28);overflow:hidden;border:1px solid rgba(13,43,26,.10);width:100%;max-width:460px;}
.abx .score-demo__bar{display:flex;align-items:center;gap:.4rem;padding:.7rem .95rem;background:#0D2B1A;}
.abx .sd-dot{width:11px;height:11px;border-radius:50%;}
.abx .sd-dot:nth-child(1){background:#ff5f57;}
.abx .sd-dot:nth-child(2){background:#febc2e;}
.abx .sd-dot:nth-child(3){background:#28c840;}
.abx .sd-url{margin-left:.55rem;font-family:ui-monospace,Menlo,monospace;font-size:.72rem;color:#9fceac;}
.abx .score-demo__body{padding:1.25rem;}
.abx .sd-overall{display:flex;align-items:center;gap:1rem;margin-bottom:0;}
.abx .sd-ring{--val:68;width:82px;height:82px;flex:none;border-radius:50%;background:conic-gradient(var(--color-neon-1) calc(var(--val)*1%),var(--color-light-1) 0);display:flex;align-items:flex-end;justify-content:center;gap:1px;position:relative;padding-bottom:1.4rem;}
.abx .sd-ring::before{content:"";position:absolute;inset:9px;background:var(--color-bg);border-radius:50%;}
.abx .sd-ring-num{position:relative;font-family:var(--font-headline);font-size:1.7rem;color:var(--color-dark-1);line-height:1;}
.abx .sd-ring-max{position:relative;font-size:.66rem;color:var(--color-muted);margin-bottom:.28rem;}
.abx .sd-overall-txt strong{display:block;font-family:var(--font-headline);color:var(--color-dark-1);font-size:1.02rem;margin-bottom:.15rem;}
.abx .sd-overall-txt span{font-size:.85rem;color:var(--color-muted);line-height:1.4;}
.abx .sd-foot{margin:.95rem 0 0;font-size:.72rem;color:var(--color-muted);text-align:center;line-height:1.45;}
@media (max-width:900px){
  .abx-grid{grid-template-columns:1fr;gap:2rem;}
  .abx-visual{order:2;}
  .abx-text{order:1;}
}