@layer reset, base, layout, components, sections, variants, skin, state;
/* ═══════════════════════════════════════════════════════════════
   tema.css · persianasciutatvella.es
   Arquetipo T07 Bloques · semilla sal=0
   Generado por generador-temas.py — NO editar a mano.
   Para cambiar el diseño, regenerar con otra sal y actualizar el registro.
   ═══════════════════════════════════════════════════════════════ */

/* Tipos registrados: permiten animar e interpolar tokens sin JS */
@property --h { syntax:'<number>'; inherits:true; initial-value:0; }

:root{
  /* ── SEMILLA CROMÁTICA ─────────────────────────────────────────
     Solo se declaran dos colores reales. Todo lo demás se deriva en
     el navegador con oklch() relativo, color-mix() y contrast-color().
     Cambiar --c-brand recalcula la web entera manteniendo contrastes. */
  --h: 6;
  --c-brand:  #5E1A2E;
  --c-accent: #E0A96D;

  /* Derivados de marca (esquema: mono) */
  --c-brand-hi:   oklch(from var(--c-brand) calc(l + .10) c h);
  --c-brand-lo:   oklch(from var(--c-brand) calc(l - .12) c h);
  --c-brand-lo-ink: oklch(1 0 0);   /* texto del botón principal en :hover */
  --c-brand-soft: oklch(from var(--c-brand) calc(l + .34) calc(c * .30) h);
  --c-brand-ink:  oklch(1 0 0);   /* calculada con WCAG: contrast-color() de Chrome elegía blanco a 4,42:1 sobre naranjas medios */
  --c-accent-ink: oklch(0.15 0 0);

  /* Superficies (tintada) */
  --c-surface:   oklch(1 0 0);
  --c-surface-2: oklch(0.960 0.026 var(--h));
  --c-ink:       oklch(0.21 0.024 var(--h));
  --c-ink-soft:  oklch(from var(--c-ink) 0.53 calc(c * .8) h);
  --c-ink-soft-claro: oklch(from var(--c-ink) 0.53 calc(c * .8) h);
  --c-band-ink-soft: oklch(0.867 .02 6);                /* texto secundario sobre fondo oscuro */
  --c-band:      oklch(0.26 0.030 var(--h));
  --c-band-ink:  oklch(1 0 0);
  --c-line:      color-mix(in oklch, var(--c-ink) 12%, transparent);
  --c-focus:     oklch(from var(--c-accent) .62 .19 h);
  --c-error:     oklch(0.55 .19 27);

  /* ── CTA DE LLAMADA (R24) ─────────────────────────────────────
     Header, menú móvil y barra inferior. Elegido por el generador para
     contrastar 12.63:1 con la superficie y 12.63:1 con su texto.
     Candidato: brand. Para cambiarlo: regenerar con --cta. */
  --c-cta:       var(--c-brand);
  --c-cta-ink:   oklch(1 0 0);

  /* ── MARCA Y ACENTO COMO TEXTO (R25) ──────────────────────────
     Cuando el color de marca o de acento se usa para LETRA (cifras, etiquetas,
     fechas, marcas), se usa esta versión: misma tonalidad, claridad ajustada
     para 4.6:1 contra --c-surface, --c-surface-2 y --c-brand-soft. */
  --c-brand-text:  oklch(from var(--c-brand) 0.294 c h);
  --c-brand-text-claro: oklch(from var(--c-brand) 0.294 c h);
  --c-brand-text-oscuro: oklch(from var(--c-brand) 0.654 c h);   /* sobre banda y heroes oscuros */
  --c-accent-text: oklch(from var(--c-accent) 0.533 c h);
  --c-accent-text-oscuro: oklch(from var(--c-accent) 0.773 c h);

  /* ── GEOMETRÍA (recta) ───────────────────────────── */
  --r-btn:0; --r-card:0; --r-input:0; --r-img:0;
  --bw-card:2px; --bw-btn:2px; --bw-line:1px;

  /* ── SOMBRAS (ninguna) ─────────────────────────────────── */
  --sh-card:none;
  --sh-btn:none;
  --sh-hover:none;

  /* ── RITMO (base 8px · densidad aireada ×1.28) ───────── */
  --w-container:1200px;
  --sp-1:10px; --sp-2:20px; --sp-3:31px; --sp-4:51px;
  --sp-5:82px; --sp-6:133px;
  --sp-section:clamp(92px, 5.8vw, 88px);
  --sp-block:var(--sp-4);
  --sp-gap:31px;
  --card-pad:41px;

  /* ── TIPOGRAFÍA (escala modular ×1.25) ────────────────────────── */
  --ff-head:'Archivo Black', system-ui, sans-serif;
  --ff-body:'Archivo', system-ui, sans-serif;
  --fw-head:400; --fw-body:400; --fw-strong:700;
  --fs-h1:clamp(28.6px, 4.7vw, 42.7px);
  --fs-h2:clamp(23.4px, 3.0vw, 31.2px);
  --fs-h3:20.5px;
  --fs-body:16.4px;
  --fs-small:12.8px;
  --tt-head:none; --ls-head:-0.035em;
  --lh-head:1.00; --lh-body:1.65;

  /* ── COMPONENTES ─────────────────────────────────────────────── */
  --btn-pad:20px 41px;
  --btn-fw:600;
  --btn-tt:none; --btn-ls:0;
  --eyebrow:none;
  --icon-sw:2;
  --h-img-service:307px;
  --h-img-hero:0px;

  /* ── MOVIMIENTO ──────────────────────────────────────────────── */
  --tr:.12s;
  --ease:linear;
}

