/* ==========================================================================
   Phase A — Conversion enhancements (additive only, no existing rules touched)
   - Floating WhatsApp button (desktop hover label, mobile compact)
   - Sticky mobile booking bar (shows after hero scroll)
   - Hero urgency pill
   - Hero trust strip
   ========================================================================== */

:root {
  --pa-wa-green: #25D366;
  --pa-wa-green-dark: #128C7E;
  --pa-luxury-navy: #0a1628;
  --pa-luxury-navy-2: #050b14;
  --pa-urgent: #e53935;
}

/* ─────────────────────────  Floating WhatsApp  ───────────────────────── */
/* Hard-disabled: site already has its own "Chat with us" floating button. */
.pa-fab-wa { display: none !important; }

/* ─────────  Crisp-icon override for ALL inline floating WhatsApp buttons  ───────── */
/* Letting the browser render the SVG natively (no GPU compositing) for sharpest
   icon edges. Animations are still off, but transform/backface tricks were causing
   sub-pixel softness on some displays — removed them entirely. */
.wa-float,
.float-wa,
.wa-float-btn,
#floating-whatsapp-btn {
  animation: none !important;
  transform: none !important;
  filter: none !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  will-change: auto !important;
}
/* Pulse animation removed — was creating a soft halo that read as "blur".
   Buttons are now clean static green circles. If you ever want the pulse back,
   replace this rule with the previous version (it lived in the file's git history). */
.wa-float::before,
.float-wa::before,
.wa-float-btn::before,
#floating-whatsapp-btn::before {
  display: none !important;
  animation: none !important;
}
.wa-float svg,
.float-wa svg,
.wa-float-btn svg,
#floating-whatsapp-btn svg,
#floating-whatsapp-btn .wa-icon svg {
  shape-rendering: geometricPrecision;
}

/* ════════════════════════════════════════════════════════════════════════════
   Universal WhatsApp button look: green circle, white icon, crisp at all sizes.
   Forces consistent branding across every floating WA button on every page.
   ════════════════════════════════════════════════════════════════════════════ */

/* Green button background, white text/icon — forced everywhere.
   Explicitly disable any animation and use a single sharp drop shadow only. */
.wa-float,
.float-wa,
.wa-float-btn,
#floating-whatsapp-btn {
  background: #25D366 !important;
  color: #ffffff !important;
  animation: none !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18) !important;
  filter: none !important;
}
/* Also kill the inline .wa-pulse companion span that some buttons rely on */
.wa-pulse,
#floating-whatsapp-btn .wa-pulse {
  display: none !important;
  animation: none !important;
}
.wa-float:hover,
.float-wa:hover,
.wa-float-btn:hover,
#floating-whatsapp-btn:hover {
  background: #1da851 !important;
  color: #ffffff !important;
}

/* SVG icon sizing — all WhatsApp buttons use the same FA path (448x512 viewBox).
   shape-rendering:geometricPrecision is the correct SVG hint (image-rendering is for raster). */
.wa-float svg,
.float-wa svg,
.wa-float-btn svg {
  width: 32px !important;
  height: 32px !important;
  fill: #ffffff !important;
  display: block !important;
  shape-rendering: geometricPrecision;
}
.wa-float svg *,
.float-wa svg *,
.wa-float-btn svg * {
  fill: #ffffff !important;
  stroke: none !important;
}

/* Index "Chat with us" button */
#floating-whatsapp-btn .wa-icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
#floating-whatsapp-btn .wa-icon svg {
  width: 32px !important;
  height: 32px !important;
  fill: #ffffff !important;
  display: block !important;
  shape-rendering: geometricPrecision;
}
#floating-whatsapp-btn .wa-icon svg * {
  fill: #ffffff !important;
  stroke: none !important;
}
#floating-whatsapp-btn .wa-label {
  color: #ffffff !important;
}
/* Stop the inline #floating-whatsapp-btn .wa-pulse element from re-blurring the icon */
#floating-whatsapp-btn .wa-pulse {
  animation: none !important;
  display: none !important;
}
@keyframes pa-wa-float-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(37,211,102,.55); }
  70%  { box-shadow: 0 0 0 18px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

.pa-fab-wa--legacy-styles-do-not-use {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9998;
  display: inline-flex;
  align-items: center;
  background: var(--pa-wa-green);
  color: #fff !important;
  border-radius: 999px;
  padding: 14px;
  box-shadow: 0 8px 24px rgba(37,211,102,.40), 0 2px 6px rgba(0,0,0,.15);
  text-decoration: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  isolation: isolate;
  -webkit-font-smoothing: antialiased;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
/* Pulse ring lives on a pseudo-element so the icon never repaints with the animation */
.pa-fab-wa::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: -1;
  pointer-events: none;
  box-shadow: 0 0 0 0 rgba(37,211,102,.55);
  animation: pa-pulse-ring 2.6s ease-out infinite;
}
.pa-fab-wa:hover {
  background: var(--pa-wa-green-dark);
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(37,211,102,.50), 0 4px 8px rgba(0,0,0,.20);
}
.pa-fab-wa:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}
.pa-fab-wa svg {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  display: block;
  shape-rendering: geometricPrecision;
}

