:root{
      --primary:#0b6cff;
      --primary-dark:#0647b8;
      --primary-soft:#eaf3ff;
      --navy:#061b3a;
      --text:#24364b;
      --muted:#6f8198;
      --white:#fff;
      --light:#f3f8ff;
      --border:#e3edf8;
      --purple:#6d5dfc;
      --shadow:0 25px 70px rgba(6,71,184,.18);
      --gradient-blue:linear-gradient(105deg,#0a3d8f 0%,#0b5fd4 42%,#0b6cff 72%,#3b8bff 100%);
      --gradient-blue-vertical:linear-gradient(180deg,#0a3d8f 0%,#0b5fd4 48%,#0b6cff 100%);
    }

    *{margin:0;padding:0;box-sizing:border-box}
    html{scroll-behavior:smooth;overflow-x:hidden;max-width:100%}
    body{font-family:"Inter",sans-serif;color:var(--text);background:var(--light);overflow-x:hidden;max-width:100%}
    main{overflow-x:hidden;max-width:100%}
    a{text-decoration:none;color:inherit}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}

    /* HEADER */
    .header{
      position:fixed;
      top:0;
      left:0;
      width:100%;
      z-index:9999;
      padding:24px 0;
      transition:.3s ease;
    }

    .header.scrolled{
      background:rgba(255,255,255,.94);
      backdrop-filter:blur(18px);
      box-shadow:0 10px 35px rgba(6,27,58,.08);
      padding:14px 0;
    }

    .nav{
      display:flex;
      align-items:center;
      justify-content:space-between;
      position:relative;
      gap:20px;
      min-height:52px;
    }

    .logo{
      font-size:30px;
      font-weight:900;
      color:var(--white);
      letter-spacing:.3px;
      position:relative;
      z-index:10001;
      flex-shrink:0;
    }

    .header.scrolled .logo{
      color:var(--primary);
    }

    .menu{
      display:flex;
      align-items:center;
      flex:1;
      justify-content:flex-end;
      gap:22px;
      color:var(--white);
      font-weight:700;
      font-size:13px;
      letter-spacing:.04em;
      text-transform:uppercase;
      min-width:0;
    }

    .nav-overlay,
    .menu-drawer-head,
    .menu-drawer-close{
      display:none;
    }

    .menu-drawer-body,
    .menu-drawer-foot{
      display:contents;
    }

    .menu-links{
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(-50%,-50%);
      display:flex;
      align-items:center;
      gap:22px;
      white-space:nowrap;
    }

    .menu-links a{
      display:inline-flex;
      align-items:center;
      gap:8px;
    }

    .menu-links a i{
      display:none;
    }

    .header.scrolled .menu{
      color:var(--navy);
    }

    .nav-btn{
      background:var(--white);
      color:var(--primary);
      padding:15px 34px;
      border-radius:999px;
      font-weight:900;
      text-transform:uppercase;
      letter-spacing:.04em;
    }

    .nav-actions{
      display:flex;
      align-items:center;
      gap:12px;
      flex-shrink:0;
      margin-left:auto;
      position:relative;
      z-index:2;
    }

    .nav-login{
      padding:14px 24px;
      border-radius:999px;
      font-weight:800;
      font-size:13px;
      letter-spacing:.04em;
      text-transform:uppercase;
      border:1px solid rgba(255,255,255,.42);
      color:#fff;
      background:rgba(255,255,255,.08);
      transition:.25s ease;
    }

    .nav-login:hover{
      background:rgba(255,255,255,.16);
    }

    .header.scrolled .nav-login{
      border-color:var(--primary);
      color:var(--primary);
      background:#fff;
    }

    .header.scrolled .nav-btn{
      background:var(--primary);
      color:var(--white);
    }

    .mobile-toggle{
      width:46px;
      height:46px;
      border:1px solid rgba(255,255,255,.35);
      border-radius:14px;
      background:rgba(255,255,255,.22);
      color:#fff;
      display:none;
      place-items:center;
      font-size:22px;
      cursor:pointer;
      position:relative;
      z-index:10001;
      box-shadow:0 12px 28px rgba(0,0,0,.12);
    }

    .header.scrolled .mobile-toggle{
      background:var(--primary);
      color:#fff;
      border-color:var(--primary);
    }

    /* STORE */
    .store-row{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
    }

    .store-btn{
      display:inline-block;
      background:transparent;
      border:none;
      padding:0;
      border-radius:0;
      transition:.25s ease;
    }

    .store-btn:hover{
      transform:translateY(-4px);
      opacity:.92;
    }

    .store-btn img{
      height:54px;
      width:auto;
      display:block;
    }

    /* HERO */
    .hero{
      min-height:100vh;
      background:
        radial-gradient(circle at 82% 18%,rgba(255,255,255,.18),transparent 30%),
        var(--gradient-blue);
      position:relative;
      overflow:hidden;
      padding:140px 0 130px;
      color:#fff;
    }

    .hero-grid{
      position:relative;
      z-index:3;
      display:grid;
      grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
      align-items:center;
      gap:36px;
    }

    .hero-text{
      max-width:560px;
    }

    .hero-label{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 14px;
      border-radius:999px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.22);
      font-size:12px;
      font-weight:800;
      letter-spacing:.6px;
      text-transform:uppercase;
      margin-bottom:22px;
    }

    .hero-label i{
      color:#9fd0ff;
      font-size:11px;
    }

    .hero-text h1{
      font-size:clamp(38px,4.6vw,64px);
      line-height:1.08;
      font-weight:900;
      letter-spacing:-1.8px;
      margin-bottom:20px;
    }

    .hero-text .hero-lead{
      font-size:17px;
      line-height:1.75;
      max-width:520px;
      font-weight:500;
      color:rgba(255,255,255,.88);
      margin-bottom:28px;
    }

    .hero-points{
      display:grid;
      gap:12px;
      margin-bottom:32px;
    }

    .hero-point{
      display:flex;
      align-items:center;
      gap:12px;
      font-size:15px;
      font-weight:600;
      color:rgba(255,255,255,.92);
    }

    .hero-point i{
      width:22px;
      height:22px;
      border-radius:50%;
      background:rgba(255,255,255,.18);
      display:grid;
      place-items:center;
      font-size:10px;
      flex-shrink:0;
    }

    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      margin-bottom:34px;
    }

    .hero-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:54px;
      padding:0 28px;
      border-radius:999px;
      font-size:15px;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.04em;
      transition:.25s ease;
    }

    .hero-btn.primary{
      background:#fff;
      color:var(--primary-dark);
      box-shadow:0 16px 34px rgba(0,0,0,.14);
    }

    .hero-btn.primary:hover{
      transform:translateY(-2px);
    }

    .hero-btn.ghost{
      border:1px solid rgba(255,255,255,.34);
      color:#fff;
      background:rgba(255,255,255,.08);
    }

    .hero-btn.ghost:hover{
      background:rgba(255,255,255,.14);
    }

    .phone-area{
      justify-self:end;
      width:100%;
      max-width:500px;
      margin-left:auto;
    }

    .users{
      margin-top:0;
      display:flex;
      align-items:center;
      gap:15px;
      padding-top:26px;
      border-top:1px solid rgba(255,255,255,.16);
    }

    .avatars{
      display:flex;
    }

    .avatars img{
      width:43px;
      height:43px;
      margin-left:-10px;
      border:3px solid #fff;
      border-radius:50%;
      object-fit:cover;
      display:block;
      background:#dbeafe;
    }

    .avatars img:first-child{
      margin-left:0;
    }

    .users b{
      display:block;
      font-size:18px;
    }

    .users small{
      color:rgba(255,255,255,.85);
      font-weight:600;
    }

    /* HERO ICONS */
    .shape{
      position:absolute;
      color:rgba(255,255,255,.78);
      font-size:25px;
      animation:floatShape 4s ease-in-out infinite;
      z-index:1;
      pointer-events:none;
    }

    .shape.s1{left:7%;top:28%}
    .shape.s2{left:17%;top:58%;animation-delay:.9s}
    .shape.s3{right:7%;top:18%;animation-delay:1.4s}
    .shape.s4{right:42%;top:18%;animation-delay:.5s}
    .shape.s5{right:5%;bottom:32%;animation-delay:1.9s}
    .shape.s6{left:42%;bottom:22%;animation-delay:2.4s}
    .shape.s7{left:8%;bottom:12%;animation-delay:1.1s}

    @keyframes floatShape{
      0%,100%{transform:translateY(0) rotate(0)}
      50%{transform:translateY(-18px) rotate(12deg)}
    }

    .hero-wave{
      position:absolute;
      left:0;
      bottom:0;
      width:100%;
      height:90px;
      z-index:2;
      overflow:hidden;
      pointer-events:none;
    }

    .hero-wave-track{
      display:flex;
      width:200%;
      height:100%;
      will-change:transform;
      animation:heroWaveMove 18s linear infinite;
    }

    .hero-wave svg{
      flex:0 0 50%;
      width:50%;
      height:100%;
      display:block;
    }

    .hero-wave path{
      fill:var(--light);
    }

    @keyframes heroWaveMove{
      0%{transform:translateX(0)}
      100%{transform:translateX(-50%)}
    }

    #features{
      margin-top:0;
      padding-top:86px;
      position:relative;
      z-index:3;
      background:var(--light);
    }

    section[id]{
      scroll-margin-top:92px;
    }

    /* PHONE BASE */
    .phone-area,
    .double-phone,
    .cta-phones,
    .report-phone{
      position:relative;
      overflow:visible;
    }

    .phone-area{
      min-height:640px;
      padding:24px 0;
      box-sizing:content-box;
    }

    .phone{
      width:330px;
      height:660px;
      background:#050505;
      border-radius:56px;
      padding:13px;
      box-shadow:0 45px 90px rgba(0,0,0,.28);
      position:absolute;
      z-index:2;
    }

    .phone-back,
    .cta-phones .phone:first-child{
      z-index:1;
      opacity:1;
      box-shadow:0 28px 55px rgba(0,0,0,.14);
    }

    .cta-phones .phone:last-child{
      z-index:2;
    }

    .phone-screen{
      width:100%;
      height:100%;
      background:#050505;
      border-radius:44px;
      overflow:hidden;
      position:relative;
    }

    .phone-screen-img{
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:top center;
      display:block;
    }

    .phone-screen::before{
      content:"";
      position:absolute;
      inset:0;
      background:transparent;
      pointer-events:none;
      z-index:1;
    }

    .notch{
      position:absolute;
      top:18px;
      left:50%;
      transform:translateX(-50%);
      width:96px;
      height:26px;
      background:#050505;
      border-radius:999px;
      z-index:5;
    }

    .app-page{
      position:relative;
      z-index:2;
      padding:62px 20px 18px;
    }

    .app-header{
      display:flex;
      align-items:center;
      justify-content:space-between;
      margin-bottom:18px;
    }

    .app-header h3{
      color:var(--primary-dark);
      font-size:22px;
      font-weight:900;
    }

    .plus{
      width:36px;
      height:36px;
      background:var(--primary);
      color:#fff;
      border-radius:50%;
      display:grid;
      place-items:center;
    }

    .search{
      height:42px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:10px;
      display:flex;
      align-items:center;
      gap:8px;
      padding:0 12px;
      color:#9aa9ba;
      font-size:12px;
      margin-bottom:12px;
    }

    .tabs{
      display:flex;
      gap:7px;
      margin-bottom:14px;
      overflow:hidden;
    }

    .tab{
      padding:8px 10px;
      border-radius:999px;
      background:#eef4fb;
      color:#73869d;
      font-size:11px;
      font-weight:800;
      white-space:nowrap;
    }

    .tab.active{
      background:var(--primary);
      color:#fff;
    }

    .order-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:14px;
      padding:15px;
      margin-bottom:12px;
      box-shadow:0 8px 18px rgba(6,27,58,.08);
    }

    .order-top{
      display:flex;
      justify-content:space-between;
      margin-bottom:12px;
    }

    .order-top h4{
      color:var(--navy);
      font-size:14px;
      margin-bottom:4px;
    }

    .order-top small{
      color:var(--muted);
      font-weight:600;
    }

    .badge{
      background:#f59e0b;
      color:#fff;
      border-radius:999px;
      padding:6px 9px;
      font-size:10px;
      font-weight:900;
    }

    .badge.green{
      background:#20c997;
    }

    .price{
      color:var(--primary-dark);
      font-size:15px;
      font-weight:900;
      text-align:right;
    }

    .bottom-nav{
      position:absolute;
      bottom:0;
      left:0;
      width:100%;
      height:72px;
      background:#fff;
      border-top:1px solid var(--border);
      display:grid;
      grid-template-columns:repeat(4,1fr);
      align-items:center;
      z-index:4;
    }

    .bottom-nav div{
      text-align:center;
      color:#9aa9ba;
      font-size:10px;
      font-weight:700;
    }

    .bottom-nav i{
      display:block;
      font-size:17px;
      margin-bottom:5px;
    }

    .bottom-nav .active{
      color:var(--primary);
    }

    .app-logo{
      width:72px;
      height:72px;
      border-radius:18px;
      margin:0 auto 18px;
      background:var(--gradient-blue);
      color:#fff;
      display:grid;
      place-items:center;
      font-size:17px;
      font-weight:900;
      line-height:1.05;
      text-align:center;
    }

    .app-intro{
      text-align:center;
      color:var(--primary-dark);
      font-size:13px;
      line-height:1.5;
      font-weight:700;
    }

    .home-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:12px;
      margin-top:26px;
    }

    .home-item{
      height:92px;
      background:#fff;
      border-radius:14px;
      display:grid;
      place-items:center;
      color:var(--primary-dark);
      font-weight:900;
      font-size:13px;
      box-shadow:0 8px 18px rgba(6,27,58,.06);
    }

    .home-item i{
      display:block;
      font-size:25px;
      margin-bottom:8px;
      text-align:center;
      color:var(--primary);
    }

    .hero .phone{
      right:-10px;
      top:24px;
      animation:phoneFloat 4.2s ease-in-out infinite;
    }

    .hero .phone.phone-back{
      right:165px;
      top:129px;
      transform:scale(.82);
      animation:phoneFloatBack 4.8s ease-in-out infinite;
    }

    @keyframes phoneFloat{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-14px)}
    }

    @keyframes phoneFloatBack{
      0%,100%{transform:scale(.82) translateY(0)}
      50%{transform:scale(.82) translateY(14px)}
    }

    @keyframes phoneFloatTablet{
      0%,100%{transform:translateX(-50%) translateY(0)}
      50%{transform:translateX(-50%) translateY(-12px)}
    }

    @keyframes phoneFloatBackTablet{
      0%,100%{transform:translateX(-50%) scale(.82) translateY(0)}
      50%{transform:translateX(-50%) scale(.82) translateY(12px)}
    }

    @keyframes phoneFloatMobile{
      0%,100%{transform:translateX(-50%) translateY(0)}
      50%{transform:translateX(-50%) translateY(-10px)}
    }

    @keyframes phoneFloatBackMobile{
      0%,100%{transform:translateX(-50%) scale(.78) translateY(0)}
      50%{transform:translateX(-50%) scale(.78) translateY(10px)}
    }

    /* SECTION */
    section{
      padding:110px 0;
    }

    .section-title{
      text-align:center;
      max-width:760px;
      margin:0 auto 70px;
    }

    .section-title h2{
      color:var(--primary-dark);
      font-size:clamp(34px,4vw,54px);
      line-height:1.15;
      font-weight:900;
      letter-spacing:-1.5px;
      margin-bottom:16px;
    }

    .section-title p{
      color:var(--muted);
      font-size:18px;
      line-height:1.7;
    }

    .reveal{
      opacity:0;
      transform:translateY(70px);
      transition:1s ease;
    }

    .reveal.show{
      opacity:1;
      transform:translateY(0);
    }

    .reveal-left{
      opacity:0;
      transform:translateX(-80px);
      transition:1s ease;
    }

    .reveal-right{
      opacity:0;
      transform:translateX(80px);
      transition:1s ease;
    }

    .reveal-phone{
      opacity:0;
      transform:translateY(140px) scale(.92);
      transition:1.1s ease;
    }

    .show .reveal-left,
    .show .reveal-right{
      opacity:1;
      transform:translateX(0);
    }

    .show .reveal-phone{
      opacity:1;
      transform:translateY(0) scale(1);
    }

    /* FEATURES */
    .features-box{
      background:#fff;
      border-radius:34px;
      min-height:580px;
      box-shadow:var(--shadow);
      display:grid;
      grid-template-columns:1fr 380px 1fr;
      align-items:center;
      gap:40px;
      padding:60px;
      position:relative;
      overflow:hidden;
    }

    .features-box::before{
      content:"";
      position:absolute;
      width:420px;
      height:420px;
      border-radius:50%;
      background:var(--primary-soft);
      left:50%;
      bottom:-170px;
      transform:translateX(-50%);
    }

    .feature-list{
      display:grid;
      gap:70px;
      position:relative;
      z-index:2;
    }

    .feature-card{
      text-align:center;
    }

    .feature-icon{
      width:76px;
      height:76px;
      margin:0 auto 22px;
      border-radius:50%;
      background:var(--primary-soft);
      color:var(--primary);
      display:grid;
      place-items:center;
      font-size:28px;
      box-shadow:0 12px 25px rgba(11,108,255,.2);
    }

    .feature-card h3{
      color:var(--primary-dark);
      font-size:23px;
      margin-bottom:12px;
      font-weight:900;
    }

    .feature-card p{
      color:var(--muted);
      line-height:1.7;
      font-size:16px;
    }

    .center-phone{
      position:relative;
      z-index:3;
      height:650px;
    }

    .center-phone .phone{
      position:relative;
      right:auto;
      top:auto;
      margin:0 auto;
    }

    /* SOLUTION */
    .solution{
      display:grid;
      grid-template-columns:.9fr 1.1fr;
      align-items:center;
      gap:80px;
    }

    .report-phone{
      position:relative;
      height:610px;
      padding:22px 0;
      box-sizing:content-box;
    }

    .report-phone .phone{
      left:40px;
      right:auto;
      top:22px;
      transform:scale(.9);
      animation:reportPhoneFloat 4.5s ease-in-out infinite;
    }

    @keyframes reportPhoneFloat{
      0%,100%{transform:scale(.9) translateY(0)}
      50%{transform:scale(.9) translateY(-14px)}
    }

    .report-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:14px;
      padding:14px;
      margin-top:15px;
    }

    .report-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:10px;
      margin:12px 0;
    }

    .mini-stat{
      border:1px solid var(--border);
      border-radius:10px;
      padding:10px;
      font-size:11px;
      color:var(--muted);
      font-weight:700;
    }

    .mini-stat b{
      display:block;
      color:var(--primary-dark);
      font-size:18px;
      margin-top:5px;
    }

    .solution-text h2{
      color:var(--primary-dark);
      font-size:clamp(36px,4vw,58px);
      line-height:1.12;
      font-weight:900;
      letter-spacing:-1.6px;
      margin-bottom:22px;
    }

    .solution-text p{
      color:var(--muted);
      font-size:18px;
      line-height:1.8;
      margin-bottom:32px;
    }

    .stats{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:22px;
      margin-bottom:36px;
    }

    .stat{
      background:#fff;
      border-radius:18px;
      padding:22px;
      display:flex;
      align-items:center;
      gap:16px;
      box-shadow:0 18px 35px rgba(6,71,184,.1);
    }

    .stat-icon{
      width:56px;
      height:56px;
      border-radius:50%;
      background:var(--primary-soft);
      color:var(--primary);
      display:grid;
      place-items:center;
      font-size:24px;
    }

    .stat strong{
      color:var(--primary-dark);
      font-size:36px;
      line-height:1;
      font-weight:900;
      display:block;
    }

    .stat span{
      color:var(--muted);
      font-weight:700;
    }

    .main-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background:var(--primary);
      color:#fff;
      min-width:230px;
      height:58px;
      border-radius:999px;
      font-weight:900;
      text-transform:uppercase;
      letter-spacing:.04em;
      box-shadow:0 18px 30px rgba(11,108,255,.25);
    }

    /* DESKTOP PANEL */
    .panel-section{
      position:relative;
      padding:100px 0;
      overflow:visible;
    }

    .panel-section::before{
      content:"";
      position:absolute;
      left:50%;
      transform:translateX(-50%);
      width:100vw;
      top:0;
      bottom:0;
      background:#fff;
      z-index:0;
    }

    .panel-section .container{
      position:relative;
      z-index:1;
    }

    .panel-grid{
      display:grid;
      grid-template-columns:1fr 1.25fr;
      align-items:center;
      gap:60px;
    }

    .panel-text h2{
      color:var(--primary-dark);
      font-size:clamp(34px,4vw,52px);
      line-height:1.12;
      font-weight:900;
      letter-spacing:-1.4px;
      margin-bottom:18px;
    }

    .panel-text p{
      color:var(--muted);
      font-size:18px;
      line-height:1.8;
      margin-bottom:28px;
    }

    .panel-list{
      display:grid;
      gap:14px;
      margin-bottom:30px;
    }

    .panel-list div{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:700;
      color:var(--text);
      font-size:15px;
    }

    .panel-list i{
      width:30px;
      height:30px;
      border-radius:50%;
      background:var(--primary-soft);
      color:var(--primary);
      display:grid;
      place-items:center;
      font-size:12px;
      flex-shrink:0;
    }

    .desktop-showcase{
      position:relative;
      width:100%;
      max-width:780px;
      min-height:520px;
      margin:0 0 0 auto;
      overflow:visible;
    }

    .panel-laptop-wrap{
      position:absolute;
      z-index:1;
      width:min(100%,580px);
    }

    .panel-laptop-img{
      width:100%;
      height:auto;
      display:block;
      filter:drop-shadow(0 28px 55px rgba(6,27,58,.18));
    }

    .panel-laptop-back{
      right:90px;
      top:4px;
      transform-origin:center bottom;
    }

    .panel-laptop-back .panel-laptop-img{
      filter:drop-shadow(0 22px 42px rgba(6,27,58,.12));
    }

    .panel-laptop-front{
      right:-92px;
      top:130px;
      z-index:2;
      transform:none;
    }

    /* BLOG */
    .blog-section{
      position:relative;
      padding:88px 0 100px;
      overflow:hidden;
    }

    .blog-section::before{
      content:"";
      position:absolute;
      left:50%;
      transform:translateX(-50%);
      width:100vw;
      top:0;
      bottom:0;
      background:var(--gradient-blue);
      z-index:0;
    }

    .blog-section .container{
      position:relative;
      z-index:1;
    }

    .blog-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:20px;
      margin-bottom:42px;
    }

    .blog-head h2{
      color:#fff;
      font-size:clamp(30px,3.5vw,44px);
      font-weight:900;
      letter-spacing:-1.2px;
      margin-bottom:8px;
    }

    .blog-head p{
      color:rgba(255,255,255,.88);
      font-size:17px;
      line-height:1.6;
      max-width:520px;
    }

    .blog-more{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:#fff;
      font-weight:800;
      font-size:15px;
      white-space:nowrap;
      transition:opacity .2s ease;
    }

    .blog-more:hover{
      opacity:.85;
    }

    .blog-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:24px;
    }

    .blog-card{
      background:#fff;
      border-radius:22px;
      overflow:hidden;
      box-shadow:0 16px 40px rgba(6,71,184,.1);
      border:1px solid var(--border);
      transition:.25s ease;
      display:flex;
      flex-direction:column;
    }

    .blog-card:hover{
      transform:translateY(-6px);
      box-shadow:0 22px 50px rgba(6,71,184,.14);
    }

    .blog-thumb{
      height:200px;
      position:relative;
      overflow:hidden;
      background:var(--primary-soft);
    }

    .blog-thumb img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transition:.35s ease;
    }

    .blog-card:hover .blog-thumb img{
      transform:scale(1.05);
    }

    .blog-tag{
      position:absolute;
      top:14px;
      left:14px;
      background:#fff;
      color:var(--primary-dark);
      font-size:11px;
      font-weight:800;
      padding:6px 10px;
      border-radius:999px;
    }

    .blog-body{
      padding:22px 20px 24px;
      display:flex;
      flex-direction:column;
      flex:1;
    }

    .blog-date{
      color:var(--muted);
      font-size:13px;
      font-weight:700;
      margin-bottom:10px;
    }

    .blog-card h3{
      color:var(--primary-dark);
      font-size:20px;
      line-height:1.35;
      font-weight:900;
      margin-bottom:10px;
    }

    .blog-card p{
      color:var(--muted);
      font-size:15px;
      line-height:1.65;
      margin-bottom:18px;
      flex:1;
    }

    .blog-link{
      color:var(--primary);
      font-weight:800;
      font-size:14px;
      display:inline-flex;
      align-items:center;
      gap:8px;
    }

    .dashboard{
      height:100%;
      display:grid;
      grid-template-rows:auto 1fr;
      font-size:11px;
    }

    .dash-top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:10px 12px;
      background:#fff;
      border-bottom:1px solid var(--border);
    }

    .dash-brand{
      display:flex;
      align-items:center;
      gap:8px;
      font-weight:900;
      color:var(--primary-dark);
      font-size:12px;
    }

    .dash-brand span{
      width:24px;
      height:24px;
      border-radius:7px;
      background:var(--gradient-blue);
      color:#fff;
      display:grid;
      place-items:center;
      font-size:8px;
      line-height:1;
      text-align:center;
    }

    .dash-search{
      flex:1;
      max-width:150px;
      height:28px;
      border:1px solid var(--border);
      border-radius:8px;
      display:flex;
      align-items:center;
      gap:6px;
      padding:0 8px;
      color:#9aa9ba;
      font-size:10px;
    }

    .dash-body{
      display:grid;
      grid-template-columns:68px 1fr;
      min-height:0;
    }

    .dash-side{
      background:#fff;
      border-right:1px solid var(--border);
      padding:10px 6px;
      display:grid;
      gap:8px;
      align-content:start;
    }

    .dash-side div{
      height:30px;
      border-radius:8px;
      display:grid;
      place-items:center;
      color:#8fa0b5;
      font-size:11px;
    }

    .dash-side .active{
      background:var(--primary-soft);
      color:var(--primary);
    }

    .dash-main{
      padding:10px;
      display:grid;
      gap:8px;
      align-content:start;
      background:#f3f8ff;
    }

    .dash-stats{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:6px;
    }

    .dash-stat{
      background:#fff;
      border:1px solid var(--border);
      border-radius:8px;
      padding:7px;
    }

    .dash-stat small{
      display:block;
      color:var(--muted);
      font-size:8px;
      font-weight:700;
      margin-bottom:3px;
    }

    .dash-stat b{
      color:var(--primary-dark);
      font-size:12px;
    }

    .dash-panels{
      display:grid;
      grid-template-columns:1.2fr .8fr;
      gap:6px;
    }

    .dash-panel{
      background:#fff;
      border:1px solid var(--border);
      border-radius:8px;
      padding:8px;
    }

    .dash-panel h4{
      color:var(--primary-dark);
      font-size:9px;
      margin-bottom:6px;
      font-weight:900;
    }

    .dash-bars{
      display:flex;
      align-items:flex-end;
      gap:4px;
      height:52px;
    }

    .dash-bars span{
      flex:1;
      border-radius:4px 4px 0 0;
      background:linear-gradient(180deg,#5ca8ff,var(--primary));
    }

    .dash-bars span:nth-child(1){height:38%}
    .dash-bars span:nth-child(2){height:62%}
    .dash-bars span:nth-child(3){height:48%}
    .dash-bars span:nth-child(4){height:78%}
    .dash-bars span:nth-child(5){height:55%}
    .dash-bars span:nth-child(6){height:68%}

    .dash-list{
      display:grid;
      gap:5px;
    }

    .dash-row{
      display:flex;
      justify-content:space-between;
      gap:6px;
      font-size:8px;
      color:var(--muted);
      font-weight:700;
    }

    .dash-row strong{
      color:var(--navy);
      font-size:8px;
    }

    .double-phone{
      height:590px;
      position:relative;
      padding:20px 0;
      box-sizing:content-box;
    }

    .double-phone .phone:first-child{
      right:190px;
      top:75px;
      transform:scale(.78);
      animation:interfacePhoneOne 4.8s ease-in-out infinite;
    }

    .double-phone .phone:last-child{
      right:10px;
      top:20px;
      transform:scale(.88);
      animation:interfacePhoneTwo 4.3s ease-in-out infinite;
    }

    @keyframes interfacePhoneOne{
      0%,100%{transform:scale(.78) translateY(0)}
      50%{transform:scale(.78) translateY(12px)}
    }

    @keyframes interfacePhoneTwo{
      0%,100%{transform:scale(.88) translateY(0)}
      50%{transform:scale(.88) translateY(-12px)}
    }

    /* FAQ */
    .faq-section{
      padding-top:80px;
    }

    .faq{
      max-width:1180px;
      margin:auto;
      display:grid;
      gap:18px;
    }

    .faq-item{
      background:#fff;
      border-radius:18px;
      box-shadow:0 12px 30px rgba(6,71,184,.08);
      overflow:hidden;
    }

    .faq-question{
      padding:24px 28px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      cursor:pointer;
      color:var(--primary-dark);
      font-size:20px;
      font-weight:900;
    }

    .faq-answer{
      max-height:0;
      overflow:hidden;
      transition:.35s ease;
      color:var(--muted);
      line-height:1.8;
      font-size:16px;
      padding:0 28px;
    }

    .faq-item.active .faq-answer{
      max-height:240px;
      padding:0 28px 24px;
    }

    .faq-item.active .faq-question i{
      transform:rotate(45deg);
    }

    /* CTA */
    .cta{
      padding-top:90px;
      padding-bottom:155px;
    }

    .cta-box{
      background:var(--gradient-blue);
      border-radius:34px;
      min-height:470px;
      padding:80px;
      color:#fff;
      display:grid;
      grid-template-columns:1fr 1fr;
      align-items:center;
      gap:50px;
      overflow:visible;
      position:relative;
    }

    .cta-box::after{
      content:"";
      position:absolute;
      right:-100px;
      top:-100px;
      width:360px;
      height:360px;
      border-radius:50%;
      background:rgba(255,255,255,.1);
      pointer-events:none;
      z-index:1;
    }

    .cta h2{
      font-size:clamp(34px,4vw,56px);
      line-height:1.1;
      font-weight:900;
      margin-bottom:20px;
    }

    .cta p{
      font-size:18px;
      line-height:1.8;
      color:rgba(255,255,255,.9);
      margin-bottom:28px;
    }

    .cta-content{
      position:relative;
      z-index:8;
      max-width:570px;
    }

    .cta-phones{
      position:absolute;
      right:55px;
      top:-85px;
      width:560px;
      height:610px;
      z-index:6;
      pointer-events:none;
      padding:20px 0;
      box-sizing:content-box;
    }

    .cta-phones .phone:first-child{
      right:190px;
      top:115px;
      transform:scale(.78);
      z-index:7;
      animation:ctaPhoneOne 4.8s ease-in-out infinite;
    }

    .cta-phones .phone:last-child{
      right:10px;
      top:60px;
      transform:scale(.88);
      z-index:8;
      animation:ctaPhoneTwo 4.3s ease-in-out infinite;
    }

    @keyframes ctaPhoneOne{
      0%,100%{transform:scale(.78) translateY(0)}
      50%{transform:scale(.78) translateY(12px)}
    }

    @keyframes ctaPhoneTwo{
      0%,100%{transform:scale(.88) translateY(0)}
      50%{transform:scale(.88) translateY(-12px)}
    }

    /* FOOTER */
    .footer{
      position:relative;
      color:#fff;
      padding:90px 0 35px;
      overflow:hidden;
    }

    .footer::before{
      content:"";
      position:absolute;
      left:50%;
      transform:translateX(-50%);
      width:100vw;
      top:0;
      bottom:0;
      background:var(--gradient-blue);
      z-index:0;
    }

    .footer .container{
      position:relative;
      z-index:1;
    }

    .footer-grid{
      display:grid;
      grid-template-columns:1.4fr 1fr 1fr 1fr;
      gap:60px;
      margin-bottom:60px;
    }

    .footer-logo{
      font-size:32px;
      font-weight:900;
      color:#fff;
      letter-spacing:.3px;
      margin-bottom:28px;
      display:inline-block;
    }

    .footer p,
    .footer a{
      color:rgba(255,255,255,.82);
      font-weight:600;
      line-height:1.9;
    }

    .footer h3{
      font-size:20px;
      margin-bottom:24px;
    }

    .social{
      display:flex;
      gap:12px;
      margin-top:24px;
    }

    .social a{
      width:42px;
      height:42px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,.25);
      display:grid;
      place-items:center;
    }

    .footer-links{
      display:grid;
      gap:14px;
    }

    .footer-store{
      display:grid;
      gap:14px;
    }

    .footer-col-side{
      display:grid;
      gap:36px;
    }

    .footer-side-block h3{
      margin-bottom:20px;
    }

    .footer-store-row{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
    }

    .footer-store-row .store-btn{
      flex:1 1 140px;
      max-width:180px;
    }

    .footer-store-row .store-btn img{
      width:100%;
      height:auto;
      display:block;
    }

    .footer-bottom{
      border-top:1px solid rgba(255,255,255,.16);
      padding-top:28px;
      display:flex;
      justify-content:space-between;
      gap:20px;
      color:rgba(255,255,255,.78);
      font-weight:600;
    }

    .back-top{
      position:fixed;
      right:26px;
      bottom:26px;
      width:55px;
      height:55px;
      border-radius:50%;
      background:#fff;
      color:var(--primary);
      box-shadow:0 12px 28px rgba(6,71,184,.25);
      display:grid;
      place-items:center;
      z-index:90;
      font-size:20px;
      border:none;
      cursor:pointer;
      opacity:0;
      visibility:hidden;
      transform:translateY(28px);
      transition:opacity .35s ease, transform .35s ease, visibility .35s ease, box-shadow .25s ease;
    }

    .back-top.is-active{
      opacity:1;
      visibility:visible;
      transform:translateY(0);
    }

    .back-top:hover{
      box-shadow:0 16px 34px rgba(6,71,184,.32);
    }

    .back-top i{
      display:block;
    }

    .back-top.is-active i{
      animation:backTopArrow 1.5s ease-in-out infinite;
    }

    .back-top.is-launching{
      animation:backTopLaunch .65s ease forwards;
    }

    @keyframes backTopLaunch{
      0%{transform:translateY(0)}
      45%{transform:translateY(-14px)}
      100%{transform:translateY(0)}
    }

    @keyframes backTopArrow{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-6px)}
    }

    /* TABLET */
    @media (max-width:1100px){
      .hero-grid,
      .solution,
      .panel-grid{
        grid-template-columns:1fr;
        text-align:center;
        gap:45px;
      }

      .hero-text{
        max-width:680px;
        margin:0 auto;
        text-align:center;
        align-items:center;
      }

      .hero-actions{
        justify-content:center;
      }

      .hero-text p,
      .hero-text .hero-lead{
        margin-left:auto;
        margin-right:auto;
      }

      .hero-points,
      .hero-actions,
      .users{
        justify-content:center;
      }

      .hero-points{
        max-width:420px;
        margin-left:auto;
        margin-right:auto;
      }

      .phone-area{
        min-height:660px;
        max-width:650px;
        margin:0 auto;
        justify-self:center;
      }

      .hero .phone{
        left:calc(50% + 38px);
        right:auto;
        transform:translateX(-50%);
        animation:phoneFloatTablet 4.2s ease-in-out infinite;
      }

      .hero .phone.phone-back{
        left:calc(50% - 58px);
        right:auto;
        transform:translateX(-50%) scale(.82);
        animation:phoneFloatBackTablet 4.8s ease-in-out infinite;
      }

      .features-box{
        grid-template-columns:1fr;
        gap:30px;
      }

      .feature-list{
        grid-template-columns:repeat(2,1fr);
        gap:35px;
      }

      .center-phone{
        order:-1;
        height:650px;
      }

      .report-phone,
      .double-phone{
        margin:auto;
        width:100%;
        max-width:600px;
      }

      .report-phone .phone{
        left:50%;
        animation:reportPhoneFloatTablet 4.5s ease-in-out infinite;
      }

      @keyframes reportPhoneFloatTablet{
        0%,100%{transform:translateX(-50%) scale(.9) translateY(0)}
        50%{transform:translateX(-50%) scale(.9) translateY(-14px)}
      }

      .cta{
        padding-bottom:130px;
      }

      .cta-box{
        grid-template-columns:1fr;
        text-align:center;
        padding:60px 40px 500px;
      }

      .cta-content{
        margin:auto;
      }

      .cta-phones{
        right:50%;
        top:auto;
        bottom:-95px;
        transform:translateX(50%);
        width:min(560px,calc(100vw - 40px));
        height:520px;
        overflow:visible;
        padding:20px 0;
        box-sizing:content-box;
      }

      .panel-grid{
        grid-template-columns:1fr;
        gap:40px;
        text-align:center;
      }

      .desktop-showcase{
        max-width:min(100%,640px);
        min-height:460px;
        margin:0 auto;
      }

      .panel-laptop-wrap{
        width:min(100%,480px);
      }

      .panel-laptop-back{
        left:50%;
        right:auto;
        top:0;
        transform:translateX(calc(-50% - 46px));
        transform-origin:center bottom;
      }

      .panel-laptop-front{
        left:50%;
        right:auto;
        top:112px;
        transform:translateX(calc(-50% + 48px));
      }

      .panel-list{
        max-width:460px;
        margin-left:auto;
        margin-right:auto;
        text-align:left;
      }

      .blog-grid{
        grid-template-columns:repeat(2,1fr);
      }

      .footer-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    /* MOBILE */
    @media (max-width:768px){
      .container{
        width:min(100% - 28px,1180px);
      }

      .header{
        position:absolute;
        top:0;
        left:0;
        width:100%;
        padding:14px 0;
        backdrop-filter:none;
        box-shadow:none;
      }

      .header.scrolled{
        position:absolute;
        background:transparent;
        backdrop-filter:none;
        box-shadow:none;
        padding:14px 0;
      }

      .logo{
        color:#fff;
        font-size:25px;
      }

      .header.scrolled .logo{
        color:#fff;
      }

      .mobile-toggle{
        display:grid !important;
        background:rgba(255,255,255,.18);
        color:#fff;
        border-color:rgba(255,255,255,.35);
      }

      .header.scrolled .mobile-toggle{
        background:rgba(255,255,255,.18);
        color:#fff;
        border-color:rgba(255,255,255,.35);
      }

      body.menu-open{
        overflow:hidden;
      }

      .nav-overlay{
        display:block;
        position:fixed;
        inset:0;
        background:rgba(6,27,58,.48);
        backdrop-filter:blur(4px);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transition:opacity .28s ease,visibility .28s ease;
        z-index:10000;
      }

      .nav-overlay.is-open{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
      }

      .menu{
        position:fixed;
        top:0;
        right:0;
        left:0;
        width:100%;
        max-width:none;
        height:100%;
        height:100dvh;
        margin:0;
        padding:0;
        background:#fff;
        color:var(--navy);
        border-radius:0;
        box-shadow:none;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translateX(100%);
        transition:transform .32s cubic-bezier(.22,1,.36,1);
        z-index:10002;
        box-sizing:border-box;
        overflow:hidden;
        flex:none;
        text-transform:none;
        letter-spacing:0;
        font-size:15px;
        font-weight:600;
      }

      .menu.active{
        transform:translateX(0);
      }

      .menu-drawer-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        padding:18px 20px;
        border-bottom:1px solid var(--border);
        background:#fff;
      }

      .menu-drawer-brand{
        font-size:22px;
        font-weight:900;
        color:var(--primary);
        letter-spacing:.2px;
        text-transform:none;
      }

      .menu-drawer-close{
        display:grid;
        place-items:center;
        width:42px;
        height:42px;
        border:1px solid var(--border);
        border-radius:12px;
        background:#fff;
        color:var(--navy);
        font-size:18px;
        line-height:1;
        cursor:pointer;
        transition:.2s ease;
        appearance:none;
        -webkit-appearance:none;
        box-shadow:none;
      }

      .menu-drawer-close i{
        color:inherit;
        font-size:18px;
        line-height:1;
        pointer-events:none;
      }

      .menu-drawer-close:hover,
      .menu-drawer-close:focus{
        border-color:var(--primary);
        color:var(--primary);
        background:#fff;
        outline:none;
      }

      .menu-drawer-body{
        display:block;
        flex:1;
        overflow-y:auto;
        padding:24px 20px;
        -webkit-overflow-scrolling:touch;
      }

      .menu-links{
        position:static;
        left:auto;
        top:auto;
        transform:none;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:4px;
        white-space:normal;
        width:100%;
      }

      .menu-links a{
        display:flex;
        align-items:center;
        justify-content:center;
        text-align:center;
        padding:16px 12px;
        border-radius:12px;
        color:var(--navy);
        font-size:15px;
        font-weight:700;
        letter-spacing:.06em;
        text-transform:uppercase;
        transition:background .2s ease,color .2s ease;
      }

      .menu-links a i{
        display:none !important;
      }

      .menu-links a:hover,
      .menu-links a.active{
        background:rgba(11,108,255,.08);
        color:var(--primary);
      }

      .menu-drawer-foot{
        display:block;
        padding:16px 20px 28px;
        border-top:1px solid var(--border);
        background:#f8fbff;
      }

      .menu .nav-actions{
        display:flex;
        flex-direction:column;
        gap:10px;
        width:100%;
        margin:0;
      }

      .menu .nav-login,
      .menu .nav-btn{
        width:100%;
        display:flex;
        align-items:center;
        justify-content:center;
        text-align:center;
        font-size:14px;
        font-weight:900;
        letter-spacing:.04em;
        text-transform:uppercase;
        padding:15px 24px;
        line-height:1.2;
        box-sizing:border-box;
      }

      .menu .nav-login{
        border-color:var(--border);
        color:var(--primary-dark);
        background:#fff;
      }

      .menu .nav-btn{
        background:var(--primary);
        color:#fff;
        box-shadow:0 10px 24px rgba(11,108,255,.28);
      }

      .nav-btn{
        text-align:center;
        background:var(--primary);
        color:#fff;
      }

      body.menu-open .mobile-toggle{
        opacity:0;
        pointer-events:none;
      }

      .hero{
        min-height:auto;
        padding:96px 0 108px;
      }

      .hero-grid{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:32px;
      }

      .hero-text{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
        max-width:100%;
        width:100%;
        margin:0 auto;
        order:2;
      }

      .hero-label{
        font-size:11px;
        margin-bottom:16px;
      }

      .hero-text h1{
        font-size:clamp(30px,8vw,38px);
        letter-spacing:-1px;
      }

      .hero-text .hero-lead{
        font-size:15px;
        line-height:1.7;
        max-width:100%;
        margin-left:auto;
        margin-right:auto;
      }

      .hero-points{
        width:100%;
        max-width:360px;
        gap:10px;
        margin-bottom:24px;
        margin-left:auto;
        margin-right:auto;
        align-items:center;
      }

      .hero-point{
        font-size:14px;
        justify-content:center;
        text-align:center;
      }

      .hero-actions{
        width:100%;
        max-width:340px;
        flex-direction:column;
        align-items:center;
        margin-bottom:24px;
        margin-left:auto;
        margin-right:auto;
      }

      .hero-btn{
        width:100%;
      }

      .users{
        width:100%;
        justify-content:center;
      }

      .shape{
        display:none;
      }

      .hero .phone-area{
        order:1;
        width:100%;
        max-width:280px;
        min-height:500px;
        margin:0 auto 4px;
        transform:none;
        overflow:visible;
        padding:14px 0;
        box-sizing:content-box;
        justify-self:center;
        display:flex;
        align-items:center;
        justify-content:center;
        position:relative;
      }

      .hero-wave{
        height:72px;
      }

      #features{
        padding-top:64px;
      }

      .panel-section{
        padding:72px 0;
      }

      .panel-grid{
        grid-template-columns:1fr;
        gap:30px;
        text-align:center;
      }

      .panel-list{
        text-align:center;
        max-width:360px;
        margin-left:auto;
        margin-right:auto;
      }

      .panel-list div{
        justify-content:center;
      }

      .panel-text .main-btn{
        margin:0 auto;
      }

      .desktop-showcase{
        max-width:min(100%,520px);
        min-height:400px;
        margin:0 auto;
      }

      .panel-laptop-wrap{
        width:min(100%,340px);
      }

      .panel-laptop-back{
        left:50%;
        right:auto;
        top:0;
        transform:translateX(calc(-50% - 38px));
        transform-origin:center bottom;
      }

      .panel-laptop-front{
        left:50%;
        right:auto;
        top:96px;
        transform:translateX(calc(-50% + 40px));
      }

      .blog-head{
        flex-direction:column;
        align-items:center;
        text-align:center;
      }

      .blog-head p{
        max-width:100%;
        margin-left:auto;
        margin-right:auto;
      }

      .blog-more{
        justify-content:center;
      }

      .blog-grid{
        grid-template-columns:1fr;
      }

      .blog-section{
        padding:72px 0 72px;
      }

      .dash-stats{
        grid-template-columns:repeat(2,1fr);
      }

      .dash-panels{
        grid-template-columns:1fr;
      }

      .hero .phone{
        width:250px;
        height:500px;
        border-radius:44px;
        padding:10px;
        left:50%;
        right:auto;
        top:14px;
        margin-left:0;
        transform:translateX(-50%);
        animation:phoneFloatMobile 4.2s ease-in-out infinite;
      }

      .hero .phone.phone-back{
        display:none;
      }

      .hero .phone-screen{
        border-radius:35px;
      }

      .store-row{
        width:100%;
        justify-content:center;
      }

      section{
        padding:72px 0;
      }

      .section-title{
        margin-bottom:38px;
      }

      .section-title h2{
        font-size:32px;
      }

      .section-title p{
        font-size:16px;
      }

      .features-box{
        display:flex;
        flex-direction:column;
        padding:28px 18px 34px;
        border-radius:24px;
        gap:28px;
        overflow:hidden;
      }

      .feature-list{
        width:100%;
        display:grid;
        grid-template-columns:1fr;
        gap:26px;
      }

      .center-phone{
        order:0;
        width:100%;
        height:460px;
        transform:none;
        margin:0;
      }

      .center-phone .phone{
        width:240px;
        height:480px;
        border-radius:42px;
        padding:10px;
        margin:0 auto;
        position:relative;
        left:auto;
        right:auto;
        top:auto;
      }

      .center-phone .phone-screen{
        border-radius:34px;
      }

      .solution{
        display:flex;
        flex-direction:column;
        gap:26px;
      }

      .report-phone{
        width:100%;
        height:524px;
        margin:0 auto;
        transform:none;
        order:0;
        overflow:visible;
        padding:12px 0;
        box-sizing:content-box;
      }

      .report-phone .phone{
        width:250px;
        height:500px;
        border-radius:44px;
        padding:10px;
        left:50%;
        top:0;
        animation:reportPhoneFloatTablet 4.5s ease-in-out infinite;
      }

      @keyframes reportPhoneFloatTablet{
        0%,100%{transform:translateX(-50%) translateY(0)}
        50%{transform:translateX(-50%) translateY(-16px)}
      }

      .solution-text h2{
        font-size:34px;
      }

      .solution-text p{
        font-size:16px;
      }

      .stats{
        grid-template-columns:1fr;
      }

      .faq-question{
        font-size:17px;
        padding:20px;
      }

      .faq-answer{
        padding:0 20px;
      }

      .faq-item.active .faq-answer{
        padding:0 20px 20px;
      }

      .cta{
        padding-top:60px;
        padding-bottom:90px;
      }

      .cta-box{
        display:flex;
        flex-direction:column;
        padding:32px 20px 38px;
        border-radius:24px;
        min-height:auto;
        text-align:center;
        overflow:visible;
      }

      .cta-box::after{
        right:-60px;
        top:-60px;
        width:220px;
        height:220px;
      }

      .cta-phones{
        position:relative;
        order:-1;
        right:auto;
        left:auto;
        top:-78px;
        bottom:auto;
        transform:none;
        width:100%;
        max-width:340px;
        height:500px;
        margin:0 auto -80px;
        overflow:visible;
        padding:16px 0;
        box-sizing:content-box;
        z-index:9;
      }

      .cta-phones .phone{
        width:250px;
        height:500px;
        border-radius:44px;
        padding:10px;
        opacity:1;
      }

      .cta-phones .phone:first-child{
        left:50%;
        right:auto;
        top:88px;
        margin-left:0;
        transform:translateX(-65%) scale(.78);
        z-index:10;
        animation:ctaPhoneOne 4.8s ease-in-out infinite;
      }

      .cta-phones .phone:last-child{
        left:50%;
        right:auto;
        top:26px;
        margin-left:0;
        transform:translateX(-35%) scale(.88);
        z-index:11;
        animation:ctaPhoneTwo 4.3s ease-in-out infinite;
      }

      @keyframes ctaPhoneOne{
        0%,100%{transform:translateX(-65%) scale(.78) translateY(0)}
        50%{transform:translateX(-65%) scale(.78) translateY(10px)}
      }

      @keyframes ctaPhoneTwo{
        0%,100%{transform:translateX(-35%) scale(.88) translateY(0)}
        50%{transform:translateX(-35%) scale(.88) translateY(-10px)}
      }

      .cta-content{
        width:100%;
        max-width:100%;
        margin:0 auto;
        z-index:12;
      }

      .footer-grid{
        grid-template-columns:1fr;
        text-align:center;
      }

      .footer-logo,
      .social{
        margin-left:auto;
        margin-right:auto;
        justify-content:center;
      }

      .footer-store-row{
        justify-content:center;
      }

      .footer-col-side{
        gap:28px;
      }

      .footer-bottom{
        flex-direction:column;
        text-align:center;
      }

      .reveal-left,
      .reveal-right{
        transform:translateY(70px);
      }

      .show .reveal-left,
      .show .reveal-right{
        transform:translateY(0);
      }

      .back-top{
        right:14px;
        bottom:18px;
        width:48px;
        height:48px;
        font-size:18px;
      }
    }

    @media (max-width:460px){
      .hero-text h1{
        font-size:28px;
      }

      .hero .phone-area{
        max-width:250px;
        min-height:460px;
        padding:14px 0;
      }

      .hero .phone{
        width:225px;
        height:450px;
        top:12px;
        left:50%;
        transform:translateX(-50%);
      }

      .hero .phone.phone-back{
        display:none;
      }

      .center-phone{
        height:430px;
      }

      .center-phone .phone{
        width:220px;
        height:440px;
      }

      .report-phone{
        height:476px;
        padding:10px 0;
      }

      .report-phone .phone{
        width:225px;
        height:450px;
      }

      .cta-phones{
        max-width:310px;
        height:455px;
        margin-bottom:-70px;
        padding:14px 0;
      }

      .cta-phones .phone{
        width:225px;
        height:450px;
      }

      .cta-phones .phone:first-child{
        top:82px;
        transform:translateX(-65%) scale(.78);
      }

      .cta-phones .phone:last-child{
        top:24px;
        transform:translateX(-35%) scale(.88);
      }

      .stat strong{
        font-size:30px;
      }
    }

    .kurumsal-page{
      padding:60px 0 80px;
      min-height:40vh;
    }

    .kurumsal-page h1{
      font-size:42px;
      margin-bottom:24px;
      color:var(--navy);
    }

    .kurumsal-content{
      max-width:1180px;
      font-size:17px;
      line-height:1.8;
      color:var(--text);
    }

    .kurumsal-content p{
      margin-bottom:18px;
    }

    .kurumsal-content strong{
      color:var(--navy);
    }

    .kurumsal-links{
      margin-top:48px;
      padding-top:32px;
      border-top:1px solid var(--border);
    }

    .kurumsal-links h3{
      margin-bottom:16px;
      color:var(--navy);
      font-size:18px;
      font-weight:700;
    }

    .kurumsal-links-nav{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }

    .kurumsal-links-nav a{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:12px 20px;
      border-radius:12px;
      border:1px solid var(--border);
      color:var(--text);
      font-weight:500;
      font-size:15px;
      transition:all .2s;
      background:var(--white);
    }

    .kurumsal-links-nav a i{
      font-size:11px;
      color:var(--muted);
      transition:color .2s;
    }

    .kurumsal-links-nav a:hover{
      border-color:var(--primary);
      color:var(--primary);
      box-shadow:0 4px 12px rgba(37,99,235,.1);
    }

    .kurumsal-links-nav a:hover i{
      color:var(--primary);
    }

    .kurumsal-links-nav a.active{
      background:var(--primary);
      border-color:var(--primary);
      color:var(--white);
      font-weight:600;
    }

    .kurumsal-links-nav a.active i{
      color:var(--white);
    }

    .kurumsal-links .footer-links a.active{
      color:var(--primary);
      font-weight:600;
    }

    .sozlesmeler-page{
      padding:60px 0 80px;
    }

    .sozlesmeler-layout{
      display:grid;
      grid-template-columns:280px minmax(0, 1fr);
      gap:40px;
      align-items:start;
    }

    .sozlesmeler-sidebar{
      position:sticky;
      top:110px;
      background:var(--white);
      border:1px solid var(--border);
      border-radius:16px;
      padding:24px;
      box-shadow:0 8px 24px rgba(15,23,42,.06);
    }

    .sozlesmeler-sidebar-title{
      font-size:14px;
      font-weight:700;
      text-transform:uppercase;
      letter-spacing:.06em;
      color:var(--muted);
      margin-bottom:16px;
    }

    .sozlesmeler-nav{
      display:flex;
      flex-direction:column;
      gap:6px;
    }

    .sozlesmeler-nav a{
      display:block;
      padding:12px 14px;
      border-radius:10px;
      color:var(--text);
      font-weight:500;
      line-height:1.4;
      transition:background .2s,color .2s;
    }

    .sozlesmeler-nav a:hover{
      background:rgba(37,99,235,.08);
      color:var(--primary);
    }

    .sozlesmeler-nav a.active{
      background:var(--primary);
      color:var(--white);
      font-weight:600;
    }

    .sozlesmeler-content h2{
      font-size:32px;
      margin-bottom:24px;
      color:var(--navy);
    }

    .sozlesmeler-body{
      font-size:17px;
      line-height:1.8;
      color:var(--text);
      text-align:justify;
    }

    .sozlesmeler-body p{
      margin-bottom:18px;
    }

    .sozlesmeler-body strong{
      color:var(--navy);
    }

    .page-hero-compact{
      padding-bottom:72px;
    }

    @media (max-width: 900px){
      .sozlesmeler-layout{
        grid-template-columns:1fr;
      }

      .sozlesmeler-sidebar{
        position:static;
        order:2;
      }

      .sozlesmeler-content{
        order:1;
      }

      .sozlesmeler-nav{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
      }
    }

    @media (max-width: 560px){
      .sozlesmeler-nav{
        grid-template-columns:1fr;
      }
    }

    /* INNER PAGE - ÖZELLİKLER */
    .header .menu a.active{
      opacity:1;
      text-decoration:underline;
      text-underline-offset:6px;
    }

    .header.scrolled .menu a.active{
      color:var(--primary);
    }

    .page-hero{
      position:relative;
      padding:138px 0 100px;
      background:var(--gradient-blue-vertical);
      color:var(--white);
      overflow:hidden;
    }

    .page-hero-bg{
      position:absolute;
      inset:0;
      pointer-events:none;
    }

    .page-hero-bg .shape{
      position:absolute;
      color:rgba(255,255,255,.12);
      font-size:clamp(40px,6vw,72px);
    }

    .page-hero-bg .p1{top:18%;left:8%}
    .page-hero-bg .p2{top:22%;right:12%}
    .page-hero-bg .p3{bottom:28%;left:14%}
    .page-hero-bg .p4{bottom:20%;right:8%}

    .page-hero-inner{
      position:relative;
      z-index:2;
      max-width:820px;
    }

    .page-hero h1{
      font-size:clamp(38px,5.5vw,58px);
      line-height:1.08;
      font-weight:900;
      margin-bottom:16px;
      letter-spacing:-1px;
    }

    .page-hero-lead,
    .page-hero p{
      font-size:clamp(16px,2.2vw,19px);
      line-height:1.75;
      color:rgba(255,255,255,.9);
      margin-bottom:28px;
      max-width:640px;
    }

    .breadcrumb{
      display:flex;
      align-items:center;
      gap:10px;
      font-size:14px;
      font-weight:600;
      margin-bottom:22px;
      color:rgba(255,255,255,.82);
    }

    .breadcrumb a:hover{
      color:var(--white);
    }

    .breadcrumb i{
      font-size:10px;
      opacity:.7;
    }

    .page-label{
      display:inline-flex;
      align-items:center;
      gap:8px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.22);
      padding:10px 18px;
      border-radius:999px;
      font-size:13px;
      font-weight:700;
      margin-bottom:20px;
    }

    .page-label.light{
      background:var(--primary-soft);
      border-color:var(--border);
      color:var(--primary);
    }

    .page-hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
    }

    .page-hero-wave{
      position:absolute;
      left:0;
      bottom:0;
      width:100%;
      height:70px;
      z-index:2;
    }

    .page-hero-wave svg{
      width:100%;
      height:100%;
      display:block;
    }

    .page-hero-wave path{
      fill:var(--light);
    }

    .page-stats{
      margin-top:-42px;
      position:relative;
      z-index:5;
      padding-bottom:20px;
    }

    .page-stats-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
    }

    .page-stat{
      background:var(--white);
      border:1px solid var(--border);
      border-radius:20px;
      padding:26px 22px;
      text-align:center;
      box-shadow:var(--shadow);
    }

    .page-stat strong{
      display:block;
      font-size:clamp(28px,4vw,38px);
      font-weight:900;
      color:var(--primary);
      line-height:1;
      margin-bottom:8px;
    }

    .page-stat span{
      font-size:14px;
      font-weight:700;
      color:var(--muted);
    }

    .ozellikler-intro{
      padding:70px 0 50px;
      overflow:visible;
    }

    .ozellikler-intro-grid{
      display:grid;
      grid-template-columns:1.05fr .95fr;
      gap:50px;
      align-items:center;
    }

    .ozellikler-intro-text h2{
      font-size:clamp(28px,4vw,40px);
      color:var(--primary-dark);
      margin-bottom:18px;
      line-height:1.2;
      font-weight:900;
    }

    .ozellikler-intro-visual{
      display:flex;
      justify-content:flex-end;
      overflow:visible;
      align-self:stretch;
    }

    .ozellik-intro-phones{
      width:100%;
      max-width:520px;
      margin-left:auto;
      margin-right:-10px;
      min-height:700px;
      padding:10px 0 30px;
      overflow:visible;
    }

    .ozellik-intro-phones .phone{
      right:-10px;
      top:10px;
      animation:phoneFloat 4.2s ease-in-out infinite;
    }

    .ozellik-intro-phones .phone.phone-back{
      right:165px;
      top:90px;
      transform:scale(.82);
      animation:phoneFloatBack 4.8s ease-in-out infinite;
    }

    .ozellikler-grid-section{
      padding:60px 0 70px;
      position:relative;
      z-index:1;
      background:var(--light);
    }

    .ozellikler-highlight.panel-section{
      padding-top:40px;
      padding-bottom:40px;
    }

    .ozellikler-highlight .panel-text .page-label{
      margin-bottom:14px;
    }

    .ozellikler-intro-text p{
      font-size:17px;
      line-height:1.8;
      color:var(--muted);
      margin-bottom:24px;
    }

    .ozellik-checklist{
      list-style:none;
      display:grid;
      gap:14px;
    }

    .ozellik-checklist li{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:600;
      color:var(--text);
    }

    .ozellik-checklist i{
      width:28px;
      height:28px;
      border-radius:50%;
      background:var(--primary-soft);
      color:var(--primary);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      flex-shrink:0;
    }

    .ozellikler-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:24px;
    }

    .ozellik-card{
      background:var(--white);
      border:1px solid var(--border);
      border-radius:24px;
      padding:30px 26px;
      transition:transform .25s ease, box-shadow .25s ease;
    }

    .ozellik-card:hover{
      transform:translateY(-6px);
      box-shadow:0 22px 50px rgba(6,71,184,.12);
    }

    .ozellik-card-icon{
      width:58px;
      height:58px;
      border-radius:18px;
      background:var(--gradient-blue);
      color:var(--white);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:22px;
      margin-bottom:20px;
      box-shadow:0 14px 30px rgba(11,108,255,.28);
    }

    .ozellik-card h3{
      font-size:20px;
      color:var(--navy);
      margin-bottom:12px;
    }

    .ozellik-card p{
      font-size:15px;
      line-height:1.75;
      color:var(--muted);
      margin-bottom:18px;
    }

    .ozellik-more-banner{
      margin-top:32px;
      padding:44px 32px;
      border:2px dashed rgba(11,108,255,.35);
      border-radius:24px;
      background:linear-gradient(180deg,#f5faff 0%,#fff 100%);
      display:flex;
      flex-direction:column;
      align-items:center;
      text-align:center;
      transition:border-color .25s ease;
    }

    .ozellik-more-banner:hover{
      border-color:var(--primary);
    }

    .ozellik-more-icon-wrap{
      width:58px;
      height:58px;
      border-radius:18px;
      background:var(--primary-soft);
      color:var(--primary);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:22px;
      margin-bottom:18px;
    }

    .ozellik-more-banner h3{
      font-size:24px;
      color:var(--navy);
      margin-bottom:10px;
    }

    .ozellik-more-banner p{
      font-size:16px;
      line-height:1.7;
      color:var(--muted);
      max-width:820px;
      margin-bottom:24px;
    }

    .hero-btn.primary.ozellik-more-btn{
      background:var(--primary);
      color:#fff;
      font-weight:900;
      font-size:16px;
      letter-spacing:.06em;
      text-transform:uppercase;
      padding:0 42px;
      min-height:58px;
      box-shadow:0 16px 36px rgba(11,108,255,.38);
      animation:ozellikMorePulse 2.4s ease-in-out infinite;
    }

    .hero-btn.primary.ozellik-more-btn:hover{
      background:var(--primary-dark);
      transform:translateY(-3px);
      box-shadow:0 20px 44px rgba(11,108,255,.45);
      animation:none;
    }

    @keyframes ozellikMorePulse{
      0%,100%{box-shadow:0 16px 36px rgba(11,108,255,.38)}
      50%{box-shadow:0 16px 36px rgba(11,108,255,.38),0 0 0 12px rgba(11,108,255,.08)}
    }

    .ozellik-tags{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }

    .ozellik-tags span{
      font-size:12px;
      font-weight:700;
      color:var(--primary);
      background:var(--primary-soft);
      padding:6px 12px;
      border-radius:999px;
    }

    @media (max-width:1024px){
      .page-stats-grid{
        grid-template-columns:repeat(2,1fr);
      }

      .ozellikler-grid{
        grid-template-columns:repeat(2,1fr);
      }

      .ozellikler-intro-grid{
        grid-template-columns:1fr;
      }

      .ozellikler-intro-visual{
        justify-content:center;
      }

      .ozellik-intro-phones{
        margin:0 auto;
        max-width:340px;
      }

      .ozellik-intro-phones .phone{
        left:calc(50% + 38px);
        right:auto;
        transform:translateX(-50%);
        animation:phoneFloatTablet 4.2s ease-in-out infinite;
      }

      .ozellik-intro-phones .phone.phone-back{
        left:calc(50% - 58px);
        right:auto;
        transform:translateX(-50%) scale(.82);
        animation:phoneFloatBackTablet 4.8s ease-in-out infinite;
      }
    }

    @media (max-width:768px){
      .page-hero{
        padding:120px 0 90px;
      }

      .page-hero-actions{
        flex-direction:column;
      }

      .page-hero-actions .hero-btn{
        width:100%;
        justify-content:center;
        text-align:center;
      }

      .page-stats{
        margin-top:-28px;
      }

      .page-stats-grid{
        grid-template-columns:repeat(2,1fr);
        gap:12px;
      }

      .page-stat{
        padding:20px 14px;
      }

      .ozellikler-intro{
        padding:50px 0 20px;
      }

      .ozellikler-intro-visual{
        justify-content:center;
        width:100%;
      }

      .ozellik-intro-phones{
        width:100%;
        max-width:340px;
        min-height:540px;
        margin:0 auto;
        padding:14px 0 55px;
        overflow:visible;
      }

      .ozellik-intro-phones .phone{
        width:250px;
        height:500px;
        border-radius:44px;
        padding:10px;
        left:calc(50% + 30px);
        right:auto;
        top:26px;
        transform:translateX(-50%);
        box-shadow:0 28px 55px rgba(0,0,0,.22);
        animation:none;
      }

      .ozellik-intro-phones .phone.phone-back{
        width:250px;
        height:500px;
        border-radius:44px;
        padding:10px;
        left:calc(50% - 45px);
        right:auto;
        top:86px;
        transform:translateX(-50%) scale(.78);
        box-shadow:0 18px 38px rgba(0,0,0,.12);
        animation:none;
      }

      .ozellik-intro-phones .phone-screen{
        border-radius:35px;
      }

      .ozellikler-grid-section{
        margin-top:40px;
        padding-top:48px;
      }

      .ozellikler-grid{
        grid-template-columns:1fr;
        gap:18px;
      }

      .ozellik-card{
        padding:24px 20px;
      }

      .ozellik-more-banner{
        margin-top:24px;
        padding:32px 20px;
      }

      .ozellik-more-btn{
        width:100%;
      }
    }

    @media (max-width:480px){
      .page-stats-grid{
        grid-template-columns:1fr 1fr;
      }

      .breadcrumb{
        font-size:13px;
        flex-wrap:wrap;
      }
    }

    /* DEMO TALEP - SPLIT WIZARD */
    .demo-split-section{
      padding:60px 0 72px;
      background:#f3f8ff;
    }

    .demo-split-grid{
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(320px,520px);
      gap:56px;
      align-items:center;
    }

    .demo-split-copy h2{
      font-size:clamp(34px,4vw,52px);
      line-height:1.12;
      letter-spacing:-.03em;
      color:var(--navy);
      margin-bottom:22px;
      max-width:14ch;
    }

    .demo-split-copy p{
      font-size:18px;
      line-height:1.75;
      color:var(--muted);
      max-width:46ch;
    }

    .demo-wizard-wrap{
      width:100%;
    }

    .demo-wizard-card{
      background:var(--white);
      border-radius:28px;
      padding:34px 34px 28px;
      box-shadow:0 24px 70px rgba(11,108,255,.14);
      border:1px solid rgba(227,237,248,.9);
    }

    .demo-steps{
      display:flex;
      gap:8px;
      margin-bottom:26px;
    }

    .demo-step-dot{
      width:10px;
      height:10px;
      border-radius:999px;
      background:#d7e3f3;
      transition:.25s ease;
    }

    .demo-step-dot.is-active,
    .demo-step-dot.is-done{
      background:var(--primary);
    }

    .demo-step-panel{
      display:none;
    }

    .demo-step-panel.is-active{
      display:block;
      animation:demoFadeIn .35s ease;
    }

    @keyframes demoFadeIn{
      from{opacity:0;transform:translateY(8px)}
      to{opacity:1;transform:translateY(0)}
    }

    .demo-step-panel h2{
      font-size:clamp(22px,2.4vw,28px);
      line-height:1.25;
      color:var(--navy);
      margin-bottom:10px;
      letter-spacing:-.02em;
    }

    .demo-step-lead{
      font-size:15px;
      line-height:1.65;
      color:var(--muted);
      margin-bottom:24px;
    }

    .demo-input-stack{
      display:grid;
      gap:16px;
      margin-bottom:22px;
    }

    .demo-input-field input{
      width:100%;
      border:1px solid #d8e4f2;
      border-radius:16px;
      padding:16px 18px;
      font:inherit;
      font-size:16px;
      color:var(--text);
      background:#f7faff;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .demo-input-field input::placeholder{
      color:#8ca0b8;
    }

    .demo-input-field input:focus{
      outline:none;
      border-color:var(--primary);
      background:var(--white);
      box-shadow:0 0 0 4px rgba(11,108,255,.1);
    }

    .demo-input-field input.is-invalid{
      border-color:#f59e0b;
      background:#fffaf0;
    }

    .demo-field-msg{
      display:none;
      margin-top:8px;
      padding:10px 12px;
      border-radius:10px;
      background:#fff7ed;
      border:1px solid #fed7aa;
      color:#9a3412;
      font-size:13px;
      line-height:1.5;
    }

    .demo-field-msg.is-visible{
      display:block;
    }

    .demo-phone-input{
      display:flex;
      align-items:center;
      gap:10px;
      border:1px solid #d8e4f2;
      border-radius:16px;
      padding:0 16px;
      background:#f7faff;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .demo-phone-input:focus-within{
      border-color:var(--primary);
      background:var(--white);
      box-shadow:0 0 0 4px rgba(11,108,255,.1);
    }

    .demo-phone-input.is-invalid-wrap{
      border-color:#f59e0b;
      background:#fffaf0;
    }

    .demo-phone-flag{
      font-size:20px;
      line-height:1;
      flex-shrink:0;
    }

    .demo-phone-input input{
      border:none;
      background:transparent;
      padding:16px 0;
      box-shadow:none;
    }

    .demo-phone-input input:focus{
      box-shadow:none;
    }

    .demo-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      border:none;
      border-radius:16px;
      padding:15px 22px;
      font:inherit;
      font-size:14px;
      font-weight:800;
      letter-spacing:.04em;
      text-transform:uppercase;
      cursor:pointer;
      transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .demo-btn-primary{
      background:var(--primary);
      color:var(--white);
      box-shadow:0 14px 30px rgba(11,108,255,.28);
    }

    .demo-btn-primary:hover{
      background:var(--primary-dark);
      transform:translateY(-1px);
    }

    .demo-btn-ghost{
      background:#eef3fa;
      color:var(--text);
    }

    .demo-btn-ghost:hover{
      background:#e3ebf6;
    }

    .demo-btn-full{
      width:100%;
    }

    .demo-btn-row{
      display:grid;
      grid-template-columns:1fr 1.4fr;
      gap:12px;
    }

    .demo-btn-row-single .demo-btn-submit{
      width:100%;
    }

    .demo-legal-note{
      margin-top:22px;
      text-align:center;
      font-size:13px;
      line-height:1.7;
      color:var(--muted);
    }

    .demo-legal-note a{
      color:var(--primary);
      font-weight:700;
      text-decoration:underline;
      text-underline-offset:3px;
    }

    .demo-server-error{
      display:flex;
      align-items:center;
      gap:10px;
      margin-bottom:16px;
      padding:14px 16px;
      border-radius:14px;
      background:#fef2f2;
      border:1px solid #fecaca;
      color:#b91c1c;
      font-size:14px;
    }

    .demo-wizard-success{
      text-align:center;
      padding:48px 34px;
      background:linear-gradient(180deg,#f0fdf4 0%,#ffffff 55%);
      border:1px solid #bbf7d0;
      border-radius:22px;
    }

    .demo-success-icon{
      font-size:48px;
      color:#16a34a;
      margin-bottom:16px;
    }

    .demo-wizard-success h2{
      font-size:28px;
      color:#15803d;
      margin-bottom:12px;
    }

    .demo-wizard-success p{
      color:#166534;
      font-weight:600;
      line-height:1.7;
      margin-bottom:24px;
    }

    @media (max-width:992px){
      .demo-split-grid{
        grid-template-columns:1fr;
        gap:28px;
      }

      .demo-wizard-wrap{
        order:-1;
      }

      .demo-split-copy{
        text-align:center;
        order:1;
      }

      .demo-split-copy h2,
      .demo-split-copy p{
        max-width:none;
        margin-left:auto;
        margin-right:auto;
      }

      .demo-split-copy h2{
        font-size:clamp(26px,6vw,36px);
        margin-bottom:12px;
      }

      .demo-split-copy p{
        font-size:15px;
        line-height:1.6;
      }
    }

    @media (max-width:768px){
      .demo-split-section{
        padding:28px 0 48px;
      }

      .demo-wizard-card{
        padding:24px 18px 20px;
        border-radius:22px;
      }

      .demo-btn-row{
        grid-template-columns:1fr;
      }

      /* Demo sayfasında hero'yu sıkıştır — form üstte kalsın */
      body.demo-page .page-hero{
        padding:96px 0 48px;
      }

      body.demo-page .page-hero h1{
        font-size:clamp(28px,8vw,36px);
        margin-bottom:10px;
      }

      body.demo-page .page-hero-lead{
        font-size:15px;
        line-height:1.55;
        margin-bottom:0;
      }

      body.demo-page .page-hero-wave{
        height:36px;
      }
    }

    /* FIYATLAR */
    .pricing-section{
      padding:60px 0 80px;
      background:#f3f8ff;
    }

    .pricing-toolbar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      flex-wrap:wrap;
      background:#fff;
      border:1px solid var(--border);
      border-radius:22px;
      padding:20px 24px;
      margin-bottom:28px;
      box-shadow:var(--shadow);
    }

    .pricing-toolbar-label{
      display:block;
      font-size:14px;
      font-weight:700;
      color:var(--navy);
      margin-bottom:10px;
    }

    .pricing-stepper{
      display:inline-flex;
      align-items:center;
      gap:0;
      border:1px solid var(--border);
      border-radius:16px;
      overflow:hidden;
      background:#f7faff;
    }

    .pricing-step-btn{
      width:44px;
      height:44px;
      border:none;
      background:#fff;
      color:var(--navy);
      font-size:22px;
      font-weight:700;
      cursor:pointer;
      transition:background .2s ease;
    }

    .pricing-step-btn:hover{
      background:#eef5ff;
    }

    .pricing-stepper input{
      width:72px;
      border:none;
      border-left:1px solid var(--border);
      border-right:1px solid var(--border);
      text-align:center;
      font:inherit;
      font-size:16px;
      font-weight:800;
      color:var(--navy);
      background:#fff;
      padding:10px 0;
      -moz-appearance:textfield;
    }

    .pricing-stepper input::-webkit-outer-spin-button,
    .pricing-stepper input::-webkit-inner-spin-button{
      -webkit-appearance:none;
      margin:0;
    }

    .pricing-billing{
      display:inline-flex;
      gap:8px;
      background:#f7faff;
      border:1px solid var(--border);
      border-radius:16px;
      padding:6px;
    }

    .pricing-bill-btn{
      border:none;
      background:transparent;
      color:var(--navy);
      font:inherit;
      font-size:14px;
      font-weight:800;
      padding:12px 22px;
      border-radius:12px;
      cursor:pointer;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      text-align:center;
      gap:3px;
      min-width:118px;
      min-height:54px;
      line-height:1.25;
      transition:.2s ease;
    }

    .pricing-bill-btn small{
      font-size:11px;
      font-weight:700;
      color:#e11d48;
      text-align:center;
      line-height:1.3;
    }

    .pricing-bill-btn.is-active{
      background:var(--primary);
      color:#fff;
      box-shadow:0 8px 20px rgba(11,108,255,.24);
    }

    .pricing-bill-btn.is-active small{
      color:#fecdd3;
    }

    .pricing-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:22px;
      align-items:stretch;
    }

    .pricing-card-single{
      width:100%;
      margin-bottom:34px;
      padding:32px 34px 28px;
    }

    .pricing-single-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:28px;
      flex-wrap:wrap;
      margin-bottom:24px;
    }

    .pricing-single-copy{
      flex:1;
      min-width:240px;
    }

    .pricing-single-lead{
      margin-top:10px;
      font-size:16px;
      line-height:1.7;
      color:rgba(255,255,255,.82);
      max-width:48ch;
    }

    .pricing-card-single .pricing-price-wrap{
      text-align:right;
      margin-bottom:0;
    }

    .pricing-card-single .pricing-price{
      justify-content:flex-end;
    }

    .pricing-card-single .pricing-cta{
      width:100%;
    }

    .pricing-features-block{
      margin-top:8px;
    }

    .pricing-features-block .section-title{
      text-align:center;
      margin-bottom:28px;
    }

    .pricing-features-block .section-title h2{
      color:var(--navy);
      font-size:clamp(28px,3vw,36px);
      margin-bottom:10px;
    }

    .pricing-features-block .section-title p{
      color:var(--muted);
      font-size:16px;
    }

    .pricing-features-grid{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:20px;
    }

    .pricing-feature-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:22px;
      padding:24px 22px;
      box-shadow:0 14px 40px rgba(6,71,184,.08);
    }

    .pricing-feature-icon{
      width:52px;
      height:52px;
      border-radius:16px;
      display:grid;
      place-items:center;
      background:var(--primary-soft);
      color:var(--primary);
      font-size:22px;
      margin-bottom:16px;
    }

    .pricing-feature-card h3{
      font-size:18px;
      color:var(--navy);
      margin-bottom:10px;
    }

    .pricing-feature-card p{
      font-size:14px;
      line-height:1.65;
      color:var(--muted);
      margin-bottom:14px;
    }

    .pricing-feature-tags{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }

    .pricing-feature-tags span{
      font-size:12px;
      font-weight:700;
      color:var(--primary-dark);
      background:#eef5ff;
      border-radius:999px;
      padding:6px 10px;
    }

    .pricing-card{
      position:relative;
      background:#fff;
      border:1px solid var(--border);
      border-radius:26px;
      padding:28px 24px 24px;
      box-shadow:var(--shadow);
      display:flex;
      flex-direction:column;
    }

    .pricing-card.is-featured{
      background:linear-gradient(180deg,#061b3a 0%,#0647b8 58%,#0b6cff 100%);
      border-color:transparent;
      color:#fff;
      box-shadow:0 30px 70px rgba(6,71,184,.28);
    }

    .pricing-card-single.is-featured{
      transform:none;
    }

    .pricing-ribbon{
      position:absolute;
      top:18px;
      right:18px;
      width:42px;
      height:42px;
      border-radius:14px;
      background:rgba(255,255,255,.16);
      display:grid;
      place-items:center;
      color:#fde047;
      font-size:18px;
    }

    .pricing-card h2{
      font-size:24px;
      line-height:1.2;
      color:var(--navy);
      margin-bottom:18px;
      padding-right:48px;
    }

    .pricing-card.is-featured h2{
      color:#fff;
    }

    .pricing-price-wrap{
      margin-bottom:18px;
    }

    .pricing-price{
      display:flex;
      align-items:flex-end;
      gap:4px;
      margin-bottom:8px;
    }

    .pricing-currency{
      font-size:22px;
      font-weight:800;
      line-height:1;
      color:var(--primary);
    }

    .pricing-card.is-featured .pricing-currency,
    .pricing-card.is-featured .pricing-amount,
    .pricing-card.is-featured .pricing-period{
      color:#fff;
    }

    .pricing-amount{
      font-size:42px;
      font-weight:900;
      line-height:1;
      letter-spacing:-.03em;
      color:var(--navy);
    }

    .pricing-period{
      font-size:16px;
      font-weight:700;
      color:var(--muted);
      margin-bottom:4px;
    }

    .pricing-subline{
      font-size:14px;
      color:var(--muted);
      margin-bottom:8px;
    }

    .pricing-card.is-featured .pricing-subline{
      color:rgba(255,255,255,.78);
    }

    .pricing-addon{
      display:flex;
      align-items:center;
      gap:10px;
      padding:12px 14px;
      border-radius:14px;
      background:#eef5ff;
      color:var(--primary-dark);
      font-size:13px;
      font-weight:700;
      margin-bottom:16px;
    }

    .pricing-card.is-featured .pricing-addon{
      background:rgba(255,255,255,.12);
      color:#fff;
    }

    .pricing-features{
      list-style:none;
      display:grid;
      gap:14px;
      margin-bottom:22px;
      flex:1;
    }

    .pricing-feature-lead{
      display:flex;
      align-items:flex-start;
      gap:10px;
      font-size:14px;
      font-weight:700;
      color:var(--navy);
    }

    .pricing-card.is-featured .pricing-feature-lead,
    .pricing-card.is-featured .pricing-feature-group,
    .pricing-card.is-featured .pricing-feature-group li{
      color:rgba(255,255,255,.92);
    }

    .pricing-feature-lead i{
      color:var(--primary);
      margin-top:2px;
    }

    .pricing-card.is-featured .pricing-feature-lead i{
      color:#fde047;
    }

    .pricing-feature-group strong{
      display:block;
      font-size:14px;
      color:var(--navy);
      margin-bottom:8px;
    }

    .pricing-feature-group ul{
      list-style:none;
      display:grid;
      gap:6px;
    }

    .pricing-feature-group li{
      position:relative;
      padding-left:16px;
      font-size:13px;
      line-height:1.55;
      color:var(--text);
    }

    .pricing-feature-group li::before{
      content:"";
      position:absolute;
      left:0;
      top:.62em;
      width:6px;
      height:6px;
      border-radius:50%;
      background:var(--primary);
    }

    .pricing-card.is-featured .pricing-feature-group li::before{
      background:#fde047;
    }

    .pricing-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:100%;
      padding:15px 18px;
      border-radius:16px;
      font-size:14px;
      font-weight:800;
      letter-spacing:.03em;
      text-transform:uppercase;
      border:1px solid var(--border);
      background:#fff;
      color:var(--primary);
      transition:transform .2s ease, box-shadow .2s ease;
    }

    .pricing-cta:hover{
      transform:translateY(-1px);
      box-shadow:0 12px 28px rgba(6,71,184,.14);
    }

    .pricing-cta.primary{
      background:#fff;
      color:var(--primary-dark);
      border-color:transparent;
    }

    .pricing-card:not(.is-featured) .pricing-cta{
      background:var(--primary-soft);
      border-color:transparent;
    }

    /* Teklif (quote) mode */
    .pricing-price[hidden],
    .pricing-cta[hidden],
    .pricing-quote-label[hidden],
    .pricing-quote[hidden]{
      display:none !important;
    }

    .pricing-quote-label{
      display:inline-flex;
      align-items:center;
      gap:10px;
      font-size:26px;
      font-weight:900;
      letter-spacing:-.02em;
      color:#fff;
      margin-bottom:8px;
    }

    .pricing-quote-label i{
      font-size:22px;
      color:#fde047;
    }

    .pricing-quote{
      margin-top:28px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:24px;
      padding:40px;
      box-shadow:0 24px 60px rgba(10,42,96,.08);
    }

    .pricing-quote-head{
      max-width:640px;
      margin-bottom:28px;
    }

    .pricing-quote-badge{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 14px;
      border-radius:999px;
      background:var(--primary-soft);
      color:var(--primary-dark);
      font-size:13px;
      font-weight:700;
      margin-bottom:14px;
    }

    .pricing-quote-head h2{
      font-size:26px;
      font-weight:900;
      letter-spacing:-.02em;
      color:var(--navy);
      margin-bottom:10px;
    }

    .pricing-quote-head p{
      font-size:15px;
      line-height:1.7;
      color:var(--muted);
    }

    .pricing-quote-alert{
      display:flex;
      align-items:center;
      gap:10px;
      padding:14px 16px;
      border-radius:14px;
      font-size:14px;
      font-weight:600;
      margin-bottom:22px;
    }

    .pricing-quote-alert.is-success{
      background:#ecfdf3;
      color:#15803d;
      border:1px solid #bbf7d0;
    }

    .pricing-quote-alert.is-error{
      background:#fef2f2;
      color:#b91c1c;
      border:1px solid #fecaca;
    }

    .pricing-quote-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:18px 20px;
      margin-bottom:24px;
    }

    .pricing-quote-field{
      display:flex;
      flex-direction:column;
      gap:8px;
    }

    .pricing-quote-field-full{
      grid-column:1 / -1;
    }

    .pricing-quote-field span{
      font-size:13px;
      font-weight:700;
      color:var(--navy);
    }

    .pricing-quote-field input,
    .pricing-quote-field textarea{
      width:100%;
      padding:13px 15px;
      border-radius:14px;
      border:1px solid var(--border);
      background:#f8fafc;
      font-family:inherit;
      font-size:14px;
      color:var(--navy);
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .pricing-quote-field textarea{
      resize:vertical;
      min-height:110px;
    }

    .pricing-quote-field input:focus,
    .pricing-quote-field textarea:focus{
      outline:none;
      background:#fff;
      border-color:var(--primary);
      box-shadow:0 0 0 4px rgba(11,108,255,.12);
    }

    .pricing-cta.primary.pricing-quote-submit{
      width:auto;
      min-width:220px;
      background:var(--gradient-blue);
      color:#fff;
      border:none;
      cursor:pointer;
      box-shadow:0 14px 30px rgba(11,95,212,.28);
    }

    .pricing-cta.primary.pricing-quote-submit:hover{
      transform:translateY(-2px);
      box-shadow:0 18px 38px rgba(11,95,212,.36);
    }

    @media (max-width:1100px){
      .pricing-features-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }

      .pricing-grid{
        grid-template-columns:1fr;
        max-width:560px;
        margin:0 auto;
      }

      .pricing-card.is-featured{
        transform:none;
      }
    }

    @media (max-width:768px){
      .pricing-section{
        padding:48px 0 60px;
      }

      .pricing-toolbar{
        flex-direction:column;
        align-items:stretch;
      }

      .pricing-billing{
        width:100%;
      }

      .pricing-bill-btn{
        flex:1;
      }

      .pricing-single-head{
        flex-direction:column;
        align-items:flex-start;
      }

      .pricing-card-single .pricing-price-wrap{
        text-align:left;
        width:100%;
      }

      .pricing-card-single .pricing-price{
        justify-content:flex-start;
      }

      .pricing-features-grid{
        grid-template-columns:1fr;
      }

      .pricing-quote{
        padding:26px 20px;
      }

      .pricing-quote-grid{
        grid-template-columns:1fr;
      }

      .pricing-cta.primary.pricing-quote-submit{
        width:100%;
      }
    }

    /* SSS page */
    .sss-page-section{
      padding-top:40px;
      padding-bottom:90px;
    }

    .sss-empty{
      max-width:560px;
      margin:0 auto;
      text-align:center;
      padding:48px 24px;
      background:#fff;
      border-radius:18px;
      box-shadow:0 12px 30px rgba(6,71,184,.08);
      color:var(--text-muted);
    }

    .sss-empty i{
      font-size:42px;
      color:var(--primary);
      margin-bottom:14px;
    }

    .sss-empty h2{
      margin:0 0 8px;
      color:var(--navy);
      font-size:24px;
    }

    .sss-empty p{
      margin:0;
      line-height:1.6;
    }

    .sss-home-more{
      margin-top:28px;
      text-align:center;
    }

    .sss-home-more .hero-btn{
      display:inline-flex;
      align-items:center;
      gap:8px;
    }

    /* Blog page */
    .blog-page-section{
      padding:56px 0 90px;
      background:#f7faff;
    }

    .blog-page-grid{
      margin-bottom:36px;
    }

    .blog-empty{
      max-width:560px;
      margin:0 auto;
      text-align:center;
      padding:48px 24px;
      background:#fff;
      border-radius:22px;
      box-shadow:0 12px 30px rgba(6,71,184,.08);
      color:var(--text-muted);
    }

    .blog-empty i{
      font-size:42px;
      color:var(--primary);
      margin-bottom:14px;
    }

    .blog-empty h2{
      margin:0 0 8px;
      color:var(--navy);
      font-size:24px;
    }

    .blog-empty p{
      margin:0;
      line-height:1.6;
    }

    .site-pagination{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
      padding:18px 20px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:16px;
      box-shadow:0 10px 24px rgba(6,71,184,.06);
    }

    .site-pagination-info{
      font-size:14px;
      color:var(--text-muted);
    }

    .site-pagination-info strong{
      color:var(--navy);
    }

    .site-pagination-pages{
      display:flex;
      align-items:center;
      gap:8px;
      flex-wrap:wrap;
    }

    .site-pagination-btn{
      min-width:40px;
      height:40px;
      padding:0 12px;
      border-radius:12px;
      border:1px solid var(--border);
      background:#fff;
      color:var(--navy);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-weight:700;
      font-size:14px;
      transition:.2s ease;
    }

    .site-pagination-btn:hover{
      border-color:var(--primary);
      color:var(--primary);
    }

    .site-pagination-btn.is-active{
      background:var(--primary);
      border-color:var(--primary);
      color:#fff;
      box-shadow:0 8px 20px rgba(11,108,255,.22);
    }

    .site-pagination-btn.is-disabled{
      opacity:.4;
      pointer-events:none;
    }

    .page-hero-compact .page-hero-inner{
      padding-bottom:36px;
    }

    .blog-article-meta{
      display:flex;
      align-items:center;
      gap:12px;
      flex-wrap:wrap;
      margin-bottom:14px;
    }

    .blog-article-meta .blog-tag{
      position:static;
      display:inline-flex;
    }

    .blog-article-meta .blog-date{
      color:rgba(255,255,255,.88);
      font-weight:700;
    }

    .blog-article-section{
      padding:48px 0 90px;
      background:#f7faff;
    }

    .blog-article{
      max-width:1180px;
      margin:0 auto;
      background:#fff;
      border-radius:24px;
      overflow:hidden;
      border:1px solid var(--border);
      box-shadow:0 16px 40px rgba(6,71,184,.08);
    }

    .blog-article-cover{
      height:360px;
      overflow:hidden;
      background:var(--primary-soft);
    }

    .blog-article-cover img{
      width:100%;
      height:100%;
      object-fit:cover;
    }

    .blog-article-content{
      padding:34px 36px;
      color:var(--text);
      font-size:17px;
      line-height:1.85;
    }

    .blog-article-footer{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
      padding:0 36px 34px;
    }

      @media (max-width: 768px){
      .blog-article-cover{ height:240px; }
      .blog-article-content{ padding:24px 20px; font-size:16px; }
      .blog-article-footer{ padding:0 20px 24px; }
      .site-pagination{ justify-content:center; }
    }

    /* Iletisim */
    .iletisim-section{
      padding:56px 0 90px;
      background:#f7faff;
    }

    .iletisim-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:22px;
      margin-bottom:28px;
    }

    .iletisim-card{
      background:#fff;
      border:1px solid var(--border);
      border-radius:22px;
      padding:28px 24px;
      box-shadow:0 12px 30px rgba(6,71,184,.08);
      display:flex;
      flex-direction:column;
      gap:10px;
      min-height:100%;
    }

    .iletisim-card-icon{
      width:52px;
      height:52px;
      border-radius:16px;
      display:grid;
      place-items:center;
      background:var(--primary-soft);
      color:var(--primary);
      font-size:20px;
    }

    .iletisim-card h2{
      margin:0;
      font-size:22px;
      color:var(--navy);
    }

    .iletisim-card p{
      margin:0;
      color:var(--text-muted);
      line-height:1.6;
      font-size:15px;
    }

    .iletisim-card a,
    .iletisim-card span{
      color:var(--navy);
      font-weight:700;
      line-height:1.6;
      font-size:15px;
    }

    .iletisim-card a:hover{
      color:var(--primary);
    }

    .iletisim-map-link{
      display:inline-flex;
      align-items:center;
      gap:6px;
      margin-top:4px;
      font-size:14px !important;
      color:var(--primary) !important;
    }

    .iletisim-social{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
      margin-bottom:28px;
      padding:18px 22px;
      background:#fff;
      border:1px solid var(--border);
      border-radius:18px;
    }

    .iletisim-social > span{
      font-weight:800;
      color:var(--navy);
    }

    .iletisim-social-links{
      display:flex;
      align-items:center;
      gap:10px;
    }

    .iletisim-social-links a{
      width:42px;
      height:42px;
      border-radius:12px;
      display:grid;
      place-items:center;
      background:var(--primary-soft);
      color:var(--primary);
      transition:.2s ease;
    }

    .iletisim-social-links a:hover{
      background:var(--primary);
      color:#fff;
    }

    .iletisim-map-wrap{
      background:#fff;
      border:1px solid var(--border);
      border-radius:24px;
      overflow:hidden;
      box-shadow:0 16px 40px rgba(6,71,184,.08);
    }

    .iletisim-map-head{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      padding:20px 24px;
      border-bottom:1px solid var(--border);
    }

    .iletisim-map-head h2{
      margin:0;
      font-size:22px;
      color:var(--navy);
    }

    .iletisim-map-head a{
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-weight:700;
      color:var(--primary);
      font-size:14px;
    }

    .iletisim-map{
      height:min(520px,70vh);
      background:#e8eef8;
    }

    .iletisim-map iframe{
      display:block;
      width:100%;
      height:100%;
    }

    @media (max-width: 992px){
      .iletisim-grid{ grid-template-columns:1fr; }
    }