/* ════════════════════════════════════════════════════════════════════
   PROFUNDIDAD (2026-10-08) — «la página es demasiado plana»
   Hasta ahora todo era crema con filetes de 1 px, radio 0 y ni una sola sombra. Esto añade cuerpo SIN perder la
   sobriedad de promotora familiar: sombras cálidas y suaves en tres niveles, elevación de las fichas al pasar el
   ratón, numeración editorial de las secciones y un interludio con marco. (Haonan eligió esta intensidad —el «nivel 1»,
   el sutil— el 08/10/2026, tras ver también una versión con tarjetas escalonadas y superpuestas.)
   OJO: el único cambio de COLOR pedido es el de la cabecera (`.nav`, piedra). Los fondos de las secciones, los de las
   fichas y las cifras conservan exactamente los colores originales (crema, piedra, grafito): aquí solo hay sombra y
   detalle. Todo el movimiento se apaga con prefers-reduced-motion.
   ════════════════════════════════════════════════════════════════════ */
:root{
  --sh-1:0 1px 2px rgba(48,36,20,.06),0 10px 22px -12px rgba(48,36,20,.20);
  --sh-2:0 2px 4px rgba(48,36,20,.06),0 18px 38px -16px rgba(48,36,20,.30);
  --sh-3:0 4px 8px rgba(48,36,20,.08),0 34px 64px -24px rgba(48,36,20,.42);
}

/* — la placa del hero flota sobre la foto — */
.hero__plinth{box-shadow:18px -14px 44px -26px rgba(24,20,16,.55)}
@media(max-width:899px){.hero__plinth{box-shadow:0 -12px 30px -18px rgba(24,20,16,.5)}}

/* — fotos con cuerpo: apoyadas en la página, no pegadas — */
.case__media .media,.col-4 .media,.proof .media{box-shadow:var(--sh-1)}
.facade{box-shadow:var(--sh-2)}

/* — elevación al pasar el ratón sobre las fichas — */
.tile{position:relative;transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out),background .6s var(--ease-out)}
.btn{transition:box-shadow .4s var(--ease-out)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .tile:hover{transform:translateY(-6px);box-shadow:var(--sh-3);z-index:3}
  .btn:hover{box-shadow:0 10px 22px -10px rgba(24,20,16,.55)}
}
@media(prefers-reduced-motion:reduce){.tile,.btn{transition:none}}

/* — numeración editorial de secciones: 01 — SUELO PROPIO — */
main{counter-reset:sec}
.shead__top{counter-increment:sec}
.shead__top .eyebrow{white-space:nowrap}
.shead__top .eyebrow::before{content:counter(sec,decimal-leading-zero);width:auto;height:auto;background:none;opacity:1;order:-2;
  font-family:var(--serif);font-weight:500;font-size:13px;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.shead__top .eyebrow::after{content:'';width:22px;height:1px;background:currentColor;opacity:.55;order:-1}

/* — interludio: marco fino interior y comilla grande — */
.interlude::before{content:'';position:absolute;inset:clamp(14px,2vw,30px);border:1px solid rgba(255,255,255,.26);z-index:1;pointer-events:none}
.interlude::after{background:linear-gradient(180deg,rgba(22,18,14,.58),rgba(22,18,14,.46) 45%,rgba(22,18,14,.80))}
.interlude blockquote::before{content:'\201C';display:block;font-family:var(--serif);font-weight:300;font-size:1.9em;line-height:.5;color:#E9CFA3;opacity:.55;margin-bottom:.18em}
