/* ==========================================================================
   Ovita Donor Solutions — 全站样式
   设计稿：Homepage.jpg（1440 宽，内容容器 1280）
   ========================================================================== */

/* ---------- 设计令牌（取值：Design/Style Guide/colors.md + Typography.md） ---------- */
:root{
  /* Brand */
  --brand-50:#faf7f2;    /* Light */
  --brand-500:#ab5b49;   /* Base 赤陶 */
  --brand-800:#47261f;   /* Dark */
  /* Accent */
  --accent-50:#f5f0f2;   /* Light */
  --accent-500:#5c3d4a;  /* Base 酒红 */
  --accent-800:#2a1a2e;  /* Dark */
  /* Neutrals */
  --n-white:#ffffff;
  --n-snow:#f6f6f6;
  --n-mist:#e4e4e4;
  --n-ash:#d1d1d1;
  --n-smoke:#b8b8b8;
  --n-stone:#757575;
  --n-slate:#5c5c5c;
  --n-charcoal:#444444;
  --n-graphite:#2e2a2b;
  --n-ink:#211f20;
  /* 语义别名 */
  --cream:var(--brand-50);  /* 米白底 */
  --white:var(--n-white);   /* 纯白底 */
  --blush:var(--brand-50);  /* 首屏左下角红晕 */
  --terra:var(--brand-500);
  --terra-d:var(--brand-800);
  --wine:var(--accent-500);
  --ink:var(--accent-800);  /* 标题深色 */
  --body:var(--n-graphite);
  --mute:var(--n-stone);
  --line:var(--n-mist);     /* 分隔线 / 描边 */
  --dark:var(--n-ink);      /* 页脚底 */
  --dark-2:var(--n-charcoal); /* 法务条底 */
  --sans:"Google Sans Flex","Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Playfair Display",Georgia,"Times New Roman",serif; /* guide 外装饰衬线，仅 em/logo 使用 */
  --pill:999px;
  --ease:.22s ease;
}

/* ---------- 基础 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;overflow-x:hidden;
  font:400 16px/1.5 var(--sans);
  color:var(--body);background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,figure{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5,h6,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer}
svg{display:block}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* 容器：内容宽 1280，两侧留 20 */
.cw{width:min(100% - 40px,1280px);margin-inline:auto}

/* ---------- 排版（对应 Typography.md：行高百分比 / 字间距百分比） ---------- */
/* 依据 Design/Style Guide/Typography.md：元素选择器直接对应 Display/H1–H6，
   Desktop 字号见下、Mobile 在响应式段降档；字距统一 -0.02em，H1/H2 字重 400，H3–H6 字重 500 */
h1,h2,h3,h4,h5,h6{font-family:var(--sans);font-weight:400;color:var(--ink);letter-spacing:-.02em;margin:0}
.display{font-size:60px;line-height:1.2}                 /* Display：60 / Mobile 56 · 120% */
h1{font-size:56px;line-height:1.25}                      /* Heading 1：56 / 48 · 125% */
h2{font-size:48px;line-height:1.2}                       /* Heading 2：48 / 40 · 120% */
h3{font-size:36px;line-height:1.2;font-weight:500}       /* Heading 3：36 / 32 · 120% */
h4{font-size:28px;line-height:1.2;font-weight:500}       /* Heading 4：28 / 24 · 120% */
h5{font-size:22px;line-height:1.2;font-weight:500}       /* Heading 5：22 · 120% */
h6{font-size:18px;line-height:1.2;font-weight:500}       /* Heading 6：18 · 120% */
/* 22px 尺寸工具：供数值/非标题元素（<b>/<dt>/<dd>）复用，等价 Heading 5 尺寸 */
.t22{font:500 22px/1.2 var(--sans);color:var(--ink);letter-spacing:-.02em}
/* Text XL / Large / Medium / Small / Tiny：行高 150%，字间距 0 */
.lead{font:400 18px/1.5 var(--sans)}
.base{font:400 16px/1.5 var(--sans)}
.sm{font:400 14px/1.5 var(--sans)}
.xs{font:400 12px/1.5 var(--sans)}
.strong{font-weight:600}
.mute{color:var(--mute)}
.terra{color:var(--terra)}
.ink{color:var(--ink)}
em{font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:0}

/* 眉标 / Tagline（Style Guide）：14px，行高 100%，字重 500，字距 +0.1em，大写 */
.ey{display:flex;align-items:center;gap:10px;font:500 14px/1 var(--sans);
  letter-spacing:.1em;text-transform:uppercase;color:var(--body)}
.ey::before{content:"";width:7px;height:7px;flex:none;background:var(--terra);transform:rotate(45deg)}
.ey.nd::before{display:none}

/* 区块头 */
.head{display:flex;flex-direction:column;gap:28px}
.head.mid{align-items:center;text-align:center}
.hh{display:flex;flex-direction:column;gap:16px}

/* ---------- 图标（assets/icon 生成的精灵，经 <use> 引用；路径统一 currentColor） ---------- */
.ic{width:18px;height:18px;flex:none;fill:currentColor}
.ic.big{width:40px;height:40px}
.links .ic{width:14px;height:14px;margin-left:-4px}

/* ---------- 通用行 / 按钮 ---------- */
.row{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.row.mid{justify-content:center}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:52px;padding:0 26px;border-radius:var(--pill);border:1px solid transparent;
  font:600 16px/1 var(--sans);white-space:nowrap;transition:var(--ease)}
.btn .ic{width:17px;height:17px}
.btn.solid{background:var(--terra);color:var(--n-white)}
.btn.solid:hover{background:var(--terra-d)}
.btn.line{border-color:var(--ink);color:var(--ink)}
.btn.line:hover{background:var(--ink);color:var(--n-white)}
.btn.line.terra{border-color:var(--terra);color:var(--terra)}
.btn.line.terra:hover{background:var(--terra);color:var(--n-white)}
.btn.white{background:var(--n-white);color:var(--ink)}
.btn.white:hover{background:var(--cream)}
.btn.ghost{border-color:rgba(255,255,255,.55);color:var(--n-white)}
.btn.ghost:hover{background:rgba(255,255,255,.14)}
.btn.sm{height:40px;padding:0 20px;font-size:15px}

/* 勾选清单 */
.checks li{display:flex;align-items:flex-start;gap:12px;font:400 16px/1.5 var(--sans);color:var(--ink)}
.checks .ic{width:20px;height:20px;flex:none;margin-top:2px;color:var(--terra)}

/* ---------- 区块骨架 ---------- */
main{display:block}
.sec{padding:96px 0}
.cream{background:var(--cream)}
.white{background:var(--white)}

/* ==========================================================================
   导航
   ========================================================================== */
.nav{background:var(--cream);position:relative;z-index:50}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;
  width:min(100% - 40px,1280px);margin-inline:auto;padding:24px 0 20px}

.logo{display:inline-flex;align-items:center;line-height:1}
.logo img{display:block;height:40px;width:auto}
.foot .logo img{height:34px}

.menu{display:flex;align-items:center;gap:36px}
.menu-list{display:flex;align-items:center;gap:36px}
.menu-item{position:relative}
.links a{display:inline-flex;align-items:center;gap:4px;font-weight:500;color:var(--ink);transition:color var(--ease)}
.links .menu-item:hover > a{color:var(--terra)}
.links .ic{display:none} /* 箭头改由 CSS 伪元素绘制，兼容无 SVG 图标的真实菜单 */

/* 带二级菜单的父项箭头（纯 CSS 绘制，不依赖 SVG/素材） */
.menu-list > .menu-item-has-children > a::after{content:"";flex:none;width:7px;height:7px;
  margin-left:2px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform var(--ease)}

/* 桌面下拉子菜单 */
.sub-menu{position:absolute;left:50%;top:100%;transform:translate(-50%,10px);
  min-width:212px;padding:8px;background:var(--white);border:1px solid var(--line);
  border-radius:14px;box-shadow:0 18px 44px rgba(33,31,32,.14);
  opacity:0;visibility:hidden;transition:opacity var(--ease),transform var(--ease),visibility var(--ease);
  z-index:60}
.menu-item-has-children:hover > .sub-menu,
.menu-item-has-children:focus-within > .sub-menu{opacity:1;visibility:visible;transform:translate(-50%,6px)}
.menu-item-has-children:hover > a .ic,
.menu-item-has-children:focus-within > a .ic{transform:rotate(180deg)}
.menu-item-has-children:hover > a::after,
.menu-item-has-children:focus-within > a::after{transform:rotate(-135deg) translateY(-2px)}
.sub-menu .menu-item{position:static}
.sub-menu a{display:block;padding:10px 14px;border-radius:9px;font-weight:500;
  font-size:15px;line-height:1.3;color:var(--ink)}
