/* Layout idea: a light, icy-blue studio page that echoes the glass LD logo; real work scrolls inside browser frames */
@font-face{font-family:"Heebo";font-weight:400;font-display:swap;src:url(fonts/heebo-hebrew-400.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-weight:500;font-display:swap;src:url(fonts/heebo-hebrew-500.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-weight:700;font-display:swap;src:url(fonts/heebo-hebrew-700.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-weight:800;font-display:swap;src:url(fonts/heebo-hebrew-800.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-weight:400;font-display:swap;src:url(fonts/heebo-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Heebo";font-weight:500;font-display:swap;src:url(fonts/heebo-latin-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Heebo";font-weight:700;font-display:swap;src:url(fonts/heebo-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Heebo";font-weight:800;font-display:swap;src:url(fonts/heebo-latin-800.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}

:root{
  --bg:#E6EAF3;
  --surface:#FFFFFF;
  --ink:#0D1430;
  --muted:#4F5873;
  --line:#D6DCEB;
  --blue:#2F4FE8;
  --cyan:#0FA9C6;
  --tint:#E9EEFF;
  --tint-cyan:#E2F6FA;
  --deep:#0F1B4D;
  --font:"Heebo",Arial,sans-serif;
  --r:24px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;overflow-x:clip;background:var(--bg) radial-gradient(rgba(13,20,48,.07) 1px,transparent 1px) 0 0/22px 22px;color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
h1,h2,h3{line-height:1.15;margin:0;text-wrap:balance;letter-spacing:-.02em}
h1{font-weight:800}
h2{font-size:clamp(30px,4.2vw,48px);font-weight:800;letter-spacing:-.025em}
h3{font-size:21px;font-weight:700}
p{margin:0}
.wrap{width:min(1200px,100% - 40px);margin-inline:auto}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:8px}
.skip{position:absolute;top:-60px;right:16px;z-index:100;background:var(--deep);color:#fff;padding:10px 18px;border-radius:10px;text-decoration:none}
.skip:focus{top:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.eyebrow{justify-self:start;width:max-content;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--blue);background:var(--tint);padding:6px 14px;border-radius:999px}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--blue)}
.grad{background:linear-gradient(90deg,#2F4FE8,#0FA9C6);-webkit-background-clip:text;background-clip:text;color:transparent}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 26px;border-radius:999px;font-weight:700;font-size:16.5px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;font-family:inherit;transition:transform .15s ease,box-shadow .15s ease}
.btn-primary{background:linear-gradient(135deg,#3654F0,#16A8D0);color:#fff;box-shadow:0 12px 26px -12px rgba(47,79,232,.8)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--blue)}
.btn-wa{background:#1A9E4C;color:#fff}
.btn svg{width:20px;height:20px;flex:none}

/* header */
.topline{font-size:12px;color:var(--muted);text-align:right;padding-top:6px}
header.site{position:sticky;top:0;z-index:40;background:rgba(230,234,243,.8);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid rgba(13,20,48,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:6px 0 10px}
.brand{display:block;flex:none}
.brand img{height:66px;width:auto}
.menu{display:flex;gap:4px;list-style:none;margin:0;padding:6px;font-size:15.5px;background:var(--surface);border:1px solid var(--line);border-radius:999px}
.menu a{display:block;text-decoration:none;padding:7px 15px;border-radius:999px;color:var(--muted);font-weight:500}
.menu a:hover,.menu a[aria-current="page"]{background:var(--tint);color:var(--ink)}
.nav-cta{min-height:46px;padding:8px 20px;font-size:15.5px}
.burger{display:none;width:48px;height:48px;border-radius:14px;border:1px solid var(--line);background:var(--surface);cursor:pointer}
.burger svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:2}

/* hero */
.hero{position:relative;padding:48px 0 44px}
.aurora{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.aurora i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5}
.aurora i:nth-child(1){width:560px;height:560px;background:#4D6BFF;top:-220px;left:-140px}
.aurora i:nth-child(2){width:480px;height:480px;background:#3FD3EE;top:120px;left:28%;opacity:.4}
.aurora i:nth-child(3){width:420px;height:420px;background:#9C86FF;bottom:-220px;left:-60px;opacity:.32}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(40px,5.6vw,74px);line-height:1.04;letter-spacing:-.035em;margin-top:18px;color:#0D1430}
.hero .lead{margin-top:22px;font-size:19.5px;color:var(--muted);max-width:32em}
.rot{color:var(--ink);font-weight:800;display:inline-block;min-width:7.5em}
.rot::after{content:"";display:inline-block;width:2px;height:1em;background:var(--blue);margin-inline-start:3px;vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;font-size:15px;color:var(--muted)}
.trust span{display:flex;align-items:center;gap:8px}
.trust svg{width:18px;height:18px;stroke:var(--blue);fill:none;stroke-width:2.4}
.stage{position:relative;height:500px}
.stage [data-depth]{transition:translate .25s ease-out}
.frame{position:absolute;background:var(--surface);border-radius:16px;box-shadow:0 40px 80px -30px rgba(13,20,48,.38),0 0 0 1px rgba(13,20,48,.06);overflow:hidden}
.frame .bar,.pf-bar{display:flex;gap:6px;padding:10px 12px;background:#F1F3F9;direction:ltr}
.frame .bar i,.pf-bar i{width:9px;height:9px;border-radius:50%;background:#D5DAE8}
.pf-bar i:nth-child(1){background:#FF6B6B}.pf-bar i:nth-child(2){background:#FFC24B}.pf-bar i:nth-child(3){background:#3DD68C}
.frame img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.f-back{width:68%;top:10px;left:0;transform:rotate(-4deg)}
.f-front{width:74%;top:150px;right:0;transform:rotate(2.5deg)}
.f-tall{width:34%;bottom:0;left:12%;transform:rotate(-5deg);border-radius:18px}
.f-tall img{aspect-ratio:9/14}
.chip{position:absolute;background:#fff;border-radius:16px;padding:12px 16px;box-shadow:0 18px 40px -18px rgba(13,20,48,.35);display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px}
.chip .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--tint-cyan)}
.chip .ic svg{width:18px;height:18px;fill:none;stroke:var(--cyan);stroke-width:2.2}
.chip-1{top:96px;right:-6px}
.chip-2{bottom:34px;right:8%}
.chip-2 .ic{background:var(--tint)}.chip-2 .ic svg{stroke:var(--blue)}

/* marquee */
.marquee{background:var(--deep);color:#fff;overflow:hidden;padding:18px 0;transform:rotate(-1.2deg) scale(1.03);box-shadow:0 20px 40px -24px rgba(15,27,77,.6)}
.mq-track{display:flex;gap:28px;width:max-content;align-items:center;font-weight:700;font-size:22px;white-space:nowrap}
.mq-track b{color:#5EE3F7;font-size:16px}

/* sections */
section{padding:92px 0}
.sec-head{display:grid;gap:14px;max-width:680px;margin-bottom:46px}
.sec-head p{color:var(--muted);font-size:18.5px}
.center{text-align:center;margin-inline:auto;justify-items:center}
.center .eyebrow{justify-self:center}

/* demo-first */
.demo{background:rgba(255,255,255,.8);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.9);border-radius:36px;padding:56px;display:grid;grid-template-columns:1fr 1.2fr;gap:56px;align-items:center;box-shadow:0 30px 60px -40px rgba(13,20,48,.3)}
.compare{display:grid;gap:12px}
.row,.col-h{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.col-h{font-size:14px;font-weight:700;color:var(--muted);padding-inline:6px}
.col-h span:last-child{color:var(--blue)}
.cell{border-radius:16px;padding:15px 18px;font-size:15.5px;display:flex;gap:10px;align-items:flex-start}
.cell.old{background:#F2F4F8;color:#7D859B;text-decoration:line-through;text-decoration-color:rgba(125,133,155,.5)}
.cell.new{background:var(--tint);font-weight:500}
.cell svg{width:18px;height:18px;flex:none;margin-top:4px;fill:none;stroke-width:2.4}
.cell.old svg{stroke:#B3B9CA}.cell.new svg{stroke:var(--blue)}

/* framed floating cards */
.panel{background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.9);border-radius:36px;padding:22px;box-shadow:0 30px 60px -40px rgba(13,20,48,.28)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:28px 24px;display:grid;gap:12px;align-content:start;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.card:hover,.card.is-touched{transform:translateY(-12px);box-shadow:0 34px 50px -26px rgba(47,79,232,.45)}
.card .ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:var(--tint)}
.card .ic svg{width:26px;height:26px;fill:none;stroke:var(--blue);stroke-width:1.8}
.card.c2 .ic{background:var(--tint-cyan)}.card.c2 .ic svg{stroke:var(--cyan)}
.card.c3 .ic{background:#F0ECFF}.card.c3 .ic svg{stroke:#6B4EE6}
.card.c4 .ic{background:#FFF3E6}.card.c4 .ic svg{stroke:#D97B1E}
.card p{color:var(--muted);font-size:15.5px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.tags span{font-size:12.5px;padding:3px 10px;border-radius:999px;background:var(--bg);border:1px solid var(--line);color:var(--muted)}
.step .n{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--tint);color:var(--blue);font-weight:800;font-size:18px}
.step.hl .n{background:linear-gradient(135deg,#3654F0,#16A8D0);color:#fff}

/* portfolio: hover to scroll */
.filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:34px}
.filters button{font:inherit;font-size:15px;font-weight:600;padding:9px 18px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--deep);color:#fff;border-color:var(--deep)}
.pf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.pf{display:grid;gap:14px;align-content:start}
.pf[hidden]{display:none}
.pf-frame{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -34px rgba(13,20,48,.45),0 0 0 1px rgba(13,20,48,.06);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease}
.pf:hover .pf-frame,.pf:focus-within .pf-frame,.pf.is-touched .pf-frame{transform:translateY(-8px);box-shadow:0 40px 70px -34px rgba(47,79,232,.55),0 0 0 2px rgba(15,169,198,.55)}
.pf-view{position:relative;height:300px;overflow:hidden;background:#EEF1F7}
.pf-view img{width:100%;height:auto;transform:translateY(0);transition:transform var(--dur,4s) cubic-bezier(.45,.05,.4,1)}
.pf-view.short img{height:100%;object-fit:cover;object-position:top;transition:transform 1.4s ease}
.pf:hover .pf-view img,.pf:focus-within .pf-view img,.pf.is-touched .pf-view img{transform:translateY(var(--shift,0))}
.pf:hover .pf-view.short img,.pf:focus-within .pf-view.short img,.pf.is-touched .pf-view.short img{transform:scale(1.12)}
.pf-video{background:linear-gradient(180deg,#D6E2FA,#E8ECF6)}

.pf-hint{position:absolute;bottom:12px;left:12px;font-size:12.5px;font-weight:700;color:#fff;background:rgba(13,20,48,.72);padding:4px 11px;border-radius:999px;transition:opacity .3s}
.pf:hover .pf-video{background:linear-gradient(180deg,#D6E2FA,#E8ECF6)}

.pf-hint{opacity:0}
.pf-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-inline:6px}
.pf-meta h3{font-size:19px}
.pf-meta p{color:var(--muted);font-size:15px;margin-top:2px}
.pf-tag{flex:none;font-size:12.5px;font-weight:700;padding:3px 11px;border-radius:999px;background:var(--tint);color:var(--blue)}

/* plans */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:34px;display:grid;gap:18px;align-content:start;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.plan:hover{transform:translateY(-8px);box-shadow:0 34px 50px -28px rgba(13,20,48,.3)}
.plan .price{font-size:44px;font-weight:800;line-height:1;display:flex;align-items:baseline;gap:8px}
.plan .price small{font-size:15px;color:var(--muted);font-weight:500}
.plan ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:16px}
.plan li{display:flex;gap:10px}
.plan li svg{width:20px;height:20px;flex:none;margin-top:3px;fill:none;stroke:var(--blue);stroke-width:2.4}
.plan .btn{margin-top:auto}
.plan .desc{color:var(--muted);font-size:15.5px}
.plan.main{background:var(--deep);color:#fff;border-color:var(--deep);box-shadow:0 30px 60px -28px rgba(15,27,77,.7)}
.plan.main .desc,.plan.main .price small{color:#B4BEE4}
.plan.main li svg{stroke:#5EE3F7}
.badge{justify-self:start;font-size:13px;font-weight:700;padding:4px 12px;border-radius:999px;background:#5EE3F7;color:#06303A}
.note{margin-top:30px;color:var(--muted);font-size:15px;text-align:center}

/* faq */
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start}
.faq{display:grid;gap:12px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:0 24px}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:700;font-size:17.5px;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--blue);font-size:20px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{padding-bottom:20px;color:var(--muted)}

/* brand strip */
.brandband{border-radius:36px;overflow:hidden;position:relative;box-shadow:0 30px 60px -40px rgba(13,20,48,.4)}
.brandband img{width:100%;aspect-ratio:21/8;object-fit:cover}
.brandband .over{position:absolute;inset:auto 0 0 0;padding:28px 34px;background:linear-gradient(0deg,rgba(255,255,255,.9),rgba(255,255,255,0));display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
.brandband .over p{max-width:34em;color:var(--ink);font-size:17.5px;font-weight:500}

/* cta + form */
.cta{background:radial-gradient(120% 140% at 100% 0%,#3451F5 0%,#1A2A86 55%,#0F1B4D 100%);color:#fff;border-radius:40px;padding:60px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;position:relative;overflow:hidden}
.cta h2{color:#fff}
.cta .lead{color:#C9D2F5;font-size:18.5px;margin-top:16px}
.cta .btn-ghost{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);color:#fff}
.cta .phone-line{margin-top:22px;color:#C9D2F5}
.cta .phone-line b{color:#fff}
form.lead-form{background:#fff;color:var(--ink);border-radius:var(--r);padding:30px;display:grid;gap:16px}
.field{display:grid;gap:6px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{font-size:14px;font-weight:500;color:var(--muted)}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:#F3F5FA;border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;min-height:50px;width:100%}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);background:#fff}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted)}
.consent input{width:20px;height:20px;min-height:0;margin-top:3px;flex:none;accent-color:var(--blue)}
.consent a{color:var(--blue)}
.form-msg{display:none;padding:14px 16px;border-radius:14px;background:var(--tint-cyan);font-size:15px}
.form-msg.show{display:block}
.form-msg a{color:var(--blue);font-weight:700}

/* footer */
footer.site{margin-top:40px;background:#fff;border-top:1px solid var(--line);padding:48px 0 28px;font-size:15px;color:var(--muted)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:36px}
.foot-brand{display:flex;gap:16px;align-items:center}
.foot-brand img{width:88px;height:88px}
.foot-brand b{display:block;color:var(--ink);font-size:18px}
footer h2{font-size:16px;letter-spacing:0;color:var(--ink);margin-bottom:10px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
footer a{text-decoration:none}
footer a:hover{color:var(--blue);text-decoration:underline}
.foot-bottom{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:14px}
.foot-bottom button{font:inherit;background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;padding:0}

/* floating: whatsapp + accessibility */
.wa-float{position:fixed;bottom:18px;left:18px;z-index:50;width:58px;height:58px;border-radius:50%;background:#1A9E4C;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(13,20,48,.45)}
.wa-float svg{width:30px;height:30px;fill:#fff}
.a11y-btn{position:fixed;bottom:18px;right:18px;z-index:50;width:58px;height:58px;border-radius:50%;background:var(--deep);border:0;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 30px -10px rgba(13,20,48,.45)}
.a11y-btn svg{width:32px;height:32px;fill:#fff}
.a11y-panel{position:fixed;bottom:88px;right:18px;z-index:60;width:min(320px,calc(100vw - 36px));background:#fff;border-radius:20px;padding:18px;box-shadow:0 30px 60px -20px rgba(13,20,48,.45);border:1px solid var(--line);display:grid;gap:8px}
.a11y-panel[hidden]{display:none}
.a11y-panel h2{font-size:18px;letter-spacing:0;margin-bottom:4px}
.a11y-panel button{font:inherit;font-size:15px;text-align:start;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:#F6F7FB;color:var(--ink);cursor:pointer}
.a11y-panel button[aria-pressed="true"]{background:var(--deep);color:#fff;border-color:var(--deep)}
.a11y-panel a{font-size:14px;color:var(--blue)}

/* accessibility modes */
html.a11y-contrast{--bg:#fff;--muted:#1B1F2E;--line:#000}
html.a11y-contrast body{background:#fff}
html.a11y-contrast .hero h1,html.a11y-contrast .grad{color:#000;background:none;-webkit-text-fill-color:#000}
html.a11y-contrast .btn-primary{background:#0018A8}
html.a11y-links a{text-decoration:underline!important;outline:1px dashed #0018A8;outline-offset:2px}
html.a11y-font body{font-family:Arial,Helvetica,sans-serif}
html.a11y-still *,html.a11y-still *::before,html.a11y-still *::after{animation:none!important;transition:none!important}
html.a11y-gray{filter:grayscale(1)}

/* cookie banner */
.cookie{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:70;width:min(760px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 60px -20px rgba(13,20,48,.45);padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
.cookie[hidden]{display:none}
.cookie p{font-size:15px;color:var(--muted)}
.cookie p b{color:var(--ink)}
.cookie a{color:var(--blue)}
.cookie .acts{display:flex;gap:8px;flex-wrap:wrap}
.cookie .btn{min-height:44px;padding:8px 18px;font-size:15px}

/* legal pages */
.page-hero{padding:56px 0 24px}
.page-hero h1{font-size:clamp(34px,4.6vw,54px)}
.page-hero p{color:var(--muted);margin-top:12px;font-size:18px}
.legal{background:#fff;border:1px solid var(--line);border-radius:28px;padding:44px clamp(22px,5vw,56px);max-width:860px;margin-inline:auto}
.legal h2{font-size:24px;letter-spacing:-.01em;margin:30px 0 10px}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{color:#2A3149;font-size:17px}
.legal p+p{margin-top:10px}
.legal ul{padding-inline-start:22px;display:grid;gap:6px;margin:10px 0}
.legal .meta{font-size:14.5px;color:var(--muted);border-top:1px solid var(--line);margin-top:30px;padding-top:16px}
.legal table{width:100%;border-collapse:collapse;font-size:15.5px;margin:12px 0}
.legal th,.legal td{text-align:start;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.legal th{background:#F3F5FA}
.ph{background:#FFF3D6;padding:0 4px;border-radius:4px}

/* 404 */
.nf{padding:40px 0 20px;display:grid;gap:22px;justify-items:center;text-align:center}
.nf .code{font-size:clamp(90px,16vw,170px);font-weight:800;line-height:1;letter-spacing:-.05em}
.nf img{width:min(820px,100%);border-radius:28px;box-shadow:0 30px 60px -40px rgba(13,20,48,.4)}
.nf p{color:var(--muted);font-size:19px;max-width:32em}

/* reveal */
.rv{transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s ease}
.rv.pre{transform:translateY(26px)}

@media (prefers-reduced-motion:no-preference){
  .aurora i:nth-child(1){animation:drift1 18s ease-in-out infinite}
  .aurora i:nth-child(2){animation:drift2 22s ease-in-out infinite}
  .aurora i:nth-child(3){animation:drift1 26s ease-in-out -8s infinite reverse}
  @keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(120px,60px) scale(1.15)}}
  @keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-140px,80px)}}
  .mq-track{animation:mq 34s linear infinite}
  @keyframes mq{to{transform:translateX(50%)}}
  .chip-1{animation:float 6s ease-in-out infinite}
  .chip-2{animation:float 6s ease-in-out -3s infinite}
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
}

/* responsive */
@media (max-width:1060px){
  .menu{display:none}
  .burger{display:grid;place-items:center}
  .menu.open{display:grid;position:absolute;top:100%;inset-inline:20px;border-radius:20px;padding:10px;box-shadow:0 30px 60px -20px rgba(13,20,48,.4)}
  .menu.open a{padding:12px 16px;font-size:17px}
  .hero-grid,.demo,.faq-grid,.cta{grid-template-columns:1fr}
  .stage{height:440px;max-width:620px;width:100%;margin-inline:auto}
  .cards{grid-template-columns:1fr 1fr}
  .pf-grid{grid-template-columns:1fr 1fr}
  .plans{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  section{padding:64px 0}
  .brand img{height:46px}
  .nav-cta{display:none}
  .hero{padding:24px 0 30px}
  .stage{height:330px}
  .chip{font-size:13.5px;padding:9px 12px}
  .chip-1{top:56px}
  .chip-2{bottom:6px;right:2%}
  .ctas .btn{width:100%}
  .demo{padding:28px 18px;border-radius:28px;gap:30px}
  .row,.col-h{gap:8px}
  .cell{padding:12px;font-size:14.5px}
  .cards,.pf-grid{grid-template-columns:1fr}
  .panel{padding:12px;border-radius:28px}
  .cta{padding:30px 18px;border-radius:28px}
  .two{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .cookie{grid-template-columns:1fr}
  .brandband img{aspect-ratio:16/9}
  .brandband .over{position:static;background:#fff}
}

/* hero showcase */
.showcase{position:relative}
.sc-frame{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 50px 100px -40px rgba(13,20,48,.5),0 0 0 1px rgba(13,20,48,.06)}
.sc-url{margin-left:10px;font-size:12px;color:#7A839B;background:#fff;border-radius:8px;padding:2px 12px;direction:ltr}
.sc-view{position:relative;aspect-ratio:16/11;overflow:hidden;background:#EEF1F7}
.sc-view img{position:absolute;inset:0 0 auto 0;width:100%;height:auto;opacity:0;transition:opacity .9s ease}
.sc-view img.on{opacity:1}
.sc-dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
.sc-dots i{width:9px;height:9px;border-radius:99px;background:#C3CBE0;transition:width .3s,background .3s}
.sc-dots i.on{width:26px;background:var(--blue)}
.pf-video{display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#DDE6FF,#C9D6F2)}
.phone-shell{height:94%;aspect-ratio:360/648;border-radius:26px;background:#0D1430;padding:6px;box-shadow:0 20px 40px -18px rgba(13,20,48,.6)}
.phone-shell video{width:100%;height:100%;object-fit:cover;border-radius:20px;display:block}

/* ===== v3: light sky + navy glass look (per reference design) ===== */
:root{--bg:#f6f9fc;--ink:#22304d;--muted:#5d6b85;--line:#dde7f2;--blue:#2b7fd0;--cyan:#4aa8e8;--sky:#4aa8e8;--navy:#1b2f5e;--deep:#1b2f5e;--tint:#e6f3fd;--tint-cyan:#e3f6f4;--card:#ffffffcc;--ok:#1f9d6b}
body{background:var(--bg)}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(900px 500px at 85% -10%,#d8ecfb 0,transparent 60%),radial-gradient(700px 500px at -10% 30%,#e7f0ff 0,transparent 60%),radial-gradient(600px 400px at 60% 110%,#e3f6f4 0,transparent 60%)}
h1,h2{color:var(--navy)}
.hero h1{color:var(--navy)}
.eyebrow{color:var(--sky);background:#e6f3fd}
.eyebrow::before{background:var(--sky)}
.grad{background-image:linear-gradient(90deg,#1b2f5e,#4aa8e8)}
.btn-primary{background:linear-gradient(135deg,#1b2f5e,#2f6fb8 55%,#4aa8e8);box-shadow:0 12px 26px -12px rgba(27,47,94,.7)}
.btn-ghost{background:#ffffffd9}
.btn-ghost:hover{border-color:var(--sky)}
header.site{background:#f6f9fcd9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid #e6eef7}
.aurora i:nth-child(1){background:#7cc4f2}.aurora i:nth-child(2){background:#bfe3fb}.aurora i:nth-child(3){background:#c9d8ff}
.card,.plan,details{background:var(--card);border:1px solid #fff;box-shadow:0 10px 30px #1b2f5e12;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.card .ic{background:#e6f3fd}.card .ic svg{stroke:var(--navy)}
.panel{background:#ffffff80}
.cta{background:radial-gradient(120% 140% at 100% 0%,#2f6fb8 0%,#1b2f5e 60%,#14244a 100%)}
.card .more{font-weight:700;color:var(--blue);text-decoration:none;font-size:15px;margin-top:4px}
.card .more:hover{text-decoration:underline}

/* pricing: two plans */
.plans.two{grid-template-columns:repeat(2,minmax(0,430px));justify-content:center;gap:26px}
.plan .price{color:var(--navy);font-size:46px}
.plan li svg{stroke:var(--ok)}
.plan li.off{color:var(--muted)}
.plan li.off svg{stroke:#b5c0d3}
.plan.main{background:linear-gradient(180deg,#ffffff,#eef6fe);color:var(--ink);border:2px solid var(--sky);box-shadow:0 22px 50px #4aa8e840;transform:translateY(-10px)}
.plan.main:hover{transform:translateY(-16px)}
.plan.main .desc,.plan.main .price small{color:var(--muted)}
.plan.main li svg{stroke:var(--ok)}
.plan .setup{margin-top:-10px;font-weight:700;color:var(--navy);background:#e6f3fd;justify-self:start;padding:4px 12px;border-radius:999px;font-size:15px}
.badge{background:linear-gradient(135deg,#1b2f5e,#4aa8e8);color:#fff;padding:5px 14px}
.plan-strip{display:flex;align-items:center;gap:18px;max-width:886px;margin:30px auto 0;padding:20px 24px;border-radius:22px;background:linear-gradient(135deg,#e3f1fc,#eef3ff);border:1px solid #fff;box-shadow:0 14px 40px #1b2f5e14;text-decoration:none;color:var(--ink);transition:transform .2s}
.plan-strip:hover{transform:translateY(-3px)}
.plan-strip .ps-ic{width:50px;height:50px;flex:none;border-radius:14px;background:#fff;display:grid;place-items:center}
.plan-strip .ps-ic svg{width:26px;height:26px;fill:none;stroke:var(--navy);stroke-width:1.8}
.plan-strip b{display:block;color:var(--navy);font-size:17px}
.plan-strip small{display:block;color:var(--muted);font-size:14.5px;line-height:1.5;margin-top:2px}
.plan-strip .ps-go{margin-inline-start:auto;flex:none;font-weight:700;color:var(--blue);white-space:nowrap}
.tbl-wrap{max-width:886px;margin:22px auto 0;overflow-x:auto;border-radius:18px}
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border-radius:18px;overflow:hidden;border:1px solid var(--line)}
.cmp th,.cmp td{padding:13px 16px;text-align:right;border-bottom:1px solid var(--line);font-size:15px;vertical-align:top}
.cmp th{background:#eef5fc;color:var(--navy)}
.cmp tr:last-child td{border-bottom:0}
.cmp td:last-child{font-weight:700;color:var(--navy)}
.cmp.plain td:last-child{font-weight:500;color:var(--ink)}
.cmp.plain td:first-child{font-weight:700;color:var(--navy)}
.cmp sup a{color:var(--blue);text-decoration:none;font-weight:700}
#prices .tbl-wrap,.sys-wide .tbl-wrap{max-width:1000px}
section .tbl-wrap + .note{max-width:886px;margin-inline:auto}

/* systems page */
.sys-hero p{max-width:46em}
.pay-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
.flow{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.flow li{display:flex;gap:16px;background:var(--card);border:1px solid #fff;border-radius:20px;padding:20px 22px;box-shadow:0 10px 30px #1b2f5e12}
.flow .n{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,#1b2f5e,#4aa8e8)}
.flow h3{font-size:18px;color:var(--navy)}
.flow p{color:var(--muted);font-size:15.5px;margin-top:4px}
.offer{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center;background:linear-gradient(135deg,#e3f1fc,#eef3ff);border:1px solid #fff;border-radius:30px;padding:44px;box-shadow:0 14px 40px #1b2f5e14}
.offer h2{margin:12px 0 10px}
.offer p{color:var(--muted);margin-bottom:22px}
.offer-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.offer-list li{display:flex;gap:10px;background:#ffffffcc;border-radius:14px;padding:12px 14px;font-size:15.5px}
.offer-list svg{width:20px;height:20px;flex:none;margin-top:3px;fill:none;stroke:var(--ok);stroke-width:2.4}
.cta.band{grid-template-columns:1.2fr .8fr;padding:44px}
.sources{margin-top:34px;font-size:14.5px;color:var(--muted)}
.sources h2{font-size:18px;margin-bottom:6px}
.sources ol{margin:0;padding-inline-start:22px;display:grid;gap:4px}
.sources a{color:var(--blue)}
@media (max-width:900px){
  .plans.two{grid-template-columns:1fr}
  .plan.main{transform:none}
  .plan-strip{flex-wrap:wrap}.plan-strip .ps-go{margin-inline-start:0}
  .pay-grid,.offer,.cta.band{grid-template-columns:1fr}
  .offer{padding:28px}.offer-list{grid-template-columns:1fr}
  .cmp th,.cmp td{padding:10px;font-size:14px}
}

.sources{margin-top:40px}
.plan-strip + .note{max-width:886px;margin-inline:auto}

@media (max-width:640px){
  .cmp.plain thead{display:none}
  .cmp.plain,.cmp.plain tbody,.cmp.plain tr,.cmp.plain td{display:block;width:100%}
  .cmp.plain tr{border-bottom:1px solid var(--line);padding:10px 0}
  .cmp.plain tr:last-child{border-bottom:0}
  .cmp.plain td{border:0;padding:4px 16px}
  .cmp.plain td:first-child{font-size:17px;padding-top:8px}
  .cmp.plain td:not(:first-child)::before{content:attr(data-l) ": ";font-weight:700;color:var(--navy)}
}

/* compact single-column hero */
.hero{padding:34px 0 18px}
.hero-grid.hero-one{grid-template-columns:1fr;text-align:center;justify-items:center;gap:0}
.hero-one .eyebrow{justify-self:center}
.hero-one h1{font-size:clamp(36px,5.4vw,68px);max-width:none;margin-top:14px}
.hero-one .lead{margin:16px auto 0;max-width:48em;font-size:18.5px}
.hero-one .ctas{justify-content:center;margin-top:22px}
.hero-one .trust{justify-content:center;margin-top:16px}
#how{padding-top:40px}

/* full iPhone, never cropped */
.pf-video{display:block;position:relative}
.phone-shell{position:absolute;top:10px;bottom:10px;left:50%;transform:translateX(-50%);height:auto;width:auto;aspect-ratio:372/672;border-radius:24px;padding:6px;background:#0D1430}
.phone-shell video{width:100%;height:100%;object-fit:contain;border-radius:18px;background:#bfe0f7}
.phone-shell::after{content:"";position:absolute;top:4.5%;right:7%;width:17%;aspect-ratio:1;border-radius:50%;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(255,255,255,.35)}
.pf-video .pf-hint{z-index:2}