:root{
  --ink:#0f1e2e;
  --ink-soft:#344d63;
  --muted:#68727f;
  --subtle:#8e8e93;
  --line:#e7e7e7;
  --line-strong:#dddddd;
  --surface:#ffffff;
  --soft:#fcfbf8;
  --soft-cool:#fcf9f8;
  --blue:#007aff;
  --blue-2:#2a66ff;
  --blue-hover:#0056cc;
  --blue-active:#004ba3;
  --purple:#7e3d7b;
  --purple-deep:#691264;
  --teal:#0f3547;
  --shadow-1:0 1px 3px rgba(0,0,0,.08);
  --shadow-2:0 4px 12px rgba(0,0,0,.1);
  --shadow-3:0 8px 24px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--surface);color:var(--ink);font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;letter-spacing:0}
a{text-decoration:none;color:inherit}
p{font-size:20px;font-weight:500;line-height:1.5}
.nav{height:62px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 40px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}
.logo{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700}
.mark{width:28px;height:28px;border-radius:6px;background:var(--ink);color:#fff;display:inline-grid;place-items:center;font-weight:800}
.nav-links{display:flex;align-items:center;gap:48px;font-size:16px;font-weight:500;color:var(--ink)}
.nav-links a{padding:4px 0;border-bottom:2px solid transparent;line-height:24px}
.nav-links a:hover{color:var(--blue);border-bottom-color:var(--blue)}
.nav-actions{display:flex;justify-content:flex-end;align-items:center;gap:22px;font-size:14px;font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:45px;border-radius:6px;padding:12px 24px;font-size:14px;font-weight:600;line-height:21px;border:2px solid var(--ink);background:transparent;color:var(--ink);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease,transform .18s ease}
.btn:hover{background:#f5f5f5;border-color:var(--teal);transform:translateY(-1px)}
.btn.blue{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.blue:hover{background:var(--blue-hover);border-color:var(--blue-hover);box-shadow:0 2px 8px rgba(0,122,255,.3)}
.btn.blue:active{background:var(--blue-active)}
.btn.ghost{border:0;background:transparent;color:rgba(15,30,46,.82);padding:12px 16px}
.btn.ghost:hover{background:rgba(0,0,0,.05)}
.hero{min-height:640px;position:relative;display:grid;grid-template-columns:minmax(0,1fr) 360px;align-items:center;gap:96px;padding:92px clamp(40px,10vw,160px) 56px;overflow:hidden;background:linear-gradient(180deg,#fff 0%,var(--soft) 100%)}
.hero-copy h1{font-size:clamp(52px,6vw,72px);font-weight:700;line-height:1.05;margin:0 0 16px;max-width:760px}
.hero-copy h1 span{color:var(--blue)}
.hero-copy p{margin:0 0 24px;color:var(--ink-soft);font-size:20px;font-weight:500;line-height:30px}
.rating{display:flex;align-items:center;gap:8px;margin-top:16px;color:var(--purple-deep);font-size:14px;font-weight:600}
.rating span{width:18px;height:18px;border-radius:50%;background:var(--purple)}
.arc{position:absolute;width:520px;height:160px;border-top:2px dashed #cdd6df;border-radius:50%;top:170px;opacity:.75}
.arc-left{left:-130px;transform:rotate(-12deg)}
.arc-right{right:-100px;border-color:#9bc3ff;transform:rotate(18deg)}
.phone{width:285px;margin:auto;border-radius:32px;border:8px solid #f4f4f4;background:#fff;box-shadow:var(--shadow-3);padding:16px}
.phone-bar{display:flex;justify-content:space-between;font-size:10px;margin-bottom:14px;color:var(--ink-soft)}
.bubble{background:#f5f5f5;border-radius:4px 18px 18px 18px;padding:12px 16px;font-size:16px;font-weight:500;line-height:24px}
.choice{margin-top:8px;background:var(--blue);color:#fff;border-radius:18px 18px 4px 18px;padding:12px 16px;font-size:16px;font-weight:500;line-height:24px}
.input{margin-top:12px;border:1px solid var(--line);border-radius:6px;padding:12px 16px;color:var(--subtle);font-size:16px;line-height:24px}
.logos{text-align:center;padding:48px 24px 64px}
.logos p{font-size:14px;color:var(--muted);margin:0}
.logo-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;max-width:980px;margin:24px auto 0;color:#474a55;font-weight:700;opacity:.76}
.logo-grid.small{grid-template-columns:repeat(4,1fr);margin-left:0;text-align:left}
.usecases{max-width:1120px;margin:auto;padding:0 40px}
.case-row{display:grid;grid-template-columns:1fr 1.35fr;min-height:280px;border:1px solid var(--line);margin-bottom:24px;background:#fff;box-shadow:var(--shadow-1)}
.case-row>div:first-child{padding:40px}
.case-row small,.steps-section small,.integrations-section small,.security-section small,.page-title small,.security-cards small,.two-col-band small{color:var(--purple-deep);text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:0}
.case-row h2{font-size:32px;font-weight:700;line-height:1.1;margin:10px 0 12px}
.case-row p{color:var(--muted);margin:0}
.mock-card{position:relative;margin:0;background:var(--soft);display:grid;align-content:center;justify-items:center;padding:40px}
.blue-soft .mock-card{background:#f3f8ff}
.yellow-soft .mock-card{background:var(--soft-cool)}
.pill{display:inline-block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:12px;font-weight:600;line-height:18px;box-shadow:var(--shadow-1)}
.blue-pill{background:var(--blue);border-color:var(--blue);color:#fff}
.table-line{width:300px;height:18px;background:#fff;border:1px solid var(--line);border-radius:4px;margin:8px}
.table-line.short{width:220px}
.floating-note{position:absolute;right:44px;top:58px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:12px;box-shadow:var(--shadow-2);font-size:14px;font-weight:600}
.calendar-box,.notes-card{background:#fff;border:1px solid var(--line);border-radius:4px;padding:24px;box-shadow:var(--shadow-2);display:grid;gap:8px}
.notes-card{justify-items:start}
.notes-card ul{margin:4px 0 0;padding-left:20px;color:var(--muted);line-height:1.7}
.blank-card{background:#fff}
.video-section,.steps-section,.integrations-section,.security-section,.pricing-preview,.testimonials,.final-hero,.page-title{text-align:center;padding:96px 40px}
.video-section h2,.steps-section h2,.integrations-section h2,.security-section h2,.pricing-preview h2,.testimonials h2,.final-hero h2,.page-title h1,.security-cards h2{font-size:clamp(36px,4vw,52px);font-weight:700;line-height:1.08;margin:0 auto 16px;max-width:820px}
.video-box{max-width:760px;aspect-ratio:16/8;margin:36px auto 0;background:linear-gradient(135deg,#0f1e2e,#2a66ff);border-radius:6px;display:grid;place-items:center;box-shadow:var(--shadow-2)}
.video-box button{border:0;background:#fff;border-radius:6px;padding:12px 24px;font-family:inherit;font-weight:600;color:var(--ink)}
.three-cols,.price-cards,.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:980px;margin:40px auto}
.three-cols article,.price-cards article,.quotes article{border:1px solid var(--line);border-radius:4px;padding:24px;text-align:left;background:#fff;box-shadow:var(--shadow-1)}
.three-cols article:hover,.price-cards article:hover,.quotes article:hover{border-color:var(--blue);box-shadow:0 2px 8px rgba(0,122,255,.15)}
.three-cols span{color:var(--blue);font-weight:700}
.three-cols p,.price-cards p,.quotes p{font-size:16px;line-height:24px;color:var(--muted)}
.integrations-section p,.security-section p,.pricing-preview p,.final-hero p,.page-title p{color:var(--muted);max-width:620px;margin:0 auto 24px;line-height:30px}
.app-cloud{max-width:820px;min-height:260px;margin:40px auto;display:flex;align-content:center;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap}
.app-cloud span{border:1px solid var(--line);border-radius:12px;padding:14px 18px;background:#fff;box-shadow:var(--shadow-1);font-weight:600}
.app-cloud span:hover{border-color:var(--blue);box-shadow:0 2px 8px rgba(0,122,255,.15)}
.badges{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin:32px auto}
.badges span{border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:#f5f5f5;color:var(--ink);font-size:12px;font-weight:600;line-height:18px}
.badges span:first-child,.badges span:nth-child(2){background:var(--purple);border-color:var(--purple);color:#fff}
.badge-muted{display:inline-flex;border:1px solid var(--line);border-radius:12px;padding:4px 12px;background:#f5f5f5;color:var(--ink);font-size:12px;font-weight:600;line-height:18px}
.pricing-preview{background:var(--soft)}
.strike{text-decoration:line-through;color:var(--muted);font-size:28px;font-weight:800}
.price{font-size:32px!important;font-weight:800!important;color:var(--ink)!important}
.featured{border-color:var(--blue)!important;box-shadow:var(--shadow-2)!important}
.testimonials{overflow:hidden}
.final-hero{margin:0 16px 70px;border:1px solid var(--line);border-radius:6px;background:linear-gradient(180deg,#fff,var(--soft));min-height:360px;display:grid;align-content:center;box-shadow:var(--shadow-1)}
.footer{display:flex;justify-content:space-between;padding:44px 40px;border-top:1px solid var(--line)}
.footer nav{display:flex;gap:24px;color:var(--muted);font-size:14px;font-weight:500}
.page-title{padding-top:96px}
.page-title h1{font-size:clamp(48px,6vw,72px)}
.tinted{background:#f7f9fc}
.pricing-slider-section{max-width:1120px;margin:0 auto 96px;padding:0 40px}
.package-shell{border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:var(--shadow-1);overflow:hidden}
.package-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;padding:28px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,var(--soft))}
.package-control small{color:var(--purple-deep);text-transform:uppercase;font-size:12px;font-weight:600}
.package-control h2{margin:8px 0 0;font-size:32px;line-height:1.1}
.credit-readout{display:grid;gap:4px;justify-items:end;color:var(--muted);font-size:14px}
.credit-readout strong{color:var(--blue);font-size:24px}
.package-slider{position:relative;padding:36px 28px 28px;border-bottom:1px solid var(--line)}
.package-slider input[type=range]{width:100%;margin:0;appearance:none;background:transparent;position:relative;z-index:2}
.package-slider input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--blue) 0%,var(--blue) var(--progress,50%),#edf1f6 var(--progress,50%),#edf1f6 100%)}
.package-slider input[type=range]::-moz-range-track{height:8px;border-radius:999px;background:#edf1f6}
.package-slider input[type=range]::-moz-range-progress{height:8px;border-radius:999px;background:var(--blue)}
.package-slider input[type=range]::-webkit-slider-thumb{appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:8px solid var(--blue);box-shadow:var(--shadow-2);margin-top:-10px;cursor:pointer}
.package-slider input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:8px solid var(--blue);box-shadow:var(--shadow-2);cursor:pointer}
.package-slider[data-current="0"]{--progress:0%}
.package-slider[data-current="1"]{--progress:50%}
.package-slider[data-current="2"]{--progress:100%}
.slider-labels{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.slider-labels button{font:inherit;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--muted);padding:14px 16px;display:grid;gap:4px;text-align:left;cursor:pointer;box-shadow:var(--shadow-1)}
.slider-labels button:hover,.slider-labels button.active{border-color:var(--blue);box-shadow:0 2px 8px rgba(0,122,255,.15);color:var(--ink)}
.slider-labels span{font-size:14px;font-weight:700}
.slider-labels strong{font-size:20px;color:var(--blue)}
.selected-package{padding:28px;background:#fff}
.package-heading{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:32px;align-items:start}
.package-heading h3{font-size:44px;line-height:1.05;margin:14px 0 12px}
.package-heading p{margin:0;color:var(--muted);max-width:660px}
.package-price{display:grid;gap:8px;justify-items:stretch;text-align:right}
.package-price strong{font-size:42px;line-height:1;color:var(--ink)}
.package-price span{font-size:14px;color:var(--muted)}
.package-price .btn{margin-top:10px}
.package-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}
.package-grid>div{border:1px solid var(--line);border-radius:4px;background:var(--soft);padding:24px}
.package-grid h4{margin:0 0 12px;font-size:18px}
.package-grid ul{margin:0;padding-left:20px;color:var(--muted);line-height:1.9}
.usage-examples{margin-top:24px;border:1px solid var(--line);border-radius:4px;background:#fff}
.usage-examples summary{cursor:pointer;padding:18px 20px;font-weight:700;color:var(--ink)}
.example-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;padding:0 20px 20px}
.example-grid article{border:1px solid var(--line);border-radius:4px;background:var(--soft-cool);padding:16px;display:grid;gap:8px}
.example-grid strong{font-size:14px}
.example-grid span{font-size:13px;line-height:1.5;color:var(--muted)}
.enterprise-package{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,420px) auto;align-items:center;gap:28px;margin-top:24px;border:1px solid var(--line);border-radius:6px;background:var(--ink);color:#fff;padding:28px;box-shadow:var(--shadow-2)}
.enterprise-package h3{font-size:36px;line-height:1;margin:12px 0}
.enterprise-package p{margin:0;color:rgba(255,255,255,.74)}
.enterprise-package ul{margin:0;padding-left:20px;line-height:1.8;color:rgba(255,255,255,.78)}
.enterprise-package .badge-muted{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.enterprise-package .btn.ghost{background:#fff;color:var(--ink);border:0;white-space:nowrap}
.pricing-matrix{max-width:1120px;margin:0 auto 96px;padding:0 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pricing-matrix article{border:1px solid var(--line);border-radius:4px;padding:24px;background:#fff;box-shadow:var(--shadow-1)}
.pricing-matrix .enterprise-wide{grid-column:1/-1;display:grid;grid-template-columns:1fr 2fr auto;align-items:center}
.pricing-matrix ul,.price-cards ul{padding-left:20px;color:var(--muted);line-height:2}
.faq{max-width:760px;margin:auto;padding:80px 40px}
.faq h2{text-align:center;font-size:42px}
.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{font-weight:800}
.trust-logos{display:flex;justify-content:center;gap:48px;padding:40px;color:var(--subtle);font-weight:800}
.security-cards{text-align:center;padding:96px 40px;background:#fff}
.four-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1040px;margin:40px auto 0}
.four-grid article{border:1px solid var(--line);border-radius:4px;padding:24px;text-align:left;background:var(--soft);min-height:190px;box-shadow:var(--shadow-1)}
.two-col-band{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:96px clamp(40px,10vw,160px);background:var(--soft-cool)}
.two-col-band.white{background:#fff}
.two-col-band h2{font-size:44px;line-height:1.08}
.two-col-band ul{list-style:none;padding:0}
.two-col-band li{display:grid;gap:6px;border-bottom:1px solid var(--line);padding:18px 0}
.two-col-band li span{color:var(--muted)}
.blue-panel{background:#dcecff;border:1px solid #b3d9ff;border-radius:6px;min-height:230px;display:grid;place-items:center}
.connection-card{background:#fff;border:1px solid var(--line);border-radius:4px;padding:28px;box-shadow:var(--shadow-2)}
.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:30px}
.app-grid span{background:#f5f5f5;border-radius:4px;padding:12px;text-align:center;font-weight:600}
.contact-page{display:grid;grid-template-columns:1fr 520px;gap:80px;padding:96px clamp(40px,9vw,150px)}
.contact-copy h1{font-size:62px;line-height:1.08}
.contact-copy p{font-size:20px;line-height:30px}
.contact-copy li{margin:14px 0;font-size:18px}
.assistant-badge{position:relative;display:flex;gap:10px;align-items:center;margin-bottom:28px}
.assistant-badge em{background:#f5f5f5;border:1px solid var(--line);border-radius:12px;padding:4px 12px;font-style:normal;font-size:12px;font-weight:600}
.form-card{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:#fff;box-shadow:var(--shadow-1)}
.form-card h2{padding:24px 28px;margin:0;border-bottom:1px solid var(--line)}
.form-card form{display:grid;gap:22px;padding:26px}
.form-card label{display:grid;gap:8px;font-weight:600;font-size:14px;line-height:21px}
.form-card input,.form-card select{height:48px;border:1px solid var(--line);border-radius:6px;padding:12px 16px;font:500 16px/24px Manrope,system-ui,sans-serif;color:var(--ink)}
.form-card input:focus,.form-card select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,122,255,.1)}
.form-card button{width:100%;border:0}
.integrations-browser{max-width:1120px;margin:auto;padding:0 40px 96px;display:grid;grid-template-columns:240px 1fr;gap:24px}
.integrations-browser aside,.integration-list article{border:1px solid var(--line);border-radius:4px;background:#fff;box-shadow:var(--shadow-1)}
.integrations-browser aside{display:grid;gap:12px;align-content:start;padding:20px}
.integrations-browser aside span{color:var(--muted)}
.integration-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.integration-list article{padding:22px;font-weight:800}
@media(max-width:1199px){
  .nav{grid-template-columns:1fr auto;padding:0 24px}
  .nav-links{gap:24px}
  .hero{grid-template-columns:1fr 320px;gap:48px;padding:72px 32px 48px}
  .pricing-matrix{grid-template-columns:repeat(2,1fr)}
  .example-grid{grid-template-columns:repeat(2,1fr)}
  .enterprise-package{grid-template-columns:1fr}
  .four-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:767px){
  p{font-size:16px;line-height:24px}
  .nav{padding:0 16px}
  .nav-links{display:none}
  .nav-actions a:first-child{display:none}
  .btn{min-height:43px;padding:10px 18px}
  .hero,.case-row,.two-col-band,.contact-page,.integrations-browser{grid-template-columns:1fr}
  .hero{min-height:auto;padding:56px 16px 40px;gap:40px}
  .arc{display:none}
  .phone{width:100%;max-width:300px}
  .hero-copy h1,.page-title h1,.contact-copy h1{font-size:46px}
  .logo-grid,.three-cols,.price-cards,.quotes,.four-grid,.pricing-matrix,.integration-list{grid-template-columns:1fr}
  .pricing-slider-section{padding:0 16px;margin-bottom:64px}
  .package-control,.package-heading,.package-grid{grid-template-columns:1fr}
  .package-control{padding:22px}
  .credit-readout,.package-price{justify-items:start;text-align:left}
  .slider-labels{gap:8px}
  .slider-labels button{padding:12px 10px}
  .slider-labels span{font-size:12px}
  .slider-labels strong{font-size:16px}
  .selected-package{padding:22px}
  .package-heading h3{font-size:36px}
  .example-grid{grid-template-columns:1fr}
  .enterprise-package{padding:22px}
  .logos,.video-section,.steps-section,.integrations-section,.security-section,.pricing-preview,.testimonials,.final-hero,.page-title,.security-cards{padding:64px 16px}
  .usecases{padding:0 16px}
  .case-row{min-width:0}
  .case-row>div{min-width:0}
  .case-row>div:first-child{padding:24px}
  .mock-card{padding:24px}
  .table-line{width:100%;max-width:260px}
  .floating-note{right:24px;top:48px}
  .pricing-matrix .enterprise-wide{grid-column:auto;display:block}
  .footer{display:grid;gap:20px;padding:36px 16px}
  .contact-page{padding:56px 16px}
  .trust-logos{flex-wrap:wrap;gap:18px}
  .app-grid{grid-template-columns:repeat(2,1fr)}
}