/* ==========================================================
   OKSY3-QIA 6C MODEL — SPECIAL PUBLIC PAGE
   ========================================================== */

.qia6c-page{
    background:#f6f8fc;
}

.qia-hero{
    position:relative;
    overflow:hidden;
    color:#fff;
    background:
        radial-gradient(circle at 78% 20%,rgba(59,130,246,.34),transparent 22rem),
        radial-gradient(circle at 12% 84%,rgba(14,165,233,.20),transparent 26rem),
        linear-gradient(135deg,#07162f 0%,#0c2860 54%,#0a6580 100%);
}

.qia-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
    background-size:48px 48px;
    opacity:.3;
    pointer-events:none;
}

.qia-orb{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}

.qia-orb-a{
    width:560px;height:560px;
    right:-210px;top:-300px;
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.016);
}

.qia-orb-b{
    width:300px;height:300px;
    left:-160px;bottom:-130px;
    background:rgba(59,130,246,.10);
}

.qia-hero-grid{
    min-height:570px;
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,1.14fr) minmax(380px,.86fr);
    gap:64px;
    align-items:center;
    padding:66px 0;
}

.qia-brand{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 13px;
    border:1px solid rgba(191,219,254,.25);
    border-radius:999px;
    background:rgba(15,23,42,.20);
    font-size:.73rem;
    letter-spacing:.1em;
    color:#dbeafe;
    font-weight:800;
}

.qia-brand-dot{
    width:8px;height:8px;border-radius:50%;
    background:#34d399;
    box-shadow:0 0 0 6px rgba(52,211,153,.11);
}

.qia-overline{
    margin-top:24px;
    color:#93c5fd;
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.08em;
}

.qia-hero h1{
    font-size:clamp(3rem,6vw,6rem);
    line-height:.98;
    letter-spacing:-.055em;
    font-weight:900;
    margin:11px 0 22px;
}

.qia-hero h1 span{
    color:#7dd3fc;
}

.qia-lead{
    max-width:800px;
    color:rgba(255,255,255,.80);
    font-size:1.08rem;
    line-height:1.82;
    margin:0;
}

.qia-principle{
    margin-top:22px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.qia-principle strong,
.qia-principle span{
    border:1px solid rgba(255,255,255,.14);
    border-radius:999px;
    padding:7px 11px;
    color:rgba(255,255,255,.74);
    font-size:.79rem;
    background:rgba(255,255,255,.05);
}

.qia-principle strong{
    color:#fff;
}

.qia-hero-actions{
    margin-top:28px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.qia-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:46px;
    padding:11px 17px;
    border-radius:12px;
    font-weight:800;
    text-decoration:none;
}

.qia-btn.primary{
    background:#fff;
    color:#0f172a;
}

.qia-btn.ghost{
    border:1px solid rgba(255,255,255,.26);
    color:#fff;
    background:rgba(255,255,255,.06);
}

.qia-hero-visual{
    display:flex;
    align-items:center;
    justify-content:center;
}

.qia-core-ring{
    width:430px;
    max-width:100%;
    aspect-ratio:1;
    position:relative;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.15);
    background:
        radial-gradient(circle,rgba(30,64,175,.45) 0 26%,transparent 27%),
        radial-gradient(circle,transparent 0 48%,rgba(255,255,255,.04) 49% 50%,transparent 51%);
    box-shadow:0 30px 80px rgba(2,8,23,.25);
}

.qia-core-ring:before,
.qia-core-ring:after{
    content:"";
    position:absolute;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.10);
    inset:10%;
}

.qia-core-ring:after{
    inset:25%;
}

