/* ===========================================================
   Trascendencia · estilos compartidos por todas sus páginas
   Se carga SIEMPRE después de brand.css, porque redefine :root.
   Antes vivía incrustado dentro de trascendencia/index.html; se
   sacó aquí al pasar de un scroll único a varias páginas, para no
   tener que corregir lo mismo en siete archivos.
   =========================================================== */

/* Vino DOMINANTE, teal secundario (ver /BRAND.md) */
:root{
  --dom:var(--wine); --dom-deep:var(--wine-deep); --sec:var(--teal);
  --blob1:#6E1A26; --blob2:var(--terra); --blob3:#0E5866; --blob4:var(--gold);
  --blob2-op:.5; --blob3-op:.3; --blob4-op:.24;
}

/* ── Split 5:7 · el patrón base de la marca ── */
.intro-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2.5rem,6vw,6rem);align-items:start}
.intro-body{font-size:1.05rem;font-weight:300;line-height:1.95;color:var(--ink);margin-bottom:1.6rem}
.intro-body b{font-weight:500;color:var(--dom)}
.intro-body .sub{display:block;margin-top:1.6rem;font-size:.92rem;color:var(--gray)}
.intro-divider{width:2.5rem;height:2px;background:var(--terra);margin:2rem 0}
@media(max-width:860px){.intro-grid{grid-template-columns:1fr}}

/* ── Banda sobre color dominante ── */
.questions{background:var(--dom);color:#fff;padding:clamp(4.5rem,10vw,7.5rem) clamp(1.25rem,4vw,3.5rem)}
.questions-head{max-width:1180px;margin:0 auto clamp(2.5rem,5vw,4rem)}
.questions-head .eyebrow{color:var(--terra-lo)}
.questions-head h2{margin-top:1.5rem;font-size:clamp(1.9rem,3.2vw,2.9rem);font-weight:200;line-height:1.1;letter-spacing:-.02em;max-width:24ch;text-wrap:balance}
.q-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr)}
.q{padding:2.5rem 2rem 0 0;border-top:1px solid rgba(255,255,255,.14)}
.q-n{font-family:'Courier New',Courier,monospace;font-size:.66rem;letter-spacing:.2em;color:var(--terra-lo);display:block;margin-bottom:1.5rem;font-weight:500}
.q h3{font-size:1.7rem;font-weight:300;margin-bottom:1rem;letter-spacing:-.01em}
.q p{font-size:.88rem;font-weight:300;line-height:1.8;color:rgba(255,255,255,.62)}
@media(max-width:860px){.q-grid{grid-template-columns:1fr}.q{padding-top:2rem}}

/* ── Tarjetas con foto a sangre ── */
.modes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.mode-card{position:relative;min-height:380px;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;color:#fff}
.mode-card .bg{position:absolute;inset:0;background:#222 center/cover no-repeat;z-index:-2}
.mode-card::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(43,8,14,.6) 62%,rgba(30,6,10,.94) 100%)}
.mode-body{padding:2rem}
.mode-n{font-family:'Courier New',Courier,monospace;font-size:.62rem;letter-spacing:.2em;color:var(--terra-lo);display:block;margin-bottom:1.1rem;font-weight:600;text-transform:uppercase}
.mode-card h3{font-size:1.35rem;font-weight:400;margin-bottom:.3rem;letter-spacing:-.01em}
.mode-place{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:.9rem;display:block}
.mode-card p{font-size:.85rem;font-weight:300;line-height:1.75;color:rgba(255,255,255,.75)}
a.mode-card{text-decoration:none;transition:transform .3s var(--ease)}
a.mode-card:hover{transform:translateY(-4px)}
.mode-go{display:inline-flex;align-items:center;gap:.4rem;margin-top:1.1rem;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--terra-lo)}
@media(max-width:860px){.modes-grid{grid-template-columns:1fr}}

