.elementor-3245 .elementor-element.elementor-element-1e79f8b7{--display:flex;}.elementor-3245 .elementor-element.elementor-element-1fdc6993{--display:flex;}.elementor-3245 .elementor-element.elementor-element-55156782{--display:grid;--e-con-grid-template-columns:repeat(4, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-3245 .elementor-element.elementor-element-3f793570{--display:flex;}.elementor-3245 .elementor-element.elementor-element-72d4e86c{--display:flex;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-3245 .elementor-element.elementor-element-39a024b7{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3245 .elementor-element.elementor-element-4cb8deb4 .elementor-heading-title{color:#000000;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-3245 .elementor-element.elementor-element-631ddf61 .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-6c6cd5bd{--display:grid;--e-con-grid-template-columns:repeat(5, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-3245 .elementor-element.elementor-element-7a86483e{--display:flex;}.elementor-3245 .elementor-element.elementor-element-ee8aa5d .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-54f1a52{--display:flex;}.elementor-3245 .elementor-element.elementor-element-22712537{--display:flex;}.elementor-3245 .elementor-element.elementor-element-33b59ca0 .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-7c21ae21{--display:flex;}.elementor-3245 .elementor-element.elementor-element-68ed6dc9 .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-7f471fed{--display:flex;}.elementor-3245 .elementor-element.elementor-element-3495ae2a{--display:flex;}.elementor-3245 .elementor-element.elementor-element-1faeac69 .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-5eafc760{--display:flex;}.elementor-3245 .elementor-element.elementor-element-62373f9b .elementor-heading-title{color:#000000;}.elementor-3245 .elementor-element.elementor-element-53692bcf{--display:flex;}.elementor-3245 .elementor-element.elementor-element-3ebeccb5{--display:flex;}.elementor-3245 .elementor-element.elementor-element-29a05df3 .elementor-heading-title{color:#000000;}@media(min-width:768px){.elementor-3245 .elementor-element.elementor-element-1fdc6993{--width:100%;}.elementor-3245 .elementor-element.elementor-element-55156782{--width:100%;}.elementor-3245 .elementor-element.elementor-element-3f793570{--width:100%;}}@media(max-width:1024px){.elementor-3245 .elementor-element.elementor-element-55156782{--e-con-grid-template-columns:repeat(2, 1fr);--grid-auto-flow:row;}.elementor-3245 .elementor-element.elementor-element-6c6cd5bd{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-3245 .elementor-element.elementor-element-55156782{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-3245 .elementor-element.elementor-element-6c6cd5bd{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for container, class: .elementor-element-1fdc6993 *//* =========================================================
   Review Card 总控变量
   以后主要改这里，不用到下面一段段找
========================================================= */
.review-card {
  /* 卡片内部左右留白，左右保持一样 */
  --review-padding-x: 48px;

  /* 卡片顶部和底部留白 */
  --review-padding-top: 12px;
  --review-padding-bottom: 6px;

  /* 左侧作者栏宽度 */
  --review-left-width: 74px;

  /* 左侧作者栏和右侧内容之间的距离 */
  --review-column-gap: 18px;

  /* 五星、标题、正文之间的上下距离 */
  --review-row-gap: 8px;

  /* 头像大小 */
  --review-avatar-size: 52px;

  /* 头像上下位置：往下改正数，比如 4px；往上改负数，比如 -4px */
  --review-avatar-y: 3px;

  /* 姓名和城市上下位置：往上是负数，往下是正数 */
  --review-info-y: -6px;

  /* 卡片最小高度，想更紧凑可以改小 */
  --review-min-height: 210px;
}

/* =========================================================
   Review Card 卡片整体布局
   左侧：头像 / 姓名城市
   右侧：五星 / 标题 / 正文
========================================================= */
.review-card {
  width: 100% !important;
  height: auto !important;
  min-height: var(--review-min-height) !important;

  display: grid !important;
  grid-template-columns: var(--review-left-width) minmax(0, 1fr) !important;
  grid-template-areas:
    "avatar stars"
    "avatar title"
    "info   text" !important;

  column-gap: var(--review-column-gap) !important;
  row-gap: var(--review-row-gap) !important;

  padding: var(--review-padding-top) var(--review-padding-x) var(--review-padding-bottom) !important;

  align-content: center !important;
  align-items: start !important;

  border: 1px solid #eef0f4 !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.035) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 清除 Elementor 默认间距，避免文字块之间忽高忽低 */
.review-card .elementor-widget,
.review-card .elementor-widget-container {
  margin-bottom: 0 !important;
}

/* =========================================================
   Author 作者容器
   display: contents 是为了让头像、姓名城市分别进入 grid 区域
========================================================= */
.review-author {
  display: contents !important;
}

/* =========================================================
   Avatar 头像
   想让头像往下移动：改上面的 --review-avatar-y
========================================================= */
.review-author .elementor-widget-image {
  grid-area: avatar !important;
  justify-self: start !important;
  align-self: start !important;

  width: var(--review-avatar-size) !important;
  margin: 0 !important;
  transform: translateY(var(--review-avatar-y)) !important;
}

.review-author img {
  width: var(--review-avatar-size) !important;
  height: var(--review-avatar-size) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
}

/* =========================================================
   Author Info 姓名 + 城市
   对齐右侧正文区域
========================================================= */
.review-author-info {
  grid-area: info !important;
  justify-self: start !important;
  align-self: start !important;

  width: var(--review-left-width) !important;
  margin: 0 !important;
  gap: 16px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  text-align: left !important;

  transform: translateY(var(--review-info-y)) !important;
}

/* 姓名样式 */
.review-name .elementor-heading-title,
.review-name h1,
.review-name h2,
.review-name h3,
.review-name h4 {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  color: #111827 !important;
  text-align: left !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* 城市样式 */
.review-location,
.review-location p {
  margin: 0 !important;
  font-size: 11px !important;
  line-height: 1.18 !important;
  color: #667085 !important;
  text-align: left !important;
  word-break: normal !important;
}

/* =========================================================
   Stars 五星
   对齐左侧头像
========================================================= */
.review-stars {
  grid-area: stars !important;
  margin: 0 !important;
  align-self: start !important;
}

.review-stars,
.review-stars p {
  color: #ff9f1a !important;
  font-size: 17px !important;
  line-height: 1 !important;
  letter-spacing: 1px !important;
}

/* =========================================================
   Title 评论标题
   位于五星下方
========================================================= */
.review-title {
  grid-area: title !important;
  margin: 0 !important;
  align-self: start !important;
}

.review-title .elementor-heading-title,
.review-title h1,
.review-title h2,
.review-title h3,
.review-title h4 {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: #101828 !important;
  white-space: normal !important;
}

/* =========================================================
   Text 评论正文
   对齐左侧姓名 + 城市区域
========================================================= */
.review-text {
  grid-area: text !important;
  margin: 0 !important;
  align-self: start !important;
  max-width: 100% !important;
}

.review-text,
.review-text p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  color: #243044 !important;
  white-space: normal !important;
  overflow: visible !important;
}



/* =========================================================
   Title 评论标题位置
   目的：让标题更靠近头像顶部，对齐更自然
========================================================= */
.review-title {
  transform: translateY(-11px) !important;
}






/* =========================================================
   Tablet 平板端自适应
   目标：
   1. 一行显示 2 个卡片
   2. 卡片内部仍保持：左侧头像/姓名，右侧五星/标题/正文
   3. 缩小左右留白，避免内容被挤压
========================================================= */
@media (max-width: 1024px) {
  .reviews-grid,
  .review-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }

  .review-card {
    --review-padding-x: 32px;
    --review-padding-top: 26px;
    --review-padding-bottom: 22px;
    --review-left-width: 68px;
    --review-column-gap: 16px;
    --review-row-gap: 12px;
    --review-avatar-size: 48px;
    --review-avatar-y: 2px;
    --review-info-y: -6px;
    --review-min-height: 220px;
  }

  .review-title .elementor-heading-title {
    font-size: 17px !important;
  }

  .review-text,
  .review-text p {
    font-size: 13.5px !important;
    line-height: 1.45 !important;
  }
}

/* =========================================================
   Mobile 手机端自适应
   目标：
   1. 一行显示 1 个卡片
   2. 保持和桌面端一样的左右结构
   3. 减少内边距，让正文不要被挤成很窄
========================================================= */
@media (max-width: 767px) {
  .reviews-grid,
  .review-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .review-card {
    --review-padding-x: 24px;
    --review-padding-top: 24px;
    --review-padding-bottom: 22px;
    --review-left-width: 62px;
    --review-column-gap: 14px;
    --review-row-gap: 12px;
    --review-avatar-size: 46px;
    --review-avatar-y: 2px;
    --review-info-y: -4px;
    --review-min-height: 220px;

    width: 100% !important;
    max-width: 420px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .review-stars,
  .review-stars p {
    font-size: 16px !important;
    letter-spacing: 0.8px !important;
  }

  .review-title .elementor-heading-title {
    font-size: 17px !important;
    line-height: 1.2 !important;
  }

  .review-name .elementor-heading-title {
    font-size: 12.5px !important;
  }

  .review-location,
  .review-location p {
    font-size: 10.5px !important;
  }

  .review-text,
  .review-text p {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
}

/* 有评论图片时，增加底部图片区域 */
.review-card.has-review-media {
  grid-template-areas:
    "avatar stars"
    "avatar title"
    "info   text"
    "media  media" !important;
}

/* 五张评论图片的父网格 */
.review-card .review-media {
  grid-area: media !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* 五个图像组件 */
.review-card .review-media > .elementor-widget-image {
  width: 100% !important;
  min-width: 0 !important;
}

/* 统一缩略图大小 */
.review-card .review-media img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border-radius: 4px !important;
}

/* =========================================================
   PC端评论卡紧凑覆盖
   有无图片保持完全相同的高度和内部位置
========================================================= */
@media (min-width: 1025px) {
  /* 卡片之间更紧凑 */
  .reviews-grid,
  .review-grid {
    column-gap: 12px !important;
    row-gap: 12px !important;
  }

  .review-card,
  .review-card.has-review-media {
    /* 缩小卡片上下留白 */
    --review-padding-top: 14px;
    --review-padding-bottom: 12px;

    /* 缩小星级、标题、正文之间的距离 */
    --review-row-gap: 8px;

    /* 所有卡片固定相同高度 */
    --review-min-height: 230px;

    height: var(--review-min-height) !important;
    min-height: var(--review-min-height) !important;

    /* 所有卡片都预留图片区 */
    grid-template-areas:
      "avatar stars"
      "avatar title"
      "info   text"
      "media  media" !important;

    /* 最后一行固定留给评论图片 */
    grid-template-rows:
      auto
      auto
      minmax(0, 1fr)
      52px !important;

    /* 内容从顶部开始，不再垂直居中移动 */
    align-content: start !important;
  }

  /* Fast shipping 靠近下方评论正文 */
  .review-title {
    transform: translateY(-3px) !important;
  }

  /* 五张缩略图使用固定区域，不影响上面的内容 */
  .review-card .review-media {
    width: min(100%, 280px) !important;
    max-width: 280px !important;
    align-self: end !important;
    justify-self: start !important;
    gap: 5px !important;
  }
}/* End custom CSS */