/* ============================================================
   ADAMS AUTO RESTYLING — booking pages (APEX)
   Loaded on /book/ and the /book/<service>/ landing pages.
   Part 1: FinishBay white-label embed theming (scoped to #fb-booking)
   Part 2: high-conversion landing-page components
   ============================================================ */

/* ============================================================
   PART 1 — FinishBay embed → APEX theming
   Aligned to the live rendered DOM (verified .fb-bf__* classes +
   the vendor's own CSS-variable surface). Scoped to #fb-booking.
   ============================================================ */
.book-embed-wrap{margin-top:clamp(2rem,4vw,3rem)}

/* Carbon-framed shell around the embed — matches .info / .mega-feat cards */
#fb-booking{
  position:relative;background:var(--bg2);border:1px solid var(--line);
  padding:clamp(1.25rem,3.5vw,2.4rem);
  clip-path:polygon(0 0,100% 0,100% 100%,22px 100%,0 calc(100% - 22px));
}
#fb-booking::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--red)}
/* Reserve the form's height before FinishBay's script draws it, so the page
   doesn't jump (layout shift) when it appears. Values sit slightly under the
   measured height of the form's first step (2026-09-14): 841px on phones,
   750px tablet, 768-873px desktop. The general /book/ form is taller. */
#fb-booking{min-height:830px}
@media(min-width:768px){#fb-booking{min-height:740px}}
@media(min-width:1024px){#fb-booking{min-height:760px}}
/* /book/ landing pages put the form in a narrower column at laptop widths */
@media(min-width:1024px) and (max-width:1279px){.lform #fb-booking{min-height:860px}}
#fb-booking.fb-booking--full{min-height:970px}
@media(min-width:768px){#fb-booking.fb-booking--full{min-height:800px}}
@media(min-width:1024px){#fb-booking.fb-booking--full{min-height:820px}}
#fb-booking:empty::after{content:"Loading booking form\2026";display:block;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}

/* Map APEX tokens onto the vendor's theming variables.
   --fb-accent is set INLINE by the embed (#c0392b) → needs !important. */
#fb-booking .fb-bf{
  --fb-accent:var(--red) !important;
  --fb-accent-contrast:#fff;
  --fb-fg:var(--white);
  --fb-muted:var(--steel);
  --fb-bg:transparent;
  --fb-field-bg:var(--bg3);
  --fb-border:var(--line2);
  /* Borders of inputs, tiers, slots and packages (added by FinishBay for WCAG 3:1
     non-text contrast). #6e727c is ≥3:1 against the dark field and panel backgrounds. */
  --fb-field-border:#6e727c;
  --fb-radius:0px;
  font-family:var(--body);color:var(--white);
}
/* FinishBay's default "unavailable" grey (#6b7280) and darkened-accent deposit text
   are tuned for light backgrounds; on this dark theme they fall below 4.5:1. */
#fb-booking .fb-bf__day:disabled,
#fb-booking .fb-bf__slot:disabled{color:var(--steel)}
#fb-booking .fb-bf__tier-dep{color:var(--red-2)}
#fb-booking .fb-bf__btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
/* Display type on titles + category / service / tier names */
#fb-booking .fb-bf__title,
#fb-booking .fb-bf__success-title,
#fb-booking .fb-bf__service-name,
#fb-booking .fb-bf__cat-name,
#fb-booking .fb-bf__pkg-name,
#fb-booking .fb-bf__tier-name{
  font-family:var(--disp);font-style:italic;text-transform:uppercase;color:var(--white);letter-spacing:.01em}
/* Mono, tracked-out labels */
#fb-booking .fb-bf__label,
#fb-booking .fb-bf__group-label,
#fb-booking .fb-bf__summary-label,
#fb-booking .fb-bf__step{
  font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase}
/* Step rail pills → dark carbon chips; active pill red w/ white text */
#fb-booking .fb-bf__step{
  font-size:.66rem;background:var(--bg3);color:var(--steel);border:1px solid var(--line2)}
#fb-booking .fb-bf__step--done{background:var(--bg3);color:var(--silver);border-color:var(--line2)}
#fb-booking .fb-bf__step--active{background:var(--red);color:#fff;border-color:var(--red)}
/* Running-total summary bar → dark carbon */
#fb-booking .fb-bf__summary{background:var(--bg3);border:1px solid var(--line);color:var(--white)}
#fb-booking .fb-bf__summary-label{color:var(--steel)}
/* Deposit notice, error, required asterisk, calendar hover, checkbox */
#fb-booking .fb-bf__deposit{background:var(--bg3);border:1px solid var(--line2);color:var(--silver)}
#fb-booking .fb-bf__error{background:rgba(228,11,28,.12);border:1px solid var(--red);color:var(--red-2)}
#fb-booking .fb-bf__req{color:var(--red)}
#fb-booking .fb-bf__day:hover:not(:disabled){background:var(--bg4);color:var(--white)}
#fb-booking .fb-bf input[type="checkbox"]{accent-color:var(--red)}
/* Price tags in the display face */
#fb-booking .fb-bf__service-price,
#fb-booking .fb-bf__pkg-price,
#fb-booking .fb-bf__tier-price{font-family:var(--disp);font-style:italic;color:var(--red)}
/* Primary button → angular APEX red button */
#fb-booking .fb-bf__btn--primary{
  font-family:var(--disp);font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.04em;
  clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);transition:.2s ease}
