/*
 Theme Name:   Invena Child
 Theme URI:    https://reactheme.com/products/wordpress/invena
 Description:  Invena Child
 Author:       ReacThemes
 Author URI:   http://reactheme.com
 Template:     invena
 Version:      1.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
 */

/* ==========================================================================
   FSD-Tech design tokens
   Source: Claude Design project e7ca4d8d-f2cc-492b-851b-40f82849945d
   Colors/typography also mirrored into the Elementor Global Kit (post 20620)
   so bound widgets pick them up automatically; these custom properties cover
   spacing/radius/shadow/motion, which have no direct Elementor Kit equivalent.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* ---- Colors ---- */
  --fsd-blue-50:  #eaf4fb;
  --fsd-blue-100: #dceefa;
  --fsd-blue-200: #b9cedd;
  --fsd-blue-300: #76b8e2;
  --fsd-blue-400: #3c9cd4;
  --fsd-blue-500: #2c91ce;
  --fsd-blue-600: #047cc4;
  --fsd-blue-700: #0b84c6;
  --fsd-blue-800: #0880cc;
  --fsd-blue-900: #1484c7;
  --fsd-blue-950: #047cbc;

  --fsd-gray-50:  #f6f8fa;
  --fsd-gray-100: #eef1f4;
  --fsd-gray-200: #dde3e8;
  --fsd-gray-300: #c3ccd4;
  --fsd-gray-400: #9aa7b2;
  --fsd-gray-500: #74838f;
  --fsd-gray-600: #5c6b78;
  --fsd-gray-700: #46535e;
  --fsd-gray-800: #2f3941;
  --fsd-gray-900: #1a2127;

  --fsd-navy-900: #002060;
  --fsd-navy-700: #1c3a72;
  --fsd-navy-500: #4a5f8a;

  --fsd-sage-400: #8fac97;
  --fsd-sage-500: #70947c;
  --fsd-sage-600: #5a7a65;

  --fsd-white: #ffffff;
  --fsd-black: #101214;

  --color-primary: var(--fsd-blue-600);
  --color-primary-hover: #035f94;
  --color-primary-active: #024a75;
  --color-primary-subtle: #d9edfb;
  --color-primary-border: var(--fsd-blue-300);

  --color-accent: var(--fsd-sage-500);
  --color-accent-hover: var(--fsd-sage-600);

  --text-heading: var(--fsd-navy-700);
  --text-body: var(--fsd-navy-900);
  --text-muted: var(--fsd-navy-500);
  /* WCAG AA fix: raw rgba(255,255,255,.72) on --surface-inverse measured 4.06:1 (fails
     normal-text AA). This solid tint measures 5.08:1 -- use for muted/secondary text
     on any dark section (hero dark variant, footer), not the translucent white. */
  --text-muted-on-dark: #a3b0c8;
  --text-on-primary: var(--fsd-white);
  --text-link: var(--color-primary);
  --text-link-hover: var(--color-primary-hover);

  --surface-page: var(--fsd-white);
  --surface-card: var(--fsd-white);
  --surface-sunken: var(--fsd-gray-50);
  --surface-inverse: #0d3b73;
  --surface-primary: var(--color-primary);

  --border-subtle: var(--fsd-gray-200);
  --border-default: var(--fsd-gray-300);
  --border-primary: var(--color-primary);

  --state-success: #2f9e58;
  --state-warning: #c98a1c;
  --state-danger: #c94b3f;
  --state-info: var(--color-primary);

  /* ---- Typography ---- */
  --font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.375rem;
  --text-xl: 1.75rem;
  --text-2xl: 2.25rem;
  --text-3xl: 2.875rem;
  --text-4xl: 3.5rem;

  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-normal: 1.55;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.12em;

  /* ---- Spacing / radius / shadow / motion ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(16, 32, 48, 0.06);
  --shadow-md: 0 4px 16px rgba(16, 32, 48, 0.08);
  --shadow-lg: 0 12px 32px rgba(16, 32, 48, 0.12);
  --shadow-focus: 0 0 0 3px rgba(4, 124, 196, 0.25);

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 360ms;

  --content-max: 1200px;
  --border-width: 1px;
}

/* ==========================================================================
   Base overrides -- things Elementor's Global Kit can't reach (radius/shadow
   on buttons+cards, body font stack, focus states). Global colors/fonts for
   headings/body/buttons/links are handled via the Elementor Kit (post 20620)
   so bound widgets update automatically; this covers the rest.
   Logical properties used throughout (margin-inline/padding-inline, not
   left/right) so this survives an eventual RTL locale without changes --
   Invena ships no rtl.css of its own, so this discipline is the only RTL
   safety net today.
   ========================================================================== */

body,
button,
input,
select,
textarea {
  font-family: var(--font-sans);
}

a {
  color: var(--text-link);
}
a:hover {
  color: var(--text-link-hover);
}

/* Buttons -- Invena/Elementor button classes */
.elementor-button,
.rt-btn,
button.rt-btn,
a.rt-btn {
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: background-color var(--duration-base) var(--ease-standard),
              box-shadow var(--duration-base) var(--ease-standard);
}
.elementor-button:hover,
.rt-btn:hover {
  box-shadow: var(--shadow-md);
}
.elementor-button:focus-visible,
.rt-btn:focus-visible,
a:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

/* Cards */
.elementor-widget-rt-service-grid .service-item,
.elementor-widget-icon-box .elementor-icon-box-wrapper,
.rt-card {
  background: var(--surface-card);
  border: var(--border-width) solid var(--border-subtle);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--duration-base) var(--ease-standard);
}
.elementor-widget-rt-service-grid .service-item:hover,
.rt-card:hover {
  box-shadow: var(--shadow-md);
}

/* Dark/inverse sections (hero dark variant, footer) */
.fsd-surface-inverse {
  background: var(--surface-inverse);
  color: var(--fsd-white);
}
.fsd-surface-inverse .fsd-muted-text {
  color: var(--text-muted-on-dark);
}