/* ==========================================================================
   BUILDING CHLOE — START + GROWTH BLUEPRINT
   --------------------------------------------------------------------------
   这两页负责 ACTION，不负责展示技术。
   没有 canvas、没有 BC Line、没有粒子、没有钉住段 —— 只有 bc-reveal 和
   必要的交互状态（L-018 / BATCH 09 §17）。
   ========================================================================== */

/* ══ /start/ —— 一道门，不是落地页 ═════════════════════════════════════
   目标是「大约一屏」，不是数学上强制 100vh 无滚动：
   可读、好按、清楚 > 绝对不滚动（§12）。 */
.st{min-height:100svh;display:flex;align-items:center;
  padding-block:clamp(96px,13vh,150px) clamp(56px,8vh,96px)}
.st__in{width:100%}
.st__h{margin:var(--s-4) 0 0;max-width:min(9.6em,100%);
  font-size:clamp(30px,3.8vw,52px)}
/* 中文标题不用 balance —— 会从词中间断开；中文靠 em 限宽 */
.bc-zh .st__h{max-width:min(11em,100%);text-wrap:normal}
.st__lede{margin-top:var(--s-4);max-width:min(42ch,100%)}
.st__paths{list-style:none;margin:var(--s-7) 0 0;padding:0;display:grid;gap:var(--s-4)}
.st__paths a{display:grid;grid-template-columns:minmax(0,44px) minmax(0,1fr) auto;
  gap:var(--s-4) var(--s-5);align-items:center;
  border:1px solid var(--line-2);border-radius:var(--r-card);
  padding:var(--s-5) var(--s-6);min-height:96px;
  transition:border-color var(--d-base) var(--e-soft),background var(--d-base) var(--e-soft)}
.st__paths a:hover,.st__paths a:focus-visible{border-color:rgba(109,184,255,.5);
  background:var(--accent-wash)}
.st__k{font:400 13px/1 var(--f-mono);letter-spacing:.18em;color:var(--accent-soft)}
/* 目的地写在下面一行，不是接在主句后面 */
.st__paths a > span:nth-child(2){display:grid;gap:4px}
.st__t{display:block;margin:0;font:300 clamp(16px,1.7vw,21px)/1.5 var(--f-body);color:var(--t-hi)}
.st__d{display:block;margin:0;font:400 11px/1.5 var(--f-mono);letter-spacing:.1em;color:var(--t-2)}
.st__paths .bc-ico{color:var(--t-3)}
.st__paths a:hover .bc-ico{color:var(--accent-soft)}
.st__note{margin:var(--s-6) 0 0;max-width:52ch}

/* ══ /growth-blueprint/ ════════════════════════════════════════════════ */
.bp-hero{position:relative;min-height:74svh;display:flex;align-items:center;
  padding-block:clamp(96px,12vh,150px) clamp(64px,8vh,100px)}
.bp-hero__in{width:100%}
.bp-hero__h1{margin:var(--s-5) 0 0;max-width:min(15ch,100%);font-size:clamp(34px,4.4vw,64px)}
.bp-hero__h1 .clipline--sm > span{display:block;font-size:.46em;letter-spacing:.06em;
  line-height:1.1;color:var(--t-1)}
.bp-hero__h1 .clipline--lg > span{display:block;letter-spacing:-.005em}
.clipline{display:block;overflow:hidden}
.bp-hero__lede{margin-top:var(--s-6);max-width:min(46ch,100%)}
.bp-hero__price{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px;margin-top:var(--s-6)}
.bp-hero__p{font:400 clamp(30px,3.4vw,46px)/1 var(--f-display);letter-spacing:.01em;
  color:var(--t-hi)}
.bp-hero__pk{font:400 11px/1.5 var(--f-mono);letter-spacing:.14em;color:var(--t-2)}
.bp-hero__cta{margin-top:var(--s-7);display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center}

.bc-blueprint .sec-head .t-h1{font-size:clamp(26px,3.2vw,46px);max-width:20ch}
.bc-blueprint.bc-zh .sec-head .t-h1{font-size:clamp(24px,2.9vw,40px);max-width:17em}
.bc-blueprint .bc-sec{padding-block:clamp(72px,9vh,120px)}

