@font-face {
  font-family: 'Vazirmatn';
  src: url('../../fonts/Vazirmatn-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Vazirmatn';
  src: url('../../fonts/Vazirmatn-Medium.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'Vazirmatn';
  src: url('../../fonts/Vazirmatn-Bold.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}

/* Inter برای اعداد و متن انگلیسی */
@font-face {
  font-family: 'Inter';
  src: url('../../fonts/Inter/static/Inter_24pt-Regular.ttf');
  font-weight: 400;
}

* {
      font-family: 'Vazirmatn', 'Inter', sans-serif;
    }


html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}


/* منو */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:#050816;
    font-family:Inter,sans-serif;
}

.ai-navbar{
    width:min(92%,1400px);
    margin:20px auto;
    padding:16px 24px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    position:relative;

    background:rgba(10,15,35,.65);

    border:1px solid rgba(100,140,255,.18);
    border-radius:22px;

    backdrop-filter:blur(18px);

    box-shadow:
        0 0 25px rgba(80,120,255,.08),
        inset 0 0 12px rgba(255,255,255,.02);
}

.logo{
    font-size:28px;
    font-weight:700;
    color:#fff;
    z-index:20;
}

.logo .z{
    background:linear-gradient(135deg,#00d9ff,#7a5cff);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

#menu-toggle{
    display:none;
}

.menu{
    display:flex;
    align-items:center;
    gap:30px;
    list-style:none;
}

.menu a{
    color:#d5dcff;
    text-decoration:none;
    font-size:15px;
    transition:.3s;
    position:relative;
}

.menu a::after{
    content:'';
    position:absolute;
    left:0;
    bottom:-8px;

    width:0;
    height:2px;

    background:linear-gradient(90deg,#00d9ff,#7a5cff);
    transition:.3s;
}

.menu a:hover{
    color:#fff;
}

.menu a:hover::after{
    width:100%;
}

.actions{
    display:flex;
    align-items:center;
    gap:14px;
}

.login{
    color:#fff;
    text-decoration:none;
}

.cta,
.mobile-cta a{
    padding:12px 20px;
    border-radius:14px;
    text-decoration:none;
    color:#fff;

    background:linear-gradient(135deg,#00d9ff,#7a5cff);

    box-shadow:0 0 18px rgba(122,92,255,.35);
}

.hamburger{
    display:none;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
    z-index:20;
}

.hamburger span{
    width:28px;
    height:2px;
    background:#fff;
    border-radius:10px;
}

.mobile-login,
.mobile-cta{
    display:none;
}


/* TABLET + MOBILE */

@media(max-width:980px){

    .desktop-only{
        display:none;
    }

    .hamburger{
        display:flex;
    }

    .menu{
        position:absolute;
        top:100%;
        left:0;
        right:0;

        flex-direction:column;
        gap:20px;

        background:rgba(7,10,24,.97);

        padding:30px;

        border-radius:18px;

        margin-top:12px;

        opacity:0;
        visibility:hidden;

        transform:translateY(-10px);

        transition:.3s;
    }

    .mobile-login,
    .mobile-cta{
        display:block;
    }

    #menu-toggle:checked ~ .menu{
        opacity:1;
        visibility:visible;
        transform:translateY(0);
    }
}


/* SMALL MOBILE */



.about-box{
    padding: 90px 20px;
    background: #0b1020;
    color: #fff;
}

.about-box .container{
    max-width: 1100px;
    margin: auto;
    direction: rtl;
    text-align: right;
}

.section-label{
    display: inline-block;
    color: #00e5ff;
    font-size: 14px;
    margin-bottom: 12px;
}

.about-box h2{
    font-size: 34px;
    margin-bottom: 24px;
    line-height: 1.6;
}

.about-box p{
    font-size: 17px;
    line-height: 2;
    color: #c7d2e3;
    margin-bottom: 18px;
}




.pricing-box{
    padding:90px 20px;
    background:#111827;
    color:#fff;
}

.pricing-box .container{
    max-width:1100px;
    margin:auto;
    direction:rtl;
    text-align:right;
}

.pricing-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:24px;
    margin-top:40px;
}

.price-card{
    position:relative;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:20px;
    padding:32px;
    transition:.3s;
}

.price-card:hover{
    transform:translateY(-8px);
}

.featured{
    border-color:#00e5ff;
    box-shadow:0 0 25px rgba(0,229,255,.15);
}

.badge{
    position:absolute;
    top:18px;
    left:18px;
    background:#00e5ff;
    color:#000;
    font-size:12px;
    font-weight:bold;
    padding:6px 12px;
    border-radius:20px;
}

.price-card h3{
    font-size:24px;
    margin-bottom:16px;
}

.price{
    font-size:30px;
    font-weight:bold;
    color:#00e5ff;
    margin-bottom:20px;
}

.price-card ul{
    list-style:none;
    padding:0;
    margin:0;
}

.price-card ul li{
    padding:10px 0;
    color:#cbd5e1;
    border-bottom:1px solid rgba(255,255,255,.05);
}

.pricing-note{
    margin-top:30px;
    color:#94a3b8;
}



.workflow-section{
    position: relative;
    padding: 100px 20px;
    background:
        radial-gradient(circle at top right,#00e5ff22 0%,transparent 30%),
        radial-gradient(circle at bottom left,#8b5cf622 0%,transparent 30%),
        #0b1020;
    overflow: hidden;
}

.workflow-section .container{
    max-width: 1200px;
    margin: auto;
    direction: rtl;
    text-align: center;
    color: #fff;
}

.workflow-desc{
    max-width: 700px;
    margin: 20px auto 60px;
    color: #cbd5e1;
    line-height: 2;
}

.workflow-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
    gap: 28px;
    position: relative;
    z-index: 2;
}

.workflow-card{
    position: relative;
    padding: 35px 25px;
    border-radius: 24px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    transition: .35s;
}

.workflow-card:hover{
    transform: translateY(-8px);
    box-shadow: 0 0 35px rgba(0,229,255,.15);
}

.step-circle{
    width: 72px;
    height: 72px;
    border-radius: 50%;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    background: linear-gradient(135deg,#00e5ff,#6d28d9);
    box-shadow: 0 0 25px rgba(0,229,255,.35);
}

.workflow-card h3{
    font-size: 22px;
    margin-bottom: 14px;
}

.workflow-card p{
    color: #cbd5e1;
    line-height: 1.9;
}

.workflow-line{
    position: absolute;
    top: 52%;
    left: 8%;
    right: 8%;
    height: 2px;
    background: linear-gradient(to left,#00e5ff,#6d28d9,#00e5ff);
    opacity: .35;
}



.ai-showcase {
    position: relative;
    padding: 110px 0;
    background: linear-gradient(135deg,#0f172a,#111827,#0f172a);
    overflow: hidden;
    color: white;
}

.section-title {
    text-align: center;
    margin-bottom: 60px;
    position: relative;
    z-index: 2;
}

.section-title h2 {
    font-size: 38px;
    margin-bottom: 15px;
}

.section-title p {
    max-width: 700px;
    margin: auto;
    opacity: .85;
    line-height: 2;
}

.showcase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(260px,1fr));
    gap: 30px;
    position: relative;
    z-index: 2;
}

.show-card {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(8px);
    border-radius: 24px;
    padding: 35px 25px;
    text-align: center;
    transition: .4s;
    animation: fadeUp .8s ease forwards;
    opacity: 0;
}

.show-card:nth-child(1){animation-delay:.2s;}
.show-card:nth-child(2){animation-delay:.4s;}
.show-card:nth-child(3){animation-delay:.6s;}
.show-card:nth-child(4){animation-delay:.8s;}

.show-card:hover {
    transform: translateY(-12px) scale(1.03);
    box-shadow: 0 20px 40px rgba(0,0,0,.35);
    border-color: #38bdf8;
}

.icon {
    font-size: 46px;
    margin-bottom: 18px;
    animation: floatIcon 3s ease-in-out infinite;
}

.show-card h3 {
    margin-bottom: 14px;
    font-size: 22px;
}

.show-card p {
    line-height: 1.9;
    opacity: .9;
}

/* animated background */

.bg-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: .25;
}

.bg-circle.one {
    width: 260px;
    height: 260px;
    background: #38bdf8;
    top: 60px;
    left: -50px;
    animation: moveBg 8s infinite alternate;
}

.bg-circle.two {
    width: 320px;
    height: 320px;
    background: #2563eb;
    bottom: 40px;
    right: -70px;
    animation: moveBg 10s infinite alternate;
}

/* animations */

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(40px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes floatIcon{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
}

@keyframes moveBg{
    from{
        transform:translateY(0) translateX(0);
    }
    to{
        transform:translateY(-30px) translateX(20px);
    }
}


.ai-command-center{
    position:relative;
    background: radial-gradient(circle at center,#0f172a,#020617);
    color:#fff;
    padding:120px 0;
    overflow:hidden;
}

.title-area{
    text-align:center;
    margin-bottom:80px;
}

.title-area h2{
    font-size:40px;
    margin-bottom:18px;
}

.title-area p{
    max-width:760px;
    margin:auto;
    line-height:2;
    opacity:.85;
}

.center-wrapper{
    position:relative;
    height:650px;
}

/* core */

.ai-core{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

.core-circle{
    width:150px;
    height:150px;
    border-radius:50%;
    background:linear-gradient(135deg,#2563eb,#38bdf8);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:48px;
    font-weight:bold;
    box-shadow:0 0 45px rgba(56,189,248,.45);
    z-index:5;
    position:relative;
}

.pulse-ring{
    position:absolute;
    top:50%;
    left:50%;
    border-radius:50%;
    border:2px solid rgba(56,189,248,.25);
    transform:translate(-50%,-50%);
}

.ring1{
    width:230px;
    height:230px;
    animation:pulse 3s infinite;
}

.ring2{
    width:320px;
    height:320px;
    animation:pulse 4s infinite;
}

/* nodes */

.node{
    position:absolute;
    width:240px;
    padding:28px;
    border-radius:22px;
    background:rgba(255,255,255,.05);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.08);
    text-align:center;
    transition:.35s;
    animation:floatCard 4s ease-in-out infinite;
}

.node:hover{
    transform:scale(1.05);
    box-shadow:0 18px 45px rgba(0,0,0,.35);
}

.node .icon{
    font-size:38px;
    margin-bottom:14px;
}

.top-left{
    top:40px;
    left:8%;
}

.top-right{
    top:40px;
    right:8%;
}

.bottom-left{
    bottom:40px;
    left:8%;
}

.bottom-right{
    bottom:40px;
    right:8%;
}

/* connection lines */

.top-left::after,
.top-right::after,
.bottom-left::after,
.bottom-right::after{
    content:'';
    position:absolute;
    width:140px;
    height:2px;
    background:linear-gradient(to right,#38bdf8,transparent);
    top:50%;
}

.top-left::after{
    right:-120px;
}

.bottom-left::after{
    right:-120px;
}

.top-right::after{
    left:-120px;
}

.bottom-right::after{
    left:-120px;
}

/* animations */

@keyframes pulse{
    0%{
        transform:translate(-50%,-50%) scale(.8);
        opacity:1;
    }
    100%{
        transform:translate(-50%,-50%) scale(1.2);
        opacity:0;
    }
}

@keyframes floatCard{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-12px);
    }
}




/* smooth scroll */
html {
    scroll-behavior: smooth;
}

/* reveal animation */

.reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s ease,
        transform .8s ease;
    will-change: opacity, transform;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* sections spacing */

section {
    position: relative;
    overflow: hidden;
}

/* subtle hover */

.card,
.price-card,
.show-card,
.service-box {
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.card:hover,
.price-card:hover,
.show-card:hover,
.service-box:hover {
    transform: translateY(-6px);
}

/* links/buttons */

a,
button {
    transition:
        all .25s ease;
}

button:hover,
a:hover {
    transform: translateY(-2px);
}

/* floating background */

.bg-float {
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(59,130,246,.06);
    filter: blur(70px);
    animation: float-bg 10s ease-in-out infinite;
    pointer-events: none;
}

@keyframes float-bg {
    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-25px);
    }
}




.robot-footer{
    position:relative;
    background:
        radial-gradient(circle at center,#111827,#030712);
    color:#fff;
    overflow:hidden;
    padding-top:90px;
}

/* overlay */

.footer-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.02),
            transparent
        );
}

/* robots */

.robot{
    position:absolute;
    font-size:110px;
    top:40px;
    z-index:2;
    animation: robot-float 3s ease-in-out infinite;
    filter: drop-shadow(0 0 18px rgba(59,130,246,.4));
}

.robot-left{
    left:8%;
}

.robot-right{
    right:8%;
    animation-delay:.8s;
}

/* fire */

.fire{
    position:absolute;
    width:180px;
    height:180px;
    border-radius:50%;
    filter:blur(55px);
    opacity:.55;
    z-index:1;
}

.fire-left{
    background:#f97316;
    left:30%;
    top:100px;
    animation: fireMove 3s infinite;
}

.fire-right{
    background:#ef4444;
    right:30%;
    top:100px;
    animation: fireMove 4s infinite;
}

/* layout */

.footer-top{
    position:relative;
    z-index:5;
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:40px;
    padding:160px 0 70px;
}

.footer-brand h2{
    font-size:34px;
    margin-bottom:18px;
    color:#38bdf8;
}

.footer-brand p{
    line-height:2;
    opacity:.9;
}

.footer-links h4{
    margin-bottom:18px;
    color:#fff;
}

.footer-links ul{
    list-style:none;
    direction: rtl;
    padding:0;
}

.footer-links li{
    margin-bottom:12px;
}

.footer-links a{
    color:#cbd5e1;
    text-decoration:none;
    transition:.25s;
}

.footer-links a:hover{
    color:#38bdf8;
    padding-right:8px;
}

.footer-bottom{
    position:relative;
    z-index:5;
    border-top:1px solid rgba(255,255,255,.08);
    text-align:center;
    padding:22px 0;
    color:#94a3b8;
}

/* animations */

@keyframes robot-float{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-12px);
    }
}

@keyframes fireMove{
    0%,100%{
        transform:scale(1);
        opacity:.45;
    }
    50%{
        transform:scale(1.2);
        opacity:.75;
    }
}

/* responsive */

@media(max-width:900px){

    .footer-top{
        grid-template-columns:1fr;
        text-align:center;
        padding-top:120px;
    }

    .robot{
        font-size:70px;
    }

    .robot-left{
        left:15px;
    }

    .robot-right{
        right:15px;
    }
}



.floating-buttons{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:9999;
    display:flex;
    flex-direction:column;
    gap:12px;
}

/* base */

.float-btn{
    border:none;
    cursor:pointer;
    border-radius:50%;
    width:56px;
    height:56px;
    font-size:22px;
    transition:.25s;
    box-shadow:
        0 8px 25px rgba(0,0,0,.18);
}

/* up/down */

.nav-btn{
    background:#0f172a;
    color:#fff;
}

.nav-btn:hover{
    transform:translateY(-4px);
    background:#1e293b;
}

/* contact */

.contact-widget{
    position:relative;

}

.contact-main{
    background:linear-gradient(
        135deg,
        #2563eb,
        #38bdf8
    );
    color:#fff;
    font-size:24px;
    animation:pulseContact 2.2s infinite;
}

.contact-main:hover{
    transform:scale(1.06);
}

/* menu */

.contact-menu{
    position:absolute;
    bottom:70px;
    right:0;
    display:flex;
    flex-direction:column;
    gap:10px;
    direction:rtl;

    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
    transition:.25s;
}

.contact-widget.open .contact-menu{
    opacity:1;
    direction:rtl;
    visibility:visible;
    transform:translateY(0);
}

.contact-menu a{
    background:#fff;
    color:#111827;
    text-decoration:none;
    padding:12px 18px;
    border-radius:14px;
    white-space:nowrap;
    box-shadow:
        0 10px 25px rgba(0,0,0,.12);
    transition:.25s;
    font-size:14px;
}

.contact-menu a:hover{
    transform:translateX(-5px);
    background:#f8fafc;
}

/* pulse */

@keyframes pulseContact{

    0%,100%{
        box-shadow:
            0 0 0 0 rgba(56,189,248,.4);
    }

    70%{
        box-shadow:
            0 0 0 14px rgba(56,189,248,0);
    }
}

/* mobile */

@media(max-width:768px){

    .float-btn{
        width:50px;
        height:50px;
    }

    .contact-menu a{
        font-size:13px;
        padding:10px 14px;
    }
}





.contact-section{
    position:relative;
    padding:110px 0;
    overflow:hidden;
    background:
        linear-gradient(
            135deg,
            #f8fafc,
            #eef6ff
        );
}

.contact-bg{
    position:absolute;
    inset:0;
    background:
        radial-gradient(
            circle at 20% 30%,
            rgba(37,99,235,.10),
            transparent 40%
        ),
        radial-gradient(
            circle at 80% 70%,
            rgba(56,189,248,.12),
            transparent 40%
        );
    animation:bgFloat 10s ease-in-out infinite;
}

.contact-header{
    position:relative;
    z-index:2;
    text-align:center;
    max-width:800px;
    margin:auto;
    margin-bottom:55px;
}

.mini-title{
    display:inline-block;
    background:#dbeafe;
    color:#2563eb;
    padding:8px 16px;
    border-radius:30px;
    font-size:14px;
    margin-bottom:18px;
}

.contact-header h2{
    font-size:34px;
    line-height:1.8;
    color:#0f172a;
    margin-bottom:18px;
}

.contact-header p{
    color:#475569;
    line-height:2;
}

.contact-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:
        repeat(auto-fit,minmax(240px,1fr));
    gap:22px;
}

