/* WHK homepage 2026-10-18; built and trimmed from docs/plans/website-projects/mocks/whk-homepage-interim-2026-10 (build-cms.mjs, trim-css.mjs) */
@font-face{font-family: "Opensans Variablefont Wdth Wght";src: url("../fonts/6778fd1cc3fd79abb2052dc9_OpenSans-VariableFont_wdth%2Cwght.ttf") format("truetype");font-weight: 300 800;font-style: normal;font-display: swap}
:root{--navy-950: #07182d;--navy-900: #0b192e;--navy-800: #0a3066;--navy-700: #12407f;--blue-500: #3d8df0;--blue-400: #60a5fa;--blue-200: #bfdbfe;--blue-100: #dbeafe;--blue-50: #eff6ff;--slate-900: #0f172a;--slate-700: #334155;--slate-600: #475569;--slate-500: #64748b;--slate-400: #94a3b8;--slate-200: #e2e8f0;--slate-100: #f1f5f9;--slate-50: #f8fafc;--green-600: #16a34a;--amber-500: #f59e0b;--red-500: #ef4444;--white: #ffffff;--radius-sm: 10px;--radius: 16px;--radius-lg: 24px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .04);--shadow: 0 10px 30px rgba(11, 25, 46, .08), 0 2px 6px rgba(11, 25, 46, .04);--shadow-lg: 0 30px 60px rgba(11, 25, 46, .16), 0 8px 20px rgba(11, 25, 46, .08);--container: 1200px;--gutter: 24px;--section-y: clamp(72px, 9vw, 120px);--text-h1: clamp(38px, 4.6vw, 60px);--text-h2: clamp(30px, 3.2vw, 42px);--text-h3: 20px;--text-lead: clamp(17px, 1.35vw, 19px);--text-body: 16px;--text-small: 14px}
*, ::before, ::after{box-sizing: border-box}
html{scroll-behavior: smooth}
body.whk-home{margin: 0px;font-family: "Opensans Variablefont Wdth Wght", "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;font-size: var(--text-body);line-height: 1.6;color: var(--slate-700);background: var(--white);-webkit-font-smoothing: antialiased}
:where(.whk-home) img{display: block;max-width: 100%;height: auto}
:where(.whk-home) a{color: inherit}
:where(.whk-home) :is(h1, h2, h3, h4){margin: 0px;color: var(--navy-900);font-weight: 750;letter-spacing: -0.02em;line-height: 1.12}
:where(.whk-home) h1{font-size: var(--text-h1);line-height: 1.06;letter-spacing: -0.03em}
:where(.whk-home) h2{font-size: var(--text-h2)}
:where(.whk-home) h3{font-size: var(--text-h3);letter-spacing: -0.01em;line-height: 1.3}
:where(.whk-home) p{margin: 0px}
.wrap{width: 100%;max-width: calc(var(--container) + 2 * var(--gutter));margin: 0px auto;padding: 0 var(--gutter)}
.section{padding: var(--section-y) 0}
.section--tint{background: var(--slate-50)}
.section--blue{background: linear-gradient(180deg, var(--blue-50), var(--white))}
.accent{color: var(--navy-800)}
.on-dark .accent{color: var(--blue-200)}
.eyebrow{display: inline-flex;align-items: center;gap: 8px;font-size: 13px;font-weight: 700;letter-spacing: 0.08em;text-transform: uppercase;color: var(--navy-800)}
.eyebrow::before{content: "";width: 18px;height: 2px;border-radius: 2px;background: var(--blue-500)}
.on-dark .eyebrow{color: var(--blue-200)}
.section-head{max-width: 720px;display: grid;gap: 16px;margin-bottom: 48px}
.section-head--center{margin-left: auto;margin-right: auto;text-align: center;justify-items: center}
.section-head--split{max-width: none;display: flex;align-items: end;justify-content: space-between;gap: 24px;flex-wrap: wrap}
.section-head--split > div{display: grid;gap: 16px;max-width: 680px}
.lead{font-size: var(--text-lead);line-height: 1.6;color: var(--slate-600)}
.on-dark .lead{color: rgba(255, 255, 255, 0.76)}
.btn{display: inline-flex;align-items: center;justify-content: center;gap: 10px;min-height: 48px;padding: 0px 22px;border-radius: 999px;font-style: inherit;font-variant: inherit;font-stretch: inherit;line-height: inherit;font-family: inherit;font-optical-sizing: inherit;font-size-adjust: inherit;font-kerning: inherit;font-feature-settings: inherit;font-variation-settings: inherit;font-language-override: inherit;font-size: 15px;font-weight: 700;text-decoration: none;white-space: nowrap;border: 1px solid transparent;cursor: pointer;transition: background 0.15s, border-color 0.15s, color 0.15s, transform 0.15s}
.btn svg{width: 18px;height: 18px}
.btn--primary{background: var(--navy-800);color: var(--white);box-shadow: rgba(10, 48, 102, 0.22) 0px 8px 20px}
.btn--primary:hover{background: var(--navy-900)}
.btn--ghost{background: var(--white);color: var(--navy-800);border-color: var(--slate-200)}
.btn--ghost:hover{border-color: var(--navy-800)}
.btn--light{background: var(--white);color: var(--navy-900)}
.btn--outline-light{background: transparent;color: var(--white);border-color: rgba(255, 255, 255, 0.35)}
.btn--outline-light:hover{border-color: var(--white)}
.link-arrow{display: inline-flex;align-items: center;gap: 6px;font-weight: 700;color: var(--navy-800);text-decoration: none}
.link-arrow svg{width: 16px;height: 16px;transition: transform 0.15s}
.link-arrow:hover svg{transform: translateX(3px)}
.chip{display: inline-flex;align-items: center;min-height: 28px;padding: 0px 12px;border-radius: 999px;background: var(--slate-100);color: var(--slate-600);font-size: 13px;font-weight: 600}
.tag{display: inline-flex;align-items: center;gap: 6px;min-height: 26px;padding: 0px 10px;border-radius: 999px;font-size: 12px;font-weight: 700;letter-spacing: 0.02em;background: var(--blue-50);color: var(--navy-800)}
.tag--green{background: rgb(220, 252, 231);color: rgb(22, 101, 52)}
.tag--new{background: var(--navy-800);color: var(--white)}
.sample-note{font-size: 12px;color: var(--slate-500)}
.card{background: var(--white);border: 1px solid var(--slate-200);border-radius: var(--radius);box-shadow: var(--shadow-sm)}
.logo-row{display: flex;flex-wrap: wrap;align-items: center;gap: 18px 36px}
.logo-row img{height: 24px;width: auto;filter: brightness(0);opacity: 0.45}
.logo-row img.is-tall{height: 30px}
.press-label{font-size: 12px;font-weight: 700;letter-spacing: 0.1em;text-transform: uppercase;color: var(--slate-500)}
.rating{display: inline-flex;align-items: center;gap: 14px}
.rating__badge{display: inline-flex;padding: 6px 10px;border-radius: 10px;background: var(--white)}
.rating__badge img{height: 34px;width: auto}
.rating__text{font-size: 14px;color: var(--slate-600);line-height: 1.4}
.rating__text b{color: var(--navy-900)}
.figures{display: grid;grid-template-columns: repeat(4, 1fr);gap: 24px}
.figure__value{font-size: clamp(34px, 3.4vw, 46px);font-weight: 800;letter-spacing: -0.03em;line-height: 1;color: var(--navy-800)}
.figure__value sup{font-size: 0.5em;vertical-align: top;position: relative;top: 0.1em;margin-left: 2px;color: var(--blue-500)}
.figure__label{margin-top: 10px;font-size: 14.5px;color: var(--slate-600);line-height: 1.4}
.offer{display: grid;gap: 12px;align-content: start;justify-items: start;padding: 28px}
.offer .tag{white-space: nowrap}
.offer p{color: var(--slate-600)}
.offer .link-arrow{margin-top: 6px}
.quote{margin: 0px;display: grid;grid-template-rows: auto 1fr;overflow: hidden}
.quote__video{margin-top: 8px;font-size: 14px}
.quote__video svg{width: 18px;height: 18px}
.quote__media{position: relative;aspect-ratio: 16 / 10;background: var(--navy-900)}
.quote__media img{width: 100%;height: 100%;object-fit: cover}
.quote__body{display: grid;gap: 14px;align-content: start;padding: 24px}
.quote__stars{color: var(--amber-500);letter-spacing: 2px;font-size: 14px}
.quote blockquote{margin: 0px;color: var(--navy-900);font-size: 17px;font-weight: 650;line-height: 1.45;letter-spacing: -0.005em}
.quote figcaption{display: grid;margin-top: auto;padding-top: 14px;border-top: 1px solid var(--slate-100);font-size: 14px}
.quote figcaption b{color: var(--navy-900)}
.quote figcaption span{color: var(--slate-500)}
.clients{display: grid;grid-template-columns: repeat(5, 1fr);gap: 12px}
.clients div{display: grid;place-items: center;height: 84px;padding: 16px 22px;border-radius: 14px;background: var(--white);border: 1px solid var(--slate-200)}
.clients img{max-height: 40px;width: auto;max-width: 100%;object-fit: contain;filter: grayscale(1);opacity: 0.8}
.step__num{display: grid;place-items: center;width: 40px;height: 40px;border-radius: 50%;background: var(--navy-800);color: var(--white);font-weight: 800;font-size: 15px}
.founders-thumb{width: 100%;max-width: 280px;border-radius: 14px;box-shadow: var(--shadow)}
.person{display: flex;align-items: center;gap: 14px}
.person img{width: 56px;height: 56px;border-radius: 50%;object-fit: cover;object-position: center 20%}
.person b{display: block;color: var(--navy-900)}
.person span{color: var(--slate-500);font-size: 14px}
.facts-list{display: grid;gap: 10px;margin: 0px;padding: 0px;list-style: none}
.facts-list li{display: grid;grid-template-columns: 120px 1fr;gap: 12px;padding: 12px 0px;border-top: 1px solid var(--slate-200);font-size: 15px}
.facts-list b{color: var(--navy-900)}
.articles{display: grid;grid-template-columns: repeat(3, 1fr);gap: 24px}
.article{display: grid;grid-template-rows: auto 1fr;overflow: hidden;text-decoration: none;transition: transform 0.15s, box-shadow 0.15s}
.article:hover{transform: translateY(-3px);box-shadow: var(--shadow)}
.article__media{aspect-ratio: 16 / 9;background: var(--slate-100)}
.article__media img{width: 100%;height: 100%;object-fit: cover}
.article__body{display: grid;gap: 10px;align-content: start;padding: 22px}
.article__meta{font-size: 12.5px;color: var(--slate-500);font-weight: 600}
.article h3{font-size: 18px}
.cta-band{position: relative;overflow: hidden;border-radius: var(--radius-lg);padding: clamp(32px, 5vw, 64px);background: radial-gradient(80% 120% at 100% 0%, rgba(61, 141, 240, .35), transparent 60%), linear-gradient(135deg, var(--navy-800), var(--navy-950));color: rgba(255, 255, 255, 0.8)}
.cta-band h2{color: var(--white)}
.cta-band__grid{display: grid;grid-template-columns: 1.4fr 1fr;gap: 40px;align-items: center}
.cta-band__actions{display: flex;flex-wrap: wrap;gap: 12px;margin-top: 28px}
.cta-band__checks{display: flex;flex-wrap: wrap;gap: 8px 20px;margin-top: 20px;font-size: 14px;color: rgba(255, 255, 255, 0.72)}
.cta-band__checks span{display: inline-flex;align-items: center;gap: 8px}
.cta-band__checks svg{width: 16px;height: 16px;color: var(--blue-200)}
.address-card{display: grid;gap: 14px;padding: 24px;border-radius: var(--radius);background: rgba(255, 255, 255, 0.06);border: 1px solid rgba(255, 255, 255, 0.12)}
.address-card b{color: var(--white);font-size: 17px}
.address-card a{color: var(--blue-200)}
@media (max-width: 900px) {
  .figures{grid-template-columns: repeat(2, 1fr);gap: 28px 20px}
  .clients{grid-template-columns: repeat(2, 1fr)}
  .articles{grid-template-columns: 1fr}
  .cta-band__grid{grid-template-columns: 1fr}
  .section-head{margin-bottom: 32px}
}
@media (max-width: 560px) {
  :root{--gutter: 16px}
  .btn{width: 100%}
  .facts-list li{grid-template-columns: 1fr;gap: 2px}
}
.hero-actions{display: flex;flex-wrap: wrap;gap: 12px}
.press{display: grid;gap: 14px}
.offers-grid{display: grid;grid-template-columns: repeat(3, 1fr);gap: 20px}
.offers-grid .offer:nth-child(2){border-color: var(--navy-800);box-shadow: 0 0 0 1px var(--navy-800), var(--shadow)}
.quotes-grid{display: grid;grid-template-columns: repeat(3, 1fr);gap: 24px;margin-top: 48px}
.story{display: grid;grid-template-columns: 1.15fr 0.85fr;gap: 64px;align-items: start}
.story__copy{display: grid;gap: 20px}
.story__side{display: grid;gap: 20px;justify-items: start}
.story__photo{margin: 0px;display: grid;gap: 8px}
.story > *{min-width: 0px}
.contact-card{display: grid;gap: 16px;padding: 24px;max-width: 420px}
.contact-card p{color: var(--slate-600);font-size: 15px}
.dir-final .step__num{position: relative;box-shadow: 0 0 0 6px var(--slate-50)}
.pin{display: inline-grid;place-items: center;flex: 0 0 auto;width: 22px;height: 22px;border-radius: 50%;background: var(--blue-500);color: var(--white);font-style: normal;font-size: 12px;font-weight: 800;box-shadow: rgba(61, 141, 240, 0.18) 0px 0px 0px 4px}
.hero-c__head{display: grid;gap: 22px;justify-items: center;text-align: center;max-width: 900px}
.hero-c__head h1{max-width: 18ch}
.hero-c__head .lead{max-width: 64ch}
.pains{display: grid;grid-template-columns: 1fr 1fr;gap: 16px}
.pain{display: grid;grid-template-columns: 1fr auto 1fr;gap: 16px;align-items: center;padding: 20px 22px;border-radius: var(--radius);background: var(--white);border: 1px solid var(--slate-200)}
.pain__before{color: var(--slate-500);font-size: 15px}
.pain__arrow{display: grid;place-items: center;width: 32px;height: 32px;border-radius: 50%;background: var(--blue-50);color: var(--navy-800)}
.pain__arrow svg{width: 16px;height: 16px}
.pain__after{color: var(--navy-900);font-weight: 650;font-size: 15px}
@media (max-width: 900px) {
  .story{grid-template-columns: 1fr}
  .offers-grid, .quotes-grid{grid-template-columns: 1fr}
  .pains{grid-template-columns: 1fr}
  .story{gap: 40px}
}
@media (max-width: 560px) {
  .pain{grid-template-columns: 1fr;gap: 10px}
  .pain__arrow{transform: rotate(90deg)}
}
.hero-c__head > *{min-width: 0px}
@media (max-width: 560px) {
  .section-head--center .eyebrow::before, .hero-c__head .eyebrow::before{display: none}
  .hero-c__head .eyebrow, .section-head--center .eyebrow{text-align: center}
}
.hero-f{padding: 56px 0px 0px;background: radial-gradient(50% 45% at 50% 0%, rgba(61, 141, 240, .13), transparent 70%), linear-gradient(180deg, var(--white) 70%, var(--slate-50))}
.hero-f__note{font-size: 13.5px;color: var(--slate-500)}
.stage{position: relative;display: grid;grid-template-columns: 1.18fr 1fr;align-items: start;margin-top: 52px}
.stage__photo{position: relative;margin: 0px;border-radius: var(--radius-lg);overflow: hidden;box-shadow: var(--shadow-lg);aspect-ratio: 16 / 11}
.stage__photo img{width: 100%;height: 100%;object-fit: cover;object-position: 50% 35%}
.stage__chip{position: absolute;left: 20px;bottom: 20px;display: flex;gap: 12px;align-items: center;max-width: calc(100% - 40px);padding: 12px 16px;border-radius: 14px;background: rgba(255, 255, 255, 0.94);backdrop-filter: blur(8px);box-shadow: var(--shadow);font-size: 13px;line-height: 1.35;color: var(--slate-600)}
.stage__chip b{display: block;color: var(--navy-900);font-size: 14px}
.stage__chip svg{flex: 0 0 auto;width: 22px;height: 22px;color: var(--navy-800)}
.stage__report{position: relative;z-index: 2;margin: 56px 0px 0px -88px}
.legend-row{display: grid;grid-template-columns: repeat(3, auto);justify-content: center;gap: 14px 40px;margin: 36px 0px 0px;padding: 0px;list-style: none}
.legend-row li{display: flex;align-items: center;gap: 8px;font-size: 14px;font-weight: 650;color: var(--navy-900)}
.proof{display: grid;gap: 32px;margin-top: 48px;padding-bottom: 56px}
.proof > .figures{padding-top: 40px;border-top: 1px solid var(--slate-200)}
.proof__seal img{height: 44px;width: auto}
.figures--ruled .figure{padding-left: 20px;border-left: 2px solid var(--blue-100)}
.proof__row{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 28px}
.dir-final .press{grid-template-columns: auto 1fr;align-items: center;gap: 28px}
@media (max-width: 900px) {
  .stage{grid-template-columns: 1fr}
  .stage__report{margin: -48px 12px 0px}
  .dir-final .press{grid-template-columns: 1fr;gap: 14px}
  .legend-row{grid-template-columns: repeat(2, auto);justify-content: start}
}
@media (max-width: 560px) {
  .hero-f{padding-top: 36px}
  .stage__photo{aspect-ratio: 4 / 3.4}
  .stage__chip{left: 12px;bottom: 60px;right: 12px}
  .stage__report{margin: -40px 0px 0px}
  .legend-row{display: grid;grid-template-columns: 1fr 1fr;gap: 10px 14px}
}
.stage > *{min-width: 0px}
.clients a{display: grid;place-items: center;height: 84px;padding: 16px 22px;border-radius: 14px;background: var(--white);border: 1px solid var(--slate-200);transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s}
.clients a:hover{border-color: var(--blue-200);box-shadow: var(--shadow-sm);transform: translateY(-2px)}
.clients a img{max-height: 40px;width: auto;max-width: 100%;object-fit: contain;filter: grayscale(1);opacity: 0.8;transition: filter 0.15s, opacity 0.15s}
.clients a:hover img{filter: none;opacity: 1}
a.rating{text-decoration: none}
a.rating:hover .rating__text b{text-decoration: underline}
.logo-row a{display: inline-flex}
a.proof__seal{transition: box-shadow 0.15s}
a.proof__seal:hover{box-shadow: var(--shadow-sm)}
.report-shot{margin: 0px;display: grid;gap: 8px}
.report-shot__frame{position: relative;padding: 10px;border-radius: 20px;background: var(--white);border: 1px solid var(--slate-200);box-shadow: var(--shadow-lg)}
.report-shot__frame img{width: 100%;height: auto;border-radius: 12px}
.report-shot__pin{position: absolute;transform: translate(-50%, -50%);margin: 10px 0px 0px 10px}
.report-shot figcaption{padding-left: 6px;font-size: 12.5px;color: var(--slate-500)}
.dir-final .stage__report{margin: 40px 0px 0px -96px}
.pillars-rich{display: grid;grid-template-columns: repeat(3, 1fr);gap: 22px}
.pillar-rich{display: grid;grid-template-rows: auto 1fr;overflow: hidden;transition: box-shadow 0.15s, transform 0.15s}
.pillar-rich:hover{box-shadow: var(--shadow);transform: translateY(-3px)}
.pillar-rich__visual{padding: 18px;background: linear-gradient(180deg, var(--slate-50), var(--blue-50));border-bottom: 1px solid var(--slate-200)}
.pillar-rich__body{display: grid;gap: 12px;align-content: start;padding: 22px 24px 26px}
.pillar-rich__title{display: grid;grid-template-columns: auto 1fr auto;gap: 12px;align-items: center}
.pillar-rich__title h3{font-size: 18.5px}
.pillar-rich__icon{display: grid;place-items: center;width: 40px;height: 40px;border-radius: 11px;background: var(--navy-800);color: var(--white);box-shadow: rgba(10, 48, 102, 0.22) 0px 6px 14px}
.pillar-rich__icon svg{width: 21px;height: 21px}
.pillar-rich p{color: var(--slate-600);font-size: 15.5px}
.pillar-rich__points{display: grid;gap: 6px;margin: 2px 0px 0px;padding: 0px;list-style: none;font-size: 14px;color: var(--slate-700)}
.pillar-rich__points li{display: flex;align-items: center;gap: 8px}
.pillar-rich__points svg{flex: 0 0 auto;width: 16px;height: 16px;color: var(--green-600)}
.pillars-rich__note{margin-top: 16px;text-align: right}
.mini{--teal: #10a07e;--out: #2f4f8f;--gold: #c99a2e;display: grid;gap: 10px;min-height: 132px;padding: 14px;border-radius: 12px;background: var(--white);border: 1px solid var(--slate-200);box-shadow: var(--shadow-sm);font-size: 12.5px;color: var(--slate-600)}
.mini b{color: var(--navy-900)}
.mini small{font-size: 11px;color: var(--slate-500)}
.mini p{margin: 0px;font-size: 12px;color: var(--slate-500)}
.mini__head{display: flex;justify-content: space-between;gap: 8px;font-size: 11.5px}
.mini--line svg{width: 100%;height: 70px}
.mini__area{fill: rgba(16, 160, 126, 0.1)}
.mini__stroke{fill: none;stroke: var(--teal);stroke-width: 2.2;vector-effect: non-scaling-stroke}
.mini__stroke--plan{stroke-dasharray: 5, 4}
.mini__plan{stroke: rgb(248, 113, 113);stroke-width: 1.2;stroke-dasharray: 4, 4;vector-effect: non-scaling-stroke}
.mini__low{fill: var(--white);stroke: rgb(239, 68, 68);stroke-width: 2.4;vector-effect: non-scaling-stroke}
.mini__foot{display: flex;gap: 14px;font-size: 11px}
.mini__foot span::before{content: "";display: inline-block;width: 12px;margin-right: 5px;vertical-align: middle;border-top: 2px solid var(--teal)}
.mini__foot span:nth-child(2)::before{border-top-style: dashed}
.mini__foot .mini__floor{margin-left: auto;color: rgb(220, 38, 38)}
.mini__foot .mini__floor::before{border-top: 1.5px dashed rgb(248, 113, 113)}
.mini--kpis{grid-template-columns: repeat(3, 1fr);align-content: center}
.mini--kpis > div{display: grid;gap: 2px;padding: 10px;border-radius: 10px;background: var(--slate-50);border: 1px solid var(--slate-100)}
.mini--kpis b{font-size: 16px;letter-spacing: -0.02em;white-space: nowrap}
.mini--kpis em{font-style: normal;font-size: 11px;font-weight: 700}
.mini--kpis .up{color: var(--green-600)}
.mini--kpis .down{color: rgb(220, 38, 38)}
.mini--bars{align-content: center}
.mini__row{display: grid;grid-template-columns: 112px 1fr auto;gap: 10px;align-items: center}
.mini__row i{display: block;height: 14px;width: var(--w);border-radius: 4px;background: var(--out)}
.mini__row.is-alt i{background: linear-gradient(90deg, var(--out), var(--teal))}
.mini--list > div{display: grid;grid-template-columns: 1fr auto auto;gap: 8px;align-items: center;padding: 5px 0px;border-bottom: 1px solid var(--slate-100)}
.mini--list em{font-style: normal;font-size: 10.5px;font-weight: 700;padding: 1px 7px;border-radius: 999px;background: rgb(254, 243, 199);color: rgb(146, 64, 14)}
.mini--list > div:not(:has(em)){grid-template-columns: 1fr auto}
.mini--checks{align-content: center;gap: 8px}
.mini--checks > div{display: flex;align-items: center;gap: 9px}
.mini--checks span{display: grid;place-items: center;flex: 0 0 auto;width: 18px;height: 18px;border-radius: 50%;border: 1.5px solid var(--slate-400)}
.mini--checks .is-done span{background: var(--teal);border-color: var(--teal);color: var(--white)}
.mini--checks span svg{width: 12px;height: 12px}
.mini--checks .is-done{color: var(--navy-900)}
.mini--lights{align-content: center;gap: 9px}
.mini--lights > div{display: grid;grid-template-columns: auto 1fr auto;gap: 9px;align-items: center}
.mini--lights i{width: 10px;height: 10px;border-radius: 50%}
.mini--lights i.g{background: rgb(22, 163, 74);box-shadow: rgba(22, 163, 74, 0.15) 0px 0px 0px 4px}
.mini--lights i.y{background: rgb(245, 158, 11);box-shadow: rgba(245, 158, 11, 0.18) 0px 0px 0px 4px}
.mini--lights b{font-size: 12px}
.steps-rich{position: relative;display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;margin: 0px;padding: 0px;list-style: none}
.steps-rich::before{content: "";position: absolute;top: 44px;left: 40px;right: 40px;height: 2px;background: linear-gradient(90deg, var(--navy-800), var(--blue-200))}
.step-rich{position: relative;display: grid;gap: 14px;align-content: start;padding: 24px 22px}
.step-rich__head{display: flex;align-items: center;gap: 10px}
.step-rich__head .step__num{box-shadow: 0 0 0 6px var(--white)}
.step-rich__icon{display: grid;place-items: center;width: 34px;height: 34px;border-radius: 10px;background: var(--blue-50);color: var(--navy-800)}
.step-rich__icon svg{width: 18px;height: 18px}
.step-rich__head .chip{margin-left: auto}
.step-rich h3{font-size: 19px}
.step-rich p{color: var(--slate-600);font-size: 15px}
.step-rich__visual .mini{min-height: 128px}
.mini--form{gap: 8px}
.mini--form label{display: grid;gap: 3px;font-size: 11px;color: var(--slate-500)}
.mini--form label span{padding: 6px 9px;border-radius: 8px;border: 1px solid var(--slate-200);background: var(--slate-50);color: var(--navy-900);font-size: 12px}
.mini--form button{justify-self: start;padding: 6px 12px;border: 0px;border-radius: 999px;background: var(--navy-800);color: var(--white);font-style: inherit;font-variant: inherit;font-stretch: inherit;line-height: inherit;font-family: inherit;font-optical-sizing: inherit;font-size-adjust: inherit;font-kerning: inherit;font-feature-settings: inherit;font-variation-settings: inherit;font-language-override: inherit;font-size: 11.5px;font-weight: 700}
.mini--slot{grid-template-columns: auto 1fr;gap: 14px;align-items: center}
.mini__date{display: grid;justify-items: center;padding: 8px 12px;border-radius: 10px;background: var(--navy-800);color: var(--white);line-height: 1.1}
.mini__date b{color: var(--white);font-size: 22px}
.mini__date small{color: rgba(255, 255, 255, 0.75)}
.mini--slot > div:last-child{display: grid;gap: 4px}
.mini__person{display: inline-flex;align-items: center;gap: 7px;margin-top: 4px;color: var(--navy-900);font-weight: 600}
.mini__person img{width: 24px;height: 24px;border-radius: 50%;object-fit: cover;object-position: center 20%}
.mini--doc{gap: 7px;border-top: 3px solid var(--navy-800)}
.mini--doc > div{display: flex;align-items: center;gap: 8px;color: var(--navy-900)}
.mini--doc > div span{display: grid;place-items: center;width: 18px;height: 18px;border-radius: 50%;background: var(--blue-50);color: var(--navy-800);font-size: 10.5px;font-weight: 800}
.mini--months{grid-template-columns: repeat(4, 1fr);gap: 8px;align-content: center}
.mini--months > div{display: grid;justify-items: center;gap: 4px;padding: 10px 4px;border-radius: 10px;border: 1px dashed var(--slate-200);min-height: 58px}
.mini--months .is-done{border-style: solid;border-color: rgba(16, 160, 126, 0.35);background: rgba(16, 160, 126, 0.07);color: var(--teal)}
.mini--months .is-done svg{width: 18px;height: 18px}
.mini--months .is-now{border-style: solid;border-color: var(--navy-800);background: var(--blue-50)}
.mini--months .is-now b{font-size: 11px}
.mini--months p{grid-column: 1 / -1}
.software{background: radial-gradient(60% 80% at 85% 10%, rgba(61, 141, 240, .28), transparent 65%), linear-gradient(160deg, var(--navy-950), var(--navy-900) 60%, #0c2547);color: rgba(255, 255, 255, 0.78)}
.software h2{color: var(--white)}
.software__grid{display: grid;grid-template-columns: 0.82fr 1.18fr;gap: 56px;align-items: center}
.software__copy{display: grid;gap: 20px;justify-items: start}
.software__points{display: grid;gap: 10px;margin: 0px;padding: 0px;list-style: none}
.software__points li{display: flex;align-items: center;gap: 10px;color: rgba(255, 255, 255, 0.85)}
.software__points svg{flex: 0 0 auto;width: 18px;height: 18px;color: var(--blue-200)}
.software .btn svg{width: 16px;height: 16px}
.browser{margin: 0px;overflow: hidden;border-radius: 16px;background: var(--white);box-shadow: rgba(0, 0, 0, 0.45) 0px 40px 80px, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px}
.browser__bar{display: flex;align-items: center;gap: 7px;padding: 10px 14px;background: rgb(238, 242, 247);border-bottom: 1px solid var(--slate-200)}
.browser__bar i{width: 10px;height: 10px;border-radius: 50%;background: rgb(203, 213, 225)}
.browser__bar span{margin-left: 10px;padding: 3px 12px;border-radius: 999px;background: var(--white);color: var(--slate-500);font-size: 12px}
.browser img{width: 100%;height: auto}
.browser figcaption{padding: 8px 14px;font-size: 12px;color: var(--slate-500);border-top: 1px solid var(--slate-100)}
.waitlist{display: flex;align-items: center;justify-content: space-between;gap: 24px;margin-top: 56px;padding: 26px 30px;border-radius: var(--radius);background: rgba(255, 255, 255, 0.06);border: 1px solid rgba(255, 255, 255, 0.12)}
.waitlist > div{display: grid;gap: 6px}
.waitlist h3{color: var(--white)}
.waitlist .btn svg{width: 16px;height: 16px}
@media (max-width: 1080px) {
  .pillars-rich{grid-template-columns: repeat(2, 1fr)}
  .steps-rich{grid-template-columns: repeat(2, 1fr)}
  .steps-rich::before{display: none}
}
@media (max-width: 900px) {
  .software__grid{grid-template-columns: 1fr}
  .dir-final .stage__report{margin: -40px 12px 0px}
  .waitlist{flex-direction: column;align-items: flex-start}
}
@media (max-width: 560px) {
  .pillars-rich, .steps-rich{grid-template-columns: 1fr}
  .dir-final .stage__report{margin: -32px 0px 0px}
  .report-shot__pin{width: 18px;height: 18px;font-size: 10.5px;margin: 6px 0px 0px 6px}
  .report-shot__frame{padding: 6px;border-radius: 14px}
  .pillars-rich__note{text-align: left}
}
.pillar-rich__visual .mini{height: 150px;min-height: 0px;overflow: hidden}
.mini--list{gap: 0px;align-content: center}
.mini--list > div{padding: 4px 0px}
.mini--list p{margin-top: 6px}
.step-rich__head .chip{white-space: nowrap}