/*
Theme Name: Astra Child STOCO RH
Theme URI: https://stocorh.com.br/
Description: Tema filho customizado para STOCO RH - Design System "Humanity First HR".
Author: Antigravity AI
Author URI: https://deepmind.google/
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child-stocorh
*/

/* 
   STOCO RH - DESIGN SYSTEM MAP
   Theme: Humanity First HR
   Visual Identity: Professional, Humanized, Trustworthy
*/

:root {
  /* COLORS */
  --primary: #004996;
  --primary-container: #d6e3ff;
  --on-primary: #ffffff;
  --secondary: #4caf50; /* Brand green seen in "Pessoas que transformam" */
  --on-secondary: #ffffff;

  --surface: #f8f9fa;
  --surface-container-lowest: #ffffff;
  --surface-container-low: #f3f4f5;
  --surface-container: #eeeeef;
  --on-surface: #1a1c1e;
  --on-surface-variant: #44474e;

  --outline: #74777f;
  --outline-variant: #c4c6cf;

  /* TYPOGRAPHY (Manrope) */
  --font-main: 'Manrope', sans-serif;

  --text-display: 800 2.5rem/1.2 var(--font-main);
  --text-headline: 700 2rem/1.2 var(--font-main);
  --text-title: 600 1.25rem/1.4 var(--font-main);
  --text-body: 400 1rem/1.5 var(--font-main);
  --text-label: 500 0.875rem/1.2 var(--font-main);

  /* RADIUS */
  --radius-sm: 4px;
  --radius-md: 8px; /* ROUND_EIGHT Preset */
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* SPACING & GRIDS */
  --margin-mobile: 16px;
  --margin-desktop: 80px;
  --gutter: 24px;
  --unit: 8px;
}

/* GLOBAL OVERRIDES FOR ASTRA */
body, p {
  font: var(--text-body);
  color: var(--on-surface-variant);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-main);
  color: var(--primary);
}

/* COMPONENT MAPPING */

/* 1. Navigation (TopAppBar) */
.main-header-bar, .nav-bar {
  background: var(--surface) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  padding: 1rem var(--margin-mobile);
}

.site-title a, .brand-logo {
  font-family: var(--font-main) !important;
  font-weight: 800 !important;
  color: var(--primary) !important;
  font-size: 1.5rem;
}

/* 2. Hero Section (Compatível com Elementor/Gutenberg) */
.hero-title, .entry-title {
  font: var(--text-display);
  color: var(--primary);
}

.hero-highlight {
  color: var(--secondary);
}

/* 3. Buttons (Primary & Secondary) */
.btn-primary, .button, .wp-block-button__link {
  background-color: var(--primary) !important;
  color: var(--on-primary) !important;
  padding: 12px 24px !important;
  border-radius: var(--radius-md) !important;
  font-weight: 600;
  transition: opacity 0.2s, transform 0.1s;
  border: none;
}

.btn-secondary {
  border: 1px solid var(--primary) !important;
  color: var(--primary) !important;
  background: transparent !important;
}

/* 4. Cards (Services / Values) */
.card, .wp-block-column {
  background: var(--surface-container-lowest);
  border-radius: var(--radius-md);
  padding: var(--gutter);
  border: 1px solid var(--outline-variant);
  transition: box-shadow 0.3s;
}

.card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* 5. Forms */
.input-field, input[type="text"], input[type="email"], textarea {
  width: 100%;
  padding: 12px;
  background: var(--surface-container-low);
  border: 1px solid var(--outline-variant);
  border-radius: var(--radius-md);
  font: var(--text-body);
}

/* 6. Footer */
.site-footer, .footer {
  background: var(--primary) !important;
  color: var(--on-primary) !important;
  padding: 48px var(--margin-mobile);
}

.site-footer a {
  color: var(--on-primary);
  opacity: 0.8;
}