/* =============================================================================
   Sunvale Refined — 基础排版、布局与全局元素
   作用域策略：全局只改「排版与品牌变量」，页面级结构由各模板自带样式控制，
   以免破坏尚未替换的 Elementor 页面（/faq/ /quality/ 等）。
   ========================================================================== */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--sv-sand-100);color:var(--sv-ink-900);
  font-family:var(--sv-font-body);font-size:16px;line-height:1.625;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}

h1,h2,h3,h4,h5,h6{
  font-family:var(--sv-font-display);font-weight:600;line-height:1.12;
  letter-spacing:normal;margin:0;color:var(--sv-ink-900);
}
h1{font-size:clamp(2.2rem,4.6vw,3.9rem);line-height:1.06}
h2{font-size:clamp(1.75rem,3vw,2.5rem);line-height:1.15}
h3{font-size:1.125rem;line-height:1.35}
p{margin:0 0 1rem;color:var(--sv-ink-600)}
:focus-visible{outline:2px solid var(--sv-clay-500);outline-offset:2px;border-radius:4px}

.sv-container{max-width:var(--sv-container);margin-inline:auto;padding-inline:var(--sv-gutter);width:100%}
.sv-section{padding:80px 0}
.sv-section--sand{background:var(--sv-sand-200)}
.sv-section--dark{background:var(--sv-forest-900);color:var(--sv-white)}
.sv-section--dark h1,.sv-section--dark h2,.sv-section--dark h3{color:var(--sv-white)}
.sv-section--dark p{color:rgba(255,255,255,.74)}
.sv-section--tight{padding:64px 0}
.sv-section--lead{padding:40px 0}
@media(max-width:768px){.sv-section{padding:56px 0}.sv-section--lead{padding:40px 0}}

.sv-eyebrow{display:block;font-size:.75rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sv-forest-500);font-family:var(--sv-font-body)}
.sv-section--dark .sv-eyebrow{color:var(--sv-moss-300)}
.sv-mono{font-family:var(--sv-font-mono);font-variant-numeric:tabular-nums}

.sv-lead{font-size:1.0625rem;color:var(--sv-ink-600);max-width:70ch}
.sv-grid{display:grid;gap:24px}
.sv-grid--2{grid-template-columns:repeat(2,1fr)}
.sv-grid--3{grid-template-columns:repeat(3,1fr)}
.sv-grid--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1024px){.sv-grid--4{grid-template-columns:repeat(2,1fr)}.sv-grid--3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.sv-grid--2,.sv-grid--3,.sv-grid--4{grid-template-columns:1fr}}

/* 网格子项防溢出：长图/长单词不再撑破容器 */
.sv-grid > *,.sv-split > *{min-width:0}
.sv-split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.sv-split--detail{grid-template-columns:1.35fr 1fr;gap:56px;align-items:start}
@media(max-width:900px){.sv-split,.sv-split--detail{grid-template-columns:1fr;gap:32px}}

.sv-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px}
.sv-section-head h2{margin-top:12px}
.sv-section-head p{margin-top:12px;max-width:56ch}
@media(max-width:768px){.sv-section-head{flex-direction:column;align-items:flex-start}}

/* 按钮：与 Elementor 默认按钮解耦，避免继承其样式 */
.sv-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 22px;border-radius:var(--sv-r-btn);border:1px solid transparent;
  font-family:var(--sv-font-body);font-weight:600;font-size:.9375rem;cursor:pointer;
  transition:background-color .2s var(--sv-ease),color .2s var(--sv-ease),
    border-color .2s var(--sv-ease),transform .2s var(--sv-ease)}
.sv-btn--primary{background:var(--sv-clay-500);color:var(--sv-white)}
.sv-btn--primary:hover{background:var(--sv-clay-600);color:var(--sv-white)}
.sv-btn--outline{background:transparent;color:var(--sv-forest-700);border-color:var(--sv-line)}
.sv-btn--outline:hover{border-color:var(--sv-forest-700);color:var(--sv-forest-700)}
.sv-btn--ghost{background:transparent;color:var(--sv-white);border-color:rgba(255,255,255,.45)}
.sv-btn--ghost:hover{border-color:var(--sv-white);background:rgba(255,255,255,.08);color:var(--sv-white)}
.sv-btn--lg{min-height:48px;padding:0 26px}
.sv-btn--block{width:100%}

.sv-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;
  border-radius:var(--sv-r-pill);border:1px solid var(--sv-line);background:var(--sv-white);
  font-size:.75rem;font-weight:600;color:var(--sv-ink-600)}
.sv-card{position:relative;background:var(--sv-white);border:1px solid var(--sv-line);
  border-radius:var(--sv-r-card);box-shadow:none;
  /* 只过渡 transform；阴影改用预渲染伪元素 + opacity。
   * box-shadow 插值会触发绘制，全站几十张卡片悬停时叠加明显。 */
  transition:transform .25s var(--sv-ease),border-color .25s var(--sv-ease)}
.sv-card::after{content:"";position:absolute;inset:-1px;border-radius:inherit;
  box-shadow:var(--sv-shadow-md);opacity:0;pointer-events:none;
  transition:opacity .25s var(--sv-ease)}
.sv-card:hover{transform:translateY(-4px)}
.sv-card:hover::after{opacity:1}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
html,body{overflow-x:hidden}
img,svg,video,canvas{max-width:100%}