/* * RH Branche - GEMEINSAMES Stylesheet fuer alle 10 Branchen-Landingpages * (inc/rh-branche.php rendert das Markup; Templates liefern nur Config). * * WICHTIG: Datei bewusst KOMPLETT ASCII (keine Umlaute/Sonderzeichen in * Kommentaren!) - ein nicht-UTF-8-sicherer Minifier verschluckt sonst am * Mehrbyte-Zeichen die folgende Regel (CLAUDE.md S3). * * SCOPING: ALLE Selektoren auf .rh-page.rh-branche (nicht nur .rh-page). * Grund: Die alten rh-.css der Branchenseiten nutzten dieselben * Klassennamen mit anderen Werten. Sie werden zu Leer-Stubs ueberschrieben - * aber falls live doch eine Alt-Kopie weiterlaedt, gewinnt diese Datei per * Spezifitaet (0-3-0 vs. 0-2-0). * * QUELLE: konsolidiert aus rh-home.css (Mockups, Splits, Baukasten, Cockpit, * ROI, Marquee, CTA) + den Branchen-CSS (Photo, Band, FAQ). Aufbau wie dort: * Struktur/Typo/Buttons/Karten als Klassen, Mockup-INNEREIEN inline im PHP. */ /* ============================================================ Design Tokens (auf .rh-page gescopt, nicht :root) ============================================================ */ .rh-page.rh-branche{ /* Brand */ --rh-green-deep:#173528; --rh-green-deep-700:#1F4A37; --rh-green-deep-900:#0E2419; --rh-green:#A3F698; --rh-green-300:#C6F9BF; --rh-green-100:#E9FCE5; --rh-green-600:#7CE775; --rh-purple:#0C0533; /* Neutrals */ --rh-white:#FFFFFF; --rh-black:#000000; --rh-paper:#F5F6F4; --rh-paper-200:#ECEEEA; --rh-line:#E2E5E0; --rh-line-dark:#2B4A3B; --rh-grey-500:#8B8E99; --rh-grey-400:#B4B7BD; /* Semantic (--muted = barrierefrei #5F6470, CLAUDE.md S12) */ --ink:var(--rh-purple); --body:#34303F; --muted:#5F6470; --on-dark:#FFFFFF; --on-dark-muted:#B7CABF; --rh-error:#B3261E; /* Handoff-Aliase (fuer die Inline-Mockup-Styles) */ --surface-muted:#F5F6F4; --surface-card:#FFFFFF; --surface-dark:#173528; --text-ink:#0C0533; --text-body:#34303F; --text-muted:#5F6470; --text-on-dark-muted:#B7CABF; /* Type */ --font-display:'Clash Display','General Sans',system-ui,sans-serif; --font-sans:'General Sans',system-ui,-apple-system,Segoe UI,sans-serif; --font-mono:'JetBrains Mono',ui-monospace,Menlo,monospace; --tracking-tight:-0.02em; --tracking-label:0.04em; --tracking-caps:0.12em; /* Radius & shadow */ --r-md:18px; --r-lg:28px; --r-xl:40px; --r-pill:999px; --radius-sm:10px; --radius-md:18px; --radius-lg:28px; --radius-xl:40px; --radius-pill:999px; --shadow-sm:0 1px 2px rgba(12,5,51,.06),0 1px 1px rgba(12,5,51,.04); --shadow-md:0 8px 24px rgba(12,5,51,.08); --shadow-lg:0 24px 60px rgba(12,5,51,.12); --shadow-glow:0 12px 40px rgba(163,246,152,.35); --ring:0 0 0 3px rgba(163,246,152,.55); font-family:var(--font-sans);color:var(--ink);background:var(--rh-white); /* Full-Bleed (No-JS-Fallback; JS misst zusaetzlich die echte Position). */ width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw); /* clip, NICHT hidden -> kein Scroll-Container, sticky bleibt intakt. */ overflow-x:clip;-webkit-font-smoothing:antialiased; } body.rh-fullwidth{overflow-x:clip;} /* ============================================================ Base (gescopt) ============================================================ */ .rh-page.rh-branche, .rh-page.rh-branche *{box-sizing:border-box;} .rh-page.rh-branche ::selection{background:var(--rh-green);color:var(--rh-green-deep);} .rh-page.rh-branche img{max-width:100%;display:block;} .rh-page.rh-branche a{color:inherit;text-decoration:none;} /* ============================================================ Layout ============================================================ */ .rh-page.rh-branche .rh-section{padding:100px 0;position:relative;} .rh-page.rh-branche .rh-section[id]{scroll-margin-top:90px;} .rh-page.rh-branche .rh-section--hero{padding:76px 0 128px;position:relative;overflow:hidden; background:radial-gradient(125% 125% at 62% 88%,#46B768 0%,#207A46 38%,#18482F 64%,#143226 100%); color:var(--on-dark);} .rh-page.rh-branche .rh-section--ind{padding:72px 0 84px;background:var(--rh-white);} /* Steps auf weiss (anders als /home): der Fokus-Split davor ist muted. */ .rh-page.rh-branche .rh-section--howto{padding:100px 0;background:var(--rh-white);} .rh-page.rh-branche .rh-section--cockpit{padding:96px 0 100px;background:var(--rh-green-deep);color:var(--on-dark);overflow:hidden;} .rh-page.rh-branche .rh-section--feature{padding:104px 0;background:var(--rh-white);} .rh-page.rh-branche .rh-section--muted{background:var(--surface-muted);} .rh-page.rh-branche .rh-section--trio{padding:104px 0;background:var(--rh-white);} .rh-page.rh-branche .rh-section--cta{padding:40px 0 108px;background:var(--rh-white);} .rh-page.rh-branche .rh-band-section{padding-top:0;background:var(--rh-white);} .rh-page.rh-branche .rh-container{max-width:1160px;margin:0 auto;padding:0 32px;} .rh-page.rh-branche .rh-container--tight{max-width:820px;} .rh-page.rh-branche .rh-center{text-align:center;} .rh-page.rh-branche .rh-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;} /* ============================================================ Typografie ============================================================ */ .rh-page.rh-branche .rh-eyebrow{display:block;font-family:var(--font-mono);font-weight:600;font-size:11px; letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--rh-green-deep);} .rh-page.rh-branche .rh-eyebrow--green{color:var(--rh-green);} .rh-page.rh-branche .rh-h1{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,4.6vw,64px); line-height:1.02;letter-spacing:-.02em;color:#fff;margin:14px 0 0;} .rh-page.rh-branche .rh-h2{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.8vw,50px); line-height:1.04;letter-spacing:-.02em;color:var(--text-ink);margin:14px 0 0;} .rh-page.rh-branche .rh-h2--feature{font-size:clamp(30px,3.6vw,46px);line-height:1.05;} .rh-page.rh-branche .rh-h2--cockpit{font-size:clamp(32px,4vw,54px);line-height:1.03;color:#fff;} .rh-page.rh-branche .rh-h3{font-family:var(--font-display);font-weight:600;font-size:19px;line-height:1.25; letter-spacing:-.01em;color:var(--text-ink);margin:14px 0 4px;} .rh-page.rh-branche .rh-lead{font-family:var(--font-sans);font-size:20px;line-height:1.55;color:var(--text-body);margin:20px 0 0;} .rh-page.rh-branche .rh-lead--hero{color:#D6E7DC;max-width:33em;margin-top:26px;} .rh-page.rh-branche .rh-lead--dark{color:#B7CABF;} .rh-page.rh-branche .rh-text{font-family:var(--font-sans);font-size:17px;line-height:1.6;color:var(--text-body);margin:0;} .rh-page.rh-branche .rh-mark{background:var(--rh-green);color:var(--rh-green-deep);padding:0 .1em;border-radius:7px; -webkit-box-decoration-break:clone;box-decoration-break:clone;} .rh-page.rh-branche .rh-head{max-width:820px;margin:0 auto;text-align:center;} .rh-page.rh-branche .rh-head .rh-lead,.rh-page.rh-branche .rh-head .rh-text{margin-left:auto;margin-right:auto;max-width:36em;} .rh-page.rh-branche .rh-head .rh-text{margin-top:20px;} /* ============================================================ Buttons (Pill) ============================================================ */ .rh-page.rh-branche .rh-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px; font-family:var(--font-mono);font-weight:600;font-size:15px;letter-spacing:.04em;white-space:nowrap; text-decoration:none;border:1.5px solid transparent;border-radius:var(--r-pill);padding:17px 30px; cursor:pointer;transition:background .18s ease,transform .12s ease,color .18s ease,border-color .18s ease;} .rh-page.rh-branche .rh-btn:active{transform:scale(.97);} .rh-page.rh-branche .rh-btn__ic{font-size:1.05em;line-height:1;} .rh-page.rh-branche .rh-btn--primary{background:var(--rh-green);color:var(--rh-green-deep);} .rh-page.rh-branche .rh-btn--primary:hover{background:var(--rh-green-600);color:var(--rh-green-deep);} .rh-page.rh-branche .rh-btn--ghost{background:transparent;color:var(--rh-green);border-color:var(--rh-green);} .rh-page.rh-branche .rh-btn--ghost:hover{background:rgba(163,246,152,.12);color:var(--rh-green);} .rh-page.rh-branche .rh-btn--outline{background:transparent;color:var(--text-ink);border-color:var(--rh-line);} .rh-page.rh-branche .rh-btn--outline:hover{background:var(--surface-muted);border-color:var(--rh-grey-400);} .rh-page.rh-branche a:focus-visible,.rh-page.rh-branche button:focus-visible,.rh-page.rh-branche [tabindex]:focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px;} .rh-page.rh-branche .rh-btn:focus-visible{outline:none;box-shadow:var(--ring);} .rh-page.rh-branche .rh-faq summary:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-md);} /* ============================================================ Check-Listen (list-style aufs li - Salient setzt disc direkt aufs li!) ============================================================ */ .rh-page.rh-branche .rh-checklist{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;} .rh-page.rh-branche .rh-checklist li{list-style:none;display:flex;gap:12px;align-items:center;font:400 17px/1.4 var(--font-sans);color:var(--text-body);} .rh-page.rh-branche .rh-checklist__ic{flex:none;color:var(--rh-green-deep);} /* ============================================================ HERO: Text links, rechts Branchen-Foto + 3D-Phone davor. ============================================================ */ .rh-page.rh-branche .rh-hero__grid{display:grid;grid-template-columns:1fr 560px;gap:56px;align-items:center;position:relative;z-index:2;} .rh-page.rh-branche .rh-hero__glow{position:absolute;right:-8%;top:20%;width:520px;height:520px;border-radius:50%; background:rgba(163,246,152,.16);filter:blur(90px);pointer-events:none;z-index:1;} .rh-page.rh-branche .rh-hero__ambient{position:absolute;inset:-8% -10%;background:rgba(163,246,152,.18);filter:blur(64px);border-radius:50%;pointer-events:none;z-index:0;} .rh-page.rh-branche .rh-hero__floor{position:absolute;left:8%;bottom:-56px;width:64%;height:44px;background:rgba(4,14,9,.5);filter:blur(30px);border-radius:50%;pointer-events:none;z-index:0;} .rh-page.rh-branche .rh-hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;} .rh-page.rh-branche .rh-hero__trust{margin-top:30px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:#9FC4AD;} .rh-page.rh-branche .rh-hero__visual{position:relative;justify-self:end;width:100%;} /* Branchen-Foto: rechtsbuendige Basis-Ebene; gruene Flaeche als Bild-Fallback. */ .rh-page.rh-branche .rh-photo--hero{position:relative;width:78%;margin-left:auto;border-radius:var(--r-lg);overflow:hidden; aspect-ratio:10/11;box-shadow:0 30px 70px rgba(0,0,0,.4);background:linear-gradient(160deg,#1F4A37 0%,#0E2419 100%);z-index:1;} .rh-page.rh-branche .rh-photo--hero img{width:100%;height:100%;object-fit:cover;} /* Tag oben LINKS: oben rechts schwebt das Flag-Mark, unten links das Phone. */ .rh-page.rh-branche .rh-photo__tag{position:absolute;top:18px;left:18px;display:inline-flex;align-items:center;gap:7px; background:rgba(14,36,25,.72);backdrop-filter:blur(6px);border:1px solid var(--rh-line-dark);border-radius:var(--r-pill); padding:8px 14px;font-family:var(--font-mono);font-weight:600;font-size:11px;letter-spacing:.04em;color:var(--rh-green);} .rh-page.rh-branche .rh-photo__dot{width:7px;height:7px;border-radius:50%;background:var(--rh-green);box-shadow:0 0 0 4px rgba(163,246,152,.25);animation:rh-pulse 2.4s infinite;} .rh-page.rh-branche .rh-flagmark{position:absolute;top:-26px;right:-14px;width:96px;height:auto;z-index:8; animation:rh-floatb 6s ease-in-out infinite;filter:drop-shadow(0 14px 26px rgba(0,0,0,.34));} /* 3D-Phone: unten links verankert, ueberlappt das Foto. */ .rh-page.rh-branche .rh-hero__phonewrap{position:absolute;left:0;bottom:-52px;width:300px;z-index:5;} .rh-page.rh-branche .rh-hero__tilt{transform:rotateY(-16deg) rotateX(4deg) rotateZ(-1deg);transform-style:preserve-3d;filter:drop-shadow(38px 46px 52px rgba(6,18,12,.5));} .rh-page.rh-branche .rh-hero__phonebody{width:300px;} .rh-page.rh-branche .rh-hero__pill{position:absolute;right:-6px;bottom:-24px;z-index:9;display:inline-flex;align-items:center;gap:8px; background:#fff;padding:9px 14px;border-radius:999px;box-shadow:0 14px 30px rgba(8,20,14,.24);animation:rh-float 6s ease-in-out infinite;} .rh-page.rh-branche .rh-hero__pill-dot{width:8px;height:8px;border-radius:50%;background:var(--rh-green-deep);animation:rh-pulse 2.4s infinite;} .rh-page.rh-branche .rh-hero__pill-txt{font-family:var(--font-mono);font-size:12px;font-weight:600;color:#173528;} /* ============================================================ TRUST: Kunden-Logo-Marquee + ROI-Leiste ============================================================ */ .rh-page.rh-branche .rh-ind__lead{margin:0;text-align:center;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--muted);} /* max-width 720px: ein Set (6 Logos x ~200px = 1200px) muss den Viewport decken, sonst reisst der Marquee-Loop eine sichtbare Luecke. */ .rh-page.rh-branche .rh-clients{max-width:720px;margin:6px auto 0;} .rh-page.rh-branche .rh-clients__viewport{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);} .rh-page.rh-branche .rh-clients__track{display:flex;width:max-content;} .rh-page.rh-branche .rh-clients__set{display:flex;align-items:center;margin:0;padding:0;} .rh-page.rh-branche .rh-clients__item{list-style:none;flex:0 0 auto;padding:8px 30px;line-height:1;} .rh-page.rh-branche .rh-clients__img{display:block;height:32px;width:auto;max-width:140px;object-fit:contain;} .rh-page.rh-branche .rh-roi{max-width:1040px;margin:52px auto 0;} .rh-page.rh-branche .rh-roi__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--surface-muted); border:1px solid var(--rh-line);border-radius:var(--radius-lg);overflow:hidden;} .rh-page.rh-branche .rh-roi__cell{padding:28px 18px;text-align:center;border-right:1px solid var(--rh-line);} .rh-page.rh-branche .rh-roi__cell:last-child{border-right:0;} .rh-page.rh-branche .rh-roi__eyebrow{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--rh-grey-500);} .rh-page.rh-branche .rh-roi__val{margin-top:9px;display:flex;align-items:center;justify-content:center;gap:7px;} .rh-page.rh-branche .rh-roi__ico{width:24px;height:24px;flex:none;border-radius:50%;background:var(--rh-green-100);display:inline-flex;align-items:center;justify-content:center;} .rh-page.rh-branche .rh-roi__num{font-family:var(--font-display);font-weight:700;font-size:37px;letter-spacing:-.02em;color:var(--rh-green-deep);} .rh-page.rh-branche .rh-roi__label{margin-top:9px;font-size:13px;color:var(--muted);line-height:1.4;} .rh-page.rh-branche .rh-roi__foot{margin-top:14px;text-align:center;font-family:var(--font-mono);font-size:11px;color:var(--muted);} /* ============================================================ SO FUNKTIONIERT'S (3 Schritte, Storyboard) ============================================================ */ .rh-page.rh-branche .rh-steps{max-width:1180px;margin:46px auto 0;padding:0 32px;display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;gap:12px;} .rh-page.rh-branche .rh-step{flex:1 1 240px;min-width:236px;background:#fff;border:1px solid var(--rh-line); border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:24px 20px;display:flex;flex-direction:column;} .rh-page.rh-branche .rh-step--wide{flex:1.55 1 340px;min-width:300px;padding:24px 22px;} .rh-page.rh-branche .rh-step__head{display:flex;align-items:center;gap:11px;} .rh-page.rh-branche .rh-step__badge{width:34px;height:34px;flex:none;border-radius:50%;background:var(--rh-green);color:#173528; font-family:var(--font-display);font-weight:700;font-size:16px;display:inline-flex;align-items:center;justify-content:center;} .rh-page.rh-branche .rh-step__badge--dark{background:var(--rh-green-deep);color:var(--rh-green);} .rh-page.rh-branche .rh-step__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--rh-grey-500);} .rh-page.rh-branche .rh-step__text{margin:0 0 18px;font-size:13.5px;line-height:1.5;color:var(--muted);} /* Hinweis-Betonung als eigene Klasse statt (Salient-Typo-Panel!). */ .rh-page.rh-branche .rh-step__hint{color:var(--rh-green-deep);font-weight:600;} .rh-page.rh-branche .rh-step__mock{margin-top:auto;} .rh-page.rh-branche .rh-steparrow{flex:none;display:flex;align-items:center;justify-content:center;color:var(--rh-grey-400);} /* ============================================================ Buchungs-Popover (.rh-pop__*, gerendert von rh_b_pop) ============================================================ */ .rh-page.rh-branche .rh-pop{position:absolute;left:50%;width:238px;background:#fff;border:1px solid var(--rh-line); border-radius:14px;box-shadow:0 24px 50px rgba(12,5,51,.28);padding:13px;z-index:30;text-align:left; opacity:0;pointer-events:none;transition:opacity .28s ease,transform .28s cubic-bezier(.16,.8,.24,1);cursor:default;} .rh-page.rh-branche .rh-pop--top{bottom:calc(100% + 12px);transform:translate(-50%,8px) scale(.97);} .rh-page.rh-branche .rh-pop--bottom{top:calc(100% + 12px);transform:translate(-50%,-8px) scale(.97);} .rh-page.rh-branche .rh-pop.is-open{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1);} .rh-page.rh-branche .rh-pop__tail{position:absolute;left:50%;width:14px;height:14px;background:#fff;} .rh-page.rh-branche .rh-pop--top .rh-pop__tail{bottom:-7px;transform:translateX(-50%) rotate(45deg);border-right:1px solid var(--rh-line);border-bottom:1px solid var(--rh-line);} .rh-page.rh-branche .rh-pop--bottom .rh-pop__tail{top:-7px;transform:translateX(-50%) rotate(45deg);border-left:1px solid var(--rh-line);border-top:1px solid var(--rh-line);} /* Rechtsbuendige Variante (letzte Kalenderspalte, KI-Chip im Step-2-Screen): ohne sie wuerde .rh-browser{overflow:hidden} das Popover seitlich clippen. */ .rh-page.rh-branche .rh-pop--r{left:auto;right:-4px;} .rh-page.rh-branche .rh-pop--top.rh-pop--r{transform:translate(0,8px) scale(.97);} .rh-page.rh-branche .rh-pop--bottom.rh-pop--r{transform:translate(0,-8px) scale(.97);} .rh-page.rh-branche .rh-pop--r.is-open{transform:translate(0,0) scale(1);} .rh-page.rh-branche .rh-pop--r .rh-pop__tail{left:auto;right:24px;transform:rotate(45deg);} /* Karte mit offenem Popover ueber Now-Linie + Nachbarn heben (!important schlaegt den Inline-z-index der Termincards). */ .rh-page.rh-branche [data-rh-cal].is-popped{z-index:20!important;} .rh-page.rh-branche .rh-pop__head{display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--rh-line);} .rh-page.rh-branche .rh-pop__avatar{flex:none;width:34px;height:34px;border-radius:10px;background:var(--rh-green-100);display:inline-flex;align-items:center;justify-content:center;} .rh-page.rh-branche .rh-pop__id{display:flex;flex-direction:column;min-width:0;} .rh-page.rh-branche .rh-pop__name{font-weight:700;font-size:13px;color:var(--text-ink);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-pop__service{font-size:10.5px;color:var(--muted);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-pop__rows{display:flex;flex-direction:column;gap:5px;margin-top:9px;} .rh-page.rh-branche .rh-pop__row{display:flex;gap:7px;align-items:center;font-size:10.5px;color:var(--text-body);line-height:1.35;min-width:0;} .rh-page.rh-branche .rh-pop__row svg{flex:none;} .rh-page.rh-branche .rh-pop__k{font-weight:600;color:var(--text-ink);flex:none;} .rh-page.rh-branche .rh-pop__v{color:var(--text-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-pop__pay{margin-top:10px;background:var(--rh-green-100);border:1px solid var(--rh-green);border-radius:11px;padding:9px 11px;} .rh-page.rh-branche .rh-pop__paytitle{display:flex;align-items:center;gap:6px;font-weight:700;font-size:11px;line-height:1.3;color:#2C5A3E;} .rh-page.rh-branche .rh-pop__payrow{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:4px;font-size:10.5px;line-height:1.3;color:var(--text-body);} .rh-page.rh-branche .rh-pop__amt{font-weight:700;color:var(--text-ink);font-family:var(--font-mono);font-size:10.5px;} .rh-page.rh-branche .rh-pop__amt.rh-pop__grn{color:#2C5A3E;} /* ============================================================ FOTO-BAND (zweites grosses Branchen-Visual) ============================================================ */ .rh-page.rh-branche .rh-band{position:relative;border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:16/7;background:var(--rh-green-deep);} .rh-page.rh-branche .rh-band__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% 35%;} .rh-page.rh-branche .rh-band__overlay{position:relative;z-index:1;height:100%;max-width:600px;display:flex;flex-direction:column;justify-content:center;padding:48px 56px;background:linear-gradient(90deg,rgba(14,36,25,.94) 0%,rgba(14,36,25,.8) 42%,rgba(14,36,25,0) 100%);} .rh-page.rh-branche .rh-band__eyebrow{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-family:var(--font-mono);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--rh-green);background:rgba(14,36,25,.5);border:1px solid var(--rh-line-dark);border-radius:var(--r-pill);padding:8px 14px;} .rh-page.rh-branche .rh-band__dot{width:7px;height:7px;border-radius:50%;background:var(--rh-green);} .rh-page.rh-branche .rh-band__title{margin:18px 0 0;color:#fff;} .rh-page.rh-branche .rh-band__text{font-family:var(--font-sans);font-size:16px;line-height:1.55;color:var(--on-dark-muted);margin:16px 0 0;max-width:460px;} /* ============================================================ COCKPIT (dunkle Sektion + Browser-Mockup + mobile Tagesansicht) ============================================================ */ .rh-page.rh-branche .rh-cockpit__glow{position:absolute;top:-10%;left:50%;transform:translateX(-50%);width:1000px;height:600px; background:radial-gradient(ellipse at center,rgba(70,183,104,.35),transparent 62%);pointer-events:none;z-index:0;} .rh-page.rh-branche .rh-cockpit__head{position:relative;z-index:1;} .rh-page.rh-branche .rh-browser{max-width:1120px;width:calc(100% - 48px);margin:52px auto 0;position:relative;z-index:1;border-radius:16px;background:#fff; box-shadow:0 50px 120px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.07),0 0 90px rgba(163,246,152,.12);overflow:hidden;} .rh-page.rh-branche .rh-browser__bar{height:46px;display:flex;align-items:center;gap:8px;padding:0 16px;background:#F1F3EF;border-bottom:1px solid var(--rh-line);} .rh-page.rh-branche .rh-browser__dots{display:inline-flex;gap:8px;} .rh-page.rh-branche .rh-browser__dots i{width:11px;height:11px;border-radius:50%;background:var(--rh-grey-400);} .rh-page.rh-branche .rh-browser__dots i:nth-child(1){background:#E4655B;} .rh-page.rh-branche .rh-browser__dots i:nth-child(2){background:#E9B44C;} .rh-page.rh-branche .rh-browser__dots i:nth-child(3){background:#5B9E6F;} .rh-page.rh-branche .rh-browser__url{margin:0 auto;background:#fff;border:1px solid var(--rh-line);border-radius:999px;padding:6px 20px; font-family:var(--font-mono);font-size:12px;color:var(--rh-grey-500);} .rh-page.rh-branche .rh-browser__app{display:flex;min-height:562px;background:#fff;} /* Sidebar-Ecke an den 16px-Browser-Radius anpassen: overflow:hidden clippt die eckige dunkle Aside sonst zu einem weissen Splitter unten links. */ .rh-page.rh-branche .rh-browser__scroll aside{border-bottom-left-radius:16px;} .rh-page.rh-branche .rh-cockpit__legend{max-width:1120px;width:calc(100% - 48px);margin:26px auto 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:26px;position:relative;z-index:1;} .rh-page.rh-branche .rh-legend{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;color:#C7DBCF;} .rh-page.rh-branche .rh-legend i{width:11px;height:11px;border-radius:3px;} .rh-page.rh-branche .rh-calm{display:none;width:100%;padding:14px 14px 18px;background:#fff;} .rh-page.rh-branche .rh-calm__top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--rh-line);} .rh-page.rh-branche .rh-calm__brand{display:inline-flex;align-items:center;gap:8px;} .rh-page.rh-branche .rh-calm__brand img{width:20px;height:20px;object-fit:contain;} .rh-page.rh-branche .rh-calm__brand b{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--text-ink);} .rh-page.rh-branche .rh-calm__new{background:var(--rh-green);color:#173528;padding:7px 13px;border-radius:999px;font-family:var(--font-mono);font-weight:600;font-size:11px;white-space:nowrap;} /* Chips = die Plaetze/Raeume des Tages (Tagesansicht, 2026-07-20). Namen sind laenger als die frueheren Tageszahlen -> kleinere Schrift + Ellipse. */ .rh-page.rh-branche .rh-calm__days{display:flex;gap:6px;margin-top:12px;} .rh-page.rh-branche .rh-calm__day{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 4px 8px;border:1px solid var(--rh-line);border-radius:12px;cursor:pointer;transition:background .15s ease,border-color .15s ease;} .rh-page.rh-branche .rh-calm__day i{font-style:normal;font-family:var(--font-mono);font-size:9px;color:var(--rh-grey-500);text-transform:uppercase;letter-spacing:.04em;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-calm__day b{font-weight:600;font-size:11.5px;color:var(--text-ink);line-height:1.15;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-calm__day.is-on{background:var(--rh-green-deep);border-color:var(--rh-green-deep);} .rh-page.rh-branche .rh-calm__day.is-on i{color:#8FB09C;} .rh-page.rh-branche .rh-calm__day.is-on b{color:#fff;} /* min-height 400: Luft fuer das bottom-Popover des zweiten Listen-Events (der Browser-Rahmen clippt per overflow:hidden). */ .rh-page.rh-branche .rh-calm__list{margin-top:14px;display:flex;flex-direction:column;gap:4px;min-height:400px;} .rh-page.rh-branche .rh-calm__row{display:flex;gap:10px;align-items:stretch;} .rh-page.rh-branche .rh-calm__time{width:42px;flex:none;font-family:var(--font-mono);font-size:10.5px;color:var(--rh-grey-500);padding-top:8px;} .rh-page.rh-branche .rh-calm__ev{flex:1;position:relative;border-radius:10px;padding:9px 12px;min-width:0;} .rh-page.rh-branche .rh-calm__ev--paid{background:var(--rh-green);} .rh-page.rh-branche .rh-calm__ev--conf{background:var(--rh-green-deep);border-left:3px solid var(--rh-green);} .rh-page.rh-branche .rh-calm__ev--req{background:var(--rh-green-100);border:1.5px dashed #3E7A4E;} .rh-page.rh-branche .rh-calm__ev[data-rh-cal]{cursor:pointer;} .rh-page.rh-branche .rh-calm__title{font-weight:700;font-size:13px;line-height:1.2;color:#173528;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .rh-page.rh-branche .rh-calm__sub{margin-top:2px;font-size:11px;color:#2C5A3E;} .rh-page.rh-branche .rh-calm__ev--conf .rh-calm__title{color:#fff;font-weight:600;} .rh-page.rh-branche .rh-calm__ev--conf .rh-calm__sub{color:#A9C6B5;} .rh-page.rh-branche .rh-calm__ev--req .rh-calm__sub{color:#3E7A4E;} /* Freier Slot: buchbar, aber ohne Kundendaten - deshalb auch ohne Popover. */ .rh-page.rh-branche .rh-calm__ev--free{background:repeating-linear-gradient(45deg,transparent 0 5px,rgba(226,229,224,.55) 5px 6px);border:1.5px dashed var(--rh-line);} .rh-page.rh-branche .rh-calm__ev--free .rh-calm__title{color:var(--muted);font-weight:600;} .rh-page.rh-branche .rh-calm__ev--free .rh-calm__sub{color:var(--rh-grey-500);} /* ============================================================ FEATURE-SPLITS (Text + Mockup) ============================================================ */ .rh-page.rh-branche .rh-fsplit{display:grid;grid-template-columns:1.08fr .92fr;gap:72px;align-items:center;} .rh-page.rh-branche .rh-fsplit--rev{grid-template-columns:.92fr 1.08fr;} .rh-page.rh-branche .rh-fsplit--rev .rh-fsplit__visual{order:1;} .rh-page.rh-branche .rh-fsplit--rev .rh-fsplit__text{order:2;} .rh-page.rh-branche .rh-fsplit__visual{position:relative;justify-self:center;} .rh-page.rh-branche .rh-fsplit__glow{position:absolute;inset:6% 10%;background:rgba(163,246,152,.33);filter:blur(70px);border-radius:50%;pointer-events:none;} /* Feed-Mockup (wischbare Video-Servicecards) */ .rh-page.rh-branche .rh-feed{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:16px;padding:14px 16px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;} .rh-page.rh-branche .rh-feed::-webkit-scrollbar{display:none;} .rh-page.rh-branche .rh-feed__card{position:relative;flex:0 0 216px;height:378px;border-radius:20px;overflow:hidden;scroll-snap-align:start;cursor:pointer;outline:3px solid transparent;outline-offset:-3px;transition:outline-color .18s ease,box-shadow .18s ease;} .rh-page.rh-branche .rh-feed__card.is-on{outline-color:var(--rh-green);box-shadow:0 14px 30px rgba(12,5,51,.25);} .rh-page.rh-branche .rh-feed__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;} .rh-page.rh-branche .rh-feed__shine{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:0;} .rh-page.rh-branche .rh-feed__card.is-on .rh-feed__shine{opacity:1;} .rh-page.rh-branche .rh-feed__shine::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:36%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.2),transparent);animation:rh-sweep 5s ease-in-out infinite;} .rh-page.rh-branche .rh-feed__vbadge{position:absolute;top:10px;left:10px;display:none;align-items:center;gap:5px;background:rgba(8,20,14,.5);backdrop-filter:blur(3px);padding:4px 8px;border-radius:999px;font-family:var(--font-mono);font-size:9.5px;color:#fff;letter-spacing:.02em;} .rh-page.rh-branche .rh-feed__card.has-video.is-on .rh-feed__vbadge{display:inline-flex;} .rh-page.rh-branche .rh-feed__check{position:absolute;top:9px;right:9px;width:26px;height:26px;border-radius:50%;background:var(--rh-green-deep);display:inline-flex;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.3);opacity:0;transform:scale(.6);transition:opacity .18s ease,transform .18s ease;} .rh-page.rh-branche .rh-feed__card.is-on .rh-feed__check{opacity:1;transform:none;} .rh-page.rh-branche .rh-feed__meta{position:absolute;left:0;right:0;bottom:0;padding:38px 13px 15px;background:linear-gradient(0deg,rgba(0,0,0,.78),transparent);} .rh-page.rh-branche .rh-feed__title{color:#fff;font-weight:700;font-size:16px;line-height:1.15;} .rh-page.rh-branche .rh-feed__sub{margin-top:3px;color:#D6E7DC;font-size:11px;} .rh-page.rh-branche .rh-feed__price{margin-top:5px;color:#C6F9BF;font-size:11.5px;font-family:var(--font-mono);} .rh-page.rh-branche .rh-feed__prog{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.28);opacity:0;} .rh-page.rh-branche .rh-feed__card.has-video.is-on .rh-feed__prog{opacity:1;} .rh-page.rh-branche .rh-feed__prog i{display:block;height:100%;background:var(--rh-green);width:0;animation:rh-prog 8s linear infinite;} /* Feed-Pfeile: einzige Maus-Bedienung des Scroll-Containers (Desktop). */ .rh-page.rh-branche .rh-feedstage{position:relative;} .rh-page.rh-branche .rh-feednav{position:absolute;top:50%;z-index:6;width:44px;height:44px;flex:none; display:inline-flex;align-items:center;justify-content:center;cursor:pointer; border:1px solid var(--rh-line);border-radius:50%;background:#fff;color:var(--rh-green-deep); box-shadow:0 10px 26px rgba(12,5,51,.16);transform:translateY(-50%); transition:transform .16s ease,box-shadow .16s ease,opacity .2s ease,background .16s ease;} .rh-page.rh-branche .rh-feednav:hover{background:var(--rh-green-100);box-shadow:0 14px 32px rgba(12,5,51,.2);transform:translateY(-50%) scale(1.06);} .rh-page.rh-branche .rh-feednav:active{transform:translateY(-50%) scale(.94);} .rh-page.rh-branche .rh-feednav--prev{left:-34px;} .rh-page.rh-branche .rh-feednav--next{right:-34px;} .rh-page.rh-branche .rh-feednav.is-off{opacity:.3;pointer-events:none;box-shadow:var(--shadow-sm);} .rh-page.rh-branche .rh-feedhint{margin:20px 0 0;display:flex;align-items:center;justify-content:center;gap:9px; font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--muted);} .rh-page.rh-branche .rh-feedhint svg{flex:none;color:var(--rh-green-deep);opacity:.7;} @media (hover:none){.rh-page.rh-branche .rh-feednav{display:none;}} /* Mail-/Flow-/Kurse-Mock: helle Karten (Innereien inline im Modul). */ .rh-page.rh-branche .rh-mockcard{position:relative;} /* ============================================================ FEATURE-BAUKASTEN (Tabs + Panels + Foot) ============================================================ */ .rh-page.rh-branche .rh-trio__tabrow{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;margin-top:36px;padding:0 24px;} .rh-page.rh-branche .rh-trio__tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;} .rh-page.rh-branche .rh-trio__tab{padding:12px 22px;font-family:var(--font-mono);font-size:13px;font-weight:600;letter-spacing:.02em;cursor:pointer; transition:background .16s ease,color .16s ease,border-color .16s ease;} .rh-page.rh-branche .rh-trio__panels{max-width:1040px;margin:36px auto 0;padding:0 32px;} .rh-page.rh-branche .rh-trio__card{background:var(--surface-muted);border:1px solid var(--rh-line);border-radius:var(--radius-lg); padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;} .rh-page.rh-branche .rh-trio__body{text-align:left;} .rh-page.rh-branche .rh-trio__h3{margin:0;font-family:var(--font-display);font-weight:600;font-size:27px;letter-spacing:-.01em;color:var(--text-ink);} .rh-page.rh-branche .rh-trio__text{margin:14px 0 22px;font-size:17px;line-height:1.6;color:var(--text-body);max-width:40ch;} .rh-page.rh-branche .rh-trio__checks{display:flex;flex-direction:column;gap:13px;} .rh-page.rh-branche .rh-trio__check{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;color:var(--text-body);} .rh-page.rh-branche .rh-trio__check-ic{flex:none;width:22px;height:22px;border-radius:50%;background:var(--rh-green); display:inline-flex;align-items:center;justify-content:center;margin-top:1px;} .rh-page.rh-branche .rh-trio__note{margin:18px 0 0;font-family:var(--font-mono);font-size:11px;line-height:1.55;color:var(--muted);} .rh-page.rh-branche .rh-trio__mock{position:relative;} .rh-page.rh-branche .rh-stat{position:absolute;right:-10px;bottom:-30px;z-index:3;display:flex;align-items:center;gap:13px; background:#fff;border:1px solid var(--rh-line);border-radius:16px;padding:12px 15px;box-shadow:var(--shadow-lg);} .rh-page.rh-branche .rh-stat__ic{width:30px;height:30px;flex:none;border-radius:50%;background:var(--rh-green); display:inline-flex;align-items:center;justify-content:center;} .rh-page.rh-branche .rh-stat__val{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:-.01em; line-height:1.1;color:var(--rh-green-deep);white-space:nowrap;} .rh-page.rh-branche .rh-stat__lbl{margin-top:3px;font-size:10.5px;line-height:1.3;color:var(--muted);max-width:15ch;} .rh-page.rh-branche .rh-stat__sep{width:1px;flex:none;align-self:stretch;background:var(--rh-line);} /* Foot statt Modul-Grid: ein Satz + Outline-CTA -> /preise/. */ .rh-page.rh-branche .rh-trio__foot{margin-top:44px;text-align:center;} .rh-page.rh-branche .rh-trio__foot-txt{margin:0;font-size:17px;line-height:1.6;color:var(--text-ink);} .rh-page.rh-branche .rh-trio__cta{margin-top:18px;text-align:center;} /* ============================================================ FAQ (DOM-Vertrag fuer FAQPage-JSON-LD, inc/rh-seo.php) ============================================================ */ .rh-page.rh-branche .rh-faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:14px;text-align:left;} .rh-page.rh-branche .rh-faq details{background:var(--rh-white);border:1px solid var(--rh-line);border-radius:var(--r-md);box-shadow:var(--shadow-sm);overflow:hidden;} .rh-page.rh-branche .rh-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;font-family:var(--font-mono);font-weight:600;font-size:15px;color:var(--ink);} .rh-page.rh-branche .rh-faq summary::-webkit-details-marker{display:none;} .rh-page.rh-branche .rh-faq__icon{flex:none;width:28px;height:28px;border-radius:50%;background:var(--rh-green);color:var(--rh-green-deep);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;transition:transform .2s;} .rh-page.rh-branche .rh-faq details[open] .rh-faq__icon{transform:rotate(45deg);} .rh-page.rh-branche .rh-faq__a{padding:0 24px 24px;font-family:var(--font-sans);font-size:16px;line-height:1.6;color:var(--body);max-width:680px;} .rh-page.rh-branche .rh-faq__link{color:var(--rh-green-deep);font-weight:600;text-decoration:underline;text-underline-offset:2px;} .rh-page.rh-branche .rh-faq details[open] .rh-faq__a{animation:rh-faq-open .2s ease both;} /* ============================================================ FINAL CTA ============================================================ */ .rh-page.rh-branche .rh-finalcta{position:relative;overflow:hidden;border-radius:var(--radius-xl);text-align:center; padding:74px 32px;color:var(--on-dark); background:radial-gradient(120% 130% at 50% 0%,#207A46 0%,#173528 52%,#0E2419 100%); box-shadow:0 40px 90px rgba(12,5,51,.24);} .rh-page.rh-branche .rh-finalcta::before{content:"";position:absolute;top:-40%;left:50%;transform:translateX(-50%); width:720px;height:420px;background:radial-gradient(ellipse at center,rgba(163,246,152,.28),transparent 62%);pointer-events:none;} .rh-page.rh-branche .rh-finalcta__inner{position:relative;z-index:1;max-width:640px;margin:0 auto;} .rh-page.rh-branche .rh-finalcta__lead{color:#B7CABF;margin:18px auto 0;max-width:30em;} .rh-page.rh-branche .rh-finalcta__actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:32px;} .rh-page.rh-branche .rh-finalcta__note{margin:22px 0 0;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:#9FC4AD;} /* ============================================================ Keyframes ============================================================ */ @keyframes rh-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}} @keyframes rh-floatb{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-9px) rotate(-4deg)}} @keyframes rh-rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}} @keyframes rh-blink{0%,80%,100%{opacity:.2}40%{opacity:1}} @keyframes rh-pulse{0%{box-shadow:0 0 0 0 rgba(163,246,152,.55)}70%{box-shadow:0 0 0 9px rgba(163,246,152,0)}100%{box-shadow:0 0 0 0 rgba(163,246,152,0)}} @keyframes rh-sweep{0%{transform:translateX(-170%) skewX(-12deg)}55%,100%{transform:translateX(360%) skewX(-12deg)}} /* Flow-Mock: dezenter Tap-Puls am Finger-Glyph der gruenen 1-Klick-Karte. */ @keyframes rh-tap{0%,62%,100%{transform:translateY(0)}72%{transform:translateY(2.5px) scale(.86)}82%{transform:translateY(0)}} @media (prefers-reduced-motion:no-preference){.rh-page.rh-branche .rh-tap-ic{animation:rh-tap 2.1s ease-in-out infinite;transform-origin:60% 65%;}} @keyframes rh-prog{0%{width:0}92%{width:100%}100%{width:100%}} @keyframes rh-logoscroll{to{transform:translateX(-50%)}} @keyframes rh-faq-open{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}} /* Kunden-Marquee: Bewegung nur ohne reduce; sonst statische Reihe. */ @media (prefers-reduced-motion: no-preference){ .rh-page.rh-branche .rh-clients__track{animation:rh-logoscroll 48s linear infinite;} .rh-page.rh-branche .rh-clients:hover .rh-clients__track{animation-play-state:paused;} } @media (prefers-reduced-motion: reduce){ .rh-page.rh-branche .rh-clients__track{width:auto;justify-content:center;} .rh-page.rh-branche .rh-clients__set{flex-wrap:wrap;justify-content:center;} .rh-page.rh-branche .rh-clients__set[aria-hidden="true"]{display:none;} .rh-page.rh-branche .rh-clients__viewport{-webkit-mask-image:none;mask-image:none;} } /* Hero-Eintritts-Animation (nur ohne reduce). */ @media (prefers-reduced-motion: no-preference){ .rh-page.rh-branche .rh-hero__text > *{animation:rh-rise .6s ease both;} .rh-page.rh-branche .rh-hero__text > *:nth-child(2){animation-delay:.06s;} .rh-page.rh-branche .rh-hero__text > *:nth-child(3){animation-delay:.12s;} .rh-page.rh-branche .rh-hero__text > *:nth-child(4){animation-delay:.18s;} .rh-page.rh-branche .rh-hero__text > *:nth-child(5){animation-delay:.24s;} } /* ============================================================ Scroll-Reveal (Self-Healing, CLAUDE.md S11) ============================================================ */ @media (prefers-reduced-motion: no-preference){ .rh-page.rh-branche.rh-anim .rh-reveal{opacity:0;transform:translateY(26px); transition:opacity .7s cubic-bezier(.16,.8,.24,1),transform .8s cubic-bezier(.16,.8,.24,1);will-change:opacity,transform;} .rh-page.rh-branche.rh-anim .rh-reveal.is-in{opacity:1;transform:none;} .rh-page.rh-branche.rh-anim .rh-reveal.rh-force{opacity:1!important;transform:none!important;transition:none!important;} } /* ============================================================ Theme-Hardening gegen Salient (CLAUDE.md S3) - einmal fuer alle 10 Branchenseiten. Spezifitaet .rh-page.rh-branche + !important. ============================================================ */ /* Generische Tags: Salients Typo-Panel belegt b/strong/i/em site-weit mit Deko-Fonts (i/em -> "Caveat", eine Handschrift, 22px). Zurueckholen; font-weight bleibt unangetastet. */ .rh-page.rh-branche b,.rh-page.rh-branche strong{font-family:inherit!important;} .rh-page.rh-branche i,.rh-page.rh-branche em{font-family:inherit!important;font-style:normal!important; font-size:inherit!important;line-height:inherit!important;letter-spacing:inherit!important;} /* Ausnahmen: bewusst andere Familien in der mobilen Cockpit-Ansicht. */ .rh-page.rh-branche .rh-calm__brand b{font-family:var(--font-display)!important;} .rh-page.rh-branche .rh-calm__day i{font-family:var(--font-mono)!important;font-size:9px!important;letter-spacing:.04em!important;} /* Links: WPCode-Snippet setzt site-weit a{font-family:monospace!important}. */ .rh-page.rh-branche a{font-family:inherit!important;} .rh-page.rh-branche .rh-btn,.rh-page.rh-branche .rh-trio__tab{font-family:var(--font-mono)!important;} .rh-page.rh-branche .rh-h1{font:700 clamp(40px,4.6vw,64px)/1.02 var(--font-display)!important;letter-spacing:-.02em!important;color:#fff!important;} .rh-page.rh-branche .rh-h2{font:700 clamp(30px,3.8vw,50px)/1.04 var(--font-display)!important;letter-spacing:-.02em!important;color:var(--text-ink)!important;} .rh-page.rh-branche .rh-h2--feature{font-size:clamp(30px,3.6vw,46px)!important;line-height:1.05!important;} .rh-page.rh-branche .rh-h2--cockpit{font-size:clamp(32px,4vw,54px)!important;line-height:1.03!important;color:#fff!important;} .rh-page.rh-branche .rh-band__title{color:#fff!important;} .rh-page.rh-branche .rh-finalcta__title{color:#fff!important;} .rh-page.rh-branche .rh-h3{font:600 19px/1.25 var(--font-display)!important;letter-spacing:-.01em!important;color:var(--text-ink)!important;} .rh-page.rh-branche .rh-trio__h3{font:600 27px/1.15 var(--font-display)!important;letter-spacing:-.01em!important;} .rh-page.rh-branche .rh-btn{border-radius:var(--r-pill)!important;} /* Tab-Pills und Feed-Pfeile sind