/* ========================================
   贵州名悦居物业服务有限公司 - 企业官网
   品牌色：深蓝 + 绿 + 白  风格：正式企业官网
   ======================================== */

/* === 变量 === */
:root {
    --blue: #1a3a5c;
    --blue-light: #2a5a8c;
    --blue-dark: #0f2640;
    --green: #2d7d46;
    --green-light: #3a9d5a;
    --white: #ffffff;
    --off-white: #f5f6f8;
    --border: #e2e5ea;
    --text: #1f2937;
    --text-secondary: #4b5563;
    --text-muted: #6b7280;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.1);
    --radius: 8px;
    --radius-sm: 4px;
    --max-width: 1200px;
    --header-h: 72px;
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
    font-family:var(--font);
    color:var(--text);
    line-height:1.75;
    background:var(--white);
    -webkit-font-smoothing:antialiased;
}
.container { max-width:var(--max-width); margin:0 auto; padding:0 20px; }
img { max-width:100%; height:auto; display:block; }

/* ========================================
   LOGO
   ======================================== */
.logo {
    display:flex; align-items:center; gap:10px;
    text-decoration:none; flex-shrink:0;
}
.logo-icon {
    flex-shrink:0;
    width:36px; height:36px;
    object-fit:contain;
}
.logo-text { display:flex; flex-direction:column; }
.logo-zh {
    font-size:18px; font-weight:700; color:var(--blue);
    letter-spacing:2px; line-height:1.2;
}
.logo-en {
    font-size:9px; font-weight:500; color:var(--text-muted);
    letter-spacing:1.2px; text-transform:uppercase;
}

/* 页脚 logo */
.footer-logo {
    display:flex; align-items:center; gap:10px;
    margin-bottom:14px;
}
.footer-logo img {
    width:40px; height:40px; object-fit:contain;
    flex-shrink:0;
}
.footer-logo-text { display:flex; flex-direction:column; }
.footer-logo-zh {
    font-size:17px; font-weight:700; color:var(--white);
    letter-spacing:2px;
}
.footer-logo-en {
    font-size:9px; font-weight:500; color:rgba(255,255,255,0.4);
    letter-spacing:1.2px; text-transform:uppercase;
}

/* 关于我们品牌图 */
.about-brand-logo {
    margin-bottom:20px;
}
.about-brand-logo img {
    max-width:100%; height:auto;
    max-height:64px;
    object-fit:contain;
    object-position:left;
}

/* ========================================
   导航
   ======================================== */
.header {
    position:fixed; top:0; left:0; right:0; z-index:1000;
    background:rgba(255,255,255,0.97);
    height:var(--header-h);
    transition:box-shadow 0.3s;
}
.header.scrolled { box-shadow:var(--shadow-md); }
.header-inner {
    display:flex; align-items:center; justify-content:space-between;
    height:100%;
}
.main-nav .nav-list { display:flex; list-style:none; gap:4px; }
.nav-link {
    display:block; padding:8px 16px;
    text-decoration:none; color:var(--text);
    font-size:15px; border-radius:var(--radius-sm);
    transition:color 0.2s, background 0.2s;
}
.nav-link:hover,
.nav-link.active {
    color:var(--green);
    background:rgba(45,125,70,0.06);
}

/* 汉堡 */
.hamburger {
    display:none; flex-direction:column; gap:5px;
    width:40px; height:40px; background:none; border:none;
    cursor:pointer; padding:8px; z-index:1001;
}
.hamburger span {
    display:block; height:2px; background:var(--blue);
    border-radius:2px; transition:0.25s ease;
}
.hamburger.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger.active span:nth-child(2){ opacity:0; }
.hamburger.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ========================================
   首屏 — 全幅背景图
   ======================================== */