/* Fallback para navegadores sin contrast-color(): tinta calculada con luminancia WCAG real */
@supports not (color: contrast-color(red)){
  :root{
    --c-brand-ink:oklch(1 0 0);
    --c-accent-ink:oklch(0.15 0 0);
    --c-band-ink:oklch(1 0 0);
    --c-brand-lo-ink:oklch(1 0 0);
    --c-cta-ink:oklch(1 0 0);
  }
}

/* ── VARIANTES ACTIVAS ─────────────────────────────────────────────
   base.css define todos los layouts. Estas clases en <body> activan
   los de esta web. Vocabulario de clases: unit / band / do
   ────────────────────────────────────────────────────────────────── */
/* hero:H2 servicios:S3 ventajas:V4
   proceso:P3 resenas:R3 faq:F2
   zonas:Z2 contacto:CT4 footer:FO1
   etiqueta:ninguna numeracion:sin iconos:Lucide */

/* Etiqueta y numeración en @layer variants: así las reglas de contraste de
   base.css (fondos de banda, @layer state) pueden ajustarlas. */
@layer variants {
/* Etiqueta de sección — variante ninguna */
.prs-eyebrow{display:none}

/* Numeración del proceso — variante sin */
.prs-step-num{display:none}
}

/* ═══════════════════════════════════════════════════════════════════════════════
   Propuesta B · «Carrer estret» · rotunda-mayusculas (atrevida)
   Capa propia sobre los tokens calculados por generador-temas.py (contrato de diseño).
   Fuentes: Anton 400 (titulares, en mayúsculas) · Work Sans 400/600 (texto). WOFF2 propios.
   ═══════════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:'Anton';src:url('/fonts/anton-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Work Sans';src:url('/fonts/work-sans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Work Sans';src:url('/fonts/work-sans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}

:root{
  --ff-head:'Anton', 'fallback-metrico', sans-serif;
  --ff-body:'Work Sans', 'fallback-metrico', sans-serif;
  --fw-head:400; --fw-body:400; --fw-strong:600;
  --fs-hero:clamp(2.6rem, 1rem + 5.4vw, 5.8rem);
  --fs-h1:clamp(2.6rem, 1rem + 5.4vw, 5.8rem);
  --fs-h2:clamp(2.1rem, 1.2rem + 3vw, 3.9rem);
  --fs-h3:1.45rem;
  --fs-body:1.0625rem; --fs-small:.875rem;
  --lh-head:1.0; --lh-body:1.62; --ls-head:.005em; --tt-head:uppercase;

  /* Papeles del color: blanco de cal, la marca a lo grande, negro tinta y la madera como único acento */
  --c-surface:   oklch(0.992 0.003 80);
  --c-surface-2: oklch(0.948 0.03 70);           /* madera muy clara */
  --c-ink:       oklch(0.17 0.015 12);
  --c-ink-soft:  oklch(0.38 0.02 15);
  --c-ink-soft-claro: oklch(0.38 0.02 15);
  --c-band:      oklch(0.17 0.015 12);           /* negro tinta */
  --c-band-ink:  oklch(0.985 0.005 80);
  --c-band-ink-soft: oklch(0.86 0.02 70);
  --c-line:      color-mix(in oklch, var(--c-ink) 18%, transparent);
  --c-accent-text: oklch(0.47 0.09 60);
  --c-accent-text-oscuro: #E0A96D;
  --c-brand-text-oscuro: #E0A96D;

  /* Forma: radio 0, bordes de 3 px, bloques planos; sin sombras */
  --r-btn:0; --r-card:0; --r-input:0; --r-img:0;
  --bw-card:3px; --bw-btn:3px; --bw-line:2px;
  --sh-btn:none; --sh-hover:none; --sh-card:none;
  --btn-pad:1rem 1.6rem; --btn-fw:600; --btn-tt:uppercase; --btn-ls:.08em;
  --w-container:1200px;
  --sp-section:clamp(3rem, 2rem + 2.6vw, 4.5rem);
  --card-pad:1.5rem;
  --eyebrow:block;
  --tr:.15s; --ease:cubic-bezier(.3,.7,.2,1);
  --foco:50% 50%;   /* encuadre por defecto de las fotos; cada <img> puede fijar el suyo con style="--foco: …" */
}

