/* =========================================================================
   Portada (araant.com): franja de cifras reales sobre fondo claro, los seis
   trabajos en una línea cada uno, filas «para quién» y brillos suaves que
   rompen el fondo oscuro continuo. Solo la carga sitio/index.php.
   Colores: solo los de sitio.css y el tono azul grisáceo del horizonte (147, 166, 193) en los
   brillos. El cobalto sigue siendo solo para la acción principal: nunca en un fondo.
   ========================================================================= */

/* --- Brillos suaves detrás de las secciones (el tono azul grisáceo del horizonte) --- */
.pt-brillo { isolation: isolate; overflow: hidden; }
.pt-brillo::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(52% 46% at 8% 0%, rgba(147, 166, 193, 0.13), transparent 70%),
    radial-gradient(36% 38% at 100% 100%, rgba(147, 166, 193, 0.10), transparent 72%);
}
.pt-brillo--b::before {
  background:
    radial-gradient(48% 44% at 94% 0%, rgba(147, 166, 193, 0.12), transparent 70%),
    radial-gradient(40% 40% at 0% 100%, rgba(147, 166, 193, 0.10), transparent 72%);
}

/* --- Franja de cifras reales, fondo claro -------------------------------------------- */
.pt-cifras {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--ivory); color: var(--onyx);
  padding-block: clamp(44px, 5.5vw, 88px);
}
.pt-cifras::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(58% 130% at 0% 0%, rgba(147, 166, 193, 0.42), transparent 64%),
    radial-gradient(34% 90% at 100% 100%, rgba(147, 166, 193, 0.10), transparent 70%);
}
.pt-cifras :focus-visible { outline-color: var(--onyx); }
.pt-cifras ::selection { background: var(--onyx); color: var(--ivory); }
.pt-cifras__cab {
  display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px 32px;
  padding-bottom: 18px; border-bottom: 1px solid rgba(23, 23, 33, 0.18);
}
.pt-cifras__cab .etiqueta { color: rgba(23, 23, 33, 0.72); }
.pt-cifras__cab p { margin: 0; font-size: 14px; line-height: 1.5; color: rgba(23, 23, 33, 0.72); }
.pt-cifras__cab a { color: var(--onyx); text-underline-offset: 3px; }
.pt-cifras__lista { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.pt-cifras__dato {
  display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 14px;
  padding: clamp(22px, 2.6vw, 40px) clamp(14px, 2vw, 32px) 0 0;
  border-right: 1px solid rgba(23, 23, 33, 0.14);
}
.pt-cifras__dato + .pt-cifras__dato { padding-left: clamp(14px, 2vw, 32px); }
.pt-cifras__dato:last-child { border-right: 0; }
.pt-cifras dt {
  font-size: 13px; line-height: 1.35; font-weight: 480; letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(23, 23, 33, 0.72);
}
.pt-cifras dd {
  margin: 0; min-height: clamp(46px, 5.6vw, 84px); display: flex; align-items: flex-end; font-family: var(--f-titular); font-stretch: var(--ancho-titular); font-weight: 480;
  font-size: clamp(46px, 5.6vw, 84px); line-height: 1; letter-spacing: -0.01em; font-variant-numeric: tabular-nums;
  color: var(--onyx);
}
.pt-cifras dd a { color: inherit; text-decoration: none; display: inline-block; border-bottom: 2px solid transparent; transition: border-color 0.3s var(--curva); }
.pt-cifras dd a:hover { border-bottom-color: var(--onyx); }
.pt-cifras__fecha { font-size: clamp(30px, 3.6vw, 56px); }
@media (max-width: 860px) {
  .pt-cifras__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-cifras__dato { padding: 24px 12px 0 0; border-right: 0; border-bottom: 0; }
  .pt-cifras__dato + .pt-cifras__dato { padding-left: 0; }
  .pt-cifras__dato:nth-child(even) { padding-left: 16px; border-left: 1px solid rgba(23, 23, 33, 0.14); }
  .pt-cifras__dato:nth-child(n + 3) { margin-top: 8px; border-top: 1px solid rgba(23, 23, 33, 0.14); }
}

/* --- 01 Seis trabajos: una línea cada uno ---------------------------------------------- */
.pt-trabajos {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 4vw, 64px);
  border-top: 1px solid var(--linea-fuerte);
}
.pt-trabajos li { border-bottom: 1px solid var(--linea); }
.pt-trabajos a {
  position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr) 28px; gap: 6px 12px; align-items: baseline;
  padding: clamp(22px, 2.4vw, 32px) 0; text-decoration: none;
}
.pt-trabajos a::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--ivory);
  transform: scaleX(0); transform-origin: left; transition: transform 0.55s var(--curva-suave);
}
.pt-trabajos a:hover::before, .pt-trabajos a:focus-visible::before { transform: scaleX(1); }
.pt-trabajos .indice { grid-row: 1 / span 2; grid-column: 1; align-self: start; padding-top: 6px; }
.pt-trabajos strong {
  grid-column: 2; font-family: var(--f-titular); font-stretch: var(--ancho-titular); font-weight: 480;
  font-size: clamp(19px, 1.7vw, 24px); line-height: 1.2; letter-spacing: 0.01em;
}
.pt-trabajos a > span:not(.indice) { grid-column: 2; color: var(--ash); font-size: 16px; line-height: 1.5; }
.pt-trabajos a::after {
  content: "→"; grid-column: 3; grid-row: 1 / span 2; align-self: center; justify-self: end; color: var(--ash);
  transition: transform 0.3s var(--curva), color 0.3s;
}
.pt-trabajos a:hover::after { transform: translateX(4px); color: var(--ivory); }
@media (max-width: 820px) { .pt-trabajos { grid-template-columns: 1fr; } }

