/* WooSender landing pages. Brand from woosender.com: navy #030A24, blue #0068FF, Inter. */
@font-face{font-family:"Inter";src:url("../fonts/inter-latin-var.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --navy:#030A24; --navy-2:#0A1230; --navy-3:#111B3F; --blue:#0068FF; --blue-hover:#0057D9; --blue-on-dark:#5AA2FF;
  --green:#3CD080; --green-ink:#17784A; --ink:#0B1330; --body:#39425C; --muted:#5A6580; --line:#E2E8F2;
  --soft:#F3F6FB; --white:#FFFFFF; --on-dark:#E9EEF9; --on-dark-2:#B7C2DC; --star:#F5B301;
  --rv-bg:#FFE58A; --rv-ink:#5C4200;
  --radius:16px; --radius-sm:10px; --wrap:1200px;
  --shadow:0 1px 2px rgba(0,0,0,.06),0 10px 30px rgba(0,0,0,.08);
  --shadow-lg:0 2px 4px rgba(0,0,0,.08),0 24px 60px rgba(0,0,0,.22);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--white);color:var(--body);font:400 17px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue)}
h1,h2,h3,h4{color:var(--ink);line-height:1.12;letter-spacing:-.02em;margin:0}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--blue-on-dark);outline-offset:2px;border-radius:6px}

/* Review labels: client-review preview only, stripped before production. */
.rv{display:inline-block;vertical-align:.12em;margin:0 .25em;padding:1px 6px;border-radius:4px;background:var(--rv-bg);color:var(--rv-ink);
  font:700 12.5px/1.45 Inter,system-ui,sans-serif;letter-spacing:0;white-space:normal;max-width:100%}
.review-bar{background:var(--rv-bg);color:var(--rv-ink);font-size:13px;line-height:1.45;text-align:center;padding:7px 16px}
.review-bar b{font-weight:800}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:12px;border:0;
  background:var(--blue);color:#fff;font:700 17px/1 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:background .15s,transform .15s}
.btn:hover{background:var(--blue-hover)}
.btn:active{transform:translateY(1px)}
.btn svg{width:18px;height:18px;flex:none}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn-ghost:hover{background:var(--soft)}
.on-dark .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.on-dark .btn-ghost:hover{background:rgba(255,255,255,.08)}
.textlink{font-weight:700;text-decoration:none;color:var(--blue)}
.textlink:hover{text-decoration:underline}
.on-dark .textlink{color:var(--blue-on-dark)}

/* Nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(3,10,36,.94);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:68px}
.nav .logo img{width:132px;height:auto}
.nav ul{display:flex;gap:26px;list-style:none;margin:0 0 0 auto;padding:0}
.nav ul a{color:var(--on-dark-2);text-decoration:none;font-size:15px;font-weight:600}
.nav ul a:hover{color:#fff}
.nav .btn{min-height:42px;padding:0 18px;font-size:15px}
@media (max-width:959px){.nav ul{display:none}.nav .btn{margin-left:auto}}
@media (max-width:420px){.nav .logo img{width:112px}.nav .btn{padding:0 14px;font-size:14.5px}}

/* Hero */
.hero{position:relative;background:var(--navy);color:var(--on-dark);overflow:hidden;
  background-image:radial-gradient(900px 520px at 85% -10%,rgba(0,104,255,.28),transparent 60%),radial-gradient(700px 400px at -10% 110%,rgba(0,128,255,.14),transparent 60%)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);grid-template-areas:"copy form" "more form";column-gap:56px;padding-top:56px;padding-bottom:64px;align-items:start}
