/* =====================================
   Product Detail Page V2.0
   显科WEB 产品详情页
===================================== */

.detail-product{
    background:#fff;
}


/* =====================================
   产品介绍 — 全新大胆设计
===================================== */

.detail-intro{
    padding:168px 0 120px;
    background:#152535;
    position:relative;
    overflow:hidden;
}
/* Decorative background element */
.detail-intro::before{
    content:"";
    position:absolute;
    top:0;right:0;
    width:55%;
    height:60%;
    background:radial-gradient(ellipse at center, rgba(10,180,255,.06) 0%, transparent 70%);
    pointer-events:none;
}
.detail-intro::after{
    content:"";
    position:absolute;
    bottom:55%;
    left:5%;
    width:200px;
    height:200px;
    border:1px solid rgba(255,255,255,.04);
    border-radius:50%;
    pointer-events:none;
}

.detail-intro__grid{
    display:grid;
    grid-template-columns:1fr 1.2fr;
    gap:80px;
    align-items:start;
    position:relative;
    z-index:1;
}

/* ---- Content (Left side) ---- */
.detail-intro__content{
    padding:40px 0 0;
    position:relative;
}
.detail-intro__content::before{
    content:"";
    position:absolute;
    left:0;top:0;
    width:50px;
    height:4px;
    background:linear-gradient(90deg, #0A5DA6, #0ab4ff);
    border-radius:2px;
}

.detail-intro__content h1{
    font-size:clamp(28px, 3.5vw, 42px);
    color:#fff;
    margin-bottom:16px;
    font-weight:700;
    line-height:1.12;
    letter-spacing:-1.5px;
}
.detail-intro__content h1 span{
    display:block;
    font-size:13px;
    font-weight:500;
    color:#0ab4ff;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:8px;
}

.detail-intro__content .detail-intro__model{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#0ab4ff;
    font-size:13px;
    font-weight:600;
    margin-bottom:30px;
    padding:8px 16px;
    background:rgba(10,180,255,.08);
    border:1px solid rgba(10,180,255,.15);
    border-radius:6px;
    letter-spacing:1px;
}
.detail-intro__model::before{
    content:"◆";
    font-size:6px;
}

.detail-intro__content p:not(.detail-intro__model),
#product-intro,
#product-intro p{
    color:#fff;
    font-size:15px;
    line-height:2;
    margin-bottom:16px;
    max-width:520px;
}
/* ---- Image (Right side) ---- */
.detail-intro__image{
    position:relative;
    max-width:520px;
    margin:0 auto;
}
/* Decorative shadow behind image */
.detail-intro__image::before{
    content:"";
    position:absolute;
    top:16px;right:16px;
    width:100%;
    height:100%;
    border:2px solid rgba(10,180,255,.12);
    border-radius:8px;
    z-index:0;
}

.gallery-main{
    position:relative;
    z-index:1;
    width:520px;
    height:325px;
    background:#0d1f33;
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 20px 60px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.06);
}
.gallery-main img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Nav arrows inside image */
.gallery-nav{
    position:absolute;
    top:0;bottom:0;
    left:0;right:0;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 16px;
    pointer-events:none;
}
.gallery-nav > *{
    pointer-events:auto;
}
.gallery-btn{
    width:48px;
    height:48px;
    border:none;
    background:rgba(0,0,0,.3);
    border-radius:50%;
    font-size:26px;
    color:rgba(255,255,255,.7);
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .3s ease;
    backdrop-filter:blur(8px);
}
.gallery-btn:hover{
    background:rgba(0,0,0,.75);
    color:#fff;
    transform:scale(1.15);
}
.gallery-dots{
    display:flex;
    gap:8px;
    position:absolute;
    bottom:14px;
    left:50%;
    transform:translateX(-50%);
}
.gallery-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:rgba(255,255,255,.35);
    cursor:pointer;
    transition:.3s;
}
.gallery-dot.is-active{
    background:#0ab4ff;
    box-shadow:0 0 8px rgba(10,180,255,.5);
    transform:scale(1.3);
}


/* =====================================
   Section Title
===================================== */

.detail-section-title{
    text-align:center;
    margin-bottom:55px;
}
.detail-section-title h2{
    font-size:36px;
    color:#071b2d;
    margin-bottom:12px;
}
.detail-section-title p{
    color:#1a3a5c;
    font-size:14px;
    letter-spacing:3px;
}


/* =====================================
   产品特点
===================================== */

.detail-feature{
    padding:90px 0;
    background:#f6f9fc;
}
.detail-feature__grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}
.detail-feature__item{
    background:#fff;
    padding:35px 25px;
    border-radius:10px;
    transition:.3s;
}
.detail-feature__item:hover{
    transform:translateY(-8px);
    box-shadow:0 15px 35px rgba(0,0,0,.08);
}
.detail-feature__item h3{
    font-size:20px;
    color:#071b2d;
    margin-bottom:15px;
}
.detail-feature__item p{
    font-size:14px;
    line-height:1.8;
    color:#666;
}


/* =====================================
   产品参数
===================================== */

.detail-parameter{
    padding:100px 0;
    background:#fff;
}
.parameter-table{
    width:100%;
    overflow-x:auto;
}
.parameter-table table{
    width:100%;
    border-collapse:collapse;
    font-size:14px;
}
.parameter-table thead th{
    background:#2c3e50;
    color:#fff;
    font-weight:600;
    padding:14px 20px;
    border:1px solid #2c3e50;
    text-align:center;
    font-size:15px;
}
.parameter-table thead th:first-child,
.parameter-table tbody td:first-child{
    width:20%;
}
.parameter-table tbody td{
    padding:13px 20px;
    color:#444;
    border:1px solid #e0e0e0;
    text-align:center;
}
.parameter-table tbody td:first-child{
    background:#f4f6f9;
    font-weight:600;
    color:#333;
}
.parameter-table tbody tr:hover td{
    background:#eef5fb;
}
.parameter-table tbody tr:hover td:first-child{
    background:#e2edf6;
}
.parameter-note{
    margin-top:16px;
    font-size:12px;
    color:#999;
    text-align:right;
}


/* =====================================
   Responsive
===================================== */

@media(max-width:1200px){
    .detail-feature__grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(min-width:800px) and (max-width:1000px){
    .gallery-main{ width:347px; height:217px; }
}
@media(max-width:900px){
    .detail-intro{
        padding:128px 0 80px;
        background:#152535;
    }
    .detail-intro__grid{
        grid-template-columns:1fr;
        gap:40px;
    }
    .detail-intro__content{
        padding:0;
    }
    .detail-intro__content::before{
        top:-12px;
    }
    .detail-intro__content h1{
        font-size:30px;
    }
    .detail-intro__image{
        max-width:100%;
    }
    .gallery-main{
        width:100%;
        height:auto;
        aspect-ratio:16/10;
    }
    .detail-intro__image::before{
        display:none;
    }
    .gallery-btn{
        width:36px;
        height:36px;
        font-size:20px;
    }
}

@media(max-width:600px){
    .detail-feature__grid{
        grid-template-columns:1fr;
    }
    .detail-section-title h2{
        font-size:30px;
    }
    .parameter-table table{
        min-width:750px;
    }
}

/* Product Image Gallery (legacy compat) */
.gallery-main--dark{
    background:#0d1f33;
}