/* =========================================================
   F1RMA PRODUCT PREVIEW MODULES
   Scholar / Labs / Intel / Govern
   ========================================================= */

#insights {
    margin: 0 !important;
    padding: 0 !important;

    width: 100% !important;
    max-width: none !important;

    background: #090d13 !important;
}

.f1rma-modules-section {
    padding: 82px 46px 110px;

    background:
        radial-gradient(
            circle at 12% 14%,
            rgba(117, 86, 255, .13),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 34%,
            rgba(0, 185, 255, .08),
            transparent 30%
        ),
        #090d13;

    color: #fff;
}

.f1rma-modules-shell {
    width: min(1540px, 100%);
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADER
   ========================================================= */

.f1rma-modules-kicker {
    margin-bottom: 14px;

    color: #8c74ff;

    font-size: 13px;
    font-weight: 900;

    letter-spacing: .20em;
}

.f1rma-modules-header {
    display: grid;

    grid-template-columns:
        minmax(0, 1.12fr)
        minmax(360px, .88fr);

    gap: 65px;

    margin-bottom: 50px;

    align-items: end;
}

.f1rma-modules-title {
    margin: 0;

    max-width: 900px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(48px, 4.8vw, 76px);

    font-weight: 400;

    line-height: .98;

    letter-spacing: -.045em;
}

.f1rma-modules-intro {
    margin: 0;

    color: rgba(255,255,255,.63);

    font-size: 17px;

    line-height: 1.72;
}


/* =========================================================
   TWO-COLUMN PRODUCT WINDOWS
   ========================================================= */

.f1rma-product-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 30px;
}

.f1rma-product {
    position: relative;

    min-width: 0;

    overflow: hidden;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius: 28px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.025)
        );

    box-shadow:
        0 26px 70px rgba(0,0,0,.28);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);
}


/* =========================================================
   PRODUCT HEADER
   ========================================================= */

.f1rma-product-head {
    display: flex;

    justify-content: space-between;

    gap: 24px;

    align-items: flex-start;

    padding:
        30px 30px 24px;
}

.f1rma-product-code {
    margin-bottom: 8px;

    color: #8770ff;

    font-size: 10px;
    font-weight: 900;

    letter-spacing: .17em;
}

.f1rma-product-name {
    margin: 0;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    font-weight: 400;

    line-height: 1;
}

.f1rma-product-category {
    margin-top: 9px;

    color: rgba(255,255,255,.48);

    font-size: 11px;
    font-weight: 800;

    letter-spacing: .12em;
}

.f1rma-product-live {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding:
        8px 12px;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius: 40px;

    color: rgba(255,255,255,.64);

    font-size: 10px;

    white-space: nowrap;
}

.f1rma-live-dot {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #826aff;

    box-shadow:
        0 0 14px rgba(130,106,255,.85);
}


/* =========================================================
   BROWSER WINDOW
   ========================================================= */

.f1rma-app-window {
    margin:
        0 22px;

    overflow: hidden;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius:
        20px;

    background:
        #0e131a;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 18px 40px rgba(0,0,0,.22);
}

.f1rma-app-toolbar {
    height: 43px;

    display: flex;

    align-items: center;

    gap: 11px;

    padding:
        0 15px;

    border-bottom:
        1px solid rgba(255,255,255,.08);

    background:
        rgba(255,255,255,.035);
}

.f1rma-browser-dots {
    display: flex;

    gap: 6px;
}

.f1rma-browser-dot {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background:
        rgba(255,255,255,.18);
}

.f1rma-app-address {
    min-width: 0;

    flex: 1;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    color:
        rgba(255,255,255,.39);

    font-size:
        10px;
}


/* =========================================================
   LIVE IFRAME PREVIEW
   ========================================================= */

.f1rma-app-preview {
    position: relative;

    height: 390px;

    overflow: hidden;

    background:
        #0a0e14;
}

.f1rma-app-preview iframe {
    width: 133.333%;
    height: 133.333%;

    border: 0;

    transform:
        scale(.75);

    transform-origin:
        top left;

    background:
        #ffffff;
}


/* =========================================================
   PREVIEW PLACEHOLDER
   Used until module URL is connected
   ========================================================= */

.f1rma-app-placeholder {
    position: absolute;

    inset: 0;

    display: grid;

    place-items: center;

    padding: 35px;

    background:
        radial-gradient(
            circle at 25% 25%,
            rgba(120,86,255,.18),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            #121721,
            #0c1118
        );
}

.f1rma-placeholder-inner {
    width: min(520px, 90%);

    padding: 30px;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:
        20px;

    background:
        rgba(255,255,255,.035);

    text-align: left;
}

.f1rma-placeholder-label {
    color:
        #8870ff;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .16em;
}

.f1rma-placeholder-title {
    margin:
        10px 0 12px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        30px;

    font-weight:
        400;
}

.f1rma-placeholder-copy {
    margin: 0;

    color:
        rgba(255,255,255,.57);

    font-size:
        14px;

    line-height:
        1.6;
}


/* =========================================================
   PRODUCT FOOTER
   ========================================================= */

.f1rma-product-footer {
    display: grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    gap: 28px;

    align-items: center;

    padding:
        25px 30px 30px;
}

.f1rma-product-description {
    margin: 0;

    max-width: 630px;

    color:
        rgba(255,255,255,.61);

    font-size:
        14px;

    line-height:
        1.62;
}

.f1rma-product-open {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 46px;

    padding:
        0 19px;

    border:
        1px solid rgba(139,113,255,.36);

    border-radius:
        12px;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #6750df,
            #7d62ff
        );

    font-size:
        12px;

    font-weight:
        800;

    text-decoration: none;

    transition:
        transform 180ms ease,
        box-shadow 180ms ease;
}

.f1rma-product-open:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 12px 28px rgba(106,79,230,.26);
}

.f1rma-product-open.is-disabled {
    opacity: .45;

    cursor: default;

    pointer-events: none;
}


/* =========================================================
   PRODUCT ACCENT VARIANTS
   ========================================================= */

.product-scholar {
    box-shadow:
        0 26px 70px rgba(0,0,0,.28),
        0 0 55px rgba(113,79,255,.055);
}

.product-labs {
    box-shadow:
        0 26px 70px rgba(0,0,0,.28),
        0 0 55px rgba(0,170,255,.045);
}

.product-intel {
    box-shadow:
        0 26px 70px rgba(0,0,0,.28),
        0 0 55px rgba(245,155,55,.04);
}

.product-govern {
    box-shadow:
        0 26px 70px rgba(0,0,0,.28),
        0 0 55px rgba(35,210,160,.04);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {

    .f1rma-modules-header {
        grid-template-columns:
            1fr;

        gap:
            22px;
    }

    .f1rma-product-grid {
        grid-template-columns:
            1fr;
    }

}

@media (max-width: 620px) {

    .f1rma-modules-section {
        padding:
            58px 16px 72px;
    }

    .f1rma-modules-title {
        font-size:
            42px;
    }

    .f1rma-product-head {
        padding:
            25px 20px 20px;
    }

    .f1rma-app-window {
        margin:
            0 12px;
    }

    .f1rma-app-preview {
        height:
            310px;
    }

    .f1rma-product-footer {
        grid-template-columns:
            1fr;

        padding:
            22px 20px 25px;
    }

    .f1rma-product-open {
        width:
            100%;
    }

}