/* ============================================================
   yikeyichi.com · zhaopian-guifan.html 专属样式
   布局原型：L4 大留白禅意（细线框、竖排装饰、细线分隔）
   ============================================================ */

/* ---------- Hero：极简竖排大字 + 偏移小图 ---------- */
.hero{
  background:var(--cream-50);
  padding:calc(var(--header-h) + 70px) 0 90px;
  border-bottom:1px solid var(--line);
}
.hero__inner .breadcrumb{ margin-bottom:30px; }
.hero__grid{
  display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(36px,6vw,90px); align-items:center;
}
.hero__eyebrow{
  font-size:12.5px; letter-spacing:.4em; color:var(--brown-600); margin-bottom:22px;
}
.hero h1{
  font-size:clamp(38px,5.6vw,68px); color:var(--green-950); line-height:1.28;
  letter-spacing:.06em; margin-bottom:24px;
}
.hero__lead{ font-size:15.5px; color:var(--ink-soft); line-height:2.1; max-width:440px; margin-bottom:30px; }
.hero__pic{ position:relative; }
.hero__pic img{
  width:100%; height:380px; object-fit:cover; border:1px solid var(--line-strong);
  padding:10px; background:var(--cream-50);
}

/* ---------- 硬性要求：细线表 ---------- */
.spec{ background:var(--cream-50); }
.sp-head{ max-width:640px; margin-bottom:40px; }
.sp-head .eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; letter-spacing:.32em; color:var(--brown-600); margin-bottom:14px;
}
.sp-head .eyebrow::before{ content:""; width:34px; height:1px; background:var(--brown-500); }
.sp-head .sub{ color:var(--muted); font-size:14.5px; }
.sp-table .tbl{ background:transparent; }
.sp-table .tbl th{
  background:transparent; color:var(--brown-700); border-bottom:2px solid var(--green-900);
  font-family:var(--font-serif); font-weight:600;
}
.sp-table .tbl td{ border-bottom:1px solid var(--line); }

/* ---------- 不合格原因 ---------- */
.bd-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:0 40px; }
.bd-item{
  padding:26px 0; border-bottom:1px solid var(--line-strong);
  display:grid; grid-template-columns:44px 1fr; gap:8px;
}
.bd-item i{
  font-style:normal; font-family:var(--font-serif); font-size:20px; color:var(--brown-500);
}
.bd-item h3{ font-size:16.5px; margin-bottom:6px; }
.bd-item p{ font-size:13.5px; color:var(--muted); line-height:1.9; }

/* ---------- 自拍技巧 ---------- */
.self{ background:var(--cream-50); }
.sl-grid{ display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(36px,6vw,80px); }
.sl-copy .eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; letter-spacing:.32em; color:var(--brown-600); margin-bottom:14px;
}
.sl-copy .eyebrow::before{ content:""; width:34px; height:1px; background:var(--brown-500); }
.sl-copy h2{ margin-bottom:14px; }
.sl-copy > p{ color:var(--muted); margin-bottom:20px; }
.sl-copy ol{ counter-reset:sl; }
.sl-copy ol li{
  counter-increment:sl; position:relative; padding:11px 0 11px 40px;
  border-bottom:1px dashed var(--line); font-size:14.5px; color:var(--ink-soft);
}
.sl-copy ol li::before{
  content:counter(sl); position:absolute; left:0; top:11px;
  font-family:var(--font-serif); color:var(--brown-600); font-size:15px;
}
.sl-quote{
  border-left:2px solid var(--green-900); padding:10px 0 10px 26px;
  align-self:center;
}
.sl-quote p{
  font-family:var(--font-serif); font-size:17.5px; line-height:2.1; color:var(--green-900);
}

/* ---------- 照相馆 ---------- */
.st-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4vw,56px); }
.st-say{
  border:1.5px solid var(--line-strong); padding:36px 34px;
  display:flex; align-items:center;
}
.st-say__line{ font-family:var(--font-serif); font-size:18px; line-height:2.1; color:var(--ink); }
.st-say__line strong{ color:var(--green-800); }
.st-info h3{ font-size:17.5px; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid var(--line-strong); }
.st-info p{ font-size:14px; color:var(--ink-soft); margin-bottom:12px; line-height:2; }
.st-info p b{ color:var(--green-800); }

/* ---------- 不合格怎么办 ---------- */
.rw-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.rw-step{ text-align:center; padding:20px 10px; }
.rw-step b{
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
  width:56px; height:56px; border-radius:50%; border:1.5px solid var(--green-800);
  font-family:var(--font-serif); font-size:20px; color:var(--green-800);
}
.rw-step p{ font-size:14px; color:var(--muted); line-height:2; }

