/*
Theme Name: Janova Child
Theme URI: https://janova.es
Description: Tema hijo de Kadence para Janova Reformas. Contiene los tokens de diseno, la escala tipografica y las animaciones.
Author: Hector Martin
Template: kadence
Version: 1.0.0
Text Domain: janova-child
*/

/* ==========================================================================
   1. TOKENS
   Los colores deben coincidir con la paleta global de Kadence.
   ========================================================================== */
:root {
  --janova-accent:        #A34A25;  /* Paleta 1 */
  --janova-accent-dark:   #8A3D1E;  /* Paleta 2 */
  --janova-heading:       #1A1A1A;  /* Paleta 3 */
  --janova-text:          #4A4A4A;  /* Paleta 4 */
  --janova-muted:         #6E6A65;  /* Paleta 5 */
  --janova-border:        #E3E0DB;  /* Paleta 6 */
  --janova-surface:       #F5F4F2;  /* Paleta 7 */
  --janova-surface-soft:  #FAF9F7;  /* Paleta 8 */
  --janova-white:         #FFFFFF;  /* Paleta 9 */

  --janova-radius:     18px;
  --janova-radius-sm:  10px;

  --janova-section:    clamp(64px, 8vw, 120px);
  --janova-ease:       .6s cubic-bezier(.22, .61, .36, 1);
}

/* ==========================================================================
   2. TIPOGRAFIA
   Titulares grandes y de peso ligero. Nunca negrita ni mayusculas.
   ========================================================================== */
body {
  color: var(--janova-text);
  font-size: 1.0625rem;      /* 17px */
  line-height: 1.65;
}

h1, h2, h3, h4 {
  color: var(--janova-heading);
  font-weight: 400;
  letter-spacing: -0.02em;
  text-transform: none;
}

h1 { font-size: clamp(2.5rem, 6vw, 4.25rem); line-height: 1.05; }
h2 { font-size: clamp(2rem, 4vw, 3rem);      line-height: 1.12; }
h3 { font-size: clamp(1.375rem, 2vw, 1.75rem); line-height: 1.25; }

.janova-lead {
  font-size: clamp(1.0625rem, 1.4vw, 1.25rem);
  color: var(--janova-muted);
  max-width: 44ch;
}

.janova-eyebrow {                   /* la pildorita tipo "Sobre nosotros" */
  display: inline-block;
  font-size: .8125rem;
  letter-spacing: .04em;
  color: var(--janova-muted);
  background: var(--janova-surface);
  border-radius: 999px;
  padding: .35em 1em;
}

/* ==========================================================================
   3. PRIMITIVAS
   ========================================================================== */
.janova-section      { padding-block: var(--janova-section); }
.janova-section--alt { background: var(--janova-surface); }

.janova-card {
  background: var(--janova-white);
  border: 1px solid var(--janova-border);
  border-radius: var(--janova-radius);
  overflow: hidden;
}

.janova-media {
  border-radius: var(--janova-radius);
  overflow: hidden;
}

/* Zoom suave en las fotos de obras */
.janova-zoom img {
  transition: transform var(--janova-ease);
  will-change: transform;
}
.janova-zoom:hover img { transform: scale(1.03); }

/* ==========================================================================
   4. ANIMACIONES
   Solo por debajo del primer pantallazo. NUNCA en el heroe: retrasa el LCP.
   ========================================================================== */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--janova-ease), transform var(--janova-ease);
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Escalonado para grupos de tarjetas */
.reveal--d1 { transition-delay: .08s; }
.reveal--d2 { transition-delay: .16s; }
.reveal--d3 { transition-delay: .24s; }

html { scroll-behavior: smooth; }

/* En movil solo el fundido: los desplazamientos se notan lentos */
@media (max-width: 767px) {
  .reveal            { transform: none; }
  .janova-zoom:hover img { transform: none; }
}

/* Respeta a quien tiene el movimiento reducido en su sistema */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .janova-zoom img { transition: none; }
}