/* PRODUCTION · das-kisiegel.de · A05 Tageslicht-Graphit + Combo (B01+B02) */
@import url("/previews/option-4-kontaktbogen/styles.css");

/* A05 — Tageslicht & Graphit */
:root{
  --bg:#FFFFFF; --bg-deep:#000000; --ink:#15191E; --ink-soft:#52575F;
  --hair:rgba(21,25,30,.10); --paper:#F5F5F5;
  --cyan:#0E7C8C;
}
body{background:var(--bg);color:var(--ink)}
.hero-photo::after{background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.65) 100%)}
footer{background:#15191E}
.figureheads{background:var(--paper)}
.fig-card{box-shadow:0 1px 0 var(--hair)}
.cta{background:#FAFAFA}

/* B01 — Parallax-Hero */
.hero-photo img{animation:none !important;will-change:transform;transform:scale(1.18)}
.hero{height:108vh;min-height:760px}

/* B02 — Grid-Rise */
.fig-photo,.fig-card.in .fig-photo{clip-path:none !important}
.fig-card{transform:translateY(56px);opacity:0}
.fig-card.in{transform:translateY(0);opacity:1;transition:opacity .68s var(--ease-reveal),transform .68s var(--ease-reveal)}
.fig-card .fig-photo img{transform:scale(1.06)}
.fig-card.in .fig-photo img{transform:scale(1);transition:transform 1.2s var(--ease-reveal)}


/* SECTION · Was ist das KI-Siegel (Combi v2 — 2-Spalten: Foto links · Text+Werte rechts) */
.what{padding:140px 0;background:var(--bg);border-top:1px solid var(--hair)}
.what-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:18px;font-weight:500}

.cv2-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}

/* Linke Spalte: Foto */
.cv2-photo{position:sticky;top:96px}
.cv2-photo img{width:100%;aspect-ratio:3/4;object-fit:cover;background:#eee}
.cv2-caption{margin-top:14px;font-size:12px;color:var(--ink-soft);font-style:italic;line-height:1.5}

/* Rechte Spalte: Headline + Deck + Werte */
.cv2-h{font-size:clamp(36px,4.5vw,52px);font-weight:380;letter-spacing:-.014em;line-height:1.1;margin-bottom:24px;max-width:18ch}
.cv2-h em{font-style:italic}
.cv2-deck{font-size:17px;color:var(--ink);line-height:1.65;margin-bottom:48px;max-width:50ch}

.cv2-values{list-style:none;padding:0;margin:0;border-top:1px solid var(--hair)}
.cv2-values li{display:grid;grid-template-columns:64px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--hair);align-items:start}
.cv2-num{font-size:13px;letter-spacing:.14em;color:var(--cyan);font-weight:500;font-feature-settings:"tnum";padding-top:4px}
.cv2-values h3{font-size:20px;font-weight:420;letter-spacing:-.005em;margin-bottom:6px}
.cv2-values p{font-size:14px;color:var(--ink-soft);line-height:1.55;margin:0}

@media (max-width:900px){
  .what{padding:80px 0}
  .cv2-grid{grid-template-columns:1fr;gap:40px}
  .cv2-photo{position:static}
  .cv2-photo img{aspect-ratio:4/3}
  .cv2-values li{grid-template-columns:48px 1fr;gap:16px;padding:20px 0}
}

