/* ══════════════════════════════════════════════════════════════════════════
   vijai-cta.css · the CTA and enquiry standard · CR-24, 11 September 2026
   ──────────────────────────────────────────────────────────────────────────
   Load this on EVERY page that carries a CTA button. It is the only stylesheet
   the CTA standard needs, and it depends on nothing except the design tokens
   in vijai-chrome.css, which every page already loads.

   Pages built on vijai-base.css already carry identical rules. Loading both is
   harmless · the declarations are the same. Pages that do NOT load base (the
   homepage is the first) must load this file instead.

   Rules moved here verbatim from vijai-base.css so the CTA standard travels
   as one file rather than as a dependency on the whole template sheet.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── CR-13 · the enquiry dialog ─────────────────────────────────────────────
   The Bitrix inline embed lives inside this dialog and renders on page load, so
   the form is ready the moment a CTA is pressed. Kept out of the layout with
   visibility rather than display:none, so Bitrix measures a real box. The panel
   is light because the Bitrix form styles itself for a light surface, the same
   way the enquiry section does. */
.vbmodal{position:fixed;inset:0;z-index:9000;opacity:0;visibility:hidden;
  pointer-events:none;transition:opacity .18s ease}
.vbmodal.is-open{opacity:1;visibility:visible;pointer-events:auto}
.vbmodal-bd{position:absolute;inset:0;background:rgba(5,11,18,.84);backdrop-filter:blur(3px)}
.vbmodal-in{position:relative;max-width:560px;margin:0 auto;top:50%;
  transform:translateY(-50%) scale(.985);background:var(--pn);border:1px solid var(--rl);
  border-radius:14px;padding:26px 26px 20px;max-height:88vh;overflow-y:auto;
  box-shadow:0 40px 90px rgba(0,0,0,.55);transition:transform .18s ease}
.vbmodal.is-open .vbmodal-in{transform:translateY(-50%) scale(1)}
.vbmodal-h{margin:0 0 14px;font-size:19px;font-weight:700;color:var(--tx);letter-spacing:-.01em}
.vbmodal-x{position:absolute;top:12px;right:14px;width:36px;height:36px;line-height:1;
  font-size:26px;background:transparent;border:0;color:var(--tx2);cursor:pointer;border-radius:8px}
.vbmodal-x:hover{color:var(--tx);background:var(--sk)}
.vbmodal-f{margin:14px 0 0;padding-top:14px;border-top:1px solid var(--rl);
  font-size:13.5px;line-height:1.6;color:var(--tx2)}
.vbmodal-f a{color:var(--cyd)}
@media(max-width:640px){
  .vbmodal-in{margin:0 12px;padding:22px 18px 16px;max-height:92vh}
}

/* ── CR-13 · the Bitrix click-mode hook ─────────────────────────────────────
   The CEO's click snippet lives inside .vbb24hook, off-screen but in the flow.
   If Bitrix ever renders a trigger there, .vbb24 brands it to match .btn. */
.vbb24{display:inline-block}
.vbb24hook{position:absolute;left:-9999px;top:0;width:1px;height:1px;overflow:hidden}
.vbb24 button, .vbb24 a, .vbb24 [role="button"]{
  background:var(--cy) !important;color:#04212E !important;font-weight:700 !important;
  font-size:15.5px !important;padding:16px 30px !important;border-radius:8px !important;
  border:0 !important;cursor:pointer;text-decoration:none !important;display:inline-block;
  line-height:1.2 !important;letter-spacing:0 !important;box-shadow:none !important;
  transition:transform .18s, box-shadow .18s}
.vbb24 button:hover, .vbb24 a:hover, .vbb24 [role="button"]:hover{
  transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,185,242,.42) !important}

/* ── CR-24 · the CTA row ────────────────────────────────────────────────────
   One CTA per row, its own vertical rhythm, centred where the band is centred. */
.ctarow{margin:30px 0 4px}
.cbody .ctarow{margin:34px 0 10px}
.ctarow.mid{margin:34px 0 0;text-align:center}
.ctarow .n{display:block;margin:12px 0 0;font-size:13px;line-height:1.6;color:var(--tx3,#6E8091)}
.dk .ctarow .n,.pn .ctarow .n,.hero .ctarow .n{color:var(--dtx2)}