/* EZ Pro marketing page */

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #fff;
  font-family: 'Manrope', system-ui, sans-serif;
  color: #0A132B;
  -webkit-font-smoothing: antialiased;
}

a { color: #1D4FD7; text-decoration: none; }
a:hover { color: #12306E; }

button { font-family: inherit; }

/* Material Symbols icon glyphs */
.ms {
  font-family: 'Material Symbols Rounded';
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* ---------- Layout ---------- */

.cs-shell { max-width: 1280px; margin: 0 auto; padding: 0 20px 64px; }

.cs-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding: 20px 0 18px; }
.cs-brand { flex: 0 0 auto; display: flex; align-items: center; gap: 11px; }
.cs-mark { height: 60px; width: 60px; flex: 0 0 auto; }
.cs-wordmark { height: 48px; width: auto; flex: 0 0 auto; }
.cs-navlinks { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 22px; }
.cs-navlinks a, .cs-signin { font-size: 14.5px; font-weight: 700; color: #475467; }
.cs-signin { flex: 0 0 auto; }

.btn-primary {
  display: flex; align-items: center; gap: 8px;
  border: none; cursor: pointer; text-decoration: none;
  background: linear-gradient(135deg, #2563EB, #1D4FD7);
  color: #fff;
}
.btn-primary .btn-label { font-weight: 800; color: #fff; white-space: nowrap; }
.btn-primary .ms { color: #fff; }

.cs-cta {
  flex: 0 0 auto; height: 48px; padding: 0 22px; border-radius: 14px;
  box-shadow: 0 14px 28px -16px rgba(29, 79, 215, .9);
  margin-left: auto;
}
.cs-cta .btn-label { font-size: 15px; letter-spacing: -.3px; }
.cs-cta .ms { font-size: 19px; }

/* ---------- Hero ---------- */

.cs-hero {
  border-radius: 28px;
  background: linear-gradient(165deg, #EAF2FF 0%, #F4F8FE 55%, #FFFFFF 100%);
  padding: 34px; display: flex; flex-direction: column; gap: 28px;
}
.cs-hero-top { display: flex; flex-wrap: wrap; gap: 30px; align-items: center; }
.cs-herocopy { flex: 1 1 440px; min-width: min(100%, 440px); container-type: inline-size; padding-top: 14px; }
.cs-h1 { font-size: clamp(31px, 9.6cqw, 54px); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; color: #0A132B; }
.cs-h1 .accent { color: #2563EB; }
.cs-sub { font-size: clamp(20px, 4.3cqw, 24px); font-weight: 800; letter-spacing: -.8px; line-height: 1.3; color: #0A132B; margin-top: 18px; max-width: 520px; text-wrap: pretty; }
.cs-lede { font-size: 16.5px; font-weight: 600; line-height: 1.6; color: #475467; margin-top: 12px; max-width: 500px; text-wrap: pretty; }
.cs-lede strong { font-weight: 800; color: #0A132B; }

.cs-emailrow { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; max-width: 520px; scroll-margin-top: 24px; }
.cs-emailrow input {
  flex: 1 1 240px; min-width: 0; height: 60px; border-radius: 16px;
  border: 1.5px solid #D3E1FA; background: #fff; padding: 0 18px;
  font-family: inherit; font-size: 16px; font-weight: 700; color: #0A132B; outline: none;
}
.cs-emailrow input:focus { border-color: #2563EB; }
.cs-emailrow button {
  flex: 0 0 auto; height: 60px; padding: 0 26px; border-radius: 16px; gap: 9px;
  box-shadow: 0 18px 34px -16px rgba(29, 79, 215, .95);
}
.cs-emailrow .btn-label { font-size: 17px; letter-spacing: -.4px; }
.cs-emailrow .ms { font-size: 21px; }

.cs-subscribe { margin: 0; }
.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; }
.cs-status { margin: 10px 0 0; font-size: 13.5px; font-weight: 700; color: #157F3C; min-height: 0; }
.cs-status:empty { display: none; }
.cs-status[data-error], .cs-status.error { color: #B42318; }

.cs-trust { font-size: 13.5px; font-weight: 700; color: #667085; margin-top: 11px; }
.cs-alt { font-size: 13.5px; font-weight: 700; color: #667085; margin-top: 7px; }
.cs-alt a { font-weight: 800; }

.cs-rule { display: flex; align-items: center; gap: 8px; margin-top: 38px; }
.cs-rule span:first-child { flex: 0 0 auto; font-size: 10.5px; font-weight: 800; letter-spacing: 1.3px; color: #667085; }
.cs-rule span:last-child { flex: 1; height: 1px; background: #DCE5F2; }

/* Marquee: three rows drifting at once, middle row against the other two */
.cs-marquee {
  margin-top: 12px; display: flex; flex-direction: column; gap: 8px; overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%);
}
.cs-track { display: flex; gap: 8px; width: max-content; animation: ezmarquee 38s linear infinite; }
.cs-track.back { animation: ezmarqueeback 44s linear infinite; }
.cs-track.slow { animation: ezmarquee 50s linear infinite; }
.cs-marquee:hover .cs-track { animation-play-state: paused; }
.cs-chip {
  flex: 0 0 auto; display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px;
  border-radius: 999px; background: #fff; border: 1.5px solid #E5E9F0;
}
.cs-chip .ms { font-size: 17px; color: #1D4FD7; flex: 0 0 auto; }
.cs-chip span:last-child { font-size: 13px; font-weight: 800; letter-spacing: -.2px; color: #0A132B; white-space: nowrap; }

/* Hero visual column */
.cs-visual { flex: 1 1 524px; min-width: min(100%, 524px); display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; justify-content: center; }

/* Phone */
.phone { flex: 0 0 auto; width: 264px; border-radius: 40px; background: #0A0A0A; padding: 9px; box-shadow: 0 34px 70px -26px rgba(10, 19, 43, .6); }
.phone-screen { position: relative; border-radius: 32px; overflow: hidden; background: #F4F7FB; height: 586px; display: flex; flex-direction: column; }
.phone-island { position: absolute; top: 9px; left: 50%; margin-left: -31px; width: 62px; height: 19px; border-radius: 999px; background: #0A0A0A; z-index: 3; }
.phone-status { flex: 0 0 auto; padding: 9px 16px 0; display: flex; align-items: center; gap: 5px; }
.phone-status .time { flex: 1; min-width: 0; font-size: 11px; font-weight: 800; letter-spacing: -.2px; color: #0A132B; }
.phone-status .spacer { flex: 1; }
.phone-status .ms { font-size: 14px; color: #0A132B; }
.phone-body { flex: 1; min-height: 0; overflow: hidden; padding: 9px 13px 0; }

.app-top { display: flex; align-items: center; gap: 7px; }
.app-avatar { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg, #2563EB, #10327F); display: flex; align-items: center; justify-content: center; }
.app-avatar span { font-size: 8.5px; font-weight: 800; letter-spacing: -.2px; color: #fff; }
.app-company { flex: 1; min-width: 0; font-size: 11.5px; font-weight: 800; letter-spacing: -.3px; color: #0A132B; }
.app-iconbtn { position: relative; width: 24px; height: 24px; flex: 0 0 auto; border-radius: 50%; border: 1.5px solid #E5E9F0; background: #fff; display: flex; align-items: center; justify-content: center; }
.app-iconbtn .ms { font-size: 14px; color: #0A132B; }
.app-iconbtn .badge { position: absolute; top: 1px; right: 2px; width: 6px; height: 6px; border-radius: 50%; background: #D92D20; border: 1.5px solid #fff; }

.app-greet { font-size: 18px; font-weight: 800; letter-spacing: -.7px; color: #0A132B; margin-top: 9px; }
.app-greet .accent { color: #2563EB; }
.app-meta { display: flex; align-items: center; gap: 9px; margin-top: 4px; }
.app-meta > span { display: flex; align-items: center; gap: 3px; }
.app-meta .ms { font-size: 12px; color: #2563EB; }
.app-meta .ms.sun { color: #F5A524; }
.app-meta small { font-size: 9.5px; font-weight: 800; color: #475467; }

.mic-stage { display: flex; flex-direction: column; align-items: center; margin-top: 4px; }
.mic-ring { position: relative; width: 100%; height: 120px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.mic-halo { position: absolute; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(90, 166, 255, .40) 0%, rgba(90, 166, 255, 0) 70%); filter: blur(5px); animation: ezhalo 3.6s ease-in-out infinite; }
.mic-orbit-track { position: absolute; width: 112px; height: 112px; border-radius: 50%; border: 1.5px solid #E1EAF7; }
.mic-orbit { position: absolute; width: 112px; height: 112px; animation: ezorbit 9s linear infinite; }
.mic-orbit span { position: absolute; top: -5px; left: 50%; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: #3BE38B; box-shadow: 0 0 10px 1px rgba(59, 227, 139, .7); }
.wave { flex: 0 0 auto; display: flex; align-items: center; gap: 3px; height: 46px; }
.wave span { width: 3px; border-radius: 999px; background: #9CC0F5; animation: ezwave 1.5s ease-in-out infinite; }
.mic-btn {
  position: relative; flex: 0 0 auto; width: 92px; height: 92px; border-radius: 50%; border: 5px solid #fff;
  background: radial-gradient(120% 120% at 34% 24%, #6FA0FA 0%, #2563EB 58%, #10327F 100%);
  animation: ezmic 2.6s ease-out infinite;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 20px 40px -18px rgba(7, 27, 84, .85);
}
.mic-btn .ms { font-size: 22px; color: #fff; }
.mic-btn .l1 { font-size: 13.5px; font-weight: 800; letter-spacing: -.4px; color: #fff; margin-top: 2px; }
.mic-btn .l2 { font-size: 8.5px; font-weight: 800; letter-spacing: -.05px; color: rgba(221, 234, 255, .92); margin-top: 1px; }
.mic-prompt { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.mic-prompt span:first-child { font-size: 12px; font-weight: 800; letter-spacing: -.3px; color: #475467; white-space: nowrap; }
.mic-prompt span:last-child { font-size: 9.5px; font-weight: 800; letter-spacing: 1.1px; color: #2563EB; }

.invite { margin-top: 8px; border-radius: 16px; background: linear-gradient(160deg, #2A62D8 0%, #1D4FD7 52%, #12306E 100%); padding: 9px; box-shadow: 0 18px 38px -20px rgba(7, 27, 84, .9); }
.invite-inner { border-radius: 11px; border: 1px dashed rgba(155, 190, 255, .5); padding: 8px 9px 9px; }
.invite-kicker { display: flex; align-items: center; gap: 5px; }
.invite-kicker .ms { font-size: 12px; color: #9BD0FF; }
.invite-kicker span:last-child { font-size: 8.5px; font-weight: 800; letter-spacing: 1.1px; color: #9BD0FF; }
.invite-h { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.45px; color: #fff; margin-top: 5px; }
.invite-p { display: block; font-size: 9.5px; font-weight: 600; line-height: 1.45; color: #DCE9FF; margin-top: 3px; text-wrap: pretty; }
.invite-btn { display: flex; align-items: center; justify-content: center; gap: 5px; height: 29px; border-radius: 10px; background: linear-gradient(135deg, #22A85A, #127A3F); margin-top: 8px; box-shadow: 0 12px 24px -14px rgba(7, 60, 30, .9); }
.invite-btn .ms { font-size: 14px; color: #fff; }
.invite-btn span:last-child { font-size: 11px; font-weight: 800; letter-spacing: -.3px; color: #fff; }
.invite-note { display: block; text-align: center; font-size: 8px; font-weight: 700; color: #A9C6F7; margin-top: 6px; }
.invite-or { display: flex; align-items: center; gap: 5px; margin-top: 8px; }
.invite-or i { flex: 1; height: 1px; background: rgba(155, 190, 255, .35); }
.invite-or span { flex: 0 0 auto; font-size: 8px; font-weight: 800; letter-spacing: 1px; color: #A9C6F7; }
.invite-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 8px; }
.invite-grid span { min-width: 0; display: flex; align-items: center; gap: 3px; height: 20px; padding: 0 5px; border-radius: 7px; background: none; border: none; overflow: hidden; }
.invite-grid .ms { font-size: 9px; color: #BFD8FF; flex: 0 0 auto; background: none; border: none; }
.invite-grid b { flex: 1; min-width: 0; font-size: 7px; font-weight: 800; letter-spacing: -.2px; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.tabbar { flex: 0 0 auto; position: relative; height: 50px; background: #fff; border-top: 1px solid #E5E9F0; display: flex; align-items: flex-start; padding: 6px 8px 0; }
.tab { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 1px; }
.tab .ms { font-size: 18px; color: #98A2B3; }
.tab span:last-child { font-size: 8px; font-weight: 800; color: #98A2B3; }
.tab.active .ms, .tab.active span:last-child { color: #2563EB; }
.tab-mic {
  position: absolute; left: 50%; top: -22px; margin-left: -25px; width: 50px; height: 50px; border-radius: 50%; border: 3px solid #fff;
  background: radial-gradient(120% 120% at 34% 24%, #6FA0FA 0%, #2563EB 58%, #10327F 100%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 14px 28px -12px rgba(7, 27, 84, .85); animation: ezmic 2.6s ease-out infinite;
}
.tab-mic .ms { font-size: 16px; color: #fff; }
.tab-mic span:last-child { font-size: 7.5px; font-weight: 800; letter-spacing: -.1px; color: #fff; margin-top: 1px; }

/* Receipt card */
.receipt { flex: 1 1 212px; min-width: 206px; display: flex; flex-direction: column; gap: 9px; background: #FBFCFE; border: 1.5px solid #E5E9F0; border-radius: 22px; padding: 16px 15px 17px; box-shadow: 0 10px 26px -22px rgba(10, 19, 43, .5); }
.kicker { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: 1.2px; color: #667085; }
.said { display: block; background: linear-gradient(135deg, #2563EB, #1D4FD7); border-radius: 18px; padding: 15px 16px 16px; box-shadow: 0 18px 36px -18px rgba(29, 79, 215, .95); }
.said span { display: block; font-size: 15px; font-weight: 800; letter-spacing: -.4px; line-height: 1.42; color: #fff; text-wrap: pretty; }
.divider { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.divider .label { flex: 0 0 auto; font-size: 9.5px; font-weight: 800; letter-spacing: 1.2px; color: #1D4FD7; }
.divider .line { flex: 1; height: 1px; background: #E5E9F0; }
.divider .dot { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: #2563EB; animation: ezdot 1.8s ease-in-out infinite; }
.done-list { display: flex; flex-direction: column; gap: 9px; }
.done { display: flex; align-items: flex-start; gap: 10px; background: #fff; border: 1.5px solid #B7DFC6; border-radius: 15px; padding: 12px 13px 13px; box-shadow: 0 10px 26px -20px rgba(10, 19, 43, .5); }
.done.blue { border-color: #C7D9FB; }
.done .ms { font-size: 19px; color: #1F9D4D; flex: 0 0 auto; }
.done.blue .ms { color: #2563EB; }
.done > span:last-child { flex: 1; min-width: 0; }
.done b { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.3px; color: #0A132B; }
.done small { display: block; font-size: 11.5px; font-weight: 600; color: #667085; margin-top: 3px; line-height: 1.4; text-wrap: pretty; }
.approved { display: block; background: linear-gradient(150deg, #1B8B4A 0%, #0F6836 100%); border-radius: 18px; padding: 14px 15px 15px; margin-top: 5px; box-shadow: 0 18px 36px -20px rgba(10, 70, 36, .9); }
.approved .row { display: flex; align-items: center; gap: 7px; }
.approved .ms { font-size: 15px; color: #A9F0C6; }
.approved .row span:last-child { flex: 1; min-width: 0; font-size: 9.5px; font-weight: 800; letter-spacing: 1.1px; color: #A9F0C6; }
.approved .msg { display: block; font-size: 14.5px; font-weight: 800; letter-spacing: -.35px; line-height: 1.35; color: #fff; margin-top: 6px; text-wrap: pretty; }

/* Benefits */
.benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 12px; margin-top: 18px; }
.benefit { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 9px; background: #fff; border: 1.5px solid #E5E9F0; border-radius: 18px; padding: 15px 12px 16px; box-shadow: 0 10px 26px -22px rgba(10, 19, 43, .5); }
.benefit .icon { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; background: #EAF2FF; display: flex; align-items: center; justify-content: center; }
.benefit .icon .ms { font-size: 21px; color: #2563EB; }
.benefit b { display: block; text-align: center; font-size: 12px; font-weight: 800; letter-spacing: .5px; line-height: 1.2; color: #0A132B; text-wrap: balance; }
.benefit small { display: block; text-align: center; font-size: 12.5px; font-weight: 600; line-height: 1.35; color: #667085; text-wrap: pretty; }

/* ---------- How it works ---------- */

.how { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 44px; align-items: stretch; }
.how-left { flex: 1 1 420px; min-width: 280px; display: flex; flex-direction: column; gap: 14px; }
.how-right { flex: 1 1 420px; min-width: 280px; display: flex; flex-direction: column; }

.prod-frame { position: relative; flex: 1; min-height: 420px; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 54px -26px rgba(10, 19, 43, .5); }
.prod-inner { position: absolute; inset: 0; background: linear-gradient(165deg, #EAF2FF 0%, #F4F8FE 55%, #FFFFFF 100%); border: 1.5px solid #E5E9F0; border-radius: 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 30px; }
.cs-prod-tile { width: 84px; height: 84px; border-radius: 24px; background: #fff; border: 1.5px solid #D3E1FA; display: flex; align-items: center; justify-content: center; box-shadow: 0 14px 30px -20px rgba(10, 19, 43, .55); }
.cs-prod-icon { font-size: 42px; color: #2563EB; }
.prod-status { display: flex; align-items: center; gap: 8px; }
.prod-status .dot { width: 9px; height: 9px; border-radius: 50%; background: #2563EB; animation: ezdot 1.8s ease-in-out infinite; }
.cs-prod-label { font-size: 14px; font-weight: 800; letter-spacing: 1.5px; color: #1D4FD7; }
.cs-prod-h { display: block; font-size: 30px; font-weight: 800; letter-spacing: -1.1px; line-height: 1.18; color: #0A132B; text-align: center; max-width: 400px; text-wrap: pretty; }
.cs-prod-p { display: block; font-size: 16px; font-weight: 600; line-height: 1.55; color: #475467; text-align: center; max-width: 370px; text-wrap: pretty; }

.cs-band { border-radius: 22px; background: linear-gradient(150deg, #12306E 0%, #0A1F4D 60%, #071634 100%); padding: 22px 24px; box-shadow: 0 20px 44px -26px rgba(7, 22, 52, .9); }
.cs-band h3 { margin: 0; font-size: 28px; font-weight: 800; letter-spacing: -1.05px; line-height: 1.18; color: #fff; text-wrap: pretty; }
.cs-band .row { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.cs-band .ms { font-size: 19px; color: #3BE38B; flex: 0 0 auto; }
.cs-band .row span:last-child { flex: 1; min-width: 0; font-size: 13px; font-weight: 800; letter-spacing: 1.3px; color: #DCE9FF; }

.how-h { font-size: 25px; font-weight: 800; letter-spacing: -.9px; line-height: 1.25; color: #0A132B; text-wrap: pretty; }
.steps { flex: 1; background: #fff; border: 1.5px solid #E5E9F0; border-radius: 22px; padding: 4px 18px 8px; margin-top: 16px; box-shadow: 0 10px 26px -20px rgba(10, 19, 43, .5); }
.steps-head { display: grid; grid-template-columns: repeat(auto-fit, minmax(186px, 1fr)); gap: 14px; padding: 14px 0 9px; }
.steps-head span { min-width: 0; font-size: 12px; font-weight: 800; letter-spacing: 1.3px; color: #1D4FD7; }
.steps-head span:last-child { color: #157F3C; }
.step { display: grid; grid-template-columns: repeat(auto-fit, minmax(186px, 1fr)); gap: 14px; align-items: start; padding: 11px 0; border-top: 1px solid #EEF1F5; }
.step > span { min-width: 0; }
.step .ask { display: block; font-size: 16px; font-weight: 700; font-style: italic; line-height: 1.4; color: #0A132B; text-wrap: pretty; }
.step .nothing { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 800; letter-spacing: -.2px; line-height: 1.4; color: #667085; }
.step .nothing .ms { font-size: 17px; color: #98A2B3; }
.step .result { display: flex; align-items: flex-start; gap: 7px; }
.step .result .ms { font-size: 19px; flex: 0 0 auto; color: #1F9D4D; }
.step .result .ms.auto { color: #1D4FD7; }
.step .result span:last-child { flex: 1; min-width: 0; font-size: 15px; font-weight: 800; letter-spacing: -.2px; line-height: 1.35; color: #157F3C; text-wrap: pretty; }
.step .result em { font-style: normal; color: #1D4FD7; letter-spacing: .8px; }

/* ---------- Rep Call CTA ---------- */

.rep { margin-top: 40px; }
.rep-card { border-radius: 24px; background: linear-gradient(165deg, #EAF2FF 0%, #F4F8FE 55%, #FFFFFF 100%); border: 1.5px solid #C7D9FB; padding: 30px 26px 26px; }
.rep-kicker { display: block; text-align: center; font-size: 11.5px; font-weight: 800; letter-spacing: 1.3px; color: #667085; }
.rep-h { display: block; text-align: center; font-size: 28px; font-weight: 800; letter-spacing: -1px; line-height: 1.2; color: #0A132B; margin-top: 8px; text-wrap: balance; }
.rep-fork { display: grid; grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)); gap: 16px; margin-top: 20px; }
.fork { min-width: 0; display: flex; flex-direction: column; background: #fff; border: 1.5px solid #E5E9F0; border-radius: 20px; padding: 22px; box-shadow: 0 12px 30px -24px rgba(10, 19, 43, .55); }
.fork.in { border-color: #C7D9FB; }
.fork .tag { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: 1.2px; color: #B54708; }
.fork.in .tag { color: #157F3C; }
.fork h4 { margin: 7px 0 0; font-size: 21px; font-weight: 800; letter-spacing: -.65px; line-height: 1.25; color: #0A132B; text-wrap: pretty; }
.fork p { margin: 5px 0 0; font-size: 14px; font-weight: 600; line-height: 1.5; color: #475467; text-wrap: pretty; }
.fork .btn-primary { min-height: 52px; padding: 0 14px; border-radius: 15px; justify-content: center; margin-top: 16px; box-shadow: 0 16px 32px -16px rgba(29, 79, 215, .9); }
.fork .btn-label { font-size: 14px; letter-spacing: .8px; text-align: center; white-space: normal; }
.fork .btn-primary .ms { font-size: 19px; }
.rep-price { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 18px; }
.rep-price span { font-size: 13.5px; font-weight: 700; color: #475467; }
.rep-price b { font-size: 13.5px; font-weight: 800; color: #1D4FD7; }
.rep-price i { width: 4px; height: 4px; border-radius: 50%; background: #C4CBD6; }
.rep-fine { display: block; text-align: center; font-size: 12.5px; font-weight: 700; color: #667085; margin-top: 7px; }

.rep-book { animation: ezRise .35s ease-out both; }
.rep-book-head { display: flex; align-items: center; gap: 10px; }
.rep-book-head .kicker-l { flex: 1; min-width: 0; font-size: 11.5px; font-weight: 800; letter-spacing: 1.3px; color: #667085; }
.btn-back { flex: 0 0 auto; height: 32px; padding: 0 12px; border-radius: 10px; cursor: pointer; background: #fff; border: 1.5px solid #D6DAE1; display: flex; align-items: center; gap: 5px; }
.btn-back .ms { font-size: 15px; color: #475467; }
.btn-back span:last-child { font-size: 12px; font-weight: 800; letter-spacing: -.2px; color: #475467; }
.rep-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; background: #fff; border: 1.5px solid #E5E9F0; border-radius: 20px; padding: 20px 22px; margin-top: 14px; box-shadow: 0 12px 30px -24px rgba(10, 19, 43, .55); }
.rep-photo { position: relative; flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%; overflow: hidden; border: 2px solid #fff; box-shadow: 0 12px 26px -16px rgba(10, 19, 43, .6); background: linear-gradient(135deg, #2563EB, #10327F); display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; color: #fff; }
.rep-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rep-info { flex: 1 1 300px; min-width: 270px; }
.rep-live { display: flex; align-items: center; gap: 7px; }
.rep-live .dot { width: 8px; height: 8px; border-radius: 50%; background: #1F9D4D; animation: ezdot 1.8s ease-in-out infinite; }
.rep-live span:last-child { font-size: 10.5px; font-weight: 800; letter-spacing: 1.2px; color: #157F3C; }
.rep-name { display: block; font-size: 21px; font-weight: 800; letter-spacing: -.7px; line-height: 1.25; color: #0A132B; margin-top: 7px; text-wrap: pretty; }
.rep-bio { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.55; color: #475467; margin-top: 5px; max-width: 560px; text-wrap: pretty; }
.rep-slots { flex: 0 0 auto; display: flex; flex-direction: column; gap: 8px; min-width: 190px; }
.slot { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 42px; padding: 0 14px; border-radius: 13px; background: #F5F8FE; border: 1.5px solid #C7D9FB; cursor: pointer; width: 100%; }
.slot:hover { border-color: #2563EB; }
.slot span:first-child { font-size: 13.5px; font-weight: 800; letter-spacing: -.25px; color: #0A132B; }
.slot .ms { font-size: 17px; color: #1D4FD7; }
.slot.picked { background: linear-gradient(135deg, #2563EB, #1D4FD7); border-color: transparent; }
.slot.picked span:first-child, .slot.picked .ms { color: #fff; }
.rep-fine.book { margin-top: 14px; }

/* ---------- Close ---------- */

.close { display: grid; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)); gap: 18px; margin-top: 20px; align-items: stretch; }
.quote { min-width: 0; background: #fff; border: 1.5px solid #E5E9F0; border-radius: 22px; padding: 22px; box-shadow: 0 10px 26px -20px rgba(10, 19, 43, .5); }
.quote .ms { font-size: 26px; color: #C7D9FB; }
.quote p { margin: 6px 0 0; font-size: 16px; font-weight: 700; font-style: italic; line-height: 1.55; color: #0A132B; text-wrap: pretty; }
.quote cite { display: block; font-style: normal; font-size: 13px; font-weight: 800; color: #667085; margin-top: 12px; }

.beta { min-width: 0; container-type: inline-size; border-radius: 22px; background: linear-gradient(165deg, #12306E 0%, #0A1F4D 55%, #071634 100%); padding: 26px 22px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; box-shadow: 0 20px 44px -26px rgba(7, 22, 52, .9); }
.beta .tag { font-size: 11.5px; font-weight: 800; letter-spacing: 1.2px; color: #3BE38B; }
.beta h3 { margin: 10px 0 0; font-size: clamp(19px, 7.6cqw, 26px); font-weight: 800; letter-spacing: -.038em; line-height: 1.24; color: #fff; }
.beta .btn-primary { width: 100%; height: 56px; margin-top: 18px; border-radius: 16px; justify-content: center; gap: 9px; background: linear-gradient(135deg, #2563EB, #5AA6FF); box-shadow: 0 16px 32px -14px rgba(37, 99, 235, .9); }
.beta .btn-label { font-size: 16.5px; letter-spacing: -.4px; }
.beta .btn-primary .ms { font-size: 20px; }
.beta .fine { font-size: 12.5px; font-weight: 700; color: rgba(214, 229, 255, .75); margin-top: 11px; }

.pricing { min-width: 0; background: #F5F8FE; border: 1.5px solid #C7D9FB; border-radius: 22px; padding: 22px; display: flex; flex-direction: column; justify-content: center; }
.pricing .icon { width: 44px; height: 44px; border-radius: 50%; background: #fff; border: 1.5px solid #C7D9FB; display: flex; align-items: center; justify-content: center; }
.pricing .icon .ms { font-size: 22px; color: #2563EB; }
.pricing .tag { font-size: 11px; font-weight: 800; letter-spacing: 1.3px; color: #667085; margin-top: 13px; }
.pricing h3 { margin: 7px 0 0; font-size: 18px; font-weight: 800; letter-spacing: -.6px; line-height: 1.3; color: #0A132B; text-wrap: pretty; }
.pricing .price { font-size: 22px; font-weight: 800; letter-spacing: -.8px; color: #1D4FD7; margin-top: 10px; }
.pricing .price small { font-size: 14.5px; font-weight: 700; color: #667085; }
.pricing p { margin: 9px 0 0; font-size: 13px; font-weight: 700; color: #475467; line-height: 1.5; text-wrap: pretty; }

/* ---------- Footer ---------- */

.cs-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 34px; padding-top: 22px; border-top: 1px solid #E5E9F0; }
.cs-flock { flex: 0 0 auto; display: flex; align-items: center; gap: 11px; }
.cs-flock img:first-child { height: 34px; width: 34px; }
.cs-flock img:last-child { height: 26px; width: auto; opacity: .8; }
.cs-ftag { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: #98A2B3; }
.cs-flinks { flex: 0 0 auto; display: flex; align-items: baseline; gap: 18px; }
.cs-flegal { flex: 0 0 auto; font-size: 10.5px; font-weight: 800; letter-spacing: 1.3px; color: #667085; }
.cs-flinks a { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: #475467; }
.cs-fspacer { flex: 1; min-width: 0; }
.cs-fcopy { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: #98A2B3; }

/* ---------- Animations ---------- */

@keyframes ezmic { 0%, 100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, .45); } 50% { box-shadow: 0 0 0 16px rgba(37, 99, 235, 0); } }
@keyframes ezmarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes ezmarqueeback { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@keyframes ezhalo { 0%, 100% { opacity: .55; transform: scale(1); } 50% { opacity: .9; transform: scale(1.06); } }
@keyframes ezorbit { to { transform: rotate(360deg); } }
@keyframes ezdot { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes ezwave { 0%, 100% { transform: scaleY(.35); opacity: .5; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes ezRise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .cs-track { animation: none !important; }
  .cs-marquee { overflow-x: auto !important; }
}

/* ---------- Phone breakpoint ---------- */

@media (max-width: 780px) {
  .cs-shell { padding: 0 13px 44px; }
  .cs-nav { gap: 10px; padding: 14px 0 12px; justify-content: center; }
  .cs-nav .cs-mark { height: 74px; width: 74px; }
  .cs-nav .cs-wordmark { height: 52px; }
  .cs-nav .cs-cta, .cs-navlinks, .cs-signin { display: none; }
  .cs-hero { padding: 17px; border-radius: 22px; gap: 20px; }
  .cs-h1 { text-align: center; }
  .cs-emailrow { justify-content: center; }
  .cs-emailrow input { flex: 1 1 100%; text-align: center; }
  .cs-emailrow button { flex: 1 1 100%; justify-content: center; }
  .cs-prod-tile { width: 96px; height: 96px; border-radius: 27px; }
  .cs-prod-icon { font-size: 48px; }
  .cs-prod-label { font-size: 15px; }
  .cs-prod-h { font-size: 34px; letter-spacing: -1.25px; }
  .cs-prod-p { font-size: 17px; }
  .cs-footer { flex-direction: column; align-items: center; gap: 13px; margin-top: 28px; text-align: center; }
  .cs-footer .cs-fspacer, .cs-footer .cs-ftag, .cs-footer .cs-flegal { display: none; }
  .cs-band { padding: 18px; border-radius: 20px; }
}