/* Mobile Phone (Welle MW01 · Vertical-Story · gewählt 2026-06-02) */
@media (max-width:760px){
  .what.what-combo-v2{padding:44px 0 60px;background:#fff}
  .what.what-combo-v2 .frame{padding:0 20px;max-width:none}
  .cv2-grid{display:block;gap:0}

  .cv2-photo{position:static;margin:0 0 30px;padding:0}
  .cv2-photo picture{display:block}
  .cv2-photo img{aspect-ratio:4/5;width:100%;object-fit:cover;border-radius:0}
  .cv2-caption{margin-top:10px;font-size:11px;letter-spacing:.02em;color:var(--ink-soft);font-style:italic;line-height:1.5}

  .cv2-text{padding:0}
  .what-eyebrow{font-size:11px;letter-spacing:.22em;color:var(--cyan);margin-bottom:14px;font-weight:500}
  .cv2-h{font-size:34px;line-height:1.06;letter-spacing:-.018em;font-weight:380;margin-bottom:18px;max-width:none}
  .cv2-h em{font-style:italic}
  .cv2-deck{font-size:16px;line-height:1.6;color:var(--ink);margin-bottom:30px;max-width:none}

  .cv2-values{border-top:1px solid var(--hair);padding:0;margin:0}
  .cv2-values li{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid var(--hair);align-items:start}
  .cv2-values .cv2-num{font-size:34px;font-style:italic;font-weight:380;color:var(--cyan);letter-spacing:-.01em;line-height:1;padding-top:0}
  .cv2-values h3{font-size:19px;font-weight:420;letter-spacing:-.005em;margin-bottom:6px;line-height:1.2}
  .cv2-values p{font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0}
}

/* SECTION · Standard 2026 — F03 Frieze (final) */
.dim{padding:0;background:var(--bg);border-top:1px solid var(--hair)}
.dim-f-intro{padding:120px 0 64px}
.dim-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:18px;font-weight:500}
.dim-h{font-size:clamp(36px,4.8vw,56px);font-weight:380;letter-spacing:-.014em;line-height:1.08;max-width:18ch}
.dim-h em{font-style:italic}
.frieze{display:flex;gap:24px;padding:0 64px 64px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:64px}
.frieze::-webkit-scrollbar{height:6px}
.frieze::-webkit-scrollbar-thumb{background:var(--hair);border-radius:3px}
.frieze-tile{flex:0 0 360px;scroll-snap-align:start;display:flex;flex-direction:column;gap:18px}
.frieze-img img{width:100%;aspect-ratio:3/4;object-fit:cover}
.frieze-body{padding:0 4px}
.frieze-n{font-size:13px;letter-spacing:.14em;color:var(--cyan);font-weight:500;font-feature-settings:"tnum";display:block;margin-bottom:8px}
.frieze-body h3{font-size:24px;font-weight:420;letter-spacing:-.005em;font-style:italic;margin-bottom:8px}
.frieze-body p{font-size:14px;color:var(--ink-soft);line-height:1.5}
.dim-cta{margin:64px 0 120px;font-size:14px}
.dim-cta a{color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:2px}
@media (max-width:900px){.dim-f-intro{padding:64px 0 32px}.frieze{padding:0 24px 32px}.frieze-tile{flex:0 0 280px}}

/* SECTION · Aufnahme-Prozess · P03 Flow-Cards mit Foto-Wasserzeichen */
.proz{padding:140px 0;background:var(--bg);border-top:1px solid var(--hair)}
.proz-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:18px;font-weight:500}
.proz-h{font-size:clamp(36px,4.8vw,56px);font-weight:380;letter-spacing:-.014em;line-height:1.08;margin-bottom:24px;max-width:20ch}
.proz-h em{font-style:italic}
.proz-deck{font-size:17px;color:var(--ink-soft);line-height:1.6;max-width:60ch;margin-bottom:72px}
.flow-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:32px;position:relative}
.flow-list::before{content:"";position:absolute;left:0;right:0;top:24px;height:1px;background:var(--cyan);opacity:.3;z-index:0}

/* Card-Container — wird zur Bühne für das Wasserzeichen */
.flow-card{position:relative;isolation:isolate;overflow:hidden;background:var(--bg);min-height:340px;padding:0;cursor:default;transition:transform .4s var(--ease-ui), box-shadow .4s var(--ease-ui)}
.flow-card:hover{transform:translateY(-4px);box-shadow:0 12px 36px -10px rgba(10,10,10,.18)}

/* Wasserzeichen-Layer: default sehr blass, monochrom; Hover voll farbig */
.flow-watermark{position:absolute;inset:0;z-index:0;opacity:.05;filter:grayscale(1) contrast(1.15) brightness(1.05);transition:opacity .55s var(--ease-reveal),filter .55s var(--ease-reveal);pointer-events:none}
.flow-watermark picture,.flow-watermark img{width:100%;height:100%;object-fit:cover;display:block}
.flow-card:hover .flow-watermark{opacity:1;filter:grayscale(0) contrast(1) brightness(1)}

/* Content-Layer: bei Hover bekommt Backdrop-Blur für Text-Lesbarkeit */
.flow-content{position:relative;z-index:1;padding:24px;display:flex;flex-direction:column;gap:10px;height:100%;transition:background .45s var(--ease-ui), padding-top .55s var(--ease-reveal)}
.flow-card:hover .flow-content{background:linear-gradient(180deg,rgba(250,250,247,0) 0%,rgba(250,250,247,0) 42%,rgba(250,250,247,.92) 70%,rgba(250,250,247,1) 100%);padding-top:220px;backdrop-filter:none;-webkit-backdrop-filter:none}

