/* Óleo Estudio · web nueva, versión privada de revisión (30/10/2026) */

@font-face {
  font-family: 'Oleo Sans';
  src: url('/recursos/fuentes/oleo-sans-web.woff2') format('woff2');
  font-weight: 400 640;
  font-stretch: 85% 125%;
  font-style: normal;
  font-display: swap;
}
/* Mona Sans completa (OFL, sin modificar), para las palabras con el estilo de «Óleo»: grosor 200–900, anchura 75–125 */
@font-face { font-family: 'Oleo Mona'; src: url('/recursos/fuentes/mona-sans-latin-wdth-normal.woff2') format('woff2'); font-weight: 200 900; font-stretch: 75% 125%; font-style: normal; font-display: swap; }
@font-face { font-family: 'Oleo Mona'; src: url('/recursos/fuentes/mona-sans-latin-wdth-italic.woff2') format('woff2'); font-weight: 200 900; font-stretch: 75% 125%; font-style: italic; font-display: swap; }
@font-face { font-family: 'Oleo Reserva'; src: local('Helvetica Neue'), local('Arial'); size-adjust: 104%; }

:root {
  --negro: #000;            /* el mismo negro del PNG plateado: el símbolo no deja borde */
  --blanco: #fff;
  --papel: #f3f3f1;
  --gris-o: #a0a0a6;        /* texto secundario sobre negro (7,9:1) */
  --gris-c: #57575c;        /* texto secundario sobre blanco (7,2:1) */
  --linea-o: rgb(255 255 255 / .2);
  --linea-c: rgb(0 0 0 / .16);
  --plata: linear-gradient(100deg, #8b8b91 0%, #f6f6f8 24%, #a4a4aa 46%, #fff 60%, #86868c 100%);
  --margen: clamp(20px, 5.2vw, 76px);
  --t-gigante: clamp(2.5rem, .9rem + 5.6vw, 6rem);
  --t-grande: clamp(2.1rem, 1rem + 3.9vw, 4.6rem);
  --t-medio: clamp(1.55rem, 1.05rem + 1.7vw, 2.5rem);
  --t-cuerpo: clamp(1.02rem, .96rem + .22vw, 1.15rem);
  --t-mini: .74rem;
  --curva: cubic-bezier(.16, .84, .2, 1);
  --curva-suave: cubic-bezier(.4, 0, .2, 1);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Oleo Sans', 'Oleo Reserva', system-ui, sans-serif;
  font-size: var(--t-cuerpo);
  line-height: 1.55;
  color: var(--negro);
  background: var(--blanco);
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-weight: 640; font-stretch: 112%; letter-spacing: -.035em; line-height: .98; text-wrap: balance; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; border-radius: 2px; }
.oscuro :focus-visible { outline-color: #fff; }

.saltar {
  position: absolute; left: var(--margen); top: -100px; z-index: 100;
  background: #fff; color: #000; padding: .7rem 1rem; font-weight: 600; text-decoration: none;
}
.saltar:focus { top: 12px; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.oscuro { background: var(--negro); color: var(--blanco); }
.envoltura { width: min(1320px, 100% - 2 * var(--margen)); margin-inline: auto; }

.etiqueta {
  display: block; margin: 0 0 1.4rem;
  font-size: var(--t-mini); font-weight: 560; font-stretch: 112%;
  letter-spacing: .32em; text-transform: uppercase;
}
.oscuro .etiqueta { color: var(--gris-o); }
.etiqueta--clara { color: var(--gris-c); }

/* ---------- Cabecera ---------- */
.cabecera {
  position: sticky; top: 0; z-index: 50;
  background: var(--negro); color: #fff;
  border-bottom: 1px solid transparent;
  transition: border-color .4s var(--curva-suave);
  view-transition-name: cabecera;
}
.cabecera.con-linea { border-bottom-color: var(--linea-o); }
.cabecera__dentro { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 68px; }
.marca { display: inline-flex; align-items: center; min-height: 44px; }
.marca img { width: 128px; height: auto; }
.menu { display: flex; align-items: center; gap: clamp(.6rem, 2.4vw, 2.4rem); margin: 0; padding: 0; list-style: none; }
.menu a {
  position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 .15rem;
  font-size: .95rem; font-weight: 520; text-decoration: none; letter-spacing: -.005em;
}
.menu a::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 10px; height: 1px;
  background: var(--plata); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--curva);
}
.menu a:hover::after, .menu a:focus-visible::after, .menu a[aria-current='page']::after { transform: scaleX(1); }
.menu__contacto { color: var(--gris-o); }
@media (max-width: 640px) {
  .cabecera__dentro { min-height: 58px; }
  .marca img { width: 108px; }
  .menu .menu__contacto { display: none; } /* en el móvil, solo los dos accesos; el contacto está en el estudio y en el pie */
  .menu a { font-size: .92rem; }
}
@media (max-width: 350px) { .marca img { width: 92px; } .menu { gap: .5rem; } .menu a { font-size: .86rem; } }

/* ---------- Portada: primera pantalla ---------- */
.portada { position: relative; overflow: clip; }
.portada__dentro {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1fr);
  min-height: calc(100svh - 68px);
  padding-block: clamp(2.2rem, 6vh, 5rem) clamp(1.6rem, 4vh, 3rem);
  align-content: space-between; gap: 2.4rem;
}
.portada h1 { font-size: var(--t-gigante); max-width: 11.5ch; }
.portada h1 .linea { display: block; }
.portada__apoyo { margin: 1.6rem 0 0; max-width: 34ch; font-size: clamp(1.08rem, 1rem + .45vw, 1.35rem); color: #e9e9ec; line-height: 1.4; }

.simbolo-portada {
  position: absolute; z-index: 1; pointer-events: none;
  width: min(56vw, 900px); right: calc(var(--margen) * .45); top: 49%; translate: 0 -50%;
}
@media (max-width: 760px) {
  .portada__dentro { padding-top: 0; gap: 1.6rem; min-height: auto; padding-bottom: 2rem; }
  .simbolo-portada { position: relative; width: calc(100% - 2 * var(--margen) + 16px); right: auto; top: auto; translate: none; margin: .6rem auto .4rem; }
  .portada { display: flex; flex-direction: column; }
}

/* El símbolo y su luz (las capas usan la máscara sacada del PNG aprobado) */
.simbolo { position: relative; aspect-ratio: 1140 / 640; }
.simbolo__giro {
  position: absolute; inset: 0;
  transform: perspective(1500px) translate3d(0, var(--sy, 0px), 0) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) rotateZ(var(--rz, 0deg)) scale(var(--sc, 1));
  will-change: transform;
}
.simbolo img { width: 100%; height: 100%; object-fit: contain; }
.simbolo__luz, .simbolo__barrido, .simbolo__sombra {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen;
  -webkit-mask: url('/recursos/img/simbolo-mascara.png') center / 100% 100% no-repeat;
  mask: url('/recursos/img/simbolo-mascara.png') center / 100% 100% no-repeat;
}
.simbolo__luz {
  background: radial-gradient(30% 46% at var(--lx, 58%) var(--ly, 42%), rgb(255 255 255 / .9), rgb(255 255 255 / .22) 42%, transparent 72%);
  opacity: var(--li, .45);
}
.simbolo__sombra {
  mix-blend-mode: multiply;
  background: radial-gradient(62% 95% at var(--lx, 58%) var(--ly, 42%), rgb(255 255 255) 26%, rgb(196 196 200) 66%, rgb(132 132 138) 100%);
  opacity: var(--so, .3);
}
.simbolo__barrido {
  background: linear-gradient(104deg, transparent 38%, rgb(255 255 255 / .2) 45%, rgb(255 255 255 / .95) 50%, rgb(255 255 255 / .18) 55%, transparent 62%);
  background-size: 260% 100%;
  background-position: var(--bp, 130%) 0;
}
.mov.entrada .simbolo__barrido { animation: barrido 1.7s var(--curva-suave) .45s; }
@keyframes barrido { from { background-position: 135% 0; } to { background-position: -45% 0; } }
.mov.entrada .simbolo-portada .simbolo { animation: aparecer-simbolo 1.5s var(--curva) both; }
@keyframes aparecer-simbolo { from { opacity: 0; transform: scale(.94) translateY(14px); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }

/* Titular por líneas */
.mov.entrada .portada h1 .linea, .mov.entrada .cabeza h1 .linea { overflow: clip; }
.mov.entrada .portada h1 .linea > span, .mov.entrada .cabeza h1 .linea > span { display: inline-block; animation: subir .95s var(--curva) both; }
.mov.entrada h1 .linea:nth-child(2) > span { animation-delay: .08s; }
.mov.entrada h1 .linea:nth-child(3) > span { animation-delay: .16s; }
.mov.entrada .portada__apoyo, .mov.entrada .cabeza__apoyo { animation: fundir .9s var(--curva) .3s both; }
@keyframes subir { from { transform: translateY(105%); } to { transform: none; } }
@keyframes fundir { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Los dos accesos: visibles y usables desde el primer momento */
.accesos { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 760px; border-bottom: 1px solid var(--linea-o); }
.acceso {
  --l: 0;
  position: relative; display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; column-gap: 1rem; row-gap: .25rem;
  align-items: baseline; padding: 1.15rem 0 1.25rem; border-top: 1px solid var(--linea-o);
  text-decoration: none; color: #fff;
}
.acceso::after {
  content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 1px;
  background: var(--plata); transform: scaleX(var(--l)); transform-origin: left; transition: transform .6s var(--curva);
}
.acceso:hover, .acceso:focus-visible { --l: 1; }
.acceso__num { grid-row: 1 / 3; font-size: var(--t-mini); letter-spacing: .2em; color: var(--gris-o); font-variant-numeric: tabular-nums; padding-top: .55rem; }
.acceso__titulo { font-size: var(--t-medio); font-weight: 620; font-stretch: 112%; letter-spacing: -.03em; line-height: 1.05; transition: transform .5s var(--curva); }
.acceso__texto { grid-column: 2; color: var(--gris-o); font-size: 1rem; line-height: 1.45; max-width: 40ch; }
.acceso__accion {
  grid-column: 3; grid-row: 1 / 3; align-self: center;
  display: inline-flex; align-items: center; gap: .6rem; white-space: nowrap;
  font-size: .95rem; font-weight: 540; border: 1px solid var(--linea-o); padding: .7rem 1rem; min-height: 44px;
  transition: background-color .35s var(--curva-suave), color .35s var(--curva-suave), border-color .35s;
}
.acceso__accion svg { width: 1em; height: 1em; transition: transform .45s var(--curva); }
.acceso:hover .acceso__titulo, .acceso:focus-visible .acceso__titulo { transform: translateX(.35rem); }
.acceso:hover .acceso__accion, .acceso:focus-visible .acceso__accion { background: #fff; color: #000; border-color: #fff; }
.acceso:hover .acceso__accion svg, .acceso:focus-visible .acceso__accion svg { transform: translate(2px, -2px); }
@media (max-width: 760px) {
  .acceso { grid-template-columns: 2rem minmax(0, 1fr) auto; padding: 1rem 0 1.05rem; }
  .acceso__accion { padding: 0; border: 0; min-height: 0; }
  .acceso__accion .acceso__accion-texto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .acceso__accion svg { width: 1.35rem; height: 1.35rem; }
  .acceso:hover .acceso__accion, .acceso:focus-visible .acceso__accion { background: none; color: #fff; }
}

/* ---------- Secciones ---------- */
.seccion { padding-block: clamp(4.5rem, 11vw, 9.5rem); }
.seccion--corta { padding-block: clamp(3.5rem, 8vw, 6.5rem); }
.cabeza-seccion { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; margin-bottom: clamp(2.4rem, 5vw, 4.5rem); }
.cabeza-seccion h2 { font-size: var(--t-grande); max-width: 14ch; }
.cabeza-seccion__texto { max-width: 46ch; color: var(--gris-c); margin: 0; }
.oscuro .cabeza-seccion__texto { color: var(--gris-o); }
@media (min-width: 980px) {
  .cabeza-seccion { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: end; }
}

.enlace-flecha {
  display: inline-flex; align-items: center; gap: .65rem; min-height: 44px;
  font-weight: 560; text-decoration: none; border-bottom: 1px solid currentColor; padding-top: .2rem;
}
.enlace-flecha svg { width: 1em; height: 1em; transition: transform .45s var(--curva); }
.enlace-flecha:hover svg, .enlace-flecha:focus-visible svg { transform: translate(3px, -3px); }
.boton {
  display: inline-flex; align-items: center; gap: .7rem; min-height: 50px; padding: .85rem 1.35rem;
  background: #000; color: #fff; text-decoration: none; font-weight: 560; border: 1px solid #000;
  transition: background-color .35s var(--curva-suave), color .35s var(--curva-suave);
}
.boton svg { width: 1em; height: 1em; transition: transform .45s var(--curva); }
.boton:hover, .boton:focus-visible { background: #fff; color: #000; }
.boton:hover svg, .boton:focus-visible svg { transform: translate(3px, -3px); }
.oscuro .boton { background: #fff; color: #000; border-color: #fff; }
.oscuro .boton:hover, .oscuro .boton:focus-visible { background: #000; color: #fff; }

/* ---------- Obras ---------- */
.obras { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(3rem, 7vw, 5rem); }
@media (min-width: 900px) {
  .obras--dos { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 4rem); }
  .obras--dos .obra:nth-child(2) { margin-top: clamp(4rem, 9vw, 8rem); }
}
.obra__marco { position: relative; display: block; overflow: hidden; background: #0b0b0c; aspect-ratio: 16 / 10; }
.obra__marco img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 1.1s var(--curva); }
.obra__marco::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(104deg, transparent 40%, rgb(255 255 255 / .22) 50%, transparent 60%);
  background-size: 280% 100%; background-position: 140% 0; transition: background-position 1.2s var(--curva-suave);
}
a.obra__marco:hover img, a.obra__marco:focus-visible img { transform: scale(1.025); }
a.obra__marco:hover::after, a.obra__marco:focus-visible::after { background-position: -40% 0; }
.obra__pie { padding-top: 1.3rem; max-width: 56ch; }
.obra h3 { font-size: var(--t-medio); margin: .65rem 0 .8rem; }
.obra__contexto { color: var(--gris-c); margin-bottom: .7rem; }
.obra__papel { font-size: .92rem; margin: 0; }
.obra__papel strong { font-weight: 600; }
.estado-linea { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1rem; margin: 0; }
.estado-linea .estado__tipo { font-size: var(--t-mini); font-weight: 520; font-stretch: 112%; letter-spacing: .22em; text-transform: uppercase; white-space: nowrap; }
.estado {
  display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; width: max-content; max-width: 100%;
  font-size: var(--t-mini); font-weight: 560; font-stretch: 112%; letter-spacing: .22em; text-transform: uppercase;
}
.estado::before { content: ''; width: .55rem; height: .55rem; border-radius: 50%; border: 1.5px solid currentColor; }
.estado--encargo::before { background: currentColor; }
.estado--demo::before { border-style: dashed; }
/* v3 (02/11/2026): lo disponible y lo que está en preparación, a primera vista */
.estado--si, .estado--prep { margin: 0; padding: .42rem .8rem .42rem .7rem; border: 1px solid currentColor; line-height: 1.2; }
.estado.estado--si { background: #000; color: #fff; border-color: #000; } /* manda sobre el gris de los textos que la rodean */
.estado--si::before { background: currentColor; }
.oscuro .estado.estado--si { background: #fff; color: #000; border-color: #fff; }
.estado.estado--prep { color: inherit; }
.tablero__fila .estado.estado--prep { color: #000; }
.estado--prep { border-style: dashed; }
.estado--prep::before { border-style: dashed; }
.estado__tipo { color: var(--gris-c); }

/* Leyenda de estados */
.leyenda { display: flex; flex-wrap: wrap; gap: .6rem 1.8rem; margin: 0 0 3rem; padding: 1rem 0; border-block: 1px solid var(--linea-c); list-style: none; padding-inline: 0; }
.leyenda li { display: flex; flex-direction: column; gap: .2rem; max-width: 26ch; }
.leyenda small { color: var(--gris-c); font-size: .86rem; line-height: 1.4; }

/* Obra grande del estudio */
.obra-grande { display: grid; gap: 1.6rem; }
@media (min-width: 980px) { .obra-grande { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); align-items: end; gap: 3rem; } }

/* ---------- Compartimos ---------- */
.compartimos { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 5rem); align-items: center; }
@media (min-width: 900px) { .compartimos { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); } }
.compartimos h2 { font-size: var(--t-grande); max-width: 12ch; margin-bottom: 1.6rem; }
.compartimos p { color: var(--gris-c); max-width: 44ch; }
.oscuro .compartimos p { color: var(--gris-o); }
.pieza-vacia {
  position: relative; aspect-ratio: 9 / 14; max-width: 380px; width: 100%; justify-self: center;
  border: 1px solid var(--linea-o); display: grid; place-items: center; overflow: hidden;
  background: #000; /* el mismo negro del JPEG del símbolo: sin rectángulo */
}
.pieza-vacia .simbolo { width: 72%; }
.pieza-vacia p.pieza-vacia__texto { max-width: none; position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1.2rem; display: flex; justify-content: space-between; gap: 1rem; font-size: var(--t-mini); letter-spacing: .26em; text-transform: uppercase; color: var(--gris-o); }

/* ---------- Detrás ---------- */
.detras { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.4rem; }
@media (min-width: 980px) { .detras { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 5rem; align-items: start; } }
.detras h2 { font-size: var(--t-grande); max-width: 10ch; }
.detras__texto p { font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem); line-height: 1.45; max-width: 36ch; }
.detras__texto p.menor { font-size: 1rem; color: var(--gris-c); }
.oscuro .detras__texto p.menor { color: var(--gris-o); }
.detras__texto p.nota-rev { font-size: .82rem; line-height: 1.45; max-width: 60ch; }
.pareja { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 2rem; }

/* ---------- Páginas interiores ---------- */
.cabeza { padding-block: clamp(3rem, 9vw, 7.5rem) clamp(2.6rem, 6vw, 5rem); position: relative; overflow: clip; }
.cabeza h1 { font-size: var(--t-gigante); max-width: 12ch; position: relative; z-index: 2; }
.cabeza h1 .linea { display: block; }
.cabeza__apoyo { position: relative; z-index: 2; margin: 1.6rem 0 0; max-width: 40ch; font-size: clamp(1.08rem, 1rem + .45vw, 1.35rem); color: #e9e9ec; line-height: 1.4; }
.cabeza .simbolo-lateral { position: absolute; z-index: 1; right: calc(var(--margen) * .35); top: 50%; width: min(42vw, 640px); translate: 0 -50%; pointer-events: none; }
@media (max-width: 760px) {
  /* En el móvil, el símbolo va arriba y entero, nunca detrás del texto */
  .cabeza { padding-top: 1.2rem; }
  .cabeza .simbolo-lateral { position: relative; right: auto; top: auto; translate: none; width: 64%; margin: 0 var(--margen) .4rem auto; }
}
.indice { display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; margin: 2.4rem 0 0; padding: 0; list-style: none; position: relative; z-index: 2; }
.indice a { display: inline-flex; min-height: 44px; align-items: center; color: var(--gris-o); text-decoration: none; font-size: .95rem; border-bottom: 1px solid transparent; transition: color .3s, border-color .3s; }
.indice a:hover, .indice a:focus-visible { color: #fff; border-bottom-color: #fff; }
.chip { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.8rem; padding: .45rem .8rem; border: 1px solid var(--linea-o); font-size: var(--t-mini); letter-spacing: .24em; text-transform: uppercase; color: #e9e9ec; position: relative; z-index: 2; }
.chip::before { content: ''; width: .5rem; height: .5rem; border-radius: 50%; border: 1.5px dashed currentColor; }

/* Servicios */
.servicios { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--linea-c); }
@media (min-width: 900px) { .servicios { grid-template-columns: repeat(2, minmax(0, 1fr)); } .servicio + .servicio { border-left: 1px solid var(--linea-c); padding-left: clamp(2rem, 4vw, 3.5rem); } }
.servicio { padding: 2.2rem 0; border-bottom: 1px solid var(--linea-c); padding-right: clamp(0rem, 3vw, 3rem); }
.servicio h3 { font-size: var(--t-medio); margin-bottom: 1rem; }
.servicio ul { margin: 1rem 0 0; padding-left: 1.1rem; }
.servicio li { margin-bottom: .45rem; }

/* Proceso y listas numeradas */
.pasos { list-style: none; margin: 0; padding: 0; counter-reset: paso; border-top: 1px solid var(--linea-c); }
.oscuro .pasos { border-top-color: var(--linea-o); }
.paso { counter-increment: paso; display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); gap: .3rem 1rem; padding: 1.6rem 0; border-bottom: 1px solid var(--linea-c); }
.oscuro .paso { border-bottom-color: var(--linea-o); }
@media (min-width: 900px) { .paso { grid-template-columns: 4.5rem minmax(0, .9fr) minmax(0, 1.1fr); align-items: baseline; padding: 2rem 0; } }
.paso::before { content: counter(paso, decimal-leading-zero); font-size: var(--t-mini); letter-spacing: .2em; color: var(--gris-c); padding-top: .5rem; }
.oscuro .paso::before { color: var(--gris-o); }
.paso h3 { font-size: clamp(1.25rem, 1rem + 1vw, 1.8rem); letter-spacing: -.02em; line-height: 1.1; }
.paso p { grid-column: 2; margin: 0; color: var(--gris-c); max-width: 52ch; }
.oscuro .paso p { color: var(--gris-o); }
@media (min-width: 900px) { .paso p { grid-column: 3; } }

/* Contacto */
.contacto h2 { font-size: var(--t-gigante); max-width: 11ch; margin-bottom: 1.6rem; }
.contacto__correo { display: inline-block; margin: 1.4rem 0 .4rem; font-size: clamp(1.3rem, 1rem + 1.6vw, 2.2rem); font-weight: 600; font-stretch: 112%; letter-spacing: -.02em; text-decoration: none; border-bottom: 1px solid var(--linea-o); }
.contacto__correo:hover, .contacto__correo:focus-visible { border-bottom-color: #fff; }

/* ---------- Pie ---------- */
.pie { padding-block: clamp(3.5rem, 8vw, 6rem) 2rem; border-top: 1px solid var(--linea-o); }
.pie__arriba { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: end; }
@media (min-width: 900px) { .pie__arriba { grid-template-columns: minmax(0, 1fr) auto; } }
.pie__logo { width: min(420px, 82vw); }
.pie__menu { display: flex; flex-wrap: wrap; gap: .4rem 1.8rem; margin: 0; padding: 0; list-style: none; }
.pie__menu a { display: inline-flex; min-height: 44px; align-items: center; text-decoration: none; }
.pie__menu a:hover, .pie__menu a:focus-visible { text-decoration: underline; text-underline-offset: 6px; }
.pie__abajo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--linea-o); color: var(--gris-o); font-size: .86rem; }
.pie__legal { display: flex; flex-wrap: wrap; gap: 0 1.4rem; margin: 0; padding: 0; list-style: none; }
.pie__legal a { display: inline-flex; min-height: 44px; align-items: center; color: var(--gris-o); text-decoration: none; }
.pie__legal a:hover, .pie__legal a:focus-visible, .pie__legal a[aria-current='page'] { color: #fff; text-decoration: underline; text-underline-offset: 6px; }

/* ---------- Páginas legales: lectura sobre blanco ---------- */
.lectura { max-width: 72ch; }
.lectura h2 { font-size: var(--t-medio); margin: 3rem 0 1rem; max-width: 26ch; }
.lectura h2:first-child { margin-top: 0; }
.lectura p, .lectura li { max-width: 68ch; }
.lectura ul { padding-left: 1.2rem; margin: 0 0 1em; }
.lectura li { margin-bottom: .4em; }
.lectura a { text-underline-offset: 3px; }
.lectura__fecha { color: var(--gris-c); font-size: .95rem; }
.ficha { display: grid; grid-template-columns: minmax(0, 1fr); gap: .25rem 2rem; margin: 1.4rem 0 1.6rem; padding: 1.2rem 0; border-block: 1px solid var(--linea-c); }
.ficha dt { font-weight: 600; }
.ficha dd { margin: 0 0 .8rem; color: var(--gris-c); overflow-wrap: anywhere; }
@media (min-width: 700px) { .ficha { grid-template-columns: 12rem minmax(0, 1fr); } .ficha dd { margin: 0; } }

/* ---------- Notas de revisión (solo esta versión privada) ---------- */
.nota-rev {
  display: block; margin: .9rem 0 0; padding: .55rem .75rem .6rem; max-width: 60ch;
  border: 1px dashed #b38600; background: #fff8e1; color: #3d2e00;
  font-size: .82rem; line-height: 1.45; font-weight: 450;
}
.nota-rev::before { content: 'Revisión · '; font-weight: 650; letter-spacing: .04em; }
.oscuro .nota-rev { background: #1e1800; color: #ffe08a; border-color: #8a6a00; }
.sin-notas .nota-rev { display: none; }
.aviso-rev {
  position: fixed; right: 12px; bottom: 12px; z-index: 60;
  display: flex; align-items: center; gap: .6rem; padding: .35rem .4rem .35rem .8rem;
  background: #fff8e1; color: #3d2e00; border: 1px dashed #b38600; font-size: .78rem; line-height: 1.2;
  max-width: calc(100vw - 24px);
}
@media (max-width: 640px) {
  .aviso-rev { right: 8px; bottom: 8px; padding: .2rem .25rem .2rem .6rem; font-size: .72rem; }
  .aviso-rev__largo { display: none; }
  .aviso-rev button { min-height: 32px; padding: .2rem .55rem; }
}
.aviso-rev button { font: inherit; font-weight: 600; min-height: 36px; padding: .3rem .7rem; border: 1px solid #3d2e00; background: transparent; color: inherit; cursor: pointer; }
.aviso-rev button:focus-visible { outline: 2px solid #3d2e00; outline-offset: 2px; }
.no-js .aviso-rev button { display: none; }

/* ---------- Aparición al bajar (solo con movimiento y JS) ---------- */
.mov [data-rev] { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--curva), transform 1.1s var(--curva); transition-delay: var(--d, 0s); }
.mov [data-rev].visto { opacity: 1; transform: none; }
/* El recorte va en la imagen, no en el marco: IntersectionObserver no ve un elemento recortado del todo */
.mov .obra__marco[data-rev] { opacity: 1; transform: none; }
.mov .obra__marco[data-rev] img { clip-path: inset(0 0 100% 0); transform: scale(1.08); transition: clip-path 1.25s var(--curva), transform 1.6s var(--curva); }
.mov .obra__marco[data-rev].visto img { clip-path: inset(0 0 0 0); transform: scale(1); }
.mov a.obra__marco[data-rev].visto:hover img, .mov a.obra__marco[data-rev].visto:focus-visible img { transform: scale(1.025); transition-duration: 1.1s; }

/* ---------- Transiciones entre páginas ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: .32s var(--curva-suave) both salir-pagina; }
::view-transition-new(root) { animation: .62s var(--curva) both entrar-pagina; }
@keyframes salir-pagina { to { opacity: 0; transform: translateY(-14px); } }
@keyframes entrar-pagina { from { opacity: 0; transform: translateY(22px); } }

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  *, *::before, *::after { animation: none !important; transition-duration: 0s !important; scroll-behavior: auto !important; }
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Las palabras con el estilo de «Óleo» (aproximación medida en /revision/tipografia/) */
.palabra-oleo {
  display: inline-block;
  font-family: 'Oleo Mona', 'Oleo Sans', system-ui, sans-serif;
  font-style: var(--oleo-estilo, italic);
  font-weight: var(--oleo-peso, 900);
  font-stretch: var(--oleo-ancho, 125%);
  letter-spacing: var(--oleo-esp, 0.02em);
  -webkit-text-stroke: var(--oleo-trazo, 0) currentColor;
  transform: skewX(var(--oleo-incl, -16deg));
  font-size: clamp(3rem, 1rem + 7vw, 7rem);
  line-height: 1;
  padding-inline: .1em .25em; /* la inclinación saca las letras por la derecha y por la izquierda */
}

/* ---------- Portada con el hilo de plata (propuesta del 31/10/2026) ---------- */
.hilo-barra__dentro { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 56px; border-bottom: 1px solid var(--linea-o); }
.hilo-barra__lema { margin: 0; font-size: var(--t-mini); font-weight: 540; font-stretch: 112%; letter-spacing: .16em; text-transform: uppercase; }
.hilo-barra__contacto { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; text-decoration: none; font-size: .95rem; font-weight: 520; }
.hilo-barra__contacto svg { width: .9em; height: .9em; transition: transform .45s var(--curva); }
.hilo-barra__contacto:hover svg, .hilo-barra__contacto:focus-visible svg { transform: translate(2px, -2px); }

.hilo { position: relative; display: flex; flex-direction: column; min-height: calc(100svh - 57px); overflow: clip; }
/* v2: la portada usa el ancho de la pantalla (hasta 1760 px), no los 1320 del resto: los accesos llegan a los bordes y el conjunto escala entero */
.hilo-barra__dentro.envoltura, .hilo__escena.envoltura, .hilo__lema.envoltura, .hilo__nota.envoltura { width: min(1760px, 100% - 2 * var(--margen)); }
.hilo__nombre { position: relative; z-index: 3; width: clamp(250px, 38vw, 600px); margin: clamp(1.2rem, 3.4vh, 2.6rem) auto 0; }
.hilo__nombre img { width: 100%; }
.hilo__escena {
  --sw: clamp(330px, 48vw, 960px);       /* ancho del símbolo (v2: algo mayor, para que sus brazos lleguen a los textos; escala entero hasta pantallas grandes) */
  --sh: calc(var(--sw) * .5614);          /* su alto (1140 × 640) */
  --caida: clamp(48px, 12vh, 150px);      /* lo que cae el hilo hasta la punta de arriba (v2: el símbolo, algo más arriba) */
  position: relative; flex: 1; display: flex; flex-direction: column;
  min-height: calc(var(--caida) + var(--sh) + 1.5rem);
}
/* La punta de arriba del símbolo (46,32 % del ancho, 4,45 % del alto) en el eje de la página, bajo el nombre */
.hilo__simbolo { position: absolute; z-index: 1; width: var(--sw); left: calc(50% - var(--sw) * .4632); top: calc(var(--caida) - var(--sh) * .0445); pointer-events: none; }
.hilo__accesos { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; align-items: start; padding-top: calc(var(--caida) - var(--sh) * .12); } /* las palabras, a la altura de la punta, donde el símbolo es estrecho */
.zona {
  --l: 0;
  position: relative; display: flex; flex-direction: column; gap: clamp(.6rem, 1.4vh, 1.1rem);
  padding: .6rem 0 1rem; color: #fff; text-decoration: none; -webkit-tap-highlight-color: transparent;
}
.zona--estudio { align-items: flex-start; justify-self: start; }
.zona--comunidad { align-items: flex-end; text-align: right; justify-self: end; }
.zona__palabra {
  /* Las dos palabras, al mismo tamaño: el que deja caber «Comunidad» (la más larga) en su mitad sin tocar el símbolo */
  font-size: max(2.4rem, calc(var(--sw) * .112)); /* v2: crece con el símbolo, así las tres piezas escalan juntas y no se pisan */
  transition: transform .6s var(--curva);
}
.zona__texto { max-width: 17ch; font-size: clamp(1.05rem, .85rem + .75vw, 1.75rem); line-height: 1.22; color: #f1f1f3; font-weight: 400; }
.zona__accion {
  display: inline-flex; align-items: center; gap: .55rem; margin-top: clamp(.4rem, 1.6vh, 1.4rem);
  font-size: clamp(1rem, .85rem + .45vw, 1.35rem); font-weight: 480; padding-bottom: .35rem;
  background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
}
.zona__accion::after { content: ''; }
.zona__accion svg { width: .85em; height: .85em; transition: transform .45s var(--curva); }
.zona:hover .zona__accion, .zona:focus-visible .zona__accion { background-image: var(--plata); background-size: 100% 2px; }
.zona:hover .zona__accion svg, .zona:focus-visible .zona__accion svg { transform: translate(3px, -3px); }
.zona--estudio:hover .zona__palabra, .zona--estudio:focus-visible .zona__palabra { transform: skewX(var(--oleo-incl, -16deg)) translateX(.08em); }
.zona--comunidad:hover .zona__palabra, .zona--comunidad:focus-visible .zona__palabra { transform: skewX(var(--oleo-incl, -16deg)) translateX(-.08em); }
.zona:focus-visible { outline: 2px solid #fff; outline-offset: 10px; }

.hilo__lienzo { position: absolute; z-index: 1; left: 0; top: 0; width: 0; height: 0; pointer-events: none; }
.hilo__lema { display: flex; align-items: center; gap: 1.4rem; margin: clamp(1rem, 3vh, 2.4rem) auto 0; padding-bottom: clamp(1rem, 2.6vh, 1.8rem); font-size: .8rem; letter-spacing: .1em; color: #e4e4e8; }
.hilo__lema::before, .hilo__lema::after { content: ''; flex: 1; height: 1px; background: var(--linea-o); }
.hilo__nota { margin-top: 0; margin-bottom: 1.2rem; }

/* La espera: el símbolo no se enseña hasta que el hilo lo forma (hilo.js añade .hilo-formado). Si el JS falla, sale solo a los 4,5 s */
.hilo-espera .hilo__simbolo { opacity: 0; animation: hilo-respaldo .6s ease 4.5s forwards; }
@keyframes hilo-respaldo { to { opacity: 1; } }
.hilo-formado .hilo__simbolo { opacity: 1; animation: none; transition: opacity .5s ease; }
.hilo-formado .hilo__lienzo { opacity: 0; transition: opacity .6s ease .05s; }
/* v3: al formarse, un destello recorre el símbolo de lado a lado (solo con movimiento; no se queda: el reflejo vuelve a seguir al puntero) */
.mov.hilo-formado .hilo__simbolo .simbolo__barrido { animation: barrido-hilo 1.2s var(--curva-suave) .3s backwards; }
@keyframes barrido-hilo { from { background-position: 135% 0; } to { background-position: -45% 0; } }

/* Entre la tableta y el portátil pequeño, el símbolo algo menor: las descripciones y los enlaces no tocan sus puntas */
@media (min-width: 761px) and (max-width: 1199px) { .hilo__escena { --sw: clamp(330px, 42vw, 760px); } }

@media (max-width: 760px) {
  .hilo-barra__dentro { min-height: 50px; }
  .hilo { min-height: calc(100svh - 51px); } /* v2: el negro llega hasta el final de la pantalla */
  .hilo__nombre { width: 66vw; margin-top: 1.1rem; }
  .hilo__escena { --sw: min(84vw, 42svh); --caida: clamp(36px, 8svh, 90px); min-height: 0; justify-content: center; } /* en pantallas bajas, el símbolo cede para que quepa todo */
  .hilo__simbolo { position: relative; left: auto; top: auto; margin: calc(var(--caida) - var(--sh) * .0445) 0 0 calc(50% - var(--sw) * .4632); }
  .hilo__accesos { grid-template-columns: minmax(0, 1fr); padding-top: .8rem; }
  .zona, .zona--comunidad { align-items: flex-start; text-align: left; justify-self: stretch; padding: .95rem 0 1.05rem; gap: .45rem; border-top: 1px solid var(--linea-o); }
  .zona__palabra { font-size: calc((100vw - 2 * var(--margen)) / var(--em-comunidad, 7.36) * .94); }
  .zona__texto { max-width: none; font-size: 1.02rem; }
  .zona__accion { margin-top: .2rem; font-size: 1rem; }
  .hilo__lema { font-size: .74rem; gap: .9rem; margin-top: .4rem; }
}

/* Dos secciones negras seguidas (Proceso y Contacto, sin «Quién» entre ellas): una línea fina para que no se fundan */
main .seccion.oscuro + .seccion.oscuro { border-top: 1px solid var(--linea-o); }

/* ---------- Páginas interiores · v3 (02/11/2026): la identidad de la portada, en blanco, negro y plata ---------- */
/* La plata de las letras grandes: cromo con su horizonte (claro arriba, una línea oscura, claro abajo) y un brillo que pasa */
:root {
  --cromo: linear-gradient(180deg, #ffffff 0%, #e6e6ea 38%, #9c9ca3 50%, #f5f5f7 62%, #c4c4ca 100%);
  --brillo: linear-gradient(104deg, transparent 38%, rgb(255 255 255 / .95) 50%, transparent 62%);
  --plata-oscura: linear-gradient(90deg, #5f5f66, #b9b9bf 50%, #5f5f66);
}
.palabra-oleo--plata, .cabeza__palabra .palabra-oleo, .calidad__punto::before {
  color: #fff; -webkit-text-fill-color: transparent;
  background-image: var(--brillo), var(--cromo); background-size: 260% 100%, 100% 100%; background-position: 135% 0, 0 0; background-repeat: no-repeat;
  -webkit-background-clip: text; background-clip: text;
}
@media (forced-colors: active) {
  .palabra-oleo--plata, .cabeza__palabra .palabra-oleo, .calidad__punto::before { -webkit-text-fill-color: currentColor; background: none; }
}

/* La cabecera de Estudio y de Comunidad: la misma palabra que en la portada, ahora en plata */
.cabeza--marca { padding-block: clamp(3rem, 8vw, 7rem) clamp(2.8rem, 6vw, 5rem); }
.cabeza h1.cabeza__palabra { max-width: none; font-size: inherit; letter-spacing: 0; line-height: 1; }
.cabeza__palabra .palabra-oleo { font-size: clamp(2.9rem, 1rem + 5.6vw, 6.6rem); margin-left: -.08em; }
.cabeza__lema {
  position: relative; z-index: 2; margin: clamp(.8rem, 1.6vw, 1.3rem) 0 0; max-width: 17ch;
  font-size: clamp(1.45rem, 1rem + 1.9vw, 2.9rem); font-weight: 560; font-stretch: 108%; letter-spacing: -.028em; line-height: 1.06; text-wrap: balance;
}
.cabeza--marca .cabeza__apoyo { max-width: 44ch; color: #d9d9de; font-size: clamp(1.02rem, .96rem + .3vw, 1.2rem); line-height: 1.5; }
.cabeza__estado { position: relative; z-index: 2; margin-top: 1.6rem; }
.mov.entrada .cabeza__lema { animation: fundir .9s var(--curva) .15s both; }
.mov.entrada .cabeza__palabra .palabra-oleo { animation: palabra-llega 1.1s var(--curva) both, brillo-pasa 1.6s var(--curva-suave) .5s both; }
/* Si se llega desde la portada, la palabra ya viene volando (transición entre páginas): solo pasa el brillo */
.mov.entrada.con-transicion .cabeza__palabra .palabra-oleo { animation: brillo-pasa 1.6s var(--curva-suave) .35s both; }
@keyframes palabra-llega { from { opacity: 0; translate: 0 .18em; } to { opacity: 1; translate: 0 0; } }
@keyframes brillo-pasa { from { background-position: 135% 0, 0 0; } to { background-position: -40% 0, 0 0; } }
@media (min-width: 761px) { .cabeza--marca .simbolo-lateral { width: min(40vw, 620px); } }

/* La palabra y el símbolo pasan de la portada a cada página (Chrome y Safari 18.2+; en el resto, la página sin más) */
.zona--estudio .zona__palabra, .palabra-oleo--estudio { view-transition-name: palabra-estudio; }
.zona--comunidad .zona__palabra, .palabra-oleo--comunidad { view-transition-name: palabra-comunidad; }
.hilo__simbolo .simbolo, .cabeza--marca .simbolo-lateral .simbolo { view-transition-name: simbolo-principal; }
::view-transition-group(palabra-estudio), ::view-transition-group(palabra-comunidad), ::view-transition-group(simbolo-principal) { animation-duration: .75s; animation-timing-function: var(--curva); }

/* Servicios: cada línea con su estado, su descripción a la izquierda y el detalle a la derecha */
.linea-servicio { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; padding-block: clamp(2.4rem, 5vw, 4.2rem); border-top: 1px solid #000; }
.linea-servicio + .linea-servicio { margin-top: clamp(1rem, 3vw, 2rem); }
@media (min-width: 980px) {
  .linea-servicio { grid-template-columns: minmax(0, .82fr) minmax(0, 1.4fr); gap: clamp(3rem, 6vw, 6rem); }
  .linea-servicio__cabeza { position: sticky; top: 96px; align-self: start; }
}
.linea-servicio h3 { font-size: clamp(2.1rem, 1.2rem + 2.8vw, 3.8rem); margin: 1.1rem 0 1.1rem; }
.linea-servicio__desc { margin: 0; color: var(--gris-c); max-width: 38ch; font-size: clamp(1.04rem, .98rem + .3vw, 1.2rem); line-height: 1.5; }

.encargos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); counter-reset: encargo; }
@media (min-width: 700px) { .encargos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.6rem; } }
.encargo { counter-increment: encargo; position: relative; padding: 1.1rem 0 1.5rem; border-top: 1px solid var(--linea-c); }
.encargo::before { content: counter(encargo, decimal-leading-zero); display: block; margin-bottom: 1.2rem; font-size: var(--t-mini); letter-spacing: .2em; color: var(--gris-c); }
.encargo::after { content: ''; position: absolute; left: 0; top: -1px; width: 2.6rem; height: 2px; background: var(--plata-oscura); }
.encargo h4, .propuesta h4 { margin: 0 0 .6rem; font-size: clamp(1.25rem, 1rem + .8vw, 1.6rem); font-weight: 620; font-stretch: 110%; letter-spacing: -.022em; line-height: 1.1; }
.encargo p { margin: 0; color: var(--gris-c); font-size: .98rem; line-height: 1.5; }

.listas { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.2rem; margin-top: clamp(2rem, 4vw, 3rem); }
@media (min-width: 700px) { .listas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.6rem; } }
.listas__titulo, .propuesta__recibes { margin: 0 0 .8rem; font-size: var(--t-mini); font-weight: 600; font-stretch: 112%; letter-spacing: .28em; text-transform: uppercase; line-height: 1.3; }
.listas__nota { margin: 1rem 0 0; font-size: .92rem; color: var(--gris-c); line-height: 1.45; }
.lista-plata { list-style: none; margin: 0; padding: 0; }
.lista-plata li { position: relative; padding: .6rem 0 .6rem 1.7rem; border-bottom: 1px solid var(--linea-c); line-height: 1.45; }
.lista-plata li::before { content: ''; position: absolute; left: 0; top: 1.3em; width: .95rem; height: 2px; background: var(--plata-oscura); }
.oscuro .lista-plata li { border-bottom-color: var(--linea-o); }
.oscuro .lista-plata li::before { background: var(--plata); }

.propuestas { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
@media (min-width: 760px) { .propuestas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.propuesta { position: relative; padding: clamp(1.4rem, 2.6vw, 2.1rem); background: var(--papel); }
.propuesta::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--plata-oscura); }
.propuesta > p:not(.propuesta__recibes) { color: var(--gris-c); margin-bottom: 0; }
.propuesta__recibes { margin-top: 1.5rem; }
.lista-num { list-style: none; margin: 0; padding: 0; counter-reset: n; }
.lista-num li { counter-increment: n; display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); padding: .65rem 0; border-top: 1px solid var(--linea-c); font-size: .98rem; line-height: 1.45; }
.lista-num li::before { content: counter(n, decimal-leading-zero); padding-top: .2rem; font-size: var(--t-mini); letter-spacing: .14em; color: var(--gris-c); }

/* Calidad: tres comprobaciones, cada una con su alcance; los números, en la letra de «Óleo» y en plata */
.calidad { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); counter-reset: cal; border-top: 1px solid var(--linea-o); }
.calidad__punto { counter-increment: cal; display: flex; flex-direction: column; padding-block: 2rem 2.2rem; border-bottom: 1px solid var(--linea-o); }
@media (min-width: 900px) {
  .calidad { grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--linea-o); }
  .calidad__punto { padding-inline: clamp(1.4rem, 2.6vw, 2.6rem); border-bottom: 0; }
  .calidad__punto:first-child { padding-left: 0; }
  .calidad__punto:last-child { padding-right: 0; }
  .calidad__punto + .calidad__punto { border-left: 1px solid var(--linea-o); }
}
.calidad__punto::before {
  content: counter(cal, decimal-leading-zero); align-self: flex-start; margin-bottom: 1.5rem; padding-inline: .05em .2em;
  font-family: 'Oleo Mona', 'Oleo Sans', system-ui, sans-serif; font-style: italic; font-weight: 900; font-stretch: 125%;
  font-size: clamp(3rem, 2rem + 3vw, 5.2rem); line-height: 1; transform: skewX(-16deg);
}
.mov .calidad__punto.visto::before { animation: brillo-pasa 1.6s var(--curva-suave) .25s both; }
.calidad__punto h3 { margin-bottom: 1rem; font-size: clamp(1.3rem, 1rem + 1vw, 1.75rem); letter-spacing: -.022em; line-height: 1.1; }
.calidad__punto p { margin: 0 0 1.4rem; color: var(--gris-o); }
.calidad__punto p.calidad__alcance { margin: auto 0 0; padding-top: 1rem; border-top: 1px solid var(--linea-o); color: #e2e2e6; font-size: .93rem; line-height: 1.45; }
.calidad__alcance span { display: block; margin-bottom: .35rem; font-size: var(--t-mini); letter-spacing: .28em; text-transform: uppercase; color: var(--gris-o); }

/* Contacto: el correo grande a un lado; qué nos ayuda saber, al otro */
.contacto__dentro { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.6rem; }
@media (min-width: 980px) { .contacto__dentro { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 5rem; align-items: end; } }
.contacto .contacto__dentro h2 { margin-bottom: .6rem; }
.contacto__ayuda > p { color: var(--gris-o); max-width: 40ch; }
.contacto__ayuda .lista-plata { margin: 0 0 1.4rem; border-top: 1px solid var(--linea-o); }
.contacto__ayuda .pareja { margin-top: 1.2rem; }

/* Comunidad: el tablero de lo que hay ahora */
.tablero { list-style: none; margin: 0; padding: 0; border-top: 1px solid #000; }
.tablero__fila { display: grid; grid-template-columns: minmax(0, 1fr); gap: .8rem; align-items: center; padding: 1.4rem 0 1.5rem; border-bottom: 1px solid var(--linea-c); }
@media (min-width: 760px) { .tablero__fila { grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; } }
.tablero__fila h3 { margin-bottom: .4rem; font-size: clamp(1.2rem, 1rem + .9vw, 1.65rem); letter-spacing: -.022em; line-height: 1.12; }
.tablero__fila p { margin: 0; color: var(--gris-c); }
.tablero__fila a { color: #000; text-underline-offset: 3px; overflow-wrap: anywhere; }
.tablero__fila a:hover, .tablero__fila a:focus-visible { text-decoration-thickness: 2px; }

.ideas { list-style: none; margin: 1.6rem 0 1.8rem; padding: 0; max-width: 46ch; border-top: 1px solid var(--linea-o); }
.ideas li { padding: .8rem 0; border-bottom: 1px solid var(--linea-o); color: var(--gris-o); line-height: 1.45; }
.ideas strong { color: #fff; font-weight: 600; }

.actividades { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); column-gap: clamp(2rem, 4vw, 4rem); counter-reset: act; }
@media (min-width: 760px) { .actividades { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.actividad { counter-increment: act; position: relative; padding: 1.3rem 0 1.9rem; border-top: 1px solid var(--linea-c); }
.actividad::before { content: counter(act, decimal-leading-zero); display: block; margin-bottom: 1rem; font-size: var(--t-mini); letter-spacing: .2em; color: var(--gris-c); }
.actividad::after { content: ''; position: absolute; left: 0; top: -1px; width: 2.6rem; height: 2px; background: var(--plata-oscura); }
.actividad h3 { margin-bottom: .6rem; font-size: clamp(1.45rem, 1rem + 1.5vw, 2.25rem); letter-spacing: -.03em; line-height: 1.05; }
.actividad p { margin: 0; color: var(--gris-c); max-width: 40ch; }
.nosotros-dentro {
  position: relative; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: clamp(1.5rem, 3vw, 2.3rem) clamp(1.4rem, 3vw, 2.4rem);
  background: #000; color: #fff; font-size: clamp(1.3rem, 1rem + 1.4vw, 2.2rem); font-weight: 560; font-stretch: 106%; letter-spacing: -.022em; line-height: 1.2;
}
.nosotros-dentro::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--plata); }

/* ---------- Ajustes para cerrar la versión privada (02/11/2026) ---------- */
/* Comunidad: un único aviso de apertura, en la cabecera */
.aviso-apertura {
  position: relative; z-index: 2; max-width: 46ch; width: fit-content;
  margin: 1.8rem 0 0; padding: .9rem 1.1rem .9rem 2.3rem; border: 1px solid var(--linea-o); color: #e6e6ea; line-height: 1.45;
}
.aviso-apertura::before { content: ''; position: absolute; left: 1.05rem; top: 1.35rem; width: .55rem; height: .55rem; border-radius: 50%; border: 1.5px dashed currentColor; }
.aviso-apertura strong { color: #fff; font-weight: 620; }

/* Comunidad: lo que encontrarás en el contenido, con números en la letra de «Óleo» (cromo oscuro sobre blanco) */
.ideas-grandes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); counter-reset: idea; border-top: 1px solid #000; }
.ideas-grandes li { counter-increment: idea; padding-block: 1.8rem 2rem; border-bottom: 1px solid var(--linea-c); }
@media (min-width: 900px) {
  .ideas-grandes { grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--linea-c); }
  .ideas-grandes li { padding-inline: clamp(1.4rem, 2.6vw, 2.6rem); border-bottom: 0; }
  .ideas-grandes li:first-child { padding-left: 0; }
  .ideas-grandes li:last-child { padding-right: 0; }
  .ideas-grandes li + li { border-left: 1px solid var(--linea-c); }
}
.ideas-grandes li::before {
  content: counter(idea, decimal-leading-zero); display: block; width: max-content; margin-bottom: 1.3rem; padding-inline: .05em .2em;
  font-family: 'Oleo Mona', 'Oleo Sans', system-ui, sans-serif; font-style: italic; font-weight: 900; font-stretch: 125%;
  font-size: clamp(2.8rem, 2rem + 2.6vw, 4.6rem); line-height: 1; transform: skewX(-16deg);
  color: #000; -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-clip: text;
  background-image: linear-gradient(180deg, #3a3a3f 0%, #000 44%, #85858b 52%, #1c1c1f 68%, #000 100%);
}
@media (forced-colors: active) { .ideas-grandes li::before { -webkit-text-fill-color: currentColor; background: none; } }
.ideas-grandes h3 { margin-bottom: .7rem; font-size: clamp(1.35rem, 1rem + 1.1vw, 1.9rem); letter-spacing: -.025em; line-height: 1.08; }
.ideas-grandes p { margin: 0; color: var(--gris-c); max-width: 34ch; }

/* Comunidad: las actividades, ahora sobre negro */
.oscuro .actividad { border-top-color: var(--linea-o); }
.oscuro .actividad::before, .oscuro .actividad p { color: var(--gris-o); }
.oscuro .actividad::after { background: var(--plata); }
.oscuro .nosotros-dentro { background: #fff; color: #000; }
.oscuro .nosotros-dentro::before { background: var(--plata-oscura); }

/* Un enlace secundario: se ve, pero no compite con la acción principal */
.secundario { margin: 1.6rem 0 0; font-size: 1rem; color: var(--gris-c); }
.detras__texto p.secundario { font-size: 1rem; line-height: 1.5; }
.secundario a { color: #000; text-underline-offset: 4px; font-weight: 540; }
.oscuro .secundario { color: var(--gris-o); }
.oscuro .secundario a { color: #fff; }
.secundario a:hover, .secundario a:focus-visible { text-decoration-thickness: 2px; }

/* Solo para revisar: el tablero de estados de la comunidad (no se publica; se oculta con las notas) */
.solo-rev { padding-block: 2.6rem 3rem; background: #fff8e1; color: #3d2e00; border-top: 1px dashed #b38600; }
.solo-rev__titulo { margin: 0 0 .4rem; font-size: 1rem; font-weight: 650; font-stretch: 100%; letter-spacing: .02em; line-height: 1.3; }
.solo-rev__texto { margin: 0 0 1.4rem; font-size: .88rem; }
.solo-rev .tablero { border-top-color: #3d2e00; }
.solo-rev .tablero__fila { padding: .9rem 0 1rem; border-bottom-color: rgb(61 46 0 / .25); }
.solo-rev .tablero__fila h3 { font-size: 1.05rem; }
.solo-rev .tablero__fila p { color: #3d2e00; font-size: .92rem; }
.solo-rev .estado.estado--si { background: #3d2e00; border-color: #3d2e00; color: #fff8e1; }
.solo-rev .tablero__fila .estado.estado--prep { color: #3d2e00; }
.sin-notas .solo-rev { display: none; }

/* Estudio: «Hablemos de tu proyecto» en la cabecera, hacia el contacto */
.cabeza__acciones { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin-top: 2rem; }
.cabeza__acciones + .indice { margin-top: 1.4rem; }
.mov.entrada .cabeza__acciones { animation: fundir .9s var(--curva) .4s both; }
.condiciones { display: grid; grid-template-columns: minmax(0, 1fr); gap: .4rem 2rem; margin-top: clamp(2rem, 4vw, 3rem); padding: 1.3rem 1.4rem; background: #000; color: #fff; }
@media (min-width: 900px) { .condiciones { grid-template-columns: auto minmax(0, 1fr); align-items: baseline; } }
.condiciones__titulo { margin: 0; font-size: var(--t-mini); font-weight: 600; font-stretch: 112%; letter-spacing: .28em; text-transform: uppercase; color: var(--gris-o); }
.condiciones p:not(.condiciones__titulo) { margin: 0; line-height: 1.5; }
.propuesta__nota { margin: 1.1rem 0 0; padding-top: .9rem; border-top: 1px solid var(--linea-c); font-size: .92rem; color: var(--gris-c); line-height: 1.45; }