/* ── Banda de legado: texto + foto + cifras ── */
.legacy{background:var(--dom);color:#fff;padding:clamp(4.5rem,10vw,9rem) clamp(1.25rem,4vw,3.5rem);position:relative;overflow:hidden}
.legacy::before{content:'';position:absolute;inset:0;background:radial-gradient(60% 60% at 82% 12%,rgba(185,115,90,.22),transparent 60%);pointer-events:none}
.legacy-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:5fr 4fr 3fr;gap:clamp(2rem,5vw,4rem);align-items:center;position:relative}
.legacy .eyebrow{color:var(--terra-lo);margin-bottom:1.9rem;display:block}
.legacy h2{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:200;line-height:1.1;letter-spacing:-.02em;margin-bottom:1.5rem}
.legacy h2 em{font-style:normal;color:var(--terra-lo)}
.legacy p{font-size:.98rem;font-weight:300;line-height:1.9;color:rgba(255,255,255,.78)}
.legacy-photo{position:relative;border-radius:10px;overflow:hidden;min-height:320px}
.legacy-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.legacy-stats{border-left:1px solid rgba(255,255,255,.16);padding-left:2.25rem}
.legacy-stats .stat{margin-bottom:2.25rem}
.legacy-stats .stat:last-child{margin-bottom:0}
.legacy-stats .num{font-size:2.6rem;font-weight:200;letter-spacing:-.02em;display:block;line-height:1;margin-bottom:.5rem;font-variant-numeric:tabular-nums}
.legacy-stats .lbl{font-size:.8rem;font-weight:300;line-height:1.6;color:rgba(255,255,255,.6)}
@media(max-width:960px){.legacy-grid{grid-template-columns:1fr}.legacy-stats{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.16);padding-top:2rem;display:flex;gap:2rem;flex-wrap:wrap}.legacy-stats .stat{margin-bottom:0}}

/* ── Split de cierre: titular sticky a la izquierda ── */
.closing-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2.5rem,6vw,6rem);align-items:start}
.closing-grid .sec-head{margin-bottom:1.75rem}
.closing-aside{position:sticky;top:118px}
.closing-note{font-size:.9rem;font-weight:300;line-height:1.8;color:var(--gray);max-width:34ch}
.closing-note a{color:var(--dom);text-decoration:none;border-bottom:1px solid var(--terra);padding-bottom:2px;transition:color .2s}
.closing-note a:hover{color:var(--terra)}
@media(max-width:860px){.closing-grid{grid-template-columns:1fr}.closing-aside{position:static}}

/* Testimonios: lenguaje editorial (regla superior, sin caja) */
.testi-list{display:flex;flex-direction:column}
.testi{padding:2.25rem 0;border-top:1px solid var(--line)}
.testi:first-child{border-top:0;padding-top:0}
.testi blockquote{font-size:clamp(1.12rem,1.7vw,1.4rem);font-weight:300;line-height:1.68;color:var(--ink);letter-spacing:-.01em;margin-bottom:1.15rem}
.testi blockquote em{font-style:normal;color:var(--dom)}
.testi cite{display:block;font-style:normal;font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--terra)}

.equipo-foto{border-radius:10px;overflow:hidden}
.equipo-foto img{width:100%;height:auto;display:block}

.faq{display:flex;flex-direction:column}
.faq-item{padding:1.9rem 0;border-top:1px solid var(--line)}
.faq-item:first-child{border-top:0;padding-top:0}
.faq-item h3{font-size:1.12rem;font-weight:400;color:var(--dom);margin-bottom:.7rem;letter-spacing:-.01em}
.faq-item p{font-size:.92rem;font-weight:300;line-height:1.8;color:var(--gray)}

/* ===========================================================
   Piezas nuevas del sitio de varias páginas
   =========================================================== */

/* Navegación entre las páginas de Trascendencia */
.nav-links a.actual{color:var(--dom)}
#nav:not(.scrolled) .nav-links a.actual{color:#fff;opacity:1}

