 :root {
      --primary: #130e3f;
      --primary-dark: #5125ad;
      --secondary: #ff8a34;
      --background: #f8f7fb;
      --surface: #ffffff;
      --text: #19171f;
      --muted: #716e79;
      --border: #e7e4ed;
      --success: #1b7c43;
      --container: 1180px;
      --radius-large: 30px;
      --radius-medium: 20px;
      --shadow: 0 20px 55px rgba(45, 32, 73, 0.1);
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
      background: var(--background);
      color: var(--text);
      line-height: 1.65;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    .container {
      width: min(calc(100% - 40px), var(--container));
      margin: 0 auto;
    }

    .header {
      position: sticky;
      top: 0;
      z-index: 100;
      background: rgba(255, 255, 255, 0.94);
      border-bottom: 1px solid var(--border);
      backdrop-filter: blur(16px);
    }

    .navbar {
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
    }

    .logo {
      display: flex;
      align-items: center;
      gap: 11px;
      font-size: 23px;
      font-weight: 800;
    }

    .logo-mark {
      width: 43px;
      height: 43px;
      display: grid;
      place-items: center;
      border-radius: 13px;
      background: var(--primary);
      color: #ffffff;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 27px;
      color: var(--muted);
      font-size: 17px;
      font-weight: 600;
    }

    .nav-links a:hover {
      color: var(--primary);
    }

    .support-button {
      padding: 11px 20px;
      border-radius: 999px;
      background: var(--primary);
      color: #ffffff !important;
    }

    .hero {
      padding: 60px 0 85px;
      background:
        radial-gradient(
          circle at 80% 20%,
          rgba(108, 58, 209, 0.15),
          transparent 32%
        );
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.05fr 0.95fr;
      align-items: center;
      gap: 70px;
    }

    .badge {
      display: inline-flex;
      align-items: center;
      padding: 8px 14px;
      border-radius: 999px;
      background: #eee8ff;
      color: var(--primary);
      font-size: 13px;
      font-weight: 700;
    }

    .hero h1 {
      max-width: 680px;
      margin-top: 22px;
      font-size: clamp(43px, 6vw, 72px);
      line-height: 1.05;
      letter-spacing: -0.045em;
    }

    .hero h1 span {
      color: var(--primary);
    }

    .hero-description {
      max-width: 620px;
      margin-top: 24px;
      color: var(--muted);
      font-size: 18px;
    }

    .hero-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      margin-top: 34px;
    }

    .button {
      min-height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 14px 24px;
      border-radius: 999px;
      font-weight: 700;
    }

    .button-primary {
      background: var(--primary);
      color: #ffffff;
      box-shadow: 0 14px 30px rgba(108, 58, 209, 0.25);
    }

    .button-secondary {
      border: 1px solid var(--border);
      background: var(--surface);
    }

    .app-preview {
      position: relative;
      /* min-height: 530px; */
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .preview-background {
      position: absolute;
      width: 450px;
      height: 450px;
      border-radius: 50%;
      background: linear-gradient(145deg, #e6dcff, #fff0e6);
    }

    .phone {
      position: relative;
      width: 275px;
      padding: 9px;
      border: 7px solid #18151f;
      border-radius: 46px;
      background: #18151f;
      box-shadow: 0 35px 70px rgba(30, 24, 48, 0.24);
    }

    .phone-screen {
      min-height: 520px;
      overflow: hidden;
      border-radius: 33px;
      background: #ffffff;
    }

    .phone-header {
      padding: 28px 20px 20px;
      background: var(--primary);
      color: #ffffff;
    }

    .phone-header small {
      opacity: 0.8;
    }

    .phone-header h3 {
      margin-top: 4px;
      font-size: 22px;
    }

    .search-box {
      margin: 18px;
      padding: 13px;
      border-radius: 12px;
      background: #f2f1f5;
      color: #98959f;
      font-size: 12px;
    }

    .category-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      padding: 0 18px;
    }

    .category {
      padding: 12px 5px;
      border-radius: 12px;
      background: #f5f2fc;
      color: var(--primary);
      text-align: center;
      font-size: 11px;
      font-weight: 700;
    }

    .product-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      padding: 20px 18px;
    }

    .product {
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 13px;
    }

    .product-image {
      height: 80px;
      border-radius: 9px;
      background: linear-gradient(145deg, #eee9fa, #ffe9da);
    }

    .product-line {
      height: 7px;
      margin-top: 9px;
      border-radius: 10px;
      background: #ddd9e5;
    }

    .product-line.short {
      width: 60%;
      background: #c4b2ed;
    }

    .section {
      padding: 90px 0;
    }

    .section-white {
      background: #ffffff;
    }

    .section-heading {
      max-width: 720px;
      margin: 0 auto 52px;
      text-align: center;
    }

    .section-heading h2 {
      font-size: clamp(34px, 5vw, 50px);
      line-height: 1.15;
      letter-spacing: -0.035em;
    }

    .section-heading p {
      margin-top: 14px;
      color: var(--muted);
      font-size: 17px;
    }

    .feature-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }

    .feature-card {
      padding: 30px;
      border: 1px solid var(--border);
      border-radius: var(--radius-medium);
      background: var(--surface);
    }

    .feature-icon {
      width: 50px;
      height: 50px;
      display: grid;
      place-items: center;
      margin-bottom: 20px;
      border-radius: 15px;
      background: #f0eaff;
      color: var(--primary);
      font-size: 22px;
    }

    .feature-card h3 {
      margin-bottom: 9px;
      font-size: 19px;
    }

    .feature-card p {
      color: var(--muted);
      font-size: 14px;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      align-items: center;
      gap: 65px;
    }

    .about-visual {
      min-height: 430px;
      display: grid;
      place-items: center;
      border-radius: var(--radius-large);
      background: linear-gradient(145deg, #e9e1ff, #fff0e7);
      color: var(--primary);
      font-size: 90px;
      font-weight: 800;
    }

    .about-content h2 {
      font-size: clamp(34px, 5vw, 48px);
      line-height: 1.15;
      letter-spacing: -0.035em;
    }

    .about-content p {
      margin-top: 18px;
      color: var(--muted);
    }

    .company-details {
      margin-top: 25px;
      padding: 22px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: #ffffff;
    }

    .company-details p {
      margin-top: 6px;
      color: var(--text);
      font-size: 14px;
    }

    .support-grid {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 35px;
    }

    .support-card,
    .contact-form {
      padding: 34px;
      border: 1px solid var(--border);
      border-radius: var(--radius-medium);
      background: #ffffff;
    }

    .support-card h3,
    .contact-form h3 {
      margin-bottom: 18px;
      font-size: 24px;
    }

    .support-item {
      margin-top: 18px;
    }

    .support-item strong {
      display: block;
      font-size: 14px;
    }

    .support-item a,
    .support-item span {
      color: var(--muted);
      font-size: 14px;
    }

    .form-field {
      margin-bottom: 15px;
    }

    .form-field label {
      display: block;
      margin-bottom: 7px;
      font-size: 13px;
      font-weight: 700;
    }

    .form-field input,
    .form-field textarea {
      width: 100%;
      padding: 13px 14px;
      border: 1px solid var(--border);
      border-radius: 11px;
      outline: none;
    }

    .form-field textarea {
      min-height: 125px;
      resize: vertical;
    }

    .form-field input:focus,
    .form-field textarea:focus {
      border-color: var(--primary);
    }

    .submit-button {
      width: 100%;
      min-height: 49px;
      border: 0;
      border-radius: 11px;
      background: var(--primary);
      color: #ffffff;
      cursor: pointer;
      font-weight: 700;
    }

    .legal-links {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }

    .legal-card {
      padding: 28px;
      border: 1px solid var(--border);
      border-radius: var(--radius-medium);
      background: #ffffff;
    }

    .legal-card h3 {
      margin-bottom: 10px;
    }

    .legal-card p {
      margin-bottom: 18px;
      color: var(--muted);
      font-size: 14px;
    }

    .legal-card a {
      color: var(--primary);
      font-weight: 700;
    }

    .footer {
      padding: 55px 0 25px;
      background: #130e3f;
      color: #ffffff;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.5fr 1fr 1fr 1fr;
      gap: 40px;
    }

    .footer-description {
      max-width: 360px;
      margin-top: 16px;
      color: #aaa6b2;
      font-size: 14px;
    }

    .footer-column h4 {
      margin-bottom: 16px;
    }

    .footer-column a {
      display: block;
      margin-top: 10px;
      color: #aaa6b2;
      font-size: 14px;
    }

    .footer-column a:hover {
      color: #ffffff;
    }

    .copyright {
      margin-top: 45px;
      padding-top: 22px;
      border-top: 1px solid #302c37;
      color: #8f8b97;
      text-align: center;
      font-size: 13px;
    }

    @media (max-width: 900px) {
      .hero-grid,
      .about-grid,
      .support-grid {
        grid-template-columns: 1fr;
      }

      .hero-content,
      .about-content {
        text-align: center;
      }

      .hero-buttons {
        justify-content: center;
      }

      .feature-grid,
      .legal-links {
        grid-template-columns: repeat(2, 1fr);
      }

      .footer-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 650px) {
      /* .nav-links a:not(.support-button) {
        display: none;
      } */

      .hero {
        padding-top: 65px;
      }

      .hero h1 {
        font-size: 42px;
      }

      .app-preview {
        /* min-height: 500px; */
      }

      .preview-background {
        width: 350px;
        height: 350px;
      }

      .phone {
        width: 245px;
      }

      .phone-screen {
        min-height: 465px;
      }

      .feature-grid,
      .legal-links,
      .footer-grid {
        grid-template-columns: 1fr;
      }

      .section {
        padding: 70px 0;
      }
    }
    /*========== HEADER ==========*/

.header{

/* position:fixed; */
top:0;
left:0;
width:100%;
z-index:1000;

background:rgba(255,255,255,.9);

backdrop-filter:blur(15px);

box-shadow:0 5px 20px rgba(0,0,0,.08);

}

.navbar{

display:flex;

justify-content:space-between;

align-items:center;


}

.logo img{

width:100px;

display:block;

}

.nav-links{

display:flex;

gap:35px;

}

.nav-links a{

text-decoration:none;

font-size:16px;

font-weight:600;

color:#333;

transition:.3s;

position:relative;

}

.nav-links a:hover{

color:#130e3f;

}

.nav-links a::after{

content:"";

position:absolute;

left:0;

bottom:-8px;

width:0;

height:3px;

background:#130e3f;

transition:.3s;

border-radius:20px;

}

.nav-links a:hover::after{

width:100%;

}

.nav-buttons{

display:flex;

gap:15px;

align-items:center;

}

.login-btn{

padding:11px 22px;

border:2px solid #130e3f;

border-radius:30px;

text-decoration:none;

color:#130e3f;

font-weight:600;

transition:.3s;

}

.login-btn:hover{

background:#130e3f;

color:#fff;

}

.download-btn{

padding:12px 24px;

background:#130e3f;

border-radius:30px;

text-decoration:none;

color:#fff;

font-weight:600;

transition:.3s;

box-shadow:0 8px 25px rgba(108,60,244,.35);

}

.download-btn:hover{

transform:translateY(-3px);

background:#5430d9;

}

.menu-btn{

display:none;

font-size:30px;

cursor:pointer;

}

@media(max-width:991px){

.nav-links{

display:none;

}

.nav-buttons{

display:none;

}

.menu-btn{

display:block;

}

.logo img{

width:80px;

}

}
.menu-btn{
    display:none;
    font-size:28px;
    cursor:pointer;
}

@media (max-width:991px){

    .menu-btn{
        display:block;
    }

    .nav-links{
        position:absolute;
        top:80px;
        left:0;
        width:100%;
        background:#fff;
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:20px;
        padding:25px 0;
        box-shadow:0 10px 20px rgba(0,0,0,.1);

        display:none;
    }

    .nav-links.active{
        display:flex;
    }

    .nav-buttons{
        display:none;
    }

}
.features-section{

padding:100px 0;
background:#f8faff;

}

.section-title{

text-align:center;
max-width:750px;
margin:auto auto 60px;

}

.tag{

display:inline-block;
background:#ece8ff;
color:#130e3f;
padding:8px 20px;
border-radius:30px;
font-weight:600;
margin-bottom:18px;

}

.section-title h2{

font-size:42px;
margin-bottom:20px;
color:#222;

}

.section-title p{

font-size:18px;
line-height:30px;
color:#666;

}

.features-grid{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;

}

.feature-card{

background:#fff;
padding:40px 30px;
border-radius:20px;
text-align:center;
transition:.35s;
box-shadow:0 10px 30px rgba(0,0,0,.05);

}

.feature-card:hover{

transform:translateY(-10px);
box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.icon{

width:75px;
height:75px;
margin:auto;
border-radius:20px;
display:flex;
align-items:center;
justify-content:center;
font-size:28px;
color:#fff;
margin-bottom:25px;

}

.blue{background:#3B82F6;}
.green{background:#10B981;}
.orange{background:#F59E0B;}
.pink{background:#EC4899;}
.purple{background:#7C3AED;}
.red{background:#EF4444;}

.feature-card h3{

margin-bottom:15px;
font-size:22px;

}

.feature-card p{

line-height:28px;
color:#666;

}

@media(max-width:992px){

.features-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.features-grid{

grid-template-columns:1fr;

}

.section-title h2{

font-size:32px;

}

}
.about-company{

padding:120px 0;

background:linear-gradient(180deg,#ffffff,#f5f7ff);

overflow:hidden;

}

.about-company .container{

display:grid;

grid-template-columns:1fr 1fr;

align-items:center;

gap:80px;

}

.section-label{

display:inline-block;

padding:8px 18px;

background:#ede9fe;

color:#130e3f;

border-radius:30px;

font-weight:600;

margin-bottom:25px;

}

.about-left h2{

font-size:52px;

line-height:1.2;

margin-bottom:25px;

}

.about-left h2 span{

color:#130e3f;

}

.about-left p{

font-size:18px;

line-height:34px;

color:#666;

margin-bottom:35px;

}

.about-list{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin-bottom:40px;

}

.about-list div{

display:flex;

align-items:center;

gap:10px;

font-weight:600;

}

.about-list i{

color:#10b981;

}

.about-btn{

display:inline-block;

padding:16px 36px;

background:#130e3f;

color:#fff;

border-radius:40px;

text-decoration:none;

font-weight:600;

transition:.3s;

}

.about-btn:hover{

transform:translateY(-5px);

}

.phone-card{
padding:30px;
/* position:relative;

background:#fff;



border-radius:30px;

box-shadow:0 30px 70px rgba(0,0,0,.12); */

}

.phone-card img{

width:100%;

}

.floating-box{

position:absolute;

background:#fff;

padding:20px;

border-radius:18px;

box-shadow:0 15px 40px rgba(0,0,0,.12);

text-align:center;

}

.order-box{

top:30px;

left:-30px;

}

.customer-box{

bottom:30px;

right:-30px;

}

.floating-box h4{

font-size:28px;

color:#130e3f;

margin:8px 0;

}

@media(max-width:991px){

.about-company .container{

grid-template-columns:1fr;

}

.about-left{

text-align:center;

}

.about-list{

grid-template-columns:1fr;

}

.phone-card{

margin-top:0px;

}

}.contact-section{

padding:120px 0;

background:linear-gradient(180deg,#ffffff,#f5f7ff);

}

.contact-title{

text-align:center;

max-width:700px;

margin:auto auto 70px;

}

.contact-title span{

background:#ece8ff;

color:#130e3f;

padding:8px 20px;

border-radius:30px;

font-weight:600;

}

.contact-title h2{

font-size:46px;

margin:25px 0 15px;

}

.contact-title p{

font-size:18px;

color:#666;

line-height:30px;

}

.contact-wrapper{

display:grid;

grid-template-columns:380px 1fr;

gap:50px;

align-items:start;

}

.contact-info{

display:flex;

flex-direction:column;

gap:25px;

}

.info-card{

background:rgba(255,255,255,.75);

backdrop-filter:blur(15px);

padding:25px;

border-radius:20px;

display:flex;

gap:20px;

align-items:center;

box-shadow:0 15px 35px rgba(0,0,0,.08);

transition:.35s;

}

.info-card:hover{

transform:translateY(-8px);

}

.icon{

width:65px;

height:65px;

background:linear-gradient(135deg,#130e3f,#8B5CF6);

border-radius:18px;

display:flex;

justify-content:center;

align-items:center;

color:#fff;

font-size:24px;

flex-shrink:0;

}

.info-card h4{

margin-bottom:8px;

font-size:20px;

}

.info-card a,

.info-card p{

color:#666;

text-decoration:none;

}

.contact-form-box{

background:rgba(255,255,255,.75);

backdrop-filter:blur(20px);

padding:40px;

border-radius:25px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.contact-form-box h3{

margin-bottom:30px;

font-size:30px;

}

.row{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

margin-bottom:20px;

}

.contact-form-box input,

.contact-form-box textarea{

width:100%;

padding:16px 20px;

border:1px solid #ddd;

border-radius:12px;

outline:none;

font-size:16px;

margin-bottom:20px;

transition:.3s;

}

.contact-form-box input:focus,

.contact-form-box textarea:focus{

border-color:#130e3f;

box-shadow:0 0 0 4px rgba(108,60,244,.15);

}

.contact-form-box textarea{

height:180px;

resize:none;

}

.contact-form-box button{

padding:16px 35px;

background:#130e3f;

border:none;

border-radius:40px;

color:#fff;

font-size:17px;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.contact-form-box button:hover{

background:#5330d8;

transform:translateY(-3px);

}

@media(max-width:991px){

.contact-wrapper{

grid-template-columns:1fr;

}

.row{

grid-template-columns:1fr;

}

.contact-title h2{

font-size:34px;

}

}
.contact-info{

display:grid;
grid-template-columns:repeat(1,1fr);
gap:25px;

}

.contact-card{

background:#fff;
padding:35px;
border-radius:24px;
box-shadow:0 15px 40px rgba(0,0,0,.08);
transition:.35s;
position:relative;
overflow:hidden;
    display: flex;

}

.contact-card::before{

content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#130e3f,#8B5CF6);

}

.contact-card:hover{

transform:translateY(-10px);
box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.card-icon{

width:70px;
height:70px;
border-radius:20px;
display:flex;
align-items:center;
justify-content:center;
font-size:28px;
color:#fff;
margin-bottom:25px;
margin-right: 25px;

}

.email{
background:linear-gradient(135deg,#3B82F6,#2563EB);
}

.phone{
background:linear-gradient(135deg,#10B981,#059669);
}

.chat{
background:linear-gradient(135deg,#F59E0B,#D97706);
}

.office{
background:linear-gradient(135deg,#EC4899,#DB2777);
}

.contact-card h4{

font-size:22px;
margin-bottom:10px;

}

.contact-card p{

color:#666;
margin-bottom:20px;
line-height:26px;

}

.contact-card a{

text-decoration:none;
font-weight:600;
color:#130e3f;

}

.contact-card:hover a{

padding-left:8px;
transition:.3s;

}

@media(max-width:768px){

.contact-info{

grid-template-columns:1fr;

}

}
/* ================= LEGAL SECTION ================= */

.legal-section{

padding:120px 0;

background:linear-gradient(180deg,#ffffff,#f8f9ff);

}

.section-title{

text-align:center;

max-width:750px;

margin:auto auto 70px;

}

.section-tag{

display:inline-block;

padding:8px 18px;

background:#ede9fe;

color:#130e3f;

border-radius:30px;

font-weight:600;

margin-bottom:20px;

}

.section-title h2{

font-size:42px;

margin-bottom:18px;

color:#222;

}

.section-title p{

font-size:18px;

color:#666;

line-height:30px;

}

.legal-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.legal-card{

background:#fff;

padding:40px 35px;

border-radius:25px;

text-align:left;

box-shadow:0 20px 50px rgba(0,0,0,.06);

transition:.35s;

position:relative;

overflow:hidden;

}

.legal-card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(90deg,#130e3f,#8B5CF6);

}

.legal-card:hover{

transform:translateY(-12px);

box-shadow:0 30px 60px rgba(0,0,0,.12);

}

.legal-icon{

width:75px;

height:75px;

border-radius:20px;

display:flex;

justify-content:center;

align-items:center;

font-size:30px;

color:#fff;

margin-bottom:30px;

}

.blue{

background:linear-gradient(135deg,#3B82F6,#2563EB);

}

.purple{

background:linear-gradient(135deg,#7C3AED,#130e3f);

}

.red{

background:linear-gradient(135deg,#EF4444,#DC2626);

}

.legal-card h3{

font-size:24px;

margin-bottom:15px;

}

.legal-card p{

color:#666;

line-height:28px;

margin-bottom:25px;

}

.legal-card a{

display:inline-flex;

align-items:center;

gap:10px;

text-decoration:none;

color:#130e3f;

font-weight:600;

transition:.3s;

}

.legal-card:hover a{

gap:16px;

}

@media(max-width:992px){

.legal-grid{

grid-template-columns:1fr;

}

.section-title h2{

font-size:34px;

}

}
.download-app{

padding-bottom:60px;



}

.download-container{


margin:auto;

background:linear-gradient(135deg, #130e3f, #7E57FF);

border-radius:35px;

padding:60px;

display:flex;

align-items:center;

justify-content:space-between;

gap:60px;

position:relative;

overflow:hidden;

box-shadow:0 30px 70px rgba(91,61,245,.35);

}

.download-container::before{

content:'';

position:absolute;

width:500px;

height:500px;

background:rgba(255,255,255,.08);

border-radius:50%;

top:-220px;

right:-120px;

}

.download-container::after{

content:'';

position:absolute;

width:300px;

height:300px;

background:rgba(255,255,255,.06);

border-radius:50%;

bottom:-150px;

left:-100px;

}

.download-content{

flex:1;

position:relative;

z-index:2;

}

.download-tag{

display:inline-block;

padding:10px 24px;

background:rgba(255,255,255,.15);

border-radius:50px;

color:#fff;

margin-bottom:25px;

}

.download-content h2{

font-size:60px;

line-height:1.2;

color:#fff;

margin-bottom:25px;

}

.download-content h2 span{

color:#FFD54F;

}

.download-content p{

font-size:19px;

line-height:34px;

color:rgba(255,255,255,.92);

max-width:520px;

margin-bottom:40px;

}

.download-buttons{

display:flex;

gap:20px;

margin-bottom:0px;

flex-wrap:wrap;

}

.store-btn{

background:#fff;

padding:16px 26px;

border-radius:18px;

display:flex;

align-items:center;

gap:15px;

text-decoration:none;

color:#222;

font-weight:600;

transition:.35s;

}

.store-btn:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.18);

}

.store-btn i{

font-size:34px;

color:#5B3DF5;

}

.store-btn small{

display:block;

font-size:12px;

color:#777;

}

.download-users{

display:flex;

gap:50px;

color:#fff;

}

.download-users h3{

font-size:34px;

margin-bottom:5px;

}

.download-users span{

opacity:.8;

}

.download-phone{

flex:1;

text-align:center;

position:relative;

z-index:2;

}

.download-phone img{

max-width:360px;

width:100%;

animation:float 4s ease-in-out infinite;

filter:drop-shadow(0 35px 50px rgba(0,0,0,.4));

}

@keyframes float{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-20px);

}

}

@media(max-width:991px){

.download-container{

flex-direction:column;

padding:50px 30px;

text-align:center;

}

.download-content h2{

font-size:42px;

}

.download-buttons{

justify-content:center;

}

.download-users{

justify-content:center;

flex-wrap:wrap;

}

}
.footer{

background:#111827;

color:#fff;

padding:80px 0 25px;

}

.footer-top{

display:grid;

grid-template-columns:2fr 1fr 1fr 1fr 1.3fr;

gap:40px;

padding-bottom:50px;

border-bottom:1px solid rgba(255,255,255,.08);

}

.footer-logo{

width:140px;

margin-bottom:20px;

}

.footer-about p{

color:#c7c7c7;

line-height:30px;

margin-bottom:25px;

}

.footer-links h4,
.footer-app h4{

margin-bottom:20px;

font-size:20px;

}

.footer-links a{

display:block;

margin-bottom:15px;

color:#c7c7c7;

text-decoration:none;

transition:.3s;

}

.footer-links a:hover{

color:#fff;

padding-left:8px;

}

.social-links{

display:flex;

gap:15px;

}

.social-links a{

width:42px;

height:42px;

border-radius:50%;

background:#1f2937;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

text-decoration:none;

transition:.3s;

}

.social-links a:hover{

background:#130e3f;

transform:translateY(-5px);

}

.store{

display:flex;

align-items:center;

gap:15px;

background:#1f2937;

padding:14px 18px;

border-radius:14px;

text-decoration:none;

color:#fff;

margin-bottom:15px;

transition:.3s;

}

.store:hover{

background:#130e3f;

}

.store i{

font-size:28px;

}

.store small{

display:block;

font-size:11px;

color:#ccc;

}

.footer-bottom{

display:flex;

justify-content:space-between;

align-items:center;

padding-top:25px;

}

.footer-bottom p{

color:#aaa;

}

.footer-bottom div{

display:flex;

gap:25px;

}

.footer-bottom a{

color:#aaa;

text-decoration:none;

}

.footer-bottom a:hover{

color:#fff;

}

@media(max-width:992px){

.footer-top{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.footer-top{

grid-template-columns:1fr;

text-align:center;

}

.social-links{

justify-content:center;

}

.footer-bottom{

flex-direction:column;

gap:15px;

}

}
.about-right {
    position: relative;
}
/*==============================
    TERMS / PRIVACY PAGE
===============================*/

.terms-content-page{
  margin-top: 30px;
    padding:100px 0;
    background:#f5f7fb;
}



/* Page Title */

.page-title1{

    font-size:48px;

    text-align:center;

    margin-bottom:20px;

    color:#222;

    position:relative;

    font-weight:700;

}

.page-title1::after{

    content:"";

    width:80px;

    height:4px;

    background:#130e3f;

    display:block;

    margin:18px auto 0;

    border-radius:20px;

}

/* Content Block */

.terms-content{

    background:#fff;

    border-left:5px solid #130e3f;

    padding:30px;

    margin-bottom:35px;

    border-radius:15px;

    transition:.35s;

}

.terms-content:hover{

    transform:translateY(-5px);

    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

/* Heading */

.terms-content h2{

    color:#222;

    font-size:28px;

    margin-bottom:20px;

    font-weight:700;

}

/* Paragraph */

.terms-content p{

    color:#555;

    line-height:32px;

    font-size:16px;

    margin-bottom:18px;

}

/* List */

.terms-content ul{

    padding-left:22px;

}

.terms-content li{

    margin-bottom:12px;

    color:#555;

    line-height:30px;

}

/* Links */

.terms-content a{

    color:#130e3f;

    text-decoration:none;

    font-weight:600;

}

.terms-content a:hover{

    text-decoration:underline;

}

/* Table */

.table{

    width:100%;

    border-collapse:collapse;

    margin-top:25px;

    border-radius:12px;

    overflow:hidden;

}

.table th{

    background:#130e3f;

    color:#fff;

    padding:16px;

    font-size:16px;

}

.table td{

    padding:15px;

    border:1px solid #eee;

    color:#555;

}

.table tr:nth-child(even){

    background:#fafafa;

}

.table tr:hover{

    background:#f3f0ff;

}

/* Bold */

.terms-content b{

    color:#222;

}

/* Mobile */

@media(max-width:768px){

.about-wrapper{

padding:25px;

}

.page-title1{

font-size:34px;

}

.terms-content{

padding:20px;

}

.terms-content h2{

font-size:22px;

}

.table{

display:block;

overflow-x:auto;

white-space:nowrap;

}

}

.success-msg{
    display:none;
    margin-top:15px;
    padding:12px;
    background:#d4edda;
    color:#155724;
    border:1px solid #c3e6cb;
    border-radius:5px;
}

.error{
    border:1px solid red !important;
}