/* ============================================================
   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)}

/* 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);
  --fb-radius:0px;
  font-family:var(--body);color:var(--white);
}
/* 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)}
@media(max-width:560px){.lhead .lh-phone{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)}.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) */
