@font-face{font-family:'Open Sans';font-weight:400;font-display:swap;src:url('../fonts/open-sans-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Open Sans';font-weight:600;font-display:swap;src:url('../fonts/open-sans-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Open Sans';font-weight:700;font-display:swap;src:url('../fonts/open-sans-latin-700-normal.woff2') format('woff2')}

:root{
  --navy:#0B2A5B;
  --navy-hover:#061A3B;
  --body:#474747;
  --muted:#5C616B;
  --blue:#0176FE;
  --light-blue:#9AC8FF;
  --tint:#F3F8FF;
  --rule:#DCE4EF;
  --raspberry:#D12B5F;
  --raspberry-hover:#B01F4D;
  --navy-rule:#24467C;
  --on-navy:#C8D6EE;
  --field-border:#B9C6D8;
  --lead:#1F2F4A;
  --header-rule:rgba(11,42,91,.15);
}

/* Base */
body{margin:0;background:#FFFFFF;font-family:'Open Sans',system-ui,sans-serif;color:var(--navy)}
a{color:var(--navy)}
a:hover{color:var(--blue)}
a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
picture{display:contents}

.icon{flex:none;width:1em;height:1em;vertical-align:-.125em}
.icon--stat{width:1.15em;height:1.15em;vertical-align:-.2em;stroke-width:2.5}
.btn .icon{stroke-width:2.75}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.skip-link{position:absolute;left:24px;top:-100px;z-index:10;padding:12px 16px;background:#FFFFFF;color:var(--navy);font-size:15px;font-weight:600;border-radius:8px}
.skip-link:focus{top:12px}

.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 24px;background:var(--raspberry);color:#FFFFFF;border:0;font:inherit;font-weight:700;font-size:15px;text-decoration:none;border-radius:8px;cursor:pointer;text-transform:uppercase;transition:background-color .2s ease}
.btn:hover{background:var(--raspberry-hover);color:#FFFFFF}
.btn--secondary{background:var(--navy)}
.btn--secondary:hover{background:var(--navy-hover)}
.link{color:var(--navy);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;font-size:15px}
.link--plain{text-decoration:none}

.section-label{margin:0 0 20px;font-size:13px;font-weight:700;color:var(--raspberry);letter-spacing:.08em;text-transform:uppercase}
.section-label--on-navy{color:var(--light-blue)}
.section-title{margin:0 0 20px;font-size:38px;line-height:1.1;letter-spacing:-.015em;font-weight:700}
.section-text{margin:0;font-size:17px;line-height:1.6;color:var(--body);max-width:46ch}

/* Header */
.band{background:var(--light-blue)}
.site-header{max-width:1200px;margin:0 auto;padding:24px 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
.site-header--ruled{border-bottom:1px solid var(--header-rule)}
.logo{text-decoration:none;display:flex;color:var(--navy)}
.logo img{display:block;width:187px;height:70px}
.nav{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
@media (max-width:479px){.nav{gap:16px 20px}}

/* Home: hero */
.hero{max-width:1200px;margin:0 auto;padding:88px 24px 72px;display:flex;flex-wrap:wrap;gap:40px 48px;align-items:center}
.hero__copy{flex:999 1 540px;min-width:0}
.hero__title{margin:0;font-size:clamp(40px,5.4vw,72px);line-height:1.04;letter-spacing:-.025em;font-weight:700;max-width:15ch}
.hero__body{display:flex;flex-direction:column;gap:36px;margin-top:36px;align-items:flex-start}
.hero__lead{margin:0;font-size:19px;line-height:1.55;color:var(--lead);max-width:50ch}
.hero__actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.hero__image{flex:1 1 340px;max-width:520px;width:100%;height:auto}

/* Home: stats */
.stats{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--tint)}
.stats__inner{max-width:1200px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.stat{padding:36px 32px;border-right:1px solid var(--rule)}
.stat:first-child{padding-left:0}
.stat:last-child{border-right:0}
.stat__figure{margin:0;font-size:44px;font-weight:700;letter-spacing:-.02em;color:var(--blue)}
.stat__text{margin:8px 0 0;font-size:15px;color:var(--muted);line-height:1.5}

@media (max-width:767px){
  .stats__inner{grid-template-columns:1fr}
  .stat,.stat:first-child{padding:28px 0;border-right:0}
  .stat + .stat{border-top:1px solid var(--rule)}
}

/* Home: integrations */
.integrations{max-width:1200px;margin:0 auto;padding:32px 24px;display:flex;flex-wrap:wrap;gap:12px 32px;align-items:baseline;border-bottom:1px solid var(--rule)}
.integrations__label{margin:0;font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.integrations__list{margin:0;font-size:16px;font-weight:600;color:var(--navy);display:flex;flex-wrap:wrap;gap:8px 28px}

/* Home: platform */
.platform{max-width:1200px;margin:0 auto;padding:120px 24px}
.platform__intro{display:flex;flex-wrap:wrap;gap:32px 64px;justify-content:space-between;align-items:center;margin-bottom:72px}
.platform__copy{flex:999 1 480px;min-width:0;max-width:620px}
.platform__image{flex:1 1 280px;max-width:400px;width:100%;height:auto}
.feature-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:56px 48px}
.feature-group{border-top:2px solid var(--navy);padding-top:20px}
.feature-group__title{margin:0 0 16px;font-size:19px;font-weight:700}
.feature-group__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.5;color:var(--body)}

/* Home: automation */
.automation{background:var(--navy);color:#FFFFFF}
.automation__inner{max-width:1200px;margin:0 auto;padding:120px 24px;display:flex;flex-wrap:wrap;gap:64px}
.automation__text{margin:0;font-size:17px;line-height:1.6;color:var(--on-navy)}
.automation__steps{flex:999 1 560px;min-width:0;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0 40px}
.automation__step{display:flex;gap:16px;padding:18px 0;border-top:1px solid var(--navy-rule);font-size:17px;line-height:1.45}
.automation__number{font-size:13px;font-weight:700;color:var(--light-blue);padding-top:3px}

.aside{flex:1 1 320px;max-width:400px}

/* Home: why */
.why{max-width:1200px;margin:0 auto;padding:120px 24px;display:flex;flex-wrap:wrap;gap:64px}
.why .section-title{margin:0}
.why__image{display:block;margin-top:48px;width:100%;max-width:360px;height:auto}
.why__points{flex:999 1 560px;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px 48px}
.why__point-title{margin:0 0 10px;font-size:18px;font-weight:600}
.why__point-text{margin:0;font-size:16px;line-height:1.6;color:var(--body)}

/* Home: closing call to action */
.cta{border-top:1px solid var(--rule)}
.cta__inner{max-width:1200px;margin:0 auto;padding:104px 24px;display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;align-items:flex-end}
.cta__title{margin:0;font-size:clamp(32px,4.4vw,56px);line-height:1.05;letter-spacing:-.015em;font-weight:700;max-width:18ch}
.cta__note{margin:20px 0 0;font-size:15px;line-height:1.55;color:var(--muted);max-width:56ch}

/* Inner pages: demo, thanks, privacy */
.page{max-width:1200px;margin:0 auto;padding:96px 24px 120px;display:flex;flex-wrap:wrap;gap:72px}
.page__aside{flex:1 1 320px;max-width:420px}
.page__title{margin:0 0 24px;font-size:48px;line-height:1.08;letter-spacing:-.02em;font-weight:700}
.page__intro{margin:0 0 32px;font-size:17px;line-height:1.6;color:var(--body)}
.page__image{display:block;margin-top:48px;width:100%;max-width:300px;height:auto}
.notice{background:var(--tint);border-radius:8px;padding:20px 22px}
.notice__title{margin:0 0 8px;font-size:15px;font-weight:700}
.notice__text{margin:0;font-size:15px;line-height:1.6;color:var(--muted)}
.prose{flex:999 1 520px;min-width:0;font-size:17px;line-height:1.6;color:var(--body)}
.prose p{margin:0 0 20px}
.prose h2{margin:40px 0 12px;font-size:22px;line-height:1.3;font-weight:700;color:var(--navy)}
.prose h2:first-child{margin-top:0}
.prose ul{margin:0 0 20px;padding-left:22px}
.prose li{margin:0 0 6px}

/* Demo form */
.demo-form{flex:999 1 520px;min-width:0;align-self:flex-start;align-content:start;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.field--wide{grid-column:1 / -1}
.field__label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.field__input{box-sizing:border-box;width:100%;min-height:48px;padding:12px 14px;font:inherit;font-size:16px;color:var(--navy);background:#FFFFFF;border:1px solid var(--field-border);border-radius:8px}
select.field__input{height:48px}
.field__input:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.field__input--textarea{resize:vertical;line-height:1.5}
.field__hint{margin:8px 0 0;font-size:14px;color:var(--muted)}
.field__error{margin:8px 0 0;font-size:14px;color:var(--raspberry)}
.form-alert{grid-column:1 / -1;margin:0;font-size:15px;font-weight:600;color:var(--raspberry)}
.form-actions{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;border-top:1px solid var(--rule);padding-top:24px}
.form-actions__note{margin:0;font-size:14px;color:var(--muted);max-width:48ch}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Footer */
.site-footer{max-width:1200px;margin:0 auto;padding:28px 24px 40px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;border-top:1px solid var(--rule);font-size:14px;color:var(--muted)}
.site-footer a{color:var(--muted)}
.site-footer__privacy{margin-left:16px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
