

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Amarna';
}


.amarna-<uniquifier> {
  font-family: "Amarna", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}



body{
    background:#f8fafc;
    color:#0f172a;
}

/* ================= TOP BAR ================= */
.topbar{
    background:#2a2456;
    color:#fff;
    font-size:14px;
}

.topbar .container{
    max-width:1200px;
    margin:auto;
    padding:10px 20px;
    display:flex;
    justify-content:space-between;
}

/* ================= HEADER ================= */
header{
    background:#ffffff;
    box-shadow:0 2px 15px rgba(0,0,0,0.05);
}

header .container{
    max-width:1200px;
    margin:auto;
    padding:22px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.logo{
    font-size:26px;
    font-weight:800;
}

.logo span{ color:#0087ff; }

nav ul{
    list-style:none;
    display:flex;
    gap:48px;
}

nav ul li a{
    text-decoration:none;
    color:#334155;
    font-weight:500;
    position:relative;
}

.signup-btn{
    background:#0087ff;
    color:#fff;
    padding:12px 24px;
    border-radius:6px;
    font-weight:600;
    text-decoration:none;
}

/* ================= HERO ================= */
.hero{
    position:relative;
    padding:120px 0;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0.97) 40%,
            rgba(255,255,255,0.88) 100%
        ),
        url("https://www.transparenttextures.com/patterns/connected.png");
    overflow:hidden;
}