#fb-booking .fb-bf__btn--primary:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-2px)}
/* Secondary / Back button → ghost */
#fb-booking .fb-bf__btn:not(.fb-bf__btn--primary){
  font-family:var(--disp);font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.04em;
  background:var(--bg3);color:var(--white);border:1px solid var(--line2)}
#fb-booking .fb-bf__btn:not(.fb-bf__btn--primary):hover:not(:disabled){border-color:var(--red);color:var(--red)}
/* Selected states get the red edge */
#fb-booking .fb-bf__service--selected,
#fb-booking .fb-bf__slot--sel,
#fb-booking .fb-bf__day--sel{border-color:var(--red)}

/* ============================================================
   PART 2 — LANDING-PAGE COMPONENTS
   ============================================================ */

/* ---- Simplified header ---- */
header.lhead{position:sticky;top:0;z-index:30;background:rgba(11,12,14,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.lhead .wrap{display:flex;align-items:center;gap:1.2rem;padding-block:.85rem}
.lhead .brand{display:flex;align-items:center;gap:.5rem;flex:none}
.lhead .brand-img{height:38px;width:auto;display:block}
.lhead .lh-right{display:flex;align-items:center;gap:1.1rem;margin-left:auto}
.lhead .lh-phone{font-family:var(--mono);font-size:.82rem;letter-spacing:.02em;color:var(--white);white-space:nowrap}
.lhead .lh-phone b{color:var(--red-2)}
.lhead .lh-right .lh-text{padding-inline:1.2em}
.mcta .mc-text{border-left:1px solid var(--line)}
@media(max-width:560px){.lhead .lh-phone{display:none}.lhead .lh-text{display:none}}

/* ---- Trust chips (in hero) ---- */
.tchips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
.tchip{display:inline-flex;align-items:center;gap:.5rem;background:var(--bg3);border:1px solid var(--line2);
  padding:.5rem .85rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--silver)}
.tchip svg{width:15px;height:15px;color:var(--red);flex:none}
.tchip b{color:var(--white);font-weight:600}
.tchip .stars{color:#ffb400;letter-spacing:.05em}

/* ---- Landing hero: two-column (copy + form) ---- */
.lhero{position:relative;overflow:hidden;background:#050506;border-bottom:2px solid var(--red)}
.lhero::before{content:"";position:absolute;inset:0;background:var(--carbon);opacity:.5;z-index:0}
.lhero::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 15% 0%,rgba(228,11,28,.14),transparent 60%);z-index:0}
.lhero .wrap{position:relative;z-index:1;padding-top:clamp(2.5rem,5vw,3.6rem);padding-bottom:clamp(2.5rem,5vw,3.6rem)}
.lhero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(1.8rem,4vw,3.4rem);align-items:start}
.lhero .crumb{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.lhero .crumb a{color:var(--silver)}.lhero .crumb a:hover{color:var(--red)}
.lhero h1{font-size:clamp(2.3rem,5.2vw,3.9rem);line-height:.96;margin-top:1rem}
.lhero .sub{margin-top:1.1rem;max-width:52ch;color:var(--silver);font-size:1.08rem;line-height:1.6}
.lhero .hero-cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.7rem}
/* phones: Book Now full width, Call + Text side by side beneath it */
@media(max-width:560px){
  .lhero .hero-cta{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
  .lhero .hero-cta .btn{justify-content:center;text-align:center}
  .lhero .hero-cta .btn:first-child,.lhero .hero-cta .btn:last-child:nth-child(2){grid-column:1/-1}
  .lhero .hero-cta .num{display:none}
}
.lform{position:relative}
.lform-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.9rem}
.lform-head .eyebrow{margin:0}
.lform-head .lf-note{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.lform .book-embed-wrap{margin-top:0}
@media(max-width:900px){
  .lhero-grid{grid-template-columns:1fr;gap:2rem}
  .lform{order:2}
}

/* ---- Google rating badge ---- */
.grate{display:inline-flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.grate .gr-stars{color:#ffb400;font-size:1rem;letter-spacing:.06em}
.grate .gr-num{font-family:var(--disp);font-style:italic;font-weight:700;color:var(--white);font-size:1.15rem}
.grate .gr-txt{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}

/* ---- Trust bar (full-width strip) ---- */
.tbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg2)}
.tbar .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);padding:0}
.tbar .ti{background:var(--bg2);padding:1.15rem 1.2rem;display:flex;flex-direction:column;gap:.25rem;align-items:center;text-align:center}
.tbar .ti b{font-family:var(--disp);font-style:italic;font-size:1.5rem;color:var(--white);line-height:1}
.tbar .ti .ti-lbl{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.tbar .ti .stars{color:#ffb400;font-size:1.1rem;letter-spacing:.05em}
@media(max-width:720px){.tbar .wrap{grid-template-columns:1fr 1fr}}

/* ---- Value cards ---- */
.vcards{margin-top:clamp(2rem,4vw,3rem);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.4rem)}
.vcard{background:var(--bg2);border:1px solid var(--line);padding:1.6rem 1.5rem;display:flex;flex-direction:column;gap:.7rem;
  clip-path:polygon(0 0,100% 0,100% 100%,16px 100%,0 calc(100% - 16px));transition:border-color .2s,transform .2s}
.vcard:hover{border-color:var(--red);transform:translateY(-3px)}
.vcard .vc-ico{width:38px;height:38px;color:var(--red)}
.vcard h3{font-size:1.22rem}
.vcard p{color:var(--silver);font-size:.96rem;line-height:1.55}
@media(max-width:820px){.vcards{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.vcards{grid-template-columns:1fr}}

/* ---- Transparent pricing ---- */
.lprice{margin-top:clamp(2rem,4vw,3rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.pcard{background:var(--bg2);padding:1.5rem 1.4rem;display:flex;flex-direction:column;gap:.5rem}
.pcard .pc-name{font-family:var(--disp);font-style:italic;font-weight:700;text-transform:uppercase;color:var(--white);font-size:1.15rem}
.pcard .pc-price{font-family:var(--disp);font-style:italic;font-weight:800;color:var(--red);font-size:2rem;line-height:1}
.pcard .pc-price small{font-family:var(--mono);font-style:normal;font-weight:400;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);display:block;margin-bottom:.2rem}
.pcard .pc-desc{color:var(--silver);font-size:.9rem;line-height:1.5}
.lprice-note{margin-top:1rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--steel)}

/* ---- Before / after gallery ---- */
.bagrid{margin-top:clamp(1.8rem,3vw,2.6rem);display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.5rem)}
.bapair{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;border:1px solid var(--line);background:var(--bg2);padding:.5rem}
.bapair figure{position:relative;margin:0;aspect-ratio:4/3;background:var(--carbon);display:flex;align-items:center;justify-content:center;overflow:hidden}
.bapair img{width:100%;height:100%;object-fit:cover}
.bapair .ba-tag{position:absolute;top:.5rem;left:.5rem;background:rgba(5,5,6,.8);color:var(--white);
  font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;padding:.25rem .5rem;z-index:2}
.bapair .ba-tag.after{background:var(--red)}
.bapair .ba-slot{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--steel);text-align:center;padding:.5rem}
@media(max-width:760px){.bagrid{grid-template-columns:1fr}}