.sub-menu a:hover{background:var(--cream);color:var(--terra)}

/* 三级下拉（桌面右侧飞出） */
.sub-menu .menu-item-has-children{position:relative}
.sub-menu > .menu-item-has-children > a{display:flex;align-items:center;justify-content:space-between}
.sub-menu > .menu-item-has-children > a::after{content:"";flex:none;width:7px;height:7px;margin-left:8px;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(-45deg)}
.sub-menu .sub-menu{left:calc(100% + 4px);top:-8px;
  transform:translateX(-8px);min-width:180px;z-index:70}
.sub-menu > .menu-item-has-children:hover > .sub-menu,
.sub-menu > .menu-item-has-children:focus-within > .sub-menu{
  opacity:1;visibility:visible;transform:translateX(0)}

/* 移动端汉堡按钮（桌面隐藏） */
.menu-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;
  position:relative;width:44px;height:44px;padding:0;z-index:70}
.menu-toggle .bar{display:block;width:24px;height:2px;margin-inline:auto;background:var(--ink);
  border-radius:2px;transition:transform var(--ease),opacity var(--ease)}

/* 遮罩（仅移动端用） */
.nav-backdrop{display:none}

/* ==========================================================================
   首屏
   ========================================================================== */
.hero{padding:56px 0 96px;background:
  radial-gradient(760px 460px at 18% 104%,var(--blush),rgba(240,226,218,0) 72%),var(--cream)}
.hero-in{display:flex;align-items:flex-start;gap:83px}
.hero-txt{width:600px;flex:none;padding-top:33px}
.hero-head h1{margin:10px 0 0}
.scribble{width:200px;margin:-7px 0 0 0}
.hero-head .lead{margin-top:20px}
.hero-txt>.row{margin:28px 0 124px}

.stats{display:flex;gap:28px}
.stats li{padding-left:28px;border-left:1px solid var(--line)}
.stats b{display:block;font:500 36px/1.2 var(--sans);color:var(--ink);letter-spacing:-.02em}
.stats span{display:block;font:400 16px/1.5 var(--sans);color:var(--body)}

.hero-vis{position:relative;width:594px;height:640px;flex:none}
.hero-img{position:absolute;left:42px;top:32px;width:515px;height:608px;
  object-fit:cover;border-radius:24px}

.match{position:absolute;left:374px;top:0;width:216px;padding:11px 14px 12px;
  background:var(--n-white);border-radius:12px;box-shadow:0 14px 34px rgba(33,31,32,.14)}
.match strong{display:block;margin-top:1px;color:var(--ink)}
.mr{display:flex;align-items:center;gap:8px;margin-top:5px}
.stars{display:flex;gap:2px;color:var(--terra)}
.stars .ic{width:13px;height:13px}

.tag{position:absolute;top:420px;padding:5px;background:var(--n-white);border-radius:12px;
  box-shadow:0 14px 34px rgba(33,31,32,.14)}
.tag.egg{left:0;width:128px}
.tag.sperm{left:462px;width:132px}
.tag img{width:100%;height:112px;object-fit:cover;border-radius:8px}
.tag em{display:block;height:30px;font-style:normal;font:600 11px/30px var(--sans);
  text-align:center;color:var(--n-white);border-radius:0 0 8px 8px}
.tag.egg em{background:var(--terra)}
.tag.sperm em{background:var(--accent-500)}

/* ==========================================================================
   服务清单 + 人像条
   ========================================================================== */
.srv{background:var(--white);overflow:hidden}
.srv-in{display:grid;grid-template-columns:600px 1fr;gap:80px;padding-bottom:94px}
.srv-l{display:flex;flex-direction:column;gap:26px}
.srv-r{display:flex;flex-direction:column;align-items:flex-start;gap:26px}
.checks.svc{display:grid;width:100%;grid-template-columns:repeat(2,1fr);
  grid-auto-flow:column;grid-template-rows:repeat(5,auto);column-gap:80px;row-gap:16px}

.strip{display:flex}
.strip-swiper .swiper-wrapper{transition-timing-function:linear!important}
.strip .swiper-slide{width:401px;flex:0 0 auto}
.strip img{width:100%;height:397px;object-fit:cover;border-radius:12px;display:block}

/* ==========================================================================
   四条路径
   ========================================================================== */
#journey .lead{max-width:720px}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:64px 20px;margin-top:64px}
.card{display:flex;background:var(--n-white);border-radius:12px;overflow:hidden;
  box-shadow:0 2px 10px rgba(33,31,32,.05)}
.card-img{width:277px;flex:none;align-self:stretch;object-fit:cover}
.card-bd{flex:1;display:flex;flex-direction:column;justify-content:center;
  gap:36px;padding:48px 32px 48px 22px}
.card h5{color:var(--ink)}
.card .sm{margin-top:8px}
.card .ct{display:flex;flex-direction:column;gap:16px}
.card .btn{align-self:flex-start}

/* ==========================================================================
   数据（酒红区块）
   ========================================================================== */
.wine{background:var(--wine)}
.wine .ey{color:var(--n-ash)}
.wine .ey::before{background:var(--n-white)}
.wine h2,.wine .lead{color:var(--n-white)}
.wine .lead{color:var(--n-ash)}
.stats4{display:grid;grid-template-columns:repeat(4,1fr);margin-top:56px}
.stats4 li{padding:0 16px;text-align:center;border-left:1px solid rgba(255,255,255,.18)}
.stats4 b{display:block;font:400 60px/1.2 var(--sans);color:var(--n-white);letter-spacing:-.02em}
.stats4 span{display:block;font:400 16px/1.5 var(--sans);color:var(--n-ash)}

/* ==========================================================================
   Why Ovita
   ========================================================================== */
