/* ============================================================
   King Slayer Sportfishing: /book/ page layout only
   Requires tokens.css then base.css.
   Minimal-chrome conversion page: COMPACT photo band, a one
   sentence terms strip, the Acuity iframe first, a fallback
   link, then the compact booking-policies list. No cta-band;
   the calendar is the CTA, so everything above it stays short.
   v2.6: the four pick-a-calendar cards are gone, the widget
   leads (owner call 2026-07-27).
   ============================================================ */

/* ============ 1. Compact page hero ============
   Page-scoped override of the shared .page-hero band. Every
   other interior page gets the full clamp(420px,56vh,640px)
   photo band; here the calendar is the point, so the band is
   cut back to headline height and the copy padding shrinks
   with it. Loaded after base.css, so equal-specificity
   selectors win on source order. */
.page-hero{min-height:clamp(280px,32vh,380px)}
/* 00-1600.webp is a line of anglers with heads in the top quarter; in this
   short band the shared 40% crop shows torsos only, so the window is raised */
.page-hero-img{object-position:50% 5%}
.page-hero-inner{
  padding:clamp(2.75rem,7vw,4rem) var(--gutter) clamp(1.75rem,3vw,2.25rem);
}
@media (min-width:641px){
  .page-hero h1{font-size:clamp(1.9rem,3.6vw,3rem);margin-bottom:.9rem}
}
.page-hero-cta{margin-top:1.3rem;padding-top:1.1rem}

/* ============ 2. Terms strip ============ */
.book-terms{
  padding:clamp(1.5rem,3.5vw,2.25rem) 0;
  background:var(--deep-700);
  border-bottom:1px solid var(--line);
}
.book-reassure{
  max-width:52rem;
  color:var(--dim);
  font-size:1rem;
}

/* ============ 3. Acuity embed ============ */
.book-embed-wrap{margin-bottom:1.5rem}
.book-embed-wrap iframe{
  display:block;
  width:100%;
  border:1px solid var(--line);
  background:var(--ice);
  min-height:min(1200px,160vh);
}
@media (min-width:880px){
  .book-embed-wrap iframe{min-height:1100px}
}

/* ============ 4. Fallback + phone ============ */
.book-fallback{
  display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem;
  padding-top:1.5rem;
  border-top:1px solid var(--line);
  color:var(--dim);
  font-size:.95rem;
}
.book-fallback a{color:var(--blue-bright)}

/* ============ 5. Booking policies ============ */
/* deliberately quiet next to the red booking path: one compact list,
   composed from the client's own policy wording on trip-info */
.book-policies{
  margin-top:clamp(2.25rem,4.5vw,3rem);
  border-top:1px solid var(--line);
  padding-top:clamp(1.75rem,3.5vw,2.25rem);
}
.book-policies h2{
  font-family:var(--display);
  font-stretch:125%;
  font-variation-settings:'wdth' 125;
  font-weight:700;
  font-size:clamp(1.2rem,2.2vw,1.5rem);
  text-transform:uppercase;
  color:var(--cream);
  margin-bottom:1rem;
}
.book-policies ul{
  list-style:none;
  border-left:2px solid var(--blue);
  padding-left:1.1rem;
  max-width:52rem;
}
.book-policies li{
  color:var(--dim);
  font-size:.95rem;
  line-height:1.5;
}
.book-policies li + li{margin-top:.6rem}
.book-policies li a,
.book-policies p a{color:var(--blue-bright);text-decoration:none;border-bottom:1px solid var(--blue)}
.book-policies li a:hover,
.book-policies p a:hover{color:var(--cream);border-color:var(--blue-bright)}
.book-policies p{margin-top:1.1rem;font-size:.95rem}

/* ============ Responsive ============ */
@media (max-width:640px){
  /* base.css floors the shared band at 420px on mobile. The book band is
     still the short one, so it is re-floored here inside a matching query. */
  .page-hero{min-height:260px}
  .page-hero-inner{padding:clamp(2.25rem,9vw,3.25rem) var(--gutter) 1.75rem}
  .page-hero-cta{margin-top:1.1rem;padding-top:1rem}
}
@media (max-width:560px){
  .book-fallback{flex-direction:column;align-items:flex-start;gap:.6rem}
}

/* 44px tap target for the fallback phone link, same technique as the
   contact page: padding grows the hit area, the negative margin keeps the
   text where it was */
.book-fallback .call-link{
  display:inline-block;
  padding-top:1.1em;
  margin-top:-1.1em;
}