@layer skin {
  h1, h2, h3{hyphens:manual}
  h2{max-width:20ch}
  .prs-v :is(p, ul, ol, table) + p{margin-top:.9em}
  .prs-v-cab{margin-bottom:2.5rem}
  .prs-v-cab > h2 + p{margin-top:.8em}
  /* carta «mayúsculas»: señalética con tracking amplio */
  .prs-eyebrow, .prs-f-senal li, .prs-x-tabla thead th, .prs-x-temp, .prs-x-placa li{font-family:var(--ff-body); font-weight:600; text-transform:uppercase; letter-spacing:.14em}
  .prs-eyebrow{display:block; font-size:.78rem; color:var(--c-brand-text); margin:0 0 .8rem}
  .prs-v-destacada{color:var(--c-brand-text, var(--c-brand))}
  .prs-btn--secondary{border-color:var(--c-ink); color:var(--c-ink); background:var(--c-surface)}
  .prs-form-submit{letter-spacing:.04em; padding-inline:1rem}
  .prs-btn--primary:hover{background:var(--c-ink); border-color:var(--c-ink); color:var(--c-band-ink)}

  /* ── Elemento original · «Carrer estret» ───────────────────────────────── */
  .prs-f-defs{position:absolute; width:0; height:0; overflow:hidden}
  .prs-f-carrer{display:grid; grid-template-columns:clamp(30px, 4vw + 10px, 230px) minmax(0,1fr) clamp(30px, 4vw + 10px, 230px); padding:0; background:var(--c-surface)}
  @media (min-width:1100px){ .prs-f-carrer{grid-template-columns:clamp(150px, 16vw, 240px) minmax(0,1fr) clamp(150px, 16vw, 240px)} }
  .prs-f-fachada{position:relative; min-height:100%}
  .prs-f-fachada svg{position:absolute; inset:0; width:100%; height:100%}
  .prs-f-fachada--izq svg{transform:none}
  .prs-f-fachada--der svg{transform:scaleX(-1)}
  .prs-f-calle{padding:clamp(1.4rem, 4vw, 4.5rem) clamp(.9rem, 3vw, 3.5rem) clamp(1.5rem, 3vw, 3rem); min-width:0;
    background:linear-gradient(to bottom, oklch(0.95 0.025 70), var(--c-surface) 38%)}
  .prs-f-carrer h1{margin:0 0 1.2rem; max-width:none}
  .prs-f-carrer .prs-hv-acciones{margin-top:0}
  .prs-f-entradilla{font-size:1.125rem; max-width:40rem; margin-top:1.4rem; color:var(--c-ink-soft)}
  .prs-f-senal{display:flex; flex-wrap:wrap; gap:.5rem; margin:1.6rem 0 0}
  .prs-f-senal li{font-size:.75rem; padding:.55rem .8rem; border:2px solid var(--c-ink); background:var(--c-surface)}
  .prs-f-senal li:first-child{background:var(--c-ink); color:var(--c-band-ink)}
  .prs-f-moto{width:clamp(70px, 8vw, 120px); height:auto; margin:1.6rem 0 0 auto}
  @media (max-width:699px){
    .prs-f-calle{padding:1rem .9rem 1.5rem}
    .prs-f-carrer h1{font-size:clamp(2.4rem, 11.5vw, 3rem); margin-bottom:1rem}
    .prs-eyebrow{font-size:.66rem; letter-spacing:.1em}
    .prs-f-carrer .prs-hv-acciones{gap:.6rem}
    .prs-f-carrer .prs-btn{padding:.85rem 1rem; font-size:.9rem}
    .prs-f-entradilla{font-size:1rem}
  }
  /* 2.º sitio del elemento: la fachada como canto de la banda de comunidades */
  .prs-f-finca{display:grid; grid-template-columns:clamp(28px, 9vw, 150px) minmax(0,1fr); padding-block:0}
  .prs-f-finca > .prs-container{padding-block:var(--sp-section); width:100%}

  /* ── Intro a pantalla partida (carta «pantalla-partida» + «dato-local») ───── */
  .prs-x-partida{display:grid; padding:0}
  @media (min-width:900px){ .prs-x-partida{grid-template-columns:.8fr 1.2fr} .prs-x-partida-foto{position:relative} .prs-x-partida-foto img{position:sticky; top:0; height:100vh; max-height:none} }
  .prs-x-partida-foto img{width:100%; height:100%; max-height:420px; object-fit:cover; object-position:var(--foco, 50% 50%)}
  .prs-x-partida-texto{padding:var(--sp-section) clamp(1.2rem, 5vw, 5rem); max-width:52rem}
  .prs-x-partida-texto h2{margin:0 0 1.4rem}
  .prs-x-partida-texto > p:first-of-type{font-weight:600; font-size:clamp(1.15rem, 1rem + .4vw, 1.3rem); line-height:1.5; color:var(--c-brand-text); padding-left:1rem; border-left:6px solid var(--c-accent)}

  /* ── Averías: placa + señales con borde grueso (laboratorio prs-x-senales) ── */
  .prs-x-av-cab{display:grid; gap:2rem; margin-bottom:2.5rem}
  @media (min-width:1000px){ .prs-x-av-cab{grid-template-columns:1fr 1fr; align-items:end} }
  .prs-x-av-cab h2{margin:0}
  .prs-x-placa{border:3px solid var(--c-ink); padding:1.2rem 1.4rem; background:var(--c-surface-2)}
  .prs-x-placa > p{margin-top:0}
  .prs-x-placa ol{display:grid; gap:.45rem; margin:0; counter-reset:q}
  .prs-x-placa li{font-size:.82rem; letter-spacing:.06em; counter-increment:q; display:grid; grid-template-columns:2rem 1fr}
  .prs-x-placa li::before{content:counter(q, decimal-leading-zero); color:var(--c-brand-text)}
  .prs-x-senales{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(300px,100%),1fr)); gap:0; border-top:3px solid var(--c-ink); border-left:3px solid var(--c-ink)}
  .prs-x-senales article{border-right:3px solid var(--c-ink); border-bottom:3px solid var(--c-ink); padding:1.5rem; counter-increment:s; position:relative}
  .prs-x-senales{counter-reset:s}
  .prs-x-senales article::before{content:counter(s); position:absolute; top:1.2rem; right:1.3rem; font-family:var(--ff-head); font-size:2.6rem; line-height:1; color:var(--c-accent)}
  .prs-x-senales h3{margin:0 3rem .5rem 0}
  .prs-x-senales p{margin:0; color:var(--c-ink-soft)}
  .prs-x-senales article:hover{background:var(--c-brand); color:var(--c-brand-ink)}
  .prs-x-senales article:hover :is(h3,p){color:var(--c-brand-ink)}

  /* ── Servicios: rótulos (laboratorio prs-x-rotulos) ───────────────────────── */
  .prs-x-rotulos{counter-reset:r; border-top:2px solid oklch(1 0 0 / .25)}
  .prs-x-rotulos li{counter-increment:r; display:grid; gap:1rem 2rem; padding:1.2rem 0; border-bottom:2px solid oklch(1 0 0 / .25)}
  @media (min-width:900px){ .prs-x-rotulos li{grid-template-columns:minmax(0,1fr) 12rem; align-items:center} }
  .prs-x-rot-texto{display:grid; grid-template-columns:3.2rem minmax(0,1fr); column-gap:1rem}
  .prs-x-rot-texto::before{content:counter(r, decimal-leading-zero); font-family:var(--ff-head); font-size:2rem; line-height:1; color:var(--c-accent); grid-row:1 / span 3}
  .prs-x-rot-texto h3{font-size:clamp(1.8rem, 1.2rem + 1.7vw, 2.6rem); margin:0 0 .3rem}
  .prs-x-rot-texto p{margin:0; max-width:40rem}
  .prs-x-rot-texto a{display:inline-flex; align-items:center; min-height:44px; font-weight:600; color:var(--c-accent-text-oscuro); text-transform:uppercase; letter-spacing:.1em; font-size:.85rem; text-underline-offset:.3em}
  .prs-x-rot-foto{aspect-ratio:16/9; overflow:hidden}
  .prs-x-rot-foto img{width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.05); transition:filter var(--tr) var(--ease)}
  .prs-x-rotulos li:hover .prs-x-rot-foto img{filter:none}
  @media (max-width:899px){ .prs-x-rot-foto{max-width:none} }

  /* ── Cuatro bloques (garantías y comunidades) ────────────────────────────── */
  .prs-x-cuatro{display:grid; gap:0; grid-template-columns:repeat(auto-fit, minmax(min(250px,100%),1fr))}
  @media (min-width:1100px){ .prs-x-cuatro{grid-template-columns:repeat(4,1fr)} }
  .prs-x-cuatro article{padding:1.4rem 1.4rem 1.4rem 0; border-top:3px solid currentColor}
  @media (min-width:1100px){ .prs-x-cuatro article + article{padding-left:1.4rem; border-left:1px solid color-mix(in oklch, currentColor 30%, transparent)} }
  .prs-x-cuatro h3{margin:0 0 .6rem}
  .prs-x-cuatro p{margin:0}
  .prs-v--marca .prs-x-cuatro article:first-child h3{color:var(--c-accent)}

  /* ── Comparativa ─────────────────────────────────────────────────────────── */
  .prs-x-tabla{width:100%; border-collapse:collapse; border:3px solid var(--c-ink)}
  .prs-x-tabla th, .prs-x-tabla td{padding:1rem 1.2rem; text-align:left; vertical-align:top; border-bottom:2px solid var(--c-line)}
  .prs-x-tabla thead th{font-size:.78rem; background:var(--c-ink); color:var(--c-band-ink)}
  .prs-x-tabla tbody th{font-weight:600}
  .prs-x-tabla td:nth-child(2){font-family:var(--ff-head); text-transform:uppercase; font-size:1.2rem; color:var(--c-brand-text)}
  @media (max-width:699px){
    .prs-x-tabla, .prs-x-tabla thead, .prs-x-tabla tbody, .prs-x-tabla tr, .prs-x-tabla th, .prs-x-tabla td{display:block}
    .prs-x-tabla thead tr{display:flex; flex-wrap:wrap; gap:.2rem 1rem; padding:.7rem 1rem; background:var(--c-ink)}
    .prs-x-tabla thead th{padding:0; border:0}
    .prs-x-tabla tr{border-bottom:3px solid var(--c-ink); padding:.5rem 0}
    .prs-x-tabla th, .prs-x-tabla td{border:0; padding:.35rem 1rem}
    .prs-x-tabla td::before{content:attr(data-th); display:block; font-family:var(--ff-body); text-transform:uppercase; letter-spacing:.1em; font-size:.72rem; color:var(--c-ink-soft)}
  }

  /* ── Tipos: fichas con borde grueso ──────────────────────────────────────── */
  .prs-x-tipos{display:grid; gap:1.5rem; grid-template-columns:repeat(auto-fit, minmax(min(280px,100%),1fr))}
  .prs-x-tipos article{border:3px solid var(--c-ink); background:var(--c-surface)}
  .prs-x-tipo-foto{aspect-ratio:3/2; overflow:hidden; border-bottom:3px solid var(--c-ink)}
  .prs-x-tipo-foto img{width:100%; height:100%; object-fit:cover}
  .prs-x-tipo-txt{padding:1.2rem 1.3rem 1.4rem}
  .prs-x-tipo-txt h3{margin:0 0 .4rem; font-size:1.8rem}
  .prs-x-tipo-txt p{margin:0; color:var(--c-ink-soft)}

  /* ── Coste: escalera (laboratorio prs-x-escalera) ───────────────────────── */
  .prs-x-coste-cab{display:grid; gap:1.5rem 3rem; margin-bottom:2.5rem}
  @media (min-width:1000px){ .prs-x-coste-cab{grid-template-columns:1fr 1.1fr} }
  .prs-x-coste-cab h2{margin:0}
  .prs-x-coste-cab .prs-btn{margin-top:1.4rem}
  .prs-x-escalera{display:grid; gap:1rem; align-items:end}
  @media (min-width:900px){ .prs-x-escalera{grid-template-columns:repeat(3,1fr)}
    .prs-x-escalon:nth-child(1){margin-top:5rem} .prs-x-escalon:nth-child(2){margin-top:2.5rem} }
  .prs-x-escalera{align-items:start}
  .prs-x-escalon{padding:1.6rem 1.4rem 1.5rem; background:var(--c-surface-2); border-top:10px solid var(--c-accent)}
  .prs-x-escalon:nth-child(2){border-top-color:var(--c-brand)}
  .prs-x-escalon:nth-child(3){background:var(--c-brand); color:var(--c-brand-ink); border-top-color:var(--c-ink)}
  .prs-x-escalon:nth-child(3) :is(h3,p,a){color:var(--c-brand-ink)}
  .prs-x-escalon h3{margin:0 0 .6rem; font-size:1.5rem}
  .prs-x-escalon p{margin:0}

  /* ── Mantenimiento ───────────────────────────────────────────────────────── */
  .prs-x-temporadas{display:grid; gap:1.5rem; grid-template-columns:repeat(auto-fit, minmax(min(240px,100%),1fr))}
  .prs-x-temporadas li{border-left:6px solid var(--c-brand); padding:.2rem 0 .2rem 1.2rem}
  .prs-x-temporadas h3{margin:0 0 .5rem}
  .prs-x-temp{display:block; font-size:.75rem; color:var(--c-accent-text); margin-bottom:.35rem}
  .prs-x-temporadas p{margin:0; color:var(--c-ink-soft)}

  /* ── Zonas: barrios en mayúsculas sobre la marca ─────────────────────────── */
  .prs-x-barrios{display:flex; flex-wrap:wrap; gap:.3rem 0; font-family:var(--ff-head); text-transform:uppercase; font-size:clamp(1.4rem, 1rem + 1.6vw, 2.4rem); line-height:1.15}
  .prs-x-barrios li{color:var(--c-brand-ink)}
  .prs-x-barrios li:nth-child(-n+5){color:var(--c-accent)}
  .prs-x-barrios li:not(:last-child)::after{content:"/"; margin:0 .45em; color:color-mix(in oklch, var(--c-brand-ink) 45%, transparent)}
  .prs-x-zonas-cierre{margin-top:2rem; font-weight:600}

  /* ── Relacionados ────────────────────────────────────────────────────────── */
  .prs-x-enlaces{display:grid; gap:1rem; grid-template-columns:repeat(auto-fit, minmax(min(300px,100%),1fr))}
  .prs-x-enlaces article{background:var(--c-surface); border:3px solid var(--c-ink); padding:1.2rem 1.3rem}
  .prs-x-enlaces h3{margin:0 0 .4rem; font-size:1.5rem}
  .prs-x-enlaces h3 a{text-decoration:none; display:inline-flex; gap:.5rem; min-height:44px; align-items:center}
  .prs-x-enlaces h3 a::after{content:"→"; color:var(--c-brand-text)}
  .prs-x-enlaces h3 a:hover{text-decoration:underline; text-underline-offset:.2em}
  .prs-x-enlaces p{margin:0; color:var(--c-ink-soft)}

  /* ── FAQ ─────────────────────────────────────────────────────────────────── */
  .prs-v-dudas .prs-faq-q{font-family:var(--ff-body); font-weight:600; text-transform:none; font-size:1.125rem}
  .prs-faq-item{border-bottom-width:2px}

  @media (prefers-reduced-motion:reduce){ .prs-x-rot-foto img{transition:none} }

  /* ── Correcciones de la crítica (2026-10-07) ─────────────────────────────── */
  /* 2 · Hero gigante de las subpáginas: el titular corre a todo el ancho y debajo van
     la CTA y la entradilla a la izquierda y la foto a la derecha, dentro de la primera pantalla */
  @media (min-width:900px){
    .prs-hv--gigante{padding-block:clamp(2rem, 3vw, 3rem) clamp(2.5rem, 5vw, 4.5rem)}
    .prs-hv--gigante > .prs-container{display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
      grid-template-areas:"ey ey" "h1 h1" "cta md" "tx md"; grid-template-rows:auto auto auto 1fr; column-gap:clamp(2rem, 4vw, 4rem)}
    .prs-hv--gigante .prs-eyebrow{grid-area:ey}
    .prs-hv--gigante h1{grid-area:h1; max-width:none; margin-bottom:1.8rem}
    .prs-hv--gigante .prs-hv-pie{display:contents}
    .prs-hv--gigante > .prs-container > .prs-hv-acciones{grid-area:cta; margin:0 0 1.4rem}
    .prs-hv--gigante .prs-hv-texto{grid-area:tx}
    .prs-hv--gigante .prs-hv-texto > .prs-hv-acciones{margin:0 0 1.4rem}
    .prs-hv--gigante .prs-hv-texto > p{margin-top:0}
    .prs-hv--gigante .prs-hv-media{grid-area:md; aspect-ratio:auto; min-height:320px}
    .prs-hv--gigante .prs-hv-media img{position:absolute; inset:0; object-position:var(--foco, 50% 50%)}
  }
  /* 4 · Móvil: CTA del hero justo bajo el titular, botones de una línea (el número no se parte) */
  @media (max-width:699px){
    .prs-hv--gigante{padding-top:1.25rem}
    .prs-hv--gigante h1{margin-bottom:1rem}
    .prs-hv--gigante .prs-hv-acciones{margin-top:0; gap:.6rem}
    .prs-hv--gigante .prs-hv-pie{margin-top:1.25rem}
    .prs-hv--gigante .prs-hv-texto > .prs-hv-acciones{margin-bottom:1.25rem}
    .prs-hv-acciones .prs-btn{padding:.8rem 1rem; font-size:min(.9rem, 4.1vw); letter-spacing:.05em; white-space:nowrap; max-width:100%}
  }

  /* 3 · Botón secundario: estado visible al pasar y al pulsar (se rellena) */
  .prs-btn--secondary:is(:hover, :active){background:var(--c-brand); border-color:var(--c-brand); color:var(--c-brand-ink)}
  :is(.prs-v--oscura, .prs-v--marca, .prs-hv--sangre) .prs-btn--secondary:is(:hover, :active){background:var(--c-accent); border-color:var(--c-accent); color:var(--c-accent-ink); text-decoration:none}

  /* 5 · Respuesta al toque en enlaces sueltos (texto, contacto, pie) y logo */
  a:not([class]):active{background-color:color-mix(in oklch, currentColor 14%, transparent); text-decoration-thickness:3px}
  .prs-logo:active{background-color:color-mix(in oklch, var(--c-ink) 8%, transparent); transform:translateY(1px)}
}

