/*
Theme Name: NexaGulf
Theme URI: https://nexagulf.com
Author: NexaGulf
Author URI: https://nexagulf.com
Description: GCC finance, explained with sources. An Elementor-compatible editorial theme for independent GCC finance intelligence -- banking, markets, tax, policy and fintech across UAE, Saudi Arabia, Qatar, Kuwait, Bahrain and Oman. Ships with a suite of eight functional finance calculators and a built-in structured-data layer for search and AI crawlers.
Version: 3.1.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nexagulf
Tags: elementor, news, editorial, custom-menu, custom-logo, featured-images, translation-ready, rtl-language-support
*/

/* ==========================================================================
   NexaGulf -- Design tokens

   One typeface: Inter, across display and UI. Editorial character comes from
   weight contrast, tight tracking at large sizes, hairline rules and tabular
   figures -- not from a second family.

   Surface model: white page, cool neutral panels. No warm/beige tint anywhere.
   --ng-paper / --ng-white / --ng-rule are kept as aliases so existing markup
   and any custom CSS written against v2 keeps resolving.
   ========================================================================== */

:root {
  /* Surfaces */
  --ng-bg:         #FFFFFF;
  --ng-surface:    #F4F6F7;
  --ng-surface-2:  #EAEEF0;
  --ng-ink:        #0B0F14;
  --ng-ink-soft:   #2A3239;
  --ng-muted:      #5A6570;
  --ng-muted-soft: #8B959E;
  --ng-line:       #E2E7EA;
  --ng-line-strong:#C9D1D6;

  /* Brand */
  --ng-green:      #0D6B4E;
  --ng-green-dark: #08543C;
  --ng-green-tint: #EDF5F1;
  --ng-mint:       #2FC992;
  /* Height of the sticky masthead. Anything else that sticks (the country
     matrix header) offsets by this so the two never overlap. */
  --ng-header-h:   67px;

  --ng-amber:      #9A6207;
  --ng-amber-tint: #FBF3E4;
  --ng-danger:     #A32D2D;
  --ng-danger-bg:  #FBEDED;

  /* v2 aliases -- kept so nothing written against the old names breaks */
  --ng-paper:       var(--ng-bg);
  --ng-white:       var(--ng-surface);
  --ng-rule:        var(--ng-line);
  --ng-rule-strong: var(--ng-line-strong);

  /* Type -- single family */
  --ng-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ng-font-display: var(--ng-font-body);
  --ng-font-mono:    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  --ng-fs-display: 56px;
  --ng-fs-h1: 46px;
  --ng-fs-h2: 34px;
  --ng-fs-h3: 24px;
  --ng-fs-h4: 19px;
  --ng-fs-lead: 19px;
  --ng-fs-body: 17px;
  --ng-fs-small: 15px;
  --ng-fs-meta: 12.5px;

  --ng-lh-tight: 1.08;
  --ng-lh-head: 1.18;
  --ng-lh-body: 1.65;

  /* Space */
  --ng-space-1: 8px;
  --ng-space-2: 12px;
  --ng-space-3: 16px;
  --ng-space-4: 24px;
  --ng-space-5: 32px;
  --ng-space-6: 48px;
  --ng-space-7: 72px;
  --ng-space-8: 96px;

  /* Layout */
  --ng-container: 1200px;
  --ng-container-wide: 1320px;
  --ng-article-w: 700px;
  --ng-gutter: 24px;

  --ng-radius: 6px;
  --ng-radius-md: 10px;
  --ng-radius-lg: 14px;

  --ng-shadow-sm: 0 1px 2px rgba(11,15,20,.05);
  --ng-shadow:    0 4px 16px -6px rgba(11,15,20,.14);
  --ng-shadow-lg: 0 18px 44px -20px rgba(11,15,20,.28);

  --ng-ease: cubic-bezier(.22,.9,.32,1);
  --ng-dur: .18s;
}

@media (max-width: 1120px) {
  :root { --ng-space-7: 56px; --ng-space-8: 64px; --ng-fs-display: 44px; --ng-fs-h1: 38px; --ng-fs-h2: 29px; }
}
@media (max-width: 640px) {
  :root {
    --ng-fs-display: 33px; --ng-fs-h1: 31px; --ng-fs-h2: 25px; --ng-fs-h3: 20px;
    --ng-fs-body: 16.5px; --ng-space-6: 32px; --ng-space-7: 44px; --ng-space-8: 48px; --ng-gutter: 18px;
  }
}
