#auth1{background:#fff;}
#auth1 .auth1grid{
    min-height:100vh;
    display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:0;
}
#auth1 .auth1grid .s{}
#auth1 .auth1grid .sform{
    align-self:stretch;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:clamp(24px,4vw,48px) clamp(16px,3vw,40px);
    background:#fff;
}
#auth1 .auth1grid .s.sside{}
#auth1 .auth1grid .s.sside.sleft{}
#auth1 .auth1grid .s.sside.sright{}

@media only screen and (max-width:1000px) {
    #auth1 .auth1grid{grid-template-columns:1fr 2fr 1fr;}
}
@media only screen and (max-width:700px) {
    #auth1 .auth1grid{grid-template-columns:1fr 3fr 1fr;}
}







/* —— form column —— */
#auth1 .auth1-formwrap{
    width:100%;
    max-width:440px;
    margin:0 auto;
}

#auth1 .auth1-navlinks{
    margin-bottom:clamp(20px,3vw,28px);
}
#auth1 .auth1-navlinks__list{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:8px 6px;
    justify-content:center;
}
#auth1 .auth1-navlinks__link{
    display:inline-block;
    padding:6px 14px;
    font-size:.8125rem;
    color:#475569;
    background:#f1f5f9;
    border-radius:999px;
    transition:color .2s ease, background .2s ease, box-shadow .2s ease;
}
#auth1 .auth1-navlinks__link:hover{
    color:#023f5c;
    background:#e2e8f0;
    box-shadow:0 2px 8px rgba(2,63,92,.08);
}

#auth1 .auth1-formhead{
    text-align:center;
    margin-bottom:24px;
}
#auth1 .auth1-formhead__title{
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    font-size:clamp(1.5rem,4vw,1.875rem);
    color:#0f172a;
    line-height:1.2;
    margin-bottom:8px;
}
#auth1 .auth1-formhead__sub{
    font-size:.9375rem;
    color:#64748b;
    line-height:1.5;
}
#auth1 .auth1-formhead__sub a{
    color:#023f5c;
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    text-decoration:underline;
    text-underline-offset:3px;
}
#auth1 .auth1-formhead__sub a:hover{
    color:#0e7490;
}
#auth1 .auth1-formhead__sub--warn{
    color:#b45309;
}

#auth1 .authform1-formfoot{
    margin:4px 0 0;
    text-align:right;
    font-size:.875rem;
}
#auth1 .authform1-formfoot a{
    color:#023f5c;
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    text-decoration:underline;
    text-underline-offset:3px;
}
#auth1 .authform1-formfoot a:hover{
    color:#0e7490;
}

#auth1 .auth1-google-hero{
    margin:0 0 20px;
    padding:18px 18px 16px;
    text-align:center;
    background:linear-gradient(180deg, #f0f9ff 0%, #fff 100%);
    border:2px solid #bae6fd;
    border-radius:16px;
    box-shadow:0 10px 28px rgba(2, 132, 199, 0.12);
}
#auth1 .auth1-google-hero__eyebrow{
    margin:0 0 12px;
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#0369a1;
}
#auth1 .auth1-google-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    width:100%;
    padding:14px 20px;
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    font-size:1rem;
    color:#1e293b;
    text-decoration:none;
    background:#fff;
    border:2px solid #e2e8f0;
    border-radius:12px;
    cursor:pointer;
    box-sizing:border-box;
    box-shadow:0 4px 14px rgba(15,23,42,.06);
    transition:border-color .2s ease, box-shadow .2s ease, transform .15s ease;
}
#auth1 .auth1-google-btn--hero{
    padding:16px 22px;
    font-size:1.0625rem;
    border-color:#cbd5e1;
    box-shadow:0 6px 18px rgba(15,23,42,.08);
}
#auth1 .auth1-google-btn:hover{
    border-color:#94a3b8;
    box-shadow:0 8px 24px rgba(15,23,42,.12);
    transform:translateY(-1px);
}
#auth1 .auth1-google-btn--hero:hover{
    border-color:#0284c7;
    box-shadow:0 10px 28px rgba(2, 132, 199, 0.18);
}
#auth1 .auth1-google-btn:active{
    transform:translateY(0);
}
#auth1 .auth1-google-btn__icon{
    display:flex;
    flex-shrink:0;
}

#auth1 .auth1-alert{
    margin:0 0 16px;
    padding:12px 14px;
    font-size:.875rem;
    line-height:1.45;
    border-radius:10px;
}
#auth1 .auth1-alert--error{
    color:#991b1b;
    background:#fef2f2;
    border:1px solid #fecaca;
}

