/* ===== 上海拓固建筑科技有限公司 官网 · 设计系统 ===== */
:root {
    --navy: #0c2d48;
    --navy-2: #14507a;
    --navy-3: #1d6aa5;
    --orange: #ef7d22;
    --orange-d: #d9690f;
    --orange-l: #fff0dc;   /* 悬停浅橙底：深蓝字 12.63:1（AAA），大面积铺底不刺眼 */
   --red: #e4002b;        /* 品牌红（图形标/图形块用） */
   --red-d: #a01122;      /* 品牌红·深（渐变收尾/压暗用） */
    --ink: #1f2d3d;
    --muted: #5b6b7b;
    --bg: #f4f6f9;
    --white: #fff;
    --line: #e4e9ef;
    --shadow: 0 6px 24px rgba(12,45,72,.08);
    --radius: 12px;
    --maxw: 1180px;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
    color: var(--ink);
    background: var(--bg);
    line-height: 1.75;
    font-size: 16px;
}

/* 正文段落默认首行缩进 2 个字符（中文排版惯例） */
p {
    text-indent: 2em;
}

/* 非正文文本不缩进：hero 标题/导语、页脚信息、区块副标题、拓固之名宣言、地图说明、联系页标签值行 */
.hero p,
.footer p,
.section-head p,
.manifesto p,
.map-cap,
.contact .row p {
    text-indent: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

.wrap {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 0 20px;
}

.section {
    padding: 72px 0;
}

.section.alt {
    background: var(--white);
}

/* 首页关于拓固区块（about.html 已不再使用 .about-hero，此规则仅作用于首页） */
.about-hero {
    background: var(--white);
}

.section-head {
    text-align: center;
    margin-bottom: 44px;
}

.section-head .eyebrow {
    color: var(--orange);
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
}

.section-head h2 {
    font-size: 30px;
    color: var(--navy);
    margin: 8px 0 10px;
    position: relative;
    display: inline-block;
}

.section-head h2::after {
    content: "";
    display: block;
    width: 54px;
    height: 4px;
    background: var(--orange);
    margin: 12px auto 0;
    border-radius: 2px;
}

.section-head p {
    color: var(--muted);
    max-width: 720px;
    margin: 0 auto;
}

/* 精选工程案例版块引言（行业词列举）：预留横向留白，鼠标经过整段转浅橙底+橙描边，
   文字转深蓝；留白预先存在故文字零位移。类名带版块前缀 cs-，避免与其他版块冲突 */
.section-head p.cs-scope {
    padding: 14px 18px;
    text-indent: 0;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}

.section-head p.cs-scope:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}

/* services.html 服务范围引入语：鼠标经过显浅橙底 */
.svc-scope {
    padding: 12px 16px;
    text-indent: 0;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.svc-scope:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}

/* technology.html 三段引入语/附注：鼠标经过显浅橙底 */
.tech-intro,
.tech-note {
    padding: 12px 16px;
    text-indent: 0;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.tech-intro:hover,
.tech-note:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}
.tech-note {
    text-align: center;
    color: var(--muted);
    margin-top: 26px;
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

/* index.html 四段版块引入语：鼠标经过显浅橙底（保持 section-head 居中不变位） */
.idx-intro {
    padding: 12px 16px;
    text-indent: 0;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.idx-intro:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}

/* Header */
.header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(12,45,72,.96);
    backdrop-filter: blur(6px);
}

.header .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
}

.logo {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
}

.logo img {
    height: 68px;
    width: auto;
    max-width: 320px;
    display: block;
}

.nav {
    display: flex;
    align-items: center;
    gap: 4px;
}

.nav a {
    padding: 8px 14px;
    color: #dce6f0;
    font-size: 15px;
    border-radius: 8px;
    transition: .2s;
}

.nav a:hover,
.nav a.active {
    color: #fff;
    background: rgba(255,255,255,.10);
}

.nav-toggle {
    display: none;
    background: none;
    border: 0;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
}

/* Hero */
.hero {
    position: relative;
    color: #fff;
    overflow: hidden;
}

.hero .bg {
    position: absolute;
    inset: 0;
    background: url('../assets/img/company/办公楼.jpg') center/cover no-repeat;
    filter: brightness(.45);
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg,rgba(12,45,72,.92),rgba(20,80,122,.72));
}

.hero .wrap {
    position: relative;
    z-index: 2;
    padding: 68px 20px 66px;

    /* 原 110/96，缩至 4/5 */
}

.hero .tag {
    display: inline-block;
    background: var(--orange);
    color: var(--navy);      /* 白字在橙底仅 2.75:1，改深蓝达 5.14:1 */
    font-size: 18px;          /* 等比缩放，保持药丸比例（基准 13px） */
    font-weight: 700;
    padding: 8px 19px;        /* 与字号等比（13px→6/14，18px→8/19） */
    border-radius: 30px;
    letter-spacing: 1.4px;    /* 与字号等比（13px→1px，18px→1.4px） */
}

/* 首页 hero 顶部：四个大字“建筑建筑”——品牌金实心 + 描边双色设计 */
.hero-brand {
    display: inline-block;
    font-size: 58px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 10px;
    margin-bottom: 4px;
}

.hero-brand .solid {
    color: var(--orange);

    /* 品牌橙（实心） */
}

.hero-brand .outline {
    color: transparent;
    -webkit-text-stroke: 2px var(--orange);

    /* 品牌橙描边，内部透出深色背景 */
    margin-left: 6px;
}

/* 首页 hero 主标题：恢复原 h1 角色（非首页已删除 hero 内 h1，由 lead 承接） */
.hero h1 {
    font-size: 44px;
    line-height: 1.25;
    margin: 20px 0 14px;
    font-weight: 800;
}

