/* =========================================================================
   AZAHAR DATA INSIGHTS — CSS de página: metodologia
   Extraído de plantillas/metodologia.html.j2 (fase 2 del refactor CSS).
   Las clases globales azh-* NO se redefinen aquí: viven en azh-globals.css.
   Fuente de verdad: este fichero. La plantilla Jinja2 ya no lleva <style>.
   ========================================================================= */

/* =========================================================
     AZAHAR — PÁGINA METODOLOGÍA D²I
     Solo clases específicas del tipo "metodologia".
     Las clases globales azh-* viven en azh-globals.css.
     ========================================================= */
.metodologia-page *{box-sizing:border-box;}
/* CTA en página multicolor: --accent-light neutro (no hay acento único) */
.metodologia-page .azh-cta-section__inner{--accent-light:var(--azahar-bg-soft,#ecf4fe);}

/* --- HERO --- */
.metodologia-hero{padding-top:80px;padding-right:40px;padding-bottom:72px;padding-left:40px;max-width:1100px;margin:0 auto;}
.metodologia-hero__stack{display:flex;flex-direction:column;gap:28px;}
.metodologia-hero__title{color:var(--azahar-oxford);margin:0;letter-spacing:-0.02em;}
.metodologia-hero__tagline{color:var(--azahar-oxford);margin:0;max-width:920px;font-weight:500;}
.metodologia-hero__lead{color:var(--azahar-oxford-70);margin:0;max-width:820px;}

/* --- FRANJA MOSAICO (heredada de sobre-hero__strip) --- */
.metodologia-strip{width:100%;}
.metodologia-strip__row{display:grid;}
.metodologia-strip__row--top{grid-template-columns:1fr 1fr;height:48px;}
.metodologia-strip__row--bottom{grid-template-columns:1fr 1fr 1fr;height:48px;}
.metodologia-strip__band{width:100%;height:100%;}
.metodologia-strip__band--morado{background:linear-gradient(90deg,#a25aff 0%,#ffffff 100%);}
.metodologia-strip__band--rosa{background:linear-gradient(90deg,#ff61c4 0%,#ffffff 100%);}
.metodologia-strip__band--rojo{background:linear-gradient(90deg,#ffc2c2 0%,#ffffff 70%);}
.metodologia-strip__band--turquesa{background:linear-gradient(90deg,#0eafa7 0%,#ffffff 100%);}
.metodologia-strip__band--naranja{background:linear-gradient(90deg,#f59b00 0%,#ffffff 100%);}

/* --- RESPIRO BLANCO (entre mosaico y bloque azul) --- */
.metodologia-air{height:96px;background:var(--azahar-white,#fff);}

/* --- QUÉ ES D²I (fondo Oxford) --- */
.metodologia-what__inner{display:grid;grid-template-columns:1fr 1.6fr;gap:80px;align-items:start;width:100%;}
.metodologia-what__heading{color:var(--azahar-white);margin:0;letter-spacing:-0.01em;}
/* .metodologia-what__aside agrupa heading + línea en la primera columna del
   grid. La línea NO puede ir dentro del <h2>: el conversor HTML->Bricks
   colapsa los elementos vacíos anidados en un heading a texto literal. Y como
   hermano suelto sería un tercer hijo del grid de 2 columnas. */
.metodologia-what__aside{display:block;}
.metodologia-what__heading-line{display:block;width:64px;height:5px;background:#0eafa7;margin-top:28px;}
.metodologia-what__body{display:flex;flex-direction:column;gap:24px;}
.metodologia-what__body p{color:rgba(255,255,255,.9);margin:0;}

/* --- ADAPTABLE --- */
.metodologia-adaptable__body{display:flex;flex-direction:column;gap:24px;max-width:820px;}
.metodologia-adaptable__body p{color:var(--azahar-oxford-70);margin:0;}
.metodologia-adaptable__body strong{color:var(--azahar-oxford);font-weight:600;}

/* --- CTA INTERMEDIO (patrón sobre-cta-mid) + su mosaico --- */
.metodologia-cta-mid{padding-top:96px;padding-right:40px;padding-bottom:96px;padding-left:40px;background:var(--azahar-white,#fff);}
.metodologia-cta-mid__inner{max-width:880px;margin:0 auto;text-align:center;}
.metodologia-cta-mid__title{font-size:30px;font-weight:600;line-height:1.2;color:var(--azahar-oxford,#05254c);margin:0 0 16px;letter-spacing:-0.01em;}
.metodologia-cta-mid__text{font-size:18px;line-height:1.55;color:var(--azahar-oxford-70,rgba(5,37,76,.7));margin:0 0 32px;}
.metodologia-cta-mid__btn{display:inline-block;padding:20px 44px;background:var(--azahar-button,#4F4CC0);color:var(--azahar-white,#fff);font-size:16px;font-weight:600;letter-spacing:.02em;text-decoration:none;transition:background .2s ease;}
.metodologia-cta-mid__btn:hover{background:var(--azahar-oxford,#05254c);}
/* mosaico bajo el CTA intermedio (2 filas, patrón sobre-sep) */
.metodologia-cta-sep{width:100%;}
.metodologia-cta-sep__row{display:grid;}
.metodologia-cta-sep__row--top{grid-template-columns:1fr 1fr;height:48px;}
.metodologia-cta-sep__row--bottom{grid-template-columns:1fr;height:48px;}
.metodologia-cta-sep__band{width:100%;height:100%;}
.metodologia-cta-sep__band--turquesa{background:linear-gradient(90deg,#0eafa7 0%,#ffffff 100%);}
.metodologia-cta-sep__band--naranja{background:linear-gradient(90deg,#f59b00 0%,#ffffff 100%);}
.metodologia-cta-sep__band--rosa{background:linear-gradient(90deg,#ffd6f0 0%,#ff61c4 100%);}

/* --- DIAGRAMA (fondo BLANCO) --- */
.metodologia-diagram{background:var(--azahar-white,#fff);}
/* inner propio mas ancho para el diagrama, sin trucos de viewport (skill: no 100vw ni margenes negativos) */
.metodologia-page .metodologia-diagram__inner{max-width:1360px;width:100%;}
.metodologia-diagram__intro{color:var(--azahar-oxford-70);margin:0;max-width:820px;}
.metodologia-page .metodologia-diagram__figure{margin:48px 0 0;width:100%;}
.metodologia-page .metodologia-diagram__figure svg{display:block;width:100%;height:auto;max-width:100%;}
.metodologia-diagram__caption{color:var(--azahar-oxford-50);font-size:13px;margin:20px 0 0;text-align:center;}

/* --- TRES DIMENSIONES · ZIGZAG (opción A) --- */
.metodologia-dims__grid{display:flex;flex-direction:column;gap:28px;}
.metodologia-dims__row{display:grid;grid-template-columns:340px 1fr;background:#fff;box-shadow:0 0 0 1px var(--azahar-oxford-10) inset;}
.metodologia-dims__row--flip{grid-template-columns:1fr 340px;}
.metodologia-dims__id{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;gap:10px;}
.metodologia-dims__row--flip .metodologia-dims__id{order:2;}
.metodologia-dims__row--flip .metodologia-dims__body{order:1;}
.metodologia-dims__id--core{background:linear-gradient(150deg,#ffe9c2 0%,#ffffff 100%);}
.metodologia-dims__id--model{background:linear-gradient(150deg,#e8d6ff 0%,#ffffff 100%);}
.metodologia-dims__id--impact{background:linear-gradient(150deg,#c6faf8 0%,#ffffff 100%);}
.metodologia-dims__num{font-size:72px;font-weight:700;line-height:.9;letter-spacing:-0.03em;}
.metodologia-dims__num--core{color:#f59b00;}
.metodologia-dims__num--model{color:#a25aff;}
.metodologia-dims__num--impact{color:#0eafa7;}
.metodologia-dims__key{font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--azahar-oxford-50);}
.metodologia-dims__name{font-size:28px;font-weight:600;color:var(--azahar-oxford);}
.metodologia-dims__body{padding:44px 48px;}
.metodologia-dims__q{font-weight:600;margin:0 0 22px;font-size:18px;color:var(--azahar-oxford,#05254c);}
.metodologia-dims__body p:not(.metodologia-dims__q){color:var(--azahar-oxford-70);margin:0 0 14px;max-width:720px;}
.metodologia-dims__body p:last-child{margin-bottom:0;}

/* --- CALIDAD (5 garantías, fondo suave) con cinta lateral degradado --- */
.metodologia-quality{background:var(--azahar-white,#fff);}
.metodologia-quality__grid{display:grid;grid-template-columns:1fr 1fr;column-gap:80px;row-gap:60px;}
.metodologia-quality__item{display:grid;grid-template-columns:56px 7px 1fr;column-gap:20px;align-items:start;}
.metodologia-quality__icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;color:var(--azahar-oxford,#05254c);}
.metodologia-quality__icon svg{width:52px;height:52px;display:block;}
.metodologia-quality__bar{width:7px;min-width:7px;align-self:stretch;}
.metodologia-quality__item:nth-child(1) .metodologia-quality__bar{background:linear-gradient(180deg,#0eafa7 0%,#ffffff 100%);}
.metodologia-quality__item:nth-child(2) .metodologia-quality__bar{background:linear-gradient(180deg,#a25aff 0%,#ffffff 100%);}
.metodologia-quality__item:nth-child(3) .metodologia-quality__bar{background:linear-gradient(180deg,#ff61c4 0%,#ffffff 100%);}
.metodologia-quality__item:nth-child(4) .metodologia-quality__bar{background:linear-gradient(180deg,#f59b00 0%,#ffffff 100%);}
.metodologia-quality__item:nth-child(5) .metodologia-quality__bar{background:linear-gradient(180deg,#c1ff72 0%,#ffffff 100%);}
.metodologia-quality__item--wide{grid-column:1 / -1;}
.metodologia-quality__item h3{color:var(--azahar-oxford);margin:0 0 14px;}
.metodologia-quality__item p{color:var(--azahar-oxford-75);margin:0;}
.metodologia-quality__closer{color:var(--azahar-oxford)!important;font-weight:600;margin-top:16px!important;}

/* --- SALTO EN AZUL (cita) · calcado de sobre-quote --- */
.metodologia-quote{padding-top:96px;padding-right:40px;padding-bottom:96px;padding-left:40px;}
.metodologia-quote__inner{max-width:820px;width:100%;margin:0 auto;}
.metodologia-quote__mark{font-size:280px;line-height:.8;color:var(--azahar-white);display:block;margin:0 0 -40px;}
.metodologia-quote__text{font-size:26px;line-height:1.5;color:var(--azahar-white);font-weight:400;font-style:italic;margin:0;}

/* --- PRINCIPIOS (enlace estructural, bloque centrado) --- */
.metodologia-principios{background:var(--azahar-white);}
.metodologia-principios__inner{max-width:820px;width:100%;margin:0 auto;text-align:center;}
.metodologia-principios__text{color:var(--azahar-oxford-70);margin:0 auto 28px;max-width:680px;}
.metodologia-principios__link{color:var(--azahar-link,#83c200);text-decoration:none;font-weight:600;font-size:17px;border-bottom:2px solid transparent;transition:border-color .2s ease,color .2s ease;}
.metodologia-principios__link:hover{color:var(--azahar-link-hover,#05254c);border-color:var(--azahar-link-hover,#05254c);}

/* --- RESPIRO BLANCO tras mosaico (reutiliza el mismo patrón del hero) --- */
.metodologia-air--pre-quote{height:96px;background:var(--azahar-white,#fff);}

/* --- MOSAICO SEPARADOR (heredado de sobre-sep) --- */
.metodologia-sep{width:100%;}
.metodologia-sep__row{display:grid;}
.metodologia-sep__row--top{grid-template-columns:1fr 1fr;height:48px;}
.metodologia-sep__row--bottom{grid-template-columns:1fr;height:48px;}
.metodologia-sep__band{width:100%;height:100%;}
.metodologia-sep__band--turquesa{background:linear-gradient(90deg,#0eafa7 0%,#ffffff 100%);}
.metodologia-sep__band--naranja{background:linear-gradient(90deg,#f59b00 0%,#ffffff 100%);}
.metodologia-sep__band--rosa{background:linear-gradient(90deg,#ffd6f0 0%,#ff61c4 100%);}

/* --- RESULTADOS · opción 2 (panel con icono en esquina de color) --- */
.metodologia-results__lead{color:var(--azahar-oxford-70);margin:0 0 48px;max-width:820px;}
.metodologia-results__blocks{display:flex;flex-direction:column;gap:24px;}
.metodologia-results__block{position:relative;padding:40px 44px 36px 104px;background:var(--azahar-white,#fff);box-shadow:0 0 0 1px var(--azahar-oxford-15,rgba(5,37,76,.15)) inset;}
.metodologia-results__corner{position:absolute;left:0;top:0;width:72px;height:72px;display:flex;align-items:center;justify-content:center;}
.metodologia-results__corner svg{width:38px;height:38px;display:block;color:#fff;}
.metodologia-results__block:nth-child(1) .metodologia-results__corner{background:linear-gradient(135deg,#0eafa7 0%,#6ad7d1 100%);}
.metodologia-results__block:nth-child(2) .metodologia-results__corner{background:linear-gradient(135deg,#a25aff 0%,#c39bff 100%);}
.metodologia-results__block:nth-child(3) .metodologia-results__corner{background:linear-gradient(135deg,#f59b00 0%,#ffc666 100%);}
.metodologia-results__block h3{color:var(--azahar-oxford);margin:0 0 12px;}
.metodologia-results__block p{color:var(--azahar-oxford-70);margin:0 0 12px;max-width:820px;}
.metodologia-results__block p:last-child{margin-bottom:0;}

/* Cuadrícula de 4 formatos (nivel 2, tarjetas estilo Home con barra superior) */
.metodologia-formats{margin-top:44px;}
.metodologia-formats__label{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--azahar-oxford-50,rgba(5,37,76,.5));margin:0 0 20px;}
.metodologia-formats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.metodologia-formats__cell{background:var(--azahar-white,#fff);box-shadow:0 0 0 1px var(--azahar-oxford-15,rgba(5,37,76,.15)) inset;display:flex;flex-direction:column;}
.metodologia-formats__bar{height:6px;}
.metodologia-formats__cell:nth-child(1) .metodologia-formats__bar{background:linear-gradient(90deg,#0eafa7 0%,#c6faf8 100%);}
.metodologia-formats__cell:nth-child(2) .metodologia-formats__bar{background:linear-gradient(90deg,#a25aff 0%,#e8d6ff 100%);}
.metodologia-formats__cell:nth-child(3) .metodologia-formats__bar{background:linear-gradient(90deg,#f59b00 0%,#ffe9c2 100%);}
.metodologia-formats__cell:nth-child(4) .metodologia-formats__bar{background:linear-gradient(90deg,#ff61c4 0%,#ffebf8 100%);}
.metodologia-formats__body{padding:24px 24px 28px;}
.metodologia-formats__cell h4{color:var(--azahar-oxford);margin:0 0 8px;}
.metodologia-formats__cell p{color:var(--azahar-oxford-70);margin:0;font-size:15px;}
.metodologia-results__note{margin-top:32px;color:var(--azahar-oxford-70);max-width:920px;}
.metodologia-results__note p{margin:0;}

/* ============================================================
   RESPONSIVE — prefijo .metodologia-page (B2). 991 / 767 / 479
   ============================================================ */
@media (max-width:991px){
  .metodologia-page .metodologia-what__inner{grid-template-columns:1fr;gap:40px;}
  .metodologia-page .metodologia-quality__grid{grid-template-columns:1fr;column-gap:48px;row-gap:48px;}
  .metodologia-page .metodologia-formats__grid{grid-template-columns:1fr 1fr;}
  .metodologia-page .azh-cta-section__inner{grid-template-columns:1fr;padding:64px 56px;gap:32px;}
  .metodologia-page .azh-cta-section__button{justify-content:flex-start;}
}
@media (max-width:767px){
  .metodologia-page .metodologia-hero{padding-left:24px;padding-right:24px;padding-bottom:64px;}
  .metodologia-page .azh-section{padding-inline:24px;}
  .metodologia-page .azh-breadcrumb{padding-inline:24px;}
  .metodologia-page .metodologia-dims__row,
  .metodologia-page .metodologia-dims__row--flip{grid-template-columns:1fr;}
  .metodologia-page .metodologia-dims__row--flip .metodologia-dims__id{order:0;}
  .metodologia-page .metodologia-dims__row--flip .metodologia-dims__body{order:0;}
  .metodologia-page .metodologia-formats__grid{grid-template-columns:1fr;}
  .metodologia-page .metodologia-results__block{padding:36px 28px 32px 28px;}
  .metodologia-page .metodologia-results__corner{position:static;width:56px;height:56px;margin-bottom:20px;}
  .metodologia-page .metodologia-quote{padding-top:72px;padding-bottom:72px;}
  .metodologia-page .metodologia-quote__mark{font-size:180px;margin-bottom:-24px;}
  .metodologia-page .metodologia-quote__text{font-size:21px;}
  .metodologia-page .azh-cta-section{padding-inline:24px;}
  .metodologia-page .azh-cta-section__inner{padding:56px 32px;}
  .metodologia-page .metodologia-cta-mid{padding-left:24px;padding-right:24px;}
}
@media (max-width:479px){
  .metodologia-page .metodologia-dims__id{padding:32px 28px;}
  .metodologia-page .metodologia-dims__body{padding:32px 28px;}
}