/*
Theme Name:   Workcenter
Theme URI:    https://www.workcenter.com.br
Description:  Tema filho do GeneratePress para o site Workcenter — Automação Residencial & Integração
Author:       Workcenter
Template:     generatepress
Version:      1.0.8
Text Domain:  workcenter
*/

/* ══════════════════════════════════════════════════════
   WORKCENTER — DESIGN SYSTEM TOKENS
   ══════════════════════════════════════════════════════ */
:root {
  /* Green spectrum */
  --wc-green-900: #0A3D0A;
  --wc-green-800: #145214;
  --wc-green-700: #1B6B1B;
  --wc-green-600: #228B22;
  --wc-green-500: #2EAD2E;
  --wc-green-400: #4DC34D;
  --wc-green-300: #6FD86F;
  --wc-green-200: #A3E8A3;
  --wc-green-100: #D4F5D4;
  --wc-green-50:  #EDFCED;

  /* Emerald accent */
  --wc-emerald-700: #0D6B4F;
  --wc-emerald-600: #10886A;
  --wc-emerald-500: #14A884;
  --wc-emerald-400: #2ECDA3;
  --wc-emerald-300: #6FEBB5;

  /* Neutral grayscale */
  --wc-light-50:  #FFFFFF;
  --wc-light-100: #F9FAFB;
  --wc-light-150: #F3F4F6;
  --wc-light-200: #E5E7EB;
  --wc-light-250: #D1D5DB;
  --wc-light-300: #C4C8D0;
  --wc-light-400: #9CA3AF;
  --wc-light-500: #6B7280;
  --wc-light-600: #4B5563;
  --wc-light-700: #374151;
  --wc-light-800: #1F2937;
  --wc-light-900: #111827;

  /* Glass morphism */
  --glass-bg:       rgba(0,0,0,0.02);
  --glass-bg-2:     rgba(0,0,0,0.04);
  --glass-bg-3:     rgba(0,0,0,0.06);
  --glass-border:   rgba(0,0,0,0.06);
  --glass-border-2: rgba(0,0,0,0.10);
  --glass-border-3: rgba(0,0,0,0.15);

  /* Typography */
  --font-display: 'Exo 2', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* Easing curves */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ══════════════ RESET ══════════════ */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: var(--wc-light-300) var(--wc-light-100);
}
body {
  font-family: var(--font-body);
  background: var(--wc-light-50);
  color: var(--wc-light-700);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  position: relative;
}
::selection { background: var(--wc-green-500); color: var(--wc-light-900); }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
img { max-width: 100%; display: block; }
canvas { display: block; visibility: hidden; }
ul { list-style: none; }

/* ══════════════ UTILITIES ══════════════ */
.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 40px);
}
.sr-only {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0,0,0,0);
}

/* Reveal animations */
.reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }