/* Personalidad · Arquitectónica (references/personalidades.md). Referencia: Fantastic Frank.
   Sale de la C «Cine» (portada a sangre, la que prefirió Dani) y de la rejilla de la B «Índice».
   La foto es el producto: portada a pantalla completa con la frase abajo a la izquierda, fotos algo desaturadas,
   rejilla seca de 6 casas en 4:3 con número y datos en mono, botones cuadrados, cifras antes que caras.
   Densidad media-alta, sin adornos.
   Pone maqueta, escala, densidad, tratamiento de fotos y orden de la confianza. Color, logo, motivo y fuentes del
   cliente los pone marca.css (tools/montar.py), que se carga después: las fuentes de aquí son solo las de partida.
   Marcado propio (cartera en rejilla, tono de los textos): tools/aplica_personalidad.py. */
:root {
  --c-fondo: #F3F2EF;
  --c-texto: #161616;
  --c-acento: #3F5E6B; /* provisional: marca.css pone el primario de la agencia */
  --c-suave: #E6E4DF;
  --f-display: "Urbanist", "Helvetica Neue", Arial, sans-serif;
  --f-texto: "Urbanist", "Helvetica Neue", Arial, sans-serif;
  --f-mono: "DM Mono", ui-monospace, Menlo, monospace;
  --escala: .96;
  --section-y: clamp(72px, 7vw, 128px);
}
[data-personalidad="arquitectonica"] h1, [data-personalidad="arquitectonica"] h2, [data-personalidad="arquitectonica"] h3 { font-weight: var(--peso-display, 500); letter-spacing: -.03em; }
/* Pies técnicos en mono */
[data-personalidad="arquitectonica"] .eyebrow, [data-personalidad="arquitectonica"] .label,
[data-personalidad="arquitectonica"] .card__meta, [data-personalidad="arquitectonica"] .hero__caption,
[data-personalidad="arquitectonica"] .contacto__list dt, [data-personalidad="arquitectonica"] .persona__idiomas,
[data-personalidad="arquitectonica"] .cifras span { font-family: var(--f-mono); letter-spacing: .04em; }

/* «Valorar mi casa» de la cabecera relleno en el color de marca siempre, también sobre la foto */
[data-personalidad="arquitectonica"] .header__cta { background: var(--c-acento); border-color: var(--c-acento); color: var(--c-sobre-acento, var(--c-texto)); }

/* Botones cuadrados (nunca el radio blando): píldoras, flecha y botones redondos */
[data-personalidad="arquitectonica"] .pill, [data-personalidad="arquitectonica"] .pill__arrow,
[data-personalidad="arquitectonica"] .round { border-radius: 0; }

/* ---------- Portada a sangre (de Cine): velo firme arriba para el logo claro y abajo a la izquierda para la frase ---------- */
[data-personalidad="arquitectonica"] .hero__shade {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .46) 0%, rgba(0, 0, 0, 0) 20%),
    radial-gradient(120% 70% at 0% 100%, rgba(0, 0, 0, .74) 0%, rgba(0, 0, 0, .42) 45%, rgba(0, 0, 0, 0) 75%),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, .5) 100%);
}
[data-personalidad="arquitectonica"] .hero__inner { padding-bottom: clamp(20px, 3vw, 40px); }
[data-personalidad="arquitectonica"] .hero__title { max-width: 13em; font-size: calc(clamp(2.3rem, 1.3rem + 3.2vw, 4.8rem) * var(--escala)); line-height: 1; }
[data-personalidad="arquitectonica"] .hero__foot { border-top: 0; padding-bottom: clamp(16px, 2vw, 28px); }
[data-personalidad="arquitectonica"] .hero__caption { font-size: 12px; text-transform: none; color: rgba(255, 255, 255, .84); }

/* ---------- Fotos de arquitectura: algo desaturadas, sin zoom al pasar ---------- */
[data-personalidad="arquitectonica"] .hero__slide img,
[data-personalidad="arquitectonica"] .card__media img { filter: saturate(.84) contrast(1.04); }
[data-personalidad="arquitectonica"] .card__link:hover .card__media img { transform: none; }

/* ---------- Cartera: rejilla de 6 (3 columnas; 2 en móvil), 4:3, número y datos en mono (de Índice) ---------- */
[data-personalidad="arquitectonica"] .cartera { padding-bottom: var(--section-y); }
/* A 1024+ rejilla de 3 (con 5 casas o más, la composición de base.css); por debajo, el carrusel nativo de la base */
[data-personalidad="arquitectonica"] .track { counter-reset: n; grid-auto-columns: min(86vw, 440px); gap: 12px; cursor: auto; }
@media (min-width: 1024px) {
  [data-personalidad="arquitectonica"] .track {
    grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(40px, 4vw, 64px) var(--gap); overflow: visible; scroll-snap-type: none;
  }
}
[data-personalidad="arquitectonica"] .track .card { counter-increment: n; }
[data-personalidad="arquitectonica"] .track .card:nth-child(n + 7) { display: none; }
@media (min-width: 1024px) { [data-personalidad="arquitectonica"] .rail__foot { display: none; } }
[data-personalidad="arquitectonica"] .track .card__link::before {
  content: counter(n, decimal-leading-zero); display: block; margin-bottom: 12px; padding-top: 10px; border-top: 1px solid var(--line);
  font-family: var(--f-mono); font-size: 12px; letter-spacing: .04em; color: var(--mute);
}
[data-personalidad="arquitectonica"] .card__media { aspect-ratio: 4 / 3; }
[data-personalidad="arquitectonica"] .card__title { font-size: calc(1.15rem * var(--escala)); }
[data-personalidad="arquitectonica"] .card__meta { font-size: 12px; }
/* ---------- Confianza: cifras, caras, citas (orden de la base); cifras en rejilla con filete ---------- */
[data-personalidad="arquitectonica"] .cifras b { font-weight: var(--peso-display, 500); }
[data-personalidad="arquitectonica"] .testimonios .cita blockquote { font-family: var(--f-texto); font-size: 1.1rem; }

/* El título de confianza de esta personalidad habla de cifras («…en datos», «Datos que puedes comprobar»): si la agencia
   no tiene bloque de cifras ni equipo (portada-ui.js deja data-i18n="agencia.titulo"), no se enseña */
[data-personalidad="arquitectonica"] .agencia:has(.cifras[hidden]) [data-confianza-titulo][data-i18n="agencia.titulo"] { display: none; }