/* ============================================================
   GALERÍA · hoja de la página JVF
   Consume: _xtoken_2026-05-21.css + _xgaleria_2026-08-11.css
   Cero hex crudos · cero blur · cero radius · cero estilos en línea
   2026-08-01
   ============================================================ */

/* ---------- HERO ---------- */
.jvf-hero{min-height:82vh;display:flex;align-items:flex-end;border-bottom:1px solid var(--on-void-line);}
.jvf-hero-inner{max-width:1680px;margin:0 auto;width:100%;padding:var(--g-s-10) var(--g-s-7) var(--g-s-9);}
.jvf-eyebrow{font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);text-transform:uppercase;color:var(--on-void-4);margin-bottom:var(--g-s-6);}
.jvf-title{font-family:var(--g-display);font-weight:300;font-size:clamp(44px,7vw,116px);line-height:1.02;letter-spacing:var(--g-tk-very-tight);max-width:16ch;}
.jvf-title em{font-style:italic;color:var(--on-void-2);}
.jvf-lead{font-size:var(--g-t-lead);line-height:1.45;color:var(--on-void-2);max-width:52ch;margin-top:var(--g-s-7);}

/* ---------- SECCIÓN GENÉRICA ---------- */
.jvf-sec{border-bottom:1px solid var(--on-void-line);}
.jvf-sec-inner{max-width:1680px;margin:0 auto;padding:var(--g-s-9) var(--g-s-7);}
.jvf-h2{font-family:var(--g-display);font-weight:300;font-size:clamp(30px,4vw,62px);line-height:1.12;letter-spacing:var(--g-tk-tight);max-width:20ch;}
.jvf-h2 em{font-style:italic;color:var(--on-void-2);}
.jvf-p{color:var(--on-void-2);max-width:60ch;margin-top:var(--g-s-5);}

/* ---------- EL TRATO: tres columnas ---------- */
.jvf-trato{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--g-s-7);margin-top:var(--g-s-8);}
.jvf-trato article{border-top:1px solid var(--on-void-line);padding-top:var(--g-s-5);}
.jvf-trato h3{font-family:var(--g-display);font-weight:400;font-size:clamp(21px,2.2vw,30px);line-height:1.2;letter-spacing:var(--g-tk-tight);margin-bottom:var(--g-s-4);}
.jvf-trato h3 em{font-style:italic;color:var(--on-void-2);}
.jvf-trato p{color:var(--on-void-3);}
.jvf-rol{font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);text-transform:uppercase;color:var(--on-void-4);display:block;margin-bottom:var(--g-s-3);}

/* ---------- PROCESO: cuatro pasos ---------- */
.jvf-pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--g-s-7);margin-top:var(--g-s-8);counter-reset:paso;}
.jvf-pasos li{list-style:none;border-top:1px solid var(--on-void-line);padding-top:var(--g-s-5);counter-increment:paso;}
.jvf-pasos li::before{content:counter(paso,decimal-leading-zero);display:block;font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);color:var(--tad-vida);margin-bottom:var(--g-s-4);}
.jvf-pasos h3{font-family:var(--g-display);font-weight:400;font-size:clamp(19px,1.8vw,25px);line-height:1.22;margin-bottom:var(--g-s-3);}
.jvf-pasos p{color:var(--on-void-3);font-size:var(--g-t-mono);letter-spacing:0;font-family:var(--g-body);}

/* ---------- PRUEBA: obras en curso ---------- */
.jvf-obras{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--g-s-8);margin-top:var(--g-s-8);}
.jvf-obra{border-top:1px solid var(--on-void-line);padding-top:var(--g-s-5);}
.jvf-obra h3{font-family:var(--g-display);font-weight:300;font-size:clamp(26px,3vw,44px);line-height:1.1;letter-spacing:var(--g-tk-tight);margin-bottom:var(--g-s-4);}
.jvf-obra h3 em{font-style:italic;color:var(--on-void-2);}
.jvf-datos{display:grid;grid-template-columns:1fr 1fr;gap:var(--g-s-5);margin-top:var(--g-s-5);}
.jvf-datos div{font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);color:var(--on-void-2);display:flex;flex-direction:column;gap:var(--g-s-2);}
.jvf-datos span{text-transform:uppercase;color:var(--on-void-4);}

/* ---------- FILTRO / CRITERIOS ---------- */
.jvf-criterios{margin-top:var(--g-s-7);}
.jvf-criterios li{list-style:none;border-bottom:1px solid var(--on-void-line);padding:var(--g-s-4) 0;color:var(--on-void-2);display:flex;gap:var(--g-s-4);align-items:baseline;}
.jvf-criterios li::before{content:'';width:6px;height:6px;background:var(--c-brand);flex-shrink:0;}

