/* Technology page */

.technology-page{
    color:#e5edf5;
    display:grid;
    gap:24px;
}

.technology-hero{
    align-items:stretch;
    display:grid;
    gap:22px;
    grid-template-columns:minmax(0, 0.95fr) minmax(360px, 1.05fr);
    min-height:420px;
}

.technology-hero-copy,
.technology-hero-visual,
.technology-status-grid,
.technology-accordion-item,
.technology-step-grid article,
.technology-flow-grid article,
.technology-card-grid article,
.technology-process-flow article,
.technology-mission{
    background:#020617;
    border:1px solid #1f3448;
    border-radius:8px;
    box-shadow:0 18px 40px #00000028;
}

.technology-hero-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:42px;
}

.technology-eyebrow,
.technology-mission span{
    color:#00ffcc;
    font-size:13px;
    font-weight:700;
}

.technology-hero h1{
    color:#f8fafc;
    font-size:56px;
    line-height:1;
    margin:16px 0;
}

.technology-hero p,
.technology-accordion-header strong,
.technology-step-grid p,
.technology-flow-grid p,
.technology-process-flow p,
.technology-mission p{
    color:#b6c5d6;
    line-height:1.55;
    margin:0;
}

.technology-hero p{
    font-size:18px;
}

.technology-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:28px;
}

.technology-primary-action,
.technology-secondary-action{
    border-radius:6px;
    font-weight:700;
    padding:12px 16px;
    text-decoration:none;
}

.technology-primary-action{
    background:#00ffcc;
    color:#001014;
}

.technology-secondary-action{
    background:#07111f;
    border:1px solid #24445f;
    color:#dbeafe;
}

.technology-primary-action:hover,
.technology-secondary-action:hover{
    transform:translateY(-2px);
    transition:0.2s;
}

.technology-hero-visual{
    align-items:center;
    display:flex;
    justify-content:center;
    overflow:hidden;
    min-height:360px;
    padding:22px;
}

.technology-hero-visual img{
    border-radius:8px;
    display:block;
    height:100%;
    max-height:316px;
    object-fit:contain;
    object-position:center;
    width:100%;
}

.technology-status-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    overflow:hidden;
}

.technology-status-grid div{
    border-right:1px solid #18324a;
    padding:16px;
}

.technology-status-grid div:last-child{
    border-right:0;
}

.technology-status-grid span,
.technology-step-grid span{
    color:#94a3b8;
    font-size:13px;
}

.technology-status-grid strong{
    color:#f8fafc;
    display:block;
    font-size:18px;
    margin-top:7px;
}

.technology-accordion{
    display:grid;
    gap:12px;
}

.technology-accordion-item{
    overflow:hidden;
}

.technology-accordion-header{
    align-items:center;
    background:#020617;
    border:0;
    color:#f8fafc;
    cursor:pointer;
    display:grid;
    gap:8px 18px;
    grid-template-columns:minmax(220px, 0.32fr) 1fr auto;
    padding:18px 20px;
    text-align:left;
    width:100%;
}

.technology-accordion-header span{
    color:#00ffcc;
    font-size:18px;
    font-weight:800;
}

.technology-accordion-header::after{
    color:#00ffcc;
    content:"+";
    font-size:24px;
    font-weight:700;
}

.technology-accordion-item.active .technology-accordion-header::after{
    content:"-";
}

.technology-accordion-content{
    border-top:1px solid #18324a;
    display:none;
    padding:18px;
}

.technology-accordion-item.active .technology-accordion-content{
    display:block;
}

.technology-step-grid,
.technology-flow-grid,
.technology-card-grid{
    display:grid;
    gap:14px;
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.technology-process-flow{
    display:grid;
    gap:14px;
    grid-template-columns:repeat(5, minmax(0, 1fr));
}

.technology-step-grid article,
.technology-flow-grid article,
.technology-card-grid article,
.technology-process-flow article{
    padding:18px;
}

.technology-step-grid img,
.technology-flow-grid img,
.technology-card-grid img,
.technology-process-flow img{
    display:block;
    height:42px;
    margin-bottom:12px;
    object-fit:contain;
    width:42px;
}

.technology-step-grid h3,
.technology-flow-grid h3,
.technology-card-grid h3,
.technology-process-flow h3,
.technology-mission h2{
    color:#f8fafc;
    margin:10px 0;
}

.technology-card-grid ul{
    color:#dbeafe;
    line-height:1.55;
    margin:0;
    padding-left:18px;
}

.technology-card-grid li::marker{
    color:#00ffcc;
}

.technology-mission{
    align-items:center;
    display:grid;
    gap:24px;
    grid-template-columns:minmax(280px, 0.45fr) 1fr;
    padding:26px;
}

.technology-mission h2{
    margin-top:10px;
}

@media(max-width:1100px){
    .technology-hero,
    .technology-mission{
        grid-template-columns:1fr;
    }

    .technology-step-grid,
    .technology-flow-grid,
    .technology-card-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .technology-process-flow{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media(max-width:760px){
    .technology-hero-copy{
        padding:30px;
    }

    .technology-hero h1{
        font-size:40px;
    }

    .technology-status-grid,
    .technology-step-grid,
    .technology-flow-grid,
    .technology-card-grid,
    .technology-process-flow{
        grid-template-columns:1fr;
    }

    .technology-status-grid div{
        border-bottom:1px solid #18324a;
        border-right:0;
    }

    .technology-status-grid div:last-child{
        border-bottom:0;
    }

    .technology-accordion-header{
        grid-template-columns:1fr auto;
    }

    .technology-accordion-header strong{
        grid-column:1 / -1;
    }
}