/* ============================================================
   HOPE RESTORED HOMES  ·  Booking page extras
   (css/booking.css)
   ------------------------------------------------------------
   Loaded ONLY by booking.html, after css/cleancore.css.
   Booking hero, breadcrumb, info cards, and the always-open
   ZenMaid picker area.
   ============================================================ */

/* ══════════════════════════════════════════
   BOOKING PAGE ONLY
   Everything above is lifted straight from index.html so this page
   inherits the exact Cleancore nav, buttons, cards and footer.
══════════════════════════════════════════ */
.book-hero { position: relative; text-align: center; padding: 4.2rem 1.5rem .4rem; max-width: 780px; margin: 0 auto; }
.book-hero .sec-kicker { display: inline-flex; justify-content: center; }
.book-hero .sec-title { margin-bottom: .9rem; }
.book-hero .sec-sub { max-width: 640px; margin: 0 auto; }
.book-crumb { max-width: 1120px; margin: 0 auto; padding: 1.1rem 3rem 0; font-family: 'DM Mono', monospace; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gray); }
.book-crumb a { color: var(--aqua-deep); text-decoration: none; }
.book-crumb a:hover { text-decoration: underline; }
.book-crumb span { margin: 0 .5rem; opacity: .55; }

/* The picker is always open on this page, so no collapsible panel is needed. */
.book-open { max-width: 1120px; margin: 0 auto; padding: 1.4rem 3rem 2.4rem; }
.book-open .svc-pick { margin-top: 0; }

/* Supporting copy sections */
.book-info { max-width: 1120px; margin: 0 auto; padding: 1rem 3rem 3.4rem; }
.book-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.book-card {
  background: var(--glass); border: 1px solid var(--glass-brd); border-radius: 20px;
  padding: 1.6rem 1.5rem; position: relative; overflow: hidden;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: var(--card-shadow);
}
.book-card::before { content: ''; position: absolute; inset: 0 0 60% 0; background: var(--sheen); pointer-events: none; }
.book-card h3 { font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: 1.1rem; color: var(--ink); margin-bottom: .5rem; position: relative; }
.book-card p { font-size: .88rem; line-height: 1.8; color: var(--ink2); position: relative; }

.book-steps { list-style: none; counter-reset: bkstep; margin-top: 1.2rem; }
.book-steps li { position: relative; counter-increment: bkstep; padding: 0 0 1.05rem 3rem; font-size: .92rem; line-height: 1.7; color: var(--ink2); }
.book-steps li:last-child { padding-bottom: 0; }
.book-steps li::before {
  content: counter(bkstep); position: absolute; left: 0; top: -1px;
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--grad-fresh); color: var(--white);
  font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: .85rem;
}
.book-steps b { color: var(--ink); font-weight: 600; }


@media (max-width: 900px) {
  .book-crumb, .book-open, .book-info { padding-left: 1.2rem; padding-right: 1.2rem; }
  .book-info-grid { grid-template-columns: 1fr; }
  .book-hero { padding-top: 2.8rem; }
}