#auth1 .auth1-divider{
    display:flex;
    align-items:center;
    gap:16px;
    margin:22px 0 24px;
    color:#94a3b8;
    font-size:.8125rem;
}
#auth1 .auth1-divider--after-google{
    margin:0 0 22px;
}
#auth1 .auth1-divider::before,
#auth1 .auth1-divider::after{
    content:"";
    flex:1;
    height:1px;
    background:linear-gradient(90deg, transparent, #e2e8f0, transparent);
}
#auth1 .auth1-divider__text{
    flex-shrink:0;
    text-transform:lowercase;
}

/* —— signup form —— */
#auth1 .authform1{}

#auth1 .authform1-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px 14px;
}
#auth1 .authform1-field--full{
    grid-column:1 / -1;
}
#auth1 .authform1-label{
    display:block;
    margin-bottom:6px;
    font-size:.8125rem;
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    color:#334155;
}
#auth1 .authform1-input{
    width:100%;
    box-sizing:border-box;
    padding:12px 14px;
    font-size:.9375rem;
    font-family:poppins, Arial, sans-serif;
    color:#0f172a;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:10px;
    transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
#auth1 .authform1-input::placeholder{
    color:#94a3b8;
}
#auth1 .authform1-input:hover{
    border-color:#cbd5e1;
}
#auth1 .authform1-input:focus{
    background:#fff;
    border-color:#023f5c;
    box-shadow:0 0 0 3px rgba(2,63,92,.12);
}

#auth1 .authform1-phone{
    display:grid;
    grid-template-columns:minmax(108px, 34%) 1fr;
    gap:10px;
}
#auth1 .authform1-phone__code{
    padding-left:10px;
    padding-right:8px;
    font-size:.875rem;
}
#auth1 .authform1-phone__hint{
    margin:8px 0 0;
    font-size:.75rem;
    color:#64748b;
    line-height:1.4;
}
#auth1 .authform1-input--digits2{
    max-width:120px;
    letter-spacing:.2em;
    text-align:center;
    font-variant-numeric:tabular-nums;
}
#auth1 select.authform1-input{
    cursor:pointer;
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 10px center;
    padding-right:28px;
}

#auth1 .authform1 .submit_line{
    margin-top:26px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
}
#auth1 .authform1 .submit_line img.submit_loading{
    display:none;
    height:20px;
    width:auto;
}
#auth1 .authform1 .submit_line button.submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    max-width:100%;
    padding:14px 40px;
    background:linear-gradient(135deg, #023f5c, #0e7490);
    color:#fff;
    font-size:1rem;
    font-family:"poppins_semibold", poppins, Arial, sans-serif;
    border:none;
    border-radius:12px;
    cursor:pointer;
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
    box-shadow:0 4px 18px rgba(2,63,92,.35);
}
#auth1 .authform1 .submit_line button.submit:hover{
    filter:brightness(1.05);
    box-shadow:0 6px 22px rgba(2,63,92,.42);
    transform:translateY(-1px);
}
#auth1 .authform1 .submit_line button.submit .micon{
    font-size:1.125rem;
}

@media only screen and (max-width:700px) {
    #auth1 .auth1grid .sform{
        padding:20px 14px 28px;
    }
    #auth1 .authform1-grid{
        grid-template-columns:1fr;
    }
    #auth1 .authform1-field--half{
        grid-column:1;
    }
    #auth1 .authform1-phone{
        grid-template-columns:1fr;
    }
}








/* —— animated side panels —— */
#auth1 .auth1grid .s.sside{
    --auth1-blur:36px;
    --auth1-mesh-dur:20s;
    --auth1-grid-size:32px;
    --auth1-grid-dur:8s;
    position:relative;
    overflow:hidden;
    background:#0f172a;
    background-image:linear-gradient(
        -45deg,
        #0f172a 0%,
        #1e3a8a 25%,
        #312e81 50%,
        #0e7490 75%,
        #0f172a 100%
    );
    background-size:400% 400%;
    animation:auth1-bg-flow 14s ease infinite;
    isolation:isolate;
}

#auth1 .auth1grid .s.sside .auth1-side-deco{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
}

#auth1 .auth1grid .s.sside .auth1-side-canvas{
    position:absolute;
    inset:0;
    z-index:2;
    width:100%;
    height:100%;
    pointer-events:none;
    opacity:.85;
}

