/* ══════════════════════════════════════════════════════════════════════
   BREMMAK — fotografía del oficio
   ══════════════════════════════════════════════════════════════════════
   Hoja aparte: quitar su línea del encolado devuelve el sitio sin fotos.

   El eje de esta casa es el CONTRARIO al de gribolt. Allí el papel está en
   luminancia 12 y el oro en 45,6°; aquí el suelo del hero vive en 40-60 y
   el verde en 155-182°. De ahí dos decisiones que no se heredan:

   1. **Las fotos van más claras** —luminancia 44, no 31—, o desaparecen
      contra un fondo que ya es medio.
   2. **NO se tiñen de verde.** Un tinte verde sobre la piel se lee como
      enfermedad mucho antes que uno dorado. Las tomas se dejan neutras
      (R−B ≈ 0) y el color lo pone el VELO, que ya es el verde de la casa.

   El freno del tono de piel es de DOS lados: calentar de más la deja
   amarilla, enfriar de más la deja roja —midiendo salió en 5,7° y se ve
   igual de mal—. Se para en 14° y en 32°.

     archivo        luminancia   R−B   tono de piel
     bk-hero           44,8       3,2     13,8°
     bk-calle          43,5      −1,8     18,2°
     bk-dolares        45,6      11,7     13,3°

   Ninguna de estas tomas aparece en otra casa del clúster. Identificadores
   de banco, para que la comprobación no dependa del nombre del archivo:
     bremmak → 6415573 · 6846258 · 9471917 · 4475469 · 12899127 · 4475469
     gribolt → 35296240 · 38412413 · 39076656 · 36713438 · 8102693
   ═══════════════════════════════════════════════════════════════════════ */

/* ⚠ El respaldo `none` de `var()` NO es adorno. Sin él, en una página que no
   declara `--bk-foto` la variable queda sin valor y eso invalida la
   declaración ENTERA de `background-image`: el panel se queda en `none` y
   pierde también sus dos degradados. Pasó en dos interiores —texto blanco
   sobre blanco— y no da error en ninguna parte; se ve pidiendo el valor
   computado en una página que no lleva foto. */

/* ── el hero, con la foto debajo de su propio degradado ───────────────── */
body.sx .sx-hero{
  background-image:
    linear-gradient(118deg,rgba(31,226,144,.14) 0%,rgba(31,226,144,0) 46%),
    linear-gradient(160deg,rgba(5,35,36,.90) 0%,rgba(10,60,51,.86) 52%,rgba(5,35,36,.92) 100%),
    var(--bk-foto,none);
  background-size:auto,auto,cover;
  background-position:center,center,center;
  background-repeat:no-repeat,no-repeat,no-repeat}

/* ── la cabecera de las interiores ─────────────────────────────────────
   Es una franja de 1.108x413: proporción 2,68:1. Ahí mueren las tomas con
   el sujeto arriba o abajo, y la luminancia SUBE respecto al cuadro entero
   porque el recorte se come los márgenes oscuros —las tres subieron de 44 a
   52-62—. Por eso se gradúa DESPUÉS de recortar, no antes. */
body.sx .sx-mast{
  background-image:
    linear-gradient(118deg,rgba(31,226,144,.14) 0%,rgba(31,226,144,0) 46%),
    linear-gradient(160deg,rgba(5,35,36,.91) 0%,rgba(10,60,51,.88) 52%,rgba(5,35,36,.93) 100%),
    var(--bk-foto,none);
  background-size:auto,auto,cover;
  background-position:center,center,center;
  background-repeat:no-repeat,no-repeat,no-repeat}

/* ── el panel de cierre, mismo tratamiento que el hero ────────────────── */
body.sx .sx-cierre{
  background-image:
    linear-gradient(118deg,rgba(31,226,144,.14) 0%,rgba(31,226,144,0) 48%),
    linear-gradient(160deg,rgba(5,35,36,.91) 0%,rgba(10,60,51,.88) 52%,rgba(5,35,36,.93) 100%),
    var(--bk-foto,none);
  background-size:auto,auto,cover;
  background-position:center,center,center;
  background-repeat:no-repeat,no-repeat,no-repeat}

/* ⚠ La foto SÓLO va donde el suelo ya es oscuro —el hero y el cierre—.
   Se probó ponerla también detrás de los apartados de página blanca, con
   velo blanco, y no es atmósfera: es una mancha gris. El mecanismo de la
   casa hermana no se hereda porque allí la página entera es negra y aquí
   es blanca. Lo que sigue queda por si algún día hay un apartado oscuro. */

/* ── la banda: la foto a sangre detrás de un apartado ─────────────────── */
.sx-banda{position:relative;isolation:isolate}
.sx-banda > *{position:relative;z-index:1}
.sx-banda::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;
  background-image:var(--bk-velo),var(--bk-foto,none);
  background-size:auto,cover;
  background-position:center,var(--bk-pos,center);
  background-repeat:no-repeat,no-repeat}
.sx-banda{--bk-velo:linear-gradient(90deg,
  rgba(255,255,255,.97) 0%,rgba(255,255,255,.94) 58%,rgba(255,255,255,.55) 100%)}

/* En pantalla estrecha el texto deja de vivir en una columna y ocupa todo
   el ancho: el velo lateral ya no lo protege y pasa a ser vertical. */
@media (max-width:899.98px){
  .sx-banda::before{background-image:linear-gradient(180deg,
    rgba(255,255,255,.93) 0%,rgba(255,255,255,.965) 45%,
    rgba(255,255,255,.965) 75%,rgba(255,255,255,.90) 100%),var(--bk-foto,none)}
}
