/* mingjueappfangjian.html 页面专属版式：房间号专页（前缀 rj-） */

/* ---------- 通用节律 ---------- */
.rj-section{padding:56px 0;position:relative}
.rj-section-alt{background:linear-gradient(180deg,#fffaf3,#fdf7f0)}
.rj-section h2{font-size:clamp(21px,2.6vw,28px);line-height:1.4;color:var(--ink);
  letter-spacing:.5px;margin-bottom:18px;position:relative;padding-left:16px}
.rj-section h2::before{content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:5px;
  border-radius:4px;background:linear-gradient(180deg,var(--coral),var(--teal))}
.rj-section h3{font-size:16.5px;color:var(--coral2);margin-bottom:6px;letter-spacing:.4px}
.rj-p{font-size:15.8px;line-height:1.95;color:var(--text);margin-bottom:14px;max-width:78ch}
.rj-p:last-child{margin-bottom:0}
.rj-p a{color:var(--teal2);font-weight:700;border-bottom:2px solid rgba(14,165,160,.28);
  padding-bottom:1px;transition:color .2s,border-color .2s}
.rj-p a:hover{color:var(--coral2);border-bottom-color:var(--coral)}

/* ---------- 首屏：大号数字卡 ---------- */
.rj-hero{padding:54px 0 60px;background:
  radial-gradient(900px 380px at 88% -10%,rgba(14,165,160,.10),transparent 62%),
  radial-gradient(760px 420px at 4% 0%,rgba(255,107,74,.13),transparent 60%),
  var(--bg)}
.rj-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:38px;align-items:center}
.rj-hero-copy{min-width:0}
.rj-kicker{display:inline-block;font-size:12.5px;letter-spacing:3px;color:var(--teal2);
  background:var(--teal-soft);border:1px solid rgba(14,165,160,.28);border-radius:20px;
  padding:5px 14px;margin-bottom:16px;font-weight:700}
.rj-hero h1{font-size:clamp(26px,3.7vw,42px);line-height:1.28;color:var(--ink);
  letter-spacing:.5px;margin-bottom:16px}
.rj-lead{font-size:16.2px;line-height:1.95;color:var(--text);max-width:60ch}
.rj-lead-sub{font-size:14.6px;line-height:1.85;color:var(--muted);margin-top:14px;
  border-left:3px solid var(--border2);padding-left:14px;max-width:58ch}
.rj-digit-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:30px 26px;text-align:center;position:relative;overflow:hidden}
.rj-digit-card::after{content:"";position:absolute;inset:auto -30% -60% -30%;height:150px;
  background:radial-gradient(closest-side,rgba(14,165,160,.16),transparent);pointer-events:none}
.rj-digit-label{font-size:12.5px;letter-spacing:3px;color:var(--muted);margin-bottom:6px}
.rj-digit-big{font-size:clamp(42px,6.6vw,66px);font-weight:900;line-height:1.15;
  letter-spacing:.06em;font-variant-numeric:tabular-nums;
  background:linear-gradient(120deg,var(--coral2),var(--coral) 55%,var(--teal));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-fill-color:transparent;padding:4px 0}
.rj-digit-note{font-size:13.5px;color:var(--teal2);letter-spacing:1px;margin-top:8px;
  border-top:1px dashed var(--border);padding-top:12px}

/* ---------- 逐位说明 dl ---------- */
.rj-digit-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:6px}
.rj-digit-item{background:var(--card);border:1px solid var(--border);border-radius:16px;
  padding:18px 18px 16px;box-shadow:0 6px 18px rgba(232,80,47,.07);
  transition:transform .22s,box-shadow .22s,border-color .22s}
.rj-digit-item:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--border2)}
.rj-digit-item dt{font-size:14px;font-weight:800;color:var(--coral2);letter-spacing:.6px;
  display:flex;align-items:center;gap:8px;margin-bottom:8px}
.rj-digit-item dt::before{content:"";width:8px;height:8px;border-radius:50%;
  background:var(--teal);flex:0 0 auto}
