/* ===== 16.10.2026 Wow-Upgrade: Hero-Wand, Kennzahlen-Band, Case-Stage, Reveals ===== */
.f2-hero--wall { align-items:center; min-height:100svh; background:radial-gradient(120% 90% at 85% 10%,#16202b 0%,#0a0a0a 55%); }
.f2-hero__glow { position:absolute; width:60vw; height:60vw; right:-15vw; top:-20vw; background:radial-gradient(closest-side,rgba(0,173,255,.18),transparent); filter:blur(20px); pointer-events:none; }
.f2-hero__grid { display:grid; grid-template-columns:1fr; gap:36px; align-items:center; position:relative; z-index:2; }
@media (min-width:1000px) { .f2-hero__grid { grid-template-columns:6.4fr 5.6fr; gap:48px; } }
#top .smo-f2 .f2-h1--wall { font-size:clamp(34px,6vw,112px); }
.f2-hero--wall .f2-lede { max-width:34em; margin-top:clamp(18px,2vw,30px); color:var(--f-fg); }
.f2-hero--wall .f2-hero__cta { margin-top:clamp(22px,2.4vw,36px); }
.f2-hero--wall .f2-hero__bar { margin-top:clamp(28px,4vw,56px); }
.f2-wall { display:none; }
@media (min-width:1000px) {
	.f2-wall { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; height:min(78vh,760px); }
	.f2-wall__col { display:flex; flex-direction:column; gap:14px; }
	.f2-wall__col--0 { transform:translateY(-6%); animation:f2float 9s ease-in-out infinite; }
	.f2-wall__col--1 { transform:translateY(8%); animation:f2float 11s ease-in-out -3s infinite reverse; }
	.f2-wall__col--2 { transform:translateY(-2%); animation:f2float 10s ease-in-out -6s infinite; }
}
@keyframes f2float { 0%,100% { translate:0 -10px; } 50% { translate:0 12px; } }
.f2-wall__tile { position:relative; flex:1 1 0; min-height:0; display:block; overflow:hidden; background:var(--f-card); border-radius:6px; }
.f2-wall__tile video, .f2-wall__tile img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.f2-wall__label { position:absolute; left:10px; bottom:10px; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; background:rgba(10,10,10,.6); padding:5px 9px; border-radius:999px; backdrop-filter:blur(6px); }

/* Kennzahlen-Band */
.f2-kpiband { border-bottom:1px solid var(--f-line); padding:clamp(36px,5vw,72px) 0 !important; }
.f2-kpiband__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px 20px; }
@media (min-width:900px) { .f2-kpiband__grid { grid-template-columns:repeat(4,1fr); } }
.f2-kb { display:block; border-left:1px solid var(--f-line); padding-left:18px; }
#top .smo-f2 .f2-kb strong { display:block; font-size:clamp(38px,5.4vw,96px); line-height:1; font-weight:700; letter-spacing:-.05em; font-variant-numeric:tabular-nums; color:var(--f-fg); }
#top .smo-f2 .f2-kb span { display:block; margin-top:10px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); }
#top .smo-f2 .f2-kb em { display:block; margin-top:5px; font-style:normal; font-size:13px; color:var(--f-fg); }
#top .smo-f2 .f2-kb:hover em { color:var(--f-accent); }
#top .smo-f2 .f2-kpiband__note { margin-top:22px; font-size:12px; color:var(--f-mute); }

/* Case-Stage (Desktop) */
.f2-stage { display:none; }
.f2-cases--m { display:block; }
@media (min-width:1000px) and (min-height:640px) {
	.f2-stage { display:block; height:calc(var(--n) * 90vh + 20vh); }
	.f2-cases--m { display:none; }
	.f2-stage__sticky { position:sticky; top:0; height:100vh; display:flex; align-items:center; overflow:hidden; border-top:1px solid var(--f-line); }
	.f2-stage__grid { display:grid; grid-template-columns:4fr 4fr 4fr; gap:clamp(24px,3vw,56px); align-items:center; width:100%; }
	.f2-stage__media { position:relative; height:min(78vh,780px); aspect-ratio:9/16; justify-self:center; background:var(--f-card); overflow:hidden; border-radius:8px; }
	.f2-stage__frame { position:absolute; inset:0; opacity:0; transform:scale(1.06); transition:opacity .6s var(--f-ease),transform .9s var(--f-ease); }
	.f2-stage__frame.is-on { opacity:1; transform:none; }
	.f2-stage__frame video, .f2-stage__frame img { width:100%; height:100%; object-fit:cover; display:block; }
	.f2-stage__texts { position:relative; min-height:280px; }
	.f2-stage__text { position:absolute; left:0; right:0; top:50%; transform:translateY(calc(-50% + 24px)); opacity:0; transition:opacity .5s ease,transform .7s var(--f-ease); pointer-events:none; }
	.f2-stage__text.is-on { opacity:1; transform:translateY(-50%); pointer-events:auto; }
}
.f2-stage__count { font-size:clamp(28px,3vw,48px); font-weight:700; letter-spacing:-.04em; margin-top:22px !important; font-variant-numeric:tabular-nums; color:var(--f-mute); }
#top .smo-f2 .f2-stage__count .f2-stage__cur { color:var(--f-fg); }
#top .smo-f2 .f2-stage__intro { margin-top:18px; color:var(--f-mute); font-size:15px; line-height:1.6; max-width:30em; }
#top .smo-f2 .f2-stage__case { font-size:clamp(24px,2.6vw,44px); line-height:1.05; font-weight:700; letter-spacing:-.04em; margin-bottom:22px; }
#top .smo-f2 .f2-stage__kpis { display:flex; flex-direction:column; gap:12px; margin-bottom:26px; }
#top .smo-f2 .f2-stage__kpis span { font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--f-mute); }
#top .smo-f2 .f2-stage__kpis b { display:block; font-size:clamp(34px,4vw,64px); line-height:1; letter-spacing:-.05em; color:var(--f-fg); text-transform:none; margin-bottom:4px; }

/* Leistungen: zwei Spalten mit Chips */
@media (min-width:900px) { .f2-svc__item { grid-template-columns:90px 1fr 1fr; align-items:start; } }
.f2-svc__side { display:grid; gap:18px; align-content:start; }
.f2-chips { list-style:none; margin:0 !important; padding:0 !important; display:flex; flex-wrap:wrap; gap:8px; }
#top .smo-f2 .f2-chips li { font-size:12px; font-weight:600; letter-spacing:.04em; padding:8px 14px; border:1px solid var(--f-line); border-radius:999px; color:var(--f-fg); transition:background .25s,color .25s,border-color .25s; }
.f2-svc__item:hover .f2-chips li { border-color:rgba(242,242,239,.45); }
.f2-svc__item { transition:padding-left .4s var(--f-ease); }
@media (hover:hover) { .f2-svc__item:hover { padding-left:14px; } }

/* Sticky Mini-CTA */
.f2-sticky { position:fixed; right:clamp(14px,2vw,28px); bottom:clamp(14px,2vw,28px); z-index:50; display:inline-flex; gap:10px; align-items:center; padding:15px 24px; border-radius:999px; background:#f2f2ef; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; box-shadow:0 10px 30px rgba(0,0,0,.4); transform:translateY(160%); transition:transform .4s var(--f-ease); }
#top .smo-f2 .f2-sticky, #top .smo-f2 .f2-sticky i { color:#0a0a0a; }
.f2-sticky.is-in { transform:none; }
.f2-sticky[hidden] { display:none; }

/* Reveals (nur mit JS) */
.f2-js .f2-hero .f2-line { transform:translateY(60%); opacity:0; animation:f2up 1s var(--f-ease) forwards; }
.f2-js .f2-hero .f2-line:nth-child(2) { animation-delay:.1s; } .f2-js .f2-hero .f2-line:nth-child(3) { animation-delay:.2s; }
@keyframes f2up { to { transform:none; opacity:1; } }
.f2-js [data-rv] { opacity:0; transform:translateY(28px); transition:opacity .8s var(--f-ease),transform .9s var(--f-ease); }
.f2-js [data-rv].is-in { opacity:1; transform:none; }
@media (max-width:767px) { .f2-hero--wall { min-height:auto; padding-top:110px !important; } .f2-sticky { left:14px; right:14px; justify-content:center; } }
@media (prefers-reduced-motion: reduce) {
	.f2-wall__col, .f2-js .f2-hero .f2-line { animation:none !important; transform:none !important; opacity:1 !important; }
	.f2-js [data-rv] { opacity:1; transform:none; transition:none; }
	.f2-stage__frame, .f2-stage__text { transition:none; }
}

/* Hero-Korrektur: Spalten, H1-Groesse, Leiste unter dem Raster */
.f2-hero--wall { flex-direction:column; align-items:stretch; justify-content:center; }
.f2-hero--wall > .f2-wrap { width:100%; }
@media (min-width:1000px) { .f2-hero__grid { grid-template-columns:minmax(0,1fr) minmax(0,.9fr); } }
#top .smo-f2 .f2-h1--wall { font-size:clamp(34px,4.2vw,80px); }

/* Mobil: Hero-Wand als Streifen, Sticky-CTA neben Back-to-top */
@media (max-width:999px) {
	.f2-wall { display:flex; gap:10px; overflow:hidden; height:min(52vh,420px); }
	.f2-wall__col { flex:0 0 38%; display:flex; flex-direction:column; gap:10px; }
	.f2-wall__col:nth-child(2) { transform:translateY(8%); }
	.f2-wall__tile:nth-child(2) { display:none; }
}
@media (max-width:767px) { .f2-sticky { right:78px; } }