.why{background:
  radial-gradient(1000px 520px at 78% 100%,#f2e5e1,rgba(242,229,225,0) 70%),#fbfaf8}
.why-in{display:flex;align-items:flex-start;gap:44px}
.why-l{width:420px;flex:none;display:flex;flex-direction:column;gap:18px}
.why-l .row{margin-top:12px}
.feats{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.feat{padding:24px;background:var(--n-white);border-radius:16px;box-shadow:0 8px 26px rgba(33,31,32,.05)}
.feat .ic.big{color:var(--terra)}
.feat .hh{margin-top:34px}
.feat h5{font-size:22px}

/* ==========================================================================
   VIP
   ========================================================================== */
.vip-in{position:relative;display:flex;margin-top:48px;background:var(--n-white);border-radius:24px;overflow:hidden}
.vip-txt{width:640px;flex:none;padding:60px 48px 56px;display:flex;flex-direction:column;
  align-items:flex-start;gap:28px}
.vip-txt .checks{display:flex;flex-direction:column;row-gap:16px}
.vip-img{width:640px;flex:none;object-fit:cover}

.note{position:absolute;right:32px;bottom:24px;width:312px;padding:22px 24px;
  background:var(--n-charcoal);border-radius:12px;color:var(--n-white)}
.note .ey{color:var(--n-smoke)}
.note .sm{margin-top:14px;font-size:14px;line-height:1.5;color:var(--n-white)}
.note .dash{margin-top:14px;font-size:12px;line-height:1.5;color:var(--n-smoke)}
.note .dash::before{content:"—\00a0\00a0"}

/* ==========================================================================
   博客
   ========================================================================== */
.brow{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:14px}
#blog .hh{gap:14px}
.posts-swiper{margin-top:60px}
.posts{display:flex}
.post-media{position:relative;border-radius:12px;overflow:hidden}
.post-media img{width:100%;height:300px;object-fit:cover}
.badge{position:absolute;right:18px;top:16px;height:28px;padding:0 14px;border-radius:var(--pill);
  background:var(--accent-50);font:500 14px/28px var(--sans);letter-spacing:0;color:var(--ink)}
.post-bd{padding-top:22px}
.meta{display:flex;gap:24px;font:400 14px/1.5 var(--sans);color:var(--body)}
.meta span{display:inline-flex;align-items:center;gap:7px}
.meta .ic{width:16px;height:16px;color:var(--terra)}
.post h5{margin-top:16px}
.post .base{margin-top:14px}
.more{display:inline-flex;align-items:center;gap:9px;margin-top:26px;
  font:600 16px/1 var(--sans);color:var(--ink);transition:gap var(--ease)}
.more:hover{gap:13px;color:var(--terra)}
.more .ic{width:17px;height:17px}

.pager{display:flex;align-items:center;justify-content:space-between;margin-top:56px}
.dots{display:flex;align-items:center;gap:6px;position:static;width:auto}
.dots i{width:8px;height:8px;border-radius:50%;background:var(--n-ash);display:block;opacity:1;transition:var(--ease);margin: 0!important;}
.dots i.swiper-pagination-bullet-active{background:var(--ink);opacity:1}
.arrows{display:flex;gap:24px}
.arrows button{width:44px;height:44px;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:50%;color:var(--ink);transition:var(--ease)}
.arrows button:hover{background:var(--ink);border-color:var(--ink);color:var(--n-white)}

/* ==========================================================================
   行动号召
   ========================================================================== */
.cta{position:relative;overflow:hidden;color:var(--n-white);
  background:linear-gradient(rgba(92,61,74,.88),rgba(92,61,74,.88)),
             url("../img/cta.jpg") center/cover no-repeat var(--wine)}
.cta-in{position:relative;padding:99px 0}
.cta .ey{color:var(--n-ash);justify-content:center}
.cta .ey::before{background:var(--n-white)}
.cta h2,.cta .lead{color:var(--n-white)}
.cta .lead{max-width:600px}

/* ==========================================================================
   页脚
   ========================================================================== */
.foot{background:var(--dark);color:var(--n-smoke);padding:80px 0 56px}
.foot-in{display:grid;grid-template-columns:503px 1fr}
.fbrand{max-width:360px}
.fbrand .base{margin-top:30px;color:var(--n-smoke)}
.social{display:flex;gap:11px;margin-top:56px}
.social .ic{width:20px;height:20px}
.social a{width:40px;height:40px;display:grid;place-items:center;color:var(--n-white);
  border:1px solid rgba(255,255,255,.22);border-radius:10px;transition:var(--ease)}
.social a:hover{background:var(--terra);border-color:var(--terra)}

.fcols{display:grid;grid-template-columns:250px 232px 1fr}
.fcol h4{font:600 14px/1 var(--sans);letter-spacing:.1em;color:var(--n-white)}
.fcol ul{margin-top:26px;display:flex;flex-direction:column;gap:15px}
.fcol a{font-size:15px;line-height:1.5;color:var(--n-smoke);transition:color var(--ease)}
.fcol a:hover{color:var(--n-white)}
.touch li{display:flex;align-items:center;gap:14px}
.sq{width:32px;height:32px;flex:none;display:grid;place-items:center;
  border-radius:9px;background:var(--terra);color:var(--n-white)}
.sq .ic{width:16px;height:16px}
.ul{text-decoration:underline;text-underline-offset:3px}

.legal{background:var(--dark-2);color:var(--n-smoke);font-size:14px;line-height:1.5}
.legal-in{display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:16px 0;flex-wrap:wrap}
.legal nav{display:flex;gap:36px}
.legal a{transition:color var(--ease)}
.legal a:hover{color:var(--n-white)}

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width:1300px){
  .hero-in{gap:40px}
  .hero-txt{width:auto;flex:1;min-width:0}
  .hero-vis{width:460px;height:520px}
  .hero-img{left:0;top:40px;width:100%;height:480px}
  .match{left:auto;right:0;top:0}
  .tag{top:340px}
  .tag.sperm{left:auto;right:0}
  .strip .swiper-slide{width:calc((100vw - 45px)/4)}
  .strip img{height:auto;aspect-ratio:401/397}
}

@media (max-width:1080px){
  /* 标题 Mobile 档（Typography.md）：Display 56 · H1 48 · H2 40 · H3 32 · H4 24（H5/H6 不变） */
  .display{font-size:56px}
  h1{font-size:48px}
  h2{font-size:40px}
  h3{font-size:32px}
  h4{font-size:24px}
  .srv-in{grid-template-columns:1fr;gap:48px}
  .why-in{flex-direction:column}
  .why-l{width:100%}
  .stats4{grid-template-columns:repeat(2,1fr);row-gap:32px;padding-top:32px}
  .stats4 li{border-left:0;border-top:1px solid rgba(255,255,255,.18);padding:24px 0}
  .vip-txt,.vip-img{width:100%}
  .vip-in{flex-direction:column}
  .vip-img{height:360px}
  .foot-in{grid-template-columns:1fr;gap:56px}
  .fbrand{max-width:520px}
}

@media (max-width:860px){
  /* 汉堡按钮显示，菜单变为右侧抽屉 */
  .menu-toggle{display:inline-flex}
  .nav.menu-open .menu-toggle .bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav.menu-open .menu-toggle .bar:nth-child(2){opacity:0}
  .nav.menu-open .menu-toggle .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .menu{position:fixed;top:0;right:0;height:100dvh;width:min(84vw,340px);
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--cream);padding:88px 26px 32px;overflow-y:auto;
    transform:translateX(100%);transition:transform .3s ease;z-index:60;
    box-shadow:-20px 0 50px rgba(33,31,32,.14)}
  .nav.menu-open .menu{transform:translateX(0)}

  .menu-list{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .menu-item{border-bottom:1px solid var(--line)}
  .links a{justify-content:space-between;padding:15px 0;width:100%}
  .links .menu-item:hover > a{color:var(--ink)}

  /* 移动端下拉：手风琴展开 */
  .sub-menu{position:static;transform:none;left:auto;top:auto;min-width:0;
    padding:0 0 8px;background:transparent;border:0;border-radius:0;box-shadow:none;
    opacity:1;visibility:visible;display:none}
  /* 覆盖桌面 :hover/:focus-within 下拉位移（同特异度靠源码顺序取胜，避免子菜单被平移出屏） */
  .menu-item-has-children:hover > .sub-menu,
  .menu-item-has-children:focus-within > .sub-menu{transform:none;left:auto;top:auto}
  .menu-item-has-children.menu-open > .sub-menu{display:block}
  .links .menu-item-has-children.menu-open > a{color:var(--terra)}
  .menu-item-has-children.menu-open > a .ic{transform:rotate(180deg)}
  .menu-item-has-children.menu-open > a::after{transform:rotate(-135deg) translateY(-2px)}
  .sub-menu a{padding:9px 0 9px 14px;color:var(--mute);font-size:15px;background:none}
  .sub-menu a:hover{background:none;color:var(--terra)}

  /* 三级手风琴（移动端） */
  .sub-menu .sub-menu{padding:0 0 6px 14px;transform:none;min-width:0}
  .sub-menu .sub-menu a{padding-left:28px}
  .sub-menu > .menu-item-has-children > a::after{content:"";flex:none;width:7px;height:7px;margin-left:4px;
    border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
    transform:rotate(45deg) translateY(-2px);transition:transform var(--ease)}
  .sub-menu > .menu-item-has-children.menu-open > a::after{transform:rotate(-135deg) translateY(-2px)}
  .sub-menu > .menu-item-has-children.menu-open > a{color:var(--terra)}
  /* 覆盖桌面飞出 hover，防止移动端触屏悬停时三级面板误显示 */
  .sub-menu > .menu-item-has-children:hover > .sub-menu,
  .sub-menu > .menu-item-has-children:focus-within > .sub-menu{
    transform:none;left:auto;top:auto}

  .menu .btn.solid.sm{margin-top:24px;width:100%}

  /* 遮罩 */
  .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(33,31,32,.45);
    opacity:0;visibility:hidden;transition:opacity var(--ease),visibility var(--ease);z-index:40}
  .nav.menu-open .nav-backdrop{opacity:1;visibility:visible}

  .sec,.hero{padding:20px 0}
  .hero-in{flex-direction:column;gap:48px}
  .hero-vis{width:100%;height:auto}
  .hero-img{position:static;width:100%;height:400px}
  .match{position:static;width:auto;margin-top:16px;box-shadow:none;
    border:1px solid var(--line)}
  .mr{margin-top:0}
  .tag{display:none}
  .hero-txt>.row{margin:24px 0 40px}
  .cards{grid-template-columns:1fr;gap:24px}
  .card-bd{padding:28px 24px}
  .feats{grid-template-columns:1fr}
  .note{position:static;width:auto;margin:0 48px 48px}
  .brow{align-items:flex-start;flex-direction:column;gap:20px}
  .strip .swiper-slide{width:280px}
  .strip img{height:278px}
  .fcols{grid-template-columns:1fr 1fr;gap:40px}
  .cta-in{padding:64px 0}
}

@media (max-width:560px){
  .lead{font-size:16px;line-height:1.5}
  .stats{flex-wrap:wrap;gap:20px}
  .stats li{padding-left:16px}
  .stats4{grid-template-columns:1fr}
  .btn{width:100%}
  .row{gap:14px}
  .card{flex-direction:column}
  .card-img{width:100%;height:240px}
  .vip-txt{padding:32px 24px}
  .note{margin:0 24px 32px}
  .fcols{grid-template-columns:1fr}
  .legal-in{justify-content:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}

/* ==========================================================================
   单页模块（page.php / inc/*）—— 对应 Design/Blocks 设计稿
   仅使用上方设计令牌，颜色一律走 CSS 变量
   ========================================================================== */

/* 通用：圆形图标 */
.pico{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--line);color:var(--terra)}
.pico .ic{width:18px;height:18px}
.pico.gray{color:var(--n-stone)}

/* ---------- Hero Banner ---------- */
.phero{background:var(--cream)}
.phero-in{display:flex;align-items:center;gap:64px}
.phero-txt{width:600px;flex:none;display:flex;flex-direction:column;gap:32px}
.phero-stats{display:flex}
.phero-stats li{padding:0 28px;border-left:1px solid var(--line)}
.phero-stats li:first-child{padding-left:0;border-left:0}
.phero-stats b{display:block;font:500 24px/1.2 var(--sans);color:var(--ink);letter-spacing:-.02em}
.phero-stats span{display:block;margin-top:6px}
.phero-vis{position:relative;flex:1;min-width:0}
.phero-img{width:100%;height:520px;object-fit:cover;border-radius:24px}
.phero-quote{position:absolute;left:-40px;bottom:36px;width:340px;display:flex;gap:14px;
  background:var(--n-white);border-radius:16px;padding:22px;box-shadow:0 16px 40px rgba(33,31,32,.12)}
.phero-quote strong{display:block;color:var(--ink)}
.phero-quote blockquote{margin:6px 0 0}

/* ---------- Why Ovita 2×2 对比 ---------- */
.wgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px}
.wgrid-img img{width:100%;height:100%;min-height:340px;object-fit:cover;border-radius:20px}
.wcard{padding:36px;border-radius:20px;background:var(--cream)}
.wcard.alt{background:var(--n-snow)}
.wcard-hd{display:flex;align-items:center;gap:14px}
.wcard h5{color:var(--ink)}
.wcard .checks{display:flex;flex-direction:column;gap:16px;margin-top:24px}
.dots-list{display:flex;flex-direction:column;gap:16px;margin-top:22px}
.dots-list li{position:relative;padding-left:22px;font:400 16px/1.5 var(--sans);color:var(--body)}
.dots-list li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;
  border-radius:50%;background:var(--n-smoke)}