.flow-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px}
.flow-num{font-size:14px;letter-spacing:.14em;color:var(--cyan);font-weight:500;font-feature-settings:"tnum"}
.flow-dot{width:14px;height:14px;border-radius:50%;background:var(--bg);border:2px solid var(--cyan);transition:background .28s var(--ease-ui),box-shadow .28s var(--ease-ui)}
.flow-card:hover .flow-dot,.flow-final .flow-dot{background:var(--cyan);box-shadow:0 0 0 4px rgba(14,124,140,.18)}
.flow-card h3{font-size:22px;font-weight:420;letter-spacing:-.005em;font-style:italic;line-height:1.2;color:var(--ink)}
.flow-meta{font-size:12px;color:var(--cyan);letter-spacing:.06em;font-weight:500}
.flow-text{font-size:14px;color:var(--ink-soft);line-height:1.55;margin-top:auto}
.flow-card:hover .flow-text,.flow-card:hover .flow-meta{color:var(--ink)}

/* Touch-Device-Fallback (kein Hover-Effekt verfügbar) */
@media (hover:none){.flow-watermark{opacity:.14;filter:grayscale(.6)}.flow-content{background:rgba(255,255,255,.78)}}

@media (max-width:900px){
  .proz{padding:80px 0}
  .flow-list{grid-template-columns:1fr;gap:24px}
  .flow-list::before{display:none}
  .flow-card{min-height:280px}
}
@media (prefers-reduced-motion:reduce){
  .flow-watermark,.flow-content,.flow-card{transition:none !important}
}

/* CTA zur vollständigen Verzeichnis-Seite (unter figureheads) */
.fig-cta-bar{margin-top:64px;text-align:center;font-size:15px;letter-spacing:.02em}
.fig-cta-bar a{color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:3px;transition:color .25s var(--ease-ui)}
.fig-cta-bar a:hover{color:var(--cyan)}
@media (max-width:900px){.fig-cta-bar{margin-top:40px;font-size:14px}}

/* ===========================================================
   SECTION · Verzeichnis · Mix (Mosaik V03 + Filter-Chips V01 + Smart-Search)
   =========================================================== */
.verz{padding:140px 0;background:var(--bg);border-top:1px solid var(--hair)}
.verz-head{max-width:760px;margin-bottom:56px}
.verz-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:18px;font-weight:500}
.verz-h{font-size:clamp(36px,4.8vw,56px);font-weight:380;letter-spacing:-.014em;line-height:1.08;margin-bottom:20px}
.verz-h em{font-style:italic}
.verz-intro{font-size:17px;color:var(--ink-soft);line-height:1.6;max-width:60ch}