/* 首页 hero 导语：恢复原 lead 样式（浅色、可换行、限宽） */
.hero p.lead {
    font-size: 20px;
    color: #dce6f0;
    max-width: 760px;
}

/* 非首页 hero：lead 承接标题角色（等同旧 .hero h1），仅作用于含 .tag 的 hero */
.hero .tag + p.lead {
    font-size: 24px;
    line-height: 1.35;
    margin: 20px 0 14px;
    font-weight: 800;
    color: #fff;
    /* PC 端（>1100px）保持单行显示 */
    white-space: nowrap;
    max-width: none;
}

.hero .creed {
    margin-top: 26px;
    font-size: 15px;
    color: #bcd0e2;
    letter-spacing: 1px;
}

.hero .btns {
    margin-top: 34px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.btn {
    display: inline-block;
    padding: 13px 28px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 15px;
    transition: .2s;
}

.btn-primary {
    background: var(--orange);
    color: var(--navy);      /* 白字 2.75:1 → 深蓝 5.14:1 */
}

.btn-primary:hover {
    background: #f79a3c;     /* 悬停提亮：深蓝字 6.50:1（比压暗更可读） */
    transform: translateY(-2px);
}

.btn-ghost {
    border: 1.5px solid rgba(255,255,255,.5);
    color: #fff;
}

.btn-ghost:hover {
    background: rgba(255,255,255,.12);
}

/* Stats */
.stats {
    background: var(--navy);
    color: #fff;
}

.stats .grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
    text-align: center;
    padding: 32px 0;

    /* 原 46，缩至 4/5 */
}

.stats .num {
    font-size: 38px;
    font-weight: 800;
    color: var(--orange);
}

.stats .lbl {
    color: #a9c0d6;
    font-size: 14px;
    margin-top: 4px;
}

/* Cards */
.grid-3 {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}

.grid-2 {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 24px;
}

.card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px;
    box-shadow: var(--shadow);
    transition: .2s;
}

.card:hover {
    transform: translateY(-4px);
    border-color: var(--navy-3);
}

.card .ic {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    background: rgba(20,80,122,.10);
    color: var(--navy-2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 16px;
}

.card h3 {
    font-size: 20px;
    color: var(--navy);
    margin-bottom: 10px;
}

.card p {
    color: var(--muted);
    font-size: 15px;
}

.card .more {
    display: inline-block;
    margin-top: 14px;
    color: var(--orange);
    font-weight: 700;
    font-size: 14px;
}

/* 使用过的技术：标题移入 .ic、正文放大到原 h3 字号（仅本页 tech-cards 作用域，不污染 index/services 同名卡片） */
.tech-cards .ic {
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    display: block;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--navy);
    margin-bottom: 10px;
    padding: 0;
}

.tech-cards .card p {
    font-size: 20px;
    line-height: 1.75;
    color: var(--muted);
    text-indent: 0;
}

/* 鼠标经过：浅橙底 + 1px 实心橙描边 + 深蓝字（与全站悬停同款） */
.tech-cards .card {
    transition: background .35s, box-shadow .35s, transform .2s;
}
.tech-cards .card:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
}
.tech-cards .card:hover .ic,
.tech-cards .card:hover p {
    color: var(--navy);
}

/* Business list */
.biz-list {
    counter-reset: biz;
}

.biz {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
}

.biz:last-child {
    border-bottom: 0;
}

.biz .no {
    counter-increment: biz;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--navy);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}

.biz .no::before {
    content: counter(biz,decimal-leading-zero);
}

.biz h4 {
    color: var(--navy);
    font-size: 18px;
    margin-bottom: 4px;
}

.biz p {
    color: var(--muted);
    font-size: 15px;
    text-indent: 0;         /* 描述行与自己的 h4 标题左对齐（撤销全局 p 首行缩进） */
}

/* 八项专业服务体系：鼠标经过整条，该条背景变橙黄（仅服务范围页 .biz-list.hoverable）
   横向用 padding 16px + 负 margin 抵消，使底色有留白而文字位置不变 */
.biz-list.hoverable .biz {
    padding: 20px 16px;
    margin: 0 -16px;
    border-radius: var(--radius);
    transition: background .35s, box-shadow .35s;
}

.biz-list.hoverable .biz:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
}

.biz-list.hoverable .biz:hover h4,
.biz-list.hoverable .biz:hover p {
    color: var(--navy);
}

/* Tech */
.tech {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 22px;
}

.tech .item {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
}

.tech .item img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}

.tech .item .body {
    padding: 22px 24px;
}

.tech .item h3 {
    color: var(--navy);
    font-size: 20px;
    margin-bottom: 8px;
}

.tech .item p {
    color: var(--muted);
    font-size: 15px;
}

/* 常用加固工艺：每个卡片 h3 下方的描述段落，鼠标经过显示浅橙底（与全站悬停同款）
   用 padding + 负 margin 抵消，文字零位移；顶边恰好落在标题与正文间距处，不压标题 */
.tech .item p {
    padding: 8px 14px 10px;
    margin: -8px -14px -10px;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}

.tech .item p:hover {
    background: var(--orange-l);                 /* #fff0dc 浅橙 */
    box-shadow: inset 0 0 0 1px var(--orange);   /* 1px 实心橙描边 */
    color: var(--navy);                          /* 深蓝字，12.63:1 */
}

/* Cases */
.cases {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 22px;
}

.case {
    position: relative;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
}

.case img {
    width: 100%;
    height: 230px;
    object-fit: cover;
    transition: .3s;
}

.case:hover img {
    transform: scale(1.05);
}

.case .cap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(transparent,rgba(12,45,72,.92));
    color: #fff;
    padding: 30px 18px 16px;
    font-weight: 700;
    font-size: 16px;
}

.case .cat {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--orange);
    color: var(--navy);
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
}

/* News */
.news {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}