.hero-copy{grid-area:copy}
.hero-more{grid-area:more}
.hero-form{grid-area:form;position:relative}
.kicker{display:flex;align-items:center;flex-wrap:nowrap;gap:.35em;font-size:clamp(17px,1.7vw,21px);font-weight:700;color:var(--on-dark);margin:0 0 18px;white-space:nowrap;min-height:1.6em}
@media (max-width:400px){.kicker{font-size:16px;gap:.3em}.kicker .dot{display:none}}
.kicker .dot{width:9px;height:9px;border-radius:50%;background:var(--green);flex:none;margin-right:.3em}
.rot{position:relative;display:inline-block;color:var(--blue-on-dark)}
.rot-word{display:inline-block;transition:opacity .28s ease,transform .28s ease}
.rot-word.out{opacity:0;transform:translateY(-.45em)}
.rot-word.in{opacity:0;transform:translateY(.45em)}
.rot-pause{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;margin-left:.2em;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:transparent;color:var(--on-dark-2);cursor:pointer;padding:0}
.rot-pause{position:relative}.rot-pause::after{content:"";position:absolute;inset:-8px}
.rot-pause svg{width:12px;height:12px}
.rot-pause[hidden]{display:none}
.hero h1{color:#fff;font-size:clamp(31px,4.3vw,54px);line-height:1.07;letter-spacing:-.028em;font-weight:800;margin:0 0 20px}
.hero h1 .lead-line{display:block;text-wrap:balance}
.hero h1 .test-line,.h2,.panel h3{text-wrap:balance}
.hero h1 .test-line{display:block;color:var(--blue-on-dark)}
.hero .sub{font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--on-dark-2);max-width:40em;margin:0 0 16px}
.trustline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:14px;color:var(--on-dark-2);margin:0}
.trustline .stars{color:var(--star);letter-spacing:1px}
.trustline b{color:#fff;font-weight:700}
.checks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:11px}
.checks li{position:relative;padding-left:32px;font-size:16.5px;line-height:1.45;color:var(--on-dark)}
.checks li::before{content:"";position:absolute;left:0;top:1px;width:21px;height:21px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23030A24' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round' d='M5.5 10.5l3 3 6-7'/%3E%3C/svg%3E") center/13px no-repeat}
.checks li b{color:#fff;font-weight:700}
.on-light .checks li,.checks.on-light li{color:var(--body)}
.on-light .checks li b,.checks.on-light li b{color:var(--ink)}

/* Product screen peeking behind the form */
.hero-screen{position:absolute;right:-70px;top:-26px;width:430px;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-lg);transform:rotate(3deg);opacity:.95;border:1px solid rgba(255,255,255,.12)}
.hero-screen figcaption{position:absolute;left:10px;bottom:8px;font-size:12px;color:#39425C;background:rgba(255,255,255,.92);border-radius:6px;padding:2px 7px}
@media (max-width:1180px){.hero-screen{display:none}}

/* Form card */
.form-card{position:relative;z-index:2;background:#fff;color:var(--body);border-radius:20px;padding:28px 28px 22px;box-shadow:var(--shadow-lg);margin-top:78px}
.form-card h2{font-size:23px;letter-spacing:-.015em;margin:0 0 6px}
.form-card .form-sub{font-size:15px;color:var(--muted);margin:0 0 18px;line-height:1.5}
.field{margin:0 0 13px}
.field label{display:block;font-size:14px;font-weight:700;color:var(--ink);margin:0 0 6px}
.field input,.field select{width:100%;height:52px;border:1.5px solid #CCD5E3;border-radius:11px;padding:0 14px;font:500 16px Inter,system-ui,sans-serif;color:var(--ink);background:#fff;appearance:none;-webkit-appearance:none}
.field select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%235A6580' stroke-width='2' d='M5 7.5l5 5 5-5'/%3E%3C/svg%3E") right 12px center/18px no-repeat;padding-right:40px}
.field input:focus,.field select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,104,255,.18)}
.field input::placeholder{color:#6B7690}
.field.invalid input,.field.invalid select{border-color:#C8321E}
.field .err{display:none;font-size:13.5px;color:#B42B17;margin-top:5px;font-weight:600}
.field.invalid .err{display:block}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:460px){.two{grid-template-columns:1fr;gap:0}}
.form-card .btn{width:100%;margin-top:6px;min-height:56px;font-size:18px}
.form-note{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--ink);font-weight:600;margin:12px 0 10px;line-height:1.45}
.form-note svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--green-ink)}
.consent{font-size:12.5px;line-height:1.5;color:#5A6580;margin:0}
.consent a{color:#4F5B75}
.form-error{display:none;background:#FDECEA;color:#8F2412;border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600;margin:0 0 12px}
.form-error.show{display:block}

/* Logo strip */
.logos{background:var(--navy-2);border-top:1px solid rgba(255,255,255,.08)}
.logos .wrap{display:flex;align-items:center;gap:22px 44px;flex-wrap:wrap;justify-content:center;padding-top:26px;padding-bottom:26px}
.logos p{font-size:13.5px;font-weight:700;color:var(--on-dark-2);letter-spacing:.02em;margin-right:6px}
.logos img{height:34px;width:auto;filter:brightness(0) invert(1);opacity:.78}
.logos .names{font-size:13.5px;color:var(--on-dark-2);flex-basis:100%;text-align:center}

/* Sections */
.section{padding:96px 0}
.section.soft{background:var(--soft)}
.section.dark{background:var(--navy);color:var(--on-dark)}
.section.dark h2,.section.dark h3{color:#fff}
@media (max-width:760px){.section{padding:64px 0}}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#0052CC;margin:0 0 12px}
.dark .eyebrow{color:var(--blue-on-dark)}
.h2{font-size:clamp(28px,3.3vw,44px);font-weight:800;letter-spacing:-.025em;margin:0 0 16px}
.lede{font-size:clamp(17px,1.4vw,19.5px);line-height:1.6;color:var(--muted);max-width:44em}
.dark .lede{color:var(--on-dark-2)}
.center{text-align:center}
.center .lede{margin-left:auto;margin-right:auto}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.split.wide-right{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.split>*,.hero .wrap>*,.panel>*{min-width:0}
@media (max-width:900px){.split,.split.wide-right{grid-template-columns:1fr;gap:40px}}

/* Browser-framed screenshots */
.shot{margin:0;border-radius:14px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.shot .chrome{height:28px;background:#EEF2F8;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 12px}
.shot .chrome i{width:9px;height:9px;border-radius:50%;background:#D2D9E5}
.shot figcaption,.cap{font-size:13.5px;line-height:1.45;color:var(--muted);padding:10px 14px;background:#fff;border-top:1px solid var(--line)}
.dark .cap{background:transparent;border:0;color:var(--on-dark-2);padding:10px 0 0}

/* Steps */
.steps{list-style:none;margin:30px 0 0;padding:0;counter-reset:s}
.steps li{position:relative;padding:0 0 26px 58px;counter-increment:s}
.steps li::before{content:counter(s);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:800;font-size:17px}
.steps li::after{content:"";position:absolute;left:19px;top:44px;bottom:4px;width:2px;background:var(--line)}
.steps li:last-child::after{display:none}
.steps h3{font-size:21px;margin:5px 0 4px;letter-spacing:-.015em}
.steps p{color:var(--muted);font-size:16px}
.collage{display:grid;gap:18px}
.collage .shot:nth-child(2){margin-left:48px}
@media (max-width:900px){.collage .shot:nth-child(2){margin-left:0}}

/* Quotes */
.quote{margin:0;padding:22px 24px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.quote p{font-size:17px;line-height:1.55;color:var(--ink);font-weight:500}
.quote footer{margin-top:12px;font-size:14.5px;color:var(--muted)}
.quote footer b{color:var(--ink)}
.dark .quote{background:var(--navy-2);border-color:rgba(255,255,255,.1);box-shadow:none}
.dark .quote p{color:#fff}
.dark .quote footer{color:var(--on-dark-2)}
.dark .quote footer b{color:#fff}

/* Video tiles (facades: YouTube loads only on click) */
.vtile{position:relative;display:block;width:100%;padding:0;border:0;border-radius:14px;overflow:hidden;cursor:pointer;background:#0A1230;aspect-ratio:16/9;box-shadow:var(--shadow)}
.vtile img{width:100%;height:100%;object-fit:cover}
.vtile .play{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:8px;background:rgba(3,10,36,.86);color:#fff;border-radius:999px;padding:8px 14px 8px 10px;font:700 14px Inter,system-ui,sans-serif}
.vtile .play i{width:26px;height:26px;border-radius:50%;background:var(--blue);display:grid;place-items:center}
.vtile .play svg{width:11px;height:11px;margin-left:2px}
.vtile:hover .play{background:var(--blue)}
.vtile:hover .play i{background:#fff}
.vtile:hover .play svg path{fill:var(--blue)}

/* Audio */
.audio-card{background:var(--navy-2);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:22px}
.audio-card .meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px;font-size:14px;color:var(--on-dark-2)}
.audio-card .meta b{color:#fff;font-size:16px}
.audio-card audio{width:100%;height:48px;color-scheme:dark}
.wave{display:flex;align-items:center;gap:3px;height:54px;margin:0 0 14px}
.wave i{flex:1;background:linear-gradient(var(--blue-on-dark),var(--blue));border-radius:3px;opacity:.85}

/* Three points */
.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:40px 0 0}
.point{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.point{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:start}
.point .ico{grid-row:span 2;width:40px;height:40px;border-radius:50%;background:#E8F1FF;color:var(--blue);display:grid;place-items:center;margin:2px 0 0}
.point .ico svg{width:22px;height:22px}
.point h3{font-size:21px;margin:6px 0 6px;letter-spacing:-.015em}
.point p{font-size:16px;color:var(--muted)}
@media (max-width:860px){.points{grid-template-columns:1fr}}

/* Comparison */
.compare{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:16px}
.compare th,.compare td{padding:15px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.compare tr:last-child th,.compare tr:last-child td{border-bottom:0}
.compare thead th{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--soft)}
.compare thead th.us{color:#0052CC}
.compare tbody th{font-weight:700;color:var(--ink);width:24%}
.compare td.them{color:var(--muted)}
.compare td.us{color:var(--ink);font-weight:600;background:#F5F9FF}
@media (max-width:700px){
  .compare thead{display:none}
  .compare,.compare tbody,.compare tr,.compare th,.compare td{display:block;width:100%}
  .compare tr{border-bottom:1px solid var(--line);padding:12px 0}
  .compare tbody th{border:0;padding:4px 16px;width:auto;font-size:16.5px}
  .compare td{border:0;padding:4px 16px}
  .compare td::before{content:attr(data-label);display:block;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
  .compare td.us::before{color:#0052CC}
}

/* Industry tabs */
.tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:34px 0 26px}
.tab{min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid #CDD6E6;background:#fff;color:var(--ink);font:650 15px Inter,system-ui,sans-serif;cursor:pointer}
.tab:hover{border-color:var(--blue)}
.tab[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.panel{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:var(--shadow)}
.panel[hidden]{display:none}
.panel .who{font-size:15px;font-weight:700;letter-spacing:0;color:#0052CC;margin:0 0 8px}
.panel h3{font-size:clamp(24px,2.4vw,32px);margin:0 0 14px;letter-spacing:-.02em}
.panel .stats{display:flex;gap:26px;flex-wrap:wrap;margin:0 0 16px}
.panel .stats div{font-size:14px;color:var(--muted)}
.panel .stats b{display:block;font-size:24px;color:var(--ink);letter-spacing:-.02em}
.panel blockquote{margin:0 0 18px;padding:14px 16px;border-radius:12px;background:var(--soft);font-size:16.5px;color:var(--ink)}
.panel blockquote footer{font-size:14px;color:var(--muted);margin-top:6px}
.panel-list{display:grid;gap:28px}
.fineprint{font-size:13px;color:var(--muted);text-align:center;margin:18px auto 0;max-width:52em}
@media (max-width:860px){.panel{grid-template-columns:1fr;gap:22px;padding:18px}}

/* Features */
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 30px;margin:44px 0 0}
.fgroup h3{font-size:21px;margin:0 0 12px;display:flex;align-items:center;gap:10px}
.fgroup h3 .ico{width:36px;height:36px;border-radius:10px;background:#E8F1FF;color:var(--blue);display:grid;place-items:center;flex:none}
.fgroup h3 .ico svg{width:19px;height:19px}
.fgroup ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fgroup li{font-size:15.5px;line-height:1.45;color:var(--muted);padding-left:14px;position:relative}
.fgroup li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.fgroup li b{color:var(--ink);font-weight:700}
@media (max-width:960px){.feature-grid{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.feature-grid{grid-template-columns:1fr}}
.demo-facade{position:relative;display:block;width:100%;padding:0;border:0;cursor:pointer;border-radius:18px;overflow:hidden;box-shadow:var(--shadow-lg);background:#fff}
.demo-facade img{width:100%;height:auto}
.demo-facade .overlay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(rgba(3,10,36,.05),rgba(3,10,36,.45))}
.demo-facade .overlay span{display:inline-flex;align-items:center;gap:12px;background:var(--blue);color:#fff;font:800 18px Inter,system-ui,sans-serif;border-radius:999px;padding:14px 24px 14px 14px}
.demo-facade .overlay i{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center}
.demo-facade .overlay svg{width:15px;height:15px;margin-left:3px}

/* Specialist */
.gap-photo{border:2px dashed #AAB6CC;border-radius:18px;background:repeating-linear-gradient(135deg,#F7F9FC,#F7F9FC 12px,#EFF3F9 12px,#EFF3F9 24px);padding:26px;min-height:320px;display:flex;flex-direction:column;justify-content:flex-end}
.gap-photo b{display:inline-block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;background:var(--rv-bg);color:var(--rv-ink);border-radius:5px;padding:3px 8px;margin:0 0 10px;align-self:flex-start}
.gap-photo p{font-size:15px;color:var(--body);line-height:1.5}
.duties{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:14px}
.duties li{display:grid;grid-template-columns:28px 1fr;gap:12px;font-size:16.5px;color:var(--body)}
.duties li svg{width:24px;height:24px;color:var(--blue);margin-top:1px}
.duties b{color:var(--ink)}
.callout{margin:26px 0 0;padding:18px 20px;border-radius:14px;background:#EEF5FF;border:1px solid #CFE1FF;color:var(--ink);font-size:16px}
.callout b{font-weight:800}
.timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:26px 0 0}
.timeline div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-size:14.5px;color:var(--muted)}
.timeline b{display:block;color:var(--ink);font-size:15.5px;margin-bottom:2px}
@media (max-width:620px){.timeline{grid-template-columns:1fr}}

/* FAQ */
.faq{max-width:860px;margin:36px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 44px 20px 0;position:relative;font-size:18px;font-weight:700;color:var(--ink);line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:26px;width:12px;height:12px;border-right:2.5px solid var(--blue);border-bottom:2.5px solid var(--blue);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(-135deg);top:31px}
.faq .a{padding:0 0 22px;font-size:16.5px;color:var(--body);max-width:46em}
.faq .a p+p{margin-top:10px}

/* Final CTA */
.final .split{align-items:center}
.final ol{list-style:none;counter-reset:f;margin:26px 0 30px;padding:0;display:grid;gap:14px}
.final ol li{counter-increment:f;display:grid;grid-template-columns:36px 1fr;gap:14px;font-size:17px;color:var(--on-dark)}
.final ol li::before{content:counter(f);width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);display:grid;place-items:center;font-weight:800;color:#fff}
.final ol b{color:#fff}

/* Footer */
.foot{background:#020716;color:var(--on-dark-2);font-size:14px;padding:36px 0}
.foot .wrap{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between}
.foot img{width:118px}
.foot a{color:var(--on-dark-2)}
.foot p{max-width:46em;line-height:1.55}

/* Sticky mobile CTA */
.sticky-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;display:none}
.sticky-cta .btn{width:100%;box-shadow:var(--shadow-lg)}
@media (max-width:760px){.sticky-cta.show{display:block}}

/* Dialogs */
dialog{border:0;padding:0;border-radius:20px;max-width:min(760px,calc(100vw - 24px));width:100%;background:#fff;color:var(--body);box-shadow:var(--shadow-lg)}
dialog::backdrop{background:rgba(2,7,22,.72)}
.dlg-body{padding:26px}
.dlg-close{position:absolute;right:10px;top:10px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(3,10,36,.06);color:var(--ink);cursor:pointer;font-size:26px;line-height:1;display:grid;place-items:center;z-index:2}
.dlg-close:hover{background:rgba(3,10,36,.12)}
.dlg-video{position:relative;aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden}
.dlg-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#video-dialog{background:#000;max-width:min(1000px,calc(100vw - 24px))}
#video-dialog .dlg-close{background:rgba(255,255,255,.14);color:#fff}
#exit-dialog h2{font-size:clamp(22px,3vw,28px);margin:0 0 8px;padding-right:40px}
#exit-dialog p.lede{font-size:16.5px;margin:0 0 16px}
#exit-dialog .row{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:16px}

/* ==========================================================================
   2026-09-25 visual revision (client): drawn graphics in the woosender.com style, dark theme.
   Channel colors from woosender.com/omnichannel: email blue, SMS purple, voice green, chat teal.
   ========================================================================== */
:root{--c-email:#3B82F6;--c-sms:#8B5CF6;--c-voice:#22C55E;--c-chat:#14B8A6;--card:#0A1230;--card-2:#0D1738;--edge:rgba(255,255,255,.09);--soft-dark:#060E2B}
body{background:var(--navy);color:var(--on-dark-2)}
h1,h2,h3,h4{color:#fff}
.form-card h2,dialog h2{color:var(--ink)}
dialog .lede{color:var(--muted)}
.textlink{color:var(--blue-on-dark)}
.section{background:var(--navy);border-top:1px solid rgba(255,255,255,.05)}
.section.soft,.section.dark{background:var(--soft-dark)}
.lede{color:var(--on-dark-2)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:5px 13px;border-radius:999px;border:1px solid rgba(60,208,128,.35);
  background:rgba(60,208,128,.08);color:#8CE8B8;font-size:13.5px;font-weight:700;letter-spacing:0;text-transform:none;margin:0 0 16px}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green)}
.dark .eyebrow{color:#8CE8B8}
.checks.on-light li{color:var(--on-dark)}
.checks.on-light li b{color:#fff}
.cap{color:var(--on-dark-2)}

/* Cards and quotes on dark */
.point{background:var(--card);border-color:var(--edge)}
.point h3{color:#fff}
.point p{color:var(--on-dark-2)}
.point .ico{background:rgba(0,104,255,.16);color:var(--blue-on-dark)}
.quote{background:var(--card);border-color:var(--edge);box-shadow:none}
.quote p{color:#fff}
.quote footer{color:var(--on-dark-2)}
.quote footer b{color:#fff}
.vtile{box-shadow:none;outline:1px solid var(--edge)}

/* Comparison */
.compare{background:var(--card);border-color:var(--edge)}
.compare th,.compare td{border-bottom-color:var(--edge)}
.compare thead th{background:var(--card-2);color:var(--on-dark-2)}
.compare thead th.us{color:var(--blue-on-dark)}
.compare tbody th{color:#fff}
.compare td.them{color:var(--on-dark-2)}
.compare td.us{color:#fff;background:rgba(0,104,255,.10)}
@media (max-width:700px){.compare tr{border-bottom-color:var(--edge)}.compare td.us::before{color:var(--blue-on-dark)}.compare td::before{color:var(--on-dark-2)}}

/* Industry tabs */
.tab{background:transparent;border-color:rgba(255,255,255,.2);color:var(--on-dark)}
.tab:hover{border-color:var(--blue-on-dark)}
.tab[aria-selected="true"]{background:#fff;border-color:#fff;color:var(--navy)}
.panel{background:var(--card);border-color:var(--edge);box-shadow:none}
.panel .who{color:var(--blue-on-dark)}
.panel h3{color:#fff}
.panel .stats div{color:var(--on-dark-2)}
.panel .stats b{color:#fff}
.panel blockquote{background:rgba(255,255,255,.04);color:#fff}
.panel blockquote footer{color:var(--on-dark-2)}
.fineprint{color:#9AA6C4}

/* Features, specialist, FAQ */
.fgroup h3{color:#fff}
.fgroup h3 .ico{background:rgba(0,104,255,.16);color:var(--blue-on-dark)}
.fgroup li{color:var(--on-dark-2)}
.fgroup li b{color:#fff}
.fgroup li::before{background:var(--blue-on-dark)}
.duties li{color:var(--on-dark-2)}
.duties b{color:#fff}
.duties li svg{color:var(--blue-on-dark)}
.callout{background:rgba(0,104,255,.10);border-color:rgba(90,162,255,.35);color:var(--on-dark)}
.timeline div{background:var(--card);border-color:var(--edge);color:var(--on-dark-2)}
.timeline b{color:#fff}
.faq details{border-bottom-color:var(--edge)}
.faq summary{color:#fff}
.faq summary::after{border-color:var(--blue-on-dark)}
.faq .a{color:var(--on-dark-2)}

/* Channel badge used across the graphics */
.ch{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;flex:none}
.ch svg{width:19px;height:19px}
.ch-sms{background:rgba(139,92,246,.16);color:#B79BFF;border:1px solid rgba(139,92,246,.4)}
.ch-email{background:rgba(59,130,246,.16);color:#8DB8FF;border:1px solid rgba(59,130,246,.4)}
.ch-voice{background:rgba(34,197,94,.14);color:#6EE7A0;border:1px solid rgba(34,197,94,.4)}
.ch-chat{background:rgba(20,184,166,.14);color:#5EEAD4;border:1px solid rgba(20,184,166,.4)}
.ch-you{background:rgba(255,255,255,.08);color:#E9EEF9;border:1px solid rgba(255,255,255,.2)}
.ch-ok{background:rgba(60,208,128,.16);color:#7FE3AE;border:1px solid rgba(60,208,128,.45)}

/* Hero: what arrives on your phone (desktop only, beside the form) */
.toasts{position:absolute;inset:0;pointer-events:none;z-index:3}
.toast{position:absolute;display:flex;gap:12px;align-items:flex-start;background:rgba(13,23,56,.97);border:1px solid rgba(255,255,255,.14);
  border-radius:16px;padding:12px 14px;box-shadow:0 20px 40px rgba(0,0,0,.35);color:var(--on-dark)}
.toast .tt{display:flex;gap:8px;align-items:baseline;margin:0 0 3px;font-size:13px}
.toast .tt b{color:#fff;font-size:14px}
.toast .tt span{color:#9AA6C4}
.toast p{font-size:13.5px;line-height:1.45}
.t-sms{top:-8px;right:-56px;width:330px;transform:rotate(1.5deg)}
.t-call{left:-64px;top:18px;align-items:center}
.t-call .tt{margin:0}
@media (max-width:1180px){.toasts{display:none}}

/* How the test works: split layout (Paul, round 2), drawn conversation windows instead of screenshots */
.steps p{color:var(--on-dark-2)}
.steps li::after{background:var(--edge)}
.shot.drawn{background:var(--card);border-color:var(--edge);box-shadow:none}
.shot.drawn .chrome{background:var(--card-2);border-bottom-color:var(--edge);height:34px}
.shot.drawn .chrome i{background:#2A3558}
.shot.drawn .chrome span{margin-left:10px;font-size:12.5px;font-weight:700;color:#C9D3EA}
.shot.drawn figcaption{background:transparent;border-top-color:var(--edge);color:#9AA6C4}
.thread{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px}
.via{display:flex;align-items:center;gap:6px;justify-content:flex-end;font-size:12px;color:#8A96B5;margin:4px 0 0}
.via.you{justify-content:flex-start}
.dot{width:8px;height:8px;border-radius:50%}
.dot.sms{background:var(--c-sms)}.dot.email{background:var(--c-email)}.dot.voice{background:var(--c-voice)}
.bub{max-width:86%;padding:9px 12px;border-radius:14px;font-size:14px;line-height:1.45;margin:0}
.bub.ai{margin-left:auto;background:rgba(139,92,246,.22);border:1px solid rgba(139,92,246,.45);color:#fff;border-bottom-right-radius:4px}
.bub.you{background:#1B2544;color:#E9EEF9;border-bottom-left-radius:4px;align-self:flex-start}
.mail{margin-left:auto;max-width:92%;background:#060D26;border:1px solid rgba(59,130,246,.45);border-radius:12px;padding:10px 12px}
.mail p{font-size:13.5px;line-height:1.5;color:#E9EEF9}
.em-h{font-size:12.5px;color:#9AA6C4;margin:0 0 6px!important;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.em-h span{color:#8DB8FF}
.call{margin-left:auto;display:flex;align-items:center;gap:10px;background:rgba(34,197,94,.10);border:1px solid rgba(34,197,94,.4);border-radius:999px;padding:7px 14px 7px 8px;font-size:12.5px;color:#C9D3EA}
.call .pl{width:24px;height:24px;border-radius:50%;background:var(--c-voice);position:relative;flex:none}
.call .pl::after{content:"";position:absolute;left:9px;top:7px;width:8px;height:10px;background:#03210F;clip-path:polygon(0 0,100% 50%,0 100%)}
.call .wv{display:inline-flex;align-items:center;gap:2px;height:16px}
.call .wv b{width:3px;border-radius:2px;background:#6EE7A0;display:block}
.booked-row{display:flex;gap:12px;align-items:center;margin-top:8px;padding:10px 12px;border-radius:12px;background:rgba(60,208,128,.08);border:1px solid rgba(60,208,128,.35)}
.booked-row b{display:block;color:#fff;font-size:14.5px}
.booked-row .d{font-size:13px;color:var(--on-dark-2)}
@media (max-width:520px){.call .wv{display:none}}

/* Hear it: voice card */
.audio-card{background:var(--card);border-color:var(--edge)}
.mic{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;margin:0 auto 12px;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.45);color:#6EE7A0}
.mic svg{width:26px;height:26px}
.wave i{background:linear-gradient(#8CE8B8,var(--c-voice))}

/* Wake up booked: drawn week */
.cal{background:var(--card);border:1px solid var(--edge);border-radius:18px;padding:18px}
.cal-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px;flex-wrap:wrap}
.cal-top b{color:#fff;font-size:16px}
.cal-badge{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:#C9B8FF;background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.4);border-radius:999px;padding:4px 11px}
.cal-badge svg{width:14px;height:14px}
.cal-grid{display:grid;grid-template-columns:44px repeat(5,minmax(0,1fr));gap:6px}
.cal-times{display:grid;grid-template-rows:26px repeat(8,40px);font-size:12px;color:#8A96B5}
.cal-times span{padding-top:2px}
.cal-day{position:relative;display:grid;grid-template-rows:26px repeat(8,40px);border-radius:10px;background:repeating-linear-gradient(transparent 0 39px,rgba(255,255,255,.05) 39px 40px);background-position:0 26px;background-repeat:no-repeat;background-size:100% 320px}
.cal-day>p{font-size:12.5px;font-weight:700;color:#C9D3EA;text-align:center;margin:0;padding-top:3px}
.ev{grid-row:var(--r) / span var(--h);margin:2px;border-radius:8px;padding:5px 7px;font-size:12px;line-height:1.3;overflow:hidden;color:#fff;
  background:rgba(59,130,246,.22);border:1px solid rgba(59,130,246,.5)}
.ev b{display:block;font-size:12.5px}
.ev span{display:flex;gap:4px;align-items:center;color:#C9D3EA}
.ev.night{background:rgba(139,92,246,.24);border-color:rgba(139,92,246,.55)}
.ev.night span::before{content:"";width:9px;height:9px;flex:none;background:#C9B8FF;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 14.5A8 8 0 019.5 4a8 8 0 1010.5 10.5z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 14.5A8 8 0 019.5 4a8 8 0 1010.5 10.5z'/%3E%3C/svg%3E") center/contain no-repeat}
.cal-foot{font-size:12.5px;color:#8A96B5;margin:10px 0 0;text-align:right}
@media (max-width:560px){.cal{padding:12px}.cal-grid{grid-template-columns:30px repeat(5,minmax(0,1fr));gap:4px}.ev span{display:none}.ev{padding:4px 5px}.ev b{font-size:11px}.cal-times{font-size:11px}}

/* What you get: drawn pipeline as the demo-video cover */
.board-cover{background:var(--card);border:1px solid var(--edge);box-shadow:none;text-align:left}
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px}
.board .col{display:flex;flex-direction:column;gap:8px;background:#060D26;border:1px solid var(--edge);border-radius:12px;padding:10px}
.board .ch-t{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;font-weight:700;color:#C9D3EA;margin:0 0 2px}
.board .ch-t i{font-style:normal;font-size:11.5px;color:#8A96B5;background:rgba(255,255,255,.06);border-radius:999px;padding:1px 7px}
.board .lc{display:flex;flex-direction:column;gap:5px;background:var(--card-2);border:1px solid var(--edge);border-radius:9px;padding:8px 9px;font-size:13px;font-weight:700;color:#fff}
.board .lc em{font-style:normal;font-weight:500;font-size:12px;color:#9AA6C4}
.chip{align-self:flex-start;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px}
.chip.c-sms{color:#C9B8FF;background:rgba(139,92,246,.18)}
.chip.c-voice{color:#8CE8B8;background:rgba(34,197,94,.16)}
.chip.c-email{color:#A9C8FF;background:rgba(59,130,246,.18)}
.chip.c-ok{color:#8CE8B8;background:rgba(60,208,128,.16)}
.board-cover .overlay{background:linear-gradient(rgba(3,10,36,0),rgba(3,10,36,.55))}

/* A person answers for your AI: drawn specialist card (no invented person) */
.spec{background:var(--card);border:1px solid var(--edge);border-radius:18px;padding:22px}
.spec-h{display:flex;gap:14px;align-items:center;margin:0 0 16px}
.spec-av{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:rgba(0,104,255,.18);border:1px solid rgba(90,162,255,.45);color:var(--blue-on-dark)}
.spec-av svg{width:25px;height:25px}
.spec-h b{display:block;color:#fff;font-size:17px}
.spec-h span{font-size:13.5px;color:#9AA6C4}
.spec-l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.spec-l li{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#060D26;border:1px solid var(--edge);border-radius:10px;padding:10px 12px;font-size:14.5px;color:#E9EEF9}
.st{font-size:11.5px;font-weight:700;border-radius:999px;padding:2px 9px;flex:none}
.st.ok{color:#8CE8B8;background:rgba(60,208,128,.16)}
.st.run{color:#A9C8FF;background:rgba(59,130,246,.18)}
.spec-alert{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:12px;border-radius:12px;background:rgba(245,179,1,.08);border:1px solid rgba(245,179,1,.35)}
.spec-alert svg{width:20px;height:20px;color:#F5C451;flex:none;margin-top:2px}
.spec-alert b{display:block;color:#fff;font-size:14.5px}
.spec-alert span{font-size:13.5px;color:var(--on-dark-2)}

/* Final CTA: the 2-minute sequence */
.seq{background:var(--card);border:1px solid var(--edge);border-radius:18px;padding:24px}
.seq-top{display:flex;align-items:baseline;gap:12px;margin:0 0 18px}
.seq-top b{font-size:46px;line-height:1;color:#fff;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.seq-top span{color:var(--on-dark-2);font-size:15px}
.seq-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.seq-l li{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:#E9EEF9;text-align:center}
.seq-bar{height:6px;border-radius:4px;margin:18px 0;background:linear-gradient(90deg,var(--c-sms),var(--c-email),var(--c-voice),var(--green))}
.seq-done{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:rgba(60,208,128,.08);border:1px solid rgba(60,208,128,.35)}
.seq-done b{display:block;color:#fff}
.seq-done span{font-size:13.5px;color:var(--on-dark-2)}
@media (max-width:420px){.seq-l{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Video covers (popup, thank-you): drawn, no screenshot */
.cover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:10px;padding:18px 20px;
  background:radial-gradient(420px 240px at 50% 30%,rgba(0,104,255,.35),transparent 70%),var(--navy)}
.dlg-video .demo-facade{position:absolute;inset:0;width:100%;height:100%}
.cover img{width:120px;height:auto}
.cover em{font-style:normal;color:#E9EEF9;font-size:14px;background:rgba(3,10,36,.85);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:4px 12px}

/* 2026-09-29: play label with the customer's name (industry tabs) */
.vtile{background:var(--card)}
.vtile .play{border-radius:14px;padding:8px 14px 8px 10px;gap:10px;background:rgba(3,10,36,.86)}
.vtile .pl-t{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25;text-align:left}
.vtile .pl-t b{font-size:14px;color:#fff}
.vtile .pl-t small{font-size:12.5px;font-weight:600;color:#C9D3EA}
.vtile:hover .pl-t small{color:#fff}

/* 2026-09-29: "+ More industries" tab (Paul: "we do more than just those industries") */
.tab-more{border-style:dashed}
.panel-art{position:relative;margin:0;border-radius:14px;overflow:hidden;aspect-ratio:16/9;outline:1px solid var(--edge)}
.panel-art img{width:100%;height:100%;object-fit:cover}
.panel-art .ai-tag{position:absolute;top:10px;right:10px;font-size:12px;font-weight:700;color:#C9D3EA;background:rgba(3,10,36,.78);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:2px 9px;line-height:1.5}
.ind-more{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ind-more li{background:rgba(255,255,255,.04);border:1px solid var(--edge);border-radius:10px;padding:8px 11px;font-size:14.5px;color:#fff}
.ind-more b{display:block;font-weight:700}
.ind-more span{display:block;font-size:13px;color:#9AA6C4;margin-top:1px}
.ind-note{font-size:14.5px;color:var(--on-dark-2);margin:0 0 16px}
@media (max-width:520px){.ind-more{grid-template-columns:1fr}}

/* 2026-09-29 round 4: logos back; customer videos gathered into two rows of real thumbnails */
.logos .names{color:#C9D3EA}
.logos img{height:40px;opacity:.9}
.logos img[src*="solar"]{height:50px}
@media (max-width:620px){.logos .wrap{gap:14px 20px}.logos p:first-child{flex-basis:100%;text-align:center;margin:0}
  .logos img{height:26px}.logos img[src*="solar"]{height:34px}}
.hear-one{max-width:860px}
.hear-one .audio-card{margin-top:32px}
.section.stories{background:radial-gradient(1000px 420px at 50% 0,rgba(0,104,255,.13),transparent 70%),var(--navy)}
.trow{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.tcard{display:flex;flex-direction:column;min-width:0;background:var(--card);border:1px solid var(--edge);border-radius:16px;overflow:hidden}
.tcard .vtile{border-radius:0;outline:0}
.tcard .vtile .play{left:10px;bottom:10px;padding:6px 12px 6px 7px;gap:8px;font-size:13px}
.tcard .vtile .play i{width:22px;height:22px}
.tcard .quote{border:0;border-radius:0;padding:18px 18px 20px;background:none;flex:1;display:flex;flex-direction:column}
.tcard .quote p{font-size:15.5px;line-height:1.5}
.tcard .quote footer{margin-top:auto;padding-top:12px;font-size:14px}
.swipe-hint{display:none;margin:12px 0 0;font-size:14px;font-weight:600;color:#9AA6C4;text-align:right}
@media (max-width:980px){
  .trow{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:44%;overflow-x:auto;scroll-snap-type:x mandatory;
    gap:14px;padding-bottom:12px;overscroll-behavior-x:contain}
  .tcard{scroll-snap-align:start}
  .swipe-hint{display:block}
}
@media (max-width:620px){.trow{grid-auto-columns:84%}}

/* 2026-09-30 round 5: logo strip as on the woosender.com homepage ("Powering High-Volume Sales For"):
   uppercase gray label, gray logos at half opacity, one slow loop to the left. Pauses on hover or focus;
   stands still (and shows each logo once) for visitors who ask for reduced motion. Its own class, because the
   SimpleTalk page in this project still uses the older .logos strip above. */
.logo-strip{background:var(--navy);padding:48px 0;border-bottom:1px solid rgba(255,255,255,.05);overflow:hidden}
.logos-h{margin:0 0 16px;padding:0 20px;text-align:center;font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#8A94A6}
.marquee{overflow:hidden;padding:16px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-track{display:flex;align-items:center;width:max-content;margin:0;padding:0;list-style:none;animation:logos-loop var(--marquee,64s) linear infinite}
.marquee-track li{flex:none;display:flex;align-items:center;padding:0 40px}
.marquee-track img{height:48px;width:auto;filter:brightness(2) grayscale(1);opacity:.5}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
@keyframes logos-loop{to{transform:translateX(-50%)}}
.logos-rv{margin:10px 0 0;text-align:center}
@media (max-width:767px){.marquee-track img{height:40px}}
@media (prefers-reduced-motion:reduce){
  .marquee{-webkit-mask-image:none;mask-image:none}
  .marquee-track{animation:none;width:auto;flex-wrap:wrap;justify-content:center;row-gap:24px}
  .marquee-track li{padding:0 24px}
  .marquee-track li[aria-hidden]{display:none}
}

/* Phone and tablet hero: last in the file so it wins over the base rules above. */
@media (max-width:960px){
  .hero .wrap{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "form" "more";padding-top:26px;padding-bottom:44px}
  .hero h1{font-size:clamp(28px,7.3vw,40px);margin-bottom:12px}
  .kicker{margin-bottom:12px}
  .hero .sub{margin-bottom:0}
  .form-card{margin-top:20px;padding:22px 18px 18px;border-radius:18px}
  .form-card h2{font-size:21px}
  .form-card .form-sub{margin-bottom:14px}
  .trustline{margin-top:4px}
  .checks{margin-top:26px}
}