/*
 * Contact Us 页 —— 1:1 对应设计稿 Astra 6月(fwdnLm0W) / 1029:277（1920×5440）
 * 四个板块都是整幅，所以这页开了全屏滚动（机制在共用的 assets/css/fullpage.css）。
 *
 *   首屏 1031:515    整幅 960：底图铺满，左对齐黑字
 *                    56/56 Bold(-2.24) + 红线 100×4 + 24/32 Semi（659 宽），gap 28，px260/py120
 *   表单 1319:1847   整幅 1080，px280 py120，左右间距 40、顶对齐
 *                    左栏 618 两端对齐：
 *                      标题栈 py24 gap20：48/53 Bold #141414 + 28/34 Semi #808080（516 宽）
 *                      三行联系方式（各 py24 gap32，前两行下描边 #DEDFE0）：
 *                        60 图标 + 标题 28/34 Semi #141414 + 明细 gap12（32 图标 + 24/32 Semi #808080）
 *                      社交二维码 px120 py20：116 方图 + 24/32 Semi #808080
 *                    右栏 702 白卡：描边 #DEDFE0、投影 0/0/50 rgba(0,0,0,.1)、px64 py48 gap32
 *                      卡内标题 48/53 Bold #141414
 *                      字段 gap20：标签 24/32 Semi 黑（星号红）+ 输入框 62 高、描边 #D9D9D9、内距 16
 *                      占位符 18/25 Bold #999；提交按钮满宽 #E60012、18/25 Bold 白
 *   全球市场 1033:580 整幅 1080：暗色世界地图 + 11 个红点
 *                    居中 56/56 Bold #E5E5E5 + 460×2 白线（正中 100 段转红）
 *   推荐产品 1033:1130 整幅 1080，px320 py120 两端对齐
 *                    标题栈 1280 gap24：48/53 Bold 黑 + 红线 100×4
 *                    三卡 gap20 高 604：白底、下边 2px、内距 20、gap28
 *                      方图 + 标题 24/32 + 规格条 14/20（中间一格左右描边）+ MORE 18/25
 *                      设计稿把首张画成了 hover 态（下边和文字转红），这里按 hover 实现
 *                    底部按钮 #E60012：16/20 Bold 白 + 箭头，px24 高 57
 *
 * 右栏表单用的是 Elementor Pro 的 Form 组件（提交落进 wp_e_submissions，
 * 主题 inc/submissions 那套导出/回复后台才认），所以这里要连它的类名一起写。
 * 尺寸字号一律走 CSS 变量，由组件的响应式控制项按断点写入；
 * 媒体查询只翻排布方向，绝不写死尺寸（写死会盖掉控制项，见记忆里那条坑）。
 */

.astra-ct {
  --ct-primary: #e60012;
  --ct-dark: #141414;
  --ct-text: #333333;
  --ct-strong: #000000;
  --ct-muted: #808080;
  --ct-subtle: #999999;
  --ct-line: #dedfe0;
  --ct-field-line: #d9d9d9;

  font-family: inherit;
  color: var(--ct-text);
}

.astra-ct__empty {
  margin: 0;
  padding: 24px 0;
  font-size: 18px;
  color: var(--ct-subtle);
  text-align: center;
}

/* ================================================= 表单板块 1319:1847 */

/* 这一屏是「左信息 + 右表单卡」两个 Elementor 容器拼的，
   吸附类挂在外层容器上（组件自己不挂），所以外层要能撑满一屏 */
.astra-ct-row {
  display: flex;
  align-items: stretch;
  gap: var(--ct-form-gap, 40px);
  width: 100%;
  padding: var(--ct-form-pad-y, 120px) var(--ct-form-pad-x, 280px);
}

/* 必须圈 min-width：html.astra-snap 在 1200 以下还在（只是吸附关掉了），
   不圈的话这条 min-height:0 会把窄屏的高度一并压掉 */
@media (min-width: 1201px) {
  html.astra-snap .astra-snap-section .astra-ct-row {
    flex: 1 1 auto;
    min-height: 0;
  }
}

/* 左栏是个组件、右栏是个容器，两边都得把高度传下去，
   否则 Elementor 的 .elementor-widget 包层会把内容高度截在那一层 */
.astra-ct-row > .elementor-widget {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
}

