/* ==========================================================================
   /consultingq/ — página de la unidad ConsultingQ
   Identidad de la marca (docs/14 §2.3): morado de acción #4E2073 (hover #7028A6),
   onda #3B0050 → #6A259F, Jost para los títulos de marca, logo en placa blanca.
   Todo va acotado a body.pagina-consultingq; no cambia ningún tamaño de letra de sitio.css.
   ========================================================================== */
.pagina-consultingq{--cq-ink:#2A0638;--cq-wave:#6A259F;--cq-lila:#D9B8F2;--cq-soft:#F4EEF9;--cq-line:#E4D6F0}

/* ---------- Acentos de marca dentro del contenido ---------- */
.pagina-consultingq main .eyebrow{color:var(--cq)}
.pagina-consultingq main :focus-visible{outline-color:var(--cq)}
.btn-cq{background:var(--cq);color:#fff}
.btn-cq:hover{background:var(--cq-2)}

/* ---------- Encabezado: fondo con la onda morada de ConsultingQ ---------- */
.cq-hero{background:var(--cq-ink)}
.cq-hero::before{background:
  radial-gradient(55% 80% at 100% 0%,rgba(131,75,182,.42),transparent 70%),
  linear-gradient(118deg,#1E0428 0%,#3B0050 42%,#4E2073 74%,#6A259F 100%)}
/* Onda inferior (dibujo vectorial, sin texto) */
.cq-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;z-index:-1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 150' preserveAspectRatio='none'%3E%3Cpath d='M0 92C240 40 470 128 760 96s470-86 680-36v90H0z' fill='%236A259F' fill-opacity='.38'/%3E%3Cpath d='M0 124c300-44 560 30 860 6s420-50 580-22v42H0z' fill='%23834BB6' fill-opacity='.30'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.pagina-consultingq .cq-hero .eyebrow{color:var(--cq-lila)}
.cq-hero h1{font-family:Jost,sans-serif;font-weight:700;letter-spacing:-.005em;max-width:23ch}
.cq-hero h1 .cq-brand{color:var(--cq-lila)}
.cq-hero .lead{color:#E9DDF3}
.cq-hero .breadcrumb{color:#D3C1E2}
.cq-hero .breadcrumb a{color:#F1E8F8}
.pagina-consultingq .cq-hero :focus-visible{outline-color:#fff}
.cq-hero .btn-white:hover{background:#F1E9F8}
/* Foto + firma de la marca (placa blanca con el logo y el lema), como en los banners de consultingq.com.
   La persona es de stock: no se presenta como el equipo */
.cq-media{display:grid;grid-template-rows:auto auto;justify-self:end;width:100%;max-width:500px;border-radius:20px;overflow:hidden;
  background:linear-gradient(110deg,#3B0050 0%,#4E2073 55%,#6A259F 100%);box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.12)}
.cq-foto{position:relative;aspect-ratio:490/380;background:#191919;overflow:hidden}
.cq-foto img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.cq-foto .onda{position:absolute;inset:0;background:
  linear-gradient(0deg,rgba(59,0,80,.9) 0%,rgba(59,0,80,0) 34%),
  linear-gradient(100deg,rgba(59,0,80,.55) 0%,rgba(78,32,115,0) 38%)}
.cq-firma{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px 20px;padding:18px 22px 20px}
.cq-firma .plate{display:block;background:#fff;border-radius:10px;padding:10px 14px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.cq-firma .plate img{height:34px;width:auto}
.cq-firma .lema{display:grid;gap:3px;font-family:Jost,sans-serif;font-weight:700;font-size:1rem;line-height:1.25;letter-spacing:.06em;text-transform:uppercase;color:#fff}
.cq-firma .lema span{display:flex;align-items:center;gap:10px}
.cq-firma .lema span::before{content:"";width:16px;height:3px;border-radius:2px;background:var(--cq-lila);flex:none}

/* ---------- Qué hace ---------- */
.cq-about{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}
.cq-about h2{text-wrap:balance}
.cq-about .lead{margin-bottom:1em}
.cq-about > div > p:not(.lead){color:var(--slate);max-width:60ch}
.cq-quote{margin:28px 0 0;padding:22px 26px;border-left:4px solid var(--cq);background:var(--cq-soft);border-radius:0 16px 16px 0}
.cq-quote blockquote{margin:0}
.cq-quote blockquote p{margin:0;font-family:Jost,sans-serif;font-weight:700;font-size:1.25rem;line-height:1.4;color:var(--cq);text-wrap:balance}
.cq-quote figcaption{margin-top:10px;font-size:.88rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.cq-pilares{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.cq-pilares li{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;row-gap:4px;align-items:start;background:#fff;border:1px solid var(--cq-line);border-radius:16px;padding:20px 22px;box-shadow:0 1px 2px rgba(42,6,56,.04)}
.cq-pilares .ico{grid-row:1/3;width:52px;height:52px;border-radius:14px;background:linear-gradient(140deg,#3B0050,#6A259F);display:grid;place-items:center}
.cq-pilares .ico svg{width:26px;height:26px;color:#fff}
.cq-pilares h3{font-family:Jost,sans-serif;font-weight:700;font-size:1.3rem;line-height:1.2;margin:2px 0 0;color:var(--cq)}
.cq-pilares p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.5}

/* ---------- Servicios: 3 + 2 tarjetas en escritorio ---------- */
.cq-servicios{background:var(--bg-alt)}
.card-grid.cq-cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.cq-cards .card{grid-column:span 2;border-color:var(--line);border-top:4px solid var(--cq)}
.cq-cards .card:nth-child(n+4){grid-column:span 3}
.pagina-consultingq .card .ico{background:var(--cq-soft)}
.pagina-consultingq .card .ico svg{color:var(--cq)}
.pagina-consultingq .card .more{color:var(--cq)}
.pagina-consultingq .card .more:hover{color:var(--cq-2);text-decoration:underline;text-underline-offset:3px}
.cq-cards .card h3{text-wrap:balance}

/* ---------- Normas y programas: sección morada ---------- */
.cq-normas{position:relative;overflow:hidden;isolation:isolate;color:#EFE6F6;background:linear-gradient(125deg,#22052E 0%,#3B0050 40%,#4E2073 76%,#6A259F 100%)}
.cq-normas::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(45% 70% at 0% 100%,rgba(131,75,182,.35),transparent 70%)}
.cq-normas h2{color:#fff}
.pagina-consultingq .cq-normas .eyebrow{color:var(--cq-lila)}
.cq-normas .lead{color:#E2D3EE}
.pagina-consultingq .cq-normas :focus-visible{outline-color:#fff}
.cq-norms{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.cq-norms li{grid-column:span 2;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:22px 22px 20px}
.cq-norms li:nth-child(n+4){grid-column:span 3}
.cq-norms b{display:block;font-family:Jost,sans-serif;font-weight:700;font-size:1.5rem;line-height:1.2;color:#fff;margin-bottom:8px}
.cq-norms span{display:block;font-size:.92rem;line-height:1.5;color:#E2D3EE;text-wrap:pretty}
.cq-legal{margin:28px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.16);max-width:62em;font-size:.85rem;line-height:1.55;color:#DCCBEA;text-wrap:pretty}

/* ---------- Formación Q ---------- */
.cq-formacion h2{text-wrap:balance}
.cq-temas-t{font-weight:700;color:var(--slate-900);margin:0 0 12px}
.pagina-consultingq .checklist svg{color:var(--cq)}
.cq-formacion .checklist{margin-bottom:28px}
.cq-formacion .actions{display:flex;gap:12px;flex-wrap:wrap}
.cq-formacion .split-media{border:1px solid var(--line)}

/* ---------- Parte del grupo + contacto de la marca ---------- */
.cq-grupo{background:var(--bg-alt)}
.cq-grupo-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start}
.cq-grupo h2{text-wrap:balance}
.cq-links{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.cq-links a{display:grid;grid-template-columns:44px minmax(0,1fr) 20px;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;text-decoration:none;transition:border-color .2s,box-shadow .2s}
.cq-links a:hover{border-color:#C9B3DC;box-shadow:var(--shadow)}
.cq-links .ico{width:44px;height:44px;border-radius:12px;background:var(--cq-soft);display:grid;place-items:center}
.cq-links .ico svg{width:22px;height:22px;color:var(--cq)}
.cq-links b{display:block;font-size:1rem;line-height:1.3;color:var(--slate-900)}
.cq-links b + span{display:block;font-size:.88rem;line-height:1.45;color:var(--muted);margin-top:2px}
.cq-links .go{width:20px;height:20px;color:var(--cq);transition:transform .2s}
.cq-links a:hover .go{transform:translateX(3px)}
.cq-otras{margin:24px 0 0;display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px}
.cq-otras > span{font-size:.88rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cq-otras ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.cq-otras a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:99px;background:#fff;border:1px solid var(--line);font-weight:700;font-size:.92rem;color:var(--slate);text-decoration:none}
.cq-otras a:hover{border-color:#C9B3DC;color:var(--cq)}
.cq-contact{background:#fff;border:1px solid var(--line);border-top:4px solid var(--cq);border-radius:20px;padding:28px;box-shadow:var(--shadow)}
.cq-contact .plate{display:inline-block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin-bottom:18px}
.cq-contact .plate img{height:34px;width:auto}
.cq-contact h3{font-family:Jost,sans-serif;font-weight:700;font-size:1.4rem;color:var(--cq);margin:0 0 .3em}
.cq-contact > p{color:var(--muted);font-size:.95rem;margin:0 0 18px}
.cq-contact .channel .ico svg{color:var(--cq)}
.cq-contact .channel.wa .ico svg{color:#128C4A}
.cq-contact .cq-web{margin-top:18px;width:100%}

/* ---------- Preguntas frecuentes y cierre ---------- */
.pagina-consultingq .faq summary::after{color:var(--cq)}
.pagina-consultingq .faq details > div a{color:var(--cq);font-weight:600;text-underline-offset:3px}
.cq-cierre{padding-top:0!important}
.pagina-consultingq .cta-band{background:linear-gradient(118deg,#22052E 0%,#3B0050 45%,#4E2073 100%)}
.pagina-consultingq .cta-band::before{background:radial-gradient(50% 120% at 100% 100%,rgba(131,75,182,.55),transparent 70%)}
.pagina-consultingq .cta-band p{color:#E2D3EE}
.pagina-consultingq main .cta-band :focus-visible{outline-color:#fff}

/* ---------- Responsive ---------- */
/* Escritorio: botones de la banda de cierre apilados, así el título queda en dos líneas */
@media (min-width:981px){
  .pagina-consultingq .cta-band .actions{flex-direction:column;align-items:stretch}
}
/* Escala de ESCRITORIO (2026-10-01, pedido del CEO: «menos texto y letra más grande»). Solo desde 981 px:
   en celular y tableta los tamaños quedan como estaban. Lectura 1.1rem (22 px), datos y notas 1rem (20 px),
   etiquetas en mayúsculas .9rem (18 px), igual que la escala final de sitio.css */
@media (min-width:981px){
  /* Lectura */
  .cq-pilares p,.cq-norms span,.cq-temas-t,.cq-formacion .checklist li,.cq-links b,.cq-contact > p,
  .pagina-consultingq .cta-band p{font-size:1.1rem}
  /* Datos y notas */
  .cq-legal,.cq-links b + span,.cq-otras a{font-size:1rem}
  /* Etiquetas en mayúsculas */
  .cq-quote figcaption,.cq-otras > span{font-size:.9rem}
  /* Más aire para la letra grande */
  .cq-pilares li{padding:22px 24px}
  .cq-norms li{padding:24px 24px 22px}
}
/* Escritorio estrecho: columnas iguales para que el correo y la dirección del contacto quepan con la letra grande */
@media (min-width:981px) and (max-width:1180px){
  .cq-grupo-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
}
@media (max-width:1060px){
  .card-grid.cq-cards,.cq-norms{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cq-cards .card,.cq-cards .card:nth-child(n+4),.cq-norms li,.cq-norms li:nth-child(n+4){grid-column:auto}
  .cq-cards .card:last-child,.cq-norms li:last-child{grid-column:1/-1}
}
@media (max-width:980px){
  .cq-about,.cq-grupo-grid{grid-template-columns:minmax(0,1fr);gap:40px}
  .cq-hero h1{max-width:26ch}
  .cq-media{justify-self:stretch;max-width:none}
}
/* Tableta: foto a la izquierda y firma de la marca a la derecha (a todo el ancho, sin hueco lateral) */
@media (min-width:601px) and (max-width:980px){
  .cq-media{grid-template-rows:none;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .cq-foto{aspect-ratio:auto;min-height:300px}
  .cq-firma{flex-direction:column;align-items:flex-start;justify-content:center;gap:22px;padding:28px}
}
@media (max-width:760px){
  .cq-hero::after{height:90px}
}
@media (max-width:600px){
  .card-grid.cq-cards,.cq-norms{grid-template-columns:minmax(0,1fr)}
  .cq-cards .card:last-child,.cq-norms li:last-child{grid-column:auto}
  .cq-contact{padding:22px}
  .cq-quote{padding:18px 20px}
}
@media (max-width:480px){
  .cq-hero .actions .btn,.cq-formacion .actions .btn{flex:1 1 auto}
  .cq-firma{padding:16px 18px 18px}
  .cq-links a{grid-template-columns:44px minmax(0,1fr);padding:14px}
  .cq-links .go{display:none}
  .cq-norms li{padding:18px}
  /* Pilares: ícono junto al título y el texto a todo el ancho de la tarjeta */
  .cq-pilares li{grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:10px;align-items:center;padding:18px}
  .cq-pilares .ico{grid-row:auto;width:44px;height:44px;border-radius:12px}
  .cq-pilares .ico svg{width:22px;height:22px}
  .cq-pilares h3{margin:0}
  .cq-pilares p{grid-column:1/-1}
  /* Contacto de la marca sin marco: los canales usan todo el ancho y el correo cabe en una línea */
  .cq-contact{background:none;border:0;border-top:4px solid var(--cq);border-radius:0;box-shadow:none;padding:24px 0 0}
  .pagina-consultingq .cta-band{padding-inline:20px}
  .pagina-consultingq .cta-band .actions .btn{flex:1 1 100%;padding-inline:.9em}
}
@media (forced-colors:active){
  .cq-firma .plate,.cq-contact .plate{forced-color-adjust:none}
  .cq-pilares .ico{forced-color-adjust:none}
}