/* ── 你会拿到什么：三个大组，不是七张卡 ───────────────────────────── */
.bp-del{list-style:none;margin:var(--s-7) 0 0;padding:0;display:grid;gap:1px;
  grid-template-columns:repeat(3,1fr);background:var(--line-3);border:1px solid var(--line-3)}
.bp-del > li{background:var(--ground);padding:var(--s-6);display:grid;gap:var(--s-4);
  align-content:start}
.bp-del__n{font:400 11px/1 var(--f-mono);letter-spacing:.2em;color:var(--accent-soft)}
.bp-del h3{margin:0;font:400 clamp(19px,2vw,27px)/1.12 var(--f-display);
  text-transform:uppercase;letter-spacing:.03em;color:var(--t-hi)}
.bp-del ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.bp-del li li{font:300 14px/1.6 var(--f-body);color:var(--t-2);
  padding-left:15px;position:relative}
.bp-del li li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:1px;
  background:var(--accent-soft)}

/* ── 怎么进行 ─────────────────────────────────────────────────────── */
.bp-steps{list-style:none;margin:var(--s-7) 0 0;padding:0;display:grid;gap:var(--s-5)}
.bp-steps li{display:grid;grid-template-columns:minmax(0,52px) minmax(0,1fr);
  gap:var(--s-5);align-items:baseline}
.bp-steps b{font:400 12px/1.6 var(--f-mono);letter-spacing:.18em;color:var(--accent-soft);
  font-weight:400}
.bp-steps span{font:300 15px/1.75 var(--f-body);color:var(--t-1)}

/* ── 适合 / 不适合 ────────────────────────────────────────────────── */
.bp-fit{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-7);margin-top:var(--s-7)}
.bp-fit ul{list-style:none;margin:var(--s-4) 0 0;padding:0;display:grid;gap:9px}
.bp-fit li{font:300 14.5px/1.6 var(--f-body);color:var(--t-2);
  padding-left:16px;position:relative}
.bp-fit li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:1px;
  background:var(--line-1)}
.bp-fit > div:first-child li::before{background:var(--accent-soft)}
.bp-fit > div:first-child li{color:var(--t-1)}

/* ══ 表单 —— 简单 HTML，没有 Form Engine（§14）══════════════════════ */
.bp-form{margin-top:var(--s-7);max-width:760px}
/* fieldset 自带边框和 legend 缺口，全部清掉 */
.bp-f{margin-bottom:var(--s-7);border:0;padding:0;min-width:0}
legend.bp-f__q{padding:0;width:100%}
.bp-f__q{display:block;margin:0 0 var(--s-3)}
.bp-f__q b{display:block;font:400 17px/1.4 var(--f-ui);color:var(--t-hi);font-weight:400}
.bp-f__q i{display:block;margin-top:5px;font:400 11px/1.5 var(--f-mono);letter-spacing:.1em;
  color:var(--t-2);font-style:normal}
.bp-in{width:100%;background:var(--surface);border:1px solid var(--line-2);
  border-radius:var(--r-xs);padding:14px 16px;min-height:52px;color:var(--t-hi);
  font:300 15px/1.5 var(--f-body);
  transition:border-color var(--d-base) var(--e-soft)}
.bp-in:focus{outline:none;border-color:var(--accent-soft);box-shadow:var(--glow-sm)}
.bp-in::placeholder{color:var(--t-3)}
textarea.bp-in{min-height:110px;resize:vertical}
.bp-two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4)}

/* 大块可选项 —— 手机上不用键盘就能填完（§13）*/
.bp-opts{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0}
.bp-opts label{position:relative;display:inline-flex;align-items:center;min-height:48px;
  border:1px solid var(--line-2);border-radius:var(--r-pill);padding:12px 17px;
  font:400 13px/1 var(--f-ui);color:var(--t-2);cursor:pointer;
  transition:border-color var(--d-base) var(--e-soft),color var(--d-base) var(--e-soft),
             background var(--d-base) var(--e-soft)}
.bp-opts input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;
  margin:0;cursor:pointer}
.bp-opts label:hover{border-color:var(--line-1);color:var(--t-1)}
.bp-opts input:checked + span{color:var(--ice)}
.bp-opts label:has(input:checked){border-color:rgba(109,184,255,.55);
  background:var(--accent-wash);color:var(--ice)}