/* ---- Smart-Search (Combobox APG 1.2) ---- */
.verz-search-wrap{position:relative;max-width:560px;margin-bottom:48px}
.verz-search-label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;font-weight:500}
.verz-search-shell{position:relative;display:flex;align-items:center;border:1px solid var(--hair);background:#FFFFFF;transition:border-color .25s var(--ease-ui),box-shadow .25s var(--ease-ui)}
.verz-search-shell:focus-within{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(14,124,140,.10)}
.verz-search-icon{display:flex;align-items:center;justify-content:center;padding:0 14px 0 18px;color:var(--ink-soft)}
.verz-search-shell:focus-within .verz-search-icon{color:var(--cyan)}
#verz-search-input{flex:1;border:0;outline:0;background:transparent;padding:16px 18px 16px 0;font-family:inherit;font-size:18px;color:var(--ink);letter-spacing:-.005em;line-height:1.3}
#verz-search-input::placeholder{color:rgba(21,25,30,.40);font-style:italic}
#verz-search-input::-webkit-search-cancel-button{appearance:none}

.verz-search-results{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#FFFFFF;border:1px solid var(--hair);box-shadow:0 18px 48px -16px rgba(10,10,10,.18);max-height:520px;overflow-y:auto;z-index:50;animation:verzSlideDown .18s ease-out}
@keyframes verzSlideDown{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.verz-sec{padding:14px 20px 8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(21,25,30,.45);font-weight:500;border-top:1px solid var(--hair)}
.verz-sec:first-child{border-top:0}

.verz-row{display:flex;align-items:center;gap:14px;padding:10px 20px;cursor:pointer;border-left:2px solid transparent;transition:background .14s var(--ease-ui),border-color .14s var(--ease-ui)}
.verz-row.is-active{background:rgba(14,124,140,.06);border-left-color:var(--cyan)}
.verz-row:hover{background:rgba(14,124,140,.04)}

.verz-row--mitglied{min-height:64px}
.verz-tile{flex:0 0 40px;height:40px;display:flex;align-items:center;justify-content:center;background:#F5F5F5;color:var(--cyan);font-size:14px;font-weight:500;letter-spacing:.04em;font-feature-settings:"tnum"}
.verz-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.verz-name{font-family:inherit;font-size:16px;font-weight:400;color:var(--ink);letter-spacing:-.005em;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.verz-name b{font-weight:600;font-style:normal}
.verz-sub{font-size:13px;color:rgba(21,25,30,.60);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.verz-badge{flex:0 0 auto;padding:4px 10px;border:1px solid var(--hair);font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:var(--ink-soft);font-weight:500}

.verz-row--facet{min-height:40px;justify-content:space-between}
.verz-row--facet .verz-name{font-size:15px}
.verz-count{font-size:12px;color:rgba(21,25,30,.50);font-feature-settings:"tnum";padding:2px 8px;background:#F5F5F5;border-radius:2px}

.verz-empty{padding:24px 20px;font-size:14px;color:var(--ink-soft);line-height:1.55;border-top:1px solid var(--hair)}
.verz-empty a{color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:2px}

.verz-foot{padding:10px 20px;font-size:11px;color:rgba(21,25,30,.40);letter-spacing:.04em;border-top:1px solid var(--hair);background:#FAFAFA}

/* ---- Filter-Chips ---- */
.filters-row{display:flex;flex-direction:column;gap:16px;margin-bottom:56px;padding:24px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.filters-row > div{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filter-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;margin-right:8px;min-width:80px}
.chip{display:inline-block;padding:6px 14px;border:1px solid var(--hair);font-size:13px;letter-spacing:.01em;color:var(--ink-soft);cursor:pointer;transition:border-color .2s var(--ease-ui),color .2s var(--ease-ui),background .2s var(--ease-ui);user-select:none}
.chip:hover{border-color:var(--cyan);color:var(--ink)}
.chip.active{background:var(--cyan);border-color:var(--cyan);color:#FFFFFF}

/* ---- Mosaik-Grid (Pionier 2x2 · Pro 2x1 · Basic 1x1) ---- */
.mosaik{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:24px;margin-bottom:40px}
.mos-card{position:relative;display:flex;flex-direction:column;background:#FFFFFF;border:1px solid var(--hair);overflow:hidden;transition:transform .35s var(--ease-ui),box-shadow .35s var(--ease-ui),border-color .35s var(--ease-ui);text-decoration:none;color:inherit}
.mos-card:hover{transform:translateY(-3px);box-shadow:0 14px 36px -14px rgba(10,10,10,.16);border-color:rgba(21,25,30,.18)}

.mos-pionier{grid-column:span 2;grid-row:span 2}
.mos-pro{grid-column:span 2;grid-row:span 1}
.mos-basic{grid-column:span 1;grid-row:span 1}
.mos-cta{grid-column:span 1;grid-row:span 1}

.mos-photo{position:relative;width:100%;overflow:hidden;background:#F0F0F0;flex:1 1 auto;min-height:0}
.mos-photo picture,.mos-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease-reveal)}
.mos-card:hover .mos-photo img{transform:scale(1.04)}

.mos-pionier .mos-photo{height:55%}
.mos-pro .mos-photo{height:60%}

.mos-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:0 0 auto}
.mos-pionier .mos-body{padding:24px 28px 28px;gap:8px}

.mos-meta{display:flex;align-items:baseline;gap:12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-feature-settings:"tnum"}
.mos-num{color:var(--cyan);font-weight:500}
.mos-stufe{font-weight:400}

.mos-name{font-size:20px;font-weight:420;letter-spacing:-.008em;line-height:1.15;color:var(--ink)}
.mos-name em{font-style:italic}
.mos-pionier .mos-name{font-size:30px;line-height:1.08}
.mos-pro .mos-name{font-size:24px}

.mos-cat{font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0}
.mos-desc{font-size:14px;color:var(--ink);line-height:1.55;margin:4px 0 0}
.mos-link{font-size:12px;margin:6px 0 0}
.mos-link a{color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:1px;transition:color .2s var(--ease-ui)}
.mos-link a:hover{color:var(--cyan)}

/* Placeholder-Variante (Bald hier) */
.mos-placeholder{background:#FAFAFA;border-style:dashed}
.mos-placeholder .mos-body{padding-top:32px;padding-bottom:32px;height:100%;justify-content:center}

/* CTA-Variante (Ihr Unternehmen) */
.mos-cta{background:#FFFFFF;border:1px dashed var(--cyan);justify-content:center;text-align:left}
.mos-cta:hover{background:rgba(14,124,140,.04)}
.mos-cta .mos-body{padding:28px;height:100%;justify-content:center;gap:10px}
.mos-cta .mos-num{font-size:24px;font-weight:300;line-height:1}
.mos-cta-text{font-size:13px;color:var(--cyan);font-weight:500;letter-spacing:.02em;margin-top:8px;line-height:1.4}

/* Filter-States */
.mos-card.is-hidden{display:none}

/* Search-Highlight Ring */
.mos-card.is-highlight{box-shadow:0 0 0 2px var(--cyan),0 14px 36px -14px rgba(14,124,140,.35);transition:box-shadow .25s var(--ease-ui)}

/* Empty-State (no filter result) */
.verz-empty-state{margin-top:40px;padding:32px;background:#FAFAFA;text-align:center;font-size:15px;color:var(--ink-soft);line-height:1.6}
.verz-empty-state a{color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:2px}

@media (max-width:1100px){
  .mosaik{grid-template-columns:repeat(3,1fr);grid-auto-rows:220px}
  .mos-pionier{grid-column:span 2;grid-row:span 2}
  .mos-pro{grid-column:span 2}
}
@media (max-width:760px){
  .verz{padding:80px 0}
  .verz-head{margin-bottom:32px}
  .verz-search-wrap{margin-bottom:32px}
  .filters-row{gap:12px;padding:18px 0;margin-bottom:32px}
  .filters-row > div{gap:6px}
  .filter-label{min-width:auto;width:100%;margin-bottom:4px}
  .chip{padding:5px 11px;font-size:12px}
  .mosaik{grid-template-columns:1fr;grid-auto-rows:auto;gap:18px}
  .mos-pionier,.mos-pro,.mos-basic,.mos-cta{grid-column:span 1;grid-row:span 1}
  .mos-photo{height:220px !important;flex:0 0 220px}
  .mos-pionier .mos-name{font-size:24px}
  .verz-search-results{max-height:380px}
  #verz-search-input{font-size:16px;padding:14px 14px 14px 0}
}
@media (prefers-reduced-motion:reduce){
  .verz-search-results{animation:none}
  .mos-card,.mos-photo img{transition:none !important}
}

/* Kompassrose-Watermark für Placeholder + CTA-Cards (verzeichnis-mosaik) */
.mos-placeholder,.mos-cta{
  position:relative;
  background:linear-gradient(135deg, #EFF8F9 0%, #E2EFF1 40%, #F4FAFB 100%);
  border-style:solid;
  border-color:rgba(14,124,140,.15);
  overflow:hidden;
  isolation:isolate;
}
.mos-placeholder::before,.mos-cta::before{content:"";position:absolute;inset:-2%;background-image:url("/brand/ki-siegel/svg/kompassrose-stempel-cyan.svg");background-size:88% auto;background-position:center;background-repeat:no-repeat;opacity:.14;mix-blend-mode:multiply;pointer-events:none;z-index:0;transform:rotate(-4deg);transition:opacity .55s var(--ease-reveal),transform .9s var(--ease-reveal);filter:saturate(1)}
.mos-placeholder:hover::before,.mos-cta:hover::before{opacity:.22;transform:rotate(0deg) scale(1.03)}
.mos-placeholder > *,.mos-cta > *{
  position:relative;
  z-index:1;
}
.mos-placeholder .mos-body,.mos-cta .mos-body{
  background:transparent;
}
.mos-cta{
  background:linear-gradient(135deg, #F4FAFB 0%, #EFF8F9 50%, #FFFFFF 100%);
  border:1px dashed var(--cyan);
}
.mos-cta:hover{background:linear-gradient(135deg, #EFF8F9 0%, #E2EFF1 50%, #FAFBFC 100%)}

/* SECTION · Wer dahinter (W04 Doppelseite + Pull-Quote) */
.wer{padding:140px 0;background:var(--bg);border-top:1px solid var(--hair)}
.wer-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:24px;font-weight:500}
.wq-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.wq-quote{font-size:clamp(38px,5.2vw,64px);font-weight:380;letter-spacing:-.022em;line-height:1.02;margin:0 0 40px;font-style:normal;color:var(--ink)}
.wq-quote em{font-style:italic;color:var(--cyan)}
.wq-bio{font-size:16px;color:var(--ink);line-height:1.65;margin-bottom:18px;max-width:48ch}
.wq-sig{margin-top:24px;padding-top:18px;border-top:1px solid var(--hair);font-size:14px;color:var(--ink-soft)}
.wq-sig span{display:block;font-size:12px;margin-top:4px;line-height:1.5}
.wq-photo img{width:100%;aspect-ratio:3/4;object-fit:cover;background:#eee}
@media (max-width:900px){.wer{padding:80px 0}.wq-grid{grid-template-columns:1fr;gap:32px}.wq-photo{order:-1}}

/* SECTION · Funnel-Strip „Der Weg zum Siegel" — vor Pricing */
.funnel{padding:120px 0 60px;background:var(--paper);border-top:1px solid var(--hair)}
.funnel-eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:18px;font-weight:500}
.funnel-h{font-size:clamp(32px,4vw,48px);font-weight:380;letter-spacing:-.014em;line-height:1.1;margin-bottom:48px;max-width:18ch}
.funnel-h em{font-style:italic}
.funnel-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--hair)}
.funnel-steps li{display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:start;padding:24px 18px 24px 0;border-right:1px solid var(--hair);position:relative}
.funnel-steps li:last-child{border-right:0}
.fs-n{font-size:12px;letter-spacing:.14em;color:var(--cyan);font-weight:500;font-feature-settings:"tnum";padding-top:3px}
.funnel-steps h3{font-size:17px;font-weight:420;letter-spacing:-.005em;font-style:italic;margin-bottom:4px}
.funnel-steps p{font-size:13px;color:var(--ink-soft);line-height:1.45}
.fs-final{background:rgba(14,124,140,.04)}
.fs-final .fs-n{color:var(--cyan)}
@media (max-width:900px){.funnel{padding:64px 0 32px}.funnel-steps{grid-template-columns:1fr;border-top:0}.funnel-steps li{border-right:0;border-bottom:1px solid var(--hair);padding:18px 0}.funnel-steps li:last-child{border-bottom:0}}

/* Pricing-Updates für 3-Tier-Grid (statt 4) + Punkte-Score-Anzeige + Siegel-Only-Box */
.tier-grid-3{grid-template-columns:repeat(3,1fr) !important}
.tier-score{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-top:8px;margin-bottom:14px;font-weight:500;font-feature-settings:"tnum"}
.tier-aux{margin-top:48px;padding-top:32px;border-top:1px solid var(--hair)}
.tier-aux-card{max-width:680px;margin:0 auto;text-align:center;padding:24px}
.tier-aux-card h4{font-size:18px;font-weight:420;font-style:italic;letter-spacing:-.005em;margin-bottom:12px;color:var(--ink)}
.tier-aux-card p{font-size:14px;color:var(--ink-soft);line-height:1.6;margin-bottom:16px}
.tier-aux-card a{font-size:13px;color:var(--ink);border-bottom:1px solid var(--cyan);padding-bottom:1px;transition:color .2s var(--ease-ui)}
.tier-aux-card a:hover{color:var(--cyan)}
@media (max-width:900px){.tier-grid-3{grid-template-columns:1fr !important}}

/* MOBILE-HERO · MH05 Vertical Scroll-Snap (Jans Wahl 02.06.2026) */
@media (max-width:900px){
  html{scroll-snap-type:y proximity}
  .hero{height:auto !important;min-height:0;padding-top:0;display:flex;flex-direction:column;background:var(--bg)}
  .hero-photo{position:relative !important;height:100vh;min-height:560px;clip-path:none !important;animation:none;scroll-snap-align:start;scroll-snap-stop:always}
  .hero-photo img{animation:ken-burns 22s ease-out infinite alternate}
  .hero-photo::after{background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.05) 60%,rgba(0,0,0,.4) 100%)}
  .hero-photo::before{content:"↓ scroll";position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.85);font-size:11px;letter-spacing:.16em;text-transform:uppercase;z-index:2;animation:bounceup 1.8s ease-in-out infinite}
  @keyframes bounceup{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}
  .hero-inner{position:relative !important;color:var(--ink) !important;padding:56px 24px;background:var(--bg);max-width:none;margin:0;min-height:80vh;display:flex;flex-direction:column;justify-content:center;scroll-snap-align:start}
  .hero-caption{color:var(--ink-soft) !important;margin-bottom:18px}
  .hero-caption::before{background:var(--cyan) !important}
  .hero-h{color:var(--ink) !important;font-size:clamp(36px,9vw,56px);line-height:1.04;letter-spacing:-.02em}
  .hero-sub{color:var(--ink-soft) !important;font-size:17px;margin-top:20px;line-height:1.55}
  .kompass-stage{display:none}
}

/* MOBILE-HAMBURGER · MN01 Full-Screen Overlay (Jans Wahl 02.06.2026) */
@media (min-width:901px){
  .ham,.ham-menu{display:none !important}
}
@media (max-width:900px){
  /* Liquid-Glass-Header iOS 26 */
  .topbar{position:fixed !important;top:0;left:0;right:0;z-index:50;background:rgba(255,255,255,.55) !important;backdrop-filter:blur(28px) saturate(180%) !important;-webkit-backdrop-filter:blur(28px) saturate(180%) !important;border-bottom:1px solid rgba(255,255,255,.18);box-shadow:0 1px 0 rgba(10,10,10,.04)}
  body.scrolled .topbar{background:rgba(255,255,255,.72) !important;backdrop-filter:blur(36px) saturate(200%) !important;-webkit-backdrop-filter:blur(36px) saturate(200%) !important;border-bottom-color:rgba(10,10,10,.08)}
  .topbar .topbar-row{padding:14px 20px !important;color:var(--ink) !important;height:56px}
  .topbar .brand{font-size:14px;color:var(--ink)}
  .topbar .brand strong{font-size:16px}
  .topbar .brand em{display:none}
  .topbar .topnav{display:none !important}

  /* Hamburger-Button */
  .ham{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent;position:relative;z-index:51}
  .ham-icon{display:flex;flex-direction:column;gap:6px;width:22px;align-items:flex-end}
  .ham-icon span{display:block;height:1.5px;background:var(--ink);transition:transform .3s var(--ease-ui),width .3s var(--ease-ui),opacity .2s var(--ease-ui)}
  .ham-icon span:nth-child(1){width:22px}
  .ham-icon span:nth-child(2){width:16px}
  .ham[aria-expanded="true"] .ham-icon span:nth-child(1){transform:rotate(45deg) translate(4px,4px);width:22px}
  .ham[aria-expanded="true"] .ham-icon span:nth-child(2){transform:rotate(-45deg) translate(4px,-4px);width:22px}

  body.ham-open{overflow:hidden;touch-action:none}

  /* MN01 Full-Screen Overlay (Liquid Glass) */
  .ham-menu{position:fixed;z-index:49;color:var(--ink);top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.78);backdrop-filter:blur(40px) saturate(200%);-webkit-backdrop-filter:blur(40px) saturate(200%);padding:80px 32px 48px;display:flex;flex-direction:column;justify-content:center;opacity:0;transition:opacity .35s var(--ease-reveal)}
  .ham-menu[hidden]{display:none}
  .ham-menu.open{opacity:1}
  .ham-close{position:absolute;top:14px;right:20px;width:40px;height:40px;background:transparent;border:none;color:var(--ink);font-size:30px;line-height:1;font-weight:300;cursor:pointer;padding:0;font-family:inherit;-webkit-tap-highlight-color:transparent}
  .ham-nav{display:flex;flex-direction:column;gap:0}
  .ham-nav a{display:block;padding:16px 0;font-size:32px;font-weight:380;letter-spacing:-.01em;color:var(--ink);border-bottom:1px solid rgba(10,10,10,.06);transition:color .2s var(--ease-ui),padding-left .25s var(--ease-ui);font-style:italic}
  .ham-nav a:hover,.ham-nav a:active{color:var(--cyan);padding-left:8px}
  .ham-foot{margin-top:32px;font-size:12px;letter-spacing:.08em;color:var(--ink-soft);text-transform:uppercase}
}