.news .item {
    display: flex;
    gap: 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 18px;
    box-shadow: var(--shadow);
}

.news .date {
    flex: 0 0 64px;
    width: 64px;
    height: 64px;
    border-radius: 10px;
    background: var(--navy);
    color: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.news .date b {
    font-size: 24px;
    line-height: 1;
}

.news .date span {
    font-size: 12px;
    color: #a9c0d6;
}

.news .item h4 {
    font-size: 16px;
    color: var(--navy);
    margin-bottom: 6px;
}

.news .item p {
    font-size: 14px;
    color: var(--muted);
}

/* News cards v2：每行 3 个、两行 6 个的图文新闻卡 */
.news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.news-card {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: transform .3s, box-shadow .3s;
}

.news-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(12,45,72,.16);
}

.news-card .cover {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--bg);
}

.news-card .cover img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.news-card:hover .cover img {
    transform: scale(1.05);
}

.news-card .body {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 8px;
    padding: 18px 20px 20px;
}

.news-card .meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--muted);
    text-indent: 0;
}

.news-card .meta time {
    color: var(--red);
    font-weight: 600;
}

.news-card h4 {
    font-size: 18px;
    line-height: 1.5;
    color: var(--navy);
    text-indent: 0;
    margin-bottom: 0;
}

.news-card .desc {
    font-size: 14px;
    line-height: 1.7;
    color: var(--muted);
    text-indent: 0;
    margin-bottom: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-card .foot {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px dashed var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-indent: 0;
}

.news-card .news-tag {
    display: inline-block;
    background: var(--orange);
    color: var(--navy);
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 20px;
    white-space: nowrap;
}

.news-card .news-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--red);
    text-decoration: none;
    white-space: nowrap;
}

.news-card .news-more svg {
    width: 14px;
    height: 14px;
}

.news-card .news-more:hover {
    text-decoration: underline;
}

/* ===== 工程案例：奋斗瞬间（红色横幅区块） =====
   布局：左列=两行标题+两个无边框文本框；右列=一个文本框（与左列两框上下对齐） */
.story {
    background: linear-gradient(155deg, var(--red) 0%, var(--red-d) 100%);
    color: #fff;
}

.story .wrap {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-rows: auto auto 1fr;
    column-gap: 64px;
    row-gap: 10px;
}

.story-title {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 24px;
}

.story-title h2 {
    color: #fff;
    font-size: 30px;
    line-height: 1.3;
    letter-spacing: 1px;
    text-indent: 0;
}

.story-title .lead {
    color: rgba(255,255,255,.85);
    font-size: 18px;
    margin-top: 6px;
    text-indent: 0;
}

/* 文本框：与 about.html 无边框文本框同款——无边框、左对齐、首行缩进两字、悬停橙黄 */
.story-box {
    border-radius: var(--radius);
    padding: 20px 26px;
    transition: background .35s, box-shadow .35s;
}

.story-box:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
}

.story-box h3 {
    color: #fff;
    font-size: 20px;
    margin-bottom: 10px;
}

.story-box .story-txt {
    color: rgba(255,255,255,.9);
    font-size: 15px;
    line-height: 2.1;
    text-indent: 2em;
    margin-bottom: 0;
}

.story-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: story;
}

.story-list li {
    counter-increment: story;
    color: rgba(255,255,255,.9);
    font-size: 15px;
    line-height: 1.9;
    padding-left: 1.6em;
    text-indent: -1.6em;
    margin-bottom: 8px;
}

.story-list li:last-child {
    margin-bottom: 0;
}

.story-list li::before {
    content: counter(story) "、";
    font-weight: 600;
}

.story-box:hover h3,
.story-box:hover .story-txt,
.story-box:hover .story-list li {
    color: var(--navy);
}

.story-box.served { grid-column: 1; grid-row: 2; }
.story-box.story-tech   { grid-column: 1; grid-row: 3; }
.story-box.exp    { grid-column: 2; grid-row: 2 / span 2; }

/* ===== 工程案例：近年工程项目一览表（一行三个，共三行） ===== */
.sheet-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.sheet {
    margin: 0;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
}

.sheet img {
    display: block;
    width: 100%;
    height: auto;
}

/* 点击看原图：鼠标设备悬停时提示条上滑出现；触摸设备无 hover，提示条常显 */
.sheet-zoom {
    display: block;
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
}

.sheet-zoom::after {
    content: "点击看原图";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 9px 0;
    background: rgba(12, 45, 72, .82);
    color: #fff;
    font-size: 13px;
    letter-spacing: .06em;
    text-align: center;
    text-indent: 0;
    transition: opacity .28s ease, transform .28s ease;
}