.qia-core-center{
    position:absolute;
    left:50%;top:50%;
    transform:translate(-50%,-50%);
    width:165px;height:165px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    background:linear-gradient(145deg,#eff6ff,#bfdbfe);
    color:#0f2a58;
    box-shadow:0 18px 50px rgba(2,8,23,.28);
}

.qia-core-center span{font-size:.8rem;font-weight:850;letter-spacing:.12em;}
.qia-core-center strong{font-size:1.8rem;line-height:1.1;margin-top:5px;}
.qia-core-center small{font-weight:800;color:#3b82f6;margin-top:4px;}

.qia-node{
    position:absolute;
    width:112px;height:112px;
    border-radius:24px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.94);
    color:#0f172a;
    box-shadow:0 16px 40px rgba(2,8,23,.20);
}

.qia-node b{font-size:2rem;line-height:1;}
.qia-node span{font-size:.72rem;color:#64748b;margin-top:6px;}

.q-node{left:-18px;top:46%;transform:translateY(-50%);}
.i-node{right:-8px;top:18%;}
.a-node{right:18px;bottom:5%;}

.q-node b{color:#2563eb;}
.i-node b{color:#0f9f92;}
.a-node b{color:#d99816;}

.qia-ring-label{
    position:absolute;
    left:50%;
    bottom:-23px;
    transform:translateX(-50%);
    white-space:nowrap;
    color:rgba(255,255,255,.46);
    letter-spacing:.10em;
    font-size:.66rem;
    font-weight:800;
}

.qia-section{
    padding:66px 0;
}

.qia-section-soft{
    background:#eef3f9;
}

.qia-section-head{
    max-width:790px;
    margin-bottom:30px;
}

.qia-section-head.centered{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.qia-section-head > span,
.qia-section-label{
    display:inline-block;
    color:#2563eb;
    font-size:.73rem;
    letter-spacing:.12em;
    font-weight:900;
}

.qia-section-head h2,
.qia-pdca h2,
.oksy3-role h2{
    margin:7px 0 9px;
    font-size:clamp(1.85rem,3vw,2.8rem);
    font-weight:900;
    letter-spacing:-.035em;
}

.qia-section-head p,
.qia-pdca-copy p,
.oksy3-role-copy p{
    color:#64748b;
    line-height:1.75;
    margin:0;
}

.qia-core-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.qia-core-card{
    display:grid;
    grid-template-columns:72px 1fr;
    gap:18px;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:22px;
    padding:25px;
    box-shadow:0 12px 32px rgba(15,23,42,.045);
}

.qia-letter{
    width:66px;height:66px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eff6ff;
    color:#2563eb;
    font-size:2rem;
    font-weight:900;
}

.i-card .qia-letter{background:#ecfdf5;color:#0f9f92;}
.a-card .qia-letter{background:#fff7e6;color:#d99816;}

.qia-en{
    font-size:.78rem;
    color:#2563eb;
    font-weight:800;
}

.qia-core-card h3{
    font-size:1.1rem;
    font-weight:850;
    margin:6px 0 8px;
}

.qia-core-card p{
    color:#64748b;
    line-height:1.7;
    margin:0;
    font-size:.93rem;
}

.sixc-track{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px;
}

.sixc-card{
    position:relative;
    min-width:0;
    background:#fff;
    border:1px solid #dfe7f1;
    border-radius:20px;
    padding:22px 16px;
    text-align:center;
    overflow:hidden;
}

.sixc-card:after{
    content:"";
    position:absolute;
    left:0;right:0;bottom:0;
    height:4px;
    background:#2563eb;
}

.c2:after{background:#0ea5a6;}
.c3:after{background:#65a30d;}
.c4:after{background:#f97316;}
.c5:after{background:#7c3aed;}
.c6:after{background:#0284c7;}

.sixc-no{
    font-size:.65rem;
    color:#94a3b8;
    font-weight:900;
    letter-spacing:.08em;
}

.sixc-icon{
    margin:11px auto;
    width:54px;height:54px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    background:#2563eb;
    font-weight:900;
    box-shadow:0 8px 22px rgba(37,99,235,.20);
}

.c2 .sixc-icon{background:#0ea5a6;}
.c3 .sixc-icon{background:#65a30d;}
.c4 .sixc-icon{background:#f97316;}
.c5 .sixc-icon{background:#7c3aed;}
.c6 .sixc-icon{background:#0284c7;}

.sixc-card h3{
    font-size:.88rem;
    line-height:1.4;
    min-height:2.5em;
    margin:0 0 8px;
    font-weight:850;
}

.sixc-card p{
    margin:0;
    color:#64748b;
    font-size:.79rem;
    line-height:1.6;
}

.qia-pdca{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:26px;
    padding:34px;
    box-shadow:0 12px 32px rgba(15,23,42,.04);
}

.qia-pdca-copy{
    max-width:760px;
    margin-bottom:28px;
}

.pdca-flow{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
    gap:12px;
    align-items:center;
}

.pdca-box{
    border-radius:18px;
    border:1px solid #dbeafe;
    padding:20px;
    background:#f8fbff;
}

.pdca-box b{
    display:inline-flex;
    width:42px;height:42px;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#2563eb;
    color:#fff;
    font-size:1.25rem;
}

.pdca-box span{
    display:block;
    font-weight:850;
    margin-top:12px;
}

.pdca-box small{
    display:block;
    color:#64748b;
    margin-top:4px;
}

.d-box b{background:#0f9f92;}
.c-box b{background:#f97316;}
.a-box b{background:#7c3aed;}

.pdca-arrow{
    color:#94a3b8;
    font-size:1.35rem;
}

.qia-safety-section{
    background:
        radial-gradient(circle at 85% 20%,rgba(37,99,235,.22),transparent 26rem),
        linear-gradient(135deg,#07162f,#0b2b61);
    color:#fff;
}

.qia-section-head.light > span{color:#93c5fd;}
.qia-section-head.light p{color:rgba(255,255,255,.68);}

.safety-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}

.safety-grid > div{
    display:flex;
    gap:13px;
    align-items:center;
    min-height:84px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:16px;
    background:rgba(255,255,255,.06);
    padding:16px;
}

.safety-grid b{
    display:flex;
    width:36px;height:36px;
    flex:0 0 36px;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    background:rgba(147,197,253,.15);
    color:#93c5fd;
    font-size:.75rem;
}

.safety-grid span{
    color:rgba(255,255,255,.84);
    line-height:1.55;
    font-size:.9rem;
}

.oksy3-role{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);
    gap:50px;
    align-items:center;
}

.oksy3-pills{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:20px;
}

.oksy3-pills span{
    padding:7px 10px;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    border:1px solid #dbeafe;
    font-size:.78rem;
    font-weight:800;
}

.oksy3-console{
    overflow:hidden;
    border-radius:22px;
    background:#0f172a;
    color:#fff;
    box-shadow:0 20px 50px rgba(15,23,42,.18);
}

.console-top{
    display:flex;
    align-items:center;
    gap:7px;
    padding:14px 16px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.console-top span{
    width:9px;height:9px;border-radius:50%;
    background:#ef4444;
}

.console-top span:nth-child(2){background:#f59e0b;}
.console-top span:nth-child(3){background:#22c55e;}

.console-top b{
    margin-left:auto;
    font-size:.72rem;
    letter-spacing:.1em;
    color:#93c5fd;
}

.console-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:rgba(255,255,255,.08);
}

.console-grid div{
    min-height:110px;
    padding:20px;
    background:#111d34;
}

.console-grid strong{
    display:block;
    font-size:.8rem;
    color:#60a5fa;
}

.console-grid span{
    display:block;
    color:rgba(255,255,255,.72);
    margin-top:7px;
    font-size:.86rem;
}

.qia-result-section{
    padding-top:48px;
}

.result-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px;
}

.result-grid article{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:18px;
    padding:20px;
}

.result-grid b{
    color:#2563eb;
    font-size:.72rem;
}

.result-grid h3{
    margin:9px 0 7px;
    font-size:1rem;
    font-weight:850;
}

.result-grid p{
    color:#64748b;
    font-size:.82rem;
    line-height:1.6;
    margin:0;
}

.qia-final-cta{
    margin-top:24px;
    border-radius:24px;
    padding:28px 30px;
    background:linear-gradient(135deg,#0f172a,#172554);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:26px;
}

.qia-final-cta span{
    color:#93c5fd;
    font-size:.76rem;
    font-weight:850;
}

.qia-final-cta h2{
    font-size:1.45rem;
    margin:5px 0 0;
    font-weight:850;
}

.qia-final-cta a{
    flex:0 0 auto;
    color:#0f172a;
    background:#fff;
    border-radius:12px;
    padding:11px 16px;
    text-decoration:none;
    font-weight:850;
}

/* Tablet */
@media(max-width:1199.98px){
    .sixc-track{grid-template-columns:repeat(3,minmax(0,1fr));}
    .result-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media(max-width:991.98px){
    .qia-hero-grid{
        grid-template-columns:1fr;
        min-height:0;
        gap:44px;
        padding:52px 0 70px;
    }

    .qia-hero-visual{padding-bottom:20px;}
    .qia-core-ring{width:390px;}

    .qia-core-grid{grid-template-columns:1fr;}
    .oksy3-role{grid-template-columns:1fr;gap:30px;}

    .pdca-flow{
        grid-template-columns:1fr;
    }

    .pdca-arrow{
        transform:rotate(90deg);
        text-align:center;
    }

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

/* Phone */
@media(max-width:767.98px){
    .qia-section{padding:46px 0;}

    .qia-hero-grid{padding:38px 0 54px;}

    .qia-hero h1{font-size:2.65rem;}

    .qia-brand{
        border-radius:14px;
        line-height:1.35;
    }

    .qia-lead{
        font-size:.98rem;
        line-height:1.72;
    }

    .qia-core-ring{width:310px;}

    .qia-node{
        width:88px;height:88px;
        border-radius:19px;
    }

    .qia-node b{font-size:1.55rem;}
    .qia-node span{font-size:.62rem;}

    .qia-core-center{width:130px;height:130px;}
    .qia-core-center strong{font-size:1.4rem;}

    .sixc-track{grid-template-columns:repeat(2,minmax(0,1fr));}

    .qia-pdca{padding:24px 20px;}

    .safety-grid{grid-template-columns:1fr;}

    .console-grid{grid-template-columns:1fr;}

    .result-grid{grid-template-columns:1fr 1fr;}

    .qia-final-cta{
        align-items:flex-start;
        flex-direction:column;
        padding:24px 20px;
    }

    .qia-final-cta a{
        width:100%;
        text-align:center;
    }
}

@media(max-width:420px){
    .qia-hero h1{font-size:2.3rem;}
    .qia-hero-actions{display:grid;grid-template-columns:1fr;}
    .qia-btn{width:100%;}

    .qia-core-ring{width:270px;}
    .qia-node{width:78px;height:78px;}
    .qia-node span{display:none;}

    .sixc-track{grid-template-columns:1fr;}
    .result-grid{grid-template-columns:1fr;}
}