/* ==========================================================================
   GABRIELIA ADS — Blocks: commitments / timeline / accordion / tables / forms
   ========================================================================== */

/* ---------- 编号承诺列表 ---------- */
.commit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1px,.2vw,2px);background:var(--line);border:1px solid var(--line)}
.commit__i{background:var(--ink);padding:clamp(24px,3vw,42px);position:relative;overflow:hidden;transition:background .5s var(--ease)}
.commit__i:hover{background:var(--ink-3)}
.commit__n{font-family:var(--f-mono);font-size:clamp(1.6rem,3vw,2.6rem);font-weight:500;line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(201,162,74,.55);margin-bottom:clamp(14px,1.8vw,22px)}
.commit__i h3{margin-bottom:10px}
.commit__i p{font-size:14.5px;color:var(--bone-2);line-height:1.6}
@media(max-width:1000px){.commit{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.commit{grid-template-columns:minmax(0,1fr)}}

/* ---------- 时间轴 / 步骤 ---------- */
.steps{position:relative;display:flex;flex-direction:column;gap:0}
.steps::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line)}
.step{position:relative;display:grid;grid-template-columns:clamp(56px,7vw,110px) minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(16px,2.4vw,40px);padding:clamp(20px,2.6vw,38px) 0 clamp(20px,2.6vw,38px) clamp(18px,2vw,34px);
  border-bottom:1px solid var(--line);transition:background .5s var(--ease)}
.step:last-child{border-bottom:0}
.step:hover{background:rgba(201,162,74,.035)}
.step::before{content:"";position:absolute;left:-3px;top:clamp(26px,3vw,46px);width:7px;height:7px;
  background:var(--ink);border:1px solid var(--gold);transform:rotate(45deg);transition:background .4s var(--ease)}
.step:hover::before{background:var(--gold)}
.step__n{font-family:var(--f-mono);font-size:13px;letter-spacing:.1em;color:var(--gold);padding-top:.25em}
.step__n b{display:block;font-family:var(--f-display);font-size:11px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-top:7px}
html[lang="zh"] .step__n b{letter-spacing:.04em;text-transform:none;font-size:12px}
.step__t h3{font-size:clamp(1.05rem,1.5vw,1.32rem);margin-bottom:8px}
.step__t p{font-size:14px;color:var(--muted);line-height:1.6}
.step__d{font-size:14.5px;color:var(--bone-2);line-height:1.66}
.step__d strong{color:var(--bone);font-weight:600}
@media(max-width:900px){
  .step{grid-template-columns:minmax(0,1fr);gap:10px}
  .step__t p{margin-bottom:2px}
}

/* ---------- 数据要点 ---------- */
.datapts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1px,.2vw,2px);
  background:var(--line);border:1px solid var(--line)}
.datapt{background:var(--ink-2);padding:clamp(20px,2.6vw,38px)}
.datapt__v{font-size:clamp(1.7rem,3.6vw,3.2rem);font-weight:800;font-variation-settings:'wdth' 96,'wght' 800;
  line-height:.98;letter-spacing:-.04em;color:var(--gold-lt)}
.datapt__v span{font-size:.44em;font-weight:600;color:var(--muted);letter-spacing:0;display:block;margin-top:10px}
.datapt h4{margin:14px 0 8px}
.datapt p{font-size:14px;color:var(--bone-2);line-height:1.6}
.datapt__src{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
  font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
html[lang="zh"] .datapt__src{letter-spacing:.02em;text-transform:none;font-size:11.5px}
@media(max-width:760px){.datapts{grid-template-columns:minmax(0,1fr)}}

/* ---------- 断层 / 问题卡 ---------- */
.gaps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,26px)}
.gap{position:relative;padding:clamp(22px,2.6vw,38px);border:1px solid var(--line);background:var(--ink-2);
  overflow:hidden;transition:border-color .5s var(--ease)}
.gap:hover{border-color:rgba(226,69,47,.42)}
.gap__bar{position:absolute;left:0;top:0;height:2px;width:100%;background:var(--signal);opacity:.7}
.gap__n{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;color:var(--signal);margin-bottom:clamp(16px,2vw,24px)}
.gap h3{margin-bottom:11px}
.gap p{font-size:14.5px;color:var(--bone-2);line-height:1.64}
.gap p+p{margin-top:12px}
@media(max-width:900px){.gaps{grid-template-columns:minmax(0,1fr)}}

