/* smo-fancy v2 "Showreel" -- Optik der Startseite V3 (home3.css). 16.10.2026
   Tokens wie dort: #0a0a0a / #f2f2ef / mute .58 / line .16, Versal-Display 700 / -.05em, Labels 12px .14em, Pill-CTA.
   Header/Footer/Menue werden nicht angefasst. */
.smo-f2 { --f-bg:#0a0a0a; --f-fg:#f2f2ef; --f-mute:rgba(242,242,239,.62); --f-line:rgba(242,242,239,.16); --f-card:#141414; --f-accent:#00adff; --f-pad:clamp(20px,4vw,64px); --f-ease:cubic-bezier(.2,.7,.2,1);
	background:var(--f-bg); color:var(--f-fg); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.smo-f2 *, .smo-f2 *::before, .smo-f2 *::after { box-sizing:border-box; }

/* Vollbreite innerhalb des Enfold-Containers, ohne horizontales Scrollen */
body:has(.smo-f2) #wrap_all, body:has(.smo-f2) #main { overflow:clip !important; }
body:has(.smo-f2) { overflow-x:clip !important; }
html:has(.smo-f2) { overflow-x:clip; }
body:has(.smo-f2) .container { max-width:none !important; width:100% !important; padding:0 !important; }
body:has(.smo-f2) .content, body:has(.smo-f2) .template-page { width:100% !important; float:none !important; padding:0 !important; margin:0 !important; border:0 !important; }
body:has(.smo-f2) .entry-content-wrapper { padding:0 !important; }
.smo-f2 section { position:relative; width:100%; margin:0; padding:0; }
.smo-f2 .f2-wrap { max-width:1440px; margin:0 auto; padding-left:var(--f-pad); padding-right:var(--f-pad); }

/* Typografie (Enfold ueberschreibt h1/h2/a mit #top-Selektoren, daher #top) */
#top .smo-f2 h1, #top .smo-f2 h2, #top .smo-f2 h3, #top .smo-f2 p, #top .smo-f2 li, #top .smo-f2 dt, #top .smo-f2 dd { color:var(--f-fg); font-family:inherit; margin:0; }
#top .smo-f2 a { color:inherit; text-decoration:none; }
.f2-label { font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute) !important; display:flex; flex-wrap:wrap; gap:6px 28px; }
.f2-label--mute { margin-bottom:18px !important; }
#top .smo-f2 .f2-h1 { font-size:clamp(34px,7.2vw,132px); line-height:.94; font-weight:700; letter-spacing:-.05em; text-transform:uppercase; margin-top:clamp(18px,2.6vw,40px); }
.f2-line { display:block; }
#top .smo-f2 .f2-h2 { font-size:clamp(34px,5.6vw,92px); line-height:.94; font-weight:700; letter-spacing:-.045em; text-transform:uppercase; }
#top .smo-f2 .f2-h2--sm { font-size:clamp(30px,4vw,64px); }
#top .smo-f2 .f2-h2--xl { font-size:clamp(40px,8.4vw,148px); line-height:.92; }
.f2-head { display:grid; grid-template-columns:1fr; gap:20px; margin-bottom:clamp(36px,5vw,80px); }
@media (min-width:990px) { .f2-head { grid-template-columns:7fr 5fr; align-items:end; gap:48px; } }
.f2-head__text { color:var(--f-mute) !important; font-size:clamp(16px,1.25vw,19px); line-height:1.6; max-width:56ch; }
.f2-link { display:inline-block; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; border-bottom:1px solid currentColor; padding-bottom:6px; transition:color .24s ease; }
#top .smo-f2 .f2-link:hover { color:var(--f-accent); }

/* CTA */
.f2-cta { display:inline-flex; align-items:center; gap:12px; padding:20px 34px; border:1px solid rgba(242,242,239,.7); border-radius:999px; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; transition:background .24s ease,color .24s ease,transform .3s var(--f-ease); }
.f2-cta i { font-style:normal; }
#top .smo-f2 .f2-cta:hover { background:#f2f2ef; color:#0a0a0a; transform:translateY(-2px); }
#top .smo-f2 .f2-cta--ghost { border-color:var(--f-line); color:var(--f-mute); }
.smo-f2 :focus-visible { outline:2px solid var(--f-accent); outline-offset:3px; }

