/* ══════════ Da Vinci IA — estilos de páginas interiores ══════════ */

.page .nav { position: sticky; }
.pmain { padding-top: 4.6rem; }

/* Hero de página */
.phero {
  max-width: 1100px;
  margin: 0 auto;
  padding: clamp(3rem, 8vh, 5.5rem) clamp(1.25rem, 5vw, 2rem) var(--s4);
}
.phero__crumb { font-size: 0.85rem; color: var(--gris-medio); margin-bottom: var(--s2); }
.phero__crumb a { color: var(--naranja-oscuro); text-decoration: none; }
.phero__crumb a:hover { text-decoration: underline; }
.phero h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); letter-spacing: -0.015em; max-width: 22ch; }
.phero__lead {
  margin-top: var(--s3);
  font-family: var(--font-accent);
  font-style: italic;
  font-size: clamp(1.15rem, 2.2vw, 1.5rem);
  color: var(--naranja-oscuro);
  max-width: 38rem;
}

/* Bloques de contenido */
.pblock {
  max-width: 1100px;
  margin: 0 auto;
  padding: var(--s4) clamp(1.25rem, 5vw, 2rem);
}
.pblock h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: var(--s3); }
.pblock__text { color: var(--gris-medio); max-width: 42rem; margin-bottom: var(--s2); font-size: 1.05rem; }
.pblock__text a { color: var(--naranja-oscuro); }
.pblock--tinted {
  max-width: none;
  background: var(--papel-hondo);
  border-block: 1px solid var(--linea);
}
.pblock--tinted > * { max-width: 1100px; margin-inline: auto; }
.pblock--tinted h2, .pblock--tinted ul, .pblock--tinted p { padding-inline: 0; }
.pblock--tinted { padding: var(--s5) clamp(1.25rem, 5vw, 2rem); }
.pnarrow { max-width: 820px; }

/* Lista de características */
.plist { list-style: none; }
.plist li {
  padding: var(--s3) 0;
  border-top: 1px solid var(--linea);
  color: var(--gris-medio);
  max-width: 44rem;
}
.plist li:last-child { border-bottom: 1px solid var(--linea); }
.plist strong { color: var(--tinta); display: block; font-size: 1.08rem; margin-bottom: 0.25rem; }

/* Casos de uso */
.pcasos { list-style: none; display: grid; gap: var(--s2); max-width: 44rem; }
.pcasos li {
  background: var(--blanco-calido);
  border: 1px solid var(--linea);
  border-left: 3px solid var(--naranja);
  border-radius: 8px;
  padding: var(--s2) var(--s3);
  color: var(--gris-medio);
}

/* Grid de tarjetas (módulos, blog) */
.pgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--s3);
}
.pcard {
  display: block;
  background: var(--blanco-calido);
  border: 1px solid var(--linea);
  border-radius: 18px;
  padding: var(--s4) var(--s3) var(--s3);
  text-decoration: none;
  color: inherit;
  box-shadow: 0 14px 34px -24px rgba(62, 62, 64, 0.3);
  transition: transform 0.3s var(--ease-out), box-shadow 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
}
.pcard:hover { transform: translateY(-4px); border-color: var(--naranja); box-shadow: 0 24px 50px -26px rgba(217, 111, 31, 0.4); }
.pcard h3 { font-size: 1.3rem; }
.pcard p { color: var(--gris-medio); margin-top: 0.6rem; font-size: 0.95rem; }
.pcard__go { display: inline-block; margin-top: var(--s3); color: var(--naranja-oscuro); font-weight: 600; font-size: 0.9rem; }

/* Pasos del método */
.psteps { list-style: none; display: grid; gap: var(--s3); max-width: 820px; }
.pstep {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: var(--s3);
  align-items: start;
  background: var(--blanco-calido);
  border: 1px solid var(--linea);
  border-radius: 14px;
  padding: var(--s3);
}
.pstep__n {
  font-family: var(--font-accent);
  font-style: italic;
  font-size: 2.4rem;
  color: var(--naranja);
  line-height: 1;
  text-align: center;
  padding-top: 0.2rem;
}
.pstep h3 { font-size: 1.25rem; }
.pstep p { color: var(--gris-medio); margin-top: 0.4rem; }

/* Cita */
.pquote { margin: var(--s4) 0; border-left: 2px solid var(--naranja); padding-left: var(--s3); }
.pquote p {
  font-family: var(--font-accent);
  font-style: italic;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  color: var(--carbon);
  line-height: 1.3;
}
.pquote cite { display: block; margin-top: var(--s1); font-style: normal; color: var(--naranja-oscuro); font-size: 0.9rem; }

/* CTA final */
.pcta {
  text-align: center;
  background: var(--carbon-hondo);
  color: var(--papel);
  padding: var(--s5) clamp(1.25rem, 5vw, 2rem);
  margin-top: var(--s5);
}
.pcta h2 { color: var(--papel); font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
.pcta p { color: rgba(250, 246, 239, 0.72); max-width: 34rem; margin: var(--s2) auto var(--s4); }
.pcta .btn--solid { background: var(--naranja); border-color: var(--naranja); color: #fff; }
.pcta .btn--solid:hover { background: var(--naranja-oscuro); border-color: var(--naranja-oscuro); box-shadow: 0 10px 30px -10px rgba(245, 134, 52, 0.6); }

/* Formulario en página de contacto */
.contact__form--page { padding-block: 0 var(--s4); }

@media (max-width: 720px) {
  .pstep { grid-template-columns: 44px minmax(0, 1fr); gap: var(--s2); }
  .pstep__n { font-size: 1.8rem; }
}

/* Etiquetas técnicas en el hero de página */
.phero__tags { margin-top: 1.2rem; }