/* ---------- 手风琴 ---------- */
.acc{border-top:1px solid var(--line)}
.acc__i{border-bottom:1px solid var(--line)}
.acc__q{width:100%;display:flex;align-items:flex-start;gap:clamp(14px,2vw,30px);
  padding:clamp(18px,2.2vw,30px) 0;text-align:left;transition:color .4s var(--ease)}
.acc__q:hover{color:var(--gold-lt)}
.acc__q i{font-family:var(--f-mono);font-size:12px;font-style:normal;letter-spacing:.08em;color:var(--gold);
  flex:none;padding-top:.28em;min-width:2.4em}
.acc__q span{flex:1;font-size:clamp(1.02rem,1.5vw,1.28rem);font-weight:700;letter-spacing:-.014em;line-height:1.3}
.acc__ic{width:20px;height:20px;flex:none;position:relative;margin-top:.2em}
.acc__ic::before,.acc__ic::after{content:"";position:absolute;background:var(--gold);left:50%;top:50%}
.acc__ic::before{width:12px;height:1.5px;transform:translate(-50%,-50%)}
.acc__ic::after{width:1.5px;height:12px;transform:translate(-50%,-50%);transition:transform .4s var(--ease),opacity .3s var(--ease)}
.acc__i.is-open .acc__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
.acc__a{overflow:hidden;height:0;transition:height .55s var(--ease)}
/* Checklist-style FAQ ([data-open-all]): expanded at CSS level so the answers are
   readable before main.js runs — no collapsed-then-expand flash, and the content is
   still on screen if the script never loads. The click handler's inline height
   overrides this once the user starts opening and closing items. */
.acc[data-open-all] .acc__a{height:auto}
.acc[data-open-all] .acc__i .acc__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
.acc__a>div{padding:0 0 clamp(20px,2.4vw,32px) calc(2.4em + clamp(14px,2vw,30px));
  font-size:14.8px;line-height:1.72;color:var(--bone-2);max-width:80ch}
.acc__a strong{color:var(--bone);font-weight:600}
.acc__a em{font-style:normal;color:var(--gold-lt)}
@media(max-width:640px){.acc__a>div{padding-left:0}}

/* ---------- 表格 ---------- */
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);background:var(--ink-2)}
.tbl{min-width:640px;font-size:14px}
.tbl caption{caption-side:top;text-align:left;padding:clamp(16px,2vw,24px) clamp(16px,2vw,24px) clamp(12px,1.4vw,16px);
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
html[lang="zh"] .tbl caption{letter-spacing:.04em;text-transform:none;font-size:12px}
.tbl th,.tbl td{text-align:left;padding:clamp(13px,1.5vw,20px) clamp(14px,1.8vw,24px);
  border-bottom:1px solid var(--line);vertical-align:top}
.tbl thead th{font-family:var(--f-mono);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);background:rgba(244,241,234,.028);white-space:nowrap}
html[lang="zh"] .tbl thead th{letter-spacing:.03em;text-transform:none;font-size:11.5px}
.tbl tbody tr{transition:background .35s var(--ease)}
.tbl tbody tr:hover{background:rgba(201,162,74,.05)}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl td:first-child{color:var(--bone);font-weight:600}
.tbl td{color:var(--bone-2);line-height:1.6}
.tbl--ru td:nth-child(2){font-family:var(--f-mono);font-size:13px;color:var(--gold-lt)}
.theme--light .tblwrap{background:transparent}
.theme--light .tbl thead th{background:rgba(11,11,12,.035)}

/* ---------- 清单（可勾选） ---------- */
.chk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.2vw,18px) clamp(20px,2.6vw,44px)}
.chk__i{display:flex;gap:13px;align-items:flex-start;font-size:14.5px;color:var(--bone-2);line-height:1.6}
.chk__box{width:16px;height:16px;flex:none;margin-top:.28em;border:1px solid var(--line-2);position:relative}
.chk__box::after{content:"";position:absolute;left:3.5px;top:0.5px;width:5px;height:9px;
  border:solid var(--gold);border-width:0 1.5px 1.5px 0;transform:rotate(45deg) scale(.7);opacity:.85}
