/* ==========================================================
   REPLIXA · AI GLOBAL BRAND + DEEP OCEAN 3D UI
   PURE CSS / NO IMAGE ASSETS
   ========================================================== */

:root{
    --rx-purple:#a855f7;
    --rx-purple-2:#7c3aed;
    --rx-blue:#38bdf8;
    --rx-blue-2:#0ea5e9;
    --rx-ocean-0:#020617;
    --rx-ocean-1:#031329;
    --rx-ocean-2:#05234a;
    --rx-ocean-3:#063b69;
}

/* ------------------------------
   GLOBAL BRAND
   ------------------------------ */

.rx-brand{
    display:inline-flex;
    align-items:center;
    gap:.08em;
    line-height:1;
    white-space:nowrap;
    font-weight:900;
    letter-spacing:-.045em;
    transform-style:preserve-3d;
    filter:drop-shadow(0 0 10px rgba(56,189,248,.08));
}

.rx-brand-replixa{
    display:inline-block;
    color:var(--rx-purple);
    transform:skewX(-13deg) rotateY(-4deg);
    transform-origin:right center;
    text-shadow:
        0 0 14px rgba(168,85,247,.22),
        0 0 32px rgba(124,58,237,.08);
}

.rx-brand-dot{
    display:inline-block;
    margin:0 .10em;
    color:#c4b5fd;
    transform:translateY(-.03em);
    text-shadow:0 0 12px rgba(196,181,253,.45);
}

.rx-brand-ai{
    display:inline-block;
    color:var(--rx-blue);
    transform:skewX(11deg) rotateY(4deg);
    transform-origin:left center;
    text-shadow:
        0 0 14px rgba(56,189,248,.25),
        0 0 32px rgba(14,165,233,.08);
}

a .rx-brand,
a.rx-brand{
    text-decoration:none;
}

header .rx-brand,
nav .rx-brand{
    font-size:1.18em;
}

/* ------------------------------
   GLOBAL PAGE OCEAN
   ------------------------------ */

html{
    background:#020617;
}

body{
    position:relative;
    min-height:100vh;
    overflow-x:hidden;
    background:
        radial-gradient(
            circle at 50% -12%,
            rgba(56,189,248,.19),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            rgba(3,18,42,.96) 0%,
            rgba(2,12,31,.98) 42%,
            rgba(2,6,23,1) 100%
        ) !important;
}

/*
 * All ocean animation lives behind page content.
 */
.rx-ocean-world{
    position:fixed;
    inset:0;
    z-index:-10;
    pointer-events:none;
    overflow:hidden;
    perspective:1100px;
    transform-style:preserve-3d;
}

/* deep moving body of water */
.rx-ocean-depth{
    position:absolute;
    inset:-18%;
    background:
        radial-gradient(
            ellipse at 50% 5%,
            rgba(56,189,248,.19),
            transparent 31%
        ),
        radial-gradient(
            ellipse at 12% 44%,
            rgba(14,165,233,.10),
            transparent 28%
        ),
        radial-gradient(
            ellipse at 86% 58%,
            rgba(124,58,237,.11),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #04172f 0%,
            #031227 43%,
            #020817 100%
        );
    transform:
        rotateX(5deg)
        translateZ(-100px)
        scale(1.16);
    animation:rxOceanDepth 19s ease-in-out infinite alternate;
}

/* animated surface caustics */
.rx-ocean-caustics{
    position:absolute;
    inset:-30%;
    opacity:.36;
    background:
        repeating-radial-gradient(
            ellipse at 50% 0%,
            transparent 0 28px,
            rgba(56,189,248,.05) 31px 33px,
            transparent 36px 70px
        );
    filter:blur(1.5px);
    transform:
        rotateX(66deg)
        rotateZ(-5deg)
        translate3d(0,-34%,120px)
        scale(1.35);
    animation:rxCaustics 14s linear infinite;
}