/* ---------- Requirements ---------- */
.req-in{display:grid;grid-template-columns:420px 1fr;gap:64px;align-items:start}
.req-img img{width:100%;height:640px;object-fit:cover;border-radius:24px}
.req-txt{display:flex;flex-direction:column;gap:24px}
.dl{margin-top:4px}
.dl-row{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:baseline;
  padding:16px 0;border-top:1px solid var(--line)}
.dl-row:last-child{border-bottom:1px solid var(--line)}
.dl dt{font:600 13px/1.4 var(--sans);letter-spacing:.08em;color:var(--mute)}
.dl dd{margin:0;color:var(--ink)}

/* 提示卡（Requirements 底部 / Elite 补充） */
.callout{display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  padding:24px 26px;border-radius:16px;background:var(--cream)}
.callout.white{background:var(--n-white);box-shadow:0 8px 26px rgba(33,31,32,.06)}
.callout .strong{color:var(--ink)}

/* ---------- Motivations（复用 feats，改 3 列） ---------- */
.mot .head{margin-bottom:0}
.mot .feats{grid-template-columns:repeat(3,1fr);margin-top:56px}

/* ---------- Compensation ---------- */
.comp-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.comp-img img{width:100%;height:560px;object-fit:cover;border-radius:24px}
.comp-txt{display:flex;flex-direction:column;gap:24px}
.tiers{display:flex;flex-direction:column;gap:16px;margin-top:4px}
.tier{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:22px 26px;border-radius:16px;background:var(--cream)}
.tier-l{display:flex;flex-direction:column;gap:6px}
.tier .ey{font-size:13px}
.tier b{color:var(--ink);text-align:right}

/* ---------- Elite Donor Program ---------- */
.elite-top{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-bottom:56px}
.elite-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.elite-l{display:flex;flex-direction:column;gap:32px}
.elite-img img{width:100%;height:520px;object-fit:cover;border-radius:24px}
.ilist{display:flex;flex-direction:column;gap:28px}
.ilist li{display:flex;align-items:flex-start;gap:18px}
.ilist .sq{width:48px;height:48px;border-radius:12px}
.ilist .sq .ic{width:22px;height:22px}
.ilist .hh{gap:4px}
.ilist h5{color:var(--ink)}

/* ---------- Donation Process（步骤轮播） ---------- */
.proc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.proc-swiper{position:relative;margin-top:56px;overflow:hidden}
/* 连接线固定在可视区（不随 swiper-wrapper 平移），故挂在 .proc-swiper 而非 .steps */
.proc-swiper::before{content:"";position:absolute;left:0;right:0;top:26px;height:1px;
  background:var(--line);z-index:0}
.steps{align-items:flex-start}
.step{position:relative;z-index:1;text-align:center;padding:0 12px}
.step-n{display:inline-grid;place-items:center;width:52px;height:52px;margin-bottom:26px;
  border-radius:12px;background:var(--terra);color:var(--n-white);
  font:600 18px/1 var(--sans);box-shadow:0 0 0 8px var(--cream)}
.step h5{color:var(--ink)}
.step .hh{gap:10px;align-items:center}

/* ---------- Donation Type（深色双卡） ---------- */
.dt-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px}
.dt-card{background:var(--n-white);color:var(--body);border-radius:20px;padding:32px}
.dt-card-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.dt-badge{padding:7px 14px;border-radius:var(--pill);background:var(--terra);
  color:var(--n-white);font:500 13px/1 var(--sans)}
.dt-card .hh{margin-top:20px;gap:10px}
.dt-card h5{color:var(--ink)}
.dt-rows{margin-top:24px}
.dt-row{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:baseline;
  padding:14px 0;border-top:1px solid var(--line)}
.dt-row dt{font:600 12px/1.4 var(--sans);letter-spacing:.08em;color:var(--terra)}
.dt-row dd{margin:0;color:var(--ink)}
.dt-foot{max-width:760px;margin:40px auto 0;text-align:center;
  font:400 18px/1.5 var(--sans);color:var(--n-ash)}

/* ---------- Investment & Timeline（深色三列） ---------- */
.inv-grid{display:grid;grid-template-columns:1fr .9fr 1fr;gap:24px;margin-top:56px;align-items:stretch}
.inv-card{display:flex;flex-direction:column;background:var(--n-white);color:var(--body);
  border-radius:20px;padding:32px}
.inv-card>h5{color:var(--ink);margin-bottom:8px}
.inv-rows{margin:8px 0 auto}
.inv-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:13px 0;border-top:1px solid var(--line)}
.inv-row dd{margin:0;text-align:right;color:var(--ink)}
.inv-row.total{border-top:2px solid var(--ink)}
.inv-row.total dt,.inv-row.total dd{color:var(--ink)}
.inv-row.total dd{color:var(--terra)}
.inv-card>.xs{margin-top:20px}
.inv-img img{width:100%;height:100%;min-height:420px;object-fit:cover;border-radius:20px}
.tl{position:relative;list-style:none;display:flex;flex-direction:column;gap:22px;
  margin:20px 0 auto;padding-left:20px}
.tl::before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:1px;background:var(--line)}
.tl li{position:relative}
.tl li::before{content:"";position:absolute;left:-20px;top:6px;width:9px;height:9px;
  border-radius:50%;background:var(--terra)}
.tl b{display:block;font-weight:600;color:var(--ink)}
.inv-card>.xs{margin-top:24px}