/* Hero corto, para las páginas interiores (el largo queda solo en Inicio) */
.hero-corto{position:relative;min-height:52vh;display:flex;align-items:flex-end;overflow:hidden;background:var(--dom-deep);padding:clamp(6rem,12vw,9rem) clamp(1.25rem,4vw,3.5rem) clamp(2.5rem,5vw,4rem)}
.hero-corto .bg{position:absolute;inset:0;background:#222 center/cover no-repeat;z-index:0;opacity:.5}
.hero-corto .scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,5,9,.55) 0%,rgba(20,5,9,.86) 100%)}
.hero-corto .inner{position:relative;z-index:2;max-width:1180px;margin:0 auto;width:100%}
.hero-corto .eyebrow{color:var(--terra-lo)}
.hero-corto h1{margin-top:1.2rem;font-size:clamp(2.1rem,4.6vw,3.6rem);font-weight:200;line-height:1.08;letter-spacing:-.02em;color:#fff;max-width:20ch;text-wrap:balance}
.hero-corto p{margin-top:1.3rem;font-size:clamp(1rem,1.6vw,1.15rem);font-weight:300;line-height:1.75;color:rgba(255,255,255,.8);max-width:52ch}

/* El contraste que sostiene el mensaje: lo que se gana / lo que se pierde */
.contraste{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:clamp(2rem,4vw,3rem)}
.contraste .lado{padding:2rem;border-radius:10px;border:1px solid var(--line)}
.contraste .lado.gana{background:color-mix(in srgb,var(--dom) 6%,transparent);border-color:color-mix(in srgb,var(--dom) 22%,transparent)}
.contraste .tit{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;display:block;margin-bottom:1.1rem}
.contraste .gana .tit{color:var(--dom)}
.contraste .pierde .tit{color:var(--gray)}
.contraste ul{list-style:none;display:flex;flex-direction:column;gap:.8rem}
.contraste li{font-size:.95rem;font-weight:300;line-height:1.7;color:var(--ink);padding-left:1.1rem;position:relative}
.contraste .pierde li{color:var(--gray)}
.contraste li::before{content:'';position:absolute;left:0;top:.65em;width:6px;height:1px;background:var(--terra)}
@media(max-width:760px){.contraste{grid-template-columns:1fr}}

/* Las cuatro etapas del ciclo, cada una con su pregunta */
.etapas{display:flex;flex-direction:column}
.etapa{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2rem,5vw,4.5rem);padding:clamp(2.5rem,5vw,4rem) 0;border-top:1px solid var(--line);align-items:start}
.etapa:first-child{border-top:0;padding-top:0}
.etapa-n{font-family:'Courier New',Courier,monospace;font-size:.66rem;letter-spacing:.2em;color:var(--terra);display:block;margin-bottom:1rem;font-weight:600;text-transform:uppercase}
.etapa h3{font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:300;color:var(--dom);letter-spacing:-.02em;margin-bottom:.9rem}
.etapa .pregunta{font-size:1.02rem;font-weight:300;line-height:1.7;color:var(--ink);font-style:italic;border-left:2px solid var(--terra);padding-left:1.1rem}
.etapa p{font-size:.95rem;font-weight:300;line-height:1.85;color:var(--gray)}
.etapa p+p{margin-top:1rem}
.etapa-foto{border-radius:10px;overflow:hidden;margin-top:1.5rem}
.etapa-foto img{width:100%;height:auto;display:block}
@media(max-width:860px){.etapa{grid-template-columns:1fr;gap:1.5rem}}

/* Lo que se llevan a casa: los dos entregables */
.entregables{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,2.5rem)}
.entregable{display:flex;flex-direction:column}
.entregable-foto{border-radius:10px;overflow:hidden;background:var(--paper-2);aspect-ratio:4/3;position:relative}
.entregable-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.entregable-foto .pendiente{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:2rem;font-size:.8rem;font-weight:300;line-height:1.7;color:var(--gray);border:1px dashed var(--line);border-radius:10px}
.entregable h3{margin-top:1.5rem;font-size:1.35rem;font-weight:400;color:var(--dom);letter-spacing:-.01em}
.entregable .que-es{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);display:block;margin-top:.5rem}
.entregable p{margin-top:.9rem;font-size:.95rem;font-weight:300;line-height:1.85;color:var(--gray)}
@media(max-width:760px){.entregables{grid-template-columns:1fr}}

/* Galería del evento */
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.galeria figure{border-radius:10px;overflow:hidden;aspect-ratio:3/2;position:relative}
.galeria img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.galeria figure:hover img{transform:scale(1.04)}
.galeria .alta{grid-column:span 2;aspect-ratio:3/2}
/* Variante de dos columnas, para cuando la galeria comparte fila con texto.
   Va como clase y no como estilo en linea, porque en linea pisaba la media
   query y en movil dejaba miniaturas de 159px. */
.galeria.duo{grid-template-columns:1fr 1fr}
@media(max-width:860px){.galeria{grid-template-columns:repeat(2,1fr)}.galeria .alta{grid-column:span 2}}
@media(max-width:520px){.galeria,.galeria.duo{grid-template-columns:1fr}.galeria .alta{grid-column:span 1}}

/* Puente a la otra línea del ecosistema (lo exige la arquitectura de marca) */
.puente{border-top:1px solid var(--line);padding:clamp(2.5rem,5vw,3.5rem) 0 0;margin-top:clamp(3rem,6vw,5rem);display:flex;flex-wrap:wrap;gap:1.5rem;align-items:baseline;justify-content:space-between}
.puente p{font-size:.98rem;font-weight:300;color:var(--gray);max-width:46ch;line-height:1.8}
.puente a{font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--dom);text-decoration:none;border-bottom:1px solid var(--terra);padding-bottom:3px}
.puente a:hover{color:var(--terra)}

/* Banda de foto a sangre, para que el texto respire entre bloques.
   Sin texto encima: la imagen es el descanso, no un soporte de titular. */