/* --- 06 Para quién: cuatro filas ------------------------------------------------------------ */
.pt-publicos { border-top: 1px solid var(--linea-fuerte); }
.pt-publicos a {
  position: relative; display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 5fr) minmax(0, 4fr) 28px;
  gap: 8px clamp(16px, 2vw, 32px); align-items: center;
  padding: clamp(22px, 2.8vw, 38px) 0; border-bottom: 1px solid var(--linea); text-decoration: none;
  transition: background-color 0.4s var(--curva);
}
.pt-publicos a:hover, .pt-publicos a:focus-visible { background: linear-gradient(90deg, rgba(237, 237, 243, 0.05), rgba(237, 237, 243, 0)); }
.pt-publicos .indice { letter-spacing: 0.1em; text-transform: uppercase; font-size: 12px; }
.pt-publicos strong {
  font-family: var(--f-titular); font-stretch: var(--ancho-titular); font-weight: 480;
  font-size: clamp(21px, 2.3vw, 32px); line-height: 1.15; letter-spacing: 0.005em;
}
.pt-publicos a > span:not(.indice) { color: var(--ash); font-size: 16px; line-height: 1.5; }
.pt-publicos a::after { content: "→"; justify-self: end; color: var(--ash); transition: transform 0.3s var(--curva), color 0.3s; }
.pt-publicos a:hover::after { transform: translateX(6px); color: var(--ivory); }
@media (max-width: 860px) {
  .pt-publicos a { grid-template-columns: minmax(0, 1fr) 28px; }
  .pt-publicos .indice, .pt-publicos strong, .pt-publicos a > span:not(.indice) { grid-column: 1; }
  .pt-publicos a::after { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
}

@media (prefers-reduced-motion: reduce) {
  .pt-trabajos a::before { transition: none; }
  .pt-trabajos a::after, .pt-publicos a::after, .pt-cifras dd a { transition: none; }
}

/* --- Primera pantalla: sin palabras sueltas al final de línea ---------------------------------- */
.heroe .display, .heroe .entradilla, .cierre .entradilla { text-wrap: balance; }

/* --- Sección clara: «Lo que no es» (rompe el fondo oscuro continuo) -------------------------------- */
.pt-marfil { position: relative; isolation: isolate; overflow: hidden; background: var(--ivory); color: var(--onyx); }
.pt-marfil::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(52% 90% at 100% 0%, rgba(147, 166, 193, 0.4), transparent 66%),
    radial-gradient(36% 70% at 0% 100%, rgba(147, 166, 193, 0.10), transparent 70%);
}
.pt-marfil :focus-visible { outline-color: var(--onyx); }
.pt-marfil ::selection { background: var(--onyx); color: var(--ivory); }
.pt-marfil h2, .pt-marfil strong { color: var(--onyx); }
.pt-marfil .indice, .pt-marfil .etiqueta, .pt-marfil .lista-numerada li::before { color: rgba(23, 23, 33, 0.72); }
.pt-marfil .lista-numerada span { color: rgba(23, 23, 33, 0.78); }
.pt-marfil .lista-numerada li { border-bottom-color: rgba(23, 23, 33, 0.16); }
.pt-marfil .cabecera-seccion__marca::after { background: rgba(23, 23, 33, 0.2); }

