/* eDariba — lp.css (shared landing-page layer)
   ----------------------------------------------------------------------------
   Loaded by the three landing-page templates via inc/enqueue.php as the
   `edariba-shared-layer` handle, BEFORE the per-page CSS file:

       edariba-fonts → edariba-brand → edariba-shared (shared.css)
                    → edariba-shared-layer (lp.css) → edariba-page (per-page)

   Dependencies:
     - brand.css         (global design tokens)
     - shared.css        (global .nav, .footer, .footer-frame, .footer-newsletter,
                          .footer-grid, .footer-col, .footer-bottom, .footer-socials,
                          .menu-btn, .mobile-menu, .scrolled, global .btn base)

   Converted-to-Tailwind sections have been REMOVED from this file (not just
   left dead) — same reasoning as shared.css: unlayered CSS always beats
   @layer utilities regardless of specificity. Removed: the legacy layout
   wrapper override (the templates now rely on Tailwind's native utility),
   .btn/.btn-primary/.btn-white/.btn-outline (→ utility classes
   directly on every `btn`-tagged element in template-landing-accountants.php
   and template-landing-doctors.php — ecommerce already fully redeclares its
   own .btn in landing-ecommerce.css so was untouched), .section (→ `py-9`
   directly in accountants/doctors markup), the .hero scaffolding (.hero,
   .hero-grid-bg, .hero-content, .hero-split, .hero-text, .hero-badge, .hero
   h1, .hero-sub, .hero-actions — converted to utilities; doctors keeps the
   literal "hero" class since landing-doctors.css fully re-declares `.hero`
   itself with different padding), .day-flow/.day-col/.day-step/.step-num/
   .step-text (dead — 0 usages found in any of the 3 templates), and
   .faq-list's box model (→ utilities on the wrapping div; the "faq-list"
   class name itself is KEPT in markup because landing-accountants.css uses
   `.faq-list > .reveal:nth-child(n)` for stagger delays), and .reveal/
   .reveal.visible (→ the global `.reveal` @utility in src/tailwind.css,
   already reused verbatim — no markup change needed).

   Still here, deliberately NOT converted:
     - :root token block — brand.css/tailwind.css's @theme define the
       SITE-WIDE tokens, but these are genuinely different landing-page-only
       values (e.g. --bg: #f9fbf6 vs global --color-brand-bg: #F7F7F7,
       --fg: #0c4242 vs global near-black). They're also a hard dependency
       of the three landing pages' still-unconverted per-page CSS files
       (landing-accountants.css/landing-doctors.css/landing-ecommerce.css —
       out of scope for this task, ~500-800 var(--...) references each) —
       deleting this block would break those files.
     - Landing-page html/body/img presentation — these rules reference the
       landing-only tokens. Box-model resets are owned by Tailwind Preflight;
       duplicating margin/padding resets here would override layered utilities.
   .faq-item was a byte-for-byte duplicate of shared.css's still-active
   .faq-item rule, so it was deleted from here too (shared.css's copy is the
   one that survives — task 7 owns any further changes to it).

   .nav and .footer are NOT redefined here — shared.css owns them.
   ---------------------------------------------------------------------------- */

:root {
  --bg: #f9fbf6;
  --surface: #ffffff;
  --fg: #0c4242;
  --muted: #5d6c7b;
  --border: #e2e4df;
  --accent: #c3e9a0;
  --accent-light: #d4edc0;
  --teal: #0c4242;
  --teal-soft: #f1f8f9;
  --success: #2d8a5e;
  --font-display: 'IBM Plex Sans Arabic', 'Tajawal', system-ui, sans-serif;
  --font-body: 'Tajawal', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-2xl: 40px;
  --radius-full: 999px;
  --shadow-sm: 0 2px 8px rgba(12, 66, 66, 0.06);
  --shadow-md: 0 8px 24px rgba(12, 66, 66, 0.08);
  --shadow-lg: 0 20px 48px rgba(12, 66, 66, 0.12);
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  /* === compat vars used by ported sections (accountants + doctors) === */
  --root-dark: #0C4242;
  --teal-deep: #072e2e;
  --teal-muted: #f1f8f9;
  --text-display: clamp(32px, 3.5vw, 48px);
  --text-headline: clamp(24px, 2.5vw, 32px);
  --text-title: 24px;
  --text-body-lg: 18px;
  --text-body: 16px;
  --text-label: 14px;
  --text-caption: 12px;
  --font-mono: 'IBM Plex Mono', 'Courier New', monospace;
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---- Landing-page base presentation (box model is Tailwind-owned) ---- */
html { scroll-behavior: smooth; background: var(--bg); }
body { font-family: var(--font-body); font-size: 16px; line-height: 1.75; color: var(--fg); background: var(--bg); }
img { max-width: 100%; display: block; }