/* shafts of light from surface */
.rx-ocean-rays{
    position:absolute;
    left:50%;
    top:-24%;
    width:82vw;
    height:115vh;
    transform:
        translateX(-50%)
        rotateX(5deg)
        translateZ(-30px);
    transform-origin:top center;
    background:
        conic-gradient(
            from 173deg at 50% 0%,
            transparent 0deg,
            rgba(56,189,248,.00) 4deg,
            rgba(56,189,248,.085) 7deg,
            transparent 11deg,
            transparent 17deg,
            rgba(125,211,252,.07) 21deg,
            transparent 26deg,
            transparent 34deg,
            rgba(56,189,248,.045) 38deg,
            transparent 44deg
        );
    filter:blur(11px);
    opacity:.88;
    animation:rxRays 10s ease-in-out infinite alternate;
}

/* distant fog volumes */
.rx-ocean-fog{
    position:absolute;
    width:62vw;
    height:62vw;
    border-radius:50%;
    filter:blur(90px);
    opacity:.13;
    transform:translateZ(-180px);
}

.rx-ocean-fog-a{
    left:-18vw;
    bottom:-30vw;
    background:#0ea5e9;
    animation:rxFogA 21s ease-in-out infinite alternate;
}

.rx-ocean-fog-b{
    right:-20vw;
    top:12vh;
    background:#7c3aed;
    animation:rxFogB 24s ease-in-out infinite alternate;
}

/* subtle bottom seabed */
.rx-ocean-floor{
    position:absolute;
    left:-15%;
    right:-15%;
    bottom:-25vh;
    height:56vh;
    border-radius:50% 50% 0 0;
    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(56,189,248,.09),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            rgba(5,23,46,.8),
            rgba(2,6,23,1)
        );
    box-shadow:
        inset 0 70px 90px rgba(2,132,199,.05);
    transform:
        rotateX(58deg)
        translateZ(-120px);
    animation:rxFloor 18s ease-in-out infinite alternate;
}

/* bubbles / particles */
.rx-ocean-bubble{
    position:absolute;
    bottom:-90px;
    left:var(--x);
    width:var(--size);
    height:var(--size);
    border-radius:50%;
    border:1px solid rgba(186,230,253,.32);
    background:
        radial-gradient(
            circle at 32% 28%,
            rgba(255,255,255,.33),
            rgba(125,211,252,.07) 35%,
            rgba(14,165,233,.015) 65%
        );
    box-shadow:
        inset 0 0 10px rgba(186,230,253,.10),
        0 0 10px rgba(56,189,248,.06);
    opacity:var(--opacity);
    transform:translateZ(var(--z));
    animation:
        rxBubbleRise var(--duration) linear infinite;
    animation-delay:var(--delay);
}

