/*
 * Skin A — 蓝白(清爽科技)
 * 站点:057786999999.ind.5537.com
 * 配色:天蓝主色 + 深蓝头部
 * 结构:玻璃质感导航、轻盈卡片、左对齐版式、微圆角
 */
:root {
    --color-blue-700: #0369a1;
    --color-blue-600: #0284c7;
    --color-blue-500: #0ea5e9;
    --color-blue-400: #38bdf8;
    --color-blue-300: #7dd3fc;
    --color-blue-200: #bae6fd;
    --color-blue-100: #e0f2fe;
    --color-blue-50:  #f0f9ff;
    --color-slate-900: #0c4a6e;
    --color-slate-800: #075985;
}

/* ── 导航:玻璃拟态 ── */
.nav-scrolled {
    background: rgb(240 249 255 / 0.82);
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 rgb(2 132 199 / 0.12);
}

/* ── 标题:左对齐细线装饰 ── */
section h2 {
    position: relative;
}
.font-mono {
    letter-spacing: 0.18em;
}

/* ── 卡片:大圆角 + 轻盈蓝阴影 ── */
.rounded-sm { border-radius: 0.5rem; }
.rounded-lg { border-radius: 0.75rem; }
.rounded-xl { border-radius: 1rem; }
.rounded-2xl { border-radius: 1.25rem; }
.shadow-sm {
    box-shadow: 0 2px 12px -4px rgb(2 132 199 / 0.10);
}
.shadow-xl {
    box-shadow: 0 16px 40px -16px rgb(2 132 199 / 0.22);
}

/* ── 按钮:微圆轻浮 ── */
button.bg-blue-600, a.bg-blue-600 {
    border-radius: 0.5rem;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
button.bg-blue-600:hover, a.bg-blue-600:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -8px rgb(2 132 199 / 0.45);
}

/* ── 中窄屏:隐藏右侧操作区+压缩导航,保证一级菜单完整可见 ── */
@media (min-width: 768px) and (max-width: 1279.98px) {
    .nav-link-desktop { padding-left: 0.4rem; padding-right: 0.4rem; font-size: 0.76rem; }
    header .md\:flex.items-center.space-x-4 { display: none !important; }
    header .h-8 { max-width: 120px; }
}
@media (min-width: 1280px) and (max-width: 1439.98px) {
    .nav-link-desktop { padding-left: 0.6rem; padding-right: 0.6rem; font-size: 0.85rem; }
}
/* ── 一级菜单等宽等距平铺 ── */
@media (min-width: 768px) {
    header nav.md\:flex {
        flex: 1 1 auto;
        margin-left: 1rem;
        margin-right: 1rem;
    }
    header nav.md\:flex > .menu-item {
        flex: 1 1 0;
        justify-content: center;
    }
    header nav.md\:flex > .menu-item > a {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}
