/* IT3 Telecom — Static brand styles */
:root {
  --brand-purple: oklch(0.42 0.22 300);
  --brand-purple-deep: oklch(0.28 0.18 295);
  --brand-orange: oklch(0.72 0.20 50);
  --brand-orange-glow: oklch(0.78 0.21 55);

  --background: oklch(0.99 0.005 300);
  --foreground: oklch(0.18 0.05 295);
  --muted-foreground: oklch(0.45 0.04 295);
  --border: oklch(0.92 0.01 295);
  --accent: oklch(0.95 0.04 50);
  --secondary: var(--brand-orange);
  --primary: var(--brand-purple);

  --gradient-brand: linear-gradient(135deg, var(--brand-purple-deep) 0%, var(--brand-purple) 45%, var(--brand-orange) 100%);
  --gradient-orange: linear-gradient(135deg, var(--brand-orange) 0%, var(--brand-orange-glow) 100%);
  --gradient-purple: linear-gradient(135deg, var(--brand-purple-deep) 0%, var(--brand-purple) 100%);
  --gradient-card: linear-gradient(180deg, #fff 0%, oklch(0.98 0.01 300) 100%);
  --gradient-hero-overlay: linear-gradient(180deg, oklch(0.18 0.12 295 / 0.85) 0%, oklch(0.28 0.18 295 / 0.7) 60%, oklch(0.18 0.05 295 / 0.95) 100%);

  --shadow-brand: 0 20px 50px -20px oklch(0.42 0.22 300 / 0.45);
  --shadow-orange: 0 18px 45px -18px oklch(0.72 0.20 50 / 0.55);
  --shadow-card: 0 8px 30px -10px oklch(0.28 0.18 295 / 0.18);
}

html { scroll-behavior: smooth; }
body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: "Inter", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  margin: 0;
}
h1,h2,h3,h4,h5,h6 { font-family: "Sora", system-ui, sans-serif; letter-spacing: -0.02em; }

/* Brand colors */
.text-primary { color: var(--primary); }
.text-secondary { color: var(--secondary); }
.text-foreground { color: var(--foreground); }
.text-muted-foreground { color: var(--muted-foreground); }
.bg-accent { background-color: var(--accent); }
.bg-accent\/40 { background-color: oklch(0.95 0.04 50 / 0.4); }
.bg-accent\/60 { background-color: oklch(0.95 0.04 50 / 0.6); }
.bg-background { background-color: var(--background); }
.bg-brand-purple { background-color: var(--brand-purple); }
.border-border { border-color: var(--border); }
.border-primary { border-color: var(--primary); }

/* Gradient backgrounds */
.bg-gradient-brand { background-image: var(--gradient-brand); }
.bg-gradient-orange { background-image: var(--gradient-orange); }
.bg-gradient-purple { background-image: var(--gradient-purple); }
.bg-gradient-card { background-image: var(--gradient-card); }
.bg-hero-overlay { background: var(--gradient-hero-overlay); }
.bg-gradient-to-b-accent { background-image: linear-gradient(to bottom, oklch(0.95 0.04 50 / 0.4), var(--background)); }

/* Gradient text */
.text-gradient-brand,
.text-gradient-orange {
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.text-gradient-brand { background-image: var(--gradient-brand); }
.text-gradient-orange { background-image: var(--gradient-orange); }

/* Shadows */
.shadow-brand { box-shadow: var(--shadow-brand); }
.shadow-orange { box-shadow: var(--shadow-orange); }
.shadow-card { box-shadow: var(--shadow-card); }

/* Transitions */
.transition-smooth { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.transition-bounce { transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }

/* Glass */
.glass {
  background-color: oklch(1 0 0 / 0.08);
  backdrop-filter: blur(20px);
  border: 1px solid oklch(1 0 0 / 0.15);
}

/* Animations */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
@keyframes glow-pulse {
  0%, 100% { opacity: 0.7; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}
.animate-float { animation: float 6s ease-in-out infinite; }
.animate-glow-pulse { animation: glow-pulse 3s ease-in-out infinite; }

/* Header layout helpers */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background-color: var(--brand-purple);
  box-shadow: var(--shadow-brand);
}
.site-main { min-height: 100vh; padding-top: 4rem; }
@media (min-width: 768px) { .site-main { padding-top: 5rem; } }

/* Form controls */
.form-input, .form-textarea {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 0.625rem;
  background: #fff;
  padding: 0.55rem 0.85rem;
  font: inherit;
  color: var(--foreground);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus, .form-textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px oklch(0.42 0.22 300 / 0.18);
}
.form-label {
  display: block;
  font-size: .8rem;
  font-weight: 600;
  margin-bottom: 0.4rem;
  color: var(--foreground);
}

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  border-radius: 0.625rem;
  font-weight: 700;
  padding: 0.625rem 1rem;
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  transition: opacity .2s, transform .2s, background-color .2s, color .2s;
  border: none;
}
.btn-lg { height: 3rem; padding: 0 1.5rem; font-size: 1rem; }
.btn-orange { background-image: var(--gradient-orange); color: #fff; box-shadow: var(--shadow-orange); }
.btn-brand { background-image: var(--gradient-brand); color: #fff; }
.btn-outline-primary { background: transparent; border: 2px solid var(--primary); color: var(--primary); }
.btn-outline-primary:hover { background: var(--primary); color: #fff; }
.btn-ghost-white { background: transparent; color: #fff; }
.btn-ghost-white:hover { background-color: oklch(1 0 0 / 0.1); }
.btn-glass-white {
  background-color: oklch(1 0 0 / 0.08);
  backdrop-filter: blur(20px);
  border: 1px solid oklch(1 0 0 / 0.3);
  color: #fff;
}
.btn-glass-white:hover { background: #fff; color: var(--primary); }
.btn-white { background: #fff; color: var(--primary); }
.btn:hover { opacity: .92; }
.btn-orange:hover, .btn-brand:hover, .btn-white:hover { transform: translateY(-1px); }

/* Lucide icon sizing helpers */
[data-lucide] { width: 1em; height: 1em; }
.icon-sm  { width: 1rem; height: 1rem; }
.icon-md  { width: 1.25rem; height: 1.25rem; }
.icon-lg  { width: 1.5rem; height: 1.5rem; }
.icon-xl  { width: 2rem; height: 2rem; }
.icon-2xl { width: 3.5rem; height: 3.5rem; }

/* WhatsApp float */
.whatsapp-float {
  position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 40;
  width: 3.5rem; height: 3.5rem; border-radius: 9999px;
  background-color: #25D366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-orange);
  animation: glow-pulse 3s ease-in-out infinite;
  transition: transform .3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.whatsapp-float:hover { transform: scale(1.1); }

/* Card hover utility */
.hover-lift:hover { transform: translateY(-4px); }