/* ---------- FAQ：极简 + 加号 ---------- */
.container.narrow{ max-width:680px; }
.fq-list{ border-top:1px solid var(--line-strong); }
.fq-item{ border-bottom:1px solid var(--line-strong); }
.fq-item summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  padding:20px 2px; font-size:15px; font-weight:600; color:var(--green-900);
}
.fq-item summary::-webkit-details-marker{ display:none; }
.fq-item summary span{
  flex:none; font-size:20px; color:var(--brown-600); font-weight:400;
  transition:transform .35s var(--ease);
}
.fq-item[open] summary span{ transform:rotate(45deg); }
.fq-item p{ padding:0 30px 18px 2px; font-size:14px; color:var(--muted); line-height:2; }
.fq-item p a{ color:var(--green-700); }

/* ---------- CTA：线框盒 ---------- */
.booking{ background:var(--cream-50); }
.bk-box{
  border:1.5px solid var(--line-strong); border-radius:var(--radius-m);
  padding:clamp(30px,4vw,52px); text-align:center;
}
.bk-box .eyebrow{
  font-size:12.5px; letter-spacing:.35em; color:var(--brown-600);
}
.bk-box h2{ margin:12px 0 10px; }
.bk-box > p{ font-size:14.5px; color:var(--muted); margin-bottom:26px; }
.bk-box form{ display:flex; flex-direction:column; gap:14px; text-align:left; }
.bk-alt{ margin-top:16px; font-size:13.5px; color:var(--muted); }
.bk-alt a{ color:var(--green-700); font-weight:700; }

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .hero__grid,.sl-grid,.st-grid{ grid-template-columns:1fr; }
  .bd-list{ grid-template-columns:1fr 1fr; }
  .rw-steps{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .bd-list{ grid-template-columns:1fr; }
}

/* ============================================================
   新增区块样式（zp- 前缀，不改动上方既有类）
   ============================================================ */
/* 照片规格逐项表 */
.zp-detail .zp-table{ margin-top:34px; }
.zp-detail__note{
  max-width:760px; margin:22px 0 0; font-size:13.5px; color:var(--muted);
  line-height:2; padding-left:14px; border-left:2px solid var(--brown-500);
}
.zp-detail .tbl th{
  background:var(--cream-50); color:var(--brown-700); width:140px;
  font-family:var(--font-serif); font-weight:600;
  border-bottom:1px solid var(--line); vertical-align:top; padding:16px 14px;
}
.zp-detail .tbl td{
  border-bottom:1px dashed var(--line); line-height:2; font-size:14.5px;
  color:var(--ink-soft); padding:16px 14px;
}

/* 照片与电子证照 */
.zp-eid{ border-top:1px solid var(--line); }
.zp-eid__grid{
  display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(30px,5vw,70px); align-items:start;
}
.zp-eid__copy .eyebrow{
  display:inline-flex; align-items:center; gap:10px; font-size:13px; letter-spacing:.32em;
  color:var(--brown-600); margin-bottom:14px;
}
.zp-eid__copy .eyebrow::before{ content:""; width:34px; height:1px; background:var(--brown-500); }
.zp-eid__copy h2{ margin-bottom:16px; }
.zp-eid__copy p{ font-size:14.5px; color:var(--ink-soft); line-height:2.1; margin-bottom:14px; }
.zp-eid__note{
  border:1px solid var(--line-strong); border-top:3px solid var(--green-900);
  padding:26px; background:var(--cream-50);
}
.zp-eid__note h3{ font-size:16px; margin-bottom:14px; color:var(--green-900); }
.zp-eid__note p{ font-size:13.5px; color:var(--muted); line-height:1.9; margin-bottom:10px; }
.zp-eid__note p b{ color:var(--green-800); }
.zp-eid__note a{ color:var(--green-700); }

@media (max-width:900px){
  .zp-eid__grid{ grid-template-columns:1fr; }
}

/* 提交前自检清单 */
.zp-check{ background:var(--cream-50); }
.zp-check__list{
  max-width:760px; margin:30px auto 0; display:grid; grid-template-columns:1fr 1fr;
  gap:0 40px; counter-reset:zpc;
}
.zp-check__list li{
  counter-increment:zpc; position:relative; list-style:none;
  padding:15px 0 15px 46px; border-bottom:1px dashed var(--line);
  font-size:14.5px; color:var(--ink-soft); line-height:1.8;
}
.zp-check__list li::before{
  content:counter(zpc); position:absolute; left:0; top:15px;
  width:28px; height:28px; line-height:26px; text-align:center;
  border:1px solid var(--brown-500); border-radius:50%;
  font-family:var(--font-serif); font-size:13px; color:var(--brown-600);
}
@media (max-width:640px){
  .zp-check__list{ grid-template-columns:1fr; }
}
.zp-check__foot{
  max-width:760px; margin:26px auto 0; text-align:center;
  font-size:14px; color:var(--brown-700); line-height:2;
  border-top:1px solid var(--line); padding-top:20px;
}