html {
  /* Smooth transitions for internal anchors, router jumps, and pagination */
  scroll-behavior: smooth;
  
  /* Forces hardware acceleration and momentum scrolling on mobile browsers */
  -webkit-overflow-scrolling: touch;
  
  /* Tweaks native mouse wheel scroll interpolation where supported */
  overflow-y: auto;
  overscroll-behavior-y: transition;
}

/* Optional: If your property showcase grids or image modals have internal horizontal scroll layouts */
.smooth-carousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.smooth-carousel-item {
  scroll-snap-align: start;
}

:root {
  /* =========================================================
     MATERIAL UI GREEN ECOSYSTEM (White & Green Theme)
     ========================================================= */
  
  /* Primary Theme Brand Actions */
  --color-main: 67 160 71;          /* #43a047 (Material Green 600) */
  --color-main-hover: 56 142 60;    /* #388e3c (Material Green 700) */
  --color-accent: 0 200 83;         /* #00c853 (Material Bright Green Accent) */

  /* Background Canvas Layout Structure (SWAPPED TO WHITE/LIGHT) */
  --color-main-bg: 255 255 255;     /* Pure White Base Canvas */
  --color-surface-bg: 245 245 245;  /* Light Grey Elevational Cards/Surfaces */

  /* High-Contrast Text Nodes (SWAPPED TO DARK FOR LIGHT CANVAS) */
  --color-main-text: 33 33 33;      /* Core Charcoal Black Text */
  --color-sec-text: 117 117 117;    /* Soft Muted Gray Text */
  --color-disabled-text: 189 189 189;

  /* Inverse Ecosystem (In case you drop a dark hero section band) */
  --color-inverse-bg: 18 18 18;     /* Dark Canvas */
  --color-inverse-text: 255 255 255;/* Pure White Text */
  --color-inverse-sec: 176 176 176; /* Soft Muted White Text */
}

/* =========================================================
   Fallback Native Declarations
   ========================================================= */
:root {
  --main: rgb(var(--color-main));
  --main-hover: rgb(var(--color-main-hover));
  --accent: rgb(var(--color-accent));
  --main-bg: rgb(var(--color-main-bg));
  --surface-bg: rgb(var(--color-surface-bg));
  --main-text: rgb(var(--color-main-text));
  --sec-text: rgb(var(--color-sec-text));
  --inverse-bg: rgb(var(--color-inverse-bg));
  --inverse-text: rgb(var(--color-inverse-text));
}