@media (hover: hover) {
    .sheet-zoom::after {
        opacity: 0;
        transform: translateY(100%);
    }
    .sheet-zoom:hover::after,
    .sheet-zoom:focus-visible::after {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width:900px){
    .story .wrap {
        display: block;
    }
    .story-title {
        margin-bottom: 18px;
    }
    .story-box {
        margin-bottom: 16px;
    }
    .story-box.exp {
        margin-bottom: 0;
    }
    .sheet-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width:640px){
    .sheet-grid {
        grid-template-columns: 1fr;
    }
}

/* 触摸设备（无 hover）：取消覆盖式提示条，改为首卡下方常显一行小字，不遮挡表格 */
@media (hover: none) {
    .sheet-zoom::after {
        content: none;
    }
    .sheet-grid > .sheet:first-child::after {
        content: "轻点表格可查看原图";
        display: block;
        padding: 9px 0;
        background: var(--bg);
        color: var(--muted);
        font-size: 12px;
        text-align: center;
        text-indent: 0;
        border-top: 1px solid var(--line);
    }
}

/* About */
.ah-intro {
    max-width: none;             /* 取消 940px 限制，使顶部文本框与人才战略引言框同宽（整页宽） */
}

.ah-media {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38%;  /* 文字栏 + 图片占 38% 宽 */
    grid-template-rows: auto auto;               /* 行1=标题区，行2=文本框|图片 */
    column-gap: 68px;            /* 文字段与右侧图片的距离 */
}

.ah-head {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}

.ah-media .talent-intro {
    grid-column: 1;
    grid-row: 2;
    margin-bottom: 0;            /* 去掉框自带的下边距，保证行高=文本框高 */
}

.ah-head .eyebrow {
    color: var(--orange);
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
    text-transform: uppercase;
    text-align: center;
}

.ah-head h2 {
    font-size: 30px;
    color: var(--navy);
    margin: 8px 0 10px;
    position: relative;
    display: block;
    text-align: center;
}

/* 与"企业文化"区块的金色下划线一致（此处居中于左栏） */
.ah-head h2::after {
    content: "";
    display: block;
    width: 54px;
    height: 4px;
    background: var(--orange);
    margin: 12px auto 0;
    border-radius: 2px;
}

/* 拓固之名与图片并排：宣言各段首行缩进两字符（文字段宽度恢复原始整栏宽度） */
.ah-media .manifesto {
    max-width: none;
    margin: 0;
}
.ah-media .manifesto p {
    text-indent: 2em;
}

.ah-intro h1 {
    font-size: 30px;
    color: var(--navy);
    margin-bottom: 18px;
}

.ah-intro p {
    color: var(--muted);
    margin-bottom: 14px;
}

/* 图片绝对填充于第2行第2列：不参与行高计算，行高完全由左侧文本框决定，
   因此图片高度=文本框高度，上下边精确对齐 */
.ah-fig {
    grid-column: 2;
    grid-row: 2;
    position: relative;
    min-height: 0;
}

.ah-fig img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;      /* 裁切填充，保持比例不畸变 */
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.culture {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}

.culture .item {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px;
    box-shadow: var(--shadow);
}

.culture .item h3 {
    color: var(--orange);
    font-size: 20px;
    margin-bottom: 10px;
}

.culture .item p {
    color: var(--muted);
}

/* 企业文化：左「企业愿景」图 + 右「价值观/精神」两个文本框 */
.culture-split {
    display: grid;
    grid-template-columns: 5fr 4fr;               /* 右侧文本框宽度 4fr */
    gap: 60px;                          /* 左右栏间距 ≥ 3 个汉字宽 */
    align-items: stretch;               /* 左右两栏等高：右栏两个文本框上下撑满与左栏愿景图同高 */
}

.cu-left {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;        /* 左栏（标题+愿景图）顶对齐，与右侧第一个文本框顶端齐平 */
}

.cu-left h3 {
    color: var(--navy);
    font-size: 24px;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
}

.cu-left h3::after {
    content: "";
    display: block;
    width: 54px;
    height: 4px;
    background: var(--orange);
    margin: 10px auto 0;
    border-radius: 2px;
}

.cu-left img {
    display: block;
    width: 90%;
    max-width: 90%;
    margin: 0 auto;
    border-radius: var(--radius);
}

.cu-right {
    display: flex;
    flex-direction: column;
    gap: 24px;                          /* 两文本框最小间距 */
    justify-content: space-between;     /* 上下两框分别顶到栏顶/栏底，与左侧愿景图等高对齐 */
}

/* 抬高第二个文本框：底部留白使其上移，令其下部花纹最低点稍高于左侧图片最下端 */
.cu-right .cu-box:last-child {
    margin-bottom: 30px;
}

/* 人才战略：两文本框水平并排（同 cu-box 设置）；左框距页左、右框距页右各缩进两字，框间距五个汉字，框宽自适应填满 */
.cu-row {
    display: flex;
    gap: 5em;                             /* 两框之间保持五个汉字宽度 */
    padding: 0 2em;                       /* 左框距页左、右框距页右各两个汉字宽度 */
}
.cu-row .cu-box {
    flex: 1 1 0;                          /* 宽度适配：均分中间剩余空间 */
}
.cu-row .cu-box p {
    margin-bottom: 1.75em;                /* 文本后增加约一行空白 */
}

/* 企业资质：三证并排（左执照/中施工资质/右安许），每证下方配一段文字 */
.certs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    align-items: start;
}
.cert p {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 15px;
}

/* about.html「企业资质」三个文本框下方的说明文字：鼠标经过显浅橙底 */
.cert-note {
    padding: 10px 14px;
    margin: 12px -14px 0;
    border-radius: 12px;
    text-indent: 0;
    transition: background .35s, box-shadow .35s, color .35s;
}
.cert-note:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}

/* 通用图片框：无边框、无填充色，鼠标经过显示橙黄背景（证书 / 企业愿景 / 组织架构共用） */
.img-box {
    background: transparent;             /* 无填充色 */
    border: none;                        /* 无边框 */
    border-radius: var(--radius);
    padding: 16px;
    transition: background .35s ease, box-shadow .35s ease;
}
.img-box:hover {
    background: var(--orange-l);         /* 悬停浅橙底 + 橙描边 */
    box-shadow: inset 0 0 0 1px var(--orange);
}
.img-box img {
    display: block;
    width: 100%;
    height: auto;
}
.img-box.fixed img {
    height: 360px;                       /* 证书统一高度，竖/横版均完整不裁切 */
    object-fit: contain;
}

