/* Digibro interaction + consistency layer — 2026-09-17
 *
 * Loads last, after every other Digibro stylesheet. It does three things:
 *   1. pulls widget buttons (Elementor, JetFormBuilder) onto the .btn scale
 *   2. gives the whole site one hover / focus / transition language
 *   3. adds the scroll reveal that digibro-system.js drives
 *
 * Every number here is a token from the :root,body layer in digibro-v5.css
 * or derived from one. Do not introduce new literals; edit the tokens.
 */

/* ---------------------------------------------------------------
   1. One button scale
   --------------------------------------------------------------- */
.digibro-page .elementor-button,
.digibro-page .jet-form-builder__submit,
.digibro-page input[type=submit],
.digibro-page button[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:inherit;font-weight:600;font-size:.9375rem;line-height:1.2;
  letter-spacing:-.006em;text-decoration:none;cursor:pointer;
  padding:13px 22px;min-height:48px;
  border:1px solid transparent;border-radius:var(--r,8px);
  transition:background var(--dur,.22s) var(--ease), color var(--dur,.22s) var(--ease), box-shadow var(--dur,.22s) var(--ease), transform var(--dur,.22s) var(--ease);
}
.digibro-page .elementor-button:hover,
.digibro-page .jet-form-builder__submit:hover,
.digibro-page input[type=submit]:hover,
.digibro-page button[type=submit]:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(6,0,240,.22);
}
.digibro-page .elementor-button:active,
.digibro-page .jet-form-builder__submit:active,
.digibro-page input[type=submit]:active,
.digibro-page button[type=submit]:active{ transform:none;box-shadow:none }

/* three sizes, nothing in between */
.digibro-page .elementor-size-sm .elementor-button,
.digibro-page .elementor-button.elementor-size-sm{ padding:10px 16px;min-height:42px;font-size:.875rem }
.digibro-page .elementor-size-lg .elementor-button,
.digibro-page .elementor-button.elementor-size-lg{ padding:15px 27px;min-height:54px;font-size:1rem }

/* accent green is the teardown offer only; every other primary action is blue */
.digibro-page .btn-accent:hover{ box-shadow:0 8px 20px rgba(10,159,110,.26) }

/* ---------------------------------------------------------------
   2. One hover / focus / transition language
   --------------------------------------------------------------- */
.digibro-page a{ transition:color var(--dur,.22s) var(--ease), opacity var(--dur,.22s) var(--ease) }

/* keyboard focus: same ring everywhere, never removed */
.digibro-page a:focus-visible,
.digibro-page button:focus-visible,
.digibro-page input:focus-visible,
.digibro-page select:focus-visible,
.digibro-page textarea:focus-visible,
.digibro-page [tabindex]:focus-visible{
  outline:2px solid var(--blue,#0600F0);
  outline-offset:3px;
  border-radius:var(--r,8px);
}
.digibro-page .dark a:focus-visible,
.digibro-page .dark button:focus-visible{ outline-color:#fff }

/* form fields answer to focus the same way on every page */
.digibro-page .jet-form-builder__field:focus,
.digibro-page input[type=text]:focus,
.digibro-page input[type=email]:focus,
.digibro-page input[type=tel]:focus,
.digibro-page input[type=url]:focus,
.digibro-page textarea:focus,
.digibro-page select:focus{
  outline:none;
  border-color:var(--blue,#0600F0);
  box-shadow:0 0 0 3px rgba(6,0,240,.14);
}

/* cards lift, they do not jump */
.digibro-page .card,
.digibro-page .crd,
.digibro-page .toccard,
.digibro-page .wk-card,
.digibro-page .svc-card,
.digibro-page .pkg-card{
  transition:transform var(--dur,.22s) var(--ease), box-shadow var(--dur,.22s) var(--ease), border-color var(--dur,.22s) var(--ease);
}
.digibro-page .card:hover,
.digibro-page .crd:hover,
.digibro-page .toccard:hover,
.digibro-page .wk-card:hover,
.digibro-page .svc-card:hover,
.digibro-page .pkg-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(11,11,18,.09);
  border-color:var(--blue-soft-2,#DEDCFF);
}

/* images inside a linked card settle instead of snapping */
.digibro-page a .wk-cover img,
.digibro-page .card img{ transition:transform var(--dur-slow,.45s) var(--ease) }
.digibro-page a:hover .wk-cover img,
.digibro-page .card:hover img{ transform:scale(1.03) }

/* ---------------------------------------------------------------
   3. Scroll reveal — resting state is visible; JS opts elements in
   --------------------------------------------------------------- */
.dg-reveal{
  opacity:0;
  transform:translateY(10px);
  transition:opacity var(--dur-slow,.45s) var(--ease), transform var(--dur-slow,.45s) var(--ease);
  transition-delay:var(--dg-delay,0ms);
  will-change:opacity,transform;
}
.dg-reveal.is-in{ opacity:1;transform:none }

@media (prefers-reduced-motion:reduce){
  .dg-reveal,
  .dg-reveal.is-in{ opacity:1 !important;transform:none !important;transition:none !important }
  .digibro-page *,
  .digibro-page *::before,
  .digibro-page *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}
