/*
Theme Name: checkmalaysiaproperty
Text Domain: checkmalaysiaproperty
Description: 马来西亚房产建档 —— 自订经典主题，主页、州页、档次页与项目页共用同一套版式，不依赖任何页面构建器。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
WPVibe: yes
*/

html { scroll-behavior: smooth; }
/* overflow-x 两行是故意的，不要合并：
   hidden 会让 body 变成卷轴容器，position:sticky 就失效（导航列会跟着滚走）。
   clip 一样挡横向溢出，但不建立卷轴容器，sticky 还能用。
   旧浏览器不认 clip，就退回上面那行 hidden —— 顶多是导航列不固定，版面不会破。 */
body { margin:0; font-family:"Noto Sans SC","PingFang SC",system-ui,sans-serif; background:#FBF8F1; color:#14181F; overflow-x:hidden; overflow-x:clip; }

/* 保险：不管上传的图多大、是直幅还是横幅，都不准把版面撑破 */
img, svg, video, iframe, table { max-width:100%; }
img { height:auto; }
img[style*="height:100%"] { height:100%; }
a { color:#0F2A47; } a:hover { color:#A8792C; }
.ser { font-family:"Noto Serif SC","Songti SC",Georgia,serif; }
.eyebrow { font-size:11.5px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:#A8792C; }

/* ---------- 导航列固定在顶部 ---------- */
/* 不管滚到哪里，导航列都留在画面上。
   上面那条深色资历条（76 个项目 · 中英切换）照常滚走 —— 它只需要看一次，
   一直占着位子会吃掉手机的画面高度。 */
.cmp-navbar{position:sticky; top:0; z-index:300;}

/* 页内锚点（#guides / #browse / #video / #form）滚过去的时候，
   标题会被固定的导航列压住，所以要留出导航列的高度。 */
#guides,#browse,#video,#form{scroll-margin-top:96px;}
@media (max-width:900px){
  /* 手机上导航列是两行（logo 一行、连结一行可左右滑），比较高 */
  #guides,#browse,#video,#form{scroll-margin-top:128px;}
}

/* /johor/ 左栏那个「跳到」也是 sticky，原本贴在 top:20px，
   会被固定的导航列盖住。推到导航列下面。 */
[style*="position:sticky"][style*="top:20px"]{top:96px!important;}

.gut{padding-left:max(24px, calc((100% - 1312px) / 2));padding-right:max(24px, calc((100% - 1312px) / 2));}
.badge{display:inline-block;font-size:11.5px;font-weight:700;padding:4px 9px;}
.card{background:#fff;border:1px solid #E4DCCC;display:flex;flex-direction:column;position:relative;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
/* 整张卡可点：把「读完整页面」这个连结用 ::after 撑满整张卡。
   WhatsApp 那个图示要浮在上面，不然会被盖住。 */
.cmp-card-link::after{content:"";position:absolute;inset:0;z-index:1;}
.cmp-card-wa{position:relative;z-index:2;}
.card:hover,.card:focus-within{transform:translateY(-3px) scale(1.008);box-shadow:0 12px 28px rgba(11,22,34,.14);border-color:#D9CFB8;}
.card:hover .cmp-card-link,.card:focus-within .cmp-card-link{color:#A8792C;}
.cmp-card-img img{transition:transform .4s ease;}
.card:hover .cmp-card-img img{transform:scale(1.06);}
@media (hover:none){.card:hover{transform:none;box-shadow:none} .card:hover .cmp-card-img img{transform:none}}
@media (prefers-reduced-motion:reduce){.card,.cmp-card-img img{transition:none} .card:hover{transform:none} .card:hover .cmp-card-img img{transform:none}}
.chip{display:inline-block;border:1px solid #D9D1C5;background:#fff;padding:6px 11px;font-size:12.5px;}
/* 导航列的项目：主字一行，底下可以再挂一行小字讲人话 */
.cmp-navitem{display:flex;flex-direction:column;gap:2px;color:#14181F;text-decoration:none;
             white-space:nowrap;padding-bottom:5px;border-bottom:2px solid transparent;line-height:1.3;}
.cmp-navitem-t{font-size:14.5px;font-weight:500;}
.cmp-navitem-s{font-size:11px;color:#8A8172;font-weight:400;letter-spacing:.01em;}
.cmp-navitem:hover .cmp-navitem-t{color:#A8792C;}
.cmp-navitem.is-on{border-bottom-color:#14181F;}
.cmp-navitem.is-on .cmp-navitem-t{font-weight:700;}
    button.chip{cursor:pointer;font-family:inherit;color:#14181F;line-height:1.45;border-radius:0;-webkit-appearance:none;appearance:none;transition:background .12s,color .12s,border-color .12s;}
    button.chip:hover{border-color:#A8792C;}
    button.chip[aria-pressed="true"]{background:#0B1622;border-color:#0B1622;color:#fff;}
    button.chip:focus-visible{outline:2px solid #A8792C;outline-offset:2px;}
    [hidden]{display:none!important;}

    /* 设施：上面一张大图，下面一排缩图左右滑 */
    /* 大图高度跟着视窗走：大图＋下面那排缩图要能一起装进一个屏幕 */
    /* 整张图放进去，不裁切；高度跟着图片比例走，但不超过视窗的一半多一点 */
    .fac-stage{position:relative;background:#0B1622;display:flex;align-items:center;justify-content:center;overflow:hidden;}
    .fac-stage img{width:100%;height:auto;max-height:min(56vh,520px);object-fit:contain;display:block;}
    .fac-cap{position:absolute;left:0;bottom:0;background:rgba(11,22,34,.86);color:#fff;padding:10px 16px;font-size:14px;font-weight:700;}
    .fac-strip{display:flex;gap:10px;overflow-x:auto;padding:10px 0 12px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
    .fac-strip::-webkit-scrollbar{height:6px}
    .fac-strip::-webkit-scrollbar-track{background:#EDE6D8}
    .fac-strip::-webkit-scrollbar-thumb{background:#C9C0AE}
    .fac-thumb{flex:0 0 136px;padding:0;border:2px solid transparent;background:none;cursor:pointer;scroll-snap-align:start;position:relative;}
    .fac-thumb img{width:100%;height:90px;object-fit:cover;display:block;}
    .fac-thumb span{display:block;font-size:11.5px;color:#5A5346;padding:6px 2px 0;text-align:left;line-height:1.35;}
    .fac-thumb[aria-pressed="true"]{border-color:#A8792C;}
    .fac-thumb[aria-pressed="true"] span{color:#14181F;font-weight:700;}
    @media (max-width:620px){
      .fac-thumb{flex:0 0 112px}
      .fac-thumb img{height:74px}
      .fac-stage img{max-height:min(42vh,300px)}
    }
    /* 地图占位：按下去才载入 Google 地图（地图那一包 JS 很重，不自动载） */
    .cmp-map-btn{display:flex;align-items:center;gap:16px;width:100%;min-height:200px;padding:28px 24px;
                 background:none;border:0;cursor:pointer;text-align:left;font-family:inherit;}
    .cmp-map-btn:hover{background:#EFE8DA;}
    .cmp-map-btn:focus-visible{outline:2px solid #A8792C;outline-offset:-4px;}
    .cmp-map-pin{display:inline-flex;align-items:center;justify-content:center;flex:none;
                 width:54px;height:54px;border-radius:50%;background:#fff;border:1px solid #E4DCCC;}
    .cmp-map-txt{display:block;min-width:0;}
    .cmp-map-txt strong{display:block;font-size:17px;font-weight:900;color:#14181F;line-height:1.5;margin-bottom:5px;}
    .cmp-map-txt small{display:block;font-size:13px;color:#7A7264;line-height:1.7;}
    @media (max-width:620px){
      .cmp-map-btn{min-height:150px;padding:22px 18px;gap:13px;}
      .cmp-map-pin{width:44px;height:44px;}
      .cmp-map-txt strong{font-size:15.5px;}
    }

*,*::before,*::after{box-sizing:border-box;}
img,table,figure{max-width:100%;}

/* 栏位不准被内容撑宽 —— 不然整页会出现横向卷轴，要左右滑才看得完 */
[style*="display:grid"] > *{min-width:0;}
[style*="grid-template-columns:1fr 320px"] > *,
[style*="grid-template-columns:236px 1fr"] > *{min-width:0;}
.fac-strip{min-width:0;max-width:100%;}
[style*="overflow-x:auto"]{min-width:0;max-width:100%;}
iframe{max-width:100%;}
table{border-collapse:collapse;width:100%;}
th{font-size:12px;font-weight:700;letter-spacing:.04em;color:#7A7264;text-align:left;padding:12px 10px;border-bottom:2px solid #14181F;white-space:nowrap;}
td{font-size:13.5px;padding:13px 10px;border-bottom:1px solid #EDE6D8;vertical-align:top;}
tr:nth-child(even) td{background:#F6F1E6;}

@media (max-width:900px){
  [style*="repeat(4,minmax(0,1fr))"],[style*="repeat(3,minmax(0,1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="repeat(5,minmax(0,1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:1fr 320px"]{grid-template-columns:1fr!important}
  [style*="grid-template-columns:1fr 1.25fr"],[style*="grid-template-columns:236px 1fr"],[style*="grid-template-columns:2fr 1fr 1fr"],[style*="repeat(12,minmax(0,1fr))"],[style*="grid-template-columns:2fr 1fr"]{grid-template-columns:1fr!important}
  [style*="grid-column:span"]{grid-column:auto!important}
  [style*="gap:52px"]{gap:30px!important}
}
@media (max-width:620px){
  [style*="repeat(4,minmax(0,1fr))"],[style*="repeat(3,minmax(0,1fr))"],[style*="repeat(2,minmax(0,1fr))"]{grid-template-columns:1fr!important}
  h1{font-size:31px!important;line-height:1.32!important} h2{font-size:24px!important;line-height:1.38!important}
  [style*="font-size:62px"],[style*="font-size:60px"],[style*="font-size:58px"],[style*="font-size:46px"]{font-size:31px!important;line-height:1.32!important}
  [style*="font-size:40px"],[style*="font-size:34px"]{font-size:24px!important}
  table{font-size:12px} th,td{padding:9px 7px!important}
  [style*="padding:34px 36px"]{padding:22px 20px!important}
  [style*="padding:30px"],[style*="padding:28px"],[style*="padding:26px"]{padding:20px!important}
}
@media (max-width:900px){
  /* 手机版不再把导航藏起来（本来藏了、只留一个没有作用的汉堡图示，
     等于手机上完全没有导航）。改成第二行，可以左右滑，不需要 JS。 */
  .cmp-navbar{flex-wrap:wrap!important; row-gap:0; padding-top:12px!important; min-height:0!important}
  .cmp-navlogo{font-size:17px!important}
  .navlinks{display:flex!important; width:100%; order:3; gap:18px!important; margin-top:10px;
            overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:10px}
  .navlinks::-webkit-scrollbar{display:none}
  .navlinks > a{flex:0 0 auto; white-space:nowrap!important}
  .cmp-navitem,.cmp-navitem-t,.cmp-navitem-s{white-space:nowrap!important}
  .ham{display:none!important}
  [style*="white-space:nowrap"]{white-space:normal!important}
  [style*="overflow-x:auto"]{-webkit-overflow-scrolling:touch}
}
@media (max-width:900px){
  [style*="display:flex"][style*="align-items:center"]{flex-wrap:wrap}
  [style*="position:sticky"][style*="top:0"]{position:static!important}
}

@media (max-width:900px){
  .hs{display:flex!important;grid-template-columns:none!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px!important;padding-bottom:12px;scrollbar-width:none;}
  .hs::-webkit-scrollbar{display:none}
  .hs > *{min-width:78%!important;flex:0 0 78%;scroll-snap-align:start;}
  .hs-more{display:flex!important}
  .m-hide{display:none!important}
  .m-only{display:block!important}
  .hs-hint{display:flex!important}
}
.m-only{display:none}
.hs-hint{display:none}
@media (max-width:620px){
  .hs > *{min-width:80%!important;flex:0 0 80%}
}

@media (max-width:900px){
  .chip{white-space:normal!important}
  [style*="display:grid"] > *, [style*="display:flex"] > *{min-width:0}
  [style*="position:sticky"]{position:static!important}
  [style*="grid-template-columns:236px"]{display:block!important}
  [style*="grid-template-columns:236px"] > *{width:100%!important;margin-bottom:18px}
}

@media (max-width:900px){
  [style*="justify-content:space-between"]{flex-wrap:wrap!important;row-gap:10px;}
  [style*="justify-content:space-between"] > *{max-width:100%;}
}

@media (max-width:620px){
  [style*="gap:0;border:1px solid"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="gap:1px"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* 项目页图库：手机上主图改成整排，副图排成一行挂在下面。
   不这样的话主图只剩 2/3 宽度，来看房子的人第一眼看到的照片太小。 */
@media (max-width:620px){
  .cmp-gal{grid-template-columns:minmax(0,1fr)!important}
  .cmp-gal > div:last-child{grid-template-rows:none!important;grid-auto-flow:column!important;grid-auto-columns:minmax(0,1fr)!important}
  .cmp-gal > div:last-child > div{aspect-ratio:4/3}
}

@media (max-width:620px){
  p{line-height:1.72!important}
  [style*="font-size:16px"]{font-size:15px!important}
  [style*="font-size:22px; font-weight:700"]{font-size:19px!important}
  [style*="padding:72px"]{padding-top:48px!important;padding-bottom:48px!important}
  [style*="padding:26px 0"]{padding-top:18px!important;padding-bottom:18px!important}
  [style*="margin:0 0 36px"]{margin-bottom:22px!important}
}

/* 地区页的租金表：四栏真表格，390px 的手机放不下。
   外框原本是 overflow:hidden —— 那会把「备注」整栏裁掉，看的人根本不知道有这一栏。
   改成横向滚动，右边加一道渐层告诉他们后面还有东西。 */
.cma-tw{position:relative;}
@media (max-width:760px){
  .cma-tw{overflow-x:auto!important;overflow-y:hidden;-webkit-overflow-scrolling:touch;}
  .cma-tw table{min-width:540px;}
  .cma-tw th,.cma-tw td{padding:10px 11px!important;font-size:13px!important;}
}

@media (max-width:620px){
  .st2{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important}
  .st2 > *{padding:16px 14px!important}
  /* 项目页的关键数字是 flex（格子数要跟资料数对齐），手机上把基准缩到 140px，一行放两格 */
  .st2[style*="flex-wrap"] > *{flex-basis:140px!important}
}

@media (max-width:620px){
  [style*="line-height:1.9"],[style*="line-height:1.85"],[style*="line-height:1.95"],[style*="line-height:1.8"]{line-height:1.7!important}
  [style*="font-size:18.5px"],[style*="font-size:18px"],[style*="font-size:17px"],[style*="font-size:16.5px"]{font-size:15.5px!important}
  [style*="font-size:22px"],[style*="font-size:21px"],[style*="font-size:20px"]{font-size:18.5px!important}
  [style*="padding:64px"],[style*="padding:68px"],[style*="padding:76px"],[style*="padding:80px"]{padding-top:48px!important;padding-bottom:48px!important}
}

@media (max-width:620px){
  .st2[style*="gap:40px"]{gap:22px 18px!important}
  .st2[style*="gap:40px"] > *{padding:0!important}
}

@media (max-width:900px){
  .hsf > *{border:1px solid #DCD3C2!important;border-top:1px solid #DCD3C2!important;border-bottom:1px solid #DCD3C2!important;background:#fff;padding:20px 18px!important;}
  .hsf{max-width:none!important}
}

/* ============================================================
   区块编辑器用的版面 class
   页面内容用 Gutenberg 区块写，外观全部靠下面这些 class。
   在编辑器里：选中区块 → 右边「进阶」→ 额外 CSS 类别，填 class 名。
   ============================================================ */

/* 区段外框 */
.cmp-sec{padding:72px max(24px, calc((100% - 1312px) / 2));border-bottom:1px solid #E4DCCC;}
.cmp-sec.cmp-dark{background:#0B1622;color:#EDE6D8;border-bottom:0;}
.cmp-sec.cmp-tint{background:#F3EDE0;}
.cmp-sec.cmp-cream{background:#F6F1E6;}
.cmp-sec > *{max-width:1312px;}
.cmp-sec.cmp-tight{padding-top:52px;padding-bottom:48px;}

/* 标题与引言 */
.cmp-eyebrow{font-size:11.5px!important;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#A8792C;margin:0 0 16px!important;}
.cmp-h1{font-family:"Noto Serif SC","Songti SC",Georgia,serif;font-size:58px;line-height:1.24;font-weight:900;margin:0 0 26px;letter-spacing:-0.02em;}
.cmp-h2{font-family:"Noto Serif SC","Songti SC",Georgia,serif;font-size:40px;font-weight:900;margin:0 0 12px;letter-spacing:-0.015em;line-height:1.3;}
.cmp-h3{font-family:"Noto Serif SC","Songti SC",Georgia,serif;font-size:21px;font-weight:900;margin:0 0 12px;line-height:1.45;}
.cmp-dark .cmp-h1,.cmp-dark .cmp-h2,.cmp-dark .cmp-h3{color:#fff;}
.cmp-lede{font-size:17px;line-height:1.9;color:#3D4650;margin:0 0 18px;max-width:900px;}
.cmp-dark .cmp-lede{color:#B9C6D4;}
.cmp-small{font-size:14px;line-height:1.85;color:#7A7264;margin:0 0 14px;}
.cmp-dark .cmp-small{color:#8FA0B4;}
.cmp-answer{font-size:18.5px;line-height:1.95;font-weight:700;margin:0 0 20px;max-width:940px;}

/* WordPress 会在区块外面再套一层 __inner-container，
   所以每一个版面规则都要同时挂在外层和内层，两种结构都要能跑。 */
.cmp-sec > .wp-block-group__inner-container{display:block;}
.wp-block-group__inner-container{max-width:none;}
/* 区块之间 WP 自己加的上边距，在我的卡片/网格里关掉 */
.cmp-card > .wp-block-group__inner-container > *,
.cmp-grid-2 > .wp-block-group__inner-container > *,
.cmp-grid-3 > .wp-block-group__inner-container > *,
.cmp-grid-4 > .wp-block-group__inner-container > *,
.cmp-stats > .wp-block-group__inner-container > *,
.cmp-chips > .wp-block-group__inner-container > *{margin-block-start:0;}

/* 卡片网格 —— 手机端自动变左右滑（沿用 .hs） */
.cmp-grid-2 > .wp-block-group__inner-container,
.cmp-grid-3 > .wp-block-group__inner-container,
.cmp-grid-4 > .wp-block-group__inner-container{display:grid;gap:20px;}
.cmp-grid-2:not(:has(> .wp-block-group__inner-container)),
.cmp-grid-3:not(:has(> .wp-block-group__inner-container)),
.cmp-grid-4:not(:has(> .wp-block-group__inner-container)){display:grid;gap:20px;}
.cmp-grid-2,.cmp-grid-3,.cmp-grid-4{margin:0 0 20px;}
.cmp-grid-2 > .wp-block-group__inner-container,
.cmp-grid-2:not(:has(> .wp-block-group__inner-container)){grid-template-columns:repeat(2,minmax(0,1fr));}
.cmp-grid-3 > .wp-block-group__inner-container,
.cmp-grid-3:not(:has(> .wp-block-group__inner-container)){grid-template-columns:repeat(3,minmax(0,1fr));}
.cmp-grid-4 > .wp-block-group__inner-container,
.cmp-grid-4:not(:has(> .wp-block-group__inner-container)){grid-template-columns:repeat(4,minmax(0,1fr));}
.cmp-card{background:#fff;border:1px solid #E4DCCC;padding:26px;}
.cmp-card.cmp-top{border-top:3px solid #0B1622;}
.cmp-card.cmp-top-gold{border-top:3px solid #A8792C;}
.cmp-card > *:last-child{margin-bottom:0;}
.cmp-card p{font-size:14.5px;line-height:1.85;color:#5A5346;margin:0 0 14px;}
.cmp-dark .cmp-card{background:#111E2C;border-color:#1E2C3C;color:#EDE6D8;}
.cmp-dark .cmp-card p{color:#B9C6D4;}

/* 数字格 —— 数字和说明成对，用两栏一组排成四组 */
.cmp-stats{border-top:1px solid #1E2C3C;padding:34px 0 40px;margin:48px 0 0;}
.cmp-stats > .wp-block-group__inner-container,
.cmp-stats:not(:has(> .wp-block-group__inner-container)){display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 40px;grid-auto-flow:column;grid-template-rows:auto auto;}
.cmp-stats p{margin:0;font-size:13px;color:#8FA0B4;line-height:1.6;}

/* chips 横排 */
.cmp-chips > .wp-block-group__inner-container,
.cmp-chips:not(:has(> .wp-block-group__inner-container)){display:flex;flex-wrap:wrap;gap:10px;}

/* 卡片内层不要再撑满 */
.cmp-card > .wp-block-group__inner-container > *:last-child{margin-bottom:0;}
.cmp-stat{font-family:"Noto Serif SC","Songti SC",Georgia,serif;font-size:40px;font-weight:900;line-height:1;margin:0 0 9px!important;}
.cmp-dark .cmp-stat{color:#fff;}

/* 问题 chip 与标签 */
.cmp-chips{margin:0 0 20px;}
.cmp-chips p,.cmp-chips li{margin:0;}
.cmp-pill{display:inline-block;background:#16232F;border:1px solid #2B3B4E;padding:11px 18px;font-size:14px;color:#DCE5EE;border-radius:100px;}
.cmp-tag{display:inline-block;border:1px solid #2B3B4E;padding:7px 14px;font-size:12.5px;color:#B9C6D4;}
.cmp-badge{display:inline-block;font-size:12.5px;font-weight:700;padding:5px 11px;margin:0 0 14px;}
.cmp-badge.ok{background:#E8F1E9;border:1px solid #A9C9AF;color:#2A5433;}
.cmp-badge.wait{background:#FCF0DC;border:1px solid #E2C88A;color:#7A5714;}
.cmp-badge.no{background:#F7E8E6;border:1px solid #DBA9A2;color:#7A2B20;}
.cmp-badge.grey{background:#ECEEF2;border:1px solid #B4BCC8;color:#3A4553;}

/* 按钮 */
.cmp-sec .wp-block-button__link,.cmp-btn{border-radius:0!important;font-weight:700;padding:16px 30px;font-size:15.5px;text-decoration:none;display:inline-flex;align-items:center;gap:9px;}
.cmp-gold .wp-block-button__link,.cmp-btn.gold{background:#A8792C!important;color:#0B1622!important;}
.cmp-wa .wp-block-button__link,.cmp-btn.wa{background:#25D366!important;color:#0B1622!important;}
.cmp-dark2 .wp-block-button__link{background:#0B1622!important;color:#fff!important;}
.cmp-ghost .wp-block-button__link{background:transparent!important;color:#fff!important;border:1.5px solid #3A4A5E!important;}

/* 表格式清单（覆盖范围、地区索引） */
.cmp-rows{border-top:1px solid #DCD3C2;}
.cmp-rows > p,
.cmp-rows > .wp-block-group__inner-container > p{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:20px 0;border-bottom:1px solid #DCD3C2;margin:0;font-size:15.5px;}

/* 区段内区块的垂直节奏 —— 关掉 WP 自己那一套，用我的 margin */
.cmp-sec .wp-block-paragraph,.cmp-sec p{margin-block-start:0;}
.cmp-sec > .wp-block-group__inner-container > *{margin-block-start:0;}

/* 说明框 */
.cmp-note{background:#F3EDE0;border-left:4px solid #A8792C;padding:22px 26px;font-size:15px;line-height:1.85;color:#3D4650;margin:0 0 20px;}
.cmp-note > *:last-child{margin-bottom:0;}

/* 图位（还没有真实照片的时候） */
.cmp-ph{background:#DDD5C4;min-height:180px;display:flex;align-items:center;justify-content:center;color:#9B9282;font-size:12.5px;margin:0 0 16px;}
.cmp-dark .cmp-ph{background:#16232F;border:1px solid #2B3B4E;color:#6E7C8C;}

/* FAQ 一问一答 */
.cmp-qa{border-top:1px solid #DCD3C2;padding:26px 0;margin:0;max-width:1000px;}
.cmp-qa h3{font-family:"Noto Serif SC","Songti SC",Georgia,serif;font-size:22px;font-weight:700;margin:0 0 14px;}
.cmp-qa p{font-size:16px;line-height:1.95;color:#3D4650;margin:0;}

@media (max-width:900px){
  .cmp-grid-2,.cmp-grid-3,.cmp-grid-4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .cmp-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px;}
  .cmp-rows > *{flex-wrap:wrap;gap:6px;}
}
@media (max-width:620px){
  .cmp-sec{padding-top:48px;padding-bottom:48px;}
  .cmp-grid-2,.cmp-grid-3,.cmp-grid-4{grid-template-columns:1fr;}
  .cmp-h1{font-size:31px;line-height:1.32;}
  .cmp-h2{font-size:24px;line-height:1.38;}
  .cmp-answer{font-size:16.5px;}
  .cmp-stat{font-size:30px;}
}

/* 表单里的勾选 chip */
.cmp-chip{position:relative;display:inline-flex;cursor:pointer;}
.cmp-chip input{position:absolute;opacity:0;width:0;height:0;}
.cmp-chip span{border:1.5px solid #D9D1C5;background:#fff;padding:11px 17px;font-size:14px;line-height:1.2;user-select:none;}
.cmp-chip input:checked + span{background:#0B1622;color:#fff;border-color:#0B1622;}
.cmp-chip input:focus-visible + span{outline:2px solid #A8792C;outline-offset:2px;}
.cmp-chip:hover span{border-color:#A8792C;}
input[type="text"],input[type="email"],input[type="tel"]{border-radius:0;}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus{outline:2px solid #A8792C;outline-offset:-1px;border-color:#A8792C;}
button:hover{opacity:.92;}