.landing-container { width: min(1200px, calc(100% - 100px)); margin-inline: auto; }
.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: #ffffff;
  color: #092238;
  border-bottom: 1px solid #edf1f2;
  transition: box-shadow 180ms ease, border-color 180ms ease;
}
.site-header.is-scrolled {
  box-shadow: 0 10px 28px rgb(9 34 56 / 0.08);
  border-bottom-color: #e5e9eb;
}
.header-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 9px; flex-shrink: 0; color: #092238; text-decoration: none; }
.brand > svg { display: none; }
.brand .brand-logo-img, .brand .chimbo-logo-full { height: 52px; max-width: 190px; width: auto; object-fit: contain; }
.brand-light .brand-logo-img, .brand-light .chimbo-logo-full { background: #fff; border-radius: 12px; padding: 4px 8px; }
.brand strong { display: block; font-size: 29px; line-height: 1.05; letter-spacing: -1.2px; font-weight: 800; }
.brand small { display: block; font-size: 12px; margin-top: 3px; letter-spacing: -.15px; }
.brand-light { color: white; }
.main-nav { display: flex; align-items: center; gap: 28px; }
.main-nav a { font-size: 13px; white-space: nowrap; text-decoration: none; padding-block: 13px; position: relative; }
.main-nav a.active { color: #008650; }
.main-nav a.active::after { content: ''; height: 2px; background: #05c57c; position: absolute; bottom: 4px; left: 0; right: 0; }
.main-nav a:hover, .landing-footer a:hover { color: #008650; }
.header-actions { display: flex; align-items: center; gap: 15px; }
.landing-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 14px 26px; background: #08b976; color: #fff; border: 1px solid #08b976; border-radius: 16px; font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .18s, transform .18s; white-space: nowrap; }
.landing-button:hover { background: #009d63; border-color: #009d63; transform: translateY(-1px); }
.landing-button.outline { background: transparent; border-color: #0ab77b; color: #092238; }
.landing-button.outline:hover { background: #dcf8ee; }
.header-actions .landing-button { min-height: 44px; padding: 11px 21px; border-radius: 13px; font-size: 13px; }
.header-actions .login-link { color: #008855; }
.theme-toggle, .menu-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; border: 0; background: transparent; cursor: pointer; border-radius: 9px; }
.theme-toggle:hover, .menu-toggle:hover { background: #e9f8f2; }
.menu-toggle, .main-nav .mobile-register { display: none; }
.back-home { padding: 12px 0; font-size: 14px; }
.landing { background: #fff; color: #092238; font-family: Arial, Helvetica, sans-serif; }
.landing section[id], .landing details[id] { scroll-margin-top: 96px; }
.landing-hero { position: relative; background: #051d2c; color: white; isolation: isolate; }
.hero-image { position: absolute; inset: 0 0 0 auto; width: min(1100px, 100%); z-index: -2; overflow: hidden; }
.hero-image img { object-fit: contain; object-position: right center; }
.hero-inner { min-height: 510px; display: flex; align-items: center; position: relative; }
.hero-copy { width: 52%; padding: 58px 0 48px; }
.hero-eyebrow { display: inline-flex; gap: 9px; align-items: center; font-size: 12px; letter-spacing: .7px; font-weight: 500; padding: 8px 13px; border-radius: 30px; background: #103541b3; color: #a9efd7; margin: 0 0 20px; }
.hero-eyebrow span { width: 8px; height: 8px; border-radius: 50%; background: #12cc85; }
.hero-copy h1 { font-size: clamp(39px, 4.45vw, 60px); line-height: 1.08; font-weight: 800; letter-spacing: -2.2px; margin: 0; white-space: nowrap; }
.hero-copy h1 em { color: #05c27b; font-style: normal; }
.hero-description { font-size: 19px; line-height: 1.48; max-width: 520px; margin: 20px 0 28px; padding-right: 12px; }
.hero-actions { display: flex; gap: 18px; align-items: center; }
.hero-actions .landing-button { min-height: 59px; padding-inline: 28px; }
.hero-actions .video-button { background: #071e2da8; border-color: #74bea9; color: white; }
.video-button:hover { background: #143d46; }
.play-dot { display: flex; align-items: center; justify-content: center; background: #bde9df; color: #008558; border-radius: 50%; width: 19px; height: 19px; }
.play-dot svg { width: 15px; height: 15px; fill: currentColor; stroke-width: 1; }
.hero-assurances { display: flex; align-items: center; gap: 22px; margin-top: 39px; font-size: 11px; white-space: nowrap; }
.hero-assurances span { display: flex; align-items: center; gap: 6px; }
.hero-assurances svg { background: #0b895f; border-radius: 50%; width: 20px; height: 20px; padding: 4px; color: #caffeb; }
.hero-image-caption { position: absolute; bottom: 10px; right: 30px; color: #bed5d1; font-size: 10px; }
.trust-strip { background: #f6f8fa; border-bottom: 1px solid #edf1f3; padding: 30px 0 28px; }
.trust-strip h2 { font-size: 17px; font-weight: 700; margin: 0 0 20px; letter-spacing: -.4px; }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.trust-item { display: flex; gap: 15px; align-items: center; }
.icon-bubble { width: 57px; height: 57px; background: #d5f5e9; color: #034337; display: flex; align-items: center; justify-content: center; border-radius: 50%; flex-shrink: 0; }
.icon-bubble svg { width: 29px; height: 29px; fill: #29c59155; }
.trust-item strong { font-size: 22px; letter-spacing: -.65px; }
.trust-item p { font-size: 13px; margin-top: 3px; }
.how-section { padding-block: 27px 32px; }
.section-heading { text-align: center; }
.section-eyebrow { color: #338b83; font-size: 13px; font-weight: 700; letter-spacing: 1.4px; margin-bottom: 8px; }
.section-heading h2 { font-size: 31px; line-height: 1.2; font-weight: 750; letter-spacing: -1px; margin: 0 0 9px; }
.section-heading > p:last-child { font-size: 15px; }
.steps-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 35px; padding: 0; margin: 24px 0 0; list-style: none; }
.steps-grid li { position: relative; text-align: center; }
.step-icon { width: 64px; height: 64px; margin: 0 auto 10px; border-radius: 50%; background: #cef4e6; display: flex; align-items: center; justify-content: center; }
.step-icon svg { width: 31px; height: 31px; color: #07513f; fill: #14c38d66; }
.steps-grid h3 { font-size: 17px; font-weight: 750; letter-spacing: -.5px; margin-bottom: 8px; }
.steps-grid p { font-size: 14px; line-height: 1.5; white-space: pre-line; }
.step-arrow { position: absolute; right: -33px; top: 25px; color: #acbfc3; }
.step-arrow svg { width: 28px; }
.steps-grid li:last-child .step-arrow { display: none; }
.audience-section { width: min(1260px, calc(100% - 54px)); margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.audience-card { position: relative; min-width: 0; min-height: 384px; border-radius: 15px; overflow: hidden; isolation: isolate; }
.audience-card > img { object-fit: cover; z-index: -2; }
.audience-card::before { content: ''; position: absolute; inset: 0; z-index: -1; }
.broker-card { color: white; background: #082331; }
.broker-card::before { background: linear-gradient(90deg, #061e2ceb 0%, #061e2cb8 37%, #061e2c00 75%); }
.customer-card { background: #daf4ee; }
.customer-card::before { background: linear-gradient(90deg, #e5f8f0f0 0%, #e5f8f0c9 36%, #e5f8f000 75%); }
.audience-copy { padding: 28px 28px 30px; position: relative; z-index: 1; }
.broker-card .section-eyebrow { color: #26e4a0; }
.customer-card .section-eyebrow { color: #007b5c; }
.audience-copy h2 { font-size: 29px; font-weight: 750; line-height: 1.18; letter-spacing: -1.1px; margin-bottom: 22px; }
.feature-checks { margin: 0 0 24px; padding: 0; list-style: none; display: grid; gap: 9px; }
.feature-checks li { font-size: 13px; display: flex; gap: 9px; align-items: center; }
.feature-checks li > span { background: #408f82c9; border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; flex-shrink: 0; }
.feature-checks svg { width: 13px; height: 13px; stroke-width: 2.5; }
.customer-card .feature-checks li > span { background: #b8ecd9; color: #008a5b; }
.audience-copy .landing-button { min-height: 49px; padding: 12px 24px; border-radius: 12px; font-size: 13px; }
.feature-note { position: absolute; bottom: 18px; right: 14px; background: #ffffffde; color: #0c2d35; border-radius: 10px; display: flex; align-items: center; gap: 10px; padding: 13px; font-size: 12px; line-height: 1.5; box-shadow: 0 4px 24px #061e2c10; }
.feature-note svg { color: #069568; }
.app-section { display: grid; grid-template-columns: 240px 1fr 360px; gap: 28px; min-height: 192px; align-items: center; overflow: hidden; }
.app-preview { height: 194px; position: relative; align-self: end; }
.mini-phone { position: absolute; left: 18px; top: 28px; height: 220px; width: 98px; border: 5px solid #080e12; border-radius: 19px; background: #062230; color: white; transform: rotate(-6deg); display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 1px 2px 3px #667277; overflow: hidden; }
.phone-speaker { position: absolute; top: 0; width: 42px; height: 10px; border-radius: 0 0 8px 8px; background: #080e12; }
.mini-logo { color: #09c285; font-size: 41px; font-weight: 800; line-height: 1; }
.mini-phone strong { font-size: 14px; }.mini-phone small { font-size: 6px; }.phone-wave { height: 80px; width: 130px; border-radius: 50%; background: #0aa477; position: absolute; bottom: -50px; transform: rotate(-25deg); }
.mini-phone.second { left: 118px; top: 35px; background: #f7fcfa; color: #0a2937; transform: rotate(5deg); gap: 5px; }.mini-phone.second > svg { color: #08a974; }.mini-phone.second > span:not(.phone-speaker) { font-size: 9px; }.mini-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }.mini-grid span { background: #d7f4e9; border-radius: 4px; padding: 5px; }.mini-grid svg { width: 19px; height: 19px; }
.app-copy h2 { font-size: 24px; font-weight: 750; letter-spacing: -.7px; margin-bottom: 7px; }.app-copy > p { font-size: 14px; }
.app-badges { display: flex; gap: 10px; margin-top: 17px; }.app-badges > span { background: #071b27; color: white; display: flex; align-items: center; gap: 8px; border-radius: 6px; padding: 8px 10px; }.app-badges > span > span { font-size: 7px; letter-spacing: .4px; }.app-badges strong { display: block; font-size: 15px; letter-spacing: -.4px; }.app-badges svg { color: #16cf91; }
.app-benefits { display: flex; justify-content: space-around; border-left: 1px solid #e1e9eb; gap: 20px; padding-left: 25px; text-align: center; }.app-benefits div > span { height: 61px; width: 61px; border-radius: 50%; border: 1px solid #c9dce0; display: flex; align-items: center; justify-content: center; margin: 0 auto 8px; }.app-benefits svg { width: 30px; height: 30px; fill: #0bc78844; }.app-benefits p { font-size: 14px; }
.closing-cta { background: radial-gradient(ellipse at 70% 130%, #057458 0%, transparent 60%), #061f2e; color: white; padding: 32px 0; }.closing-cta > div { display: flex; justify-content: space-between; align-items: center; gap: 30px; }.closing-cta h2 { font-size: 24px; font-weight: 750; letter-spacing: -.65px; margin-bottom: 6px; }.closing-cta p { font-size: 14px; }.closing-cta > div > div { text-align: center; }.closing-cta .landing-button { min-width: 174px; }
.details-section { display: flex; gap: 24px; padding-block: 20px 0; }.details-section details { flex: 1; min-width: 0; font-size: 12px; }.details-section summary { cursor: pointer; padding: 12px 0; color: #486176; }.details-section details > p, .details-section details > div { padding: 10px 0; line-height: 1.7; max-width: 550px; }.details-section h3 { margin-top: 12px; font-weight: 700; }
.landing-footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 88px; padding-block: 20px; font-size: 11px; }.landing-footer nav { display: flex; gap: 25px; }.landing-footer nav a { padding-block: 12px; }.landing-footer > p:last-child { text-align: right; line-height: 1.65; }.footer-motto { font-size: 16px; font-weight: 700; }.footer-motto span { color: #009963; }
.brand-video-dialog { margin: auto; width: min(720px, calc(100% - 32px)); max-height: 90dvh; padding: 20px; border: 1px solid #2b5964; border-radius: 18px; background: #071e2d; color: white; }.brand-video-dialog::backdrop { background: #02131dce; backdrop-filter: blur(5px); }.video-dialog-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; }.video-dialog-heading h2 { font-size: 20px; font-weight: 700; }.video-dialog-heading button { cursor: pointer; padding: 10px; }.brand-video-dialog video { display: block; width: 100%; max-height: 65dvh; }.brand-video-dialog > p { text-align: center; margin-top: 12px; color: #a9efd7; }
[data-landing-theme='dark'] .site-header { background: #0b2432; color: #eaf8f3; border-color: #24434a; }
[data-landing-theme='dark'] .site-header.is-scrolled { box-shadow: 0 10px 28px rgb(0 0 0 / 0.35); }
[data-landing-theme='dark'] .site-header .brand { color: #fff; }
[data-landing-theme='dark'] .trust-strip { background: #102f3b; border-color: #24434a; }
[data-landing-theme='dark'] .details-section summary { color: #b5d2d0; }
[data-landing-theme='dark'] .main-nav a.active { color: #32e0a2; }
[data-landing-theme='dark'] .customer-card { color: #092238; }
[data-landing-theme='dark'] .main-nav.is-open { background: #102f3b; }
[data-landing-theme='dark'] .header-actions .login-link { color: #39dca5; }
[data-landing-theme='dark'] .landing { background: #0b2432; color: #eaf8f3; }
@media (min-width: 1450px) { .hero-inner { min-height: 570px; } }
@media (max-width: 1150px) { .landing-container { width: calc(100% - 64px); }.header-inner { gap: 18px; }.main-nav { gap: 20px; }.header-actions { gap: 8px; }.brand strong { font-size: 26px; }.brand > svg { width: 43px; }.header-actions .landing-button { padding-inline: 16px; }.main-nav a { font-size: 12px; }.hero-copy { width: 53%; }.hero-inner { min-height: 485px; }.hero-copy h1 { font-size: 47px; }.hero-description { font-size: 18px; }.hero-assurances { gap: 13px; font-size: 10px; }.trust-grid { gap: 16px; }.trust-item { gap: 10px; }.trust-item strong { font-size: 20px; }.trust-item p { font-size: 11px; }.audience-copy { padding: 27px 25px; }.audience-copy h2 { font-size: 27px; }.feature-checks li { font-size: 12px; }.feature-note { font-size: 10px; padding: 10px; }.app-section { grid-template-columns: 220px 1fr 300px; gap: 20px; }.app-benefits { padding-left: 15px; gap: 12px; }.app-copy h2 { font-size: 22px; }.closing-cta h2 { font-size: 22px; }.closing-cta .brand strong { font-size: 25px; } }
@media (max-width: 980px) { .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; padding: 20px 32px; background: white; box-shadow: 0 12px 20px #09223814; border-top: 1px solid #dce8e4; }.main-nav.is-open { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px; }.main-nav a { font-size: 15px; }.main-nav .mobile-register { display: block; color: #008855; }.menu-toggle { display: inline-flex; }.hero-copy h1 { font-size: 40px; letter-spacing: -1.5px; }.hero-description { font-size: 16px; }.hero-actions { gap: 10px; }.hero-actions .landing-button { padding-inline: 17px; min-height: 53px; font-size: 13px; }.hero-assurances { flex-wrap: wrap; gap: 10px 15px; max-width: 380px; }.hero-inner { min-height: 460px; }.trust-item strong { font-size: 17px; }.icon-bubble { width: 45px; height: 45px; }.trust-grid { grid-template-columns: 1fr 1fr; gap: 20px 45px; }.audience-copy { padding: 25px 20px; }.audience-copy h2 { font-size: 24px; }.feature-note { display: none; }.audience-card { min-height: 360px; }.broker-card::before { background: linear-gradient(90deg,#061e2cfa,#061e2cc9 47%,#061e2c22); }.customer-card::before { background: linear-gradient(90deg,#e5f8f0fa,#e5f8f0d9 47%,#e5f8f022); }.app-section { grid-template-columns: 180px 1fr; gap: 15px; }.app-preview { grid-row: span 2; height: 225px; }.mini-phone { left: 0; width: 86px; }.mini-phone.second { left: 84px; }.app-copy { padding-top: 25px; }.app-benefits { border-left: 0; justify-content: flex-start; padding: 0 0 20px; gap: 40px; }.app-benefits div > span { height: 44px; width: 44px; }.app-benefits svg { width: 23px; height: 23px; }.app-benefits p { font-size: 11px; }.closing-cta > div { flex-wrap: wrap; justify-content: center; gap: 22px; }.closing-cta .brand { display: none; }.landing-footer { flex-wrap: wrap; }.footer-motto { display: none; } }
@media (max-width: 760px) { .landing-container { width: calc(100% - 40px); }.header-inner { min-height: 72px; gap: 10px; }.hero-inner { min-height: auto; display: block; }.hero-copy { width: 100%; padding: 36px 0 0; }.hero-copy h1 { font-size: clamp(36px, 7vw, 53px); }.hero-description { max-width: 570px; font-size: 17px; padding-right: 0; }.landing-hero { padding-bottom: 330px; }.hero-image { top: auto; height: 350px; }.hero-image img { object-fit: cover; object-position: right center; width: 155% !important; max-width: none; left: -55% !important; }.hero-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(#051d2c, transparent 24%); }.hero-assurances { max-width: none; margin-top: 25px; font-size: 10px; gap: 12px; }.hero-image-caption { bottom: 8px; right: 20px; font-size: 9px; }.hero-actions .landing-button { font-size: 14px; padding-inline: 23px; }.trust-strip { padding: 24px 0; }.trust-strip h2 { font-size: 16px; }.trust-grid { gap: 20px; }.trust-item strong { font-size: 18px; }.trust-item p { font-size: 11px; line-height: 1.4; }.how-section { padding-block: 30px; }.section-heading h2 { font-size: 27px; }.section-heading > p:last-child { font-size: 14px; }.steps-grid { gap: 25px 20px; grid-template-columns: 1fr 1fr; }.step-arrow { display: none; }.steps-grid h3 { font-size: 16px; }.steps-grid p { font-size: 13px; }.audience-section { width: calc(100% - 32px); grid-template-columns: 1fr; gap: 16px; }.audience-card { min-height: 380px; }.audience-copy { padding: 27px; }.audience-copy h2 { font-size: 29px; }.feature-checks li { font-size: 13px; }.broker-card::before { background: linear-gradient(90deg,#061e2cef,#061e2cb8 42%,#061e2c00); }.customer-card::before { background: linear-gradient(90deg,#e5f8f0f2,#e5f8f0c9 42%,#e5f8f000); }.feature-note { display: flex; }.app-section { grid-template-columns: 165px 1fr; }.app-badges { flex-wrap: wrap; gap: 6px; }.app-copy h2 { font-size: 22px; }.app-benefits { gap: 25px; }.closing-cta { padding: 30px 0; }.closing-cta h2 { font-size: 24px; line-height: 1.25; }.closing-cta p { line-height: 1.6; margin-top: 9px; }.details-section { flex-direction: column; gap: 0; }.landing-footer { justify-content: center; gap: 10px; padding-block: 20px; }.landing-footer > p:last-child { text-align: center; width: 100%; } }
@media (max-width: 480px) { .landing-container { width: calc(100% - 36px); }.brand { gap: 6px; }.brand > svg { width: 38px; height: 40px; }.brand strong { font-size: 24px; }.brand small { font-size: 10px; }.header-actions { gap: 3px; }.header-create { display: none; }.header-actions .login-link { min-height: 40px; padding: 8px 13px; font-size: 12px; border-radius: 11px; }.theme-toggle { min-width: 36px; }.theme-toggle svg { width: 19px; }.menu-toggle { min-width: 36px; }.hero-copy { padding-top: 31px; }.hero-eyebrow { font-size: 10px; margin-bottom: 18px; }.hero-copy h1 { font-size: clamp(32px, 8.8vw, 42px); letter-spacing: -1.4px; }.hero-description { font-size: 16px; margin: 18px 0 23px; line-height: 1.6; }.hero-actions { gap: 10px; }.hero-actions .landing-button { padding-inline: 16px; font-size: 12px; min-height: 51px; gap: 8px; border-radius: 12px; }.hero-actions .landing-button > svg { width: 19px; }.hero-assurances { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 4px; margin-top: 23px; }.hero-assurances span:last-child { grid-column: span 2; }.landing-hero { padding-bottom: 300px; }.hero-image { height: 315px; }.hero-image img { width: 165% !important; left: -65% !important; }.trust-strip h2 { font-size: 15px; line-height: 1.4; }.trust-grid { gap: 19px 12px; }.trust-item { gap: 8px; }.icon-bubble { width: 40px; height: 40px; }.icon-bubble svg { width: 23px; }.trust-item strong { font-size: 15px; letter-spacing: -.5px; }.trust-item p { font-size: 10px; }.section-heading h2 { font-size: 25px; }.section-eyebrow { font-size: 11px; }.steps-grid { gap: 23px 15px; }.steps-grid h3 { font-size: 15px; }.steps-grid p { font-size: 12px; }.step-icon { width: 56px; height: 56px; }.audience-card { min-height: 410px; }.audience-card > img { object-position: 62% center; }.audience-copy { padding: 24px 20px; }.audience-copy h2 { font-size: 27px; }.feature-checks li { font-size: 11px; gap: 7px; }.feature-checks { gap: 11px; }.feature-note { bottom: 16px; right: 14px; font-size: 10px; }.audience-copy .landing-button { padding-inline: 17px; font-size: 12px; }.broker-card::before { background: linear-gradient(90deg,#061e2cf2,#061e2cc0 47%,#061e2c10); }.customer-card::before { background: linear-gradient(90deg,#e5f8f0fa,#e5f8f0cf 47%,#e5f8f010); }.app-section { display: flex; flex-direction: column; gap: 0; padding-block: 25px; text-align: center; overflow: visible; }.app-preview { display: none; }.app-copy { padding-top: 0; }.app-badges { justify-content: center; margin-top: 16px; }.app-benefits { padding: 24px 0 0; gap: 40px; }.app-benefits div > span { width: 53px; height: 53px; }.closing-cta h2 { font-size: 22px; }.closing-cta p { font-size: 13px; }.closing-cta .landing-button { min-height: 49px; font-size: 14px; }.landing-footer nav { gap: 23px; }.main-nav { padding-inline: 20px; } }
@media (prefers-reduced-motion: reduce) { .landing-button:hover { transform: none; } }
@media (max-width: 360px) { .hero-copy h1 { font-size: 30px; }.hero-actions { gap: 8px; }.hero-actions .landing-button { padding-inline: 10px; font-size: 11px; gap: 6px; }.feature-note { display: none; } }