.contact-card{
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(10px);
    border-radius:24px;
    padding:30px;
    text-decoration:none;
    color:#111827;
    box-shadow:
        0 12px 35px rgba(15,23,42,.08);
    transition:.35s;
    animation:fadeUp .8s ease both;
}

.contact-card:hover{
    transform:
        translateY(-10px)
        scale(1.02);
    box-shadow:
        0 18px 40px rgba(37,99,235,.15);
}

.contact-card .icon{
    width:62px;
    height:62px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:26px;
    background:
        linear-gradient(
            135deg,
            #2563eb,
            #38bdf8
        );
    color:#fff;
    margin-bottom:18px;
}

.contact-card h4{
    font-size:20px;
    margin-bottom:10px;
}

.contact-card span{
    color:#64748b;
    font-size:15px;
}

/* animations */

@keyframes fadeUp{

    from{
        opacity:0;
        transform:
            translateY(40px);
    }

    to{
        opacity:1;
        transform:
            translateY(0);
    }
}

@keyframes bgFloat{

    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-18px);
    }
}

/* mobile */

@media(max-width:768px){

    .contact-header h2{
        font-size:28px;
    }

    .contact-section{
        padding:80px 0;
    }
}

p ,h1, h2, h3, h4, h5, h6{
    direction:rtl;
}