/* ---------- Not For Everyone（深色 + 白卡） ---------- */
.nfe-in{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.nfe-txt{display:flex;flex-direction:column;gap:20px}
.nfe-txt h2{color:var(--n-white)}
.nfe-txt .lead{color:var(--n-ash)}
.nfe-txt .base{color:var(--n-smoke)}
.nfe-card{display:flex;flex-direction:column;gap:22px;background:var(--n-white);
  border-radius:20px;padding:36px}
.nfe-card .ey{color:var(--mute)}
.nfe-card .checks{display:flex;flex-direction:column;gap:18px}

/* ---------- CTA 紧凑行动条 ---------- */
.ctabar{background:var(--wine);color:var(--n-white)}
.ctabar-in{display:flex;align-items:center;justify-content:space-between;
  gap:28px 48px;flex-wrap:wrap;padding:48px 0}
.ctabar-txt{flex:1 1 340px;min-width:0;max-width:900px;color:var(--n-white)}
.ctabar-txt>:first-child{margin-top:0}
.ctabar-txt>:last-child{margin-bottom:0}
.ctabar-txt h5{margin:0 0 10px;color:var(--n-white);font-size:24px;line-height:1.25;letter-spacing:-.02em}
.ctabar-txt p{margin:0;font:400 18px/1.55 var(--sans);color:var(--n-ash)}
.ctabar-txt em{font-family:var(--serif);font-style:italic;font-weight:600;letter-spacing:0;color:var(--n-white)}
.ctabar-txt p em{font-size:22px}
.ctabar .btn{flex:none}

/* ---------- 单页模块响应式 ---------- */
@media (max-width:1080px){
  .phero-in{flex-direction:column;align-items:stretch;gap:40px}
  .phero-txt{width:100%}
  .phero-img{height:440px}
  .phero-quote{position:static;width:auto;margin-top:16px;box-shadow:none;border:1px solid var(--line)}
  .wgrid{grid-template-columns:1fr}
  .req-in,.comp-in{grid-template-columns:1fr;gap:32px}
  .req-img img,.comp-img img{height:420px}
  .mot .feats{grid-template-columns:repeat(2,1fr)}
  .elite-top{grid-template-columns:1fr;gap:20px;margin-bottom:40px}
  .elite-in{grid-template-columns:1fr;gap:32px}
  .elite-img img{height:400px}
  .dt-grid,.nfe-in{grid-template-columns:1fr}
  .inv-grid{grid-template-columns:1fr}
  .inv-img img{min-height:0;height:360px}
}

@media (max-width:560px){
  .phero-stats{flex-wrap:wrap;gap:16px}
  .phero-stats li{padding-left:0;border-left:0}
  .mot .feats{grid-template-columns:1fr}
  .dl-row{grid-template-columns:1fr;gap:4px}
  .tier{flex-direction:column;align-items:flex-start;gap:10px}
  .tier b{text-align:left}
  .dt-row{grid-template-columns:1fr;gap:4px}
  .ctabar-in{flex-direction:column;align-items:flex-start;gap:22px;padding:36px 0}
  .ctabar-txt{flex:1 1 auto}
  .ctabar-txt h5{font-size:20px}
  .ctabar-txt p em{font-size:20px}
}

/* ---------- FAQs（手风琴） ---------- */
.faq-in{display:grid;grid-template-columns:400px 1fr;gap:64px;align-items:start}
.faq-l h2{margin:0}
.faq-list{display:flex;flex-direction:column;gap:16px}
.faq{background:var(--n-white);border:1px solid transparent;border-radius:14px;
  box-shadow:0 6px 20px rgba(33,31,32,.05);transition:border-color var(--ease)}
.faq.is-open{border-color:var(--terra)}
.faq h3{margin:0}
.faq-q{display:flex;align-items:center;gap:18px;width:100%;text-align:left;
  padding:22px 26px;color:var(--ink)}
.faq-qt{font:600 18px/1.4 var(--sans);color:var(--ink)}
/* + / × 切换图标：CSS 绘制，展开时整块旋转 45° 使 + 变 ×，并加赤陶圆底 */
.faq-ic{position:relative;width:28px;height:28px;flex:none;border-radius:50%;
  transition:background var(--ease),transform var(--ease)}
.faq-ic::before,.faq-ic::after{content:"";position:absolute;left:50%;top:50%;
  background:var(--ink);border-radius:2px;transition:background var(--ease)}
.faq-ic::before{width:14px;height:2px;transform:translate(-50%,-50%)}
.faq-ic::after{width:2px;height:14px;transform:translate(-50%,-50%)}
.faq.is-open .faq-ic{background:var(--terra);transform:rotate(45deg)}
.faq.is-open .faq-ic::before,.faq.is-open .faq-ic::after{background:var(--n-white)}
/* 折叠动画：grid-template-rows 0fr → 1fr；visibility 让收起内容移出无障碍树 */
.faq-a{display:grid;grid-template-rows:0fr;visibility:hidden;
  transition:grid-template-rows .3s ease,visibility .3s}
.faq.is-open .faq-a{grid-template-rows:1fr;visibility:visible}
.faq-a-in{overflow:hidden}
.faq-a-in p{padding:0 26px 24px 72px;color:var(--body)}

@media (max-width:1080px){
  .faq-in{grid-template-columns:1fr;gap:32px}
}

@media (max-width:560px){
  .faq-q{gap:14px;padding:18px 20px}
  .faq-qt{font-size:16px}
  .faq-a-in p{padding:0 20px 20px 52px}
}

/* ---------- Donor Profiles ---------- */
.dp-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.dp-txt{display:flex;flex-direction:column;gap:24px}
.dp-checks{display:flex;flex-direction:column;gap:16px}
.dp-vis{position:relative;margin-bottom:24px}
.dp-main img{width:100%;height:560px;object-fit:cover;border-radius:24px}
/* 左下叠放的童年照小卡 */
.dp-baby{position:absolute;left:-36px;bottom:-24px;width:236px;padding:10px;
  background:var(--n-white);border-radius:16px;box-shadow:0 16px 40px rgba(33,31,32,.14)}
.dp-baby img{width:100%;height:188px;object-fit:cover;border-radius:8px}
.dp-baby figcaption{margin-top:10px;height:36px;border-radius:8px;background:var(--terra);
  color:var(--n-white);font:600 14px/36px var(--sans);text-align:center}

@media (max-width:1080px){
  .dp-in{grid-template-columns:1fr;gap:40px;align-items:start}
  .dp-main img{height:460px}
  /* 堆叠时把小卡收进主图左下角落，避免负偏移被 body overflow-x 裁切 */
  .dp-vis{margin-bottom:0}
  .dp-baby{left:24px;bottom:24px}
}

@media (max-width:560px){
  .dp-baby{left:16px;bottom:16px;width:180px}
  .dp-baby img{height:140px}
}

/* ---------- Solution（Intended Parents：居中题图 + 左图右要点） ---------- */
.sol-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;margin-top:56px}
.sol-img img{width:100%;height:620px;object-fit:cover;border-radius:24px}
.sol-points{display:flex;flex-direction:column;gap:36px}
.sol-points li{display:flex;flex-direction:column;gap:12px}
.sol-points .ey{font-size:13px}
.sol-points h5{color:var(--ink)}

/* ---------- Connection Levels（三卡：图标/标题/正文） ---------- */
.conn{background:var(--cream)}
.conn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.conn-card{display:flex;flex-direction:column;gap:20px;background:var(--n-white);
  border-radius:20px;padding:32px;box-shadow:0 8px 26px rgba(33,31,32,.05)}
.conn-card .hh{gap:12px}
.conn-card h5{color:var(--ink)}
.conn-foot{max-width:760px;margin:40px auto 0;text-align:center;
  font:400 18px/1.5 var(--sans);color:var(--body)}

/* ---------- Family Paths（2×2 左图右文卡片） ---------- */
.fpath-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px}
.fpath-card{display:grid;grid-template-columns:42% 1fr;background:var(--n-white);
  border-radius:20px;overflow:hidden;box-shadow:0 8px 26px rgba(33,31,32,.05)}
.fpath-card>img{width:100%;height:100%;min-height:250px;object-fit:cover;display:block}
.fpath-bd{display:flex;flex-direction:column;justify-content:center;padding:34px}
.fpath-bd .hh{gap:12px}
.fpath-bd h5{color:var(--ink)}

/* ---------- Matching Models（三方案卡 + 底部双按钮） ---------- */
.mm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px;align-items:start}
.mm-card{display:flex;flex-direction:column;gap:16px;text-align:center;background:var(--n-white);
  border-radius:20px;padding:36px 32px;box-shadow:0 8px 26px rgba(33,31,32,.05)}
