/*
Theme Name: InnovatScale V2
Theme URI: https://innovatscale.com
Author: InnovatScale
Author URI: https://innovatscale.com
Description: Innov@Scale V2 — Restructured theme with Consulting / Solutions / Implementation pillar navigation.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
Text Domain: innovatscale
*/

/* ============================================================
   DESIGN TOKENS — CSS Custom Properties
   ============================================================ */
:root {
  /* Colors */
  --color-primary-start: #7CEDB9;
  --color-primary-end:   #5BF3E0;
  --color-dark-bg:       #0D1936;
  --color-dark-bg-alt:   #111D45;
  --color-light-bg:      #F5F9FC;
  --color-white:         #FFFFFF;
  --color-text-navy:     #0D1936;
  --color-text-muted:    #6B7A99;
  --color-border:        #E2EAF4;

  /* Gradients */
  --gradient-primary:    linear-gradient(135deg, #7CEDB9, #5BF3E0);
  --gradient-dark:       linear-gradient(135deg, #0D1936, #111D45);

  /* Typography */
  --font-family:         'Nunito', sans-serif;
  --font-weight-regular: 400;
  --font-weight-semi:    600;
  --font-weight-bold:    700;

  /* Sizing */
  --radius-card:         12px;
  --radius-pill:         50px;
  --radius-sm:           6px;

  /* Spacing */
  --section-py:          80px;
  --container-max:       1240px;
  --container-px:        24px;

  /* Transitions */
  --transition-base:     0.3s ease;
  --transition-slow:     0.6s ease;

  /* Shadows */
  --shadow-card:         0 4px 24px rgba(13, 25, 54, 0.08);
  --shadow-card-hover:   0 8px 40px rgba(92, 243, 224, 0.18);
  --shadow-nav:          0 2px 20px rgba(13, 25, 54, 0.12);
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: var(--font-family);
  font-weight: var(--font-weight-regular);
  color: var(--color-text-navy);
  background: var(--color-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol {
  list-style: none;
}

button {
  cursor: pointer;
  font-family: inherit;
  border: none;
  background: none;
}

/* ============================================================
   UTILITY CLASSES
   ============================================================ */
.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-px);
}

.section {
  padding: var(--section-py) 0;
}

.section--dark {
  background: var(--color-dark-bg);
  color: var(--color-white);
}

.section--dark-alt {
  background: var(--color-dark-bg-alt);
  color: var(--color-white);
}

.section--light {
  background: var(--color-light-bg);
}

.section--white {
  background: var(--color-white);
}

.section--gradient {
  background: var(--gradient-primary);
}

.text-center { text-align: center; }
.text-muted   { color: var(--color-text-muted); }
.text-white   { color: var(--color-white); }

.gradient-text {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Visually hidden */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Reveal animation hook */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