.astra-ct-row > .elementor-widget > .elementor-widget-container {
  display: flex;
  width: 100%;
}

.astra-ct-row > .elementor-widget .astra-ct {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
}

/* ------------------------------------------------------- 左栏：联系方式 */
.astra-ct-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}

.astra-ct-info__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: var(--ct-info-head-gap, 20px);
  width: 100%;
  padding: var(--ct-info-head-pad, 24px) 0;
}

.astra-ct-info__title {
  margin: 0;
  width: 100%;
  font-size: var(--ct-info-title-size, 48px);
  line-height: var(--ct-info-title-line, 53px);
  font-weight: 700;
  letter-spacing: -1.92px;
  color: var(--ct-dark);
  overflow-wrap: break-word;
}

.astra-ct-info__sub {
  margin: 0;
  width: 100%;
  max-width: var(--ct-info-sub-width, 516px);
  font-size: var(--ct-info-sub-size, 28px);
  line-height: var(--ct-info-sub-line, 34px);
  font-weight: 600;
  letter-spacing: -0.56px;
  color: var(--ct-muted);
  overflow-wrap: break-word;
}

.astra-ct-info__methods {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}

.astra-ct-info__list {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 三行等高平分整列（设计稿 1920 下就是这么排的）。
   但 min-height 不能给 0：那样列一窄、文字一换行，行会被压得比内容还矮，
   内容直接溢到下一行的标题上（1440 实测电话号码换行后压着 After-sales Support）。
   给 auto 后，放得下就还是三等分，放不下就把行撑开，永远不重叠。 */
.astra-ct-info__row {
  flex: 1 1 0;
  min-height: auto;
  display: flex;
  align-items: flex-start;
  gap: var(--ct-info-row-gap, 32px);
  width: 100%;
  padding: var(--ct-info-row-pad, 24px) 0;
}

.astra-ct-info__row + .astra-ct-info__row {
  border-top: 1px solid var(--ct-line);
}

/* 三个大图标（客服/售后/地址）在设计稿里是主题红，
   右边那两个小的邮件/电话图标才是灰的（跟着行文字的颜色走，见 __mini）。 */
.astra-ct-info__icon {
  flex: 0 0 auto;
  display: block;
  width: var(--ct-info-icon, 60px);
  height: var(--ct-info-icon, 60px);
  color: var(--ct-info-icon-color, var(--ct-primary));
}

.astra-ct-info__icon svg,
.astra-ct-info__icon img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}

.astra-ct-info__body {
  flex: 1 1 0;
  min-width: 0;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.astra-ct-info__name {
  margin: 0;
  width: 100%;
  font-size: var(--ct-info-name-size, 28px);
  line-height: var(--ct-info-name-line, 34px);
  font-weight: 600;
  letter-spacing: -0.56px;
  color: var(--ct-dark);
  overflow-wrap: break-word;
}

.astra-ct-info__details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--ct-info-detail-gap, 12px);
  width: 100%;
}

.astra-ct-info__link,
.astra-ct-info__text {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  font-size: var(--ct-info-detail-size, 24px);
  line-height: var(--ct-info-detail-line, 32px);
  font-weight: 600;
  letter-spacing: -0.24px;
  color: var(--ct-muted);
  text-decoration: none;
  overflow-wrap: break-word;
}

a.astra-ct-info__link {
  transition: color 0.25s ease;
}

a.astra-ct-info__link:hover,
a.astra-ct-info__link:focus-visible {
  color: var(--ct-primary);
}

.astra-ct-info__mini {
  flex: 0 0 auto;
  display: block;
  width: var(--ct-info-mini, 32px);
  height: var(--ct-info-mini, 32px);
  color: currentColor;
}

.astra-ct-info__mini svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* 地址那行没有小图标，文字直接占满 */
.astra-ct-info__row--plain .astra-ct-info__text {
  gap: 0;
}

/* --------------------------------------------------------- 社交二维码 */
.astra-ct-info__social {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  padding: var(--ct-social-pad-y, 20px) var(--ct-social-pad-x, 120px);
}

/* 两个二维码在设计稿里是一模一样的 116 正方形（1319:1900 / 1319:1903），
   所以格子定死宽度，别让它跟着标签文字（Whatsapp 比 wechat 长）缩。 */