.pa-fab-wa-label {
  display: none;
  white-space: nowrap;
  padding: 0 14px 0 10px;
  font-family: inherit;
}
.pa-fab-wa-label .pa-fab-line1 { display: block; font-size: 13px; font-weight: 700; }
.pa-fab-wa-label .pa-fab-line2 { display: block; font-size: 11px; font-weight: 500; opacity: .94; margin-top: 2px; letter-spacing: .2px; }

@media (hover: hover) and (min-width: 769px) {
  .pa-fab-wa:hover .pa-fab-wa-label,
  .pa-fab-wa:focus .pa-fab-wa-label { display: inline-block; }
}

@keyframes pa-pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(37,211,102,.55); }
  70%  { box-shadow: 0 0 0 16px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}

@media (max-width: 768px) {
  .pa-fab-wa {
    bottom: 84px;          /* sit above sticky mobile booking bar */
    right: 16px;
    padding: 12px;
  }
  .pa-fab-wa svg { width: 24px; height: 24px; }
}

/* ─────────────────────────  Sticky CTA Bar (all screens)  ───────────────────────── */
/* Bar is hidden by default — only visible when body.pa-has-mobile-cta is set by JS */
.pa-mobile-cta { display: none; }
/* Extra safety: never show pa-mobile-cta on pages that already have a .mobile-cta bar */
body:has(.mobile-cta) .pa-mobile-cta { display: none !important; }