/* subtle glass enhancement */
.card,
.rx-billing-card,
.rx-build-stat,
section.card{
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

/* ------------------------------
   GLOBAL FOOTER
   ------------------------------ */

.rx-global-footer{
    position:relative;
    z-index:2;
    margin-top:54px;
    padding:32px 20px 38px;
    text-align:center;
    border-top:1px solid rgba(96,165,250,.16);
    background:
        linear-gradient(
            180deg,
            rgba(2,6,23,.25),
            rgba(2,6,23,.72)
        );
    backdrop-filter:blur(12px);
}

.rx-global-footer-brand{
    margin-bottom:12px;
    font-size:1.24rem;
}

.rx-global-footer-created{
    color:#cbd5e1;
    font-size:.93rem;
}

.rx-global-footer-email{
    display:inline-block;
    margin-top:7px;
    color:#7dd3fc;
    text-decoration:none;
    font-size:.92rem;
}

.rx-global-footer-email:hover{
    color:#bae6fd;
    text-decoration:underline;
}

/* ------------------------------
   MOTION
   ------------------------------ */

@keyframes rxOceanDepth{
    0%{
        transform:
            rotateX(5deg)
            translate3d(-1.2%,0,-100px)
            scale(1.16);
    }

    100%{
        transform:
            rotateX(7deg)
            translate3d(1.4%,1.2%,-75px)
            scale(1.20);
    }
}

@keyframes rxCaustics{
    0%{
        transform:
            rotateX(66deg)
            rotateZ(-6deg)
            translate3d(-3%,-35%,120px)
            scale(1.35);
    }

    50%{
        transform:
            rotateX(64deg)
            rotateZ(4deg)
            translate3d(3%,-31%,145px)
            scale(1.42);
    }

    100%{
        transform:
            rotateX(66deg)
            rotateZ(-6deg)
            translate3d(-3%,-35%,120px)
            scale(1.35);
    }
}

@keyframes rxRays{
    0%{
        opacity:.55;
        transform:
            translateX(-50%)
            rotateZ(-2deg)
            translateZ(-30px);
    }

    100%{
        opacity:.94;
        transform:
            translateX(-50%)
            rotateZ(2deg)
            translateZ(10px);
    }
}

@keyframes rxFogA{
    from{
        transform:
            translate3d(-4%,0,-180px)
            scale(.92);
    }

    to{
        transform:
            translate3d(11%,-6%,-130px)
            scale(1.08);
    }
}

@keyframes rxFogB{
    from{
        transform:
            translate3d(5%,0,-180px)
            scale(1);
    }

    to{
        transform:
            translate3d(-10%,7%,-145px)
            scale(1.13);
    }
}

@keyframes rxFloor{
    from{
        transform:
            rotateX(58deg)
            translate3d(-1%,0,-120px);
    }

    to{
        transform:
            rotateX(61deg)
            translate3d(1.5%,-2%,-95px);
    }
}

@keyframes rxBubbleRise{
    0%{
        transform:
            translate3d(0,0,var(--z))
            scale(.72);
    }

    25%{
        transform:
            translate3d(12px,-28vh,var(--z))
            scale(.86);
    }

    50%{
        transform:
            translate3d(-8px,-57vh,var(--z))
            scale(1);
    }

    75%{
        transform:
            translate3d(15px,-84vh,var(--z))
            scale(1.08);
    }

    100%{
        transform:
            translate3d(-4px,-125vh,var(--z))
            scale(1.16);
    }
}

/* accessibility */
@media (prefers-reduced-motion:reduce){
    .rx-ocean-depth,
    .rx-ocean-caustics,
    .rx-ocean-rays,
    .rx-ocean-fog,
    .rx-ocean-floor,
    .rx-ocean-bubble{
        animation:none !important;
    }
}

/* mobile */
@media(max-width:700px){
    .rx-ocean-rays{
        width:145vw;
        opacity:.52;
    }

    .rx-ocean-bubble:nth-child(n+15){
        display:none;
    }

    .rx-global-footer{
        margin-top:34px;
        padding-bottom:28px;
    }
}

/* ==========================================================
   REPLIXA EXACT GLOBAL BRAND V2
   ========================================================== */

.rx-brand{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start;
    white-space:nowrap;
    gap:0 !important;

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-weight:950 !important;
    line-height:1 !important;
    letter-spacing:-0.055em !important;

    transform-style:preserve-3d;
}

.rx-brand-replixa{
    display:inline-block !important;

    color:#a855f7 !important;

    font-style:italic;
    font-weight:950 !important;

    transform:
        skewX(-13deg)
        perspective(300px)
        rotateY(-3deg);

    transform-origin:right center;

    text-shadow:
        0 0 10px rgba(168,85,247,.18),
        0 0 20px rgba(124,58,237,.08);
}

.rx-brand-dot{
    display:inline-block !important;

    color:#a78bfa !important;

    font-style:normal;
    margin:0 .15em !important;

    transform:translateY(-.02em);

    text-shadow:
        0 0 8px rgba(167,139,250,.25);
}

.rx-brand-ai{
    display:inline-block !important;

    color:#38bdf8 !important;

    font-style:italic;
    font-weight:950 !important;

    transform:
        skewX(11deg)
        perspective(300px)
        rotateY(3deg);

    transform-origin:left center;

    text-shadow:
        0 0 10px rgba(56,189,248,.20),
        0 0 20px rgba(14,165,233,.08);
}


/* HEADER LOGO */

header .rx-brand,
nav .rx-brand,
.brand .rx-brand,
.logo .rx-brand,
.navbar-brand .rx-brand{
    font-size:1.32rem !important;
}


/* Footer existing brand can stay smaller */

footer .rx-brand{
    font-size:.95rem;
}


/* ==========================================================
   CREATOR INSIDE ORIGINAL FOOTER
   ========================================================== */

.rx-footer-creator{
    display:inline-flex;
    align-items:center;
    gap:.42rem;

    margin-left:20px;

    font-size:.92rem;
    color:#aebed2;

    white-space:nowrap;
}

.rx-footer-creator .rx-footer-separator{
    color:#64748b;
}

.rx-footer-creator a{
    color:#7dd3fc !important;
    text-decoration:none !important;
}

.rx-footer-creator a:hover{
    color:#bae6fd !important;
    text-decoration:underline !important;
}


/*
 * The old generated standalone footer must never show,
 * even if an old cached Blade copy survives briefly.
 */
.rx-global-footer{
    display:none !important;
}


/* Mobile: creator wraps cleanly under Terms/Cookies if needed */

@media(max-width:700px){
    .rx-footer-creator{
        margin-left:10px;
        font-size:.82rem;
        white-space:normal;
    }

    header .rx-brand,
    nav .rx-brand,
    .brand .rx-brand,
    .logo .rx-brand,
    .navbar-brand .rx-brand{
        font-size:1.15rem !important;
    }
}

/* ==========================================================
   REAL REPLIXA PROJECT SHOWCASE V1
   REAL SYSTEM SCREENSHOTS ONLY
   ========================================================== */

.rx-real-showcase{
    width:100%;
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:20px;
    padding:6px;
}

.rx-real-showcase-card{
    position:relative;
    margin:0;
    min-width:0;
    overflow:hidden;

    border:
        1px solid
        rgba(96,165,250,.24);

    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            rgba(15,31,56,.86),
            rgba(5,15,35,.92)
        );

    box-shadow:
        0 18px 50px rgba(0,0,0,.18);

    transform:
        perspective(900px)
        rotateX(0deg)
        translateY(0);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.rx-real-showcase-card:hover{
    transform:
        perspective(900px)
        rotateX(1.4deg)
        translateY(-5px);

    border-color:
        rgba(168,85,247,.52);

    box-shadow:
        0 25px 70px rgba(0,0,0,.30),
        0 0 30px rgba(56,189,248,.05);
}

.rx-real-showcase-screen{
    position:relative;
    overflow:hidden;

    aspect-ratio:16/10;

    background:#020617;
}

.rx-real-showcase-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top center;

    transform:scale(1.002);

    transition:
        transform .7s ease;
}