.astra-ct-info__qr {
  flex: 0 0 auto;
  width: var(--ct-qr-size, 116px);
  max-width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

/* 选择器必须写两个 class：Elementor 前台样式表里有 `.elementor img { height: auto }`，
   是「1 个 class + 1 个标签」，压得过单 class 的写法——高度被改回 auto 后，
   两张原图尺寸不一样（568×550 / 694×698），画出来就一个 116×112、一个 83×84。
   另外 object-fit 用 contain 不用 cover：二维码四周的留白是识别码的一部分，裁不得。 */
.astra-ct-info__qr .astra-ct-info__qr-img {
  display: block;
  width: var(--ct-qr-size, 116px);
  height: var(--ct-qr-size, 116px);
  aspect-ratio: 1 / 1;
  max-width: 100%;
  object-fit: contain;
  background: #ffffff;
}

.astra-ct-info__qr-label {
  margin: 0;
  font-size: var(--ct-qr-label-size, 24px);
  line-height: var(--ct-qr-label-line, 32px);
  font-weight: 600;
  letter-spacing: -0.24px;
  color: var(--ct-muted);
  text-align: center;
}

/* ------------------------------------------------- 右栏：表单卡（Elementor Form） */
.astra-ct-card {
  max-width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ct-card-gap, 32px);
  padding: var(--ct-card-pad-y, 48px) var(--ct-card-pad-x, 64px);
  background: #ffffff;
  border: 1px solid var(--ct-line);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
}

/* 宽度不能直接写 flex：Elementor 的 `.e-con.e-flex{flex:var(--flex-grow) ...}` 是两个 class，
   权重压过单类选择器。改成喝它自己的变量，再用两级选择器压过 .e-con 那条默认 */
.astra-ct-row > .astra-ct-card {
  --flex-grow: 0;
  --flex-shrink: 0;
  --flex-basis: var(--ct-card-width, 702px);
  --width: var(--ct-card-width, 702px);
}

/* 卡内标题用的是 Elementor 的标题组件，字体不在它的控制项里设，交给这里 */
/* 三级选择器是必要的：全局 kit 里 `.elementor-widget-heading .elementor-heading-title`
   也是两个 class，同权重时谁后加载谁赢，不加一级标题会变成主色红 */
.astra-ct-card .elementor-widget-heading .elementor-heading-title {
  margin: 0;
  padding: var(--ct-card-title-pad, 12px) 0;
  font-size: var(--ct-card-title-size, 48px);
  line-height: var(--ct-card-title-line, 53px);
  font-weight: 700;
  letter-spacing: -1.92px;
  color: var(--ct-dark);
}

.astra-ct-card .elementor-widget-form {
  flex: 1 1 auto;
  min-height: 0;
}

.astra-ct-card .elementor-widget-form > .elementor-widget-container,
.astra-ct-card .elementor-form {
  height: 100%;
}

/* 这个版本的 Form 组件没有行/列间距控制项（查过控件表，一条带 gap 的都没有），
   它自带的是 margin -10 / padding 10 那套，所以间距只能在这里接管。
   align-content: space-between 是为了让字段在卡片高度里摊开，
   跟设计稿里两栏都是 h-full 两端对齐的做法一致 */
.astra-ct-card .elementor-form-fields-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  align-items: flex-start;
  gap: var(--ct-field-gap, 20px);
  height: 100%;
  margin: 0;
}