.chk--plain .chk__box{border-radius:99px}
.chk--plain .chk__box::after{left:4.5px;top:2.5px;width:4px;height:7px}
@media(max-width:760px){.chk{grid-template-columns:minmax(0,1fr)}}

/* ---------- 对/错 列表 ---------- */
.crosslist li{display:flex;gap:14px;align-items:flex-start;padding:clamp(13px,1.5vw,18px) 0;
  border-bottom:1px solid var(--line);font-size:14.8px;color:var(--bone-2);line-height:1.6}
.crosslist li:last-child{border-bottom:0}
.crosslist i{flex:none;width:18px;height:18px;margin-top:.22em;position:relative}
.crosslist i::before,.crosslist i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:var(--signal)}
.crosslist i::before{transform:translate(-50%,-50%) rotate(45deg)}
.crosslist i::after{transform:translate(-50%,-50%) rotate(-45deg)}
.ticklist li{display:flex;gap:14px;align-items:flex-start;padding:clamp(13px,1.5vw,18px) 0;
  border-bottom:1px solid var(--line);font-size:14.8px;color:var(--bone-2);line-height:1.6}
.ticklist li:last-child{border-bottom:0}
.ticklist i{flex:none;width:18px;height:18px;margin-top:.3em;position:relative}
.ticklist i::after{content:"";position:absolute;left:2px;top:1px;width:6px;height:11px;
  border:solid var(--gold);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}

/* ---------- 提示条 ---------- */
.note{border:1px solid rgba(201,162,74,.3);background:linear-gradient(150deg,rgba(201,162,74,.07),transparent 70%);
  padding:clamp(22px,2.6vw,38px);position:relative}
.note::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--gold)}
.note h4{margin-bottom:10px}
.note p{font-size:14.8px;color:var(--bone-2);line-height:1.66}
.note p+p{margin-top:12px}
.note--signal{border-color:rgba(226,69,47,.34);background:linear-gradient(150deg,rgba(226,69,47,.07),transparent 70%)}
.note--signal::before{background:var(--signal)}

/* ---------- 四个议题（价格/位置/数据/账期） ---------- */
.issues{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1px,.2vw,2px);background:var(--line);border:1px solid var(--line)}
.issue{background:var(--ink-2);padding:clamp(22px,2.6vw,38px);display:flex;flex-direction:column}
.issue__kw{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
html[lang="zh"] .issue__kw{letter-spacing:.04em;text-transform:none;font-size:11.5px}
.issue h3{font-size:clamp(1.15rem,1.7vw,1.5rem);margin-bottom:14px}
.issue p{font-size:14px;color:var(--bone-2);line-height:1.62}
.issue__ask{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);margin-top:20px;
  font-size:13.5px;color:var(--muted);line-height:1.55;font-style:italic}
@media(max-width:1000px){.issues{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.issues{grid-template-columns:minmax(0,1fr)}}

/* ---------- 合作模式 ---------- */
.models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,26px)}
.model{border:1px solid var(--line);background:var(--ink-2);padding:clamp(24px,3vw,42px);position:relative;
  overflow:hidden;transition:border-color .5s var(--ease),background .5s var(--ease)}
.model::after{content:"";position:absolute;right:-40px;bottom:-40px;width:130px;height:130px;
  border:1px solid rgba(201,162,74,.16);border-radius:50%;transition:transform .8s var(--ease)}
.model:hover{border-color:rgba(201,162,74,.42);background:var(--ink-3)}
.model:hover::after{transform:scale(1.35)}
.model__tag{display:inline-flex;margin-bottom:clamp(14px,1.8vw,20px)}
.model h3{margin-bottom:12px;font-size:clamp(1.15rem,1.8vw,1.55rem)}
.model>p{font-size:14.5px;color:var(--bone-2);line-height:1.64}
.model dl{margin-top:clamp(18px,2.2vw,28px);display:flex;flex-direction:column;gap:14px}
.model dt{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:5px}
html[lang="zh"] .model dt{letter-spacing:.04em;text-transform:none;font-size:11.5px}
.model dd{font-size:14px;color:var(--bone-2);line-height:1.6}
@media(max-width:860px){.models{grid-template-columns:minmax(0,1fr)}}