.hero {
    position:relative;
    min-height:580px; height:100vh; max-height:760px;
    display:flex; align-items:center;
    background:url('https://images.unsplash.com/photo-1599423300746-b62533397364?w=1600&q=85') center/cover no-repeat;
}
.hero-bg {
    position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(26,58,92,0.9) 0%, rgba(26,58,92,0.72) 100%);
}
.hero-content {
    position:relative; z-index:1; color:var(--white);
    max-width:720px;
}
.hero-title {
    font-size:clamp(28px, 4vw, 42px); font-weight:700;
    line-height:1.35; margin-bottom:20px; letter-spacing:1px;
}
.hero-subtitle {
    font-size:clamp(15px, 1.8vw, 17px); line-height:1.85;
    opacity:0.92; margin-bottom:36px; max-width:600px;
}
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }

/* ========================================
   按钮
   ======================================== */
.btn {
    display:inline-flex; align-items:center; justify-content:center;
    padding:14px 32px; border-radius:var(--radius-sm);
    font-size:15.5px; font-weight:600; text-decoration:none;
    border:2px solid transparent; cursor:pointer;
    transition:all 0.2s; letter-spacing:0.5px;
}
.btn-primary {
    background:var(--green); color:var(--white);
    border-color:var(--green);
}
.btn-primary:hover { background:var(--green-light); border-color:var(--green-light); }
.btn-outline {
    background:transparent; color:var(--white);
    border-color:rgba(255,255,255,0.55);
}
.btn-outline:hover {
    background:rgba(255,255,255,0.12);
    border-color:var(--white);
}
.btn-block { width:100%; }

/* ========================================
   通用区块
   ======================================== */
.section { padding:80px 0; }
.section-gray { background:var(--off-white); }
.section-dark {
    background:var(--blue); color:var(--white);
}
.section-header { text-align:center; margin-bottom:56px; }
.section-header h2 {
    font-size:clamp(24px, 3vw, 30px); color:var(--blue);
    margin-bottom:12px; letter-spacing:1px; font-weight:700;
}
.section-header-light h2 { color:var(--white); }
.section-header-light .section-lead { color:rgba(255,255,255,0.7); }
.section-lead {
    font-size:15.5px; color:var(--text-muted);
    max-width:520px; margin:0 auto;
}

/* ========================================
   关于名悦居
   ======================================== */
.about-grid {
    display:grid; grid-template-columns:1fr 1fr;
    gap:56px; align-items:center;
}
.about-image img {
    width:100%; border-radius:var(--radius);
    box-shadow:var(--shadow-md);
}
.about-text p {
    margin-bottom:16px; color:var(--text-secondary);
    text-indent:2em; font-size:15px; line-height:1.9;
}
.about-text p strong { color:var(--text); font-weight:600; }

/* ========================================
   服务领域
   ======================================== */
.services-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(265px, 1fr));
    gap:20px;
}
.service-card {
    background:var(--white); padding:0;
    border-radius:var(--radius);
    border:1px solid var(--border);
    transition:transform 0.2s, box-shadow 0.2s;
    cursor:pointer;
    position:relative;
    overflow:hidden;
    display:flex; flex-direction:column;
}
.service-card:hover {
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}

