/**
 * DBC responsive tokens — match Elementor Site Settings → Layout defaults.
 *
 * Use var(--dbc-bp-*) in properties (width, padding, clamp, etc.).
 * For @media queries, browsers require literal px; copy values from this file
 * or from dbc-breakpoints.php constants (DBC_BP_*).
 */

:root {
  /* Elementor breakpoint names (max-width unless noted) */
  --dbc-bp-mobile: 767px; /* Mobile portrait */
  --dbc-bp-mobile-extra: 880px; /* Mobile landscape */
  --dbc-bp-tablet: 1024px; /* Tablet portrait */
  --dbc-bp-tablet-extra: 1200px; /* Tablet landscape */
  --dbc-bp-laptop: 1366px;
  --dbc-bp-widescreen: 2400px; /* use with min-width */

  /* Optional: extra-narrow phones (not in Elementor defaults) */
  --dbc-bp-mobile-xs: 480px;

  /* min-width “desktop” = one pixel above mobile portrait */
  --dbc-bp-desktop-min: 768px;
}