.snelstart-page {
  --ss-green: #2f3d32;
  --ss-green-soft: #43533f;
  --ss-green-light: #73816d;
  --ss-gold: #d1a35a;
  --ss-gold-light: #edcf98;
  --ss-rose: #a64b69;
  --ss-rose-dark: #81364f;
  --ss-orange: #b85c2e;
  --ss-orange-soft: #fff0e5;
  --ss-ivory: #fbf7ef;
  --ss-line: rgba(164, 126, 67, .28);
  background:
    radial-gradient(circle at 7% 3%, rgba(184, 92, 46, .12), transparent 29rem),
    radial-gradient(circle at 94% 7%, rgba(98, 102, 59, .13), transparent 32rem),
    linear-gradient(180deg, #fcfaf6, #f8f1e7 52%, #fbf8f3);
}

.snelstart-page main { overflow: hidden; }
.ss-container { width: min(1240px, calc(100% - 56px)); margin-inline: auto; }
.snelstart-page .eyebrow { color: var(--ss-rose-dark); }
.snelstart-page .public-header { position: relative; z-index: 5; }

/* Hero */
.ss-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.23fr) minmax(350px, .77fr);
  align-items: center;
  gap: clamp(54px, 8vw, 108px);
  min-height: 735px;
  padding: 76px 0 100px;
}
.ss-hero::before {
  position: absolute;
  top: 18px;
  right: -185px;
  z-index: -1;
  width: 560px;
  height: 560px;
  border: 1px solid rgba(184, 92, 46, .12);
  border-radius: 50%;
  box-shadow: 0 0 0 75px rgba(209, 163, 90, .025), 0 0 0 150px rgba(166, 75, 105, .018);
  content: "";
}
.ss-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-bottom: 30px; color: #8b8177; font-size: 11px; }
.ss-breadcrumb a { transition: color .2s ease; }
.ss-breadcrumb a:hover { color: var(--ss-rose-dark); }
.ss-breadcrumb strong { color: var(--ss-orange); }
.ss-partner-lockup {
  --partner-accent: var(--ss-orange);
  --partner-logo-height: 20px;
  display: flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: 10px;
}
.ss-partner-logo {
  box-sizing: border-box;
  display: grid;
  width: 136px;
  height: 48px;
  place-items: center;
  padding: 8px 12px 8px 11px;
  border: 1px solid rgba(164, 126, 67, .28);
  border-left: 3px solid var(--partner-accent);
  border-radius: 14px;
  background: rgba(255, 253, 249, .9);
  box-shadow: 0 11px 28px rgba(57, 43, 31, .08);
}
.ss-partner-logo img {
  display: block;
  width: auto;
  height: var(--partner-logo-height);
  max-width: 112px;
  max-height: 29px;
  object-fit: contain;
}
.ss-partner-product { color: #4d4a45; font-size: 7px; font-weight: 900; letter-spacing: 1.35px; line-height: 1; text-transform: uppercase; }
.ss-partner-cross { color: #c49349; font: 500 18px/1 Georgia, "Times New Roman", serif; }
.ss-partner-more { color: #475546; font-size: 11px; font-weight: 900; letter-spacing: 1.35px; white-space: nowrap; }
.ss-partner-snelstart { --partner-accent: #465842; }
.ss-partner-nmbrs { --partner-accent: #b1843e; --partner-logo-height: 29px; }
.ss-partner-horeko { --partner-accent: #697d4b; --partner-logo-height: 16px; }
.ss-partner-horeko .ss-partner-logo { grid-template-rows: auto auto; align-content: center; gap: 3px; }
.ss-partner-horeko .ss-partner-product { color: #46562f; }
.ss-partner-dish { --partner-accent: #b74b46; --partner-logo-height: 25px; }
.ss-hero h1 {
  max-width: 860px;
  margin: 20px 0 28px;
  color: #28251f;
  font: 500 clamp(50px, 5.45vw, 78px)/.99 Georgia, "Times New Roman", serif;
  letter-spacing: -3.25px;
}
.ss-hero h1 em { color: var(--ss-green-soft); font-style: italic; }
.ss-hero-lead { max-width: 760px; margin: 0; color: #6e665d; font-size: clamp(16px, 1.35vw, 19px); line-height: 1.75; }
.ss-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 34px; }
.ss-button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 13px;
  font-size: 12px;
  font-weight: 850;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ss-button:hover { transform: translateY(-2px); }
.ss-button span { font-size: 18px; }
.ss-button-primary { border-color: #7f334d; background: linear-gradient(135deg, #ae526f, #81364f); color: #fff; box-shadow: 0 13px 29px rgba(129, 54, 79, .23); }
.ss-button-secondary { border-color: #bda885; background: rgba(255, 253, 249, .7); color: #425044; }
.ss-assurances { display: flex; flex-wrap: wrap; gap: 9px; margin: 31px 0 0; padding: 0; list-style: none; }
.ss-assurances li { display: inline-flex; min-height: 39px; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid rgba(188, 163, 125, .55); border-radius: 999px; background: rgba(255, 255, 255, .48); color: #625a52; font-size: 11px; font-weight: 750; }
.ss-assurances b { color: var(--ss-orange); font-size: 9px; letter-spacing: .8px; }

.ss-control-card {
  position: relative;
  overflow: hidden;
  padding: 28px;
  border: 1px solid rgba(236, 199, 134, .3);
  border-radius: 29px;
  background: radial-gradient(circle at 100% 0, rgba(166, 75, 105, .32), transparent 32%), linear-gradient(145deg, #3d4d40, #28362d 68%, #4f3942 135%);
  color: #fff;
  box-shadow: 0 35px 85px rgba(40, 54, 45, .27);
}
.ss-control-card::before {
  position: absolute;
  right: -140px;
  bottom: -165px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(237, 207, 152, .14);
  border-radius: 50%;
  box-shadow: 0 0 0 45px rgba(237, 207, 152, .028);
  content: "";
}
.ss-control-card > * { position: relative; z-index: 1; }
.ss-control-topline { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.13); color: #d3dacd; font-size: 10.5px; font-weight: 850; letter-spacing: 1.35px; text-transform: uppercase; }
.ss-control-topline b { color: var(--ss-gold-light); }
.ss-control-title { display: flex; align-items: center; gap: 14px; margin: 25px 0 23px; }
.ss-badge { display: grid; width: 52px; height: 52px; place-items: center; flex: 0 0 auto; border-radius: 16px; background: linear-gradient(145deg, #d17849, #a94d27); color: #fff; font-size: 15px; font-weight: 900; box-shadow: 0 12px 26px rgba(15, 24, 18, .24); }
.ss-control-title div { display: grid; gap: 3px; }
.ss-control-title small { color: #edc5d1; font-size: 10px; font-weight: 900; letter-spacing: 1.15px; text-transform: uppercase; }
.ss-control-title strong { font: 500 26px/1.15 Georgia, serif; }
.ss-mini-flow { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ss-mini-flow li { display: grid; grid-template-columns: 33px 1fr; align-items: center; gap: 12px; min-height: 62px; padding: 10px 13px; border: 1px solid rgba(237, 207, 152, .16); border-radius: 15px; background: rgba(255, 255, 255, .065); }
.ss-mini-flow li > span { display: grid; width: 31px; height: 31px; place-items: center; border: 1px solid rgba(237, 207, 152, .34); border-radius: 50%; color: var(--ss-gold-light); font-size: 9px; font-weight: 900; }
.ss-mini-flow div { display: grid; gap: 2px; }
.ss-mini-flow strong { color: #fffdf8; font-size: 12px; }
.ss-mini-flow small { color: #bdc7ba; font-size: 10.5px; }
.ss-control-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.13); color: #d1d8cc; font-size: 10px; }
.ss-control-footer span { display: inline-flex; align-items: center; gap: 7px; }
.ss-control-footer i { width: 7px; height: 7px; border-radius: 50%; background: #83a478; box-shadow: 0 0 0 4px rgba(131, 164, 120, .14); }
.ss-control-footer strong { color: #f0c5d2; }

/* Shared section headings */
.ss-section-heading { max-width: 890px; }
.ss-section-heading h2,
.ss-closing h2,
.ss-safety-copy h2 {
  margin: 13px 0 0;
  color: var(--ss-green);
  font: 500 clamp(40px, 4.4vw, 62px)/1.02 Georgia, "Times New Roman", serif;
  letter-spacing: -2px;
}
.ss-section-heading h2 em,
.ss-closing h2 em,
.ss-safety-copy h2 em { color: var(--ss-rose); font-style: italic; }
.ss-section-heading > p { max-width: 720px; margin: 21px 0 0; color: #6d655c; font-size: 15px; line-height: 1.75; }

/* Role division */
.ss-role-section { padding: 105px 0 128px; border-top: 1px solid var(--ss-line); }
.ss-role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 55px; }
.ss-role-card { position: relative; overflow: hidden; padding: 35px; border: 1px solid var(--ss-line); border-radius: 25px; box-shadow: 0 22px 55px rgba(62, 48, 31, .08); }
.ss-role-card::after { position: absolute; top: -115px; right: -105px; width: 260px; height: 260px; border: 1px solid currentColor; border-radius: 50%; opacity: .08; content: ""; }
.ss-role-card header { position: relative; z-index: 1; display: flex; align-items: center; gap: 17px; padding-bottom: 25px; border-bottom: 1px solid currentColor; }
.ss-role-mark { display: grid; width: 54px; height: 54px; place-items: center; flex: 0 0 auto; border-radius: 17px; font-size: 15px; font-weight: 900; }
.ss-role-card header div { display: grid; gap: 4px; }
.ss-role-card header small { font-size: 10px; font-weight: 900; letter-spacing: 1.6px; }
.ss-role-card h3 { margin: 0; font: 500 31px/1.1 Georgia, serif; }
.ss-role-card ul { position: relative; z-index: 1; display: grid; gap: 0; margin: 25px 0 0; padding: 0; list-style: none; }
.ss-role-card li { display: grid; grid-template-columns: 19px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid currentColor; font-size: 13px; }
.ss-role-card li::before { display: grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; content: "✓"; font-size: 9px; font-weight: 900; }
.ss-role-card > p { position: relative; z-index: 1; margin: 24px 0 0; font-size: 12px; line-height: 1.65; }
.ss-role-snelstart { background: linear-gradient(145deg, #fff8f1, #f8e7d9); color: #70452f; }
.ss-role-snelstart header,
.ss-role-snelstart li { border-color: rgba(137, 72, 39, .16); }
.ss-role-snelstart .ss-role-mark { background: linear-gradient(145deg, #cf7445, #a84a24); color: #fff; }
.ss-role-snelstart header small { color: #a5532c; }
.ss-role-snelstart h3 { color: #603824; }
.ss-role-snelstart li::before { background: rgba(184, 92, 46, .13); color: #a64e25; }
.ss-role-snelstart > p { color: #7f6252; }
.ss-role-more { background: radial-gradient(circle at 100% 0, rgba(166,75,105,.22), transparent 35%), linear-gradient(145deg, #3a493c, #29372e); color: #fff; }
.ss-role-more header,
.ss-role-more li { border-color: rgba(237, 207, 152, .16); }
.ss-role-more .ss-role-mark { background: linear-gradient(145deg, #e0b86f, #c39044); color: #2e3a30; }
.ss-role-more header small { color: #f0bfd0; }
.ss-role-more h3 { color: #fff; }
.ss-role-more li { color: #edf0e8; }
.ss-role-more li::before { background: rgba(223, 183, 111, .16); color: #efc985; }
.ss-role-more > p { color: #cbd3c6; }
.ss-role-summary { display: flex; align-items: center; gap: 19px; margin: 20px 0 0; padding: 21px 26px; border: 1px solid rgba(209, 163, 90, .38); border-left: 4px solid var(--ss-rose); border-radius: 0 18px 18px 0; background: rgba(255, 253, 249, .68); color: #655e56; font-size: 13px; }
.ss-role-summary span { flex: 0 0 auto; color: var(--ss-green); font: 500 19px/1.25 Georgia, serif; }

/* Main flow */
.ss-flow-band { position: relative; overflow: hidden; padding: 120px 0 116px; background: radial-gradient(circle at 88% 8%, rgba(166, 75, 105, .25), transparent 29rem), linear-gradient(145deg, #334337, #233129 72%); color: #fff; }
.ss-flow-band::before { position: absolute; top: -250px; left: -210px; width: 570px; height: 570px; border: 1px solid rgba(237,207,152,.1); border-radius: 50%; box-shadow: 0 0 0 65px rgba(237,207,152,.018), 0 0 0 130px rgba(237,207,152,.012); content: ""; }
.ss-section-heading-light { position: relative; z-index: 1; }
.ss-section-heading-light .eyebrow { color: var(--ss-gold-light); }
.ss-section-heading-light h2 { color: #fffdf7; }
.ss-section-heading-light h2 em { color: #f0bed0; }
.ss-section-heading-light > p { color: #cbd3c6; }
.ss-main-flow { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; margin: 57px 0 0; padding: 0; list-style: none; counter-reset: step; }
.ss-main-flow li { position: relative; display: flex; min-height: 175px; flex-direction: column; justify-content: space-between; gap: 25px; padding: 21px; border: 1px solid rgba(237, 207, 152, .2); border-radius: 19px; background: rgba(255, 255, 255, .065); box-shadow: inset 0 1px rgba(255,255,255,.05); }
.ss-main-flow li::after { position: absolute; top: 50%; right: -21px; z-index: 3; color: var(--ss-gold); content: "→"; font-size: 21px; transform: translateY(-50%); }
.ss-main-flow li:last-child::after { display: none; }
.ss-main-flow b { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(237,207,152,.36); border-radius: 50%; color: var(--ss-gold-light); font-size: 9px; letter-spacing: 1px; }
.ss-main-flow span { color: #f4f5f0; font-size: 13px; font-weight: 750; line-height: 1.55; }
.ss-main-flow .ss-flow-decision { border-color: rgba(240, 185, 205, .36); background: linear-gradient(145deg, rgba(166, 75, 105, .28), rgba(255,255,255,.07)); }
.ss-main-flow .ss-flow-decision b { border-color: rgba(240, 185, 205, .44); color: #f2bfd0; }
.ss-flow-note { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 18px; margin: 25px 0 0; padding: 20px 22px; border-top: 1px solid rgba(237,207,152,.18); color: #bdc8ba; font-size: 11px; line-height: 1.65; }
.ss-flow-note span { flex: 0 0 auto; color: var(--ss-gold-light); font-weight: 850; }

/* HANOS case */
.ss-hanos-section { padding: 124px 0 130px; }
.ss-case-stage { display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); align-items: stretch; gap: 18px; margin-top: 56px; }
.ss-invoice-card,
.ss-analysis-card { position: relative; overflow: hidden; border: 1px solid var(--ss-line); border-radius: 25px; box-shadow: 0 23px 60px rgba(61, 47, 31, .08); }
.ss-invoice-card { padding: 30px; background: linear-gradient(150deg, rgba(255,255,255,.92), #fbf3e8); }
.ss-invoice-card::before { position: absolute; top: 0; right: 30px; left: 30px; height: 4px; border-radius: 0 0 6px 6px; background: var(--ss-orange); content: ""; }
.ss-invoice-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 15px 0 24px; border-bottom: 1px solid #e1d3c1; }
.ss-invoice-head div { display: grid; gap: 3px; }
.ss-invoice-head span { color: var(--ss-orange); font-size: 22px; font-weight: 900; letter-spacing: .6px; }
.ss-invoice-head small { color: #92867a; font-size: 10px; font-weight: 850; letter-spacing: 1.1px; text-transform: uppercase; }
.ss-invoice-head b { color: #413a33; font: 500 27px/1.1 Georgia, serif; white-space: nowrap; }
.ss-invoice-card dl { display: grid; gap: 0; margin: 20px 0 0; }
.ss-invoice-card dl div { display: flex; justify-content: space-between; gap: 15px; padding: 8px 0; color: #756c63; font-size: 11px; }
.ss-invoice-card dt,
.ss-invoice-card dd { margin: 0; }
.ss-invoice-card dd { color: #464039; font-weight: 800; text-align: right; }
.ss-invoice-lines { display: grid; grid-template-columns: 1fr auto; gap: 10px 15px; margin-top: 19px; padding: 18px 0; border-top: 1px dashed #d8c8b5; border-bottom: 1px dashed #d8c8b5; color: #6c645c; font-size: 11px; }
.ss-invoice-lines b { color: #454039; text-align: right; }
.ss-invoice-card footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 20px; color: #6d7568; font-size: 10px; }
.ss-invoice-card footer span { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; }
.ss-invoice-card footer span::before { width: 7px; height: 7px; border-radius: 50%; background: #7e9a74; box-shadow: 0 0 0 4px rgba(126,154,116,.13); content: ""; }
.ss-invoice-card footer strong { color: #9b8e81; font-size: 9px; letter-spacing: .8px; text-transform: uppercase; }
.ss-analysis-card { padding: 31px; border-color: rgba(209, 163, 90, .38); background: radial-gradient(circle at 100% 0, rgba(166,75,105,.16), transparent 32%), linear-gradient(145deg, #37473a, #29372e); color: #fff; }
.ss-analysis-top { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 20px; border-bottom: 1px solid rgba(237,207,152,.17); font-size: 10px; font-weight: 900; letter-spacing: 1.25px; }
.ss-analysis-top > span { color: var(--ss-gold-light); }
.ss-analysis-top strong { display: inline-flex; align-items: center; gap: 8px; color: #cfd8ca; font-size: 10px; letter-spacing: 0; }
.ss-analysis-top i { width: 7px; height: 7px; border-radius: 50%; background: #82a178; box-shadow: 0 0 0 4px rgba(130,161,120,.12); }
.ss-analysis-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 27px; }
.ss-analysis-columns h3 { margin: 0 0 12px; color: #fff; font: 500 23px/1.2 Georgia, serif; }
.ss-analysis-columns ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ss-analysis-columns li { display: grid; grid-template-columns: 17px 1fr; gap: 8px; color: #d1d8ce; font-size: 11px; }
.ss-analysis-columns li::before { color: #e9bd79; content: "✓"; font-weight: 900; }
.ss-proposal-line { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 15px; margin-top: 29px; padding: 17px 18px; border: 1px solid rgba(237,207,152,.2); border-radius: 15px; background: rgba(255,255,255,.075); font-size: 11px; }
.ss-proposal-line span { color: #bfc9bc; }
.ss-proposal-line strong { color: #fff; }
.ss-proposal-line b { padding: 6px 9px; border-radius: 999px; background: rgba(166,75,105,.28); color: #f0c2d0; font-size: 9px; }
.ss-route-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 18px; }
.ss-route-card { display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 27px; border: 1px solid var(--ss-line); border-radius: 21px; }
.ss-route-number { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 50%; font: 500 21px/1 Georgia, serif; }
.ss-route-card div { display: grid; align-content: start; gap: 6px; }
.ss-route-card small { font-size: 10px; font-weight: 900; letter-spacing: 1.35px; }
.ss-route-card h3 { margin: 0; font: 500 23px/1.15 Georgia, serif; }
.ss-route-card p { margin: 6px 0 0; color: #69625b; font-size: 12px; line-height: 1.65; }
.ss-route-safe { border-color: #c9d4c2; background: linear-gradient(145deg, #f6faf4, #eaf1e7); }
.ss-route-safe .ss-route-number { background: #43563f; color: #fff; }
.ss-route-safe small { color: #63745e; }
.ss-route-safe h3 { color: #334231; }
.ss-route-review { border-color: #e0bcc8; background: linear-gradient(145deg, #fff8fa, #f5e5ea); }
.ss-route-review .ss-route-number { background: var(--ss-rose); color: #fff; }
.ss-route-review small { color: #98435f; }
.ss-route-review h3 { color: #67394a; }

/* Financial streams */
.ss-streams-section { position: relative; padding: 116px 0 126px; border-top: 1px solid var(--ss-line); border-bottom: 1px solid var(--ss-line); background: radial-gradient(circle at 92% 9%, rgba(166,75,105,.14), transparent 27rem), linear-gradient(135deg, #f5ebe5, #f4ecdf 55%, #f8f1e8); }
.ss-stream-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; margin-top: 55px; }
.ss-stream-card { position: relative; overflow: hidden; min-height: 270px; padding: 30px; border: 1px solid var(--ss-line); border-radius: 24px; box-shadow: 0 18px 46px rgba(60, 46, 31, .07); }
.ss-stream-card::after { position: absolute; right: -90px; bottom: -105px; width: 230px; height: 230px; border: 1px solid currentColor; border-radius: 50%; opacity: .09; content: ""; }
.ss-stream-label { font-size: 10.5px; font-weight: 900; letter-spacing: 1.6px; }
.ss-stream-card h3 { max-width: 660px; margin: 15px 0 0; font: 500 29px/1.13 Georgia, serif; }
.ss-stream-card p { position: relative; z-index: 1; margin: 19px 0 0; color: #676058; font-size: 12px; line-height: 1.72; }
.ss-stream-card ul { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 18px; margin: 20px 0 0; padding: 0; list-style: none; }
.ss-stream-card li { display: grid; grid-template-columns: 16px 1fr; gap: 8px; font-size: 11px; }
.ss-stream-card li::before { content: "↗"; font-weight: 900; }
.ss-stream-bank { grid-column: span 7; min-height: 390px; background: radial-gradient(circle at 100% 0, rgba(209,163,90,.18), transparent 36%), linear-gradient(145deg, #354438, #28362d); color: #fff; }
.ss-stream-bank .ss-stream-label { color: var(--ss-gold-light); }
.ss-stream-bank h3 { color: #fff; }
.ss-stream-bank li { color: #d4dcd0; }
.ss-stream-bank li::before { color: #efc884; }
.ss-stream-bank blockquote { position: relative; z-index: 1; margin: 28px 0 0; padding: 20px 22px; border: 1px solid rgba(240,185,205,.24); border-left: 3px solid var(--ss-rose); border-radius: 0 15px 15px 0; background: rgba(166,75,105,.18); color: #f5e8ec; font: 500 18px/1.48 Georgia, serif; }
.ss-stream-pos { grid-column: span 5; min-height: 390px; background: linear-gradient(145deg, #fffaf4, #f5e7d8); }
.ss-stream-pos .ss-stream-label { color: var(--ss-orange); }
.ss-stream-pos h3 { color: #5e3b28; }
.ss-stream-tags { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 7px; margin-top: 23px; }
.ss-stream-tags span { padding: 7px 9px; border: 1px solid #e7c3aa; border-radius: 999px; background: rgba(255,255,255,.55); color: #85431f; font-size: 9.5px; font-weight: 850; }
.ss-stream-webshop { grid-column: span 5; background: linear-gradient(145deg, #fff8fa, #f3e2e8); }
.ss-stream-webshop .ss-stream-label { color: var(--ss-rose-dark); }
.ss-stream-webshop h3 { color: #65394a; }
.ss-stream-docs { grid-column: span 7; background: linear-gradient(145deg, #f7faf4, #e7efe4); }
.ss-stream-docs .ss-stream-label { color: #52684e; }
.ss-stream-docs h3 { color: #344431; }

/* Dashboard example */
.ss-dashboard-section { padding: 125px 0 133px; }
.ss-dashboard-heading { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(310px, .8fr); align-items: end; gap: 60px; max-width: none; }
.ss-dashboard-heading > p { margin: 0 0 5px; }
.ss-dashboard-frame { position: relative; overflow: hidden; margin-top: 57px; padding: 24px; border: 1px solid rgba(209,163,90,.34); border-radius: 27px; background: radial-gradient(circle at 90% 0, rgba(166,75,105,.22), transparent 27rem), linear-gradient(145deg, #344438, #27352d); color: #fff; box-shadow: 0 32px 85px rgba(41,55,46,.22); }
.ss-dashboard-frame::before { position: absolute; right: -145px; bottom: -170px; width: 380px; height: 380px; border: 1px solid rgba(237,207,152,.11); border-radius: 50%; box-shadow: 0 0 0 55px rgba(237,207,152,.018); content: ""; }
.ss-dashboard-frame > header { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; padding: 5px 5px 22px; border-bottom: 1px solid rgba(237,207,152,.16); }
.ss-dashboard-frame header div { display: grid; gap: 5px; }
.ss-frame-kicker { color: #efc3d1; font-size: 10px; font-weight: 900; letter-spacing: 1.5px; }
.ss-dashboard-frame h3 { margin: 0; font: 500 31px/1.1 Georgia, serif; }
.ss-frame-date { color: #c3cdc0; font-size: 10.5px; }
.ss-kpi-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.ss-kpi-grid article { display: flex; min-height: 177px; flex-direction: column; padding: 18px; border: 1px solid rgba(237,207,152,.16); border-radius: 17px; background: rgba(255,255,255,.065); }
.ss-kpi-grid article > span { color: #c8d0c5; font-size: 11px; line-height: 1.35; }
.ss-kpi-grid article > strong { margin-top: 17px; color: #fffdf8; font: 500 34px/1 Georgia, serif; white-space: nowrap; }
.ss-kpi-grid article > small { margin-top: 5px; color: #b8c2b5; font-size: 10.5px; }
.ss-kpi-grid article > i { margin-top: auto; color: #ddc07f; font-size: 10px; font-style: normal; font-weight: 800; }
.ss-kpi-grid article > i.is-good { color: #a9c69f; }
.ss-kpi-grid .is-attention { border-color: rgba(224,177,99,.31); background: rgba(209,163,90,.095); }
.ss-kpi-grid .is-risk { border-color: rgba(240,185,205,.31); background: rgba(166,75,105,.13); }
.ss-kpi-grid .ss-kpi-wide { grid-column: span 6; display: grid; min-height: 92px; grid-template-columns: minmax(0,1fr) auto auto auto; align-items: center; gap: 24px; }
.ss-kpi-grid .ss-kpi-wide > strong { margin: 0; }
.ss-kpi-grid .ss-kpi-wide > small,
.ss-kpi-grid .ss-kpi-wide > i { margin: 0; }

/* Learning */
.ss-learning-section { position: relative; padding: 120px 0 126px; border-top: 1px solid var(--ss-line); background: linear-gradient(135deg, #faf5ed, #f2e8da); }
.ss-learning-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr); align-items: center; gap: 70px; }
.ss-trust-steps { position: relative; display: grid; gap: 0; margin: 45px 0 0; padding: 0; list-style: none; }
.ss-trust-steps::before { position: absolute; top: 30px; bottom: 30px; left: 25px; width: 1px; background: linear-gradient(var(--ss-gold), rgba(209,163,90,.18)); content: ""; }
.ss-trust-steps li { position: relative; z-index: 1; display: grid; min-height: 104px; grid-template-columns: 53px 1fr; align-items: center; gap: 22px; padding: 20px 0; border-bottom: 1px solid var(--ss-line); }
.ss-trust-steps li:last-child { border-bottom: 0; }
.ss-trust-steps b { display: grid; width: 52px; height: 52px; place-items: center; border: 1px solid #d1a35a; border-radius: 50%; background: #fbf7ef; color: var(--ss-rose-dark); font-size: 9px; letter-spacing: .8px; }
.ss-trust-steps div { display: grid; gap: 5px; }
.ss-trust-steps strong { color: var(--ss-green); font-size: 16px; }
.ss-trust-steps span { color: #6c655c; font-size: 12px; line-height: 1.6; }
.ss-confidence-card { position: relative; overflow: hidden; padding: 31px; border: 1px solid rgba(237,207,152,.27); border-radius: 26px; background: radial-gradient(circle at 100% 0, rgba(166,75,105,.3), transparent 35%), linear-gradient(145deg, #354438, #28362d); color: #fff; box-shadow: 0 30px 75px rgba(42,55,46,.24); }
.ss-confidence-card::after { position: absolute; right: -100px; bottom: -110px; width: 245px; height: 245px; border: 1px solid rgba(237,207,152,.13); border-radius: 50%; content: ""; }
.ss-confidence-card > * { position: relative; z-index: 1; }
.ss-confidence-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-bottom: 18px; border-bottom: 1px solid rgba(237,207,152,.16); color: var(--ss-gold-light); font-size: 10px; font-weight: 900; letter-spacing: 1.25px; }
.ss-confidence-top b { padding: 6px 8px; border-radius: 999px; background: rgba(166,75,105,.26); color: #f1c5d3; font-size: 9px; letter-spacing: .5px; }
.ss-confidence-card dl { display: grid; gap: 0; margin: 24px 0 0; }
.ss-confidence-card dl div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid rgba(237,207,152,.11); }
.ss-confidence-card dt,
.ss-confidence-card dd { margin: 0; font-size: 11px; }
.ss-confidence-card dt { color: #bcc6b9; }
.ss-confidence-card dd { color: #fff; font-weight: 800; text-align: right; }
.ss-confidence-score { margin-top: 25px; }
.ss-confidence-score > div { display: flex; align-items: baseline; justify-content: space-between; gap: 15px; }
.ss-confidence-score span { color: #c2cbc0; font-size: 10px; }
.ss-confidence-score strong { color: var(--ss-gold-light); font: 500 27px/1 Georgia, serif; }
.ss-confidence-score > i { display: block; overflow: hidden; height: 6px; margin-top: 11px; border-radius: 999px; background: rgba(255,255,255,.11); }
.ss-confidence-score > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ss-gold), var(--ss-rose)); }
.ss-confidence-card > p { display: flex; align-items: center; gap: 8px; margin: 22px 0 0; color: #efc4d2; font-size: 10px; font-weight: 800; }
.ss-confidence-card > p span { width: 7px; height: 7px; border-radius: 50%; background: var(--ss-rose); box-shadow: 0 0 0 4px rgba(166,75,105,.16); }

/* Safety */
.ss-safety-section { position: relative; overflow: hidden; padding: 112px 0 116px; background: radial-gradient(circle at 10% 95%, rgba(209,163,90,.13), transparent 25rem), linear-gradient(145deg, #4b3440, #2a372f 63%); color: #fff; }
.ss-safety-section::before { position: absolute; top: -230px; right: -170px; width: 530px; height: 530px; border: 1px solid rgba(240,185,205,.12); border-radius: 50%; box-shadow: 0 0 0 60px rgba(240,185,205,.018); content: ""; }
.ss-safety-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); align-items: center; gap: 68px; }
.ss-safety-copy .eyebrow { color: #efbfd0; }
.ss-safety-copy h2 { color: #fffdf7; }
.ss-safety-copy h2 em { color: var(--ss-gold-light); }
.ss-safety-copy p { margin: 23px 0 0; color: #d2d9ce; font-size: 14px; line-height: 1.75; }
.ss-safety-copy > strong { display: inline-flex; margin-top: 24px; padding: 10px 13px; border: 1px solid rgba(240,185,205,.25); border-radius: 999px; background: rgba(166,75,105,.18); color: #f1c8d5; font-size: 10.5px; letter-spacing: .45px; }
.ss-safety-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.ss-safety-group { position: relative; overflow: hidden; padding: 19px; border: 1px solid rgba(237,207,152,.2); border-radius: 19px; background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.045)); box-shadow: inset 0 1px rgba(255,255,255,.055), 0 17px 35px rgba(18,28,22,.13); }
.ss-safety-group::after { position: absolute; right: -72px; bottom: -95px; width: 170px; height: 170px; border: 1px solid currentColor; border-radius: 50%; opacity: .09; content: ""; }
.ss-safety-group header { position: relative; z-index: 1; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid rgba(237,207,152,.15); }
.ss-safety-number { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(237,207,152,.3); border-radius: 12px; color: var(--ss-gold-light); font-size: 10px; font-weight: 900; letter-spacing: .8px; }
.ss-safety-group header div { display: grid; gap: 3px; }
.ss-safety-group header small { color: #efc3d1; font-size: 10.5px; font-weight: 900; letter-spacing: 1.05px; }
.ss-safety-group h3 { margin: 0; color: #fffdf8; font: 500 20px/1.12 Georgia, serif; }
.ss-safety-group header > b { align-self: start; padding: 6px 8px; border-radius: 999px; background: rgba(166,75,105,.27); color: #f2c7d4; font-size: 9.5px; letter-spacing: .3px; white-space: nowrap; }
.ss-safety-group ul { position: relative; z-index: 1; display: grid; gap: 0; margin: 12px 0 0; padding: 0; list-style: none; }
.ss-safety-group li { display: grid; min-height: 34px; grid-template-columns: 17px 1fr; align-items: center; gap: 8px; border-bottom: 1px solid rgba(237,207,152,.1); color: #e6ebe3; font-size: 12px; }
.ss-safety-group li:last-child { border-bottom: 0; }
.ss-safety-group li::before { display: grid; width: 16px; height: 16px; place-items: center; border-radius: 50%; background: rgba(166,75,105,.27); color: #f2c5d3; content: "!"; font-size: 8px; font-weight: 900; }
.ss-safety-fiscal { border-color: rgba(240,185,205,.25); background: linear-gradient(145deg, rgba(166,75,105,.18), rgba(255,255,255,.045)); }
.ss-safety-closing { grid-column: 1 / -1; }
.ss-safety-closing ul { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 22px; }

/* Explainer video */
.ss-video-section { position: relative; overflow: hidden; padding: 116px 0 122px; border-bottom: 1px solid var(--ss-line); background: radial-gradient(circle at 91% 13%, rgba(166,75,105,.16), transparent 29rem), radial-gradient(circle at 7% 90%, rgba(67,83,63,.1), transparent 26rem), linear-gradient(135deg, #f9f2ea, #f4e9e3 52%, #f8f0e8); }
.ss-video-section::before { position: absolute; top: -250px; right: -190px; width: 540px; height: 540px; border: 1px solid rgba(166,126,64,.15); border-radius: 50%; box-shadow: 0 0 0 65px rgba(166,126,64,.025); content: ""; }
.ss-video-layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); align-items: center; gap: clamp(52px, 7vw, 88px); }
.ss-video-copy { max-width: none; }
.ss-video-copy .eyebrow { color: #8c6730; }
.ss-video-section .video-steps li { border-color: rgba(182,145,82,.31); background: rgba(255,252,247,.67); box-shadow: 0 11px 28px rgba(75,55,34,.035); }
.ss-video-section .video-steps li:nth-child(1) b { background: #455641; color: #fff; }
.ss-video-section .video-steps li:nth-child(2) b { background: #c99a52; color: #45341f; }
.ss-video-section .video-steps li:nth-child(3) b { background: #a94d69; color: #fff; }
.ss-video-section .video-steps b { font-size: 10px; }
.ss-video-section .video-steps span { font-size: 12px; }
.ss-video-section .video-link { color: var(--ss-rose-dark); }
.ss-video-section .video-link span { color: var(--ss-gold); }
.ss-video-section .video-poster { border-color: rgba(238,207,151,.48); background: radial-gradient(circle at 82% 17%, rgba(174,77,107,.39), transparent 30%), radial-gradient(circle at 16% 85%, rgba(209,163,90,.15), transparent 28%), linear-gradient(140deg, #39493c, #29372e 62%, #543844); color: #fffaf2; box-shadow: 0 30px 70px rgba(43,55,47,.24); }
.ss-video-section .video-poster::before { border-color: rgba(239,209,155,.22); }
.ss-video-section .video-brand { color: #efd09b; }
.ss-video-section .video-play { border-color: rgba(243,211,157,.62); background: linear-gradient(145deg, #b35270, #86374f); box-shadow: 0 14px 38px rgba(31,42,35,.35), 0 0 0 12px rgba(231,191,121,.12); }
.ss-video-section .video-status { border-color: rgba(239,209,155,.2); }
.ss-video-section .video-status span { color: #efcbd6; font-size: 11px; }
.ss-video-section .video-duration { color: #ead2a9; font-size: 11px; }
.ss-video-section .video-placeholder figcaption { display: none; }

/* Closing */
.ss-closing { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 75px; padding: 112px 0 94px; }
.ss-closing > div:first-child { max-width: 810px; }
.ss-closing p { max-width: 730px; margin: 22px 0 0; color: #6d655d; font-size: 15px; line-height: 1.75; }
.ss-closing-actions { display: grid; gap: 10px; min-width: 270px; }
.ss-transparency { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: 23px; margin-bottom: 95px; padding: 22px 25px; border: 1px solid rgba(209,163,90,.37); border-left: 4px solid var(--ss-orange); border-radius: 0 17px 17px 0; background: rgba(255,253,249,.67); }
.ss-transparency span { color: var(--ss-rose-dark); font-size: 11px; font-weight: 900; letter-spacing: .75px; text-transform: uppercase; white-space: nowrap; }
.ss-transparency p { margin: 0; color: #716960; font-size: 12px; line-height: 1.7; }
.snelstart-page .footer-app-copy span,
.snelstart-page .footer-app-button small { font-size: 10px; }

@media (max-width: 1060px) {
  .ss-hero { grid-template-columns: minmax(0, 1fr) 360px; gap: 45px; min-height: 680px; }
  .ss-hero h1 { font-size: clamp(47px, 5.6vw, 65px); }
  .ss-role-grid { grid-template-columns: 1fr; }
  .ss-main-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ss-main-flow li:nth-child(3)::after { display: none; }
  .ss-main-flow li:nth-child(4) { grid-column: 1 / 2; }
  .ss-case-stage { grid-template-columns: 1fr; }
  .ss-invoice-card { max-width: 660px; }
  .ss-stream-bank,
  .ss-stream-pos,
  .ss-stream-webshop,
  .ss-stream-docs { grid-column: span 6; min-height: 340px; }
  .ss-dashboard-heading { grid-template-columns: 1fr; gap: 22px; }
  .ss-dashboard-heading > p { margin: 0; }
  .ss-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ss-kpi-grid .ss-kpi-wide { grid-column: span 3; }
  .ss-learning-layout { grid-template-columns: 1fr; }
  .ss-confidence-card { max-width: 620px; }
  .ss-safety-layout { grid-template-columns: 1fr; gap: 48px; }
  .ss-video-layout { grid-template-columns: 1fr; }
  .ss-video-copy { max-width: 760px; }
  .ss-closing { grid-template-columns: 1fr; gap: 36px; }
  .ss-closing-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
}

@media (max-width: 760px) {
  .ss-container { width: min(100% - 32px, 640px); }
  .snelstart-page .public-brand { min-width: 180px; }
  .ss-hero { grid-template-columns: 1fr; gap: 44px; min-height: 0; padding: 62px 0 78px; }
  .ss-breadcrumb { margin-bottom: 25px; }
  .ss-partner-lockup { gap: 8px; }
  .ss-partner-logo { width: 116px; height: 42px; padding: 7px 10px; border-radius: 12px; }
  .ss-partner-logo img { max-width: 96px; max-height: 22px; }
  .ss-partner-snelstart { --partner-logo-height: 16px; }
  .ss-partner-nmbrs { --partner-logo-height: 22px; }
  .ss-partner-horeko { --partner-logo-height: 15px; }
  .ss-partner-product { font-size: 6.5px; letter-spacing: 1.15px; }
  .ss-partner-dish { --partner-logo-height: 22px; }
  .ss-partner-cross { font-size: 16px; }
  .ss-partner-more { font-size: 10px; letter-spacing: 1px; }
  .ss-hero h1 { margin-top: 16px; font-size: clamp(43px, 11.5vw, 59px); letter-spacing: -2.4px; }
  .ss-hero-lead { font-size: 15px; }
  .ss-hero-actions { display: grid; grid-template-columns: 1fr; }
  .ss-button { width: 100%; }
  .ss-assurances { display: grid; }
  .ss-assurances li { width: max-content; }
  .ss-control-card { padding: 23px; border-radius: 23px; }
  .ss-role-section { padding: 78px 0 88px; }
  .ss-section-heading h2,
  .ss-closing h2,
  .ss-safety-copy h2 { font-size: 40px; letter-spacing: -1.3px; }
  .ss-section-heading > p { font-size: 14px; }
  .ss-role-grid { margin-top: 38px; }
  .ss-role-card { padding: 25px 22px; border-radius: 21px; }
  .ss-role-summary { align-items: flex-start; flex-direction: column; gap: 8px; }
  .ss-flow-band { padding: 82px 0 85px; }
  .ss-main-flow { grid-template-columns: 1fr; margin-top: 39px; }
  .ss-main-flow li { min-height: 112px; }
  .ss-main-flow li:nth-child(4) { grid-column: auto; }
  .ss-main-flow li::after,
  .ss-main-flow li:nth-child(3)::after { top: auto; right: 50%; bottom: -24px; display: block; transform: translateX(50%) rotate(90deg); }
  .ss-main-flow li:last-child::after { display: none; }
  .ss-flow-note { align-items: flex-start; flex-direction: column; gap: 6px; }
  .ss-hanos-section { padding: 84px 0 89px; }
  .ss-case-stage { margin-top: 39px; }
  .ss-invoice-card,
  .ss-analysis-card { padding: 23px; border-radius: 21px; }
  .ss-analysis-columns { grid-template-columns: 1fr; gap: 25px; }
  .ss-proposal-line { grid-template-columns: 1fr; }
  .ss-route-grid { grid-template-columns: 1fr; }
  .ss-route-card { grid-template-columns: 43px 1fr; padding: 22px; }
  .ss-route-number { width: 42px; height: 42px; }
  .ss-streams-section { padding: 82px 0 88px; }
  .ss-stream-grid { grid-template-columns: 1fr; margin-top: 38px; }
  .ss-stream-bank,
  .ss-stream-pos,
  .ss-stream-webshop,
  .ss-stream-docs { grid-column: auto; min-height: 0; }
  .ss-stream-card { padding: 24px; }
  .ss-stream-card ul { grid-template-columns: 1fr; }
  .ss-dashboard-section { padding: 84px 0 91px; }
  .ss-dashboard-frame { margin-top: 40px; padding: 16px; border-radius: 22px; }
  .ss-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ss-kpi-grid article { min-height: 155px; }
  .ss-kpi-grid .ss-kpi-wide { grid-column: span 2; display: flex; min-height: 150px; align-items: flex-start; }
  .ss-kpi-grid .ss-kpi-wide > strong { margin-top: 17px; }
  .ss-kpi-grid .ss-kpi-wide > small { margin-top: 5px; }
  .ss-kpi-grid .ss-kpi-wide > i { margin-top: auto; }
  .ss-learning-section { padding: 82px 0 88px; }
  .ss-learning-layout { gap: 44px; }
  .ss-confidence-card { padding: 24px; border-radius: 22px; }
  .ss-safety-section { padding: 82px 0 86px; }
  .ss-safety-groups { grid-template-columns: 1fr; }
  .ss-safety-closing { grid-column: auto; }
  .ss-safety-closing ul { grid-template-columns: 1fr; }
  .ss-video-section { padding: 82px 0 88px; }
  .ss-video-layout { gap: 38px; }
  .ss-closing { padding: 82px 0 63px; }
  .ss-closing-actions { grid-template-columns: 1fr; }
  .ss-transparency { grid-template-columns: 1fr; gap: 7px; margin-bottom: 70px; }
}

@media (max-width: 430px) {
  .snelstart-page .dashboard-return { font-size: 0; }
  .snelstart-page .dashboard-return::after { content: "Koppelingen"; font-size: 11px; }
  .snelstart-page .dashboard-return svg { display: none; }
  .ss-hero h1 { font-size: 41px; }
  .ss-control-topline { align-items: flex-start; flex-direction: column; gap: 5px; }
  .ss-control-title strong { font-size: 23px; }
  .ss-section-heading h2,
  .ss-closing h2,
  .ss-safety-copy h2 { font-size: 36px; }
  .ss-role-card header { align-items: flex-start; }
  .ss-role-card h3 { font-size: 27px; }
  .ss-role-summary span { font-size: 17px; }
  .ss-invoice-head { align-items: flex-start; flex-direction: column; }
  .ss-analysis-top { align-items: flex-start; flex-direction: column; }
  .ss-route-card { grid-template-columns: 1fr; }
  .ss-stream-card h3 { font-size: 26px; }
  .ss-stream-bank blockquote { font-size: 16px; }
  .ss-dashboard-frame > header { align-items: flex-start; flex-direction: column; }
  .ss-kpi-grid { grid-template-columns: 1fr; }
  .ss-kpi-grid .ss-kpi-wide { grid-column: auto; }
  .ss-confidence-card dl div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .ss-confidence-card dd { text-align: left; }
  .ss-safety-group header { grid-template-columns: 38px minmax(0, 1fr); }
  .ss-safety-group header > b { grid-column: 2; justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  .ss-button,
  .ss-breadcrumb a { transition: none; }
}