/* ---------- FORMULARIO ---------- */
.jvf-form{background:var(--warm);color:var(--void);}
.jvf-form-inner{max-width:1680px;margin:0 auto;padding:var(--g-s-9) var(--g-s-7);display:grid;grid-template-columns:1fr 1fr;gap:var(--g-s-9);}
.jvf-form .jvf-eyebrow{color:var(--on-warm-3);}
.jvf-form .jvf-h2{color:var(--void);}
.jvf-form .jvf-h2 em{color:var(--on-warm-2);}
.jvf-form .jvf-p{color:var(--on-warm-2);}
.jvf-campos{display:flex;flex-direction:column;gap:var(--g-s-5);}
.jvf-campo{display:flex;flex-direction:column;gap:var(--g-s-2);}
.jvf-campo label{font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);text-transform:uppercase;color:var(--on-warm-3);}
.jvf-campo input,.jvf-campo textarea,.jvf-campo select{background:transparent;border:0;border-bottom:1px solid var(--on-warm-line);color:var(--void);font-family:var(--g-body);font-size:var(--g-t-body);padding:var(--g-s-3) 0;}
.jvf-campo input:focus,.jvf-campo textarea:focus,.jvf-campo select:focus{outline:0;border-bottom-color:var(--c-brand);}
.jvf-consent{display:flex;gap:var(--g-s-3);align-items:flex-start;font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:0.04em;color:var(--on-warm-2);line-height:1.5;}
.jvf-consent input{margin-top:3px;accent-color:var(--c-brand);}
.jvf-consent a{color:var(--void);text-decoration:underline;text-underline-offset:3px;}
.jvf-enviar{align-self:flex-start;background:var(--void);color:var(--warm);border:1px solid var(--void);padding:var(--g-s-4) var(--g-s-7);font-family:var(--g-mono);font-size:var(--g-t-mono);letter-spacing:var(--g-tk-mono);text-transform:uppercase;cursor:pointer;transition:background var(--g-ease) 240ms,color var(--g-ease) 240ms;}
.jvf-enviar:hover,.jvf-enviar:focus-visible{background:var(--c-brand);border-color:var(--c-brand);color:var(--warm);}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1100px){
  .jvf-pasos{grid-template-columns:1fr 1fr;}
  .jvf-form-inner{grid-template-columns:1fr;gap:var(--g-s-7);}
}
@media(max-width:760px){
  .jvf-hero-inner,.jvf-sec-inner,.jvf-form-inner{padding-left:var(--g-s-5);padding-right:var(--g-s-5);}
  .jvf-trato,.jvf-pasos,.jvf-obras{grid-template-columns:1fr;gap:var(--g-s-6);}
}

/* ---------- Páginas interiores: header sólido desde el inicio ----------
   No hay video en el hero, así que no hay nada que dejar ver detrás. */
.head{background:var(--void);border-bottom:1px solid var(--on-void-line);}

/* ---------- Selector de idioma del menú móvil ---------- */
.mnav-lang{display:flex;gap:1px;border:1px solid var(--on-void-line);margin-top:var(--g-s-5);}
.mnav-lang button{font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);text-transform:uppercase;padding:var(--g-s-2) var(--g-s-4);color:var(--on-void-3);background:none;border:0;cursor:pointer;}
.mnav-lang button.on{background:var(--on-void-1);color:var(--void);}

/* ---------- Ajuste de escala del header: menú e idiomas más discretos ---------- */
.head-nav{gap:var(--g-s-6);}
.head-nav a{font-size:var(--g-t-mono-xs);letter-spacing:0.13em;}
.head-logo{font-size:clamp(18px,1.5vw,22px);}

/* Los valores de la ficha de obra no van en cursiva: heredan el bloque */
.jvf-datos em{font-style:normal;}

/* ============================================================
   TRATAMIENTO EDITORIAL — imágenes
   Ranuras para material fotográfico real de la firma.
   ============================================================ */

/* ---- Hero con imagen a sangre ---- */
.jvf-hero{position:relative;overflow:hidden;}
.jvf-hero-img{position:absolute;inset:0;z-index:0;}
.jvf-hero-img img{width:100%;height:100%;object-fit:cover;opacity:.34;filter:grayscale(1);}
.jvf-hero-veil{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(12,18,32,.55) 0%,rgba(12,18,32,.80) 55%,var(--void) 100%);}
.jvf-hero-inner{position:relative;z-index:2;}

/* ---- Placa a sangre entre secciones (respiro visual) ---- */
.jvf-placa{position:relative;height:clamp(320px,52vh,620px);overflow:hidden;border-bottom:1px solid var(--on-void-line);}
.jvf-placa img{width:100%;height:100%;object-fit:cover;}
.jvf-pie{position:absolute;left:var(--g-s-7);bottom:var(--g-s-5);z-index:2;
  font-family:var(--g-mono);font-size:var(--g-t-mono-xs);letter-spacing:var(--g-tk-mono);
  text-transform:uppercase;color:var(--on-void-2);}

/* ---- Cifra editorial: el dato como pieza gráfica ---- */
.jvf-cifra{display:grid;grid-template-columns:auto 1fr;gap:var(--g-s-8);align-items:baseline;margin-top:var(--g-s-8);}
.jvf-cifra-n{font-family:var(--g-display);font-weight:300;font-size:clamp(72px,13vw,220px);
  line-height:.86;letter-spacing:var(--g-tk-very-tight);color:var(--c-brand);}
.jvf-cifra-t{max-width:34ch;color:var(--on-void-2);}

/* ---- Obra con render ---- */
.jvf-obra-img{aspect-ratio:4/3;overflow:hidden;margin-bottom:var(--g-s-5);}
.jvf-obra-img img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--g-ease-slow);}
.jvf-obra:hover .jvf-obra-img img{transform:scale(1.03);}

@media(max-width:760px){
  .jvf-cifra{grid-template-columns:1fr;gap:var(--g-s-5);}
  .jvf-pie{left:var(--g-s-5);}
}