/* 服务范围：八项服务图按钮 + 下方内容切换框（复刻旧站 service 页版式） */
:root { --red: #E4002B; }                /* 拓固品牌红 */

.svc-tabs {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 14px;
}
.svc-tab {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 18px 8px 14px;
    text-align: center;
    cursor: pointer;
    font: inherit;
    transition: box-shadow .35s ease, background .35s ease, border-color .35s ease;
}
.svc-tab:hover {
    background: var(--orange-l);
    border-color: var(--orange);
}
.svc-tab svg {
    width: 66px;
    height: 66px;
    color: var(--red);
    transition: color .35s ease;
}
.svc-tab:hover svg {
    color: var(--navy);   /* 红图标在橙底仅 1.76:1，悬停一律转深蓝（浅底 12.63:1） */
}
.svc-tab span {
    display: block;
    margin-top: 10px;
    font-size: 15px;
    font-weight: 600;
    color: var(--ink);
    transition: color .35s ease;
}
.svc-tab.active span {
    color: var(--red);
}
.svc-tab:hover span {
    color: var(--navy);
}
.svc-tab.active {
    box-shadow: var(--shadow);
    border-color: var(--orange);
}

/* technology.html 加固工艺详解：6 个切换按钮在 PC 端居中（不影响 services 页 8 按钮网格与移动端 4 列布局） */
@media (min-width: 1101px) {
    .tech-detail .svc-tabs {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 14px;
    }
    .tech-detail .svc-tab {
        flex: 0 0 140px;
        max-width: 140px;
    }
}

.svc-panel {
    display: none;
}
.svc-panel.active {
    display: flex;
    gap: 44px;
    align-items: flex-start;
    margin-top: 38px;
}
.svc-pics {
    flex: 0 0 300px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.svc-pics img {
    display: block;
    width: 100%;
    border-radius: var(--radius);
    box-shadow: var(--shadow);

    /* 统一图片框尺寸：以 svc1 第一张图（svc-buqiang-banliang.jpg 500×373）为基准，
       容器宽 300px → 高 224px（比例 0.746）。用 cover 铺满框、居中裁切，
       使横图/竖图视觉框高一致且不留白（与企业资质版 .img-box.fixed 做法一致）。 */
    height: 224px;
    object-fit: cover;
    object-position: center;
}
.svc-txt {
    flex: 1;
    min-width: 0;
}
.svc-h {
    border-left: 4px solid var(--red);
    padding-left: 12px;
    color: var(--navy);
    font-size: 20px;
    line-height: 1.35;
    margin: 0 0 14px;
}
.svc-txt p {
    color: var(--muted);
    margin: 0 0 14px;
    padding-left: 16px;        /* 与标题文字左边缘（红条4px+内距12px）对齐 */
}

/* 加固工艺详解：每个面板内 h3 下方的描述段落，鼠标经过显示浅橙底（仅 tech-detail 作用域，不影响 services 页同名组件）
   用 padding + 同值负 margin 抵消，使底色有留白而文字位置不变；文字转深蓝保证浅橙底对比度 */
.tech-detail .svc-txt p {
    padding: 12px 16px;
    margin: -12px -16px 2px;   /* 抵消上下左右 padding：上下各 -12 抵消 12；bottom 用 14(原) - 12(padding) = 2 维持与下方间距 */
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.tech-detail .svc-txt p:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}
/* h3 下的有序列表（如"主要特点"）：整块列表作为一个单元悬停变浅橙底（同款效果）
   左内距 32px = 原序号悬挂 16px + 负外距抵消 16px，列表文字与序号位置均不变 */
.tech-detail .svc-list {
    padding: 12px 16px 12px 32px;
    margin: -12px -16px 2px;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.tech-detail .svc-list:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}
/* 服务体系详解（services 页）：拓固服务标题下方的三段（说明 p + 服务列表 ol + 标语 p）
   整体作为一个块，鼠标经过整块显示浅橙底（仅 svc-detail 作用域，不影响 technology 页同名组件）
   用 padding + 同值负 margin 抵消使底色有留白而文字位置不变；h3 拓固服务保持在其上方不点亮。 */
.svc-detail .svc-block {
    padding: 12px 16px;
    margin: 0 -16px 2px;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.svc-detail .svc-block > p {
    padding-left: 0;            /* 取消通用 .svc-txt p 的左缩进，使其与块左缘（及下方列表序号）对齐 */
}
.svc-detail .svc-block:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}
.svc-detail .svc-block:hover p,
.svc-detail .svc-block:hover li,
.svc-detail .svc-block:hover .svc-slogan {
    color: var(--navy);
}
/* 拓固服务标题上方那一段（各面板第一个 h3 的说明 p）仍保持单独悬停，与之前一致 */
.svc-detail .svc-txt > p {
    padding: 12px 16px;
    margin: -12px -16px 2px;
    border-radius: 12px;
    transition: background .35s, box-shadow .35s, color .35s;
}
.svc-detail .svc-txt > p:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
    color: var(--navy);
}
.svc-list {
    margin: 0 0 14px;
    padding-left: 16px;        /* 列表项文字与标题文字左对齐，序号悬挂于左侧留白 */
    color: var(--muted);
}
.svc-list li {
    margin-bottom: 4px;
}
.svc-slogan {
    color: var(--red);
    font-weight: 700;
    text-indent: 0;
}

.cu-box {
    position: relative;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 26px 28px 28px;   /* 底部留白减少一行字空间，仅余容纳花纹内侧 2/3 幅 */
    box-shadow: var(--shadow);
    transition: background .35s ease;
}

/* 文字经过（悬停）时显示旧版标签背景的橙黄色
   采用浅橙底 + 实心橙描边：深蓝字 12.63:1（AAA），大面积铺底不刺眼、黑白打印仍可辨 */
.cu-box:hover {
    background: var(--orange-l);
    border-color: var(--orange);
}

.cu-box h3 {
    color: var(--navy);
    font-size: 20px;
    margin-bottom: 10px;
}

.cu-box p {
    color: var(--muted);
    transition: color .35s ease;
}

.cu-box:hover p {
    color: var(--navy);
}

/* 文本框内分段（段2/段3）：块级显示并首行缩进两字，保持原紧凑排版不增段落间距 */
.cu-box .seg {
    display: block;
    text-indent: 2em;
}

/* 与企业愿景同款标题行（深蓝 + 金色下划线居中），用于组织架构图上方 */
.block-title {
    color: var(--navy);
    font-size: 24px;
    text-align: center;
    position: relative;
    display: inline-block;
    margin-bottom: 20px;
}
.block-title::after {
    content: "";
    display: block;
    width: 54px;
    height: 4px;
    background: var(--orange);
    margin: 10px auto 0;
    border-radius: 2px;
}

/* 人才战略引言：无边框文本框，与页同宽、左对齐、首行缩进两字；悬停显示橙黄背景（同 cu-box） */
.talent-intro {
    background: transparent;            /* 无边框、常态不可见，仅悬停显橙黄 */
    border: none;
    border-radius: var(--radius);
    padding: 22px 26px;
    margin-bottom: 2em;                 /* 与下方两文本框间距增加两个文字高度 */
    transition: background .35s ease, box-shadow .35s ease;
}
.talent-intro p {
    text-indent: 2em;
    color: var(--muted);
    margin: 0 0 14px;
    text-align: left;
}
.talent-intro p:last-child {
    margin-bottom: 0;
}
.talent-intro:hover {
    background: var(--orange-l);
    box-shadow: inset 0 0 0 1px var(--orange);
}
.talent-intro:hover p {
    color: var(--navy);
}

/* 人才战略·注册人员构成（GEO:TEAMFACT）：表格化呈现，2 列/行，风格同 cu-box */
.team-facts {
    margin: 0 0 2em;                  /* 上距由 talent-intro 的 2em 底距控制（margin 折叠），下方与 cu-row 留 2em */
}
.tf-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.tf-cell {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 22px 24px;
    text-align: center;
    transition: background .35s ease, border-color .35s ease;
}
.tf-cell:hover {
    background: var(--orange-l);
    border-color: var(--orange);
}
.tf-num {
    font-size: 40px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--navy);
}
.tf-num span {
    font-size: 16px;
    font-weight: 400;
    color: var(--muted);
    margin-left: 4px;
}
.tf-label {
    margin-top: 8px;
    font-size: 15px;
    font-weight: 600;
    color: var(--ink);
}
.tf-sub {
    margin-top: 4px;
    font-size: 13px;
    color: var(--muted);
}
.tf-note {
    margin-top: 16px;
    font-size: 14px;
    color: var(--muted);
    text-indent: 2em;
}
@media (max-width: 640px) {
    .tf-grid { grid-template-columns: 1fr; }
}

