/* ==========================================================================
   Bloom24 — How to Order page (page-order.php), prefix: ho-
   ========================================================================== */

/* ---------- Hero ---------- */
.ho-hero{padding:150px 0 70px;background:
  radial-gradient(600px 340px at 90% 10%, rgba(232,106,138,.14), transparent 60%),
  radial-gradient(520px 320px at 6% 78%, rgba(203,168,219,.13), transparent 60%),
  linear-gradient(180deg,#FDF0F3,#FFF9F7)}
.ho-hero h1{font-size:clamp(32px,4.5vw,50px);margin:0}
.ho-hero h1 em{font-style:normal;color:var(--rose-deep)}
.ho-hero-sub{font-size:1.0625rem;line-height:1.75;color:var(--grey);max-width:680px;margin:18px 0 0}
.ho-hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}

/* ---------- 流程时间线 ---------- */
.ho-steps{padding:90px 0}
.ho-timeline{max-width:860px;margin:52px auto 0;position:relative;padding-left:56px}
.ho-timeline::before{content:"";position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--rose),#F3DCE4)}
.ho-step{position:relative;margin-bottom:34px}
.ho-step:last-child{margin-bottom:0}
.ho-step-no{position:absolute;left:-56px;top:0;width:40px;height:40px;border-radius:50%;background:#fff;color:var(--rose-deep);font-family:var(--font-display);font-weight:700;font-size:1.0625rem;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(74,44,78,.14);border:2px solid var(--rose)}
.ho-step-body{background:#fff;border-radius:var(--radius);padding:26px 30px;box-shadow:0 8px 26px rgba(74,44,78,.07);transition:.3s}
.ho-step:hover .ho-step-body{transform:translateY(-3px);box-shadow:0 16px 40px rgba(74,44,78,.13)}
.ho-step-body h3{font-size:1.1875rem;margin:0 0 8px}
.ho-step-body p{font-size:0.9062rem;line-height:1.75;color:var(--grey);margin:0 0 12px}
.ho-step-time{display:inline-block;font-size:0.75rem;font-weight:700;letter-spacing:.04em;color:var(--rose-deep);background:var(--rose-soft);padding:6px 14px;border-radius:999px}

/* ---------- 付款方式 ---------- */
.ho-pay{padding:90px 0;background:var(--cream)}
.ho-pay-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:52px}
.ho-pay-card{background:#fff;border-radius:var(--radius);padding:30px 28px;box-shadow:0 8px 26px rgba(74,44,78,.07);transition:.3s;display:flex;flex-direction:column;gap:14px}
.ho-pay-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(74,44,78,.13)}
.ho-pay-card h3{font-size:1.125rem;margin:0;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ho-pay-tag{font-size:0.6562rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--rose-deep);background:var(--rose-soft);padding:5px 10px;border-radius:999px;white-space:nowrap}
.ho-pay-main{font-size:0.9688rem;font-weight:700;color:var(--ink);margin:0}
.ho-pay-card ul{margin:0;padding-left:20px;display:grid;gap:8px}
.ho-pay-card li{font-size:0.8438rem;line-height:1.7;color:var(--grey)}
.ho-pay-note{max-width:720px;margin:34px auto 0;text-align:center;font-size:0.8125rem;color:var(--grey);line-height:1.7}

/* ---------- Incoterms 表格 ---------- */
.ho-terms{padding:90px 0}
.ho-table-wrap{margin-top:52px;background:#fff;border-radius:var(--radius);box-shadow:0 10px 30px rgba(74,44,78,.09);overflow-x:auto}
.ho-table{width:100%;border-collapse:collapse;min-width:760px;font-size:0.875rem}
.ho-table th{background:var(--rose-deep);color:#fff;text-align:left;padding:16px 20px;font-size:0.8125rem;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.ho-table td{padding:16px 20px;border-bottom:1px solid #F7E6EC;vertical-align:top;color:#4A4150;line-height:1.6}
.ho-table tr:last-child td{border-bottom:none}
.ho-table tr:nth-child(even) td{background:#FFF9FA}
.ho-terms-note{max-width:760px;margin:30px auto 0;text-align:center;font-size:0.8438rem;color:var(--grey);line-height:1.75}

/* ---------- 运输与清关 ---------- */
.ho-ship{padding:90px 0;background:var(--cream)}
.ho-ship-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.ho-ship-body h2{font-size:clamp(24px,3vw,34px);margin:0 0 16px}
.ho-ship-text{font-size:0.9375rem;line-height:1.8;color:var(--grey);margin:0 0 20px}
.ho-doc-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ho-doc-list li{font-size:0.8438rem;font-weight:600;color:var(--ink);background:#fff;border-radius:10px;padding:12px 16px;box-shadow:0 4px 14px rgba(74,44,78,.07);display:flex;align-items:center;gap:8px}
.ho-doc-list li::before{content:"📄";font-size:0.875rem}
.ho-ship-cards{display:grid;gap:16px}
.ho-ship-card{background:#fff;border-radius:14px;padding:20px 24px;box-shadow:0 8px 22px rgba(74,44,78,.08)}
.ho-ship-card strong{display:block;font-size:0.9688rem;margin-bottom:4px}
.ho-ship-card span{font-size:0.8438rem;color:var(--grey);line-height:1.6}

/* ---------- 交付周期 ---------- */
.ho-lead{padding:90px 0}
.ho-lead-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:52px}
.ho-lead-card{background:#fff;border-radius:var(--radius);padding:34px 30px;text-align:center;box-shadow:0 8px 26px rgba(74,44,78,.07);transition:.3s}
.ho-lead-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(74,44,78,.13)}
.ho-lead-num{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(34px,4vw,46px);line-height:1.1;color:var(--rose-deep)}
.ho-lead-card strong{display:block;font-size:0.9062rem;margin:10px 0 8px}
.ho-lead-card p{font-size:0.8438rem;line-height:1.7;color:var(--grey);margin:0}

/* ---------- 随附清单 ---------- */
.ho-included{padding:90px 0;background:
  radial-gradient(600px 300px at 12% 20%, rgba(232,106,138,.10), transparent 60%),
  var(--cream)}
.ho-included-list{list-style:none;max-width:720px;margin:52px auto 0;padding:0;display:grid;gap:14px}
.ho-included-list li{background:#fff;border-radius:14px;padding:18px 24px;font-size:0.9375rem;font-weight:600;color:var(--ink);box-shadow:0 6px 18px rgba(74,44,78,.07)}

/* ---------- CTA ---------- */
.ho-cta{padding:100px 0;background:linear-gradient(135deg,#3E1F44,#5A2A4F);color:#fff;text-align:center}
.ho-cta h2{color:#fff;font-size:clamp(28px,3.6vw,42px);margin:0}
.ho-cta-sub{color:rgba(255,255,255,.82);font-size:1.0312rem;line-height:1.7;max-width:560px;margin:16px auto 30px}
.ho-cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.ho-cta .btn-light{background:#fff;color:var(--leaf)}
.ho-cta-mail{margin:26px 0 0;font-size:0.8438rem;color:rgba(255,255,255,.65)}
.ho-cta-mail a{color:#fff;text-decoration:none;border-bottom:1.5px solid rgba(255,255,255,.4)}

/* ---------- 移动端 ---------- */
@media(max-width:980px){
  .ho-hero{padding:120px 0 50px}
  .ho-steps,.ho-pay,.ho-terms,.ho-ship,.ho-lead,.ho-included{padding:60px 0}
  .ho-timeline{padding-left:44px}
  .ho-timeline::before{left:15px}
  .ho-step-no{left:-44px;width:32px;height:32px;font-size:0.875rem}
  .ho-step-body{padding:20px 20px}
  .ho-pay-grid,.ho-lead-grid{grid-template-columns:1fr}
  .ho-ship-grid{grid-template-columns:1fr;gap:32px}
  .ho-doc-list{grid-template-columns:1fr}
  .ho-cta{padding:70px 0}
}