.banda{position:relative;overflow:hidden;height:clamp(230px,32vw,420px)}
.banda img{width:100%;height:100%;object-fit:cover;display:block}
.banda.con-texto::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(20,5,9,.75) 100%)}
.banda .pie{position:absolute;left:clamp(1.25rem,4vw,3.5rem);right:clamp(1.25rem,4vw,3.5rem);bottom:clamp(1.5rem,3vw,2.5rem);z-index:2;color:#fff;max-width:44ch}
.banda .pie p{font-size:clamp(1.1rem,2vw,1.5rem);font-weight:300;line-height:1.5;letter-spacing:-.01em;text-shadow:0 2px 20px rgba(0,0,0,.5)}

/* Enlace de texto en versalitas al pie de un bloque. Vivía como estilo en
   línea repetido en cada página, lo que impedía darle un objetivo táctil
   decente en móvil desde la hoja de estilos. */
.link-mas{display:inline-block;color:var(--dom);text-decoration:none;font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--terra);padding-bottom:3px}
.link-mas:hover{color:var(--terra)}
.link-mas.claro{color:var(--terra-lo);border-bottom-color:var(--terra-lo)}
.link-mas.claro:hover{color:#fff}

/* Siguiente paso al pie de cada página interior */
.siguiente{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between;margin-top:clamp(2.5rem,5vw,4rem);padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--line)}
.siguiente .rotulo{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);display:block;margin-bottom:.5rem}
.siguiente h3{font-size:1.25rem;font-weight:400;color:var(--dom);letter-spacing:-.01em}

/* ===========================================================
   REGLAS DE LEGIBILIDAD
   Salen de medir cuatro sitios reales (Aman, Remento, Six Senses,
   Artifact Uprising) y compararlos contra lo que teniamos.

   Hallazgo: ninguno de los cuatro usa peso 300 en el cuerpo, y
   ninguno pasa de 1.6 de interlinea. Nosotros teniamos las tres
   variables aflojadas a la vez (76ch + interlinea 1.93 + peso 300).
   Cualquiera de las tres sola se aguanta; las tres juntas, no.

   Six Senses corre a 77ch igual que nosotros, pero lo sostiene con
   interlinea 1.6 y peso 400. Ese es el intercambio real.
   =========================================================== */

/* 1 · El cuerpo pasa a peso 400. Es el cambio que mas se nota. */
.intro-body, .etapa p, .etapa .pregunta, .faq-item p, .closing-note,
.contraste li, .entregable p, .q p, .testi blockquote{font-weight:400}

/* 1b · Ninguna columna de texto pasa de 60ch, que en esta tipografia son
   unos 560px. El FAQ era el peor caso del sitio y justo la pagina con mas
   texto.
   El limite va sobre el TEXTO, no sobre el contenedor: la unidad ch se
   resuelve contra el tamano de letra del elemento donde se declara, asi que
   ponerla en un contenedor de 16px deja que un parrafo de 15px quepa mucho
   mas ancho de lo previsto. */
.intro-body, .etapa p, .etapa .pregunta, .faq-item p,
.contraste li, .entregable p, .closing-note{max-width:60ch}

/* 2 · Interlinea maxima 1.6, no 1.93. */
.intro-body{line-height:1.62}
.etapa p, .faq-item p, .entregable p{line-height:1.65}
.closing-note{line-height:1.65}

/* 3 · Los titulares necesitan ancho. El .sec-head heredado limita a
   44ch resueltos contra 16px del body, no contra el tamano del h2:
   un titular de 46px terminaba encajonado en 19 caracteres. Los
   referentes le dan entre 62 y 73 a un h2 de 40 a 42px. */
.sec .sec-head, .questions .questions-head{max-width:none}
.sec .sec-head h2, .questions-head h2{max-width:24ch}
.sec .sec-head .eyebrow{display:block}

/* 4 · Texto centrado solo si cabe en dos lineas. El lead caia en
   cuatro lineas centradas, el peor caso: bordes irregulares en ambos
   lados. Estrecharlo habria dado MAS lineas, asi que se ensancha y
   se acorta el texto. */
.hero .lead{max-width:46ch;line-height:1.5;font-weight:400}

/* 5 · El h1 del hero era mas grande que el de cualquier referente
   (92px contra 56-58). Se baja el techo. */
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem)}