/* 拓固之名：五段宣言套入与顶部公司简介同款的无边框文本框（仅悬停显橙黄背景）；
   文字保持原有深蓝 18px 样式与栏宽，不因套框改变字号/颜色/行距 */
.ah-media .talent-intro .manifesto {
    max-width: none;
    margin: 0;
}
.ah-media .talent-intro p {
    color: var(--navy);
    font-size: 18px;
    line-height: 2.1;
    margin: 0 0 18px;
    text-align: left;
}
.ah-media .talent-intro:hover p {
    color: var(--navy);
}

/* 文本框底部的装饰花纹：贴底边框、约 1/3 出框下、两侧少许外探；颜色调淡为原 1/4 */
.cu-deco {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 33.333%);   /* 文本框下边与花纹上 1/3 处对齐：2/3 在框内、1/3 出框下 */
    width: 120%;                            /* 两侧少许外伸 */
    max-width: none;
    opacity: 0.25;                          /* 颜色淡化为当前的 1/4 */
    pointer-events: none;
}

.manifesto {
    max-width: 880px;
    margin: 0 auto;
}

.manifesto .lead-line {
    font-size: 18px;
    color: var(--navy);
    font-weight: 700;
    line-height: 2.1;
    text-align: left;
    margin: 0 0 18px;
}

.manifesto p {
    font-size: 18px;
    line-height: 2.1;
    color: var(--navy);
    font-weight: 700;
    margin: 0 0 18px;
    text-align: left;
}

.manifesto .closing {
    text-align: left;
    color: var(--navy);
    font-weight: 700;
    margin-top: 18px;
    font-size: 18px;
}

/* 拓固之名：仅中间三段不加粗（首段开篇语与结尾行保持加粗） */
.ah-media .manifesto p:not(.lead-line):not(.closing) {
    font-weight: 400;
}

/* Contact */
.contact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: stretch;

    /* 联系方式栏与在线留言栏等高 */
}

.contact .info .row {
    display: flex;
    gap: 14px;
    margin-bottom: 18px;
}

.contact .info .ic {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(20,80,122,.10);
    color: var(--navy-2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
}

.contact .info .ic svg {
    width: 22px;
    height: 22px;
    fill: var(--orange);

    /* 品牌金图标 */
}

.contact .info h4 {
    color: var(--navy);
    font-size: 15px;
    margin-bottom: 2px;
}

.contact .info p {
    color: var(--muted);
    font-size: 15px;
}

/* 联系页：公司经营地址地图容器（OpenStreetMap 免密钥嵌入，整页宽） */
.map-box {
    margin-top: 40px;
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(12,45,72,.08);
}

.map-box iframe {
    display: block;
    width: 100%;
    height: 300px;
    border: 0;
}

.map-cap {
    margin: 0;
    padding: 10px 14px;
    font-size: 13px;
    color: var(--muted);
    background: var(--bg);
    border-top: 1px solid var(--line);
}

.form input,
.form textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 9px;
    font-size: 15px;
    font-family: inherit;
    margin-bottom: 14px;
    background: #fff;
}

/* 表单：称呼与联系电话并排一行 */
.form-row {
    display: flex;
    gap: 12px;
}

