:root {
  --ko-ink: #172b3b;
  --ko-muted: #526675;
  --ko-blue: #245d91;
  --ko-blue-dark: #163f66;
  --ko-orange: #e56835;
  --ko-sand: #f3eee3;
  --ko-cream: #fffdf8;
  --ko-cyan: #cce7e5;
  --ko-line: rgba(23, 43, 59, .18);
}

.ko-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.ko-hero, .ko-signature, .ko-contract, .ko-context { font-family: "Plus Jakarta Sans", system-ui, sans-serif; }

.ko-hero {
  position: relative;
  overflow: hidden;
  padding: 126px 0 76px;
  color: var(--ko-ink);
  background: var(--ko-sand);
  border-bottom: 1px solid var(--ko-line);
}
.ko-hero__rule {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(105deg, transparent 0 60%, rgba(36,93,145,.1) 60% 100%),
    repeating-linear-gradient(90deg, transparent 0 39px, rgba(23,43,59,.04) 40px);
}
.ko-hero__grid { position: relative; display: grid; grid-template-columns: minmax(0,.86fr) minmax(520px,1.14fr); gap: clamp(34px,5vw,76px); align-items: center; }
.ko-breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:36px; color:#60717d; font-size:12px; font-weight:700; }
.ko-breadcrumbs a { color:inherit; text-decoration:none; }
.ko-breadcrumbs a:hover { color:var(--ko-orange); }
.ko-eyebrow { margin:0 0 17px; color:var(--ko-blue); font-size:12px; line-height:1.45; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.ko-hero h1 { max-width:650px; margin:0; color:var(--ko-ink); font-size:clamp(40px,4.2vw,54px); line-height:1.03; letter-spacing:-.045em; font-weight:800; }
.ko-hero__lead { max-width:650px; margin:24px 0 0; color:var(--ko-muted); font-size:17px; line-height:1.72; }
.ko-hero__actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; }
.ko-button { display:inline-flex; min-height:50px; align-items:center; justify-content:center; gap:12px; padding:0 20px; border:1px solid var(--ko-ink); border-radius:4px; font-size:14px; font-weight:800; text-decoration:none; transition:transform .2s ease, background .2s ease, color .2s ease; }
.ko-button:hover { transform:translateY(-2px); }
.ko-button--primary { color:#fff; background:var(--ko-ink); }
.ko-button--primary:hover { border-color:var(--ko-orange); background:var(--ko-orange); }
.ko-button--secondary { color:var(--ko-ink); background:rgba(255,255,255,.48); }
.ko-truth { display:flex; gap:10px; max-width:610px; margin:22px 0 0; color:#687986; font-size:11px; line-height:1.55; }
.ko-truth span { color:var(--ko-orange); }
.ko-hero__visual { margin:0; }
.ko-hero__visual img, .ko-signature__visual img { display:block; width:100%; height:auto; }
.ko-hero__visual figcaption { margin-top:10px; color:#62727d; font-size:11px; line-height:1.4; font-weight:700; text-align:right; }

.ko-signature { padding:98px 0; color:var(--ko-ink); background:var(--ko-cream); }
.ko-signature__grid { display:grid; grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr); gap:clamp(48px,7vw,100px); align-items:center; }
.ko-signature h2, .ko-contract h2, .ko-context h2 { margin:0; font-size:clamp(30px,3.2vw,46px); line-height:1.08; letter-spacing:-.035em; font-weight:800; }
.ko-signature__copy > p:not(.ko-eyebrow) { margin:22px 0 0; color:var(--ko-muted); font-size:16px; line-height:1.72; }
.ko-signature__facts { margin:34px 0 0; }
.ko-signature__facts > div { display:grid; grid-template-columns:126px 1fr; gap:20px; padding:17px 0; border-top:1px solid var(--ko-line); }
.ko-signature__facts dt { color:var(--ko-orange); font-size:11px; line-height:1.45; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.ko-signature__facts dd { margin:0; color:var(--ko-ink); font-size:13px; line-height:1.55; }
.ko-signature__visual { margin:0; padding:16px; border:1px solid var(--ko-line); background:#edf4f5; box-shadow:16px 16px 0 var(--ko-cyan); }

.ko-contract { padding:100px 0 106px; color:var(--ko-ink); background:#fff; border-top:1px solid var(--ko-line); }
.ko-contract__heading { display:grid; grid-template-columns:minmax(0,.9fr) minmax(330px,.62fr); gap:20px 80px; align-items:end; max-width:1080px; }
.ko-contract__heading .ko-eyebrow { grid-column:1 / -1; }
.ko-contract__heading > p:last-child { margin:0; color:var(--ko-muted); font-size:15px; line-height:1.7; }
.ko-contract__rows { margin:56px 0 0; padding:0; border-block:1px solid var(--ko-line); list-style:none; }
.ko-contract__rows li { display:grid; grid-template-columns:170px minmax(230px,.85fr) minmax(0,1.15fr); gap:28px; align-items:center; min-height:116px; padding:24px 30px; border-bottom:1px solid var(--ko-line); }
.ko-contract__rows li:last-child { border-bottom:0; }
.ko-contract__rows li.is-core { color:#fff; background:var(--ko-blue-dark); transform:translateX(18px); width:calc(100% - 18px); }
.ko-contract__rows span { color:var(--ko-orange); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.ko-contract__rows .is-core span { color:#f6a47f; }
.ko-contract__rows strong { font-size:18px; line-height:1.35; font-weight:800; }
.ko-contract__rows p { margin:0; color:var(--ko-muted); font-size:14px; line-height:1.65; }
.ko-contract__rows .is-core p { color:#d8e6ef; }

.ko-context { padding:82px 0; color:var(--ko-ink); background:var(--ko-cyan); }
.ko-context__grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; align-items:start; }
.ko-context__copy { padding-left:30px; border-left:3px solid var(--ko-blue); }
.ko-context__copy p { margin:0; color:#395464; font-size:15px; line-height:1.76; }
.ko-context__links { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:24px; }
.ko-context__links a { color:var(--ko-ink); font-size:13px; font-weight:800; text-underline-offset:4px; }

#kalkulator { background:#f8fafc; }
#faq { border-top:0 !important; }
#faq h2 { font-size:clamp(30px,4vw,46px) !important; line-height:1.1 !important; }

@media (max-width:1000px) {
  .ko-hero__grid { grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr); gap:28px; }
  .ko-contract__heading { gap-inline:40px; }
  .ko-context__grid { gap:52px; }
}

@media (max-width:780px) {
  .ko-shell { width:min(100% - 32px,640px); }
  .ko-hero { padding:104px 0 52px; }
  .ko-hero__grid, .ko-signature__grid, .ko-context__grid { grid-template-columns:1fr; }
  .ko-breadcrumbs { margin-bottom:28px; }
  .ko-hero h1 { max-width:560px; font-size:clamp(36px,10.4vw,42px); }
  .ko-hero__lead { font-size:16px; line-height:1.66; }
  .ko-hero__visual { margin-top:10px; }
  .ko-hero__visual figcaption { text-align:left; }
  .ko-signature { padding:72px 0 82px; }
  .ko-signature__grid { gap:42px; }
  .ko-signature h2, .ko-contract h2, .ko-context h2 { font-size:clamp(29px,8.5vw,38px); }
  .ko-signature__visual { padding:10px; box-shadow:10px 10px 0 var(--ko-cyan); }
  .ko-contract { padding:76px 0; }
  .ko-contract__heading { display:block; }
  .ko-contract__heading > p:last-child { margin-top:18px; }
  .ko-contract__rows { margin-top:38px; }
  .ko-contract__rows li, .ko-contract__rows li.is-core { grid-template-columns:1fr; gap:9px; width:100%; min-height:0; padding:25px 22px; transform:none; }
  .ko-contract__rows strong { font-size:17px; }
  .ko-context { padding:68px 0; }
  .ko-context__grid { gap:32px; }
  .ko-context__copy { padding:26px 0 0; border-top:3px solid var(--ko-blue); border-left:0; }
}

@media (max-width:430px) {
  .ko-shell { width:calc(100% - 28px); }
  .ko-hero__actions { display:grid; }
  .ko-button { width:100%; }
  .ko-signature__facts > div { grid-template-columns:1fr; gap:7px; }
}

@media (prefers-reduced-motion:reduce) { .ko-button { transition:none; } }