.astra-ct-card .elementor-field-group {
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.astra-ct-card .elementor-field-group.elementor-col-50 {
  width: calc(50% - var(--ct-field-gap, 20px) / 2);
}

.astra-ct-card .elementor-field-group.elementor-col-100 {
  width: 100%;
}

/* 标签 */
.astra-ct-card .elementor-field-group > label.elementor-field-label {
  margin: 0 0 var(--ct-label-gap, 12px);
  padding: 0;
  font-size: var(--ct-label-size, 24px);
  line-height: var(--ct-label-line, 32px);
  font-weight: 600;
  letter-spacing: -0.24px;
  color: var(--ct-strong);
}

.astra-ct-card .elementor-mark-required .elementor-field-label:after {
  margin-left: 0.3em;
  color: var(--ct-primary);
}

/* 输入框 */
.astra-ct-card .elementor-field-group > label.elementor-field-label,
.astra-ct-card .elementor-field-group .elementor-field-textual {
  /* 字段组是列向 flex，不钉住的话输入框会被压矮（实测 62 压成 55） */
  flex: 0 0 auto;
}

.astra-ct-card .elementor-field-group .elementor-field-textual {
  box-sizing: border-box;
  width: 100%;
  /* Elementor 另有一条 flex-basis:100%，列向时会把输入框的高度交回给内容，
     所以除了 height 还得拿 min-height 钉住 */
  flex-basis: auto;
  min-height: var(--ct-field-height, 62px);
  height: var(--ct-field-height, 62px);
  padding: var(--ct-field-pad, 16px);
  border: 1px solid var(--ct-field-line);
  border-radius: 0;
  background: #ffffff;
  font-size: var(--ct-field-size, 18px);
  line-height: var(--ct-field-line-height, 25px);
  font-weight: 700;
  letter-spacing: -0.36px;
  color: var(--ct-strong);
  box-shadow: none;
  transition: border-color 0.25s ease;
}

.astra-ct-card .elementor-field-group .elementor-field-textual:focus {
  border-color: var(--ct-primary);
  outline: none;
  box-shadow: none;
}

.astra-ct-card .elementor-field-group .elementor-field-textual::placeholder {
  font-weight: 700;
  color: var(--ct-subtle);
  opacity: 1;
}

/* 多行那格要吃掉剩下的高度（设计稿 123 高，靠 flex 撑） */
.astra-ct-card .elementor-field-type-textarea {
  flex: 1 1 auto;
  min-height: 0;
}

.astra-ct-card .elementor-field-type-textarea .elementor-field-textual {
  flex: 1 1 auto;
  height: var(--ct-textarea-min, 123px);
  min-height: var(--ct-textarea-min, 123px);
  resize: vertical;
}

/* 隐藏字段（IP 国家）不要占一行位置 */
.astra-ct-card .elementor-field-type-hidden {
  display: none;
}

/* 提交按钮 */
.astra-ct-card .elementor-field-type-submit {
  padding-top: var(--ct-submit-gap, 12px);
}

.astra-ct-card .elementor-field-type-submit .elementor-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: var(--ct-submit-height, 56px);
  padding: 16px 44px;
  border: 0;
  border-radius: 0;
  background: var(--ct-primary);
  font-size: var(--ct-submit-size, 18px);
  line-height: 25px;
  font-weight: 700;
  letter-spacing: -0.36px;
  color: #ffffff;
  transition: filter 0.25s ease;
}

.astra-ct-card .elementor-field-type-submit .elementor-button:hover {
  filter: brightness(0.92);
}

.astra-ct-card .elementor-message {
  font-size: 16px;
  line-height: 24px;
}

.astra-ct-card .elementor-message.elementor-message-danger {
  color: var(--ct-primary);
}

/* ================================================ 全球市场 1033:580 */
.astra-ct-map {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--ct-map-height, 1080px);
  overflow: hidden;
  background: var(--ct-map-bg, #060606);
}

@media (min-width: 1201px) {
  html.astra-snap .astra-snap-section .astra-ct-map {
    flex: 1 1 auto;
    min-height: 0;
  }
}

/* 地图和红点必须在同一个按比例的盒子里：
   红点是按设计稿 1920×1080 的百分比定位的，图要是单独 object-fit:cover
   裁剪比例一变，点就和地图错开了 */
.astra-ct-map__canvas {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  aspect-ratio: var(--ct-map-ratio, 1920 / 1080);
  min-height: 100%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.astra-ct-map__canvas img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.astra-ct-map__dot {
  position: absolute;
  left: var(--x, 50%);
  top: var(--y, 50%);
  width: var(--ct-dot-size, 30px);
  height: var(--ct-dot-size, 30px);
  margin: calc(var(--ct-dot-size, 30px) / -2) 0 0 calc(var(--ct-dot-size, 30px) / -2);
}

.astra-ct-map__dot span {
  position: absolute;
  border-radius: 50%;
  background: var(--ct-primary);
}

.astra-ct-map__dot span:nth-child(1) {
  inset: 0;
  opacity: 0.05;
}

.astra-ct-map__dot span:nth-child(2) {
  inset: 16.667%;
  background: #7a0009;
  opacity: 0.15;
}

.astra-ct-map__dot span:nth-child(3) {
  inset: 36.667%;
}

.astra-ct-map__text {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ct-map-gap, 28px);
  width: 100%;
  max-width: calc(var(--ct-map-width, 1280px) + 32px);
  padding: 0 16px;
  text-align: center;
}