body.pa-has-mobile-cta .pa-mobile-cta {
  display: flex;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 9997;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  gap: 10px;
  background: rgba(255,255,255,.97);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 -4px 16px rgba(0,0,0,.08);
  transform: translateY(110%);
  transition: transform .35s cubic-bezier(.2,.8,.2,1);
}
body.pa-has-mobile-cta .pa-mobile-cta.is-visible { transform: translateY(0); }
.pa-mobile-cta a,
.pa-mobile-cta button {
  flex: 1;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 12px;
  text-decoration: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .3px;
  transition: transform .12s ease;
  border: none;
  cursor: pointer;
}
.pa-mobile-cta a:active,
.pa-mobile-cta button:active { transform: scale(.97); }
.pa-mobile-cta-wa   { background: var(--pa-wa-green); color: #fff !important; box-shadow: 0 2px 8px rgba(37,211,102,.30); }
.pa-mobile-cta-book { background: var(--pa-luxury-navy); color: #fff !important; box-shadow: 0 2px 8px rgba(10,22,40,.35); }
.pa-mobile-cta a svg,
.pa-mobile-cta button svg { width: 28px !important; height: 28px !important; fill: #ffffff !important; display: block; shape-rendering: geometricPrecision; flex-shrink: 0; }

/* push body content up so the sticky bar doesn't hide content on long pages */
body.pa-has-mobile-cta { padding-bottom: 80px !important; }

/* ─────────────────────────  Booking Modal  ───────────────────────── */
.pa-book-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.65);
  z-index: 99999;
  align-items: flex-end;
  justify-content: center;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.pa-book-overlay.open { display: flex; }
.pa-book-modal {
  background: #fff;
  width: 100%;
  max-width: 480px;
  border-radius: 20px 20px 0 0;
  padding: 24px 20px 32px;
  box-shadow: 0 -8px 40px rgba(0,0,0,.25);
  animation: pa-slide-up .28s cubic-bezier(.2,.8,.2,1);
}
@keyframes pa-slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
.pa-book-modal h3 {
  font-size: 17px;
  font-weight: 800;
  color: #0a1628;
  margin: 0 0 4px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.pa-book-modal .pa-book-sub {
  font-size: 12px;
  color: #777;
  margin: 0 0 20px;
  font-family: inherit;
}
.pa-book-close {
  position: absolute;
  top: 16px; right: 18px;
  background: #f0f0f0;
  border: none;
  border-radius: 50%;
  width: 30px; height: 30px;
  font-size: 16px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #444;
}
.pa-book-modal { position: relative; }
.pa-book-field { margin-bottom: 14px; }
.pa-book-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #0a1628;
  letter-spacing: .8px;
  text-transform: uppercase;
  margin-bottom: 6px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.pa-book-field input,
.pa-book-field select {
  width: 100%;
  padding: 12px 14px;
  border: 2px solid #e0e0e0;
  border-radius: 10px;
  font-size: 15px;
  font-family: inherit;
  color: #0a1628;
  background: #fafafa;
  box-sizing: border-box;
  outline: none;
  transition: border-color .15s;
  -webkit-appearance: none;
  appearance: none;
}
.pa-book-field input:focus,
.pa-book-field select:focus { border-color: #25D366; background: #fff; }
.pa-book-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.pa-book-row { display: flex; gap: 10px; }
.pa-book-row .pa-book-field { flex: 1; }
.pa-book-wa-btn {
  width: 100%;
  background: #25D366;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 15px;
  font-size: 16px;
  font-weight: 800;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
  letter-spacing: .2px;
}
.pa-book-wa-btn:active { background: #1da851; }
.pa-book-note {
  text-align: center;
  font-size: 11px;
  color: #999;
  margin-top: 10px;
  font-family: inherit;
}

/* ─────────────────────────  Hero urgency pill  ───────────────────────── */
.pa-hero-urgency {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 14px auto 0;
  padding: 7px 16px;
  background: rgba(229,57,53,.96);
  color: #fff;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  box-shadow: 0 6px 18px rgba(229,57,53,.35), 0 1px 2px rgba(0,0,0,.2);
  text-shadow: 0 1px 1px rgba(0,0,0,.25);
}
.pa-hero-urgency::before {
  content: "";
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 0 rgba(255,255,255,.7);
  animation: pa-blink 1.6s infinite;
}
@keyframes pa-blink {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(255,255,255,.7); }
  50%      { opacity: .55; box-shadow: 0 0 0 8px rgba(255,255,255,0); }
}

/* ═══════════════════════════════════════════════════════════════════════
   GOOGLE REVIEW BADGE — clickable trust badge linking to Google listing.
   Shows aggregate only (no individual reviews) so no risk of negative reviews
   appearing on your site. Use anywhere with: <a class="g-badge" href="...">...
   ═══════════════════════════════════════════════════════════════════════ */
.g-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 14px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  text-decoration: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: #1a1a1a !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  line-height: 1.2;
}
.g-badge:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
  border-color: rgba(0,0,0,.18);
}
.g-badge-logo {
  width: 22px; height: 22px; flex-shrink: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%234285F4' d='M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z'/><path fill='%2334A853' d='M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z'/><path fill='%23FBBC05' d='M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z'/><path fill='%23EA4335' d='M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
}
.g-badge-text { display: flex; flex-direction: column; gap: 2px; }
.g-badge-stars {
  font-size: 14px; font-weight: 700; letter-spacing: 1px;
  color: #f4b400; line-height: 1;
}
.g-badge-stars .num {
  color: #1a1a1a; font-weight: 800; font-size: 13px;
  letter-spacing: .2px; margin-right: 6px;
}
.g-badge-meta {
  font-size: 11px; color: #555; font-weight: 500; letter-spacing: .2px;
}
.g-badge-meta strong { color: #1a73e8; font-weight: 700; }

/* Centered variant for hero / page tops */
.g-badge--center {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

/* ─────  Hand-picked Google review cards (filled in once user provides text) ────── */
.g-reviews {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 18px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}
.g-review {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 22px 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 4px 14px rgba(0,0,0,.05);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  position: relative;
  color: #1a1a1a;
  transition: transform .15s ease, box-shadow .15s ease;
}
.g-review:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
}
.g-review-header { display: flex; align-items: center; gap: 12px; }
.g-review-avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 17px;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: .3px;
}
.g-review-meta { display: flex; flex-direction: column; gap: 2px; }
.g-review-name { font-weight: 700; font-size: 14px; color: #1a1a1a; }
.g-review-date { font-size: 12px; color: #777; }
.g-review-stars { color: #f4b400; font-size: 15px; letter-spacing: 1px; line-height: 1; }
.g-review-body {
  font-size: 14px; line-height: 1.55; color: #333;
  font-weight: 400;
}
.g-review-source {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; color: #1a73e8; font-weight: 600;
  letter-spacing: .3px; margin-top: 2px;
}
.g-review-source svg { width: 14px; height: 14px; }

/* ─────────────────────────  Hero trust strip  ───────────────────────── */
.pa-trust-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px 22px;
  margin: 18px auto 0;
  padding: 0 14px;
  max-width: 720px;
  font-size: 13px;
  color: rgba(255,255,255,.95);
  font-weight: 500;
  letter-spacing: .25px;
  text-shadow: 0 1px 3px rgba(0,0,0,.55);
}
.pa-trust-strip span { display: inline-flex; align-items: center; gap: 6px; }
.pa-trust-strip span::before {
  content: "✓";
  display: inline-block;
  width: 16px; height: 16px;
  line-height: 16px;
  text-align: center;
  background: rgba(37,211,102,.95);
  color: #fff;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
  text-shadow: none;
}
@media (max-width: 600px) {
  .pa-trust-strip { gap: 8px 14px; font-size: 12px; }
}