.mm-plan{font:600 13px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--terra)}
.mm-card .hh{gap:10px}
.mm-card h5{color:var(--ink)}
.mm-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.mm-chips li{padding:7px 14px;border-radius:var(--pill);background:var(--cream);
  font:500 13px/1.2 var(--sans);color:var(--ink)}
.mm-txt{text-align:left;color:var(--body)}
.mm-div{height:1px;background:var(--line);margin:4px 0}
.mm-flabel{font:600 13px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mute);text-align:left}
.mm-card .checks{display:flex;flex-direction:column;gap:14px;text-align:left}
.mm-cta{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin-top:48px}

@media (max-width:1080px){
  .sol-in{grid-template-columns:1fr;gap:32px}
  .sol-img img{height:440px}
  .conn-grid{grid-template-columns:1fr}
  .fpath-grid{grid-template-columns:1fr}
  .mm-grid{grid-template-columns:1fr}
}

@media (max-width:560px){
  .fpath-card{grid-template-columns:1fr}
  .fpath-card>img{min-height:200px}
  .fpath-bd{padding:26px 22px}
  .mm-card{padding:30px 22px}
}

/* ---------- Timeline Hero（tpl-timeline / Design 流程页） ---------- */
.crumbs{display:flex;align-items:center;gap:10px;color:var(--mute)}
.crumbs a{transition:color var(--ease)}
.crumbs a:hover{color:var(--terra)}
.crumbs .sep{color:var(--n-ash)}
.ptl-hero .hh{gap:18px}
.ptl-hero-head{max-width:820px}
.ptl-lead{font:600 20px/1.4 var(--sans);color:var(--ink)}
.ptl-intro{max-width:760px}
.ptl-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.ptl-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;
  background:var(--n-white);border-radius:16px;padding:26px;box-shadow:0 8px 26px rgba(33,31,32,.05)}
.ptl-card h5{color:var(--ink)}
.ptl-card-stage{font:500 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--terra)}
.ptl-card .base{flex:1}
.ptl-card .btn{margin-top:8px}
.ptl-note{margin-top:20px}

/* ---------- Stage Detail（阶段详解 ×3） ---------- */
.ptl-stage{border-top:1px solid var(--line)}
.ptl-stage-in{display:grid;grid-template-columns:360px 1fr;gap:64px;align-items:start}
.ptl-stage-l{display:flex;flex-direction:column;gap:28px}
.ptl-num{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:14px;
  background:var(--terra);color:var(--n-white);font:600 18px/1 var(--sans)}
.ptl-kicker{font:500 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--terra)}
.ptl-stage-r{display:flex;flex-direction:column;gap:22px}
.ptl-stage-r strong{color:var(--ink);font-weight:600}
.ptl-timeline,.ptl-callout{display:flex;align-items:flex-start;gap:14px;
  background:var(--cream);border-radius:14px;padding:18px 22px;
  font:400 15px/1.55 var(--sans);color:var(--body)}
.ptl-timeline b{color:var(--ink);font-weight:600}
.ptl-timeline .pico,.ptl-callout .pico{width:32px;height:32px}
.ptl-timeline .pico .ic,.ptl-callout .pico .ic{width:16px;height:16px}
.ptl-step{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.ptl-step-label{font:500 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.ptl-step-card{display:flex;flex-direction:column;gap:14px;
  background:var(--n-white);border:1px solid var(--line);border-radius:16px;padding:26px 28px}
.ptl-step-card .hh{gap:12px}
.ptl-step-card h5{color:var(--ink)}

/* ---------- After Cycle（酒红区） ---------- */
.ptl-after-in{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.ptl-after-txt{display:flex;flex-direction:column;gap:18px}
.ptl-after-txt .base{color:var(--n-ash)}
.ptl-after-txt strong{color:var(--n-white);font-weight:600}
.ptl-flows{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;margin-top:48px}
.ptl-flow{background:var(--n-white);border-radius:16px;padding:24px 26px}
.ptl-flow>.strong{color:var(--ink);font-size:15px}
.ptl-chips{display:flex;align-items:stretch;flex-wrap:wrap;gap:10px;margin-top:14px}
.ptl-chips li{display:flex;align-items:center;gap:10px}
.ptl-chip{display:flex;flex-direction:column;gap:5px;min-width:118px;
  background:var(--cream);border-radius:12px;padding:12px 16px}
.ptl-chip em{font:500 11px/1 var(--sans);font-style:normal;letter-spacing:.08em;
  text-transform:uppercase;color:var(--mute)}
.ptl-chip b{color:var(--ink);font-weight:600;font-size:15px}
.ptl-arrow{color:var(--n-stone)}
.ptl-after-note{display:flex;align-items:flex-start;gap:14px;margin-top:24px;
  border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:18px 22px;
  font:400 15px/1.55 var(--sans);color:var(--n-ash)}
.ptl-after-note .pico{width:32px;height:32px;border-color:rgba(255,255,255,.4);color:var(--n-white)}
.ptl-after-note .pico .ic{width:16px;height:16px}

@media (max-width:1080px){
  .ptl-cards{grid-template-columns:1fr}
  .ptl-stage-in{grid-template-columns:1fr;gap:28px}
  .ptl-after-in{grid-template-columns:1fr;gap:24px}
  .ptl-flows{grid-template-columns:1fr}
}

@media (max-width:560px){
  .ptl-lead{font-size:18px}
  .ptl-timeline,.ptl-callout{padding:16px}
  .ptl-step-card{padding:22px 18px}
}

/* ---------- Team Hero（tpl-team / Design/Ovita team.png） ---------- */
.tm-hero .hh{gap:18px}
.tm-hero-head{max-width:820px}

/* ---------- Team Groups（分组 ×N + 成员卡） ---------- */
.tm-group+.tm-group{margin-top:80px}
.tm-group-hd{display:flex;align-items:baseline;justify-content:space-between;gap:24px}
.tm-group-label{font:500 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--terra)}
.tm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.tm-card{display:flex;flex-direction:column;gap:18px;background:var(--n-white);
  border:1px solid var(--line);border-radius:16px;padding:24px}
.tm-card-hd{display:flex;align-items:center;gap:16px}
.tm-card-hd .hh{gap:4px}
.tm-card h5{font-size:18px}
.tm-photo{width:72px;height:72px;flex:none;border-radius:50%;object-fit:cover}
.tm-role{font:400 14px/1.4 var(--sans);color:var(--mute)}
.tm-years{font:500 13px/1.4 var(--sans);color:var(--terra)}
.tm-bio{border-top:1px solid var(--line);padding-top:18px;
  font:400 14px/1.6 var(--sans);color:var(--body)}

/* ---------- Team CTA（酒红左对齐） ---------- */
.tm-cta .hh{max-width:640px}
.tm-cta .lead{max-width:640px}
.tm-cta .row{margin-top:8px}

@media (max-width:1080px){
  .tm-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:860px){
  .tm-grid{grid-template-columns:1fr}
  .tm-group-hd{flex-direction:column;align-items:flex-start;gap:8px}
  .tm-group+.tm-group{margin-top:56px}
}

/* ---------- 双列头图（tpl-compensation / tpl-approach-commitment 共用） ---------- */
.tch-in{display:flex;align-items:center;gap:64px}
.tch-txt{width:560px;flex:none;display:flex;flex-direction:column;gap:24px}
.tch-head{gap:16px}
.tch-vis{flex:1;min-width:0}
.tch-vis img{width:100%;height:460px;object-fit:cover;border-radius:24px}
.strong-lead{font:600 20px/1.4 var(--sans);color:var(--ink)}
.strong-lead .terra{color:var(--terra)}

/* ---------- Compensation / Approach 分段（左标题 + 右正文，复用 .ptl-stage-in 网格） ---------- */
.cmp-band{border-top:1px solid var(--line)}
.cmp-band.cream{border-top:0}
.band-h2{font-size:32px;line-height:1.2}
.cmp-band-r{display:flex;flex-direction:column;gap:18px}
.cmp-band-r strong,.ap-band strong{color:var(--ink);font-weight:600}
.cmp-band.cream .ptl-callout{background:var(--n-white)}
.cmp-ic{color:var(--terra)}
.cmp-ic .ic{width:24px;height:24px}
.cmp-checks{display:flex;flex-direction:column;gap:14px}
.cmp-exp{display:flex;align-items:flex-start;gap:36px}
.cmp-exp-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:18px}
.cmp-exp-img{width:320px;flex:none;height:380px;object-fit:cover;border-radius:20px}
.cmp-link{display:inline-flex;align-items:center;gap:8px;font:600 15px/1 var(--sans);color:var(--terra);transition:gap var(--ease)}
.cmp-link .ic{width:18px;height:18px}
.cmp-link:hover{gap:12px}

/* ---------- Compensation 补偿参考表 ---------- */
.cmp-tbl-wrap{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--n-white)}
.cmp-tbl{width:100%;border-collapse:collapse}
.cmp-tbl th{background:var(--wine);color:var(--n-white);text-align:left;
  font:600 14px/1.4 var(--sans);padding:16px 22px}