/* 1 · Aviso de cookies compacto (piel del aviso; sus reglas de base viven en @layer state y
   solo se pueden vestir desde esa misma capa). Una franja baja con el botón al lado, para que
   no tape el H1 ni las CTA de la primera pantalla ni la barra de llamada, sobre la que se apoya.
   No cambia su visibilidad, su posición ni su comportamiento. */
@layer state {
  .prs-cookies{padding:.55rem 0; border-top:3px solid var(--c-ink); box-shadow:none}
  .prs-cookies .prs-container{flex-wrap:nowrap; gap:.75rem 2rem}
  .prs-cookies p{margin:0; max-width:none; font-size:.8125rem; line-height:1.4}
  .prs-cookies .prs-btn{flex:none; min-height:44px; padding:.45rem 1.1rem; font-size:.8rem; letter-spacing:.06em; white-space:nowrap}
  @media (max-width:699px){
    .prs-cookies{padding-block:.4rem}
    .prs-cookies .prs-container{width:calc(100% - 1.5rem); gap:.6rem}
    .prs-cookies p{font-size:.75rem; line-height:1.3}
    .prs-cookies .prs-btn{padding-inline:.65rem; font-size:.72rem; letter-spacing:.04em}
  }
  /* la barra de llamada mide 52 px más su filete superior: el aviso se apoya encima, sin pisarlo */
  /* base.css ya lo devuelve a 0 cuando no hay barra (body:not(:has(…)), más específico) */
  @media (max-width:899px){ .prs-cookies{bottom:calc(52px + var(--bw-line) + env(safe-area-inset-bottom, 0px))} }
}