/* Hero */
.f2-hero { min-height:100svh; display:flex; align-items:flex-end; padding:clamp(110px,14vh,170px) 0 clamp(32px,4vw,64px) !important; overflow:hidden; }
.f2-hero__video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.f2-hero__scrim { position:absolute; inset:0; background:linear-gradient(to top,rgba(10,10,10,.9) 0%,rgba(10,10,10,.3) 50%,rgba(10,10,10,.55) 100%); }
.f2-hero__inner { position:relative; z-index:2; }
.f2-crumb { display:flex; gap:10px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); margin-bottom:22px; }
#top .smo-f2 .f2-crumb a:hover { color:var(--f-fg); }
.f2-hero__foot { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap; margin-top:clamp(28px,4vw,60px); }
.f2-hero__copy { max-width:620px; }
#top .smo-f2 .f2-lede { font-size:clamp(17px,1.5vw,22px); line-height:1.5; font-weight:500; }
.f2-micro { margin-top:18px !important; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute) !important; }
.f2-hero__cta { display:flex; gap:12px; flex-wrap:wrap; }
.f2-hero__bar { display:flex; justify-content:space-between; gap:16px 32px; flex-wrap:wrap; margin-top:clamp(36px,5vw,80px); padding-top:20px; border-top:1px solid rgba(242,242,239,.2); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); }
.f2-hero__case b { opacity:.6; margin-right:10px; font-weight:700; }
#top .smo-f2 .f2-hero__case:hover, #top .smo-f2 .f2-hero__scroll:hover { color:var(--f-fg); }

/* Trust */
.f2-trust { border-bottom:1px solid var(--f-line); padding:clamp(24px,3vw,44px) 0 !important; overflow:hidden; }
.f2-trust .f2-label { margin-bottom:14px; }
.f2-trust__logos img { max-height:40px; width:auto; }

/* Facts (Antworten above the fold) */
.f2-facts { border-bottom:1px solid var(--f-line); padding:clamp(40px,5vw,80px) 0 !important; }
.f2-facts__grid { display:grid; grid-template-columns:1fr; gap:28px 40px; margin:0; }
@media (min-width:700px) { .f2-facts__grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1100px) { .f2-facts__grid { grid-template-columns:repeat(5,1fr); } }
.f2-fact dt { font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-accent) !important; margin-bottom:10px; }
.f2-fact dd { font-size:15px; line-height:1.55; color:var(--f-fg); }
#top .smo-f2 .f2-fact dd a { border-bottom:1px solid currentColor; }

/* Cases / Galerie 9:16 */
.f2-cases { padding:clamp(72px,10vw,160px) 0 clamp(56px,7vw,110px) !important; }
.f2-gallery { display:flex; gap:clamp(12px,1.4vw,24px); overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:0 var(--f-pad); scroll-padding:0 var(--f-pad); -webkit-overflow-scrolling:touch; }
.f2-gallery::-webkit-scrollbar { display:none; }
.f2-case { flex:0 0 clamp(220px,22vw,340px); scroll-snap-align:start; display:block; }
.f2-case__media { display:block; position:relative; aspect-ratio:9/16; background:var(--f-card); overflow:hidden; }
.f2-case__media video, .f2-case__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--f-ease); }
.f2-case:hover .f2-case__media video, .f2-case:hover .f2-case__media img { transform:scale(1.04); }
.f2-case__meta { display:block; padding:16px 0 0; }
.f2-case__brand { display:block; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); margin-bottom:6px; }
.f2-case__title { display:block; font-size:17px; line-height:1.3; font-weight:600; letter-spacing:-.01em; }
.f2-case__kpis { display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:10px; font-size:12px; color:var(--f-mute); }
.f2-case__kpis b { color:var(--f-fg); font-weight:700; }
@media (max-width:767px) { .f2-case { flex-basis:74%; } }
.f2-after { display:flex; align-items:center; gap:28px; flex-wrap:wrap; margin-top:clamp(36px,4vw,64px); }