.astra-ct-map__title {
  margin: 0;
  width: 100%;
  font-size: var(--ct-map-title-size, 56px);
  line-height: var(--ct-map-title-line, 56px);
  font-weight: 700;
  letter-spacing: -2.24px;
  color: var(--ct-map-title-color, #e5e5e5);
  overflow-wrap: break-word;
}

/* 白线中间压一段红：底色白，靠居中的红条盖出来 */
.astra-ct-map__rule {
  position: relative;
  display: block;
  width: var(--ct-map-rule-width, 460px);
  max-width: 100%;
  height: var(--ct-map-rule-height, 2px);
  background: #ffffff;
}

.astra-ct-map__rule::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: var(--ct-map-rule-lead, 100px);
  height: 100%;
  transform: translateX(-50%);
  background: var(--ct-primary);
}

/* ================================================ 推荐产品 1033:1130 */
.astra-ct-prod {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  width: 100%;
  min-height: var(--ct-prod-height, 1080px);
  padding: var(--ct-prod-pad-y, 120px) var(--ct-prod-pad-x, 320px);
}

@media (min-width: 1201px) {
  html.astra-snap .astra-snap-section .astra-ct-prod {
    flex: 1 1 auto;
    min-height: 0;
  }
}

.astra-ct-prod__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ct-prod-head-gap, 24px);
  width: 100%;
  max-width: var(--ct-prod-head-width, 1280px);
  text-align: center;
}

.astra-ct-prod__title {
  margin: 0;
  width: 100%;
  font-size: var(--ct-prod-title-size, 48px);
  line-height: var(--ct-prod-title-line, 53px);
  font-weight: 700;
  letter-spacing: -1.92px;
  color: var(--ct-strong);
  overflow-wrap: break-word;
}

.astra-ct__rule {
  display: block;
  flex: 0 0 auto;
  width: var(--ct-rule-width, 100px);
  height: var(--ct-rule-height, 4px);
  background: var(--ct-primary);
}

.astra-ct-prod__grid {
  display: grid;
  grid-template-columns: repeat(var(--ct-prod-columns, 3), minmax(0, 1fr));
  gap: var(--ct-prod-gap, 20px);
  width: 100%;
}

.astra-ct-prod__card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--ct-card-inner-gap, 28px);
  min-height: var(--ct-prod-card-height, 604px);
  padding: var(--ct-prod-card-pad, 20px);
  background: #ffffff;
  border-bottom: 2px solid var(--ct-line);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.3s ease, filter 0.3s ease;
}

/* 设计稿把首张画成了 hover 态（下边、标题、MORE 都转红），这里按 hover 做 */
.astra-ct-prod__card:hover,
.astra-ct-prod__card:focus-visible {
  border-bottom-color: var(--ct-primary);
  filter: drop-shadow(14px 14px 2.4px rgba(0, 0, 0, 0.02));
}

.astra-ct-prod__media {
  position: relative;
  width: 100%;
  aspect-ratio: var(--ct-prod-media-ratio, 1 / 1);
  overflow: hidden;
}

.astra-ct-prod__media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  /* 设计稿把图放大裁了一圈，真实产品图裁了会缺角，这里整图放进去 */
  object-fit: contain;
}

.astra-ct-prod__info {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: var(--ct-prod-info-pad, 16px) 0;
  text-align: center;
}

.astra-ct-prod__name {
  margin: 0;
  font-size: var(--ct-prod-name-size, 24px);
  line-height: var(--ct-prod-name-line, 32px);
  font-weight: 600;
  letter-spacing: -0.24px;
  color: var(--ct-text);
  transition: color 0.3s ease;
}

.astra-ct-prod__card:hover .astra-ct-prod__name,
.astra-ct-prod__card:focus-visible .astra-ct-prod__name {
  color: var(--ct-primary);
}