.cmp-tbl td{padding:20px 22px;border-top:1px solid var(--line);vertical-align:top;
  font:400 15px/1.6 var(--sans);color:var(--body)}
.cmp-tbl td.lbl{width:34%;font-weight:600;color:var(--ink)}
.cmp-tbl tbody tr:nth-child(odd){background:var(--brand-50)}
.cmp-tbl td strong{color:var(--terra);font-weight:600}

/* ---------- Approach 分隔线清单 / 正文配图 / 酒红文字链接 ---------- */
.ap-std{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.ap-std li{padding:20px 0;border-bottom:1px solid var(--line);
  font:400 15px/1.6 var(--sans);color:var(--body)}
.ap-plain{display:contents}
.ap-media{display:flex;align-items:flex-start;gap:36px}
.ap-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:18px}
.ap-img{width:340px;flex:none;height:380px;object-fit:cover;border-radius:20px}
.wine-link{margin-top:20px}
.wine-link a{display:inline-flex;align-items:center;gap:9px;font:600 15px/1 var(--sans);color:var(--n-white);transition:color var(--ease)}
.wine-link a .ic{width:18px;height:18px}
.wine-link a:hover{color:var(--n-ash)}

@media (max-width:1080px){
  .tch-in{flex-direction:column;align-items:stretch;gap:40px}
  .tch-txt{width:100%}
  .tch-vis img{height:360px}
  .band-h2{font-size:28px}
  .cmp-exp,.ap-media{flex-direction:column}
  .cmp-exp-img,.ap-img{width:100%;height:320px}
}

@media (max-width:560px){
  .strong-lead{font-size:18px}
  .cmp-tbl th,.cmp-tbl td{padding:14px 16px}
  .cmp-tbl td.lbl{width:auto}
}

/* ==========================================================================
   单页（.page-egg-donor）非标题元素的精确校准 —— 依据 Figma「Become an Egg Donor」实测
   标题已统一由 Typography.md 元素规则驱动，此处仅保留数值/标签/正文等角色化样式
   ========================================================================== */
/* Hero 关键数据：数字 22/400 标题字距，标签 Tiny 12 正文字距 0 */
.page-egg-donor .phero-stats b{font:400 22px/1.2 var(--sans);letter-spacing:-.02em}
.page-egg-donor .phero-stats span{font-size:12px;line-height:1.5;letter-spacing:0}
/* Hero 引用卡：署名 16/600 */
.page-egg-donor .phero-quote strong{font-weight:600}
/* Requirements：标准项标签 14/500 大写·Tagline 字距 0.1em；取值 Small 14/400 字距 0 */
.page-egg-donor .dl dt{font:500 14px/1.4 var(--sans);letter-spacing:.1em;color:var(--mute)}
.page-egg-donor .dl dd{font-size:14px;line-height:1.5;letter-spacing:0}
/* Compensation：档位标签 14，金额数字 22/400 */
.page-egg-donor .tier .ey{font-size:14px}
.page-egg-donor .tier b{font-weight:400}
/* FAQs：问题 16/600，正文字距 0 */
.page-egg-donor .faq-qt{font:600 16px/1.5 var(--sans);letter-spacing:0}

/* ==========================================================================
   文章详情（single.php / .post-single）—— 对应 Design/Ovita article — Egg Donation Contracts.png
   头部/底部按设计稿还原；正文 .art-body 仅做经典编辑器元素的排版兜底
   ========================================================================== */
/* 面包屑条（米白底，Small 14 字距 0，末项当前页置灰） */
.art-crumb{background:var(--cream)}
.art-crumb>div{display:flex;align-items:center;gap:8px;padding:14px 0;
  font:400 14px/1.5 var(--sans);color:var(--mute)}
.art-crumb a{color:var(--body);transition:color var(--ease)}
.art-crumb a:hover{color:var(--terra)}

.post-single article{padding:64px 0 96px}

/* 题头：分类标签（accent-50 胶囊，复用 .badge 观感）+ 装饰衬线大标题 + 导语 */
.art-head{width:min(100%,880px);margin-inline:auto;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.art-tag{display:inline-flex;height:30px;padding:0 16px;border-radius:var(--pill);
  background:var(--accent-50);font:500 14px/30px var(--sans);letter-spacing:0;color:var(--ink)}
.art-tag a{display:inline-flex;align-items:center;gap:6px;transition:color var(--ease)}
.art-tag a:hover{color:var(--terra)}
.art-title{font-family:var(--serif);font-weight:500;font-size:48px;line-height:1.2;letter-spacing:0}
.art-lead{font:400 16px/1.5 var(--sans);color:var(--body);max-width:720px}

/* 正文：直接输出 the_content()，窄栏居中，仅兜底排版节奏 */
.art-body{width:min(100%,800px);margin:64px auto 0;display:flex;flex-direction:column;gap:20px;
  font:400 16px/1.7 var(--sans);color:var(--body)}
.art-body h2,.art-body h3,.art-body h4{margin-top:28px}
.art-body h3{font-size:22px}
.art-body h4{font-size:18px}
.art-body strong{color:var(--ink);font-weight:600}
.art-body a{color:var(--terra);text-decoration:underline;text-underline-offset:3px;transition:color var(--ease)}
.art-body a:hover{color:var(--terra-d)}
.art-body ul{padding-left:22px}
.art-body ul li{list-style:disc;margin:6px 0;color:var(--ink)}
.art-body ul li::marker{color:var(--terra)}
.art-body ol{margin:0;padding-left:24px;color:var(--ink)}
.art-body ol li{margin:10px 0}
.art-body ol li::marker{font-weight:600;color:var(--terra)}
.art-body img{border-radius:16px}
/* 引用块：设计稿重点提示条样式（赤陶左线 + 米白底） */
.art-body blockquote{margin:8px 0;padding:20px 26px;background:var(--cream);
  border-left:3px solid var(--terra);border-radius:0 14px 14px 0;
  font:400 15px/1.6 var(--sans);color:var(--body)}
.art-body blockquote p+p{margin-top:12px}
.art-body blockquote strong{color:var(--ink)}
.art-body .wp-block-separator,.art-body hr{border:0;border-top:1px solid var(--line);margin:12px 0}

/* 底部：左 Contact Us，右返回分类文字链（复用 .more 行为） */
.art-foot{width:min(100%,800px);margin:56px auto 0;display:flex;align-items:center;
  justify-content:space-between;gap:20px;flex-wrap:wrap}
.art-back{display:inline-flex;align-items:center;gap:9px;font:600 15px/1 var(--sans);
  color:var(--terra);transition:gap var(--ease)}
.art-back .ic{width:17px;height:17px}
.art-back:hover{gap:13px;color:var(--terra-d)}

@media (max-width:1080px){
  .art-title{font-size:36px}
  .post-single article{padding:48px 0 64px}
  .art-body{margin-top:44px}
}

@media (max-width:560px){
  .art-title{font-size:30px}
  .art-foot .btn{width:auto}
}

/* ==========================================================================
   博客归档（archive.php / .blog-archive）—— 对应 Design/Ovita blog — For Sperm Donors.png
   面包屑复用 .art-crumb；头部米白，正文白底
   ========================================================================== */
.arch-hero{background:var(--cream);padding:44px 0 56px}
.arch-hero .ey{margin-bottom:18px}
.arch-title{font-family:var(--serif);font-weight:500;font-size:52px;line-height:1.15;letter-spacing:0;color:var(--ink)}
.arch-lead{margin-top:18px;max-width:640px;font:400 18px/1.5 var(--sans);color:var(--body)}

.arch-body{padding:48px 0 96px}

/* 分类筛选胶囊 */
.arch-tabs{display:flex;flex-wrap:wrap;gap:12px}
.arch-tabs .tab{display:inline-flex;align-items:center;height:40px;padding:0 20px;border-radius:var(--pill);
  border:1px solid var(--line);background:var(--n-white);font:500 14px/1 var(--sans);letter-spacing:0;
  color:var(--ink);transition:var(--ease)}
.arch-tabs .tab:hover{border-color:var(--ink)}
.arch-tabs .tab.on{background:var(--terra);border-color:var(--terra);color:var(--n-white)}

.arch-h{margin:44px 0 28px;font-size:32px;line-height:1.2}

/* 文章网格：3 列，卡片 = 图（带分类角标）+ 标题 + Read article */
.arch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 24px}
.arch-card .post-media{display:block}
.arch-card .post-media img{height:230px}
.arch-card-t{margin-top:20px;font-size:22px;line-height:1.25;font-weight:500}
.arch-card-t a{color:var(--ink);transition:color var(--ease)}
.arch-card-t a:hover{color:var(--terra)}
.arch-read{display:inline-flex;align-items:center;gap:9px;margin-top:16px;
  font:600 15px/1 var(--sans);color:var(--terra);transition:gap var(--ease)}