#auth1 .auth1grid .s.sside .auth1-side-deco::before{
    content:"";
    position:absolute;
    inset:-50%;
    background:
        radial-gradient(circle at 30% 40%, rgba(56,189,248,.35) 0%, transparent 45%),
        radial-gradient(circle at 70% 60%, rgba(167,139,250,.3) 0%, transparent 40%),
        radial-gradient(circle at 50% 90%, rgba(45,212,191,.25) 0%, transparent 50%);
    animation:auth1-mesh-spin var(--auth1-mesh-dur) linear infinite;
}

#auth1 .auth1grid .s.sside .auth1-blob{
    position:absolute;
    display:block;
    border-radius:50%;
    filter:blur(var(--auth1-blur));
    opacity:.85;
    will-change:transform, border-radius;
}

#auth1 .auth1grid .s.sside .auth1-blob--1{
    width:min(70%, 200px);height:min(70%, 200px);
    left:0;top:8%;
    background:linear-gradient(135deg, #38bdf8, #6366f1);
    animation:auth1-float-1 7s ease-in-out infinite;
}
#auth1 .auth1grid .s.sside .auth1-blob--2{
    width:min(65%, 170px);height:min(65%, 170px);
    right:-5%;top:35%;
    background:linear-gradient(160deg, #818cf8, #2dd4bf);
    animation:auth1-float-2 9s ease-in-out infinite;
}
#auth1 .auth1grid .s.sside .auth1-blob--3{
    width:min(60%, 140px);height:min(60%, 140px);
    left:15%;bottom:5%;
    background:linear-gradient(120deg, #22d3ee, #4f46e5);
    animation:auth1-float-3 8s ease-in-out infinite;
}
#auth1 .auth1grid .s.sside .auth1-blob--4{
    width:min(55%, 110px);height:min(55%, 110px);
    right:10%;bottom:22%;
    background:linear-gradient(200deg, #a78bfa, #38bdf8);
    opacity:.7;
    animation:auth1-float-4 6s ease-in-out infinite;
}
#auth1 .auth1grid .s.sside .auth1-blob--5{
    width:min(48%, 90px);height:min(48%, 90px);
    left:35%;top:42%;
    background:radial-gradient(circle at 30% 30%, #5eead4, #6366f1);
    animation:auth1-float-5 5s ease-in-out infinite;
}
#auth1 .auth1grid .s.sside .auth1-blob--6{
    width:min(42%, 70px);height:min(42%, 70px);
    right:25%;top:6%;
    background:#f472b6;
    opacity:.6;
    animation:auth1-float-6 7.5s ease-in-out infinite;
}

#auth1 .auth1grid .s.sside .auth1-side-deco::after{
    content:"";
    position:absolute;
    width:160%;height:160%;
    left:-30%;top:-30%;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:var(--auth1-grid-size) var(--auth1-grid-size);
    mask-image:radial-gradient(ellipse 80% 80% at 50% 50%, #000 10%, transparent 70%);
    animation:auth1-grid-drift var(--auth1-grid-dur) linear infinite;
    opacity:.7;
}

#auth1 .auth1grid .s.sright .auth1-blob--1{animation-delay:-2s;}
#auth1 .auth1grid .s.sright .auth1-blob--2{animation-delay:-5s;}
#auth1 .auth1grid .s.sright .auth1-blob--3{animation-delay:-1s;}

@keyframes auth1-bg-flow{
    0%{background-position:0% 50%;}
    50%{background-position:100% 50%;}
    100%{background-position:0% 50%;}
}
@keyframes auth1-mesh-spin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}
@keyframes auth1-float-1{
    0%,100%{transform:translate(0,0) scale(1);border-radius:50% 45% 55% 50%;}
    50%{transform:translate(35px,55px) scale(1.2);border-radius:45% 55% 50% 50%;}
}
@keyframes auth1-float-2{
    0%,100%{transform:translate(0,0) rotate(0deg);}
    50%{transform:translate(-45px,-35px) rotate(25deg) scale(1.15);}
}
@keyframes auth1-float-3{
    0%,100%{transform:translate(0,0);}
    33%{transform:translate(25px,-50px);}
    66%{transform:translate(-40px,-15px);}
}
@keyframes auth1-float-4{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-30px,45px) scale(1.25);}
}
@keyframes auth1-float-5{
    0%,100%{transform:translate(0,0);opacity:.5;}
    50%{transform:translate(50px,-30px);opacity:.9;}
}
@keyframes auth1-float-6{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(20px,50px) scale(1.3);}
}
@keyframes auth1-grid-drift{
    from{transform:translate(0,0);}
    to{transform:translate(var(--auth1-grid-size),var(--auth1-grid-size));}
}