.rx-real-showcase-card:hover
.rx-real-showcase-screen img{
    transform:scale(1.035);
}

.rx-real-showcase-shine{
    position:absolute;
    inset:0;
    pointer-events:none;

    background:
        linear-gradient(
            120deg,
            transparent 15%,
            rgba(125,211,252,.055) 42%,
            rgba(196,181,253,.05) 50%,
            transparent 67%
        );

    transform:translateX(-120%);

    transition:
        transform .8s ease;
}

.rx-real-showcase-card:hover
.rx-real-showcase-shine{
    transform:translateX(120%);
}

.rx-real-showcase-card figcaption{
    min-height:52px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    padding:11px 13px;

    color:#93a9c7;
    font-size:.75rem;
}

.rx-real-showcase-card figcaption
.rx-brand{
    font-size:.72rem !important;
}

.rx-showcase-empty{
    width:100%;
    padding:28px;
    text-align:center;
    color:#93a9c7;
}

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

@media(max-width:650px){
    .rx-real-showcase{
        grid-template-columns:1fr;
        gap:14px;
    }
}

/* REPLIXA SEO CONTENT V1 */

.rx-seo-growth{
    position:relative;
    padding:90px 24px;
}

.rx-seo-growth-inner{
    max-width:1240px;
    margin:0 auto;
}

