/* ==========================================================
   THEME: ELEGANTE
   Vibra: Sobrio, refinado, editorial y atemporal
   Público: Músicos, artistas, estudios y servicios premium
   Paleta: Blanco sobre negro
========================================================== */

:root {
  --primary: #ffffff;
  --primary-hover: #e6e6e6;
  --primary-light: rgba(255, 255, 255, 0.10);
  --primary-gradient: linear-gradient(135deg, #ffffff, #cfcfcf);

  --secondary: #d8d8d8;
  --secondary-light: rgba(255, 255, 255, 0.06);
  --accent: #ffffff;

  --color-background: #090909;
  --color-background-elevated: #090909;
  --color-background-soft: #090909;
  --color-surface: #111111;
  --color-surface-hover: #171717;

  --color-text: #ffffff;
  --color-text-secondary: #c8c8c8;
  --color-text-tertiary: #8f8f8f;
  --color-text-inverse: #050505;

  --color-border: rgba(255,255,255,.05);
  --color-border-hover: rgba(255,255,255,.12);

  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.55);
  --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.62);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.72);
  --shadow-xl: 0 24px 80px rgba(0, 0, 0, 0.82);
  --shadow-glow: 0 0 0 1px rgba(255, 255, 255, 0.08);

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  --header-background: rgba(9,9,9,.72);
  --header-background-scrolled: rgba(9,9,9,.92);
  --header-backdrop-blur: 22px;

  --hero-overlay-background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.30) 65%, transparent),
    linear-gradient(0deg, rgba(0, 0, 0, 0.82), transparent 45%);
  --hero-title-weight: 300;
  --hero-claim-weight: var(--font-weight-regular);
  --hero-split-image-radius: 8px;
  --hero-minimal-max-width: 900px;

  --about-image-radius: 8px;
  --about-image-hover-scale: 1.015;

  --service-card-background: var(--color-surface);
  --service-card-radius: 8px;
  --service-card-border: 1px solid var(--color-border);
  --service-card-hover-border-color: var(--color-border-hover);
  --service-card-hover-shadow: var(--shadow-lg);
  --service-card-hover-translate-y: -1px;
  --service-title-weight: var(--font-weight-semibold);

  --credential-card-background: var(--color-surface);
  --credential-card-radius: 8px;
  --credential-card-border: 1px solid var(--color-border);
  --credential-card-hover-border-color: var(--color-border-hover);
  --credential-card-hover-shadow: var(--shadow-lg);
  --credential-card-hover-translate-y: -1px;
  --credential-title-weight: var(--font-weight-semibold);

  --stats-card-background: var(--color-surface);
  --stats-card-radius: 8px;
  --stats-card-border: 1px solid var(--color-border);
  --stats-card-padding: var(--spacing-xl);
  --stats-card-hover-shadow: var(--shadow-lg);
  --stats-number-weight: 300;

  --gallery-slide-background: var(--color-surface);
  --gallery-slide-radius: 8px;
  --gallery-slide-border: 1px solid var(--color-border);
  --gallery-slide-hover-border-color: var(--color-border-hover);
  --gallery-slide-hover-shadow: var(--shadow-lg);

  --contact-image-radius: 8px;
  --contact-card-background: var(--color-surface);
  --contact-card-radius: 8px;
  --contact-card-border: 1px solid var(--color-border);
  --contact-card-shadow: var(--shadow-md);

  --footer-background: #090909;
}

body {
  background: var(--color-background);
}

::selection {
  background: #ffffff;
  color: #000000;
}

.btn-primary {
  min-height: 48px;
  padding: 0 var(--spacing-xl);
  border: 1px solid #ffffff;
  border-radius: var(--radius-sm);
  background: #ffffff;
  color: #000000;
  font-weight: var(--font-weight-semibold);
  transition: all var(--transition-base);
}

.btn-primary:hover {
  background: transparent;
  color: #ffffff;
  transform: translateY(-2px);
}

.btn-secondary {
  min-height: 48px;
  padding: 0 var(--spacing-xl);
  border: 1px solid var(--color-border-hover);
  border-radius: var(--radius-sm);
  background: transparent;
  color: #ffffff;
  font-weight: var(--font-weight-medium);
  transition: all var(--transition-base);
}

.btn-secondary:hover {
  border-color: #ffffff;
  background: rgba(255, 255, 255, 0.07);
  transform: translateY(-2px);
}

.eyebrow {
  color: #ffffff;
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.eyebrow::before,
.eyebrow::after {
  background: #ffffff;
}


/* Elegante Premium */
.hero-title,
.section-title{
  letter-spacing:.04em;
  line-height:1.08;
}

.section{
  padding-block:calc(var(--spacing-3xl,5rem) * 1.15);
}

.service-card:hover,
.credential-card:hover,
.stats-card:hover,
.gallery-slide:hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}

.btn-primary{
  background:#efefef;
  color:#111;
}
.btn-primary:hover{
  background:#fff;
  box-shadow:0 0 28px rgba(255,255,255,.08);
}

.gallery-slide,
.service-card,
.credential-card,
.stats-card,
.contact-card{
  border-color:rgba(255,255,255,.05);
}