/* ---- Guarantee / risk-reversal ---- */
.guar{margin-top:clamp(2rem,4vw,3rem);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.4rem)}
.gcard{border:1px solid var(--line);background:linear-gradient(180deg,var(--bg2),var(--bg));padding:1.5rem 1.4rem;display:flex;flex-direction:column;gap:.6rem}
.gcard .g-ico{width:34px;height:34px;color:var(--red)}
.gcard h3{font-size:1.14rem}
.gcard p{color:var(--silver);font-size:.93rem;line-height:1.55}
@media(max-width:820px){.guar{grid-template-columns:1fr}}

/* ---- Slim footer ---- */
footer.lfoot{background:#08090b;border-top:1px solid var(--line);margin-top:0}
.lfoot .wrap{display:flex;flex-wrap:wrap;gap:1.5rem 2.5rem;align-items:center;justify-content:space-between;padding-block:2rem}
.lfoot .lf-brand{display:flex;flex-direction:column;gap:.5rem}
.lfoot .brand-word{font-family:var(--disp);font-weight:800;font-style:italic;font-size:1.15rem;text-transform:uppercase;color:var(--white)}
.lfoot .brand-word .slash{color:var(--red)}.lfoot .brand-word b{color:var(--red)}
.lfoot address{font-style:normal;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;line-height:1.9;color:var(--steel)}
.lfoot address a{color:var(--silver);text-decoration:underline;text-underline-offset:2px}.lfoot address a:hover{color:var(--red)}
.lfoot .lf-links{display:flex;flex-wrap:wrap;gap:.4rem 1.3rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.lfoot .lf-links a{color:var(--steel)}.lfoot .lf-links a:hover{color:var(--red)}
.lfoot .lf-copy{width:100%;border-top:1px solid var(--line);padding-block:1rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;color:var(--steel);display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem}

/* ---- Sticky mobile action bar ---- */
.mcta{position:fixed;left:0;right:0;bottom:0;z-index:35;display:none;gap:1px;background:var(--line);border-top:1px solid var(--line2)}
.mcta a{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem;
  font-family:var(--disp);font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.03em;font-size:1rem}
.mcta .mc-call{background:var(--bg3);color:var(--white)}
.mcta .mc-book{background:var(--red);color:#fff}
.mcta svg{width:17px;height:17px}
@media(max-width:900px){.mcta{display:flex}body{padding-bottom:56px}}

/* reveal helper already in site.css (.rise) */
