/* ============================================================
   BOOK PAGE - page-specific layer (shared tokens above)
   ============================================================ */
.sec{padding:72px 0}

.sec-tight{padding:60px 0}

.sec-head{margin-bottom:32px}

/* -- hero: light, no footage. The wash, the rule and the orb field
      carry the movement the homepage hero gets from its clip. */
.hero-page{min-height:min(46vh,430px);padding:78px 0 60px}

.hero-solo{max-width:56rem}

.hero-page h1{max-width:22ch;font-size:clamp(2.1rem,4.3vw,3.4rem)}

.hero-page .hero-sub{max-width:60ch}

/* -- trust chips (inline SVG checks, never emoji) -------------- */
.trust-chips{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 16px;padding:0;list-style:none}

.trust-chips li{display:inline-flex;align-items:center;gap:9px;font-size:.87rem;line-height:1.3;
  color:var(--emerald-ink);background:var(--white);border:1px solid var(--hairline-2);
  border-radius:99px;padding:9px 17px}

.trust-chips svg{width:14px;height:14px;flex:0 0 14px;color:var(--emerald)}

.hero-page .cta-micro{margin:0}

/* -- the booking widget's framed shell ------------------------
   The widget sizes itself and cannot be measured cross-origin, so the
   shell is deliberately taller than the tallest month view: at 780px
   desktop / 1000px phone the calendar has never clipped. ThemePort
   detects the leadconnectorhq iframe itself as the booking slot, so no
   .embed-ph placeholder is needed (and none is wanted - an empty Site
   Controls box leaves this iframe in place). */
.embed-band{padding:52px 0 76px}

.embed-shell{background:var(--white);border:1px solid var(--hairline-2);border-radius:var(--r);
  box-shadow:var(--sh-2);overflow:hidden;min-height:780px}

.embed-shell iframe{display:block;width:100%;height:780px;border:0}

.embed-note{margin:16px 0 0;font-size:.86rem;color:var(--muted);text-align:center}

/* -- what happens on the call: three steps -------------------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}

.step{background:linear-gradient(180deg,var(--white) 0%,#fafcfb 100%);border:1px solid var(--hairline);
  border-radius:var(--r);padding:26px 24px;position:relative;overflow:hidden;
  box-shadow:0 1px 2px rgba(6,28,20,.045)}

.step-n{display:block;font-family:var(--serif);font-style:italic;font-size:.82rem;
  color:var(--emerald-ink);letter-spacing:.05em;margin-bottom:12px}

.step h3{margin:0 0 .4em;font-size:1.08rem}

.step p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.6}

/* -- responsive ------------------------------------------------ */
@media (max-width:900px){
  .steps{grid-template-columns:1fr}
}

@media (max-width:860px){
  .hero-page{padding:60px 0 48px;min-height:0}
  .embed-band{padding:44px 0 60px}
  .embed-shell{min-height:1000px}
  .embed-shell iframe{height:1000px}
}

@media (max-width:560px){
  .trust-chips li{font-size:.83rem;padding:8px 14px}
}