.rj-digit-item dd{font-size:14.2px;line-height:1.85;color:var(--muted);margin:0}
.rj-chant{margin-top:22px;text-align:center;font-size:16.5px;font-weight:800;letter-spacing:2px;
  color:var(--teal2);background:var(--teal-soft);border:1px dashed rgba(14,165,160,.4);
  border-radius:14px;padding:14px 18px}

/* ---------- aside ---------- */
.rj-aside{margin-top:22px;background:linear-gradient(135deg,var(--coral-wash),#fff);
  border:1px solid var(--border2);border-left:5px solid var(--coral);border-radius:16px;
  padding:18px 22px;box-shadow:0 8px 22px rgba(232,80,47,.08)}
.rj-aside-t{font-size:13px;font-weight:800;letter-spacing:2px;color:var(--coral2);margin-bottom:6px}
.rj-aside p:last-child{font-size:14.6px;line-height:1.9;color:var(--text)}

/* ---------- 步骤 ol ---------- */
.rj-steps{display:grid;gap:12px;counter-reset:rjstep;margin-top:8px}
.rj-steps li{counter-increment:rjstep;position:relative;background:var(--card);
  border:1px solid var(--border);border-radius:16px;padding:16px 20px 16px 62px;
  box-shadow:0 6px 18px rgba(232,80,47,.06);transition:box-shadow .22s,border-color .22s}
.rj-steps li:hover{box-shadow:var(--shadow);border-color:var(--border2)}
.rj-steps li::before{content:counter(rjstep,decimal-leading-zero);position:absolute;left:18px;top:15px;
  width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--coral),var(--coral2));
  color:#fff;font-size:14px;font-weight:900;display:flex;align-items:center;justify-content:center;
  letter-spacing:.5px;box-shadow:0 4px 12px rgba(232,80,47,.28)}
.rj-steps li p{font-size:14.6px;line-height:1.85;color:var(--muted)}

/* ---------- 表格 ---------- */
.rj-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);
  border:1px solid var(--border);border-radius:16px;overflow:hidden;
  box-shadow:0 8px 24px rgba(232,80,47,.07);font-size:14.6px}
