/* =========================================================
   SIKHOZEN AI LEARNING ASSISTANT
========================================================= */

.sz-ai-assistant{
    width:100%;
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(ellipse at 10% 50%,rgba(113,86,255,.08),transparent 34%),
        linear-gradient(90deg,#f8f7ff 0%,#fff 48%,#f8f6ff 100%);
}

.sz-ai-container{
    width:92%;
    max-width:1280px;
    min-height:305px;
    margin:0 auto;
    display:grid;
    grid-template-columns:30% 42% 28%;
    align-items:center;
}

.sz-ai-visual{
    height:305px;
    position:relative;
    display:flex;
    align-items:flex-end;
    justify-content:center;
}

.sz-ai-visual-bg{
    position:absolute;
    width:310px;
    height:275px;
    left:-35px;
    top:15px;
    border-radius:50%;
    background:radial-gradient(circle at 55% 40%,#dff3ff 0%,#d5ebff 48%,rgba(214,235,255,.20) 75%,transparent 76%);
}

.sz-ai-girl-robot{
    position:relative;
    z-index:2;
    display:block;
    width:470px;
    max-width:none;
    height:auto;
    align-self:flex-end;
    margin-left:-35px;
}

.sz-ai-main{
    min-width:0;
    padding:26px 18px 24px 5px;
}

.sz-ai-badge{
    display:inline-flex;
    align-items:center;
    gap:9px;
    height:31px;
    padding:4px 15px 4px 10px;
    border:1px solid #7054f5;
    border-radius:999px;
    background:#faf9ff;
    color:#4334b7;
    font-size:13px;
    font-weight:800;
}

.sz-ai-badge i{
    width:17px;
    height:17px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:5px;
    background:#6548f4;
    color:#fff;
    font-size:9px;
}

.sz-ai-main h2{
    margin:12px 0 8px;
    color:#111a42;
    font-family:"Plus Jakarta Sans",Inter,sans-serif;
    font-size:40px;
    line-height:1.08;
    font-weight:800;
    letter-spacing:-1.3px;
}

.sz-ai-main h2 span{color:#6548f4;}

.sz-ai-description{
    max-width:620px;
    margin:0;
    color:#66718f;
    font-size:15px;
    line-height:1.45;
}

.sz-ai-chat{
    width:100%;
    max-width:580px;
    margin-top:15px;
    min-height:74px;
    position:relative;
}

.sz-ai-message{
    position:absolute;
    border-radius:12px;
    padding:11px 16px;
    font-size:13px;
    line-height:1.3;
}

.sz-ai-user-message{
    top:0;
    right:0;
    width:235px;
    color:#fff;
    background:linear-gradient(135deg,#6547ef,#7656f4);
    box-shadow:0 7px 18px rgba(91,68,225,.16);
}

.sz-ai-bot-message{
    left:0;
    bottom:0;
    width:245px;
    color:#59647e;
    background:#fff;
    border:1px solid #eceaf6;
    box-shadow:0 5px 16px rgba(40,35,100,.06);
}

.sz-ai-ask-box{
    width:100%;
    max-width:580px;
    height:54px;
    margin-top:13px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:5px 7px 5px 17px;
    border:1px solid #e3e2ee;
    border-radius:12px;
    background:#fff;
    box-shadow:0 6px 18px rgba(40,35,100,.045);
}

.sz-ai-ask-box > span{
    color:#9299ac;
    font-size:14px;
}

.sz-ai-ask-box button{
    width:43px;
    height:43px;
    border:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#6548f4;
    color:#fff;
    font-size:15px;
    cursor:pointer;
}

.sz-ai-actions{
    min-width:0;
    padding:22px 0 20px 18px;
    position:relative;
}

.sz-ai-action-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px;
}

.sz-ai-action{
    height:63px;
    border:1px solid #eeedf5;
    border-radius:12px;
    background:rgba(255,255,255,.90);
    display:flex;
    align-items:center;
    gap:11px;
    padding:0 15px;
    color:#182143;
    font-family:Inter,sans-serif;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 5px 15px rgba(44,38,100,.035);
}

.sz-ai-action-icon{
    width:27px;
    height:27px;
    flex:0 0 27px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    font-size:12px;
}

.sz-ai-purple{color:#7c4bea;background:#f0e8ff;}
.sz-ai-green{color:#13b99e;background:#e0faf5;}
.sz-ai-pink{color:#f0448b;background:#ffe5f0;}
.sz-ai-violet{color:#7548e9;background:#ece4ff;}

.sz-ai-try-button{
    width:235px;
    height:55px;
    margin:42px auto 0;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    border:0;
    border-radius:11px;
    background:linear-gradient(135deg,#6547ef,#7652ef);
    color:#fff;
    font-family:Inter,sans-serif;
    font-size:15px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 9px 22px rgba(101,72,244,.20);
}

.sz-ai-companion {
    position: absolute;
    right: 0;
    bottom: -36px;
    display: flex;
    flex-direction: column;
    color: #4f35dc;
    font-family: "Segoe Print", "Comic Sans MS", cursive;
    font-size: 16px;
    line-height: 1.18;
    transform: rotate(-7deg);
}

.sz-ai-companion strong{font-weight:500;}

@media(max-width:1050px){
    .sz-ai-container{grid-template-columns:27% 43% 30%;}
    .sz-ai-girl-robot{width:350px;margin-left:-45px;}
    .sz-ai-main h2{font-size:34px;}
    .sz-ai-description{font-size:14px;}
    .sz-ai-action{padding:0 10px;font-size:12px;}
    .sz-ai-try-button{width:205px;}
}

@media(max-width:760px){
    .sz-ai-container{
        width:92%;
        min-height:auto;
        grid-template-columns:1fr;
        padding:28px 0 35px;
    }

    .sz-ai-visual{height:245px;}
    .sz-ai-visual-bg{
        width:260px;height:230px;left:50%;transform:translateX(-50%);
    }
    .sz-ai-girl-robot{width:330px;margin:0 auto;}
    .sz-ai-main{padding:8px 0 0;}
    .sz-ai-main h2{font-size:34px;}
    .sz-ai-description{font-size:14px;}
    .sz-ai-chat,.sz-ai-ask-box{max-width:none;}
    .sz-ai-actions{padding:25px 0 0;}
    .sz-ai-action{font-size:13px;}
    .sz-ai-try-button{width:100%;margin-top:22px;}
    .sz-ai-companion{
        position:static;
        margin:22px auto 0;
        width:max-content;
        font-size:15px;
    }
}

@media(max-width:420px){
    .sz-ai-main h2{font-size:29px;}
    .sz-ai-description{font-size:13px;}
    .sz-ai-user-message,.sz-ai-bot-message{
        width:205px;
        font-size:12px;
    }
    .sz-ai-action{
        height:58px;
        font-size:12px;
        gap:7px;
        padding:0 9px;
    }
}