/* GRAPHIC BLOBS */
.hero::before{
    content:"";
    position:absolute;
    top:-180px;
    right:-180px;
    width:520px;
    height:520px;
    background:radial-gradient(circle,#c7d2fe,#e0f2fe);
    border-radius:50%;
    opacity:0.75;
}

.hero::after{
    content:"";
    position:absolute;
    bottom:-220px;
    left:-220px;
    width:600px;
    height:600px;
    background:radial-gradient(circle,#ffedd5,#fed7aa);
    border-radius:50%;
    opacity:0.8;
}

/* FLOATING SHAPES */
.shape{
    position:absolute;
    border-radius:30px;
    opacity:0.8;
}

.shape.one{
    top:160px;
    right:140px;
    width:90px;
    height:28px;
    background:#22d3ee;
}

.shape.two{
    top:260px;
    right:60px;
    width:120px;
    height:32px;
    background:#ff6a00;
}

.shape.three{
    bottom:160px;
    left:120px;
    width:70px;
    height:24px;
    background:#6366f1;
}

/* HERO CONTENT */
.hero .container{
    position:relative;
    max-width:1200px;
    margin:auto;
    padding:0 20px;
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    align-items:center;
    gap:60px;
    z-index:2;
}

/* HERO TEXT */
.hero h1{
    font-size:52px;
    line-height:1.15;
    font-weight:800;
    margin-bottom:20px;
}

.hero p{
    font-size:18px;
    color:#475569;
    max-width:560px;
    margin-bottom:26px;
}

/* FEATURE LIST */
.hero ul{
    list-style:none;
    margin-bottom:34px;
}

.hero ul li{
    font-size:16px;
    margin-bottom:10px;
    color:#0f172a;
}

.hero ul li::before{
    content: "✓";
    color:#22c55e;
    margin-right:10px;
    font-weight:700;
}

/* CTA BUTTONS */
.hero-actions{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.primary-btn{
    background:#0087ff;
    color:#fff;
    padding:16px 36px;
    border-radius:8px;
    font-weight:600;
    text-decoration:none;
    box-shadow:0 12px 30px rgba(255,106,0,0.35);
}

.secondary-btn{
    background:#ffffff;
    color:#0087ff;
    padding:16px 36px;
    border-radius:8px;
    font-weight:600;
    text-decoration:none;
    border:2px solid #0087ff;
}

/* ================= FORM CARD ================= */
.form-card{
    background:#ffffff;
    padding:38px;
    border-radius:18px;
    box-shadow:0 30px 70px rgba(15,23,42,0.2);
}

.form-card h3{
    font-size:22px;
    font-weight:700;
    margin-bottom:6px;
}

.form-card p{
    font-size:14px;
    color:#64748b;
    margin-bottom:24px;
}

.form-group{
    margin-bottom:18px;
}

.form-group input{
    width:100%;
    padding:14px 16px;
    border-radius:8px;
    border:1px solid #e2e8f0;
    font-size:15px;
}

.form-group input:focus{
    outline:none;
    border-color:#ff6a00;
}

.form-card button{
    width:100%;
    background:#0087ff;
    color:#fff;
    padding:15px;
    border:none;
    border-radius:8px;
    font-size:16px;
    font-weight:600;
    cursor:pointer;
}

/* ================= RESPONSIVE ================= */
@media(max-width:900px){
    nav ul{ display:none; }

    .hero{
        padding:90px 0;
    }

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

    .hero p{
        margin:auto;
    }

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

    .form-card{
        max-width:420px;
        margin:auto;
    }
}

/* ================= TRUSTED SECTION (NEW) ================= */
.trusted-section{
    padding:50px 20px;
    background:#ffffff;
    position:relative;
    overflow:hidden;
}

.trusted-container{
    max-width:1200px;
    margin:auto;
    text-align:center;
}

.trusted-tag{
    display:inline-block;
    color:#0087ff;
    font-weight:600;
    letter-spacing:1px;
    margin-bottom:14px;
}

.trusted-title{
    font-size:42px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:22px;
}

.trusted-desc{
    max-width:720px;
    margin:0 auto 70px;
    font-size:18px;
    color:#475569;
    line-height:1.6;
}

/* FLOW LAYOUT */
.trusted-flow{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:60px;
    align-items:start;
    position:relative;
}

/* FLOW ITEM */
.trusted-item{
    background:#ffffff;
    padding:10px;
}

.trusted-item h4{
    font-size:18px;
    font-weight:700;
    margin:18px 0 12px;
    color:#0f172a;
}

.trusted-item p{
    font-size:15px;
    color:#64748b;
    line-height:1.6;
}

/* ICON STYLE */
.trusted-icon{
    width:64px;
    height:64px;
    border-radius:50%;
    background:#f1f5f9;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    margin:0 auto;
}

/* CENTER EMPHASIS */
.trusted-center{
    transform:translateY(30px);
}

/* CURVED FLOW LINES (DECORATIVE) */
.trusted-flow::before,
.trusted-flow::after{
    /*content:"";*/
    position:absolute;
    top:45px;
    width:180px;
    height:1px;
    background:#e2e8f0;
}

.trusted-flow::before{
    left:32%;
}

.trusted-flow::after{
    right:32%;
}

/* RESPONSIVE */
@media(max-width:900px){
    .trusted-flow{
        grid-template-columns:1fr;
        gap:40px;
    }

    .trusted-center{
        transform:none;
    }

    .trusted-flow::before,
    .trusted-flow::after{
        display:none;
    }
}

/* ================= SOLUTIONS SECTION (NEW) ================= */
.solutions-section{
    padding:50px 20px;
    background:
        linear-gradient(135deg,#ecfeff,#f5f3ff);
    position:relative;
    overflow:hidden;
}

.solutions-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:80px;
    align-items:center;
}

/* LEFT VISUAL */
.solutions-visual{
    display:flex;
    justify-content:center;
    position:relative;
}

.solutions-circle{
    position:relative;
    width:360px;
    height:360px;
    border-radius:50%;
    background:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 30px 70px rgba(15,23,42,0.15);
}

.solutions-ring{
    position:absolute;
    width:100%;
    height:100%;
    border-radius:50%;
    border:2px solid #6366f1;
}

.solutions-ring.inner{
    width:300px;
    height:300px;
    border-color:#ff6a00;
}

.solutions-icon{
    width:90px;
    height:90px;
    border-radius:50%;
    background:linear-gradient(135deg,#ff6a00,#fb923c);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:42px;
    color:#fff;
    z-index:2;
}

/* RIGHT CONTENT */
.solutions-content{
    max-width:620px;
}

.solutions-tag{
    color:#0087ff;
    font-weight:600;
    letter-spacing:1px;
    display:inline-block;
    margin-bottom:14px;
}

.solutions-content h2{
    font-size:42px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:34px;
}

.solution-item{
    margin-bottom:28px;
}

.solution-item h4{
    font-size:18px;
    font-weight:700;
    margin-bottom:8px;
    color:#0f172a;
}

.solution-item p{
    font-size:16px;
    color:#475569;
    line-height:1.6;
}

/* DECORATIVE WAVES */
.solutions-section::before,
.solutions-section::after{
    content:"";
    position:absolute;
    width:120px;
    height:10px;
    border-radius:10px;
    background:#fb923c;
}

.solutions-section::before{
    top:120px;
    left:120px;
}

.solutions-section::after{
    bottom:140px;
    right:140px;
}

/* RESPONSIVE */
@media(max-width:900px){
    .solutions-container{
        grid-template-columns:1fr;
        gap:60px;
        text-align:center;
    }

    .solutions-content{
        margin:auto;
    }

    .solutions-circle{
        width:280px;
        height:280px;
    }

    .solutions-ring.inner{
        width:230px;
        height:230px;
    }
}

/* ================= INDUSTRIES SECTION (NEW) ================= */
.industries-section{
    padding:50px 20px;
    background:#ffffff;
}

.industries-container{
    max-width:1200px;
    margin:auto;
    text-align:center;
}

.industries-tag{
    color:#0087ff;
    font-weight:600;
    letter-spacing:1px;
    display:inline-block;
    margin-bottom:14px;
}

.industries-title{
    font-size:42px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:22px;
}

.industries-desc{
    max-width:760px;
    margin:0 auto 80px;
    font-size:18px;
    color:#475569;
    line-height:1.6;
}

/* GRID */
.industries-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:60px;
}

/* CARD */
.industry-card{
    padding:20px;
    text-align:center;
}

.industry-icon{
    width:70px;
    height:70px;
    border-radius:50%;
    background:#f1f5f9;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin:0 auto 16px;
}

.industry-card h4{
    font-size:17px;
    font-weight:700;
    color:#0f172a;
}

/* HIGHLIGHT CENTER CARD */
.highlight-card .industry-icon{
    background:linear-gradient(135deg,#ff6a00,#fb923c);
    color:#fff;
}

/* RESPONSIVE */
@media(max-width:900px){
    .industries-grid{
        grid-template-columns:1fr;
        gap:40px;
    }
}

/* ================= WHY CHOOSE – PATTERN VERSION ================= */
.why-pattern-section{
    position:relative;
    padding:50px 20px;
    background:#ffffff;
    overflow:hidden;
}

/* PATTERN BACKGROUND */
.why-pattern-bg{
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 20% 30%, rgba(99,102,241,0.08) 0, transparent 40%),
        radial-gradient(circle at 80% 60%, rgba(14,165,233,0.08) 0, transparent 40%),
        repeating-linear-gradient(
            135deg,
            rgba(15,23,42,0.03),
            rgba(15,23,42,0.03) 1px,
            transparent 1px,
            transparent 18px
        );
    z-index:0;
}

.why-pattern-container{
    position:relative;
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1.2fr 0.8fr;
    gap:100px;
    align-items:center;
    z-index:1;
}

/* CONTENT */
.why-pattern-tag{
    color:#0087ff;
    font-weight:600;
    letter-spacing:1px;
    display:inline-block;
    margin-bottom:16px;
}

.why-pattern-content h2{
    font-size:46px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:48px;
}

/* LIST */
.why-pattern-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:36px 50px;
}

.why-pattern-item{
    display:flex;
    gap:18px;
}

.why-pattern-item span{
    font-size:28px;
    font-weight:800;
    color:#e5e7eb;
    line-height:1;
}

.why-pattern-item h4{
    font-size:17px;
    font-weight:700;
    color:#0f172a;
    margin-bottom:6px;
}

.why-pattern-item p{
    font-size:15px;
    color:#475569;
    line-height:1.6;
}

/* IMAGE */
.why-pattern-image{
    position:relative;
}

.why-pattern-image img{
    width:100%;
    max-width:420px;
    border-radius:24px;
    box-shadow:0 40px 90px rgba(15,23,42,0.18);
}

/* IMAGE HALO */
.why-pattern-image::before{
    content:"";
    position:absolute;
    inset:-30px;
    border-radius:30px;
    background:
        repeating-linear-gradient(
            45deg,
            rgba(99,102,241,0.15),
            rgba(99,102,241,0.15) 2px,
            transparent 2px,
            transparent 14px
        );
    z-index:-1;
}

/* RESPONSIVE */
@media(max-width:900px){
    .why-pattern-container{
        grid-template-columns:1fr;
        text-align:center;
        gap:80px;
    }

    .why-pattern-list{
        grid-template-columns:1fr;
    }

    .why-pattern-image img{
        margin:auto;
    }
}

/* ================= COMPLIANCE NEO (ANIMATED & DECENT) ================= */
.compliance-neo{
    position:relative;
    padding:50px 20px;
    overflow:hidden;
    background:#0b1220;
    color:#e5e7eb;
}

/* BACKGROUND IMAGE + MOTION */
.compliance-neo-bg{
    position:absolute;
    inset:-20%;
    background:
        url("https://www.transparenttextures.com/patterns/cubes.png"),
        radial-gradient(circle at 30% 30%, rgba(99,102,241,0.25), transparent 40%),
        radial-gradient(circle at 70% 70%, rgba(14,165,233,0.25), transparent 40%);
    animation:bgFloat 40s linear infinite;
    opacity:0.35;
}

@keyframes bgFloat{
    from{ transform:translateY(0); }
    to{ transform:translateY(-120px); }
}

.compliance-neo-container{
    position:relative;
    max-width:900px;
    margin:auto;
    z-index:2;
}

/* HEADER */
.compliance-neo-header{
    text-align:center;
    margin-bottom:80px;
    animation:fadeUp 1s ease forwards;
}

.compliance-neo-tag{
    color:#0087ff;
    font-size:13px;
    font-weight:600;
    letter-spacing:1.2px;
}

.compliance-neo-title{
    font-size:42px;
    font-weight:800;
    margin:18px 0;
    color:#ffffff;
}

.compliance-neo-desc{
    font-size:18px;
    color:#cbd5f5;
    line-height:1.65;
}

/* ROWS */
.compliance-neo-rows{
    display:flex;
    flex-direction:column;
    gap:22px;
}

/* ROW BASE */
.compliance-neo-row{
    display:flex;
    gap:18px;
    padding:22px 26px;
    border-radius:16px;
    align-items:flex-start;
    background:rgba(255,255,255,0.04);
    backdrop-filter:blur(6px);
    animation:slideIn 0.8s ease forwards;
    opacity:0;
}

.compliance-neo-row:nth-child(1){ animation-delay:.1s }
.compliance-neo-row:nth-child(2){ animation-delay:.2s }
.compliance-neo-row:nth-child(3){ animation-delay:.3s }
.compliance-neo-row:nth-child(4){ animation-delay:.4s }
.compliance-neo-row:nth-child(5){ animation-delay:.5s }

/* ICON */
.neo-icon{
    font-size:24px;
    width:42px;
    height:42px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

/* TEXT */
.compliance-neo-row h4{
    font-size:16px;
    font-weight:700;
    color:#ffffff;
    margin-bottom:4px;
}

.compliance-neo-row p{
    font-size:14.5px;
    color:#d1d5f1;
    line-height:1.6;
}

/* COLOR VARIANTS */
.neo-blue   { border-left:4px solid #6366f1; }
.neo-green  { border-left:4px solid #22c55e; }
.neo-purple { border-left:4px solid #a855f7; }
.neo-orange { border-left:4px solid #fb923c; }
.neo-teal   { border-left:4px solid #14b8a6; }

/* ICON COLORS */
.neo-blue .neo-icon   { background:#1e1b4b }
.neo-green .neo-icon  { background:#064e3b }
.neo-purple .neo-icon { background:#3b0764 }
.neo-orange .neo-icon { background:#7c2d12 }
.neo-teal .neo-icon   { background:#042f2e }

/* FOOT */
.compliance-neo-foot{
    margin-top:70px;
    text-align:center;
    font-size:16px;
    color:#c7d2fe;
    animation:fadeUp 1s ease .6s forwards;
    opacity:0;
}

/* ANIMATIONS */
@keyframes slideIn{
    from{ transform:translateX(-30px); opacity:0; }
    to{ transform:translateX(0); opacity:1; }
}

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

/* RESPONSIVE */
@media(max-width:768px){
    .compliance-neo-title{ font-size:32px; }
}


/* ================= HOW IT WORKS – COLORFUL ================= */
.how-colorful{
    position:relative;
    padding:50px 20px;
    overflow:hidden;
    background:#f8fafc;
}

/* ANIMATED GRADIENT BACKGROUND */
.how-colorful-bg{
    position:absolute;
    inset:-20%;
    background:
        radial-gradient(circle at 20% 30%, rgba(99,102,241,0.25), transparent 45%),
        radial-gradient(circle at 80% 40%, rgba(236,72,153,0.25), transparent 45%),
        radial-gradient(circle at 50% 80%, rgba(34,197,94,0.25), transparent 45%);
    animation:floatGradient 30s linear infinite;
    z-index:0;
}

@keyframes floatGradient{
    0%{ transform:translateY(0); }
    50%{ transform:translateY(-120px); }
    100%{ transform:translateY(0); }
}

.how-colorful-container{
    position:relative;
    max-width:1200px;
    margin:auto;
    text-align:center;
    z-index:1;
}

/* HEADER */
.how-colorful-tag{
    color:#0087ff;
    font-weight:600;
    letter-spacing:1.2px;
    font-size:13px;
}

.how-colorful-title{
    font-size:44px;
    font-weight:800;
    margin:18px 0;
    color:#0f172a;
}

.how-colorful-desc{
    max-width:760px;
    margin:0 auto 90px;
    font-size:18px;
    color:#475569;
    line-height:1.6;
}

/* GRID */
.how-colorful-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:36px;
}

/* CARD */
.how-colorful-card{
    position:relative;
    padding:38px 28px;
    border-radius:24px;
    background:#ffffff;
    box-shadow:0 30px 70px rgba(15,23,42,0.12);
    transition:all 0.35s ease;
}

.how-colorful-card:hover{
    transform:translateY(-12px);
}

/* STEP CIRCLE */
.card-step{
    width:54px;
    height:54px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:18px;
    color:#ffffff;
    margin:0 auto 22px;
}

/* TEXT */
.how-colorful-card h4{
    font-size:17px;
    font-weight:700;
    margin-bottom:10px;
    color:#0f172a;
}

.how-colorful-card p{
    font-size:15px;
    color:#475569;
    line-height:1.6;
    margin-bottom:24px;
}

/* BUTTON */
.card-btn{
    display:inline-block;
    padding:10px 24px;
    border-radius:999px;
    font-size:14px;
    font-weight:600;
    color:#ffffff;
    text-decoration:none;
}

/* COLOR VARIANTS */
.card-blue .card-step{ background:#6366f1; }
.card-blue .card-btn{ background:#6366f1; }

.card-purple .card-step{ background:#a855f7; }
.card-purple .card-btn{ background:#a855f7; }

.card-orange .card-step{ background:#fb923c; }
.card-orange .card-btn{ background:#fb923c; }

.card-green .card-step{ background:#22c55e; }
.card-green .card-btn{ background:#22c55e; }

/* RESPONSIVE */
@media(max-width:1024px){
    .how-colorful-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:600px){
    .how-colorful-grid{
        grid-template-columns:1fr;
    }

    .how-colorful-title{
        font-size:34px;
    }
}

/* ================= ABOUT STYLE SECTION ================= */
.about-style{
    padding:50px 20px;
    background:#ffffff;
}

.about-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:90px;
    align-items:center;
}

/* IMAGE STACK */
.about-images{
    position:relative;
}

.about-img-main{
    position:relative;
    width:100%;
    max-width:460px;
    border-radius:26px;
    overflow:hidden;
    box-shadow:0 35px 80px rgba(15,23,42,0.18);
}

.about-img-main img{
    width:100%;
    display:block;
}

/* EXPERIENCE BADGE */
.experience-badge{
    position:absolute;
    top:20px;
    right:20px;
    background:linear-gradient(135deg,#0ea5e9,#2563eb);
    color:#ffffff;
    padding:18px 22px;
    border-radius:16px;
    text-align:center;
    box-shadow:0 20px 40px rgba(37,99,235,0.35);
}

.experience-badge strong{
    font-size:26px;
    display:block;
    font-weight:800;
}

.experience-badge span{
    font-size:12px;
    opacity:0.9;
}

/* OVERLAY IMAGE */
.about-img-overlay{
    position:absolute;
    bottom:-60px;
    right:-60px;
    width:280px;
    border-radius:22px;
    overflow:hidden;
    border:6px solid #ffffff;
    box-shadow:0 30px 70px rgba(15,23,42,0.22);
}

.about-img-overlay img{
    width:100%;
    display:block;
}

/* CONTENT */
.about-tag{
    font-size:13px;
    font-weight:600;
    letter-spacing:1.4px;
    color:#0087ff;
    margin-bottom:16px;
    display:inline-block;
}

.about-content h2{
    font-size:44px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:22px;
    line-height:1.2;
}

.about-desc{
    font-size:17px;
    color:#475569;
    line-height:1.7;
    margin-bottom:34px;
}

/* LIST */
.about-list{
    list-style:none;
    padding:0;
    margin:0 0 40px;
}

.about-list li{
    font-size:16px;
    color:#0f172a;
    margin-bottom:14px;
    position:relative;
    padding-left:26px;
}

.about-list li::before{
    content:"✓";
    position:absolute;
    left:0;
    color:#22c55e;
    font-weight:700;
}

/* BUTTON */
.about-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:14px 36px;
    background:#0087ff;
    color:#ffffff;
    font-weight:600;
    border-radius:999px;
    text-decoration:none;
    transition:0.3s ease;
}

.about-btn:hover{
    background:#0087ff;
    transform:translateY(-2px);
}

/* RESPONSIVE */
@media(max-width:900px){
    .about-container{
        grid-template-columns:1fr;
        text-align:center;
    }

    .about-images{
        margin-bottom:80px;
    }

    .about-img-overlay{
        right:50%;
        transform:translateX(50%);
    }
}
/* ================= FAQ BACKGROUND SECTION ================= */
.faq-section-bg{
    position:relative;
    padding:50px 20px;
    background:
        url("https://images.unsplash.com/photo-1521737604893-d14cc237f11d?q=80&w=1920&auto=format&fit=crop")
        center / cover no-repeat;
}

/* DARK OVERLAY */
.faq-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        120deg,
        rgba(15,23,42,0.85),
        rgba(37,99,235,0.65)
    );
    z-index:1;
}

/* LAYOUT */
.faq-container{
    position:relative;
    z-index:2;
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:80px;
    align-items:stretch;
}

/* IMAGE */
.faq-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:26px;
    box-shadow:0 40px 90px rgba(0,0,0,0.35);
}

/* TEXT */
.faq-tag{
    font-size:13px;
    font-weight:600;
    letter-spacing:1.4px;
    color:#93c5fd;
    margin-bottom:14px;
    display:inline-block;
}

.faq-content h2{
    font-size:44px;
    font-weight:800;
    color:#ffffff;
    margin-bottom:40px;
}

/* FAQ ITEMS */
.faq-item{
    border-bottom:1px solid rgba(255,255,255,0.2);
}

.faq-question{
    width:100%;
    background:none;
    border:none;
    padding:22px 0;
    font-size:18px;
    font-weight:600;
    color:#ffffff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
}

.faq-question .icon{
    font-size:22px;
    color:#60a5fa;
}

.faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height 0.45s ease;
}

.faq-answer p{
    font-size:16px;
    color:#e5e7eb;
    line-height:1.7;
    padding-bottom:22px;
}

.faq-item.active .faq-answer{
    max-height:400px;
}

/* RESPONSIVE */
@media(max-width:900px){
    .faq-container{
        grid-template-columns:1fr;
    }

    .faq-image{
        height:420px;
    }

    .faq-content h2{
        font-size:34px;
    }
}

/* ================= START PROCESSING PAYMENTS (LIGHT PATTERN) ================= */

.cta-borderless{
    position:relative;
    padding:50px 20px;
    overflow:hidden;
    background:#ffffff;
}

/* LIGHT PATTERN BACKGROUND (NO COLOR BLOCK) */
.cta-pattern-bg{
    position:absolute;
    inset:0;
    z-index:1;
    background:
        radial-gradient(circle at 1px 1px, rgba(15,23,42,0.06) 1px, transparent 0),
        linear-gradient(
            120deg,
            rgba(99,102,241,0.05),
            rgba(14,165,233,0.04),
            rgba(34,197,94,0.04)
        );
    background-size:36px 36px, 100% 100%;
}

/* SOFT MOVING HIGHLIGHT */
.cta-animated-highlights{
    position:absolute;
    inset:-40%;
    z-index:2;
    pointer-events:none;
    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,0) 40%,
            rgba(255,255,255,0.35) 50%,
            rgba(255,255,255,0) 60%
        );
    animation:highlightSweep 22s ease-in-out infinite;
    mix-blend-mode:overlay;
}

/* CONTENT WRAPPER */
.cta-container{
    position:relative;
    z-index:3;
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1.2fr 0.8fr;
    gap:80px;
    align-items:center;
}

/* TEXT */
.cta-content h2{
    font-size:48px;
    font-weight:800;
    color:#0f172a;
    margin-bottom:22px;
    line-height:1.2;
}

.cta-content p{
    font-size:18px;
    color:#475569;
    line-height:1.7;
    margin-bottom:32px;
}

/* POINTS */
.cta-points{
    list-style:none;
    margin:0 0 40px;
    padding:0;
}

.cta-points li{
    font-size:17px;
    color:#0f172a;
    margin-bottom:14px;
    padding-left:28px;
    position:relative;
}

.cta-points li::before{
    content:"✔";
    position:absolute;
    left:0;
    color:#22c55e;
    font-weight:700;
}

/* BUTTONS */
.cta-buttons{
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.btn-primary{
    padding:14px 34px;
    background:#0087ff;
    color:#ffffff;
    border-radius:999px;
    font-weight:600;
    text-decoration:none;
    transition:0.3s ease;
}

.btn-primary:hover{
    background:#1d4ed8;
    transform:translateY(-2px);
}

.btn-outline{
    padding:14px 34px;
    border:2px solid #2563eb;
    color:#2563eb;
    border-radius:999px;
    font-weight:600;
    text-decoration:none;
    transition:0.3s ease;
}

.btn-outline:hover{
    background:#2563eb;
    color:#ffffff;
}

/* IMAGE */
.cta-illustration img{
    width:100%;
    border-radius:28px;
    box-shadow:0 40px 90px rgba(15,23,42,0.18);
}

/* ANIMATION */
@keyframes highlightSweep{
    0%{
        transform:translateX(-30%);
        opacity:0.25;
    }
    50%{
        transform:translateX(30%);
        opacity:0.55;
    }
    100%{
        transform:translateX(-30%);
        opacity:0.25;
    }
}

/* RESPONSIVE */
@media(max-width:900px){
    .cta-container{
        grid-template-columns:1fr;
        text-align:center;
    }

    .cta-buttons{
        justify-content:center;
    }

    .cta-content h2{
        font-size:36px;
    }
}

/* ================= FOOTER WITH PATTERN & ANIMATION ================= */

.payment-footer{
    position:relative;
    background:linear-gradient(135deg,#0f172a,#020617);
    color:#cbd5f5;
    padding:110px 20px 0;
    overflow:hidden;
}

/* BACKGROUND PATTERN */
.footer-pattern{
    position:absolute;
    inset:0;
    background-image:
        radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px);
    background-size:38px 38px;
    opacity:0.35;
    pointer-events:none;
}

/* GRID */
.footer-container{
    position:relative;
    z-index:2;
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr;
    gap:60px;
}

/* BRAND */
.footer-logo{
    font-size:26px;
    font-weight:800;
    color:#ffffff;
    margin-bottom:16px;
}

.footer-brand p{
    font-size:15px;
    line-height:1.7;
    margin-bottom:22px;
    max-width:320px;
}

/* SOCIAL ICONS */
.footer-social{
    display:flex;
    gap:12px;
}

.footer-social a{
    width:38px;
    height:38px;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#ffffff;
    font-size:14px;
    font-weight:600;
    text-decoration:none;
    transition:0.3s ease;
}

.footer-social a:hover{
    background:#38bdf8;
    transform:translateY(-3px);
}

/* HEADINGS */
.footer-col h4{
    font-size:16px;
    font-weight:700;
    color:#ffffff;
    margin-bottom:18px;
}

/* LINKS */
.footer-col ul{
    list-style:none;
    padding:0;
    margin:0;
}

.footer-col li{
    margin-bottom:12px;
}

.footer-col a{
    font-size:15px;
    color:#cbd5f5;
    text-decoration:none;
    transition:0.3s ease;
}

.footer-col a:hover{
    color:#38bdf8;
}

/* BOTTOM BAR */
.footer-bottom{
    margin-top:70px;
    border-top:1px solid rgba(255,255,255,0.1);
    text-align:center;
    padding:18px 10px;
}

.footer-bottom p{
    font-size:14px;
    color:#94a3b8;
}

/* ================= TEXT ANIMATION ================= */

.fade-up{
    opacity:0;
    transform:translateY(30px);
    animation:fadeUp 0.9s ease forwards;
}

.delay-1{ animation-delay:0.2s; }
.delay-2{ animation-delay:0.4s; }
.delay-3{ animation-delay:0.6s; }

@keyframes fadeUp{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* RESPONSIVE */
@media(max-width:900px){
    .footer-container{
        grid-template-columns:1fr;
        gap:40px;
        text-align:center;
    }

    .footer-social{
        justify-content:center;
    }

    .footer-brand p{
        margin:auto;
    }
}

/* ================================
   DMCA PAGE  ISOLATED STYLING
   This CSS does NOT affect old site
   ================================ */

.dmca-scope {
  background: #f4f6fb;
  padding: 90px 20px;
}

.dmca-card {
  max-width: 880px;
  margin: auto;
  background: #ffffff;
  border-radius: 14px;
  padding: 48px 42px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.08);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #1f2933;
}

.dmca-heading {
  font-size: 36px;
  margin-bottom: 24px;
  font-weight: 700;
  letter-spacing: -0.5px;
}

.dmca-subheading {
  font-size: 22px;
  margin-top: 40px;
  margin-bottom: 14px;
  color: #0f172a;
  border-bottom: 2px solid #e5e7eb;
  padding-bottom: 6px;
}

.dmca-card p {
  font-size: 16px;
  line-height: 1.85;
  margin-bottom: 18px;
}

.dmca-list {
  margin: 18px 0 26px 22px;
  padding-left: 12px;
}

.dmca-list li {
  margin-bottom: 12px;
  font-size: 15.5px;
  line-height: 1.7;
}


/* ============================
   ABOUT PAGE – ISOLATED STYLES
   ============================ */

.about-page * {
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

/* Containers */
.about-page .container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Hero Section */
.about-page .page-hero {
    background: linear-gradient(135deg, #0f172a, #020617);
    padding: 90px 20px;
    color: #ffffff;
    text-align: center;
}

.about-page .page-hero h1 {
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 15px;
}

.about-page .page-hero p {
    font-size: 18px;
    max-width: 760px;
    margin: 0 auto;
    opacity: 0.9;
}

/* Section Base */
.about-page section {
    padding: 80px 0;
    background: #ffffff;
}

.about-page h2 {
    font-size: 30px;
    margin-bottom: 18px;
    color: #020617;
}

.about-page p {
    font-size: 16px;
    line-height: 1.8;
    color: #334155;
    margin-bottom: 18px;
}

/* Lists */
.about-page ul {
    list-style: none;
    padding-left: 0;
}

.about-page ul li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 12px;
    color: #334155;
}

.about-page ul li::before {
    content: "";
    position: absolute;
    left: 0;
    color: #22c55e;
    font-weight: 700;
}

/* Alternating Sections */
.about-page .services-section,
.about-page .compliance-section {
    background: #f8fafc;
}

/* Trust & Security Cards */
.about-page .trust-section,
.about-page .security-section {
    background: #ffffff;
}

/* CTA Section */
.about-page .cta-section {
    background: linear-gradient(135deg, #020617, #0f172a);
    color: #ffffff;
    text-align: center;
}

.about-page .cta-section h2 {
    color: #ffffff;
}

.about-page .cta-section p {
    color: #cbd5f5;
}

/* Button */
.about-page .btn-primary {
    display: inline-block;
    margin-top: 20px;
    padding: 14px 32px;
    background: #2563eb;
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    border-radius: 6px;
    transition: background 0.3s ease;
}

.about-page .btn-primary:hover {
    background: #1e40af;
}

/* Responsive */
@media (max-width: 768px) {
    .about-page .page-hero h1 {
        font-size: 30px;
    }

    .about-page h2 {
        font-size: 24px;
    }

    .about-page section {
        padding: 60px 0;
    }
}

.contact-section{
    padding:80px 20px;
    background:#f9fafb;
}
.contact-container{
    max-width:700px;
    margin:auto;
    background:#ffffff;
    padding:60px;
    border-radius:12px;
    box-shadow:0 10px 40px rgba(0,0,0,.05);
}
.contact-container h1{
    font-size:34px;
    margin-bottom:10px;
}
.contact-container p{
    margin-bottom:30px;
    color:#6b7280;
    line-height:1.7;
}
.contact-form{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.contact-form label{
    font-size:14px;
    font-weight:600;
}
.contact-form input,
.contact-form textarea,
.contact-form select{
    width:100%;
    padding:14px;
    border:1px solid #d1d5db;
    border-radius:8px;
    font-size:15px;
    font-family:Inter, sans-serif;
}
.contact-form textarea{
    min-height:120px;
    resize:vertical;
}
.contact-form button{
    margin-top:10px;
    padding:14px;
    font-size:16px;
    font-weight:600;
    background:#0087ff;
    color:#ffffff;
    border:none;
    border-radius:8px;
    cursor:pointer;
}
.contact-form button:hover{
    background:#1f2937;
}

.telegram-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 24px;
    border-radius: 8px;
    background: #229ED9;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.telegram-btn:hover {
    background: #1c8dc5;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(34, 158, 217, 0.3);
}
/* HERO ANIMATIONS */
.animate-hero .hero-anim {
    opacity: 0;
    transform: translateY(30px);
    animation: heroFadeUp 0.8s ease forwards;
}

.animate-hero .delay-1 { animation-delay: 0.2s; }
.animate-hero .delay-2 { animation-delay: 0.4s; }
.animate-hero .delay-3 { animation-delay: 0.6s; }
.animate-hero .delay-4 { animation-delay: 0.8s; }

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

/* Optional: stagger list items */
.hero-list li {
    opacity: 0;
    transform: translateX(-15px);
    animation: listFade 0.6s ease forwards;
}

.hero-list li:nth-child(1) { animation-delay: 0.8s; }
.hero-list li:nth-child(2) { animation-delay: 1s; }
.hero-list li:nth-child(3) { animation-delay: 1.2s; }
.hero-list li:nth-child(4) { animation-delay: 1.4s; }

@keyframes listFade {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.logo img {
    height: 42px;        /* adjust if needed */
    width: auto;
    display: block;
}