.arch-read .ic{width:17px;height:17px}
.arch-read:hover{gap:13px;color:var(--terra-d)}

/* 底部：返回链 + 分页（上边线分隔） */
.arch-foot{margin-top:56px;padding-top:28px;border-top:1px solid var(--line)}
.arch-back{display:inline-flex;align-items:center;gap:10px;font:600 15px/1 var(--sans);
  color:var(--terra);transition:gap var(--ease)}
.arch-back .ic{width:18px;height:18px;transform:rotate(0)}
.arch-back:hover{gap:14px;color:var(--terra-d)}
.arch-pager{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:32px}
.arch-page-no{font:400 14px/1 var(--sans);color:var(--mute)}
.arch-pages{display:flex;align-items:center;gap:8px}
.arch-pages .page-numbers{min-width:40px;height:40px;padding:0 14px;display:inline-flex;align-items:center;
  justify-content:center;border:1px solid var(--line);border-radius:var(--pill);
  font:500 14px/1 var(--sans);letter-spacing:0;color:var(--ink);transition:var(--ease)}
.arch-pages a.page-numbers:hover{border-color:var(--ink)}
.arch-pages .current{background:var(--terra);border-color:var(--terra);color:var(--n-white)}
.arch-pages .dots{border:0;min-width:auto;padding:0;color:var(--mute)}

.arch-empty{color:var(--mute);font:400 16px/1.5 var(--sans)}

@media (max-width:1080px){
  .arch-title{font-size:40px}
  .arch-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:560px){
  .arch-hero{padding:32px 0 40px}
  .arch-title{font-size:32px}
  .arch-lead{font-size:16px}
  .arch-h{font-size:26px}
  .arch-grid{grid-template-columns:1fr;gap:36px}
  .arch-pager{justify-content:flex-start}
}

/* ==========================================================================
   博客分类总览（tpl-blog.php / .blog-cats）—— 对应 Design/Ovita blog — Categories.png
   面包屑复用 .art-crumb；筛选胶囊/卡片网格复用 .arch-tabs/.arch-grid/.arch-card
   ========================================================================== */
/* 头图（米白，与面包屑连成一块）：左文右图 */
.bl-hero{background:var(--cream);padding:24px 0 64px}
.bl-hero-in{display:flex;align-items:center;gap:64px}
.bl-hero-txt{width:600px;flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.bl-hero-txt .ey{margin-bottom:4px}
.bl-title{font-family:var(--serif);font-weight:500;font-size:56px;line-height:1.12;letter-spacing:0;color:var(--ink)}
.bl-para{font:400 16px/1.6 var(--sans);color:var(--body)}
.bl-back{display:inline-flex;align-items:center;gap:9px;font:600 15px/1 var(--sans);color:var(--terra);transition:gap var(--ease)}
.bl-back .ic{width:17px;height:17px}
.bl-back:hover{gap:13px;color:var(--terra-d)}
.bl-hero-vis{flex:1;min-width:0}
.bl-hero-vis img{width:100%;height:400px;object-fit:cover;border-radius:24px}

.bl-body{background:var(--white);padding:56px 0 96px}

/* 引子：大号标题（无衬底，em 转衬线斜体） */
.bl-intro{margin:48px 0 8px;display:flex;flex-direction:column;gap:14px}
.bl-intro-title{font-size:44px;line-height:1.15}
.bl-intro-title em{font-family:var(--serif);font-style:italic;font-weight:500}

/* 分类区块 ×N：眉标 + 衬线小标题 + 描述（左）/ 查看全部（右）+ 3 卡网格；奇数块米白圆角面板 */
.bl-cat{margin-top:64px}
.bl-cat-inner{display:flex;flex-direction:column;gap:36px}
.bl-cat.fill .bl-cat-inner{background:var(--cream);border-radius:28px;padding:56px 48px}
.bl-cat-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.bl-cat-hd .hh{gap:12px}
.bl-cat-title{font-family:var(--serif);font-weight:500;font-size:40px;line-height:1.15;letter-spacing:0;color:var(--ink)}
.bl-cat-title em{font-style:italic}
.bl-cat-desc{font:400 16px/1.5 var(--sans);color:var(--body);max-width:640px}
.bl-cat-link{display:inline-flex;align-items:center;gap:9px;font:600 15px/1 var(--sans);color:var(--terra);transition:gap var(--ease)}
.bl-cat-link .ic{width:17px;height:17px}
.bl-cat-link:hover{gap:13px;color:var(--terra-d)}

/* CTA（酒红，左对齐）复用 .wine/.btn 体系 */
.bl-cta .hh{gap:16px}
.bl-cta .lead{max-width:600px}

@media (max-width:1080px){
  .bl-hero-in{flex-direction:column;align-items:stretch;gap:40px}
  .bl-hero-txt{width:100%}
  .bl-title{font-size:44px}
  .bl-intro-title{font-size:34px}
  .bl-cat-title{font-size:32px}
}

@media (max-width:560px){
  .bl-hero{padding:16px 0 40px}
  .bl-title{font-size:36px}
  .bl-hero-vis img{height:280px}
  .bl-intro-title{font-size:28px}
  .bl-cat-title{font-size:26px}
  .bl-cat.fill .bl-cat-inner{padding:32px 22px}
  .bl-cat-hd{align-items:flex-start;flex-direction:column;gap:14px}
}

/* ==========================================================================
   联系页（tpl-contact.php / .page-contact）—— 对应 Design/Ovita — Contact.png
   面包屑复用 .art-crumb；表单由第三方 JS 嵌入，主题不定义表单控件样式
   ========================================================================== */
/* 头图（米白）：左标题导语 / 右联系方式 */
.ct-hero{background:var(--cream)}
.ct-hero-in{display:flex;align-items:flex-start;gap:100px}
.ct-hero-txt{width:640px;max-width:56%;flex:none}
.ct-connect{flex:1;min-width:0;padding-top:64px}
.ct-connect h5{margin-bottom:10px}
.ct-list li{display:flex;align-items:flex-start;gap:18px;padding:24px 0;border-bottom:1px solid var(--line)}
.ct-list li:first-child{padding-top:0}
.ct-sq{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:14px;
  background:var(--n-white);border:1px solid var(--line);color:var(--ink);
  box-shadow:0 4px 14px rgba(33,31,32,.06)}
.ct-sq .ic{width:20px;height:20px}
.ct-row-txt{display:flex;flex-direction:column;gap:6px}
.ct-row-txt strong{color:var(--ink);font-weight:600}
.ct-link{align-self:flex-start;color:var(--terra);text-decoration:underline;
  text-underline-offset:3px;transition:color var(--ease)}
.ct-link:hover{color:var(--terra-d)}
.ct-site{margin-top:22px}

/* 正文双栏：左说明+配图+酒红提示 / 右表单区 */
.ct-body-in{display:grid;grid-template-columns:400px 1fr;gap:80px;align-items:start}
.ct-left{display:flex;flex-direction:column;gap:24px}
.ct-left-title{font-size:36px;line-height:1.2}
.ct-img{width:100%;border-radius:20px}
.ct-note{color:var(--wine)}
.ct-right{display:flex;flex-direction:column;gap:14px}
.ct-form{margin-top:14px}

@media (max-width:1080px){
  .ct-hero-in{flex-direction:column;gap:48px}
  .ct-hero-txt{width:100%;max-width:none}
  .ct-connect{padding-top:0;width:100%;max-width:520px}
  .ct-body-in{grid-template-columns:1fr;gap:56px}
}

@media (max-width:560px){
  .ct-left-title{font-size:28px}
  .ct-list li{gap:14px}
}