.astra-ct-prod__specs {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.astra-ct-prod__spec {
  padding: 0 var(--ct-prod-spec-pad, 10px);
  font-size: var(--ct-prod-spec-size, 14px);
  line-height: var(--ct-prod-spec-line, 20px);
  font-weight: 600;
  color: var(--ct-text);
}

.astra-ct-prod__spec + .astra-ct-prod__spec {
  border-left: 1px solid var(--ct-line);
}

.astra-ct-prod__more {
  width: 100%;
  padding: var(--ct-prod-more-pad, 20px) 0;
  text-align: center;
  font-size: var(--ct-prod-more-size, 18px);
  line-height: 25px;
  font-weight: 700;
  letter-spacing: -0.36px;
  color: var(--ct-strong);
  transition: color 0.3s ease;
}

.astra-ct-prod__card:hover .astra-ct-prod__more,
.astra-ct-prod__card:focus-visible .astra-ct-prod__more {
  color: var(--ct-primary);
}

.astra-ct-prod__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: var(--ct-prod-cta-height, 57px);
  padding: 0 var(--ct-prod-cta-pad, 24px);
  background: var(--ct-primary);
  font-size: var(--ct-prod-cta-size, 16px);
  line-height: 20px;
  font-weight: 700;
  letter-spacing: -0.16px;
  color: #ffffff;
  text-decoration: none;
  transition: filter 0.25s ease;
}

.astra-ct-prod__cta:hover,
.astra-ct-prod__cta:focus-visible {
  filter: brightness(0.92);
  color: #ffffff;
}

.astra-ct-prod__cta svg {
  display: block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
}

/* 推荐产品这块照设计稿算出来比一屏高（实测 1137 > 可视 1000），
   开了整屏吸附时把留白和间距按视口收一收；
   min() 让控制项给的值始终是上限，不会被这里写死。
   这一条必须圈 min-width：html.astra-snap 在窄屏还在，不圈会漏进竖排那套 */
@media (min-width: 1201px) {
  html.astra-snap .astra-snap-section .astra-ct-row {
    padding-block: min(var(--ct-form-pad-y, 120px), 6vh);
  }

  html.astra-snap .astra-snap-section .astra-ct-prod {
    flex: 1 1 auto;
    min-height: 0;
    gap: min(48px, 3vh);
    padding-block: min(var(--ct-prod-pad-y, 120px), 6vh);
  }
}

/* 中间几档的左右留白（断点跟站上一致：laptop 1768 / tablet_extra 1400） */
@media (max-width: 1768px) {
  .astra-ct-row {
    padding-inline: var(--ct-form-pad-laptop, 160px);
  }
}

@media (max-width: 1400px) {
  .astra-ct-row {
    padding-inline: var(--ct-form-pad-te, 80px);
  }
}

/* ====================================================== 窄屏：只翻方向 */
@media (max-width: 1200px) {
  .astra-ct-row {
    flex-direction: column;
    padding: var(--ct-form-pad-narrow, 72px) 16px;
  }

  /* 一列排布后 flex 的基准落到高度轴上，这里必须换成 auto */
  .astra-ct-row > .elementor-widget {
    flex: 0 0 auto;
    width: 100%;
  }

  .astra-ct-row > .astra-ct-card {
    --flex-basis: auto;
    --width: 100%;
  }

  .astra-ct-info {
    flex: 0 0 auto;
    width: 100%;
  }

  .astra-ct-info__row {
    flex: 0 0 auto;
  }

  .astra-ct-info__social {
    padding-left: 0;
    padding-right: 0;
    justify-content: space-around;
  }

  .astra-ct-prod {
    padding: var(--ct-prod-pad-narrow, 72px) 16px;
  }

  .astra-ct-prod__grid {
    grid-template-columns: repeat(var(--ct-prod-columns-narrow, 2), minmax(0, 1fr));
  }

  .astra-ct-prod__card {
    min-height: 0;
  }

  .astra-ct-map {
    min-height: var(--ct-map-height-narrow, 520px);
  }
}

@media (max-width: 768px) {
  .astra-ct-info__row {
    flex-direction: column;
    gap: 16px;
  }

  .astra-ct-prod__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .astra-ct-card {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* 窄屏两栏字段挤不下，让 Elementor 的分栏退成整行 */
  .astra-ct-card .elementor-field-group.elementor-col-50 {
    width: 100%;
  }
}