.form-row input {
    flex: 1;
    width: auto;
    min-width: 0;
}

.form textarea {
    resize: vertical;
    min-height: 120px;
}

.form button {
    width: 100%;
    background: var(--orange);
    color: var(--navy);      /* 白字 2.75:1 → 深蓝 5.14:1 */
    border: 0;
    padding: 14px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 16px;
    cursor: pointer;
}

.form button:hover {
    background: #f79a3c;     /* 悬停提亮：深蓝字 6.50:1 */
}

.note {
    font-size: 13px;
    color: var(--muted);
    margin-top: 10px;
}

/* Footer */
.footer {
    background: var(--navy);
    color: #cfe0ef;
    padding: 56px 0 0;
}

.f-top {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;

    /* 三栏底边齐平：第二栏末行＝第一栏口号行 */
    gap: calc(46px + 2em);

    /* 第一、二栏间距在 46px 基础上再加 2em */
    --slogan-w: 420px;

    /* 第一栏宽度＝口号整行宽度（您不再需要面对…我们的服务！） */
    --cn: 14px;

    /* 一个汉字宽度基准（联系方式栏比第一栏窄 2 个汉字） */
}

.f-brand {
    width: var(--slogan-w);
}

.f-contact {
    width: calc(var(--slogan-w) - 2 * var(--cn));

    /* 比第一栏窄 2 个汉字（较此前 +2 汉字宽） */
}

.f-wechat {
    margin-left: auto;

    /* 第三栏（微信号码）靠页面右侧 */
}

.f-logo {
    margin-bottom: 18px;
}

.f-logo img {
    height: 88px;
    width: auto;
    display: block;
}

.f-logo .mark {
    width: 46px;
    height: 46px;
    border-radius: 10px;
    background: var(--orange);
    color: var(--navy);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 24px;
}

.f-logo b {
    font-size: 20px;
    letter-spacing: 2px;
    display: block;
}

.f-logo small {
    display: block;
    font-size: 12px;
    letter-spacing: 3px;
    color: #9fb6cc;
}

.f-scope {
    font-size: 14px;
    color: #a9c0d6;
    line-height: 1.95;
    margin-bottom: 12px;
}

.f-slogan {
    font-size: 15px;
    color: #dce6f0;
    font-weight: 600;
    white-space: nowrap;

    /* 保持口号单行，使第一栏宽度＝口号整行宽度 */
}

.f-slogan em {
    font-style: normal;
    color: var(--orange);
    font-weight: 800;
}

.footer h4 {
    color: #fff;
    font-size: 16px;
    margin-bottom: 10px;
    letter-spacing: 1px;
}

.f-col a {
    color: #bcd0e2;
    font-size: 14px;
    display: block;
    margin-bottom: 11px;
}

.f-col a:hover {
    color: var(--orange);
}

.f-contact .row {
    display: flex;
    gap: 12px;
    margin-bottom: 6px;
    align-items: flex-start;
}

.f-contact .row:last-child {
    margin-bottom: 0;

    /* 末行不留间距，底边与第一栏口号行精确齐平 */
}

.f-contact svg {
    width: 20px;
    height: 20px;
    fill: var(--orange);
    flex: 0 0 20px;
    margin-top: 3px;
}

.f-contact p {
    font-size: 14px;
    color: #cfe0ef;
    line-height: 1.7;
    margin: 0;
}

/* 右侧"联系我们"栏：微信二维码 */
.f-wechat {
    text-align: left;
}