/* Leistungen -- editoriale Liste statt Cards */
.f2-services { border-top:1px solid var(--f-line); padding:clamp(72px,10vw,160px) 0 !important; }
.f2-svc { list-style:none; margin:0 !important; padding:0 !important; border-top:1px solid var(--f-line); }
.f2-svc__item { display:grid; grid-template-columns:1fr; gap:14px; padding:clamp(24px,3vw,44px) 0; border-bottom:1px solid var(--f-line); }
@media (min-width:900px) { .f2-svc__item { grid-template-columns:120px 1fr; gap:40px; } }
.f2-svc__no { font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--f-mute); font-variant-numeric:tabular-nums; padding-top:6px; }
.f2-svc__body { display:grid; gap:12px; max-width:760px; }
#top .smo-f2 .f2-svc__body h3 { font-size:clamp(26px,3vw,48px); line-height:1.02; font-weight:700; letter-spacing:-.035em; }
#top .smo-f2 .f2-svc__body p { font-size:clamp(16px,1.2vw,18px); line-height:1.6; color:var(--f-mute); }
#top .smo-f2 .f2-svc__del { font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--f-fg); }
.f2-svc__body .f2-link { justify-self:start; margin-top:6px; }

/* Ablauf */
.f2-process { border-top:1px solid var(--f-line); padding:clamp(72px,10vw,160px) 0 !important; }
.f2-steps { list-style:none; margin:0 !important; padding:0 !important; display:grid; gap:36px 32px; grid-template-columns:1fr; }
@media (min-width:760px) { .f2-steps { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1200px) { .f2-steps { grid-template-columns:repeat(4,1fr); } }
.f2-step { border-top:1px solid var(--f-fg); padding-top:20px; }
.f2-step__no { display:block; font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--f-mute); margin-bottom:18px; font-variant-numeric:tabular-nums; }
#top .smo-f2 .f2-step h3 { font-size:clamp(22px,2vw,30px); line-height:1.1; font-weight:700; letter-spacing:-.03em; margin-bottom:12px; }
#top .smo-f2 .f2-step p { font-size:15px; line-height:1.6; color:var(--f-mute); }
#top .smo-f2 .f2-step__in { margin-top:14px; color:var(--f-fg); }
.f2-step__in b { font-weight:700; }

/* Ergebnisse */
.f2-results { border-top:1px solid var(--f-line); padding:clamp(72px,10vw,160px) 0 !important; }
.f2-kpis { display:grid; grid-template-columns:repeat(2,1fr); gap:40px 24px; }
@media (min-width:900px) { .f2-kpis { grid-template-columns:repeat(4,1fr); } }
.f2-kpi { display:block; border-top:1px solid var(--f-line); padding-top:20px; }
.f2-kpi strong { display:block; font-size:clamp(40px,5vw,88px); line-height:1; font-weight:700; letter-spacing:-.04em; }
.f2-kpi span { display:block; margin-top:10px; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); }
.f2-kpi em { display:block; margin-top:6px; font-style:normal; font-size:14px; color:var(--f-fg); }
#top .smo-f2 .f2-kpi:hover em { color:var(--f-accent); }

/* Team */
.f2-people { border-top:1px solid var(--f-line); padding:clamp(56px,7vw,110px) 0 !important; }
.f2-people__grid { display:grid; grid-template-columns:1fr; gap:28px; }
@media (min-width:900px) { .f2-people__grid { grid-template-columns:5fr 7fr; gap:48px; } }
.f2-people__name { font-size:clamp(26px,3vw,48px) !important; font-weight:700 !important; letter-spacing:-.035em; line-height:1.05; }
.f2-people__role { color:var(--f-mute) !important; margin-top:8px !important; }
#top .smo-f2 .f2-people__text { font-size:clamp(17px,1.4vw,21px); line-height:1.6; margin-bottom:22px; max-width:60ch; }

/* FAQ */
.f2-faq { border-top:1px solid var(--f-line); padding:clamp(72px,10vw,160px) 0 !important; }
.f2-faq__grid { display:grid; grid-template-columns:1fr; gap:36px; }
@media (min-width:990px) { .f2-faq__grid { grid-template-columns:5fr 7fr; gap:64px; } }
.f2-faq__item { border-bottom:1px solid var(--f-line); padding:22px 0; }
.f2-faq__item:first-child { border-top:1px solid var(--f-line); }
.f2-faq__item summary { cursor:pointer; list-style:none; position:relative; padding-right:40px; font-size:clamp(17px,1.4vw,21px); font-weight:600; letter-spacing:-.01em; }
.f2-faq__item summary::-webkit-details-marker { display:none; }
.f2-faq__item summary::after { content:"+"; position:absolute; right:0; top:-2px; font-size:26px; font-weight:400; color:var(--f-accent); }
.f2-faq__item[open] summary::after { content:"–"; }
#top .smo-f2 .f2-faq__item p { margin-top:14px; font-size:16px; line-height:1.65; color:var(--f-mute); max-width:64ch; }
#top .smo-f2 .f2-faq__item p a { border-bottom:1px solid currentColor; }

