/* exsos Design-System – Info-Lead-LP (/info/) + Exklusiv-Bereich (additiv)
   ════════════════════════════════════════════════════════════════════════
   Wird zusätzlich zu exsos.css und exsos-event.css geladen (letzteres liefert
   die generischen Formular-Bausteine: .form-group, .form-checkbox,
   .info-toggle/.info-tooltip). Hier stehen nur die seiten-spezifischen Teile.
   ════════════════════════════════════════════════════════════════════════ */

/* ───────── Split-Hero (Value Prop links, Formular rechts) ───────── */
.info-hero{position:relative;background:var(--forest);overflow:hidden;
  padding:clamp(2.6rem,5vw,4.6rem) 0 clamp(2.8rem,5vw,4.8rem)}
.info-hero__bg{position:absolute;inset:0}
.info-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.info-hero__overlay{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(0,48,47,.9) 0%,rgba(0,48,47,.72) 45%,rgba(0,48,47,.55) 100%)}
.info-hero .container{position:relative;z-index:2}
.info-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(1.8rem,4vw,3.4rem);align-items:center}
.info-hero__content{color:var(--sand)}
.info-hero__eyebrow{font-size:.95rem;font-weight:700;
  color:#8fe0c6;margin:0 0 1rem;display:inline-flex;align-items:center;gap:.6rem}
.info-hero__title{color:#f6efe2;font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.1}
.info-hero__checks{list-style:none;margin:1.4rem 0 1.5rem;padding:0;
  display:flex;flex-direction:column;gap:.75rem}
.info-hero__checks li{display:flex;align-items:flex-start;gap:.7rem;
  color:#eef5f0;font-size:1.02rem;line-height:1.45}
.info-hero__checks svg{flex:none;margin-top:.15rem;color:#7fdcc0}
.info-hero__checks strong{color:#fff}

/* exsos-Kennzahlen kompakt im Hero (Quelle: facts.exsos.stats) */
.info-hero__trust{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;
  border-top:1px solid rgba(255,255,255,.22);padding-top:1.1rem;margin:0 0 .8rem}
.info-hero__trust-item{font-size:.92rem;color:#cfe0d8;font-variant-numeric:tabular-nums}
.info-hero__trust-item strong{color:#7fdcc0;font-weight:700}
.info-hero__credibility{font-family:var(--serif);font-style:italic;
  color:#c9ddd5;font-size:.95rem;margin:0 0 1.4rem}

.info-hero__partners{border-top:1px solid rgba(255,255,255,.2);padding-top:1.2rem}
.info-hero__partners>span{display:block;font-size:.8rem;font-weight:600;color:rgba(255,255,255,.55);margin-bottom:.75rem}
.info-hero__partner-logos{display:flex;align-items:center;gap:clamp(1.1rem,2.6vw,1.9rem);flex-wrap:wrap}
.info-hero__partner-logos img{height:26px;width:auto;object-fit:contain;opacity:.92}

/* ───────── Formular-Box ───────── */
.info-form-box{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);
  padding:clamp(1.4rem,2.6vw,2rem);max-width:520px;width:100%;justify-self:end}
.info-form-box__title{font-size:1.35rem;color:var(--forest);margin:0 0 .25rem}
.info-form-box__subtitle{color:var(--muted);font-size:.92rem;margin:0 0 1.1rem}
.info-form-box__hint{font-size:.78rem;color:var(--muted);text-align:center;margin:1rem 0 0}

/* Bonus-Checkbox (Renditeeinschätzung → Telefon-Capture) */
.info-bonus{border:1.5px dashed var(--green);border-radius:10px;
  background:color-mix(in srgb,var(--green) 6%,#fff);padding:.9rem 1rem;margin:0 0 1rem}
.info-bonus__toggle{display:flex;align-items:flex-start;gap:.65rem;cursor:pointer}
.info-bonus__toggle input{position:absolute;opacity:0;pointer-events:none}
.info-bonus__check{flex:none;width:20px;height:20px;border-radius:6px;margin-top:.1rem;
  border:1.5px solid var(--green);background:#fff;display:grid;place-items:center;
  transition:background .15s ease}
.info-bonus__check::after{content:"";width:11px;height:6px;border-left:2.5px solid #fff;
  border-bottom:2.5px solid #fff;transform:rotate(-45deg) translateY(-1px);opacity:0}
.info-bonus__toggle input:checked~.info-bonus__check{background:var(--green)}
.info-bonus__toggle input:checked~.info-bonus__check::after{opacity:1}
.info-bonus__label{display:flex;flex-direction:column;gap:.15rem;line-height:1.35}
.info-bonus__label strong{font-size:.95rem;color:var(--forest)}
.info-bonus__label small{font-size:.8rem;color:var(--muted)}
.info-bonus__phone{margin-top:.85rem}

/* Erfolgs-Box nach Submit */
.form-success{text-align:center;padding:1.5rem 0 .5rem}
.form-success__icon{font-size:2.6rem;line-height:1;color:var(--green)}
.form-success__title{font-size:1.3rem;color:var(--forest);margin:.6rem 0 .3rem}
.form-success__text{color:var(--muted);margin:0}

/* ───────── Content-Preview (was man bekommt) ───────── */
.info-preview{background:var(--tan);padding:clamp(2.6rem,5vw,4rem) 0}
.info-preview__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;max-width:940px;margin:0 auto}
.info-preview__card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow);transition:transform .22s ease,box-shadow .22s ease}
.info-preview__card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.info-preview__thumb{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--sand)}
.info-preview__thumb img{width:100%;height:100%;object-fit:cover}
.info-preview__thumb--pdf{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.5rem;color:var(--muted);font-size:.85rem}
.info-preview__thumb--pdf svg{stroke:var(--green)}
.info-preview__play{position:absolute;inset:0;display:grid;place-items:center}
.info-preview__play svg{width:54px;height:54px;padding:14px;box-sizing:border-box;
  background:color-mix(in srgb,var(--forest) 65%,transparent);border-radius:50%;backdrop-filter:blur(3px)}
.info-preview__badge-360{position:absolute;right:.7rem;top:.7rem;background:var(--green);color:#fff;
  font-weight:700;font-size:.8rem;padding:.3rem .65rem;border-radius:999px}
.info-preview__label{padding:.9rem 1.1rem;font-weight:700;color:var(--forest);font-size:.98rem}
.info-preview__cta{text-align:center;margin-top:2rem}

/* ───────── Mobiler Sticky-CTA ───────── */
.info-sticky-mobile{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;
  padding:.7rem clamp(16px,4vw,24px) calc(.7rem + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--sand) 92%,transparent);backdrop-filter:blur(10px);
  border-top:1px solid var(--hair);transition:transform .25s ease}
.info-sticky-mobile.is-hidden{transform:translateY(110%)}
@media (max-width:900px){.info-sticky-mobile{display:block}}

/* ───────── Exklusiv-Bereich ───────── */
.ex-block{max-width:860px;margin:0 auto clamp(2.4rem,5vw,3.6rem)}
.ex-block:last-child{margin-bottom:0}
.ex-block h2{font-size:clamp(1.35rem,2.4vw,1.7rem);color:var(--forest);margin:0 0 .5rem}
.ex-block>p{color:var(--muted);margin:0 0 1.1rem;font-size:.98rem}
.ex-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;
  border-radius:var(--radius);box-shadow:var(--shadow-lg);background:var(--forest)}
.ex-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ex-downloads{display:flex;flex-direction:column;gap:.9rem}
.ex-download{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;
  background:var(--surface);border:1px solid var(--hair);border-radius:var(--radius);
  padding:1.1rem 1.3rem;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}
.ex-download:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.ex-download__icon{color:var(--green)}
.ex-download__text strong{display:block;color:var(--forest);font-size:1.02rem;line-height:1.3}
.ex-download__text span{display:block;color:var(--muted);font-size:.86rem;line-height:1.45;margin-top:.2rem}
.ex-download__badge{font-size:.72rem;font-weight:700;letter-spacing:.08em;color:#fff;
  background:var(--green);padding:.3rem .65rem;border-radius:6px}

/* ───────── Responsive ───────── */
@media (max-width:1020px){
  .info-hero__grid{grid-template-columns:1fr}
  .info-form-box{justify-self:stretch;max-width:640px;margin:0 auto}
}
@media (max-width:760px){
  .info-preview__grid{grid-template-columns:1fr}
  .ex-download{grid-template-columns:auto 1fr}
  .ex-download__badge{display:none}
}