@font-face{font-family:"Inter Variable";font-weight:100 900;src:url(../../fonts/inter-variable.woff2) format("woff2")}
  :root{
      --c-cream:var(--cream,#fefcf2);
      --c-sand:var(--sand,#e5dec2);
      --c-sand-light:var(--sand-light,#f4f0df);
      --c-sand-deep:var(--sand-deep,#cfc59f);
      --c-ink:var(--ink,#183e4f); --c-ink-muted:var(--ink-muted,#4b6470); --c-ink-hover:var(--ink-hover,#0f2c39);
    --c-on-ink:var(--on-ink,#fefcf2); --c-accent:#8f6fe0; --c-on-accent:#0b1f29; --g-accent:linear-gradient(90deg,#2aa9dd 0%,#8f6fe0 50%,#e2508a 100%); --g-accent-v:linear-gradient(0deg,#2aa9dd 0%,#8f6fe0 50%,#e2508a 100%); /* variant B: aurora accent, set locally */ --c-pos:var(--positive,#2f7a52); --c-neg:var(--negative,#9a2f3a);
    --f:var(--font-sans,"Inter Variable",Inter,system-ui,sans-serif);
    --r-sm:var(--radius-sm,4px); --r-md:var(--radius-md,8px); --r-lg:var(--radius-lg,16px);
    --s2:var(--space-2,8px); --s3:var(--space-3,16px); --s4:var(--space-4,24px); --s5:var(--space-5,40px); --s6:var(--space-6,64px); --s7:var(--space-7,112px);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  body{background:var(--c-cream);color:var(--c-ink);font-family:var(--f);font-size:15px;line-height:24px;-webkit-font-smoothing:antialiased;min-width:320px;overflow-x:hidden}
  .wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 40px}
  a{color:inherit;text-decoration:none}
  .eyebrow{display:flex;align-items:center;gap:10px;font-size:13px;line-height:18px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--c-ink)}
  .eyebrow::before{content:"";width:10px;height:10px;border-radius:2px;background:var(--g-accent);flex:none}
  h1.display{font-size:64px;line-height:68px;font-weight:750;letter-spacing:-.035em}
  h1.display em{font-style:normal;background:var(--g-accent);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-bottom:.06em}
  h2.h1{font-size:48px;line-height:52px;font-weight:750;letter-spacing:-.025em}
  h3{font-size:18px;line-height:24px;font-weight:650}
  .lead{font-size:19px;line-height:30px;color:var(--c-ink-muted)}
  .muted{color:var(--c-ink-muted)}
  .num{font-variant-numeric:tabular-nums}
  .btn{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 22px;border-radius:var(--r-md);font-weight:600;font-size:15px;border:0}
  .btn.primary{background:var(--c-ink);color:var(--c-on-ink)}
  .btn.accent{background:var(--g-accent);color:var(--c-on-accent)}
  .btn.ghost{color:var(--c-ink);background:rgba(24,62,79,.08)}
  .btn.sm{height:38px;padding:0 16px;font-size:14px}
  .btn.light{background:var(--c-on-ink);color:var(--c-ink)}
  .btn.light-ghost{color:var(--c-on-ink);background:rgba(254,252,242,.12)}

  /* NAV + HERO */
  .hero{position:relative;background:var(--c-cream);color:var(--c-ink);overflow:hidden;padding-bottom:var(--s7)}
  .hero .note{color:var(--c-ink-muted)}
  nav{position:relative;display:flex;align-items:center;height:88px;gap:36px}
  nav .logo{height:28px;display:block}
  nav .links{display:flex;gap:28px;font-weight:500;margin-left:24px}
  nav .right{margin-left:auto;display:flex;align-items:center;gap:20px;font-weight:500}
  .lang{display:flex;background:rgba(24,62,79,.08);border-radius:999px;padding:3px;font-size:12px;font-weight:600}
  .lang button{appearance:none;border:0;background:none;color:inherit;font:inherit;cursor:pointer;padding:2px 10px;border-radius:999px}
  .lang button.on{background:var(--c-ink);color:var(--c-on-ink)}
  .hero-grid{position:relative;display:grid;grid-template-columns:580px 1fr;gap:48px;padding-top:72px;align-items:center}
  .hero-copy .lead{margin:28px 0 40px;max-width:460px}
  .hero-copy .ctas{display:flex;gap:12px}
  .hero-copy .note{margin-top:20px;font-size:13px;line-height:18px}

  /* product frame */
  .frame{background:var(--c-sand-light);color:var(--c-ink);border-radius:var(--r-lg);overflow:hidden}
  .hero .frame{background:var(--c-sand-light)}
  .hero .kpi,.hero .panel{background:var(--c-cream)}
  .hero .chip{background:var(--c-cream)}
  .hero .kpis{grid-template-columns:repeat(2,1fr)}
  .frame .bar,.legend span,.panel .ph b{white-space:nowrap}
  .hero .chip.more{display:none}
  .legend{gap:10px;font-size:11px}
  .frame .bar{display:flex;align-items:center;gap:12px;height:52px;padding:0 20px;font-size:13px}
  .frame .bar img{height:14px}
  .frame .bar .ws{margin-left:auto;display:flex;gap:6px}
  .chip{font-size:12px;line-height:16px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--c-cream);color:var(--c-ink)}
  .frame .body{padding:0 20px 20px;display:grid;gap:12px}
  .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .kpi{background:var(--c-cream);border-radius:var(--r-md);padding:12px 14px}
  .kpi .k{font-size:12px;line-height:16px;color:var(--c-ink-muted);font-weight:500}
  .kpi .v{font-size:22px;line-height:28px;font-weight:700;letter-spacing:-.02em;margin-top:4px}
  .kpi .d{font-size:12px;font-weight:600}
  .pos{color:var(--c-pos)} .neg{color:var(--c-neg)}
  .kpi{position:relative}
  .kpi svg{display:block;margin-top:6px;width:100%;height:28px}
  .spark-dot{position:absolute;right:10px;bottom:30px;width:9px;height:9px;border-radius:50%;background:var(--g-accent);box-shadow:0 0 0 3px var(--c-cream)}
  .panel{background:var(--c-cream);border-radius:var(--r-md);padding:14px 16px}
  .panel .ph{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .panel .ph b{font-size:14px}
  .legend{display:flex;gap:14px;font-size:12px;color:var(--c-ink-muted)}
  .legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}


  /* FEATURES */
  section{padding:var(--s7) 0}
  .sec-head{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:56px}
  .features{display:grid;grid-template-columns:repeat(3,1fr);column-gap:56px;row-gap:64px}
  #features{background:var(--c-sand-light)}
  #features .feat .ic{
      background:linear-gradient(var(--c-sand-light),var(--c-sand-light)) padding-box,var(--g-accent) border-box
  }
  .feat{}
  .feat .ic{
      width:48px;
      height:48px;
      border-radius:var(--r-md);
      background:linear-gradient(var(--c-cream),var(--c-cream)) padding-box,var(--g-accent) border-box;
      border:2px solid transparent;
      display:grid;
      place-items:center;
      margin-bottom:24px
  }
  .feat .ic svg{width:22px;height:22px;stroke:url(#aurora-stroke);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .feat p{margin-top:10px;color:var(--c-ink-muted)}
  .feat .tags{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px}
  .tag{font-size:12px;line-height:16px;font-weight:500;padding:4px 9px;border-radius:var(--r-sm);background:var(--c-sand-deep);color:var(--c-ink)}

  /* BVA */
  /*.bva{background:var(--c-sand-light)}*/
  .bva-grid{display:grid;grid-template-columns:400px 1fr;gap:72px;align-items:center}
  .bva-grid .lead{margin:20px 0 28px}
  .ticks{display:grid;gap:14px}
  .ticks li{list-style:none;display:flex;gap:12px}
  .ticks li::before{content:"";flex:none;width:10px;height:10px;margin-top:7px;border-radius:2px;background:var(--g-accent)}
  table.rep{width:100%;border-collapse:collapse;font-size:14px}
  table.rep th{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--c-ink-muted);text-align:right;padding:10px 14px;white-space:nowrap}
  table.rep th:first-child,table.rep td:first-child{text-align:left;padding-left:20px}
  table.rep th:last-child,table.rep td:last-child{padding-right:20px}
  table.rep td{padding:10px 14px;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
  table.rep tr.grp td{font-weight:650;padding-top:16px}
  table.rep tr.sub td:first-child{padding-left:34px;color:var(--c-ink-muted)}
  table.rep tr.total td{font-weight:700;background:var(--c-ink);color:var(--c-on-ink);padding-top:14px;padding-bottom:14px}
  table.rep tr.total td.pos{color:var(--c-on-ink)}
  .varbar{display:inline-block;height:6px;border-radius:2px;vertical-align:middle;margin-left:8px}

  /* STEPS */
  #how {background: var(--c-sand-light)}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:56px}
  .step{}
  .step .n{display:grid;place-items:center;width:64px;height:64px;border-radius:var(--r-md);background:linear-gradient(var(--c-cream),var(--c-cream)) padding-box,var(--g-accent) border-box;border:2px solid transparent;color:var(--c-ink);font-size:26px;line-height:1;font-weight:750;letter-spacing:-.02em}
  .step .n span{background:var(--g-accent);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
  .step h3{margin-top:20px}
  .step p{margin-top:8px;color:var(--c-ink-muted)}
  .step .mock{margin-top:24px;border-radius:var(--r-md);padding:16px;background:var(--c-sand-deep);font-size:13px}
  .field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
  .field label{font-size:12px;font-weight:600;color:var(--c-ink-muted)}
  .field div{height:32px;background:var(--c-cream);border-radius:var(--r-sm);padding:0 10px;display:flex;align-items:center;color:var(--c-ink-muted);font-family:ui-monospace,monospace;font-size:12px}
  .check{display:flex;align-items:center;gap:8px;padding:5px 0}
  .check b{width:14px;height:14px;border-radius:3px;border:1.5px solid var(--c-ink);flex:none}
  .check b.on{background:var(--c-ink)}
  .prog{height:6px;background:var(--c-cream);border-radius:3px;overflow:hidden;margin:6px 0 10px}
  .prog i{display:block;height:100%;width:68%;background:var(--g-accent)}

  /* PRICING */
  .pricing{background:var(--c-sand-light)}
  .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .plan{background:var(--c-cream);border-radius:var(--r-lg);padding:32px 28px;position:relative}
  .plan.feat2{background:var(--c-ink);color:var(--c-on-ink)}
  .plan.feat2 .muted{color:rgba(254,252,242,.78)}
  .plan .price{font-size:44px;line-height:48px;font-weight:700;letter-spacing:-.03em;margin:20px 0 4px}
  .plan .btn.ghost{background:var(--c-sand-light)}
  .plan ul{margin:24px 0 28px;display:grid;gap:10px}
  .plan li{list-style:none;padding-left:20px;position:relative}
  .plan li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:2px;background:currentColor}
  .ph-note{position:absolute;top:16px;right:16px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:rgba(127,127,127,.16);border-radius:var(--r-sm);padding:3px 7px;opacity:.85}
  .toggle{display:inline-flex;background:var(--c-cream);border-radius:999px;padding:4px;font-weight:600;font-size:14px}
  .toggle button{appearance:none;border:0;background:none;color:inherit;font:inherit;cursor:pointer;padding:6px 16px;border-radius:999px}
  .toggle button.on{background:var(--c-ink);color:var(--c-on-ink)}
  [data-period="month"] .only-year,[data-period="year"] .only-month{display:none}
  .plan{display:flex;flex-direction:column}
  .plan .btn{width:100%;justify-content:center;margin-top:auto}
  .plan .price{display:flex;align-items:baseline}
  html[lang="et"] .plan .price{gap:.18em}
  html[lang="et"] .plan .price .cur{order:1}
  .plan .price-text{font-size:32px}
  .plan .plan-text{margin:24px 0 28px}
  .plan .badge{position:absolute;top:16px;right:16px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 8px;border-radius:var(--r-sm);background:var(--g-accent);color:var(--c-on-accent)}

  /* BOOK A DEMO */
  .demo{background:var(--c-ink);color:var(--c-on-ink)}
  .demo-grid{display:grid;grid-template-columns:1fr 520px;gap:72px;align-items:center}
  .demo .lead{color:rgba(254,252,242,.8);margin-top:20px;max-width:520px}
  .demo-form{background:var(--c-cream);color:var(--c-ink);border-radius:var(--r-lg);padding:32px;display:grid;gap:18px}
  .demo-form .row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .demo-form .fld{display:grid;gap:6px;align-content:start}
  .demo-form .lbl{font-size:13px;line-height:18px;font-weight:600}
  .demo-form .req{color:var(--c-ink-muted)}
  .demo-form input{width:100%;height:46px;border:1px solid var(--c-sand-deep);border-radius:var(--r-md);background:#fff;padding:0 14px;font:inherit;color:var(--c-ink)}
  .demo-form input:focus{outline:2px solid var(--c-ink);outline-offset:-1px;border-color:var(--c-ink)}
  .demo-form .err{display:none;font-size:12px;line-height:16px;font-weight:500;color:var(--c-neg)}
  .demo-form .invalid input{border-color:var(--c-neg)}
  .demo-form .invalid .err{display:block}
  .demo-form .btn{width:100%;justify-content:center;cursor:pointer;margin-top:4px}
  .demo-form .btn:disabled{opacity:.6;cursor:default}
  .demo-form .status{font-size:14px;font-weight:600;padding:10px 14px;border-radius:var(--r-md)}
  .demo-form .status.ok{background:rgba(47,122,82,.12);color:var(--c-pos)}
  .demo-form .status.bad{background:rgba(180,70,44,.12);color:var(--c-neg)}
  .demo-form .status.note{background:var(--c-sand-light);color:var(--c-ink)}

  /* CTA */
  .cta{background:var(--g-accent);color:var(--c-on-accent);position:relative;overflow:hidden}
  .cta .inner{position:relative;display:flex;align-items:center;justify-content:space-between}
  .cta h2{max-width:640px}
  .cta .inner{gap:48px}
  .cta .inner > div:first-child{max-width:680px}
  .cta .inner > div:last-child{flex:none}
  .cta p{color:var(--c-on-accent);font-weight:600;margin-top:16px;font-size:20px;line-height:30px}

  footer{padding:64px 0 48px;background:var(--c-ink);color:var(--c-on-ink)}
  footer .muted,footer .base{color:rgba(254,252,242,.7)!important}
  footer .row{display:flex;gap:80px}
  footer .col{display:grid;gap:8px;font-size:14px;align-content:start}
  footer .col b{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:rgba(254,252,242,.7);margin-bottom:4px}
  footer .base{margin-top:56px;display:flex;justify-content:space-between;font-size:13px;color:var(--c-ink-muted)}


  /* SOCIAL PROOF (dark) */
  .proof{background:var(--c-ink);color:var(--c-on-ink);padding:96px 0}
  .proof .eyebrow{color:var(--c-on-ink)}
  .proof-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:80px;align-items:center}
  .quote-mark{display:block;width:56px;height:42px}
  blockquote{font-size:30px;line-height:40px;font-weight:600;letter-spacing:-.015em;margin-top:20px}
  .who{display:flex;align-items:center;gap:14px;margin-top:28px}
  .avatar{width:48px;height:48px;border-radius:50%;background:rgba(254,252,242,.14);display:grid;place-items:center;font-weight:700;font-size:15px}
  .who b{display:block;font-size:15px}
  .who span{font-size:14px;color:rgba(254,252,242,.7)}
  .stats{display:grid;gap:36px}
  .stat .v{font-size:44px;line-height:48px;font-weight:750;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
  .stat .k{font-size:15px;color:rgba(254,252,242,.72);margin-top:2px}
  .proof .ph-row{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;font-size:14px;color:rgba(254,252,242,.72)}
  .proof .ph-row .chip-dark{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(254,252,242,.1);color:var(--c-on-ink);font-weight:600;font-size:13px}
  .proof .ph-row .chip-dark i{width:8px;height:8px;border-radius:50%;background:var(--g-accent)}
  .ph-dark{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:3px 7px;border-radius:var(--r-sm);background:rgba(254,252,242,.14);color:rgba(254,252,242,.85);margin-left:10px;vertical-align:middle}

  /* BLOG */
  .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
  .post .thumb{aspect-ratio:16/10;border-radius:var(--r-lg);background:var(--c-sand-light);overflow:hidden;display:block}
  .post .thumb svg{display:block;width:100%;height:100%}
  .post .meta{display:flex;gap:10px;align-items:center;margin-top:20px;font-size:13px;color:var(--c-ink-muted)}
  .post .meta .cat{font-weight:650;color:var(--c-ink);letter-spacing:.04em;text-transform:uppercase;font-size:12px}
  .post h3{font-size:21px;line-height:28px;margin-top:10px;letter-spacing:-.01em}
  .post p{margin-top:10px;color:var(--c-ink-muted)}
  .post .more{display:inline-flex;gap:6px;margin-top:16px;font-weight:600;font-size:14px}
  .all-link{font-weight:600;display:inline-flex;gap:6px;align-items:center}
  .menu{display:none;width:44px;height:44px;border:0;border-radius:var(--r-md);background:rgba(24,62,79,.08);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px}
  .menu i{display:block;width:18px;height:2px;border-radius:1px;background:var(--c-ink)}
  .tscroll{overflow-x:auto}
  .toggle-wrap{text-align:right}

  /* ---------- responsive ---------- */
  @media (max-width:1024px){
    nav .links{display:none}
    .menu{display:flex}
    .hero-grid{grid-template-columns:1fr;gap:48px;padding-top:40px}
    h1.display{font-size:clamp(44px,8vw,68px);line-height:1.06}
    .hero-copy .lead{max-width:560px}
    .hero .kpis{grid-template-columns:repeat(4,1fr)}
    .hero .chip.more{display:inline}
    .sec-head{grid-template-columns:1fr;gap:20px;margin-bottom:40px}
    .features{grid-template-columns:repeat(2,1fr);column-gap:40px;row-gap:48px}
    .bva-grid{grid-template-columns:1fr;gap:40px}
    .steps{grid-template-columns:1fr;gap:48px;max-width:560px}
    .plans{grid-template-columns:1fr;max-width:480px}
    .toggle-wrap{text-align:left}
    .proof-grid{grid-template-columns:1fr;gap:56px}
    .blog-grid{grid-template-columns:1fr;max-width:560px;gap:48px}
    .demo-grid{grid-template-columns:1fr;gap:40px}
    .cta .inner{flex-direction:column;align-items:flex-start;gap:32px}
    footer .row{flex-wrap:wrap;gap:40px 64px}
    footer .row .col:first-child{flex:0 0 100%!important}
  }
  @media (max-width:640px){
    .wrap{padding:0 20px}
    section{padding:72px 0}
    nav{height:72px;gap:12px}
    nav .logo{height:22px}
    nav .right{gap:8px}
    nav .login,.lang{display:none}
    h1.display{font-size:clamp(28px,10vw,44px);line-height:1.08}
    h2.h1{font-size:32px;line-height:37px}
    .lead{font-size:17px;line-height:27px}
    .hero{padding-bottom:48px}
    .hero-grid{padding-top:24px;gap:40px}
    .hero-copy .lead{margin:20px 0 28px}
    .hero-copy .ctas{flex-direction:column}
    .hero-copy .ctas .btn{justify-content:center}
    .frame .bar{padding:0 14px}
    .frame .body{padding:0 12px 12px;gap:10px}
    .chip.more,.hero .chip.more{display:none}
    .kpis,.hero .kpis{grid-template-columns:repeat(2,1fr);gap:10px}
    .panel{padding:12px}
    .legend{display:none}
    .panel svg{height:auto;aspect-ratio:620/170}
    .features{grid-template-columns:1fr;row-gap:40px}
    .feat .ic{margin-bottom:16px}
    table.rep{font-size:13px}
    table.rep th:nth-child(3),table.rep td:nth-child(3),table.rep th:nth-child(4),table.rep td:nth-child(4){display:none}
    table.rep th,table.rep td{padding-left:8px;padding-right:8px}
    table.rep th:first-child,table.rep td:first-child{padding-left:14px}
    table.rep th:last-child,table.rep td:last-child{padding-right:14px}
    table.rep tr.sub td:first-child{padding-left:24px}
    .varbar{display:none}
    .step .n{width:52px;height:52px;font-size:22px}
    .plan{padding:28px 22px}
    .demo-form{padding:22px}
    .demo-form .row{grid-template-columns:1fr}
    .cta .inner > div:last-child{flex-direction:column;width:100%}
    .cta .btn{justify-content:center}
    footer{padding:48px 0 40px}
    .proof{padding:72px 0}
    blockquote{font-size:22px;line-height:31px}
    .quote-mark{width:44px;height:33px}
    .stat .v{font-size:36px;line-height:40px}
    .stats{gap:24px}
    .post h3{font-size:19px;line-height:26px}

    footer .base{flex-direction:column;gap:6px;margin-top:40px}
  }