/* ---------- 联系区 / 表单 ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,4vw,72px);align-items:start}
.cinfo li{display:flex;flex-direction:column;gap:5px;padding:clamp(15px,1.8vw,22px) 0;border-bottom:1px solid var(--line)}
.cinfo li:last-child{border-bottom:0}
.cinfo dt{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
html[lang="zh"] .cinfo dt{letter-spacing:.04em;text-transform:none;font-size:11.5px}
.cinfo dd{font-size:clamp(1rem,1.4vw,1.22rem);color:var(--bone);font-weight:600;letter-spacing:-.01em}
.cinfo dd a{transition:color .3s var(--ease)}
.cinfo dd a:hover{color:var(--gold)}
.cinfo small{display:block;font-size:12.5px;color:var(--muted);font-weight:400;margin-top:3px}

.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,22px)}
.field{display:flex;flex-direction:column;gap:8px}
.field--full{grid-column:span 2}
.field label{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
html[lang="zh"] .field label{letter-spacing:.04em;text-transform:none;font-size:11.5px}
.field input,.field select,.field textarea{
  background:transparent;border:1px solid var(--line-2);border-radius:var(--r);
  padding:13px 15px;font-size:14.5px;transition:border-color .35s var(--ease),background .35s var(--ease)}
.field textarea{resize:vertical;min-height:130px;font-family:inherit}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--gold);background:rgba(201,162,74,.045)}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238C8779' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;padding-right:38px}
.form__foot{grid-column:span 2;display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;justify-content:space-between}
.form__hint{font-size:12.5px;color:var(--muted);max-width:42ch}
.form__ok{grid-column:span 2;border:1px solid rgba(201,162,74,.4);background:var(--gold-dim);padding:16px 18px;
  font-size:14px;color:var(--gold-lt);display:none}
.form__ok.is-on{display:block}

/* 表单字段校验态 */
.field.is-err input,.field.is-err select,.field.is-err textarea{
  border-color:var(--signal);background:rgba(226,69,47,.05)}
.field__err{display:none;font-size:12.5px;line-height:1.45;color:#F0776A}
.field.is-err .field__err{display:block}

/* 发出后：全文可复制，数据不落站 */
.form__sent{grid-column:span 2;display:none;flex-direction:column;gap:16px;
  border:1px solid rgba(201,162,74,.42);background:var(--gold-dim);padding:clamp(18px,2vw,24px)}
.form__sent.is-on{display:flex}
.form__sent strong{display:block;font-size:15.5px;color:var(--gold-lt);margin-bottom:9px;letter-spacing:-.01em}
.form__sent p{font-size:13.5px;line-height:1.62;color:var(--bone-2);max-width:76ch}
.form__sent p+p{margin-top:9px}
.form__sent p a,.form__sent p b{color:var(--gold-lt)}
.form__sent p a{text-decoration:underline}
.form__acts{display:flex;flex-wrap:wrap;gap:10px}
.form__out{width:100%;min-height:160px;background:rgba(11,11,12,.55);border:1px solid var(--line-2);
  border-radius:var(--r);padding:13px 15px;color:var(--bone-2);
  font-family:var(--f-mono);font-size:11.5px;line-height:1.75;resize:vertical}
.form__out:focus{outline:0;border-color:var(--gold)}
@media(max-width:760px){.contact-grid{grid-template-columns:minmax(0,1fr)}.form{grid-template-columns:minmax(0,1fr)}.field--full,.form__foot,.form__ok,.form__sent{grid-column:span 1}}

/* ---------- 术语表 ---------- */
.gloss{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.gloss__i{background:var(--ink-2);padding:14px 18px}
.gloss__i dt{font-size:14.5px;font-weight:600;color:var(--bone)}
.gloss__i dd{font-family:var(--f-mono);font-size:12.5px;color:var(--gold-lt);margin-top:5px}
@media(max-width:900px){.gloss{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.gloss{grid-template-columns:minmax(0,1fr)}}

/* ---------- 徽标条（可信度） ---------- */
.creds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1px,.2vw,2px);background:var(--line-2);border:1px solid var(--line-2)}
.cred{background:var(--ink);padding:clamp(24px,3vw,40px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.cred__ic{width:30px;height:30px;color:var(--gold)}
.cred h4{font-size:15px}
.cred p{font-size:13.5px;color:var(--muted);line-height:1.55}
@media(max-width:820px){.creds{grid-template-columns:minmax(0,1fr)}}