body{
    margin:0;
    font-family:sans-serif;
    background:#0b1020;
}

/* section */
.auth-section{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden;
}

/* glowing background */
.bg-glow{
    position:absolute;
    width:500px;
    height:500px;
    background: radial-gradient(circle,#38bdf8 0%,transparent 60%);
    filter: blur(80px);
    opacity:.15;
    animation: floatGlow 8s infinite ease-in-out;
}

/* card */
.auth-card{
    width:100%;
    max-width:420px;
    padding:40px;
    border-radius:26px;

    background: rgba(255,255,255,0.06);
    backdrop-filter: blur(16px);

    border:1px solid rgba(255,255,255,0.1);

    box-shadow: 0 25px 70px rgba(0,0,0,0.5);

    animation: fadeUp .8s ease;
    position:relative;
    z-index:2;
}

/* header */
.auth-header h2{
    color:#fff;
    text-align:center;
    margin-bottom:6px;
}

.auth-header p{
    text-align:center;
    color:#94a3b8;
    margin-bottom:25px;
    font-size:14px;
}

/* inputs */
.auth-card input{
    width:100%;
    padding:14px 16px;
    margin-bottom:14px;

    border-radius:14px;
    border:1px solid rgba(255,255,255,0.12);

    background: rgba(0,0,0,0.3);
    color:#fff;

    outline:none;
    transition:.3s;
}

.auth-card input:focus{
    border-color:#38bdf8;
    box-shadow:0 0 0 3px rgba(56,189,248,0.15);
    transform:translateY(-2px);
}

/* button */
.auth-card button{
    width:100%;
    padding:14px;

    border:none;
    border-radius:14px;

    background: linear-gradient(135deg,#2563eb,#38bdf8);
    color:white;

    font-size:16px;
    cursor:pointer;

    transition:.3s;
}

.auth-card button:hover{
    transform:translateY(-3px);
    box-shadow:0 15px 35px rgba(37,99,235,0.4);
}

/* divider */
.divider{
    margin:20px 0;
    display:flex;
    align-items:center;
    color:#64748b;
    font-size:12px;
}

.divider::before,
.divider::after{
    content:"";
    flex:1;
    height:1px;
    background:rgba(255,255,255,0.1);
}

.divider span{
    padding:0 10px;
}

/* login link */
.login-link{
    display:block;
    text-align:center;
    color:#38bdf8;
    text-decoration:none;
    padding:10px;
    border-radius:12px;
    transition:.3s;
}

.login-link:hover{
    background:rgba(56,189,248,0.08);
    transform:translateY(-2px);
}

/* animations */
@keyframes fadeUp{
    from{opacity:0;transform:translateY(30px);}
    to{opacity:1;transform:translateY(0);}
}

@keyframes floatGlow{
    0%,100%{transform:translate(0,0);}
    50%{transform:translate(60px,-40px);}
}





.auth-card{
    position:relative;
    border-radius:26px;
    padding:40px;
    background: rgba(255,255,255,0.06);
    backdrop-filter: blur(16px);
    z-index:1;
}

/* 🔥 neon fire border */
.auth-card::before{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:28px;
    background: linear-gradient(
        90deg,
        #00e5ff,
        #2563eb,
        #38bdf8,
        #00e5ff
    );
    background-size:300% 300%;
    z-index:-1;
    filter: blur(6px);
    animation: fireBorder 3s linear infinite;
    opacity:.8;
}

/* inner cut to make it border effect */
.auth-card::after{
    content:"";
    position:absolute;
    inset:2px;
    border-radius:24px;
    background: rgba(15,23,42,0.92);
    z-index:-1;
}

/* animation */
@keyframes fireBorder{
    0%{
        background-position:0% 50%;
    }
    100%{
        background-position:300% 50%;
    }
}