/* ═══ Correcciones de la crítica final, vuelta 1 (2026-10-07) ═══════════════════════════════ */
@layer skin {
  /* 1 · Prosa de las subpáginas: aire de revista. Rótulos con margen y filete, párrafos separados
     y listas con la lama de madera como viñeta, sangradas */
  .prs-prose > :is(p, ul, ol) + :is(p, ul, ol){margin-top:1.1em}
  .prs-prose > h3{margin:clamp(2.2rem, 1.6rem + 1.6vw, 3.1rem) 0 .7rem; padding-top:.85rem; border-top:3px solid var(--c-ink); max-width:none}
  .prs-prose > h3:first-child{margin-top:0}
  /* Legales: el H2 (Anton, interlineado 1) sobresale por arriba de su caja y tapaba los enlaces de la
     última línea del párrafo anterior al recibir el foco; con margen superior ya no se montan */
  .prs-legal .prs-prose > * + h2{margin-top:clamp(2.2rem, 1.6rem + 1.6vw, 3.1rem)}
  .prs-prose ul{padding-left:1.6rem; display:grid; gap:.5em}
  .prs-prose ul > li{position:relative}
  .prs-prose ul > li::before{content:""; position:absolute; left:-1.6rem; top:.62em; width:.95rem; height:.32rem;
    background:var(--c-accent); box-shadow:inset 0 -.09rem 0 oklch(0.6 0.08 60)}
  .prs-prose ol{padding-left:2.4rem; display:grid; gap:.5em; counter-reset:pr}
  .prs-prose ol > li{position:relative; counter-increment:pr}
  .prs-prose ol > li::before{content:counter(pr, decimal-leading-zero); position:absolute; left:-2.4rem; font-family:var(--ff-head); color:var(--c-brand-text)}

  /* 2 · Tarjeta lateral: a su alto y fija al bajar, por debajo de la cabecera */
  .prs-intro-grid{align-items:start}
  .prs-intro-grid > .prs-card{align-self:start}
  @media (min-width:900px){
    .prs-intro-grid > .prs-card{position:sticky; top:calc(var(--hdr-h, 96px) + 1.5rem); border-top:10px solid var(--c-accent)}
  }

  /* 3 · Canto de fachada: entera (la caja del dibujo sigue la proporción 2:9 de su viewBox y se
     apoya abajo, como un edificio) y con aire hasta el texto. En móvil no cabe entera: se esconde */
  @media (min-width:700px){
    .prs-f-finca{grid-template-columns:clamp(110px, 12vw, 170px) minmax(0,1fr)}
    .prs-f-finca > .prs-f-fachada{container-type:size; overflow:hidden}
    .prs-f-finca > .prs-f-fachada svg{inset:auto auto 0 0; width:min(100cqw, 100cqh * 2 / 9); height:min(100cqh, 100cqw * 4.5)}
    .prs-f-finca > .prs-container{padding-inline:clamp(2.5rem, 7vw, 6rem) clamp(1rem, 4vw, 3rem)}
  }
  @media (max-width:699px){
    .prs-f-finca{grid-template-columns:minmax(0,1fr)}
    .prs-f-finca > .prs-f-fachada{display:none}
    .prs-f-finca > .prs-container{width:min(100% - 2 * var(--sp-3), var(--w-container))}
  }

  /* 4 · Contacto ct4 a ≥900: el título, la entradilla y el teléfono a la izquierda; el formulario a
     la derecha en dos columnas (el desplegable a todo el ancho). Solo disposición: el marcado no cambia */
  .prs-contacto--ct4 .prs-contact-data > div{border:3px solid var(--c-ink); border-top:10px solid var(--c-brand); padding:1.2rem 1.4rem; background:var(--c-surface-2)}
  .prs-contacto--ct4 .prs-contact-data h3{margin:0 0 .3rem; font-family:var(--ff-body); font-weight:600; font-size:.78rem; letter-spacing:.14em; color:var(--c-brand-text)}
  .prs-contacto--ct4 .prs-contact-data p{margin:0}
  .prs-contacto--ct4 .prs-contact-data a{font-family:var(--ff-head); font-size:clamp(2rem, 1.4rem + 2vw, 3rem); line-height:1.1; letter-spacing:.02em; color:var(--c-ink); text-decoration:none; display:inline-flex; align-items:center; min-height:44px}
  .prs-contacto--ct4 .prs-contact-data a:hover{color:var(--c-brand-text); text-decoration:underline; text-decoration-thickness:3px; text-underline-offset:.15em}
  @media (min-width:900px){
    .prs-contacto--ct4 > .prs-container{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); grid-template-rows:auto 1fr; column-gap:clamp(2.5rem, 5vw, 5rem); align-items:start}
    .prs-contacto--ct4 .prs-head{grid-column:1; grid-row:1; margin-bottom:2rem}
    .prs-contacto--ct4 .prs-contact-grid{display:contents}
    .prs-contacto--ct4 .prs-contact-data{grid-column:1; grid-row:2; position:sticky; top:calc(var(--hdr-h, 96px) + 1.5rem)}
    .prs-contacto--ct4 .prs-form{grid-column:2; grid-row:1 / span 2; grid-template-columns:repeat(2, minmax(0,1fr)); align-items:start; column-gap:var(--sp-3)}
    .prs-contacto--ct4 .prs-form :is(.prs-field--servicio, .prs-field--mensaje, .prs-form-msg){grid-column:1 / -1}
    .prs-contacto--ct4 .prs-form .prs-check{grid-column:2; align-self:end}
    .prs-contacto--ct4 .prs-form .prs-form-submit{grid-column:1 / -1; justify-self:start}
  }

  @media (max-width:899px){ .prs-contacto--ct4 .prs-contact-data{margin-bottom:var(--sp-3)} }

  /* 5 · Logo del pie: en su color, sobre una placa de cal como un rótulo de comercio */
  .prs-footer .prs-logo img{filter:none}
  .prs-footer .prs-logo{display:inline-flex; align-items:center; margin-bottom:1rem; padding:.55rem .9rem; background:var(--c-surface); color:var(--c-ink); border-bottom:4px solid var(--c-accent)}
  .prs-footer .prs-logo:is(:hover, :focus-visible, :active){background:var(--c-surface-2); color:var(--c-ink)}
}