/* versions.css — overrides loaded ONLY by index-v1/v2/v3.html (the compare-shell versions).
   index.html (the deployed page) never loads this file. */

/* Side rail on mobile: R24 killed it outright (style.css @600px `display:none`) because at
   390 it floated mid-viewport and intercepted taps on "Book Free Video Consult". Brought back
   per his call — anchored just above the 56px sticky bottom bar, locked to the icon-only mini
   geometry, so the tap-interception strip is a 44px sliver on the right edge instead of a
   172px band across the content. */
@media (max-width: 600px) {
  .sideRail {
    display: flex;
    top: auto;
    transform: none;
    bottom: calc(56px + env(safe-area-inset-bottom) + 12px);
  }
  .sideRail .sidePill {
    min-width: 0;
    width: 44px;
    height: 44px;
    padding: 8px;
    border-radius: 22px 0 0 22px;
    transform: translateX(0);
    justify-content: center;
  }
  .sideRail .pillText { display: none; }
}

/* ============ V2 + V3 shared ============ */

/* Header blue lifted from the Stunning Canada site — the trust-strip gradient,
   lighter blue into deep navy (globals.css --grad-trust-strip on stunningdentistry.ca).
   V1 keeps the existing navy so the two directions stay comparable. */
body.v2 .siteHeader,
body.v3 .siteHeader {
  background: linear-gradient(136deg, #0057B8 0%, #001070 100%);
}

/* The call button carries the actual number now, not "Call Now" — it is a longer
   string in the same fixed-width header, so the pill tightens to fit at phone width. */
body.v2 .callPill,
body.v3 .callPill {
  font-size: 0.74rem;
  padding: 8px 12px;
  letter-spacing: 0.01em;
}
@media (max-width: 400px) {
  body.v2 .callPill,
  body.v3 .callPill { font-size: 0.68rem; padding: 7px 10px; }
}