.rx-seo-growth h2{
    max-width:820px;
    font-size:clamp(2rem,5vw,4rem);
    line-height:1.03;
    margin:10px 0 22px;
}

.rx-seo-lead{
    max-width:900px;
    color:#9fb2cc;
    font-size:1.12rem;
    line-height:1.75;
}

.rx-seo-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:16px;
    margin-top:36px;
}

.rx-seo-grid article{
    padding:24px;
    border:1px solid rgba(96,165,250,.20);
    border-radius:18px;
    background:
        linear-gradient(
            145deg,
            rgba(15,31,56,.75),
            rgba(5,15,35,.82)
        );
}

.rx-seo-grid h3{
    margin:0 0 10px;
}

.rx-seo-grid p{
    margin:0;
    color:#93a9c7;
    line-height:1.65;
}

.rx-seo-links{
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    margin-top:30px;
}

.rx-seo-links a{
    color:#7dd3fc;
}

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

@media(max-width:620px){
    .rx-seo-grid{
        grid-template-columns:1fr;
    }
}

/* ==========================================================
   REPLIXA SEO FOUNDATION V2
   ========================================================== */

.rx-seo-page{
    padding:88px 24px 110px;
}

.rx-seo-shell{
    width:min(1180px,100%);
    margin:0 auto;
}

.rx-seo-page h1{
    max-width:980px;
    margin:12px 0 22px;
    font-size:clamp(2.6rem,6vw,5.7rem);
    line-height:.98;
    letter-spacing:-.055em;
}

.rx-seo-page-lead{
    max-width:900px;
    color:#a7b8cf;
    font-size:1.16rem;
    line-height:1.75;
}

.rx-seo-page-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:20px;
    margin:30px 0 46px;
}

.rx-seo-page-actions > a:not(.btn){
    color:#7dd3fc;
}

.rx-seo-content-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:18px;
    margin-top:34px;
}

.rx-seo-content-grid .card{
    min-height:220px;
    padding:27px;
}

.rx-seo-content-grid p,
.rx-seo-faq p,
.rx-guide-steps p{
    color:#9fb0c8;
    line-height:1.72;
}

.rx-seo-faq{
    margin-top:70px;
}

.rx-seo-faq > h2,
.rx-seo-related > h2{
    margin-bottom:24px;
}

.rx-seo-faq .card{
    margin:12px 0;
}

.rx-seo-related{
    margin-top:70px;
}

.rx-seo-related-links{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.rx-seo-related-links a{
    padding:11px 15px;
    border:1px solid rgba(96,165,250,.20);
    border-radius:999px;
    color:#a9c8e5;
    background:rgba(7,18,38,.48);
    text-decoration:none;
}

.rx-seo-related-links a:hover{
    border-color:rgba(56,189,248,.55);
    color:#e0f2fe;
}

.rx-guide-steps{
    display:grid;
    gap:16px;
    margin-top:38px;
}

.rx-guide-steps .card{
    position:relative;
    padding:28px 28px 28px 78px;
}

.rx-guide-number{
    position:absolute;
    left:24px;
    top:26px;
    width:36px;
    height:36px;
    border-radius:999px;
    display:grid;
    place-items:center;
    font-weight:900;
    color:#7dd3fc;
    border:1px solid rgba(56,189,248,.35);
    background:rgba(14,165,233,.08);
}

.rx-seo-discovery-v2{
    padding-top:70px;
    padding-bottom:70px;
}

.rx-seo-discovery-grid-v2{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:14px;
}

.rx-seo-discovery-grid-v2 a{
    display:flex;
    min-height:145px;
    flex-direction:column;
    justify-content:flex-end;
    gap:8px;
    padding:22px;
    border:1px solid rgba(96,165,250,.20);
    border-radius:18px;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(56,189,248,.07),
            transparent 40%
        ),
        rgba(6,17,37,.66);
    color:#dcecf9;
    text-decoration:none;
    transition:.25s ease;
}