.bp-opts label:has(input:focus-visible){outline:2px solid var(--accent-soft);outline-offset:2px}

/* 第 5 题：五句老板处境，大块单选 */
.bp-sit{display:grid;gap:10px;margin:0;padding:0;border:0}
.bp-sit label{position:relative;display:grid;grid-template-columns:auto 1fr;gap:var(--s-4);
  align-items:start;border:1px solid var(--line-2);border-radius:var(--r-card);
  padding:var(--s-5);cursor:pointer;min-height:64px;
  transition:border-color var(--d-base) var(--e-soft),background var(--d-base) var(--e-soft)}
.bp-sit input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;margin:0;cursor:pointer}
.bp-sit label:has(input:checked){border-color:rgba(109,184,255,.55);background:var(--accent-wash)}
.bp-sit label:has(input:focus-visible){outline:2px solid var(--accent-soft);outline-offset:2px}
.bp-sit__k{font:400 11px/1.6 var(--f-mono);letter-spacing:.16em;color:var(--t-2)}
.bp-sit label:has(input:checked) .bp-sit__k{color:var(--accent-soft)}
.bp-sit__t{font:300 14.5px/1.65 var(--f-body);color:var(--t-1)}

.bp-err{margin:10px 0 0;font:400 12.5px/1.5 var(--f-body);color:var(--ice)}
.bp-err:empty{display:none}
.bp-actions{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center;
  padding-top:var(--s-5);border-top:1px solid var(--line-2)}
.bp-actions .t-sm{max-width:40ch}

/* ── 摘要态 —— 「已整理好」，不是「已提交」（§04）─────────────────── */
.bp-sum{margin-top:var(--s-7);border:1px solid rgba(109,184,255,.34);
  border-radius:var(--r-card);padding:var(--s-7);background:rgba(18,22,29,.55);
  max-width:760px}
.bp-sum[hidden]{display:none}
.bp-sum__h{margin:0 0 var(--s-3);font:400 clamp(20px,2.2vw,30px)/1.2 var(--f-display);
  text-transform:uppercase;letter-spacing:.02em;color:var(--t-hi)}
.bp-sum__lede{margin:0 0 var(--s-6);max-width:44ch;font:300 15px/1.75 var(--f-body);color:var(--t-1)}
.bp-sum__rows{margin:0 0 var(--s-6);display:grid;gap:9px}
.bp-sum__rows > div{display:grid;grid-template-columns:minmax(110px,30%) 1fr;gap:14px;
  padding-bottom:9px;border-bottom:1px solid var(--line-3)}
.bp-sum__rows dt{font:500 10px/1.6 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;
  color:var(--t-2)}
.bp-sum__rows dd{margin:0;font:300 14px/1.6 var(--f-body);color:var(--t-1)}
.bp-sum__next{list-style:none;margin:0 0 var(--s-6);padding:0;display:grid;gap:8px}
.bp-sum__next li{font:300 13.5px/1.6 var(--f-body);color:var(--t-2);
  padding-left:22px;position:relative;counter-increment:n}
.bp-sum__next{counter-reset:n}
.bp-sum__next li::before{content:counter(n);position:absolute;left:0;top:0;
  font:400 11px/1.6 var(--f-mono);color:var(--accent-soft)}
.bp-sum__act{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center}

/* ── FAQ ──────────────────────────────────────────────────────────── */
.bp-faq details{border-bottom:1px solid var(--line-3)}
.bp-faq summary{cursor:pointer;list-style:none;padding:var(--s-5) 0;min-height:44px;
  font:400 16px/1.45 var(--f-ui);color:var(--t-hi);display:flex;gap:var(--s-4);align-items:baseline;
  transition:color var(--d-base) var(--e-soft)}
.bp-faq summary::-webkit-details-marker{display:none}
.bp-faq summary::after{content:"+";margin-left:auto;color:var(--accent-soft);
  font:400 18px/1 var(--f-mono)}
.bp-faq details[open] summary::after{content:"–"}
.bp-faq summary:hover{color:var(--ice)}
.bp-faq details p{margin:0 0 var(--s-5);max-width:74ch;
  font:300 14.5px/1.75 var(--f-body);color:var(--t-2)}