/* --- Ventanas de las tres fases (Encontrar · Pedir · Justificar) ------------------------------------ */
.pt-ventana__nota { margin: 6px 0 0; color: var(--ash); }
.pt-lista { display: grid; }
.pt-lista a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 2px; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--linea); text-decoration: none; min-height: 48px;
}
.pt-lista a:last-child { border-bottom: 0; }
.pt-lista a:hover strong, .pt-lista a:focus-visible strong { text-decoration: underline; text-underline-offset: 3px; }
.pt-lista strong {
  grid-column: 1; font-weight: 480; font-size: 14px; line-height: 1.35; color: var(--ivory);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.pt-lista small { grid-column: 1; font-size: 13px; line-height: 1.4; color: var(--ash); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-lista time { grid-column: 2; grid-row: 1 / span 2; font-size: 13px; color: var(--ash); white-space: nowrap; }
.pt-fases { display: grid; margin: 0; }
.pt-fases li {
  display: flex; align-items: center; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--linea);
  font-size: 15px; color: var(--ash);
}
.pt-fases li:last-child { border-bottom: 0; }
.pt-fases li::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; border: 1px solid var(--ash); }
.pt-fases li.is-hecho { color: var(--ivory); }
.pt-fases li.is-hecho::before { background: var(--ivory); border-color: var(--ivory); }
.pt-fases li.is-actual { color: var(--ivory); font-weight: 480; }
.pt-fases li.is-actual::before { border-color: var(--ivory); box-shadow: 0 0 0 4px rgba(237, 237, 243, 0.16); }
.pt-leyenda { display: grid; margin: 0; }
.pt-leyenda > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--linea); align-items: baseline; }
.pt-leyenda > div:last-child { border-bottom: 0; }
.pt-leyenda dt { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ash); }
.pt-leyenda dd { margin: 0; font-size: 15px; line-height: 1.45; color: var(--ivory); }
@media (max-width: 520px) { .pt-leyenda > div { grid-template-columns: 1fr; gap: 4px; } }

/* --- Dos caminos: subvenciones y levantar capital ------------------------------------------------------------ */
.pt-vias { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); }
.pt-vias article {
  position: relative; padding: clamp(24px, 3vw, 40px); border: 1px solid var(--linea-fuerte); border-radius: var(--r-tarjeta);
  background: linear-gradient(180deg, rgba(237, 237, 243, 0.05), rgba(237, 237, 243, 0)); display: flex; flex-direction: column; gap: 14px;
}
.pt-vias .indice { letter-spacing: 0.1em; text-transform: uppercase; font-size: 12px; }
.pt-vias h3 { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.12; margin: 4px 0 0; }
.pt-vias article > p:not(.indice) { color: var(--ash); font-size: 17px; line-height: 1.55; margin: 0; }
.pt-vias ul { margin: 6px 0 10px; border-top: 1px solid var(--linea); }
.pt-vias li { padding: 11px 0; border-bottom: 1px solid var(--linea); font-size: 15px; color: var(--ivory); }
.pt-vias .enlace-flecha { margin-top: auto; align-self: flex-start; }
@media (max-width: 860px) { .pt-vias { grid-template-columns: 1fr; } }

/* --- Levantar capital en tres pasos ----------------------------------------------------------------------------- */
.pt-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--linea-fuerte); margin: 0; }
.pt-pasos li { padding: clamp(24px, 2.8vw, 40px) clamp(16px, 2.4vw, 36px) clamp(20px, 2vw, 28px) 0; border-bottom: 1px solid var(--linea); }
.pt-pasos li + li { padding-left: clamp(16px, 2.4vw, 36px); border-left: 1px solid var(--linea); }
.pt-pasos .indice { display: block; margin-bottom: 18px; }
.pt-pasos h3 { font-size: clamp(20px, 1.9vw, 26px); line-height: 1.2; margin: 0 0 10px; }
.pt-pasos p { margin: 0; color: var(--ash); font-size: 16px; line-height: 1.55; }
.pt-nota { margin: 22px 0 0; max-width: 62ch; font-size: 14px; line-height: 1.5; color: var(--ash); }
@media (max-width: 860px) {
  .pt-pasos { grid-template-columns: 1fr; }
  .pt-pasos li, .pt-pasos li + li { padding: 22px 0; border-left: 0; }
}