/* Abschluss */
.f2-final { border-top:1px solid var(--f-line); padding:clamp(80px,12vw,200px) 0 !important; }
.f2-final .f2-head__text { margin:clamp(20px,2.4vw,36px) 0 clamp(28px,3vw,48px); }

/* Mobile */
@media (max-width:767px) {
	.f2-hero { min-height:92svh; }
	.f2-hero__cta { width:100%; } .f2-hero__cta .f2-cta { flex:1 1 100%; justify-content:center; padding:18px 20px; }
	#top .smo-f2 .f2-h1 { font-size:9.6vw; }
}
@media (prefers-reduced-motion: reduce) { .f2-case__media video, .f2-case__media img { transition:none; } .smo-f2 * { scroll-behavior:auto !important; } }

/* 16.10.2026 Fixes nach Screenshot-Check: Enfold faerbt strong/p mit #top-Selektoren */
#top .smo-f2 .f2-kpi strong { color:var(--f-fg); font-weight:700; }
#top .smo-f2 .f2-kpi span { color:var(--f-mute); }
#top .smo-f2 .f2-kpi em { color:var(--f-fg); }
#top .smo-f2 .f2-final .f2-head__text { margin:clamp(20px,2.4vw,36px) 0 clamp(28px,3vw,48px); color:var(--f-mute); }
#top .smo-f2 .f2-head__text { color:var(--f-mute); }
#top .smo-f2 .f2-case__brand { color:var(--f-mute); }
#top .smo-f2 .f2-case__kpis b { color:var(--f-fg); }
#top .smo-f2 .f2-fact dt { color:var(--f-accent); }
#top .smo-f2 .f2-people__role { color:var(--f-mute); margin-top:8px; }
#top .smo-f2 .f2-label { color:var(--f-mute); }