/* ===========================================================
   MOVIL  (<=560px)
   Continua las reglas de brand.css con lo propio de Trascendencia.
   La medicion a 375px encontro tres defectos estructurales, no
   cosmeticos:

   1. Cuatro rejillas traen las columnas en atributo style= dentro
      del HTML (q-grid con repeat(3,1fr) en equipo y modalidades,
      repeat(2,1fr) en que-se-llevan). Un estilo en linea le gana a
      cualquier media query sin !important, asi que en el telefono
      esas paginas mostraban tres columnas dentro de 335px.
   2. La galeria se apilaba en una sola columna: seis fotos seguidas,
      una debajo de otra, en una pagina que ya media 11.569px de alto.
      Aman resuelve lo mismo con un carrusel horizontal de cuadrados.
      Es el cambio de infraestructura mas grande de este bloque y el
      que mas altura recorta.
   3. Los rotulos monoespaciados (q-n, mode-n, etapa-n) median 10px
      con 0.2em de espaciado. A ese tamano el espaciado separa las
      letras mas de lo que las agrupa.
   =========================================================== */
@media(max-width:560px){

  /* 1 · Rejillas: una columna, pase lo que pase en el HTML */
  .q-grid,.contraste,.entregables,.etapa,.intro-grid,.closing-grid{grid-template-columns:1fr!important}
  .q-grid{gap:0}
  .q{padding-top:1.75rem}

  /* 2 · Galeria como carrusel horizontal a sangre.
     El margen negativo la saca del padding de .sec para que la
     primera foto empiece pegada al borde izquierdo y la siguiente
     asome por la derecha: esa esquina asomada es lo que le dice al
     dedo que hay mas. */
  .galeria,.galeria.duo{
    display:flex!important;gap:.7rem;overflow-x:auto;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    margin:0 -1.25rem;padding:0 1.25rem 1.25rem;scrollbar-width:none;
  }
  .galeria::-webkit-scrollbar{display:none}
  .galeria figure,.galeria .alta{
    flex:0 0 76%;scroll-snap-align:center;aspect-ratio:1/1;grid-column:auto
  }

  /* 3 · Titulares interiores. Varios llevan el tamano en linea. */
  .sec h2{font-size:1.7rem!important;line-height:1.28!important;font-weight:300!important;max-width:none!important}
  .hero-corto h1{font-size:1.75rem;line-height:1.26;font-weight:300;max-width:none}
  .hero-corto p{font-size:1rem;line-height:1.6}
  .hero-corto{min-height:auto;padding:7rem 1.25rem 3rem}

  /* 4 · Cuerpo a 16px en todo lo que se lee seguido */
  .intro-body,.etapa p,.faq-item p,.contraste li,
  .entregable p,.q p,.mode-card p,.puente p,.closing-note{
    font-size:1rem;line-height:1.65;max-width:none
  }
  .banda .pie p{font-size:1.05rem;line-height:1.45}

  /* 5 · Rotulos monoespaciados legibles */
  .q-n,.mode-n,.etapa-n,.entregable .que-es,.contraste .tit,
  .siguiente .rotulo,.testi cite{font-size:.72rem;letter-spacing:.12em}

  /* 6 · Tarjetas de modalidad mas cortas: tres seguidas a 380px
     eran 1.140px de scroll antes de llegar a nada nuevo. */
  .mode-card{min-height:300px}
  .mode-body{padding:1.5rem}
  .mode-go{margin-top:1rem;padding:.7rem 0;font-size:.75rem}

  /* 7 · Los bloques de dos piezas dejan de fingir que son una fila */
  .siguiente,.puente{flex-direction:column;align-items:stretch;gap:1.25rem}
  .siguiente .btn-fill,.puente a{align-self:flex-start}
  .puente a{padding:.7rem 0}

  /* 8 · Objetivo tactil de 44px en los enlaces de texto sueltos.
     Median entre 18 y 20px de alto, la mitad del minimo de Apple y
     Google. El padding vertical no mueve nada porque el enlace es
     el unico contenido de su parrafo. */
  .closing-note a,.link-mas,.puente a{padding-top:.95rem;padding-bottom:.95rem;border-bottom-width:0;box-shadow:0 1px 0 var(--terra)}
  .link-mas.claro{box-shadow:0 1px 0 var(--terra-lo)}
  .etapa .pregunta{font-size:1rem}

  /* 9 · Secciones que no son .sec y por eso se quedaron con la
     escala de escritorio */
  .legacy h2{font-size:1.7rem;line-height:1.28;font-weight:300}
  .legacy p{font-size:1rem;line-height:1.65}
  .questions-head h2{font-size:1.7rem!important;line-height:1.28!important;font-weight:300!important;max-width:none!important}
  .moment blockquote{font-size:1.25rem;line-height:1.5}
  .intro-body[style*="font-size"]{font-size:.95rem!important}
}