/* tablet: narrower side columns (1fr / 4fr total) */
@media only screen and (max-width:1000px) {
    #auth1 .auth1grid .s.sside{
        --auth1-blur:28px;
        --auth1-mesh-dur:24s;
        --auth1-grid-size:24px;
        --auth1-grid-dur:10s;
    }
    #auth1 .auth1grid .s.sside .auth1-blob--1{animation-name:auth1-float-1-md;}
    #auth1 .auth1grid .s.sside .auth1-blob--2{animation-name:auth1-float-2-md;}
    #auth1 .auth1grid .s.sside .auth1-blob--3{animation-name:auth1-float-3-md;}
    #auth1 .auth1grid .s.sside .auth1-blob--4{animation-name:auth1-float-4-md;}
    #auth1 .auth1grid .s.sside .auth1-blob--5{animation-name:auth1-float-5-md;}
    #auth1 .auth1grid .s.sside .auth1-blob--6{animation-name:auth1-float-6-md;}

    @keyframes auth1-float-1-md{
        0%,100%{transform:translate(0,0) scale(1);}
        50%{transform:translate(18px,28px) scale(1.12);}
    }
    @keyframes auth1-float-2-md{
        0%,100%{transform:translate(0,0) rotate(0deg);}
        50%{transform:translate(-22px,-18px) rotate(18deg) scale(1.08);}
    }
    @keyframes auth1-float-3-md{
        0%,100%{transform:translate(0,0);}
        50%{transform:translate(14px,-28px);}
    }
    @keyframes auth1-float-4-md{
        0%,100%{transform:translate(0,0) scale(1);}
        50%{transform:translate(-16px,24px) scale(1.12);}
    }
    @keyframes auth1-float-5-md{
        0%,100%{transform:translate(0,0);opacity:.5;}
        50%{transform:translate(24px,-16px);opacity:.85;}
    }
    @keyframes auth1-float-6-md{
        0%,100%{transform:translate(0,0) scale(1);}
        50%{transform:translate(12px,26px) scale(1.15);}
    }
}

/* mobile: thinnest side columns (1fr / 5fr total) */
@media only screen and (max-width:700px) {
    #auth1 .auth1grid .s.sside{
        --auth1-blur:18px;
        --auth1-mesh-dur:28s;
        --auth1-grid-size:18px;
        --auth1-grid-dur:12s;
    }
    #auth1 .auth1grid .s.sside .auth1-blob--5,
    #auth1 .auth1grid .s.sside .auth1-blob--6{
        display:none;
    }
    #auth1 .auth1grid .s.sside .auth1-blob--1{animation-name:auth1-float-1-sm;animation-duration:6s;}
    #auth1 .auth1grid .s.sside .auth1-blob--2{animation-name:auth1-float-2-sm;animation-duration:7s;}
    #auth1 .auth1grid .s.sside .auth1-blob--3{animation-name:auth1-float-3-sm;animation-duration:6.5s;}
    #auth1 .auth1grid .s.sside .auth1-blob--4{animation-name:auth1-float-4-sm;animation-duration:5.5s;}

    @keyframes auth1-float-1-sm{
        0%,100%{transform:translate(0,0) scale(1);}
        50%{transform:translate(8px,14px) scale(1.08);}
    }
    @keyframes auth1-float-2-sm{
        0%,100%{transform:translate(0,0);}
        50%{transform:translate(-10px,-8px) scale(1.06);}
    }
    @keyframes auth1-float-3-sm{
        0%,100%{transform:translate(0,0);}
        50%{transform:translate(6px,-12px);}
    }
    @keyframes auth1-float-4-sm{
        0%,100%{transform:translate(0,0) scale(1);}
        50%{transform:translate(-8px,10px) scale(1.08);}
    }
}

@media (prefers-reduced-motion:reduce){
    #auth1 .auth1grid .s.sside{
        animation:none;
        background-size:auto;
    }
    #auth1 .auth1grid .s.sside .auth1-blob,
    #auth1 .auth1grid .s.sside .auth1-side-deco::before,
    #auth1 .auth1grid .s.sside .auth1-side-deco::after{
        animation:none;
    }
    #auth1 .auth1grid .s.sside .auth1-side-canvas{
        display:none;
    }
}