/* ===== Kontaktseite ===== */
.smo-f2--contact .f2c-intro { padding:clamp(120px,14vh,170px) 0 clamp(56px,7vw,110px) !important; }
.f2c-grid { display:grid; grid-template-columns:1fr; gap:clamp(40px,5vw,80px); align-items:start; }
@media (min-width:1000px) { .f2c-grid { grid-template-columns:6fr 5fr; } }
#top .smo-f2 .f2c-h1 { font-size:clamp(40px,6.2vw,108px); }
#top .smo-f2 .f2c-lede { margin-top:clamp(22px,2.4vw,36px); max-width:34em; color:var(--f-fg); }
.f2c-person { display:flex; align-items:center; gap:18px; margin:clamp(28px,3vw,44px) 0; }
.f2c-person img { width:96px; height:96px; object-fit:cover; border-radius:50%; flex:none; background:var(--f-card); }
#top .smo-f2 .f2c-person__name { font-size:20px; font-weight:700; letter-spacing:-.02em; }
#top .smo-f2 .f2c-person__role { color:var(--f-mute); font-size:14px; margin-top:4px; }
.f2c-ways { list-style:none; margin:0 !important; padding:0 !important; border-top:1px solid var(--f-line); }
.f2c-ways li { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 24px; padding:16px 0; border-bottom:1px solid var(--f-line); }
.f2c-ways span { font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--f-mute); }
#top .smo-f2 .f2c-ways a { font-size:clamp(17px,1.4vw,20px); font-weight:600; border-bottom:1px solid transparent; }
#top .smo-f2 .f2c-ways a:hover { border-bottom-color:currentColor; }
.f2c-card { background:var(--f-card); border:1px solid var(--f-line); padding:clamp(24px,3vw,44px); }
#top .smo-f2 .f2c-card__title { font-size:clamp(24px,2.4vw,34px); font-weight:700; letter-spacing:-.03em; margin-bottom:clamp(18px,2vw,28px); }
.f2c-form { display:grid; grid-template-columns:1fr; gap:18px; }
@media (min-width:560px) { .f2c-form { grid-template-columns:1fr 1fr; } }
.f2c-field--full, .f2c-submit, .f2c-status { grid-column:1 / -1; }
.f2c-field label { display:block; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--f-mute); margin-bottom:8px; }
.f2c-field label b { color:var(--f-accent); }
.f2c-field input, .f2c-field select, .f2c-field textarea { width:100%; background:#0a0a0a; color:var(--f-fg); border:1px solid rgba(242,242,239,.28); border-radius:0; padding:15px 16px; font:inherit; font-size:16px; line-height:1.4; margin:0; box-shadow:none; transition:border-color .2s; }
.f2c-field textarea { min-height:140px; resize:vertical; }
.f2c-field select option { background:#0a0a0a; color:#f2f2ef; }
.f2c-field input:focus, .f2c-field select:focus, .f2c-field textarea:focus { border-color:var(--f-accent); outline:2px solid var(--f-accent); outline-offset:0; }
.f2c-field [aria-invalid="true"] { border-color:#ff6b5e; }
#top .smo-f2 .f2c-err { color:#ff8a7e; font-size:13px; margin-top:6px; }
#top .smo-f2 .f2c-err:empty { display:none; }
#top .smo-f2 .f2c-help { color:var(--f-mute); font-size:13px; margin-top:6px; }
.f2c-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.f2c-btn { cursor:pointer; background:#f2f2ef; color:#0a0a0a !important; border-color:#f2f2ef; width:100%; justify-content:center; }
#top .smo-f2 .f2c-btn:hover { background:transparent; color:#f2f2ef !important; }
.f2c-btn:disabled { opacity:.6; cursor:wait; }
#top .smo-f2 .f2c-privacy { margin-top:14px; font-size:13px; line-height:1.5; color:var(--f-mute); }
#top .smo-f2 .f2c-privacy a { border-bottom:1px solid currentColor; }
#top .smo-f2 .f2c-status { font-size:15px; line-height:1.5; }
#top .smo-f2 .f2c-status:empty { display:none; }
#top .smo-f2 .f2c-status--ok { color:#8be2a5; border-left:3px solid #8be2a5; padding-left:14px; }
#top .smo-f2 .f2c-status--err { color:#ff8a7e; border-left:3px solid #ff8a7e; padding-left:14px; }
.f2c-next { padding:clamp(56px,7vw,110px) 0 !important; }
@media (min-width:1200px) { .f2c-steps { grid-template-columns:repeat(3,1fr) !important; } }
@media (max-width:767px) { .smo-f2--contact .f2c-intro { padding-top:110px !important; } #top .smo-f2 .f2c-h1 { font-size:11vw; } .f2c-person img { width:72px; height:72px; } }

/* Fix: Enfold setzt Eingabefelder hell (#top input...) */
#top .smo-f2 .f2c-field input[type="text"], #top .smo-f2 .f2c-field input[type="email"], #top .smo-f2 .f2c-field input[type="tel"], #top .smo-f2 .f2c-field select, #top .smo-f2 .f2c-field textarea { background:#0a0a0a !important; color:#f2f2ef !important; border:1px solid rgba(242,242,239,.3) !important; border-radius:0 !important; }
#top .smo-f2 .f2c-field input:focus, #top .smo-f2 .f2c-field select:focus, #top .smo-f2 .f2c-field textarea:focus { border-color:#00adff !important; }
#top .smo-f2 .f2c-field [aria-invalid="true"] { border-color:#ff6b5e !important; }
#top .smo-f2 .f2c-card { border-color:rgba(242,242,239,.16); }

/* 16.10.2026: Case-Karte ohne Medium, Bild-Hero */
.f2-case__ph { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:16px; text-align:center; font-size:clamp(20px,2vw,30px); font-weight:700; letter-spacing:-.03em; text-transform:uppercase; color:var(--f-fg); background:linear-gradient(160deg,#171717,#0d0d0d); }
img.f2-hero__video { object-fit:cover; }

/* Kontakt: optionale Angaben */
.f2c-more { grid-column: 1 / -1; border-top: 1px solid var(--f-line); padding-top: 14px; }
.f2c-more summary { cursor: pointer; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--f-mute); list-style: none; }
.f2c-more summary::-webkit-details-marker { display: none; }
.f2c-more summary::after { content: " +"; color: var(--f-accent); }
.f2c-more[open] summary::after { content: " –"; }
.f2c-more__grid { display: grid; gap: 18px; grid-template-columns: 1fr; margin-top: 16px; }
@media (min-width: 560px) { .f2c-more__grid { grid-template-columns: 1fr 1fr; } }