:root { --ink:#052736; --ink-soft:#244858; --blue:#2e86c1; --sky:#eaf3fa; --line:#dce7ed; --paper:#fff; --mist:#f5f8fa; --green:#16875e; --amber:#bc7911; --red:#cf4a5f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:88px; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.55; }
a { color:inherit; text-decoration:none; }
.container { width:min(1120px,calc(100% - 48px)); margin:auto; }
.eyebrow { margin:0 0 15px; color:var(--blue); font:600 12px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.15em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:850px; margin-bottom:22px; font-size:clamp(44px,6vw,72px); line-height:1.03; letter-spacing:-.055em; }
h2 { max-width:760px; margin-bottom:18px; font-size:clamp(31px,4vw,48px); line-height:1.1; letter-spacing:-.04em; }
h3 { margin-bottom:9px; font-size:19px; letter-spacing:-.022em; }
.lead { max-width:720px; color:var(--ink-soft); font-size:clamp(17px,2vw,20px); line-height:1.65; }
.section { padding:clamp(76px,10vw,126px) 0; }
.section-tint { background:var(--mist); }
.section-dark { color:#fff; background:var(--ink); }
.section-dark .lead { color:#c6d8e1; }
.section-dark .eyebrow { color:#7cc2eb; }
.nav { position:sticky; top:0; z-index:10; border-bottom:1px solid rgba(220,231,237,.9); background:rgba(255,255,255,.94); backdrop-filter:blur(14px); }
.nav-inner { display:flex; min-height:72px; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:10px; font-size:18px; font-weight:800; letter-spacing:-.03em; }
.brand-mark { display:grid; width:33px; height:33px; place-items:center; border-radius:10px; background:linear-gradient(135deg,var(--blue),#0c5074); }
.brand-mark svg { width:20px; }
.nav-links { display:flex; align-items:center; gap:24px; color:#365968; font-size:14px; font-weight:650; }
.nav-links a:hover,.nav-links a[aria-current="page"] { color:var(--blue); }
.nav-cta,.button { display:inline-flex; min-height:47px; padding:0 20px; align-items:center; justify-content:center; border:1px solid transparent; border-radius:10px; background:var(--blue); color:#fff; font-size:15px; font-weight:750; transition:.2s ease; }
.nav-cta:hover,.button:hover { background:#126a9e; transform:translateY(-1px); }
.button.secondary { border-color:#bcd4e2; background:#fff; color:#17597e; }
.button.secondary:hover { border-color:var(--blue); background:var(--sky); }
.page-hero { padding:clamp(82px,10vw,132px) 0 clamp(68px,8vw,104px); background:linear-gradient(145deg,#fff 30%,#f0f7fb); }
.page-hero .lead { max-width:780px; }
.page-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.page-marker { display:inline-flex; margin-bottom:30px; align-items:center; gap:9px; color:#64808d; font-size:13px; font-weight:700; }
.page-marker::before { width:28px; height:1px; background:#9dc8df; content:""; }
.scenario { display:grid; grid-template-columns:1.3fr .55fr .55fr; gap:1px; margin:42px 0; overflow:hidden; border:1px solid var(--line); border-radius:17px; background:var(--line); }
.scenario > div { min-height:130px; padding:24px; background:#fff; }
.scenario .role { display:block; margin-bottom:9px; color:var(--blue); font:700 11px/1.1 ui-monospace,monospace; letter-spacing:.13em; text-transform:uppercase; }
.scenario p { margin:0; font-size:18px; font-weight:680; line-height:1.35; letter-spacing:-.02em; }
.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:38px; }
.card { padding:27px 25px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.card p { margin-bottom:0; color:#51707e; font-size:15px; }
.number { margin-bottom:27px; color:var(--blue); font:700 12px/1 ui-monospace,monospace; letter-spacing:.1em; }
.solution-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:38px; }
.solution { display:flex; gap:16px; padding:21px; border-radius:14px; background:rgba(255,255,255,.08); }
.solution-icon { display:grid; flex:none; width:35px; height:35px; place-items:center; border-radius:9px; background:rgba(113,197,235,.18); color:#8ed0f0; font-size:16px; font-weight:800; }
.solution h3 { margin:0 0 5px; font-size:17px; }
.solution p { margin:0; color:#c6d8e1; font-size:14.5px; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:44px; }
.step { padding-right:22px; }
.step-num { display:grid; width:35px; height:35px; margin-bottom:19px; place-items:center; border-radius:50%; background:var(--sky); color:#176696; font-size:13px; font-weight:800; }
.step p { color:#51707e; font-size:14.5px; }
.module-layout { display:grid; grid-template-columns:.74fr 1.26fr; gap:55px; align-items:start; }
.module-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.module { min-height:162px; padding:21px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.module p { margin:0; color:#52707e; font-size:14px; }
.module-sign { color:var(--blue); font-size:20px; }
.module-page-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:40px; }
.module-overview { display:flex; min-height:220px; padding:25px; flex-direction:column; border:1px solid var(--line); border-radius:15px; background:#fff; }
.module-overview:hover { border-color:#9dc8df; background:var(--sky); transform:translateY(-2px); }
.module-overview:focus-visible { outline:3px solid rgba(46,134,193,.28); outline-offset:3px; }
.module-overview .module-sign { margin-bottom:28px; }
.module-overview p { margin-bottom:22px; color:#52707e; font-size:14.5px; }
.module-link { margin-top:auto; color:var(--blue); font-size:13px; font-weight:750; }
.product-showcase-head { display:flex; align-items:end; justify-content:space-between; gap:48px; }
.product-showcase-head .lead { max-width:510px; margin-bottom:4px; }
.product-views { margin-top:52px; }
.module-view { width:100%; scroll-margin-top:96px; }
.module-view + .module-view { margin-top:clamp(76px,9vw,112px); padding-top:clamp(68px,8vw,96px); border-top:1px solid var(--line); }
.module-view-head { display:grid; grid-template-columns:.9fr 1.1fr; align-items:end; gap:46px; margin-bottom:28px; }
.module-view-head h2 { margin-bottom:0; font-size:clamp(30px,3.5vw,42px); }
.module-view-head .lead { margin-bottom:2px; font-size:17px; line-height:1.65; }
.app-frame { min-width:0; overflow:hidden; border:1px solid #cbdce5; border-radius:17px; background:#fff; box-shadow:0 28px 58px -40px rgba(5,39,54,.58); }
.app-frame-bar { display:flex; min-height:58px; padding:0 18px; align-items:center; justify-content:space-between; gap:18px; background:var(--ink); color:#fff; }
.app-frame-bar strong { font-size:14px; letter-spacing:-.01em; }
.app-frame-bar span { padding:5px 9px; border-radius:99px; background:rgba(255,255,255,.12); color:#cce3ef; font-size:10px; font-weight:750; }
.area-view { padding:13px; background:#f2f4f6; }
.area-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 16px; border:1px solid #e1e6e9; border-radius:9px; background:#fff; }
.ui-label { margin-bottom:4px; color:#94a3ad; font:700 9px/1 ui-monospace,monospace; letter-spacing:.1em; text-transform:uppercase; }
.area-head strong { font-size:16px; }
.area-total { flex:none; text-align:right; }
.area-total b { font-size:19px; }
.area-stations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px; }
.area-station { min-width:0; padding:12px; border:1px solid #e2e7ea; border-radius:8px; background:#fff; }
.area-station strong { display:block; margin-bottom:9px; font-size:14px; }
.bed-number { padding:12px 5px; border-radius:7px; text-align:center; font-size:22px; font-weight:800; line-height:1; }
.bed-number small { display:block; margin-top:5px; font-size:9px; font-weight:650; }
.good { color:#078561; background:rgba(16,185,129,.14); }
.warn { color:#b86d02; background:rgba(245,158,11,.15); }
.risk { color:#c73645; background:rgba(239,68,68,.13); }
.area-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:8px; padding:13px 16px; border-radius:8px; background:#4b5964; color:#fff; }
.area-summary .ui-label { color:#becbd2; }
.area-summary strong { font-size:15px; }
.station-view { padding:15px; background:#f7fafc; }
.station-table-wrap { overflow-x:auto; border:1px solid #e1e7ea; border-radius:9px; background:#fff; scrollbar-color:#8f979c #e8ecee; scrollbar-width:thin; }
.station-table { width:100%; min-width:650px; border-collapse:collapse; color:#374151; font-size:10px; }
.station-table th,.station-table td { padding:8px 9px; border-bottom:1px solid #f0f3f4; text-align:center; white-space:nowrap; }
.station-table th:first-child,.station-table td:first-child { text-align:left; }
.station-table thead tr:first-child th { padding-top:10px; padding-bottom:4px; font-size:9px; }
.station-table thead tr:nth-child(2) th { padding-top:4px; color:#687984; font:700 8px/1 ui-monospace,monospace; letter-spacing:.05em; }
.station-table .male { color:#2563eb; background:#eff6ff; }
.station-table .female { color:#db2777; background:#fdf2f8; }
.station-table .divider { border-left:2px solid #d6dee2; }
.station-table .aggregate td { border-top:1px solid #dfe6e9; background:#f8fafb; color:#111827; font-weight:750; }
.station-table .station-row td:first-child { padding-left:22px; }
.station-table .total td { border-bottom:0; background:#4b5964; color:#f8fafc; font-weight:750; }
.table-pill { display:inline-block; min-width:29px; padding:3px 7px; border-radius:5px; font-weight:800; }
.station-table .total .table-pill { background:rgba(255,255,255,.15); color:#fff; }
.module-placeholder { min-height:360px; padding:30px; background:#f2f4f6; }
.placeholder-window { width:min(100%,720px); margin:auto; overflow:hidden; border:1px solid #dce5ea; border-radius:12px; background:#fff; }
.placeholder-window-head { display:flex; align-items:center; justify-content:space-between; padding:15px 17px; border-bottom:1px solid #e6edf1; }
.placeholder-window-head::before { width:34%; height:9px; border-radius:20px; background:#dce7ed; content:""; }
.placeholder-window-head::after { width:70px; height:23px; border-radius:20px; background:var(--sky); content:""; }
.placeholder-window-body { display:grid; grid-template-columns:1.15fr .85fr; gap:12px; padding:16px; }
.placeholder-panel { min-height:185px; padding:15px; border:1px solid #e3ebef; border-radius:9px; background:#f9fbfc; }
.placeholder-line { display:block; width:82%; height:9px; margin-bottom:12px; border-radius:20px; background:#dce7ed; }
.placeholder-line.short { width:54%; }
.placeholder-tile-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; margin-top:22px; }
.placeholder-tile { height:55px; border-radius:8px; background:#eaf3fa; }
.placeholder-status { margin:22px 0 0; color:#64808d; font:700 11px/1 ui-monospace,monospace; letter-spacing:.09em; text-align:center; text-transform:uppercase; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.position-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:38px; }
.position { padding:22px 18px; border-top:2px solid #8fc9e7; background:#f5f9fb; }
.position p { margin:0; color:#4d6e7d; font-size:14px; }
.implementation { display:grid; grid-template-columns:.85fr 1.15fr; gap:58px; align-items:start; }
.check-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px 22px; margin:30px 0 26px; padding:0; list-style:none; }
.check-list li { display:flex; gap:9px; color:#365968; font-size:15px; }
.check-list li::before { flex:none; color:var(--blue); content:"✓"; font-weight:800; }
.intro-panel { padding:29px; border-radius:17px; background:var(--sky); }
.intro-panel h3 { font-size:22px; }
.intro-panel p { margin-bottom:0; color:#416576; }
.intro-panel-white { border:1px solid var(--line); background:#fff; }
.consulting-card { padding:32px; border:1px solid #cfe1ea; border-radius:17px; background:linear-gradient(145deg,var(--sky),#f7fbfd); }
.consulting-card h3 { max-width:440px; margin-bottom:14px; font-size:clamp(25px,3vw,32px); line-height:1.15; }
.consulting-card > p:not(.eyebrow) { color:#416576; }
.consulting-card .button { margin-top:10px; }
.effect-grid { display:grid; grid-template-columns:repeat(2,1fr); margin-top:37px; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.effect { padding:19px 22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); color:#335b6d; font-weight:650; }
.effect::before { margin-right:10px; color:var(--blue); content:"+"; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:38px; }
.feature { padding:22px; border:1px solid rgba(185,220,237,.2); border-radius:14px; background:rgba(255,255,255,.04); }
.feature span { display:block; margin-bottom:9px; color:#8ed0f0; font-size:19px; }
.feature p { margin:0; color:#c6d8e1; font-size:14.5px; }
.team-story { display:grid; grid-template-columns:.9fr 1.1fr; gap:58px; align-items:start; }
.partner-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:42px; }
.partner { display:flex; min-height:205px; padding:22px; flex-direction:column; border:1px solid var(--line); border-radius:14px; background:#f7fafc; transition:.2s ease; }
.partner:hover { border-color:#a9cada; background:var(--sky); transform:translateY(-2px); }
.partner-num { margin-bottom:18px; color:var(--blue); font:700 11px/1 ui-monospace,monospace; letter-spacing:.1em; }
.partner-logo { display:flex; min-height:62px; align-items:center; }
.partner-logo img { display:block; width:auto; max-width:190px; height:auto; max-height:54px; }
.partner-logo img.logo-hinderling { max-height:47px; }
.partner-logo img.logo-megazord { max-height:34px; }
.partner strong { margin-top:20px; font-size:18px; letter-spacing:-.025em; }
.partner small { margin-top:3px; color:#587585; font-size:12px; font-weight:650; }
.pilot-section { padding:clamp(70px,8vw,100px) 0; background:var(--mist); }
.pilot-card { display:grid; grid-template-columns:.72fr 1.28fr; overflow:hidden; border:1px solid var(--line); border-radius:19px; background:#fff; box-shadow:0 28px 58px -46px rgba(5,39,54,.5); }
.pilot-brand { display:flex; min-height:310px; padding:35px; align-items:center; justify-content:center; flex-direction:column; border-right:1px solid var(--line); background:linear-gradient(145deg,#f7fbfd,var(--sky)); text-align:center; }
.pilot-brand img { display:block; width:min(100%,250px); height:auto; }
.status-chip { display:inline-flex; margin-top:24px; padding:7px 11px; align-items:center; gap:8px; border-radius:99px; background:#fff; color:#376171; font-size:12px; font-weight:750; }
.status-chip::before { width:8px; height:8px; border-radius:50%; background:#38a87b; content:""; }
.pilot-copy { display:flex; padding:38px 42px; justify-content:center; flex-direction:column; }
.pilot-copy h2 { margin-bottom:17px; font-size:clamp(30px,4vw,45px); }
.pilot-copy .lead { margin-bottom:19px; }
.pilot-statement { margin-bottom:23px; padding-left:18px; border-left:3px solid #8fc9e7; color:#31596b; font-size:18px; font-weight:720; line-height:1.5; }
.text-link { color:var(--blue); font-size:14px; font-weight:780; }
.text-link:hover { color:#155f8d; }
.reference-hero { display:grid; grid-template-columns:1.12fr .88fr; align-items:center; gap:64px; }
.reference-hero-logo { display:flex; min-height:285px; padding:30px; align-items:center; justify-content:center; flex-direction:column; border:1px solid #cfe0e8; border-radius:18px; background:#fff; box-shadow:0 28px 58px -42px rgba(5,39,54,.52); text-align:center; }
.reference-hero-logo img { display:block; width:min(100%,250px); height:auto; }
.reference-case-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:start; gap:68px; }
.reference-facts { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#fff; }
.reference-fact { display:grid; grid-template-columns:105px 1fr; gap:18px; padding:21px 23px; border-bottom:1px solid var(--line); }
.reference-fact:last-child { border-bottom:0; }
.reference-fact span { color:var(--blue); font:700 10px/1.4 ui-monospace,monospace; letter-spacing:.1em; text-transform:uppercase; }
.reference-fact strong { font-size:15px; line-height:1.45; }
.co-create-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:42px; }
.co-create-step { padding:24px 21px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.co-create-num { display:block; margin-bottom:28px; color:var(--blue); font:700 11px/1 ui-monospace,monospace; letter-spacing:.12em; }
.co-create-step p { margin-bottom:0; color:#52707e; font-size:14px; }
.roadmap { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:42px; overflow:hidden; border:1px solid rgba(185,220,237,.22); border-radius:16px; background:rgba(185,220,237,.22); }
.roadmap-item { min-height:190px; padding:27px 25px; background:rgba(255,255,255,.05); }
.roadmap-item span { display:block; margin-bottom:28px; color:#7cc2eb; font:700 11px/1 ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase; }
.roadmap-item h3 { color:#fff; }
.roadmap-item p { margin-bottom:0; color:#c6d8e1; font-size:14.5px; }
.team-heading { margin-top:76px; }
.team-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:38px; }
.team-member { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; }
.team-photo { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; background:#dfe5e8; }
.team-photo.julian { object-position:35% center; }
.team-member-body { padding:18px 17px 20px; }
.team-role { display:block; min-height:28px; margin-bottom:9px; color:var(--blue); font:700 10px/1.35 ui-monospace,monospace; letter-spacing:.08em; text-transform:uppercase; }
.team-member h3 { margin-bottom:8px; font-size:22px; }
.team-member p { margin:0; color:#52707e; font-size:13.5px; }
.pricing { display:grid; grid-template-columns:1fr .9fr; gap:55px; align-items:center; }
.price-factors { display:grid; grid-template-columns:repeat(2,1fr); gap:11px; padding:25px; border-radius:16px; background:var(--mist); }
.price-factors span { padding:12px; border-radius:8px; background:#fff; color:#416373; font-size:14px; font-weight:620; }
.faq { max-width:800px; margin:40px auto 0; }
details { border-bottom:1px solid var(--line); }
summary { display:flex; padding:20px 2px; align-items:center; justify-content:space-between; gap:20px; cursor:pointer; font-weight:750; list-style:none; }
summary::-webkit-details-marker { display:none; }
summary::after { flex:none; color:var(--blue); content:"+"; font-size:25px; font-weight:400; }
details[open] summary::after { content:"−"; }
details p { max-width:690px; margin:0; padding:0 2px 21px; color:#52707e; }
.contact { background:linear-gradient(135deg,#062b3d,#074663); color:#fff; }
.contact-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:65px; align-items:start; }
.contact h2 { color:#fff; }
.contact .lead { color:#c4dbe6; }
.contact-cta { padding:31px; border-radius:17px; background:#fff; color:var(--ink); box-shadow:0 24px 55px -36px rgba(0,0,0,.65); }
.contact-icon { display:grid; width:46px; height:46px; margin-bottom:24px; place-items:center; border-radius:12px; background:var(--sky); color:var(--blue); }
.contact-icon svg { width:23px; }
.contact-cta h3 { margin-bottom:9px; font-size:24px; }
.contact-cta p { margin-bottom:20px; color:#52707e; }
.contact-email { display:block; width:max-content; max-width:100%; margin-bottom:22px; color:var(--blue); font-size:clamp(20px,2.4vw,28px); font-weight:800; letter-spacing:-.025em; overflow-wrap:anywhere; }
.next-page { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.next-page h2 { margin-bottom:0; }
.footer { padding:28px 0; background:#041d29; color:#9cb5c1; font-size:13px; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.footer-links { display:flex; flex-wrap:wrap; gap:20px; }
.footer a:hover { color:#fff; }
@media (max-width:900px) {
  .nav-links { display:none; }
  .module-layout,.implementation,.team-story,.pricing,.contact-grid,.reference-hero,.reference-case-grid { grid-template-columns:1fr; }
  .problem-grid { grid-template-columns:1fr; }
  .steps,.feature-grid { grid-template-columns:repeat(2,1fr); }
  .position-grid { grid-template-columns:repeat(2,1fr); }
  .team-grid { grid-template-columns:repeat(3,1fr); }
  .co-create-grid { grid-template-columns:repeat(2,1fr); }
  .module-page-grid { grid-template-columns:repeat(2,1fr); }
  .product-showcase-head { align-items:flex-start; flex-direction:column; gap:0; }
  .module-view-head { grid-template-columns:1fr; align-items:start; gap:4px; }
}
@media (max-width:620px) {
  .container { width:min(100% - 32px,1120px); }
  .nav-inner { min-height:64px; }
  .nav-cta { min-height:39px; padding:0 12px; font-size:13px; }
  .page-hero { padding-top:64px; }
  h1 { font-size:clamp(38px,11vw,46px); hyphens:auto; overflow-wrap:break-word; }
  .scenario,.solution-grid,.module-list,.module-page-grid,.feature-grid,.effect-grid,.price-factors,.partner-grid,.team-grid,.pilot-card,.co-create-grid,.roadmap { grid-template-columns:1fr; }
  .pilot-brand { min-height:245px; border-right:0; border-bottom:1px solid var(--line); }
  .pilot-copy { padding:30px 25px; }
  .reference-fact { grid-template-columns:1fr; gap:7px; }
  .scenario > div { min-height:auto; }
  .steps,.position-grid,.check-list { grid-template-columns:1fr; }
  .module-placeholder { min-height:300px; padding:16px; }
  .placeholder-window-body { grid-template-columns:1fr; }
  .placeholder-panel:last-child { display:none; }
  .next-page,.footer-inner { align-items:flex-start; flex-direction:column; }
}
