/* Secciones nuevas. No modifica los selectores de las secciones aprobadas. */
:root {
  --tarjeta-titulo: clamp(40px, 5.5vw, 96px);
  --tarjeta-subtitulo: clamp(14px, 1.15vw, 20px);
  --tarjeta-texto: clamp(16px, 1.15vw, 20px);
  --campo-texto: clamp(16px, 1.8vw, 26px);
}
.contenido-punto { padding-inline: 6.2%; font-family: var(--tipo-familia); }
.contenido-punto .titulo-seccion { margin: 0 0 16px; }
.contenido-punto .parrafo { margin: 0; }
.contenido-punto .parrafo + .parrafo { margin-top: var(--seccion-separacion); }
.contenido-punto strong { font-weight: 800; }
.linea { display: block; }
.boton-punto {
  display: inline-flex; justify-content: center; align-items: center;
  background: var(--color-marca); color: #fff; border: 0; border-radius: 5px;
  font-family: var(--tipo-familia); font-weight: 900; font-size: clamp(18px, 3.4vw, 56px);
  line-height: 1.1; letter-spacing: -.065em; padding: .4em .65em;
  text-decoration: none; cursor: pointer; max-width: 100%; min-height: 44px;
}
.boton-punto:focus-visible, .tarjeta:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible { outline: 3px solid var(--color-texto); outline-offset: 4px; }
.accion-derecha { display: flex; justify-content: flex-end; margin-top: var(--seccion-separacion); }
.introduccion-servicios { padding-bottom: var(--seccion-separacion); }
.introduccion-servicios .bajada { margin-bottom: var(--seccion-separacion); }
.tarjetas {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 20px; align-items: start; padding: 0 5% var(--seccion-espacio-inferior);
  font-family: var(--tipo-familia);
}
.tarjeta {
  position: relative; padding: 28px 22px 24px; background: var(--color-marca);
  color: #fff; border-radius: 7px; cursor: pointer; min-width: 0;
}
.tarjeta h3 { margin: 0 0 14px; font-size: var(--tarjeta-titulo); font-weight: 900; letter-spacing: -.085em; line-height: 1.12; }
.tarjeta__subtitulo { font-size: var(--tarjeta-subtitulo); font-weight: 700; line-height: 1.2; margin: 0; }
.tarjeta__indicador { position: absolute; right: 18px; top: 18px; width: 17px; height: 17px; border: 2px solid #fff; border-radius: 50%; }
.tarjeta[aria-expanded="true"] .tarjeta__indicador { background: #fff; }
.tarjeta__detalle { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 220ms ease; }
.tarjeta[aria-expanded="true"] .tarjeta__detalle { grid-template-rows: 1fr; }
.tarjeta__interior { overflow: hidden; min-height: 0; }
.tarjeta__texto { padding-top: 18px; font-size: var(--tarjeta-texto); font-weight: 400; line-height: 1.35; letter-spacing: -.035em; }
.tarjeta__texto p { margin: 0 0 16px; }
.tarjeta__texto p:last-child { margin-bottom: 0; }
.cierre .boton-punto { margin-block: 22px; }
.formulario { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px 8%; margin-top: 48px; }
.campo { display: flex; flex-direction: column; gap: 8px; font-size: var(--campo-texto); line-height: 1.2; font-weight: 500; letter-spacing: -.035em; }
.campo input,.campo select,.campo textarea { width: 100%; border: 1px solid var(--color-marca); border-radius: 6px; background: #fff; color: var(--color-texto); font: 400 16px/1.4 Poppins,sans-serif; padding: 10px 12px; min-height: 46px; }
.campo textarea { min-height: 150px; resize: vertical; }
.campo-error { color: var(--color-marca); font-size: 14px; font-weight: 500; letter-spacing: 0; }
.campo-error:empty { display: none; }
.campo [aria-invalid="true"] { border-width: 2px; }
.formulario__pie { grid-column: 1/-1; text-align: center; }
.estado-envio { font: 500 16px/1.5 Poppins,sans-serif; }
.boton-punto:disabled { opacity: .65; cursor: wait; }
.trampa { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.agradecimiento .accion-derecha { justify-content: center; }
.agradecimiento[hidden] { display: none; }
@media (max-width: 600px) {
  .contenido-punto { padding-inline: 10%; }
  .contenido-punto .titulo-seccion { margin-bottom: 12px; }
  .tarjetas { grid-template-columns: 1fr; padding-inline: 10%; gap: 20px; }
  .tarjeta { padding: 28px 20px 22px; border-radius: 12px; }
  :root { --tarjeta-titulo: clamp(40px, 13vw, 78px); --tarjeta-subtitulo: 14px; --tarjeta-texto: 16px; }
  .boton-punto { border-radius: 999px; }
  .formulario { grid-template-columns: 1fr; gap: 22px; margin-top: 32px; }
  .campo { font-size: 17px; }
  .formulario__pie .boton-punto { border-radius: 8px; }
  .campo--nombre { order: 1; } .campo--telefono { order: 2; } .campo--email { order: 3; }
  .campo--marca { order: 4; } .campo--web { order: 5; } .campo--publicidad { order: 6; }
  .campo--presupuesto { order: 7; } .campo--mensaje { order: 8; } .formulario__pie { order: 9; }
}
@media (prefers-reduced-motion: reduce) { .tarjeta__detalle { transition: none; } }