.rj-table thead th{background:linear-gradient(120deg,#fff4ee,#fff9f4);color:var(--ink);
  font-size:13.8px;letter-spacing:1px;text-align:left;padding:14px 16px;font-weight:800;
  border-bottom:1px solid var(--border2);white-space:nowrap}
.rj-table tbody td{padding:13px 16px;line-height:1.8;color:var(--text);
  border-bottom:1px solid var(--border);vertical-align:top}
.rj-table tbody tr:last-child td{border-bottom:none}
.rj-table tbody tr:nth-child(even){background:#fffcf8}
.rj-table tbody tr:hover{background:var(--coral-wash)}
.rj-table tbody td:first-child{font-weight:700;color:var(--coral2)}
.rj-table-warn thead th{background:linear-gradient(120deg,#fff1ea,#ffe4d9);color:#8c3218}
.rj-table-fix thead th{background:linear-gradient(120deg,var(--teal-soft),#f2fffd);color:var(--teal2)}

/* ---------- 核对清单 ul ---------- */
.rj-check{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 18px;margin-top:6px}
.rj-check li{position:relative;padding:11px 16px 11px 42px;background:var(--card);
  border:1px solid var(--border);border-radius:14px;font-size:14.6px;line-height:1.75;
  color:var(--text);box-shadow:0 4px 14px rgba(232,80,47,.05)}
.rj-check li::before{content:"✓";position:absolute;left:14px;top:11px;width:20px;height:20px;
  border-radius:50%;background:var(--teal-soft);color:var(--teal2);font-size:12px;font-weight:900;
  display:flex;align-items:center;justify-content:center;border:1px solid rgba(14,165,160,.35)}

/* ---------- 常见问题 details ---------- */
.rj-faq{display:grid;gap:10px}
.rj-faq details{background:var(--card);border:1px solid var(--border);border-radius:16px;
  padding:0 20px;box-shadow:0 5px 16px rgba(232,80,47,.05);transition:border-color .2s,box-shadow .2s}
.rj-faq details[open]{border-color:var(--border2);box-shadow:var(--shadow)}
.rj-faq summary{cursor:pointer;list-style:none;font-size:15.4px;font-weight:700;color:var(--ink);
  padding:15px 30px 15px 0;position:relative;letter-spacing:.3px}
.rj-faq summary::-webkit-details-marker{display:none}
.rj-faq summary::after{content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);
  width:24px;height:24px;border-radius:8px;background:var(--coral-soft);color:var(--coral2);
  font-size:16px;font-weight:900;line-height:24px;text-align:center;transition:transform .2s,background .2s}
.rj-faq details[open] summary::after{content:"−";background:var(--teal-soft);color:var(--teal2)}
.rj-faq details p{font-size:14.4px;line-height:1.9;color:var(--muted);padding:0 0 16px;
  border-top:1px dashed var(--border);padding-top:12px;margin-top:0}

/* ---------- 客服 blockquote ---------- */
.rj-quote{margin:6px 0 20px;position:relative;background:linear-gradient(135deg,var(--teal-soft),#fff);
  border:1px solid rgba(14,165,160,.26);border-radius:18px;padding:22px 26px 22px 56px;
  box-shadow:var(--shadow-teal)}
.rj-quote::before{content:"“";position:absolute;left:18px;top:8px;font-size:52px;line-height:1;
  color:var(--teal);opacity:.35;font-family:Georgia,serif}
.rj-quote p{font-size:15px;line-height:1.95;color:var(--text)}

/* ---------- 记忆技巧 ul ---------- */
.rj-tips{display:grid;gap:9px;margin-top:6px}
.rj-tips li{position:relative;padding:10px 16px 10px 40px;background:#fff;border-radius:12px;
  border:1px solid var(--border);font-size:14.6px;line-height:1.8;color:var(--text)}
.rj-tips li::before{content:"";position:absolute;left:16px;top:19px;width:9px;height:9px;
  border-radius:3px;transform:rotate(45deg);background:var(--coral)}
.rj-tips-when li::before{background:var(--teal)}

/* ---------- 结尾 CTA ---------- */
.rj-cta{padding:64px 0 72px;background:
  radial-gradient(700px 300px at 50% 0%,rgba(255,107,74,.14),transparent 65%),var(--bg)}
.rj-cta-in{background:var(--card);border:1px solid var(--border);border-radius:18px;
  box-shadow:var(--shadow);padding:38px 34px;text-align:center;max-width:880px;margin:0 auto}
.rj-cta-in h2{padding-left:0;justify-content:center;margin-bottom:14px}
.rj-cta-in h2::before{display:none}
.rj-cta-in .rj-p{margin-left:auto;margin-right:auto;text-align:center}
.rj-cta-btns{justify-content:center;margin-top:22px}
.rj-cta-note{margin-top:18px;font-size:13px;letter-spacing:2px;color:var(--muted)}

/* ---------- 移动端 ---------- */
@media(max-width:900px){
  .rj-section{padding:40px 0}
  .rj-hero{padding:36px 0 44px}
  .rj-hero-grid{grid-template-columns:1fr;gap:26px}
  .rj-digit-card{padding:24px 20px;order:-1}
  .rj-digit-big{font-size:52px}
  .rj-lead{font-size:15.4px}
  .rj-digit-list{grid-template-columns:1fr 1fr}
  .rj-check{grid-template-columns:1fr}
  .rj-steps li{padding:14px 16px 14px 56px}
  .rj-steps li::before{left:14px;top:13px;width:28px;height:28px;font-size:13px}
  .rj-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:13.8px}
  .rj-table thead th,.rj-table tbody td{padding:11px 12px;white-space:normal}
  .rj-quote{padding:18px 20px 18px 46px}
  .rj-quote::before{left:12px;font-size:40px}
  .rj-cta{padding:48px 0 54px}
  .rj-cta-in{padding:26px 20px}
}
@media(max-width:560px){
  .rj-digit-list{grid-template-columns:1fr}
  .rj-digit-big{font-size:44px;letter-spacing:.04em}
  .rj-chant{font-size:15px;letter-spacing:1px}
  .rj-section h2{font-size:20px;padding-left:14px}
}