/* 卡片顶部分类标签 */
.service-cat-tag {
    position:absolute; top:12px; right:12px;
    padding:3px 10px; border-radius:3px;
    font-size:11.5px; font-weight:600;
    letter-spacing:0.5px;
    z-index:1;
}
.tag-residential { background:rgba(45,125,70,0.1); color:#2d7d46; }
.tag-commercial { background:rgba(26,58,92,0.08); color:#1a3a5c; }
.tag-security { background:rgba(245,158,11,0.1); color:#b45309; }
.tag-env { background:rgba(5,150,105,0.1); color:#047857; }
.tag-tech { background:rgba(79,70,229,0.08); color:#4338ca; }
.tag-service { background:rgba(194,65,12,0.08); color:#c2410c; }
.tag-parking { background:rgba(8,145,178,0.1); color:#0e7490; }

/* 卡片主体内边距 */
.service-card .service-icon-wrap { margin:28px 24px 0; }
.service-card h3 { margin:0 24px; }
.service-card p { margin:0 24px; }
.service-card .service-kw { margin:0 24px; }
.service-card .service-detail-btn { margin:auto 24px 20px; }

.service-icon-wrap {
    width:48px; height:48px;
    border-radius:var(--radius);
    background:rgba(45,125,70,0.08);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:14px;
}
.service-card h3 {
    font-size:17px; color:var(--blue);
    margin-bottom:8px; font-weight:600;
}
.service-card p {
    font-size:13.5px; color:var(--text-secondary);
    line-height:1.8; margin-bottom:12px;
    flex:1;
}

/* 关键词标签 */
.service-kw {
    display:flex; flex-wrap:wrap; gap:6px;
    margin-bottom:16px;
}
.service-kw span {
    padding:2px 10px;
    background:rgba(45,125,70,0.06);
    color:#2d7d46;
    font-size:12px; border-radius:3px;
    font-weight:500;
}

/* 查看详情按钮 */
.service-detail-btn {
    display:inline-flex; align-items:center;
    background:none; border:none;
    color:var(--green); font-size:14px;
    font-weight:600; cursor:pointer;
    padding:8px 0; transition:color 0.2s;
    font-family:var(--font);
}
.service-detail-btn:hover { color:var(--green-light); text-decoration:underline; }

/* ========================================
   服务交付机制
   ======================================== */
.delivery-mechanism {
    margin-top:44px; padding-top:32px;
    border-top:1px solid var(--border);
    text-align:center;
}
.delivery-title {
    font-size:18px; font-weight:600; color:var(--blue);
    margin-bottom:20px;
}
.delivery-list {
    display:flex; flex-wrap:wrap;
    justify-content:center; gap:12px;
}
.delivery-item {
    display:flex; align-items:center; gap:8px;
    padding:10px 20px;
    background:var(--white);
    border-radius:var(--radius);
    border:1px solid var(--border);
    font-size:14px; color:var(--text);
    font-weight:500;
}
.delivery-num {
    width:24px; height:24px;
    border-radius:50%;
    background:var(--green);
    color:var(--white);
    display:flex; align-items:center; justify-content:center;
    font-size:13px; font-weight:700;
    flex-shrink:0;
}

/* ========================================
   服务详情弹窗
   ======================================== */
.modal-overlay {
    display:none; position:fixed; inset:0;
    background:rgba(0,0,0,0.5);
    z-index:2000;
    align-items:flex-start; justify-content:center;
    padding:60px 20px 40px;
    overflow-y:auto;
}
.modal-overlay.active {
    display:flex;
}
.modal-content {
    background:var(--white);
    border-radius:var(--radius);
    width:100%; max-width:640px;
    position:relative;
    box-shadow:0 8px 40px rgba(0,0,0,0.18);
    animation:modalIn 0.2s ease;
    display:flex; flex-direction:column;
    max-height:90vh;
}
@keyframes modalIn {
    from { opacity:0; transform:translateY(16px); }
    to { opacity:1; transform:translateY(0); }
}
.modal-header-fixed {
    flex-shrink:0;
    display:flex; justify-content:flex-end;
    padding:8px 10px 0;
}
.modal-close {
    width:36px; height:36px;
    background:none; border:none;
    font-size:26px; color:var(--text-muted);
    cursor:pointer; line-height:1;
    border-radius:50%;
    transition:background 0.2s;
    display:flex; align-items:center; justify-content:center;
}
.modal-close:hover { background:var(--off-white); }
.modal-body {
    padding:8px 32px 16px;
    overflow-y:auto; flex:1;
}
.modal-footer {
    padding:0 32px 28px; flex-shrink:0;
}

.modal-svc-header {
    display:flex; align-items:center; gap:14px;
    margin-bottom:24px;
}
.modal-svc-header .service-icon-wrap {
    width:52px; height:52px; flex-shrink:0; margin-bottom:0;
}
.modal-svc-header h2 {
    font-size:22px; color:var(--blue); font-weight:700;
}
.modal-section {
    margin-bottom:22px;
}
.modal-section h4 {
    font-size:14px; color:var(--green); font-weight:600;
    margin-bottom:10px;
    padding-bottom:6px;
    border-bottom:2px solid rgba(45,125,70,0.15);
}
.modal-section p,
.modal-section ul {
    font-size:14.5px; color:var(--text-secondary);
    line-height:1.85;
}
.modal-section ul {
    list-style:none; padding:0;
}
.modal-section ul li::before {
    content:'•'; color:var(--green); font-weight:700;
    display:inline-block; width:1em; margin-left:4px;
}
.modal-contact-btn {
    display:inline-flex; align-items:center;
    padding:12px 28px;
    background:var(--green); color:var(--white);
    border:none; border-radius:var(--radius-sm);
    font-size:15px; font-weight:600; cursor:pointer;
    font-family:var(--font);
    margin-top:8px;
    transition:background 0.2s;
}
.modal-contact-btn:hover { background:var(--green-light); }

/* 弹窗标签条 */
.modal-tags {
    display:flex; flex-wrap:wrap; gap:6px; margin-bottom:20px;
}
.modal-tags span {
    padding:3px 12px; border-radius:3px;
    font-size:12px; font-weight:500;
    background:rgba(45,125,70,0.08); color:#2d7d46;
}

/* 弹窗适用场景卡片 */
.modal-scenarios {
    display:flex; flex-wrap:wrap; gap:8px; margin-top:4px;
}
.modal-scenarios span {
    padding:6px 14px;
    background:var(--off-white);
    border-radius:var(--radius-sm);
    font-size:13.5px; color:var(--blue);
    font-weight:500;
    border:1px solid var(--border);
}

/* ========================================
   服务标准流程
   ======================================== */
.process-steps {
    max-width:800px; margin:0 auto;
    position:relative;
}
.process-steps::before {
    content:''; position:absolute;
    left:39px; top:0; bottom:0; width:2px;
    background:var(--border);
}
.process-step {
    display:flex; gap:24px; padding-bottom:30px;
    position:relative;
}
.process-step:last-child { padding-bottom:0; }
.step-num {
    width:80px; height:80px; min-width:80px;
    background:var(--blue); color:var(--white);
    border-radius:var(--radius);
    display:flex; align-items:center; justify-content:center;
    font-size:22px; font-weight:700; z-index:1;
}
.step-body { padding-top:12px; }
.step-body h3 {
    font-size:17px; color:var(--blue);
    margin-bottom:6px; font-weight:600;
}
.step-body p {
    font-size:14.5px; color:var(--text-secondary);
    line-height:1.8;
}

/* ========================================
   项目案例
   ======================================== */
.cases-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
    gap:24px;
}
.case-card {
    background:var(--white); border-radius:var(--radius);
    overflow:hidden; box-shadow:var(--shadow-sm);
    transition:transform 0.2s, box-shadow 0.2s;
}
.case-card:hover {
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}
.case-image { aspect-ratio:3/2; overflow:hidden; }
.case-image img { width:100%; height:100%; object-fit:cover; transition:transform 0.35s; }
.case-card:hover .case-image img { transform:scale(1.03); }
.case-body { padding:20px; }
.case-tag {
    display:inline-block; padding:2px 10px;
    background:rgba(45,125,70,0.1); color:var(--green);
    font-size:12px; border-radius:100px; margin-bottom:8px;
}
.case-body h3 { font-size:17px; color:var(--blue); margin-bottom:6px; font-weight:600; }
.case-body p { font-size:13.5px; color:var(--text-secondary); line-height:1.7; }

/* ========================================
   新闻动态
   ======================================== */
.news-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
    gap:24px;
}
.news-card {
    background:var(--white); border-radius:var(--radius);
    overflow:hidden; border:1px solid var(--border);
    transition:transform 0.2s, box-shadow 0.2s;
}
.news-card:hover {
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
}
.news-image { aspect-ratio:16/10; overflow:hidden; }
.news-image img { width:100%; height:100%; object-fit:cover; }
.news-body { padding:20px; }
.news-body time { font-size:13px; color:var(--text-muted); }
.news-body h3 {
    font-size:17px; color:var(--blue);
    margin:8px 0; line-height:1.5; font-weight:600;
}
.news-body p {
    font-size:13.5px; color:var(--text-secondary);
    line-height:1.75; margin-bottom:10px;
    display:-webkit-box; -webkit-line-clamp:3;
    -webkit-box-orient:vertical; overflow:hidden;
}
.news-link {
    color:var(--green); text-decoration:none;
    font-size:14px; font-weight:500;
}
.news-link:hover { text-decoration:underline; }

/* ========================================
   联系我们
   ======================================== */
.contact-grid {
    display:grid; grid-template-columns:1fr 1.2fr;
    gap:48px; align-items:start;
}
.contact-item {
    display:flex; gap:16px; margin-bottom:28px;
}
.contact-icon {
    min-width:48px; height:48px;
    background:rgba(255,255,255,0.1); border-radius:var(--radius);
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
}
.contact-item h4 {
    font-size:13px; color:rgba(255,255,255,0.65);
    margin-bottom:4px; font-weight:400;
}
.contact-item p { font-size:15px; }
.contact-link { color:var(--white); text-decoration:none; }
.contact-link:hover { text-decoration:underline; }

.contact-form-wrap {
    background:var(--white); border-radius:var(--radius);
    padding:32px; color:var(--text);
    max-width:100%;
    overflow:hidden;
}
.contact-form-wrap h3 {
    font-size:19px; color:var(--blue);
    margin-bottom:22px; font-weight:600;
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-group { margin-bottom:16px; }
.form-group label {
    display:block; font-size:14px; font-weight:500;
    margin-bottom:6px; color:var(--text);
}
.required { color:#dc2626; }
.form-group input,
.form-group textarea {
    width:100%; padding:10px 14px;
    border:1px solid var(--border); border-radius:var(--radius-sm);
    font-size:14.5px; font-family:var(--font);
    transition:border-color 0.2s, box-shadow 0.2s;
    outline:none; background:var(--white);
}
.form-group input:focus,
.form-group textarea:focus {
    border-color:var(--green);
    box-shadow:0 0 0 3px rgba(45,125,70,0.08);
}
.form-group input.error,
.form-group textarea.error { border-color:#dc2626; }
.form-error {
    display:block; font-size:12.5px; color:#dc2626;
    min-height:18px; margin-top:3px;
}
.form-success {
    text-align:center; padding:36px 16px;
}
.form-success p {
    font-size:15.5px; color:var(--green); font-weight:500;
}

/* ========================================
   页脚
   ======================================== */
.site-footer {
    background:#111827; color:rgba(255,255,255,0.6);
    padding:56px 0 0;
}
.footer-grid {
    display:grid;
    grid-template-columns:1.5fr 1fr 1fr 1.3fr;
    gap:40px; padding-bottom:40px;
    border-bottom:1px solid rgba(255,255,255,0.08);
}
.footer-col h4 { font-size:15px; color:var(--white); margin-bottom:16px; }
.footer-col p { font-size:13.5px; line-height:1.8; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a,
.footer-col a {
    color:rgba(255,255,255,0.5); text-decoration:none;
    font-size:13.5px; transition:color 0.2s;
}
.footer-col ul li a:hover,
.footer-col a:hover { color:rgba(255,255,255,0.8); }
.footer-bottom {
    text-align:center; padding:22px 0;
    font-size:13px; color:rgba(255,255,255,0.35);
}

/* ========================================
   返回顶部
   ======================================== */
.back-to-top {
    position:fixed; bottom:32px; right:32px;
    width:44px; height:44px;
    background:var(--blue); color:var(--white);
    border:none; border-radius:50%;
    font-size:18px; font-weight:700; cursor:pointer;
    box-shadow:var(--shadow-md);
    opacity:0; visibility:hidden;
    transform:translateY(8px);
    transition:all 0.25s ease; z-index:999;
    display:flex; align-items:center; justify-content:center;
}
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { background:var(--blue-light); }

/* ========================================
   移动端遮罩
   ======================================== */
.mobile-overlay {
    display:none; position:fixed; inset:0;
    background:rgba(0,0,0,0.4); z-index:999;
}
.mobile-overlay.active { display:block; }

/* ========================================
   长文本换行
   ======================================== */
.contact-item p,
.contact-value,
.footer-col p,
.about-text p,
.hero-subtitle {
    overflow-wrap:break-word;
    word-break:break-word;
}

/* ========================================
   响应式
   ======================================== */
@media (max-width:1024px) {
    .footer-grid { grid-template-columns:1fr 1fr; }
}

/* ----- 768px（平板 / 大屏手机） ----- */
@media (max-width:768px) {
    .hamburger { display:flex; }

    .main-nav {
        position:fixed; top:0; right:-100%;
        width:min(270px, 80vw); height:100vh;
        background:var(--white);
        box-shadow:-4px 0 20px rgba(0,0,0,0.15);
        padding:88px 24px 32px;
        transition:right 0.3s ease;
        z-index:1000;
    }
    .main-nav.open { right:0; }
    .main-nav .nav-list { flex-direction:column; gap:0; }
    .main-nav .nav-link {
        padding:14px 10px;
        border-bottom:1px solid var(--border);
        font-size:16px; border-radius:0;
    }

    /* 首屏 — 保持完整官网感 */
    .hero {
        height:auto; min-height:520px; max-height:none;
        padding:110px 0 60px;
    }
    .hero-bg {
        background:linear-gradient(180deg, rgba(26,58,92,0.82) 0%, rgba(26,58,92,0.7) 100%);
    }
    .hero-title {
        font-size:clamp(26px, 5.6vw, 32px);
        line-height:1.4; margin-bottom:18px;
    }
    .hero-subtitle { font-size:14.5px; line-height:1.8; margin-bottom:30px; }
    .hero-actions { flex-direction:row; max-width:100%; }
    .hero-actions .btn { padding:13px 26px; }

    .section { padding:56px 0; }
    .section-header { margin-bottom:36px; }

    .about-grid { grid-template-columns:1fr; gap:28px; }
    .about-image { order:-1; max-width:100%; }
    .about-brand-logo img { max-height:52px; }

    /* 服务卡片 — 左侧强调线 + 更紧凑 */
    .services-grid { grid-template-columns:1fr; gap:12px; }
    .service-card {
        border-left:4px solid var(--green);
        padding:0;
    }
    .service-card:hover { border-left-color:var(--green-light); }
    .service-card .service-icon-wrap { margin:20px 16px 0; width:42px; height:42px; }
    .service-card h3 { margin:0 16px; font-size:16px; }
    .service-card p { margin:0 16px 8px; font-size:13.5px; }
    .service-card .service-kw { margin:0 16px 10px; }
    .service-card .service-detail-btn {
        margin:auto 16px 14px;
        font-size:14px; font-weight:600;
        color:var(--green);
        padding:8px 0;
        border-top:1px solid var(--border);
        width:calc(100% - 32px);
    }
    .service-cat-tag { top:10px; right:10px; font-size:11px; }

    .cases-grid { grid-template-columns:1fr; gap:16px; }
    .news-grid { grid-template-columns:1fr; gap:16px; }
    .contact-grid { grid-template-columns:1fr; gap:28px; }
    .contact-info { padding-right:0; }
    .form-row { grid-template-columns:1fr; }

    .footer-grid { grid-template-columns:1fr 1fr; gap:24px; }

    .process-step { gap:14px; }
    .step-num { width:56px; height:56px; min-width:56px; font-size:18px; }
    .step-body { padding-top:8px; }
    .process-steps::before { left:27px; }

    .back-to-top { width:40px; height:40px; bottom:24px; right:20px; font-size:16px; }
    .contact-form-wrap { padding:24px 20px; }

    /* 弹窗 — 固定头 + 固定底按钮 */
    .modal-overlay { padding:20px 10px 0; align-items:flex-end; }
    .modal-content {
        max-width:100%; max-height:86vh;
        border-radius:var(--radius) var(--radius) 0 0;
    }
    .modal-header-fixed { padding:4px 8px 0; }
    .modal-close { width:32px; height:32px; font-size:24px; }
    .modal-body { padding:12px 18px 10px; }
    .modal-footer { padding:0 18px 18px; }
    .modal-svc-header { margin-bottom:12px; }
    .modal-svc-header .service-icon-wrap { width:38px; height:38px; }
    .modal-svc-header h2 { font-size:17px; }
    .modal-section { margin-bottom:14px; }
    .modal-section h4 { font-size:13px; margin-bottom:4px; }
    .modal-section p, .modal-section ul { font-size:13px; line-height:1.65; }
    .modal-contact-btn {
        width:100%; justify-content:center;
        padding:12px 20px; font-size:14.5px;
    }
    .modal-tags { margin-bottom:10px; }
    .modal-scenarios span { padding:5px 10px; font-size:12.5px; }

    /* 交付机制 */
    .delivery-mechanism { margin-top:36px; padding-top:24px; }
    .delivery-list { gap:8px; }
    .delivery-item { padding:8px 14px; font-size:13px; }
}

/* ----- 480px ----- */
@media (max-width:480px) {
    .header { --header-h: 58px; height:58px; }
    .header-inner { height:58px; }

    .logo { gap:6px; }
    .logo-icon { width:30px; height:30px; }
    .logo-en { display:none; }
    .logo-zh { font-size:15px; letter-spacing:1px; }
    .footer-logo img { width:32px; height:32px; }
    .footer-logo-zh { font-size:14px; }

    .hero {
        min-height:500px;
        padding:100px 0 52px;
    }
    .hero-title { font-size:clamp(23px, 6.2vw, 27px); letter-spacing:0.8px; margin-bottom:16px; }
    .hero-subtitle { font-size:13.8px; line-height:1.75; margin-bottom:26px; }
    .hero-actions { flex-direction:column; }
    .hero-actions .btn { text-align:center; padding:12px 22px; font-size:14.5px; }

    .container { padding:0 16px; }
    .section { padding:48px 0; }
    .section-header { margin-bottom:30px; }
    .section-header h2 { font-size:22px; }

    .service-card .service-icon-wrap { margin:18px 14px 0; width:38px; height:38px; }
    .service-card h3 { margin:0 14px; font-size:15px; }
    .service-card p { margin:0 14px 7px; font-size:13px; }
    .service-card .service-kw { margin:0 14px 8px; }
    .service-card .service-detail-btn { margin:auto 14px 12px; width:calc(100% - 28px); font-size:13px; }

    .contact-form-wrap { padding:22px 16px; }
    .modal-body { padding:10px 14px 8px; }
    .modal-footer { padding:0 14px 16px; }
}

/* ----- 400px ----- */
@media (max-width:400px) {
    .header { height:56px; }
    .header-inner { height:56px; }
    .logo-icon { width:28px; height:28px; }
    .logo-zh { font-size:14px; }

    .hero {
        min-height:460px;
        padding:92px 0 44px;
    }
    .hero-title { font-size:22px; letter-spacing:0.5px; margin-bottom:14px; }
    .hero-subtitle { font-size:13px; line-height:1.7; margin-bottom:22px; }
    .hero-actions .btn { padding:12px 18px; font-size:14px; }

    .section { padding:42px 0; }
    .section-header h2 { font-size:20px; }
    .section-lead { font-size:13.5px; }

    .service-card .service-icon-wrap { width:36px; height:36px; margin:16px 12px 0; }
    .service-card h3 { margin:0 12px; font-size:14.5px; }
    .service-card p { margin:0 12px 6px; font-size:12.5px; }
    .service-card .service-kw { margin:0 12px 8px; }
    .service-card .service-kw span { font-size:11px; }
    .service-card .service-detail-btn { margin:auto 12px 10px; width:calc(100% - 24px); }

    .step-num { width:44px; height:44px; min-width:44px; font-size:15px; }
    .process-steps::before { left:21px; }
    .step-body h3 { font-size:14.5px; }

    .contact-form-wrap { padding:18px 14px; }
    .form-group input,
    .form-group textarea { padding:11px 12px; font-size:14px; }
    .form-group label { font-size:13px; }

    .back-to-top { width:36px; height:36px; bottom:20px; right:14px; font-size:14px; }
    .site-footer { padding:40px 0 0; }
    .footer-grid { grid-template-columns:1fr; }
}