/* ── FINAL CTA ────────────────────────────────────────────────────── */
.bp-fin{position:relative;padding-block:var(--s-sec);background:#06070B;text-align:center}
.bp-fin__h{margin:var(--s-5) auto var(--s-5);max-width:18ch;font-size:clamp(30px,4vw,56px)}
.bp-fin .t-lede{margin-inline:auto;max-width:44ch}
.bp-fin__cta{margin-top:var(--s-7);display:flex;flex-wrap:wrap;gap:var(--s-4);
  align-items:center;justify-content:center}

/* ══════════════════════════════════════════════════════════════════════
   响应式 —— 390px 第一等级验收。一列，不做多列，不缩小桌面表单。
   ══════════════════════════════════════════════════════════════════════ */
/* 五句处境的代号宽度不一，句子左边缘会参差 —— 桌面上给个固定列宽 */
@media (min-width:901px){ .bp-sit__k{display:block;min-width:94px} }

@media (max-width:1080px){
  .bp-del{grid-template-columns:1fr}
  .bp-fit{grid-template-columns:1fr;gap:var(--s-6)}
}
@media (max-width:900px){
  .st{min-height:auto;padding-block:clamp(96px,13vh,132px) clamp(40px,6vh,64px)}
  .st__h{max-width:none}
  .st__paths a{grid-template-columns:minmax(0,38px) minmax(0,1fr) auto;
    padding:var(--s-5);min-height:104px}
  .bp-hero{min-height:66svh;padding-block:clamp(108px,14vh,160px) clamp(48px,7vh,80px)}
  .bp-hero__h1{max-width:none}
  .bp-two{grid-template-columns:1fr}
  .bp-steps li{grid-template-columns:1fr;gap:4px}
  .bp-sum{padding:var(--s-6)}
  .bp-sum__rows > div{grid-template-columns:1fr;gap:4px}
  .bp-sum__lede{max-width:none}
}
@media (max-width:430px){
  .st__paths a{gap:var(--s-3) var(--s-4);grid-template-columns:minmax(0,26px) minmax(0,1fr) auto;
    padding:var(--s-5) var(--s-5) var(--s-5) var(--s-4)}
  /* 中文一句话不要掉一个字到第二行 */
  .bc-zh .st__t{font-size:15.5px}
  .bp-opts label{padding:11px 14px;font-size:12.5px}
}

/* ══════════════════════════════════════════════════════════════════════
   reduced-motion —— 这两页本来就几乎没有动效
   ══════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  .clipline > span{transform:none!important}
}

/* 中文 destination 标签：mono 的 .1em 在 CJK 上太散，收一点 */
.bc-zh .st__d{letter-spacing:.06em}

/* 2 分钟快检这一段只有 label 没有 h2，别留一大截空 */
.bp-check .bp-fit{margin-top:var(--s-4)}

/* 无 JS 兜底 —— 默认不显示，只有 <noscript> 打开它 */
.bp-nojs{display:none;margin-top:var(--s-7);max-width:60ch;border:1px solid var(--line-2);
  border-radius:var(--r-card);padding:var(--s-6)}
.bp-nojs > p{margin:0 0 var(--s-5);font:300 15px/1.75 var(--f-body);color:var(--t-1)}
.bp-nojs__q{margin:0 0 var(--s-6);padding-left:1.4em;display:grid;gap:8px}
.bp-nojs__q li{font:300 14.5px/1.6 var(--f-body);color:var(--t-2)}

/* 中文孤字行：最后一行只剩一两个字，看起来像掉下去的。
   text-wrap:pretty 专门管这个 —— 只给中文的正文块用，标题不动。 */
.bc-zh .bp-hero__lede,.bc-zh .bp-del li li,.bc-zh .bp-fit li,
.bc-zh .bp-steps span,.bc-zh .bp-sit__t,.bc-zh .bp-faq summary,
.bc-zh .bp-faq details p,.bc-zh .bp-sum__lede,.bc-zh .bp-sum__next li,
.bc-zh .bp-nojs > p,.bc-zh .bp-nojs__q li,
.bc-zh .st__t,.bc-zh .st__lede,.bc-zh .st__note{text-wrap:pretty}