.rx-seo-discovery-grid-v2 a:hover{
    transform:translateY(-4px);
    border-color:rgba(168,85,247,.48);
}

.rx-seo-discovery-grid-v2 span{
    color:#8fa6c2;
    line-height:1.45;
}

@media(max-width:1000px){
    .rx-seo-content-grid{
        grid-template-columns:1fr 1fr;
    }

    .rx-seo-discovery-grid-v2{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:650px){
    .rx-seo-page{
        padding:58px 18px 80px;
    }

    .rx-seo-content-grid,
    .rx-seo-discovery-grid-v2{
        grid-template-columns:1fr;
    }

    .rx-guide-steps .card{
        padding:74px 22px 24px;
    }

    .rx-guide-number{
        left:22px;
        top:22px;
    }
}


/* REPLIXA_PUBLIC_GRADIENT_HEADINGS_V2 */
.rx-section-head h2,
.rx-seo-growth h2,
.rx-seo-page h1,
.rx-seo-page h2,
.rx-seo-discovery-v2 h2,
.rx-real-showcase-section h2,
main > section h1,
main > section > div > h1 {
    background:linear-gradient(105deg,#a855f7 0%,#d946ef 28%,#f472b6 48%,#93c5fd 74%,#38bdf8 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:transparent;
}
@supports not (-webkit-background-clip:text) {
    .rx-section-head h2,
    .rx-seo-growth h2,
    .rx-seo-page h1,
    .rx-seo-page h2,
    .rx-seo-discovery-v2 h2,
    .rx-real-showcase-section h2,
    main > section h1,
    main > section > div > h1 {
        color:#c084fc;
    }
}

/* REPLIXA_SEO_PRIMARY_H1_STYLE_V3 */
.rx-seo-primary-line-v3{
    display:block !important;
    max-width:980px;
    margin:0 auto 20px;
    font-size:clamp(1.05rem,1.8vw,1.45rem) !important;
    line-height:1.35 !important;
    letter-spacing:.015em !important;
    font-weight:750 !important;
    color:#a9c8ff !important;
    text-transform:none !important;
    transform:none !important;
    opacity:.96;
}

@media(max-width:700px){
    .rx-seo-primary-line-v3{
        margin-bottom:15px;
        font-size:1rem !important;
        line-height:1.35 !important;
    }
}

/* REPLIXA_GOOGLE_AUTH_STYLE_V1 */
.rx-google-auth-v1{
    margin:18px 0 24px;
}

.rx-google-auth-button-v1{
    width:100%;
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    border:1px solid rgba(148,163,184,.34);
    border-radius:13px;
    background:rgba(255,255,255,.96);
    color:#111827;
    font-weight:750;
    text-decoration:none;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.rx-google-auth-button-v1:hover{
    transform:translateY(-1px);
    border-color:rgba(96,165,250,.75);
    box-shadow:0 9px 28px rgba(0,0,0,.18);
    color:#111827;
}

.rx-google-g-v1{
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    border-radius:50%;
    font-size:18px;
    font-weight:900;
    color:#4285f4;
    background:#fff;
}

.rx-google-divider-v1{
    display:flex;
    align-items:center;
    gap:12px;
    margin:18px 0 0;
    color:#7f91aa;
    font-size:.9rem;
}

.rx-google-divider-v1::before,
.rx-google-divider-v1::after{
    content:"";
    height:1px;
    flex:1;
    background:rgba(148,163,184,.22);
}
