/* ==========================================================================
   Studienzentrum Dr. Bischof GmbH – style.css
   Gemeinsames Stylesheet für alle deutschen (/) und englischen (/en/) Seiten.
   Teil 1: Schriften, Grundregeln, Interaktion, Responsive.
   Teil 2 (am Ende, generiert): Layout-Klassen s1 … sN, wie sie in den HTML-
   Seiten verwendet werden.
   ========================================================================== */

/* --- Schrift (lokal gehostet, kein Aufruf von Google-Servern) --- */
@font-face { font-family: 'Hanken Grotesk'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/hanken-grotesk-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Hanken Grotesk'; font-style: normal; font-weight: 500; font-display: swap; src: url('fonts/hanken-grotesk-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Hanken Grotesk'; font-style: normal; font-weight: 600; font-display: swap; src: url('fonts/hanken-grotesk-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Hanken Grotesk'; font-style: normal; font-weight: 700; font-display: swap; src: url('fonts/hanken-grotesk-latin-700-normal.woff2') format('woff2'); }

/* --- Grundregeln --- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; font-family: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif; -webkit-font-smoothing: antialiased; background: #07171f; color: #0b1f2a; }
svg { flex-shrink: 0; }
a { color: inherit; }
button { font-family: inherit; }

/* --- Einblenden beim Scrollen (.rv), Klasse .in wird per JS gesetzt --- */
.rv { opacity: 0; transform: translateY(34px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.rv.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .rv { opacity: 1; transform: none; transition: none; } }

/* --- Navigation / Links / Buttons --- */
.nl { transition: color .3s ease; }
.nl:hover { color: #92d050 !important; }
.nav-links a { white-space: nowrap; }
.btnp { transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease; }
.btnp:hover { transform: translateY(-3px); }
.cardlift { transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease, border-color .3s ease; }
.cardlift:hover { transform: translateY(-6px); box-shadow: 0 28px 60px rgba(11,31,42,.14); }
.gate { transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease; }
.gate:hover { transform: translateY(-6px); box-shadow: 0 34px 70px rgba(0,0,0,.4); }
.gate:hover .arrow { transform: translateX(6px); }
.arrow { transition: transform .4s cubic-bezier(.16,1,.3,1); }
.link-inline { color: #1d8aa6; text-decoration: none; font-weight: 600; }
.link-inline:hover { text-decoration: underline; }

/* --- Sprachwahl DE | EN (vorgerenderte Seiten, Wechsel per Link) --- */
.lang { display: flex; align-items: center; margin-left: 8px; }
.lang a { font: 700 12.5px 'Hanken Grotesk'; color: #9fb0b8; background: rgba(255,255,255,.1); padding: 7px 11px; text-decoration: none; transition: background .25s ease, color .25s ease; }
.lang a:first-child { border-radius: 100px 0 0 100px; }
.lang a:last-child { border-radius: 0 100px 100px 0; }
.lang a:hover { color: #fff; }
.lang a.on { color: #07171f; background: #fff; }
.lang a.on:hover { color: #07171f; }

/* --- Mobiles Menü --- */
.menu-toggle { display: none; }
.menu-toggle span { transition: transform .3s ease, opacity .3s ease; }
.menu-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.open span:nth-child(2) { opacity: 0; }
.menu-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
#mobile-menu { display: none; }
#mobile-menu.open { display: flex; }
#mobile-menu .lang { margin: 24px 0 0; }
#mobile-menu .lang a { font-size: 14px; padding: 10px 16px; }

/* --- Hintergrundvideo --- */
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* --- Cookie-Hinweis --- */
#cookie-banner { position: fixed; left: 24px; right: 24px; bottom: 24px; max-width: 520px; z-index: 900; background: rgba(255,255,255,.97); backdrop-filter: blur(20px); border-radius: 24px; padding: 26px 28px; box-shadow: 0 24px 60px rgba(0,0,0,.25); border: 1px solid rgba(11,31,42,.06); display: none; }
#cookie-banner.show { display: block; }
#cookie-banner h3 { margin: 0 0 8px; font: 700 16px 'Hanken Grotesk'; color: #0b1f2a; }
#cookie-banner p { margin: 0 0 18px; font: 400 14px/1.55 'Hanken Grotesk'; color: #56656b; }
#cookie-banner p a { color: #1d8aa6; font-weight: 600; text-decoration: none; }
#cookie-banner .cookie-btns { display: flex; gap: 10px; flex-wrap: wrap; }
#cookie-banner button { flex: 1 1 140px; border: none; cursor: pointer; padding: 12px 16px; border-radius: 12px; font: 700 14px 'Hanken Grotesk'; transition: background .25s ease, color .25s ease; }
#cookie-banner .btn-accept { background: #0b1f2a; color: #fff; }
#cookie-banner .btn-accept:hover { background: #2e7d8f; }
#cookie-banner .btn-decline { background: #eef1ec; color: #0b1f2a; }
#cookie-banner .btn-decline:hover { background: #e2e7e0; }

/* --- Responsive --- */
@media (max-width: 1000px) {
  .nav-links { display: none !important; }
  .menu-toggle { display: flex !important; }
  .nav-lang { display: none !important; }
  .g2 { grid-template-columns: 1fr !important; }
  .g3 { grid-template-columns: 1fr !important; }
  .g4 { grid-template-columns: repeat(2, 1fr) !important; }
  .split { grid-template-columns: 1fr !important; }
  .split aside { position: static !important; }
  .gfoot { grid-template-columns: 1fr 1fr !important; gap: 36px 30px !important; }
  .hide-sm { display: none !important; }
}
@media (max-width: 760px) {
  .reg-head, .reg-row { min-width: 640px; }
}
@media (max-width: 560px) {
  .g4 { grid-template-columns: 1fr !important; }
  .gfoot { grid-template-columns: 1fr !important; }
  #cookie-banner { left: 12px; right: 12px; bottom: 12px; padding: 22px; }
}

/* --- Studien-Register (Referenzen) --- */
.reg-head, .reg-row { display: grid; grid-template-columns: 1fr 180px 72px 132px; gap: 18px; align-items: center; }
.reg-head { padding: 0 22px 14px; border-bottom: 1px solid #e6e9e3; }
.reg-head div { font: 700 11px 'Hanken Grotesk'; letter-spacing: .1em; text-transform: uppercase; color: #9aa4a8; }
.reg-row { padding: 15px 22px; border-radius: 12px; border-bottom: 1px solid #f0f2ed; transition: background .25s ease; }
.reg-row:hover { background: #f5f6f3; }
.rn { font: 600 15px/1.35 'Hanken Grotesk'; color: #0b1f2a; letter-spacing: -.01em; }
.ri { font: 500 13px 'Hanken Grotesk'; color: #8a949a; font-variant-numeric: tabular-nums; }
.rp .phase { display: inline-block; font: 700 11px 'Hanken Grotesk'; letter-spacing: .03em; color: #3d7a5b; background: #eaf4ee; padding: 5px 11px; border-radius: 100px; }
.rt { font: 600 13.5px 'Hanken Grotesk'; color: #56656b; text-align: right; white-space: nowrap; }

/* ==========================================================================
   Teil 2: Layout-Klassen (generiert aus dem Design der Live-Seite)
   ========================================================================== */
.s1 { position: fixed; top: 0px; left: 0px; right: 0px; z-index: 1000; background: rgba(8, 20, 27, 0.72); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.s2 { max-width: 1320px; margin: 0px auto; height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0px clamp(20px, 4vw, 48px); }
.s3 { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.s4 { line-height: 1.05; }
.s5 { font: 700 16px 'Hanken Grotesk'; color: rgb(255, 255, 255); letter-spacing: -0.01em; }
.s6 { font: 500 12px 'Hanken Grotesk'; color: rgb(159, 176, 184); letter-spacing: 0.03em; }
.s7 { display: flex; align-items: center; gap: 27px; }
.s8 { font: 500 14.5px 'Hanken Grotesk'; color: rgb(231, 236, 234); text-decoration: none; }
.s9 { font: 600 14px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 11px 20px; border-radius: 100px; text-decoration: none; }
.s10 { display: flex; align-items: center; margin-left: 8px; }
.s11 { font: 700 12.5px 'Hanken Grotesk'; color: rgb(159, 176, 184); background: rgba(255, 255, 255, 0.1); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 7px 11px; border-radius: 100px 0px 0px 100px; cursor: pointer; }
.s12 { font: 700 12.5px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 7px 11px; border-radius: 0px 100px 100px 0px; cursor: pointer; }
.s13 { display: none; flex-direction: column; gap: 5px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; padding: 8px; }
.s14 { display: block; width: 24px; height: 2px; background: rgb(255, 255, 255); border-radius: 2px; }
.s15 { position: fixed; inset: 0px; z-index: 999; background: rgba(7, 23, 31, 0.97); backdrop-filter: blur(20px); flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.s16 { font: 600 22px 'Hanken Grotesk'; color: rgb(255, 255, 255); text-decoration: none; padding: 14px; }
.s17 { margin-top: 14px; font: 600 17px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 14px 30px; border-radius: 100px; text-decoration: none; }
.s18 { position: relative; height: 100vh; min-height: 720px; overflow: hidden; background: rgb(7, 23, 31); }
.s19 { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; }
.s20 { position: absolute; inset: 0px; background: linear-gradient(rgba(7, 23, 31, 0.66) 0%, rgba(7, 23, 31, 0.52) 28%, rgba(7, 23, 31, 0.76) 76%, rgba(7, 23, 31, 0.94) 100%); }
.s21 { position: absolute; inset: 0px; background: radial-gradient(110% 90% at 22% 100%, rgba(0, 80, 110, 0.45), transparent 55%); }
.s22 { position: absolute; left: 0px; right: 0px; top: 50%; transform: translateY(-44%); }
.s23 { max-width: 1320px; margin: 0px auto; padding: 0px clamp(24px, 5vw, 64px); }
.s24 { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.s25 { width: 34px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, rgb(146, 208, 80), rgb(0, 176, 240)); }
.s26 { font: 700 13px 'Hanken Grotesk'; letter-spacing: 0.16em; text-transform: uppercase; color: rgb(127, 214, 192); }
.s27 { margin: 0px; font: 600 clamp(44px, 7.4vw, 92px) / 1 'Hanken Grotesk'; letter-spacing: -0.04em; color: rgb(255, 255, 255); }
.s28 { margin: 30px 0px 0px; max-width: 560px; font: 400 clamp(17px, 2vw, 21px) / 1.5 'Hanken Grotesk'; color: rgb(196, 208, 210); }
.s29 { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 40px; }
.s30 { display: inline-flex; align-items: center; gap: 10px; font: 600 16px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 17px 32px; border-radius: 100px; text-decoration: none; box-shadow: rgba(0, 0, 0, 0.3) 0px 14px 34px; }
.s31 { display: inline-flex; align-items: center; font: 600 16px 'Hanken Grotesk'; color: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(8px); padding: 17px 30px; border-radius: 100px; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.28); }
.s32 { position: absolute; left: 0px; right: 0px; bottom: 42px; }
.s33 { max-width: 1320px; margin: 0px auto; padding: 0px clamp(24px, 5vw, 64px); display: flex; align-items: center; justify-content: space-between; }
.s34 { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font: 600 13.5px 'Hanken Grotesk'; color: rgb(174, 187, 190); }
.s35 { width: 5px; height: 5px; border-radius: 50%; background: rgb(146, 208, 80); }
.s36 { width: 5px; height: 5px; border-radius: 50%; background: rgb(0, 176, 240); }
.s37 { display: flex; align-items: center; gap: 10px; font: 600 12px 'Hanken Grotesk'; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(143, 160, 164); }
.s38 { display: inline-block; width: 22px; height: 36px; border: 1.5px solid rgba(255, 255, 255, 0.3); border-radius: 12px; position: relative; }
.s39 { position: absolute; left: 50%; top: 7px; transform: translateX(-50%); width: 3px; height: 7px; border-radius: 2px; background: rgb(127, 214, 192); }
.s40 { background: rgb(245, 246, 243); padding: clamp(90px, 11vw, 150px) 0px; }
.s41 { display: flex; align-items: center; gap: 14px; margin-bottom: 34px; }
.s42 { font: 700 13px 'Hanken Grotesk'; letter-spacing: 0.16em; text-transform: uppercase; color: rgb(46, 125, 143); }
.s43 { margin: 0px; max-width: 1000px; font: 500 clamp(28px, 4.2vw, 52px) / 1.2 'Hanken Grotesk'; letter-spacing: -0.025em; color: rgb(11, 31, 42); }
.s44 { color: rgb(46, 125, 143); }
.s45 { margin: 34px 0px 0px; max-width: 620px; font: 400 18px / 1.65 'Hanken Grotesk'; color: rgb(70, 85, 92); }
.s46 { background: rgb(255, 255, 255); padding: clamp(90px, 11vw, 140px) 0px; }
.s47 { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: 54px; flex-wrap: wrap; }
.s48 { max-width: 640px; }
.s49 { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.s50 { margin: 0px 0px 16px; font: 600 clamp(32px, 4.6vw, 54px) / 1.05 'Hanken Grotesk'; letter-spacing: -0.03em; color: rgb(11, 31, 42); }
.s51 { margin: 0px; font: 400 18px / 1.6 'Hanken Grotesk'; color: rgb(70, 85, 92); }
.s52 { font: 600 15px 'Hanken Grotesk'; color: rgb(11, 31, 42); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.s53 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.s54 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 22px; padding: 34px; display: flex; flex-direction: column; }
.s55 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; }
.s56 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(122, 138, 144); }
.s57 { display: inline-flex; align-items: center; gap: 7px; font: 700 11px 'Hanken Grotesk'; letter-spacing: 0.04em; text-transform: uppercase; color: rgb(61, 122, 91); background: rgb(234, 244, 238); padding: 6px 12px; border-radius: 100px; }
.s58 { width: 7px; height: 7px; border-radius: 50%; background: rgb(95, 185, 138); }
.s59 { margin: 0px 0px 8px; font: 700 24px 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s60 { font: 600 15px 'Hanken Grotesk'; color: rgb(29, 138, 166); margin-bottom: 16px; }
.s61 { margin: 0px; font: 400 15px / 1.6 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s62 { background: rgb(11, 31, 42); padding: clamp(64px, 8vw, 100px) 0px; }
.s63 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.s64 { font: 700 clamp(40px, 5vw, 62px) / 1 'Hanken Grotesk'; letter-spacing: -0.04em; color: rgb(255, 255, 255); }
.s65 { color: rgb(127, 214, 192); }
.s66 { margin-top: 12px; font: 500 15px 'Hanken Grotesk'; color: rgb(159, 176, 184); }
.s67 { font: 700 clamp(28px, 3.4vw, 40px) / 1.1 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(255, 255, 255); padding-top: 8px; }
.s68 { background: rgb(245, 246, 243); padding: clamp(90px, 11vw, 140px) 0px; }
.s69 { margin: 0px 0px 50px; max-width: 760px; font: 600 clamp(30px, 4.4vw, 52px) / 1.08 'Hanken Grotesk'; letter-spacing: -0.03em; color: rgb(11, 31, 42); }
.s70 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.s71 { position: relative; overflow: hidden; background: rgb(11, 31, 42); border-radius: 26px; padding: 48px; text-decoration: none; display: flex; flex-direction: column; min-height: 300px; }
.s72 { position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(146, 208, 80, 0.22), transparent 70%); }
.s73 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(127, 214, 192); margin-bottom: auto; }
.s74 { margin: 28px 0px 14px; font: 600 30px / 1.12 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(255, 255, 255); }
.s75 { margin: 0px 0px 26px; max-width: 440px; font: 400 16px / 1.6 'Hanken Grotesk'; color: rgb(185, 198, 201); }
.s76 { display: inline-flex; align-items: center; gap: 10px; font: 600 15px 'Hanken Grotesk'; color: rgb(255, 255, 255); }
.s77 { display: inline-flex; }
.s78 { position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(0, 176, 240, 0.22), transparent 70%); }
.s79 { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 34px; }
.s80 { font: 600 15px 'Hanken Grotesk'; color: rgb(70, 85, 92); text-decoration: none; }
.s81 { position: relative; overflow: hidden; background: rgb(7, 23, 31); padding: clamp(100px, 13vw, 170px) 0px; }
.s82 { position: absolute; inset: 0px; background: radial-gradient(90% 120% at 80% 0%, rgba(0, 80, 110, 0.4), transparent 55%); }
.s83 { position: absolute; inset: 0px; background: radial-gradient(70% 100% at 10% 100%, rgba(146, 208, 80, 0.12), transparent 55%); }
.s84 { position: relative; max-width: 1320px; margin: 0px auto; padding: 0px clamp(24px, 5vw, 64px); text-align: center; }
.s85 { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.s86 { margin: 0px auto; max-width: 880px; font: 600 clamp(34px, 5.4vw, 66px) / 1.04 'Hanken Grotesk'; letter-spacing: -0.035em; color: rgb(255, 255, 255); }
.s87 { margin: 28px auto 0px; max-width: 560px; font: 400 19px / 1.55 'Hanken Grotesk'; color: rgb(196, 208, 210); }
.s88 { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-top: 42px; }
.s89 { display: inline-flex; align-items: center; gap: 10px; font: 600 16px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 18px 34px; border-radius: 100px; text-decoration: none; box-shadow: rgba(0, 0, 0, 0.3) 0px 14px 34px; }
.s90 { display: inline-flex; align-items: center; font: 600 16px 'Hanken Grotesk'; color: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(8px); padding: 18px 32px; border-radius: 100px; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.28); }
.s91 { background: rgb(5, 18, 26); padding: clamp(64px, 8vw, 90px) 0px 40px; }
.s92 { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 48px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.s93 { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.s94 { line-height: 1.1; }
.s95 { font: 700 17px 'Hanken Grotesk'; color: rgb(255, 255, 255); }
.s96 { font: 500 13px 'Hanken Grotesk'; color: rgb(138, 153, 160); }
.s97 { margin: 0px; max-width: 320px; font: 400 14.5px / 1.6 'Hanken Grotesk'; color: rgb(134, 150, 156); }
.s98 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(95, 113, 119); margin-bottom: 18px; }
.s99 { display: flex; flex-direction: column; gap: 12px; }
.s100 { font: 500 14.5px 'Hanken Grotesk'; color: rgb(196, 208, 210); text-decoration: none; }
.s101 { padding-top: 26px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.s102 { font: 400 13px 'Hanken Grotesk'; color: rgb(95, 113, 119); }
.s103 { position: fixed; top: 0px; left: 0px; right: 0px; z-index: 1000; background: rgba(8, 20, 27, 0.82); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.s104 { font: 700 14.5px 'Hanken Grotesk'; color: rgb(255, 255, 255); text-decoration: none; }
.s105 { font: 700 12.5px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 7px 11px; border-radius: 100px 0px 0px 100px; cursor: pointer; }
.s106 { font: 700 12.5px 'Hanken Grotesk'; color: rgb(159, 176, 184); background: rgba(255, 255, 255, 0.1); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 7px 11px; border-radius: 0px 100px 100px 0px; cursor: pointer; }
.s107 { font: 600 22px 'Hanken Grotesk'; color: rgb(127, 214, 192); text-decoration: none; padding: 14px; }
.s108 { position: relative; overflow: hidden; background: rgb(7, 23, 31); padding: 150px 0px clamp(72px, 9vw, 108px); }
.s109 { position: absolute; inset: 0px; background: radial-gradient(90% 120% at 85% 0%, rgba(0, 80, 110, 0.4), transparent 55%); }
.s110 { position: absolute; inset: 0px; background: radial-gradient(70% 120% at 5% 100%, rgba(146, 208, 80, 0.1), transparent 55%); }
.s111 { position: relative; max-width: 1320px; margin: 0px auto; padding: 0px clamp(24px, 5vw, 64px); }
.s112 { margin: 0px; max-width: 960px; font: 600 clamp(40px, 6vw, 76px) / 1.02 'Hanken Grotesk'; letter-spacing: -0.035em; color: rgb(255, 255, 255); }
.s113 { margin: 26px 0px 0px; max-width: 600px; font: 400 clamp(17px, 2vw, 20px) / 1.55 'Hanken Grotesk'; color: rgb(196, 208, 210); }
.s114 { background: rgb(255, 255, 255); padding: clamp(72px, 9vw, 120px) 0px; }
.s115 { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.s116 { margin: 0px 0px 44px; font: 600 clamp(28px, 4vw, 46px) / 1.08 'Hanken Grotesk'; letter-spacing: -0.03em; color: rgb(11, 31, 42); }
.s117 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 22px; padding: clamp(28px, 3.4vw, 40px); }
.s118 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.1em; text-transform: uppercase; color: rgb(61, 122, 91); }
.s119 { margin: 14px 0px 10px; font: 700 24px 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s120 { margin: 0px; font: 400 15.5px / 1.6 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s121 { margin-top: 40px; display: grid; grid-template-columns: 1fr; gap: 22px; }
.s122 { background: rgb(11, 31, 42); border-radius: 24px; padding: clamp(34px, 4vw, 56px); position: relative; overflow: hidden; }
.s123 { position: absolute; right: -50px; top: -50px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(0, 176, 240, 0.18), transparent 70%); }
.s124 { position: relative; font: 500 clamp(20px, 2.6vw, 30px) / 1.4 'Hanken Grotesk'; color: rgb(255, 255, 255); max-width: 840px; letter-spacing: -0.01em; }
.s125 { position: relative; display: inline-flex; align-items: center; gap: 12px; margin-top: 30px; font: 600 15px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 14px 26px; border-radius: 100px; text-decoration: none; }
.s126 { margin: 0px; max-width: 900px; font: 600 clamp(40px, 6vw, 76px) / 1.02 'Hanken Grotesk'; letter-spacing: -0.035em; color: rgb(255, 255, 255); }
.s127 { max-width: 1080px; margin: 0px auto; padding: 0px clamp(24px, 5vw, 64px); }
.s128 { display: flex; align-items: center; gap: 14px; margin-bottom: 44px; }
.s129 { display: flex; flex-direction: column; gap: 20px; }
.s130 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 22px; padding: clamp(28px, 3.4vw, 42px); }
.s131 { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.s132 { margin: 0px; font: 700 clamp(20px, 2.4vw, 25px) 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s133 { font: 700 11px 'Hanken Grotesk'; letter-spacing: 0.06em; text-transform: uppercase; color: rgb(29, 138, 166); background: rgb(231, 244, 248); padding: 6px 13px; border-radius: 100px; white-space: nowrap; }
.s134 { margin: 0px; font: 400 16px / 1.65 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s135 { margin-top: 40px; }
.s136 { display: inline-flex; align-items: center; gap: 10px; font: 600 16px 'Hanken Grotesk'; color: rgb(255, 255, 255); background: rgb(11, 31, 42); padding: 16px 30px; border-radius: 14px; text-decoration: none; box-shadow: rgba(11, 31, 42, 0.18) 0px 14px 28px; }
.s137 { display: inline-flex; align-items: center; gap: 10px; margin-top: 34px; font: 600 16px 'Hanken Grotesk'; color: rgb(7, 23, 31); background: rgb(255, 255, 255); padding: 16px 30px; border-radius: 100px; text-decoration: none; box-shadow: rgba(0, 0, 0, 0.3) 0px 14px 34px; }
.s138 { display: grid; grid-template-columns: 300px 1fr; gap: clamp(40px, 5vw, 72px); align-items: start; }
.s139 { position: sticky; top: 100px; }
.s140 { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.s141 { width: 10px; height: 10px; border-radius: 50%; background: rgb(95, 185, 138); box-shadow: rgba(95, 185, 138, 0.18) 0px 0px 0px 4px; }
.s142 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(61, 122, 91); }
.s143 { margin: 0px 0px 24px; font: 400 16px / 1.6 'Hanken Grotesk'; color: rgb(70, 85, 92); }
.s144 { padding: 22px; background: rgb(245, 246, 243); border-radius: 18px; border-left: 3px solid rgb(61, 122, 91); }
.s145 { font: 700 15px 'Hanken Grotesk'; color: rgb(11, 31, 42); margin-bottom: 6px; }
.s146 { margin: 0px; font: 400 14px / 1.55 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s147 { margin-bottom: 44px; }
.s148 { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.s149 { font: 700 13px 'Hanken Grotesk'; letter-spacing: 0.1em; text-transform: uppercase; color: rgb(122, 138, 144); }
.s150 { flex: 1 1 0%; height: 1px; background: rgb(230, 233, 227); }
.s151 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 22px; padding: clamp(26px, 3vw, 38px); }
.s152 { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.s153 { margin: 0px; font: 700 clamp(22px, 2.6vw, 28px) 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s154 { display: inline-flex; align-items: center; gap: 7px; font: 700 11px 'Hanken Grotesk'; letter-spacing: 0.04em; text-transform: uppercase; color: rgb(61, 122, 91); background: rgb(234, 244, 238); padding: 7px 14px; border-radius: 100px; white-space: nowrap; }
.s155 { font: 600 16px 'Hanken Grotesk'; color: rgb(29, 138, 166); margin-bottom: 14px; }
.s156 { margin: 0px; max-width: 720px; font: 400 16px / 1.65 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s157 { margin-bottom: 0px; }
.s158 { display: inline-flex; align-items: center; gap: 8px; font: 600 15px 'Hanken Grotesk'; color: rgb(11, 31, 42); text-decoration: none; }
.s159 { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.s160 { font: 700 13px 'Hanken Grotesk'; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(46, 125, 143); }
.s161 { padding: 22px; background: rgb(245, 246, 243); border-radius: 18px; border-left: 3px solid rgb(0, 176, 240); }
.s162 { margin: 14px 0px 12px; font: 700 clamp(20px, 2.4vw, 26px) 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s163 { margin: 26px 0px 0px; max-width: 620px; font: 400 clamp(17px, 2vw, 20px) / 1.55 'Hanken Grotesk'; color: rgb(196, 208, 210); }
.s164 { margin-bottom: 48px; }
.s165 { margin: 0px; font: 700 clamp(20px, 2.4vw, 26px) 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s166 { margin: 0px; max-width: 840px; font: 400 16px / 1.65 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s167 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.s168 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 20px; padding: clamp(26px, 3vw, 34px); }
.s169 { font: 700 11px 'Hanken Grotesk'; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(61, 122, 91); }
.s170 { margin: 12px 0px 10px; font: 700 20px 'Hanken Grotesk'; letter-spacing: -0.01em; color: rgb(11, 31, 42); }
.s171 { margin: 0px 0px 12px; font: 700 clamp(20px, 2.4vw, 26px) 'Hanken Grotesk'; letter-spacing: -0.02em; color: rgb(11, 31, 42); }
.s172 { margin: 0px 0px 22px; max-width: 760px; font: 400 16px / 1.65 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s173 { display: flex; flex-wrap: wrap; gap: 10px; }
.s174 { font: 600 14px 'Hanken Grotesk'; color: rgb(11, 31, 42); background: rgb(238, 241, 236); padding: 9px 16px; border-radius: 100px; }
.s175 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
.s176 { padding: 22px; background: rgb(245, 246, 243); border-radius: 18px; }
.s177 { font: 700 34px / 1 'Hanken Grotesk'; color: rgb(11, 31, 42); letter-spacing: -0.03em; }
.s178 { margin-top: 6px; font: 500 13px 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s179 { padding: 22px; background: rgb(11, 31, 42); border-radius: 18px; }
.s180 { font: 700 13px 'Hanken Grotesk'; letter-spacing: 0.1em; text-transform: uppercase; color: rgb(127, 214, 192); margin-bottom: 8px; }
.s181 { margin: 0px; font: 400 14px / 1.55 'Hanken Grotesk'; color: rgb(185, 198, 201); }
.s182 { margin-top: 14px; font: 500 12.5px 'Hanken Grotesk'; color: rgb(138, 148, 154); }
.s183 { text-align: right; }
.s184 { overflow-x: auto; }
.s185 { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; }
.s186 { position: relative; overflow: hidden; background: rgb(7, 23, 31); padding: 150px 0px clamp(64px, 8vw, 96px); }
.s187 { margin: 0px; font: 600 clamp(40px, 6vw, 72px) / 1.02 'Hanken Grotesk'; letter-spacing: -0.035em; color: rgb(255, 255, 255); }
.s188 { margin: 24px 0px 0px; max-width: 560px; font: 400 clamp(16px, 1.9vw, 19px) / 1.55 'Hanken Grotesk'; color: rgb(196, 208, 210); }
.s189 { background: rgb(255, 255, 255); padding: clamp(64px, 8vw, 110px) 0px; }
.s190 { display: grid; grid-template-columns: 340px 1fr; gap: clamp(40px, 5vw, 72px); align-items: start; }
.s191 { background: rgb(11, 31, 42); border-radius: 22px; padding: clamp(28px, 3.4vw, 38px); position: relative; overflow: hidden; }
.s192 { position: absolute; right: -50px; top: -50px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, rgba(146, 208, 80, 0.18), transparent 70%); }
.s193 { position: relative; }
.s194 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(127, 214, 192); }
.s195 { margin: 16px 0px 0px; font: 500 18px / 1.7 'Hanken Grotesk'; color: rgb(255, 255, 255); }
.s196 { display: flex; flex-direction: column; gap: 18px; }
.s197 { background: rgb(251, 252, 251); border: 1px solid rgb(236, 239, 233); border-radius: 20px; padding: clamp(26px, 3vw, 36px); }
.s198 { margin: 12px 0px 8px; font: 700 19px 'Hanken Grotesk'; color: rgb(11, 31, 42); }
.s199 { margin: 0px; font: 400 16px / 1.6 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s200 { margin: 14px 0px 0px; font: 400 16px / 1.8 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s201 { margin: 14px 0px 0px; font: 400 16px / 1.7 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s202 { color: rgb(11, 31, 42); }
.s203 { background: rgb(245, 246, 243); border-radius: 22px; padding: clamp(26px, 3vw, 34px); }
.s204 { font: 700 12px 'Hanken Grotesk'; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(46, 125, 143); }
.s205 { margin: 14px 0px 18px; font: 600 18px 'Hanken Grotesk'; color: rgb(29, 138, 166); }
.s206 { font: 600 14px 'Hanken Grotesk'; color: rgb(255, 255, 255); background: rgb(11, 31, 42); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding: 13px 22px; border-radius: 12px; cursor: pointer; }
.s207 { margin: 12px 0px 10px; font: 700 21px 'Hanken Grotesk'; letter-spacing: -0.01em; color: rgb(11, 31, 42); }
.s208 { margin: 0px 0px 10px; font: 400 16px / 1.65 'Hanken Grotesk'; color: rgb(86, 101, 107); }
.s209 { margin: 0px; font: 500 16px / 1.7 'Hanken Grotesk'; color: rgb(11, 31, 42); }