.f-wechat .qr {
    width: 120px;

    /* 放大二维码（间距收紧后第三栏总高仍≈第二栏，标题同高） */
    height: 120px;
    background: #fff;
    border-radius: 10px;
    padding: 6px;
    box-sizing: border-box;
    display: block;
    margin-top: 0;

    /* 标题→图片间距收紧 */
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

.f-divider {
    height: 3px;
    background: var(--orange);
    margin: 34px 0 0;
}

.f-bottom {
    padding: 20px 0 24px;
}

.tagline {
    color: #cfe0ef;

    /* 与“联系方式”栏文字同色 */
    font-size: 14px;

    /* 与联系方式栏正文同字号 */
    font-weight: 600;
    margin-top: 0;

    /* 图片→文字间距收紧，使第三栏总高≈第二栏 */
    white-space: nowrap;

    /* 单行显示，与联系方式各行为单位一致 */
}

.f-copy {
    font-size: 13px;
    color: #8fa9c0;
}

.f-copy a {
    color: var(--orange);
    text-decoration: none;
    transition: color .2s ease;
}

.f-copy a:hover {
    color: var(--orange);
    text-decoration: underline;
}

/* 版权行“备案号 | 企业邮箱”分隔符：内容只保留竖线，间距改由 margin 控制，
   PC 端与非 PC 端都显示（其余分隔符仅 PC 端显示） */
.f-copy .f-sep-keep {
    margin: 0 1em;
}

/* 页脚版权行分隔符（内含 U+2003 全角空格）：
   PC 端（>1100px）正常显示；非 PC 端隐藏，避免全角空格占宽导致折行错位。
   备案号与企业邮箱之间的分隔符例外，保留显示，两端间距收窄 */
@media (max-width: 1100px) {
    .f-copy .f-sep {
        display: none;
    }

    .f-copy .f-sep-keep {
        display: inline;
        margin: 0 .45em;
    }
}

/* 页脚最下方：素材来源声明（全站统一，与版权行同为左对齐） */
.f-note {
    margin-top: 8px;
    font-size: 13px;
    color: #8fa9c0;
    text-align: left;
    text-indent: 0;
}

/* 中等宽度：页脚三栏改为纵向堆叠，避免固定宽度溢出 */
@media (max-width:1100px){
    .f-top {
        flex-direction: column;
        align-items: stretch;
        gap: 36px;
    }

    .f-brand,
    .f-contact {
        width: auto;
    }

    .f-wechat {
        margin-left: 0;
    }

    /* 非 PC 客户端（≤1100px）：取消单行限制，随容器宽度自动折行 */
    .hero .tag + p.lead {
        white-space: normal;
        max-width: 760px;
    }

    /* 新闻卡：≤1100px 两列 */
    .news-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* 非 PC 端（手机/平板）：页脚素材声明居中 */
    .f-note {
        text-align: center;
    }
}

/* 新闻卡：≤640px 单列 */
@media (max-width:640px){
    .news-grid {
        grid-template-columns: 1fr;
    }
}

/* Mobile */
@media (max-width:900px){
    .nav {
        position: absolute;
        top: 68px;
        left: 0;
        right: 0;
        background: var(--navy);
        flex-direction: column;
        align-items: stretch;
        padding: 10px 20px;
        display: none;
        border-top: 1px solid rgba(255,255,255,.1);
    }

    .nav.open {
        display: flex;
    }

    .nav a {
        padding: 12px 8px;
    }

    .nav-toggle {
        display: block;
    }

    .hero h1 {
        font-size: 32px;
    }

    .hero-brand {
        font-size: 40px;
        letter-spacing: 6px;
    }

    .hero .wrap {
        padding: 62px 20px 51px;

        /* 原 78/64，缩至 4/5 */
    }

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

    .grid-3,
    .grid-2,
    .tech,
    .cases,
    .news,
    .contact,
    .culture,
    .culture-split,
    .cu-row,
    .certs {
        grid-template-columns: 1fr;
    }

    /* 移动端：两框正常单列堆叠，取消侧缩进与过大间距 */
    .cu-row {
        flex-direction: column;
        gap: 28px;
        padding: 0;
    }

    .ah-media {
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }
    .ah-fig {
        grid-column: 1;
        grid-row: auto;
    }

    /* 服务切换：按钮 4 列两行，详情图改横排 */
    .svc-tabs {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }
    .svc-tab svg {
        width: 50px;
        height: 50px;
    }
    .svc-panel.active {
        flex-direction: column;
        gap: 24px;
    }
    .svc-pics {
        flex: none;
        flex-direction: row;
        gap: 12px;
    }
    .svc-pics img {
        width: calc(50% - 6px);

        /* 移动端两图并排，宽度约为 PC 的一半，高度同比例缩放，保持两图等高 */
        height: auto;
        aspect-ratio: 500 / 373;
        object-fit: cover;
        object-position: center;
    }
    .svc-pics img:only-child {
        width: 100%;
    }

    .ah-fig img {
        position: static;
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .f-top {
        flex-direction: column;
        align-items: stretch;
        gap: 36px;
    }

    .f-brand,
    .f-contact {
        width: auto;
    }

    .f-wechat {
        margin-left: 0;
    }

    .f-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .section {
        padding: 54px 0;
    }

    .section-head h2 {
        font-size: 25px;
    }
}

/* ===== GEO：常见问题（原生 details 折叠，无需 JS，全文可被检索） ===== */
.geo-faq-list {
    max-width: 900px;
    margin: 0 auto;
}

.geo-faq-item {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    margin-bottom: 14px;
    background: var(--white);
    overflow: hidden;
}

.geo-faq-item summary {
    cursor: pointer;
    padding: 18px 24px;
    font-size: 18px;
    font-weight: 500;
    color: var(--navy);
    line-height: 1.6;
    text-indent: 0;
    list-style: none;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    transition: background .3s;
}

.geo-faq-item summary::-webkit-details-marker {
    display: none;
}

.geo-faq-item summary::before {
    content: "+";
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    line-height: 20px;
    text-align: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: var(--orange);
    font-size: 15px;
}

.geo-faq-item[open] summary::before {
    content: "\2013";
    background: var(--orange);
    border-color: var(--orange);
    color: var(--white);
}

.geo-faq-item summary:hover {
    background: var(--orange-l);
}

.geo-faq-a {
    padding: 0 24px 20px 58px;
    font-size: 15px;
    line-height: 1.75;
    color: var(--ink);
    text-indent: 0;
}

.geo-faq-a b {
    font-weight: 500;
    color: var(--navy);
}

/* ===== GEO：资质信息表 =====
   语义仍是 <dl>（每个 <div class="ql-item"> 包一组 dt/dd，符合 HTML5 规范），
   版面改为两栏栅格：容器铺 --line 底色 + 1px gap 露出分隔线，单元格白底 → 表格观感，
   同时消除原先"又高又窄"的纵向长条。增删条目无需改 CSS。 */
.geo-qual-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    margin: 36px 0 0;
    background: var(--line);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.geo-qual-list .ql-item {
    background: var(--white);
    padding: 18px 26px;
    transition: background .35s ease;
}

.geo-qual-list .ql-item:hover {
    background: var(--orange-l);
}

.geo-qual-list dt {
    font-size: 13px;
    line-height: 1.5;
    color: var(--muted);
    text-indent: 0;
}

.geo-qual-list dd {
    margin: 4px 0 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    color: var(--navy);
    text-indent: 0;
}

@media (max-width:1100px){
    .geo-qual-list .ql-item {
        padding: 16px 20px;
    }

    .geo-qual-list dd {
        font-size: 15px;
    }
}

@media (max-width:640px){
    .geo-faq-item summary {
        padding: 15px 16px;
        font-size: 16px;
    }

    .geo-faq-a {
        padding: 0 16px 16px;
        font-size: 14px;
    }

    .geo-qual-list {
        grid-template-columns: 1fr;
    }

    .geo-qual-list .ql-item {
        padding: 14px 18px;
    }

    .geo-qual-list dd {
        font-size: 15px;
    }
}