/* Piel del botón — los cuatro tokens opcionales del tema: buttonFill,
   buttonShadow, buttonColor y buttonTextColor. La plantilla es el punto de
   partida; estos tokens la corrigen sin salirse del tema activo.

   Sin tokens, .wb-root no lleva ningún data-btn-* y este archivo no aplica NADA:
   los cuatro temas se ven exactamente igual que antes de existir. Se carga
   DESPUÉS de themes.css (el override del dueño le gana al tema) y ANTES de
   brands.css (la identidad de marca es un opt-in por bloque y sigue mandando).

   Alcance: los bloques con forma de botón — cta, link, membresía y horario.
   Quedan fuera los bloques de contenido (heading/text/spacer) y los dos que
   core.css ya declara sin cromo (socials es una fila de círculos, marquee es una
   cinta a sangre): el mismo :not(:where(…)) que repite cada tema.

   Especificidad, a propósito y solo hasta donde hace falta: la cadena
   `.wb-root[data-btn-*] .wb-blocks[data-layout] :is(.wb-block, .wb-cta)` pesa
   (0,5,0), que es lo que pide la regla más específica de themes.css
   (`.theme-sticker.mode-dark .wb-blocks > .wb-link:nth-child(even)`, también
   (0,5,0), desempatada por orden de carga). El :not() va dentro de :where() para
   no sumar de más — es la lección del incidente en que un :not() suelto aplastó
   las reglas de tema. */

/* ---- 1 · buttonColor: el fondo del botón (borde y sombra siguen siendo del tema) ---- */
.wb-root[data-btn-color] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  background: var(--wb-btn-color);
}

/* ---- 2 · buttonFill: cómo se rellena ----
   Va después del color para que `outline` pueda vaciar el fondo aunque haya
   buttonColor: ahí el color entra como tinta del borde, no como relleno. */
.wb-root[data-btn-fill="solid"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  background: var(--wb-btn-color, var(--wb-accent));
  /* transparente y no `none`: el ancho del borde se queda, así el botón no cambia de tamaño */
  border-color: transparent;
  color: var(--wb-btn-text, #fff);
}
/* sobre un botón lleno, los detalles que el tema pinta en acento (o en gris de
   etiqueta) quedarían del color del propio fondo: siguen al texto del botón */
.wb-root[data-btn-fill="solid"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) :is(.wb-link-icon, .wb-membership-note, .wb-membership-price, .wb-schedule-label) {
  color: inherit;
}

/* el borde completo: un tema puede no tener ninguno (el horario del spa) y sin
   fondo ni borde el botón desaparecería */
.wb-root[data-btn-fill="outline"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  background: transparent;
  border: 2px solid var(--wb-btn-color, var(--wb-accent));
  /* el CTA viene con texto blanco de core.css: sobre un fondo vaciado hay que
     devolverlo a la tinta del tema o desaparece en los temas claros */
  color: var(--wb-btn-text, inherit);
}

.wb-root[data-btn-fill="soft"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  background: color-mix(in srgb, var(--wb-btn-color, var(--wb-accent)) 15%, transparent);
  border-color: color-mix(in srgb, var(--wb-btn-color, var(--wb-accent)) 32%, transparent);
  color: var(--wb-btn-text, inherit);
}

/* ---- 3 · buttonTextColor: la tinta del botón (gana sobre la que fije el relleno) ---- */
.wb-root[data-btn-text] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  color: var(--wb-btn-text);
}

/* ---- 4 · buttonShadow ---- */
.wb-root[data-btn-shadow="none"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  box-shadow: none;
}
/* difusa: teñida con el acento para que también se lea sobre los temas oscuros,
   donde una sombra negra es invisible. La primera declaración es el respaldo
   para navegadores sin color-mix. */
.wb-root[data-btn-shadow="soft"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .45);
  box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--wb-accent) 62%, transparent);
}
/* dura: la sombra sólida desplazada del sticker, en la tinta del tema activo —
   grafito en los modos claros, blanco en los oscuros */
.wb-root[data-btn-shadow="hard"] .wb-blocks[data-layout] :is(.wb-block, .wb-cta):not(:where(.wb-heading, .wb-text, .wb-spacer, .wb-socials, .wb-marquee)) {
  box-shadow: 4px 4px 0 var(--wb-fg);
}

/* Curated compositions: opt-in only. The model supplies palette and typography;
   the renderer owns spacing, information hierarchy and readable surfaces. */
.wb-root[data-composition] {
  --wb-bg: #f6f3ed; --wb-fg: #242721; --wb-muted: #555b53;
  --wb-surface: rgba(255,255,255,.88); --wb-edge: rgba(35,45,35,.18);
  --wb-logo-w: 76px; --wb-logo-h: 76px;
  padding: 40px 24px 24px; gap: 28px;
}
.wb-root[data-composition].mode-dark {
  --wb-bg: #111512; --wb-fg: #f8f6f0; --wb-muted: #d0d4ce;
  --wb-surface: rgba(28,34,31,.88); --wb-edge: rgba(238,240,230,.24);
  --wb-scrim: rgba(8,12,10,.78);
}
.wb-root[data-composition] .wb-header {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 0; gap: 12px;
}
.wb-root[data-composition] .wb-logo {
  animation: none; transform: none; border: 1px solid var(--wb-edge); background: var(--wb-surface);
  box-shadow: 0 6px 24px #0002; border-radius: var(--wb-logo-r);
}
.wb-root[data-composition] .wb-name {
  background: none; color: var(--wb-fg); -webkit-text-fill-color: var(--wb-fg);
  text-transform: none; font-size: 32px; line-height: 1.1;
  letter-spacing: -.035em; font-weight: 600; animation: none;
}
.wb-root[data-composition] .wb-eyebrow { color: var(--wb-muted); font-size: 10px; letter-spacing: .22em; }
.wb-root[data-composition] .wb-tagline {
  padding: 0; border: 0; border-radius: 0; background: none; color: var(--wb-muted);
  font-size: 14px; line-height: 1.65; letter-spacing: 0; text-transform: none; max-width: 38ch;
}
.wb-root[data-composition] .wb-blocks[data-layout] {
  display: flex; flex-direction: column; gap: 14px; padding: 0;
}
.wb-root[data-composition] .wb-blocks[data-layout] .wb-block:not(:where(.wb-heading,.wb-text,.wb-spacer,.wb-socials,.wb-marquee)) {
  background: var(--wb-surface); color: var(--wb-fg); border: 1px solid var(--wb-edge);
  border-radius: max(12px, var(--wb-radius)); padding: 18px 20px;
  box-shadow: 0 8px 24px -18px #0008; backdrop-filter: blur(16px);
  text-transform: none; letter-spacing: 0; min-height: 60px; font-size: 14px;
}
.wb-root[data-composition] .wb-blocks[data-layout] .wb-cta {
  border: 1px solid var(--wb-edge); border-radius: max(14px, var(--wb-radius));
  min-height: 64px; padding: 20px; font-size: 17px; letter-spacing: 0;
  text-transform: none; box-shadow: 0 12px 26px -18px #0009;
}
.wb-root[data-composition] .wb-blocks[data-layout] .wb-block :is(.wb-link-icon,.wb-membership-price,.wb-schedule-label) {
  color: var(--wb-fg);
}
.wb-root[data-composition] .wb-blocks[data-layout] .wb-membership-note { color: var(--wb-muted); font-size: 12px; line-height: 1.5; }
.wb-root[data-composition] .wb-membership-label { font-size: 15px; line-height: 1.4; }
.wb-root[data-composition] .wb-schedule-hours { font-family: var(--wb-font); font-size: 18px; line-height: 1.5; font-weight: 500; }
.wb-root[data-composition] .wb-schedule-label { font-size: 10px; letter-spacing: .18em; }
.wb-root[data-composition] .wb-socials { gap: 12px; margin: 6px 0; flex-wrap: wrap; }
.wb-root[data-composition] .wb-social { width: 44px; height: 44px; border: 1px solid var(--wb-edge); background: var(--wb-surface); color: var(--wb-fg); }
.wb-root[data-composition] .wb-heading { margin-top: 16px; border: 0; padding: 0 0 8px; font-size: 18px; text-transform: none; letter-spacing: -.01em; }
.wb-root[data-composition] .wb-marquee { background: var(--wb-surface); border-block: 1px solid var(--wb-edge); margin: 10px 0; }
.wb-root[data-composition] .wb-marquee-text { color: var(--wb-fg); font-size: 10px; letter-spacing: .18em; }
.wb-root[data-composition] .wb-text { color: var(--wb-fg); line-height: 1.7; }
.wb-root[data-composition] .wb-footer { padding-top: 28px; color: var(--wb-muted); }
.wb-root[data-composition] :is(a,button):focus-visible { outline: 3px solid var(--wb-fg); outline-offset: 4px; }

/* Atmospheric glass: mineral light pools echo the references without busy chrome. */
.wb-root[data-composition="atmosphere"]::before,
.wb-root[data-composition="boutique"]::before {
  content: ''; display: block; inset: -100px auto auto -120px;
  width: 380px; height: 420px; margin: 0;
  background: radial-gradient(ellipse, color-mix(in srgb,var(--wb-accent) 36%,transparent),transparent 68%);
  opacity: .7; filter: blur(30px); animation: none;
}
.wb-root[data-composition="atmosphere"]::after,
.wb-root[data-composition="boutique"]::after {
  content: ''; display: block; inset: 300px -160px auto auto;
  width: 360px; height: 400px; margin: 0;
  background: radial-gradient(ellipse, color-mix(in srgb,var(--wb-accent) 28%,transparent),transparent 68%);
  opacity: .65; filter: blur(28px); animation: none;
}
.wb-root[data-composition="atmosphere"] .wb-header { padding-top: 12px; }
.wb-root[data-composition="atmosphere"] .wb-name { font-size: 30px; }

/* Editorial: typography leads; service rows share a quiet ruled surface. */
.wb-root[data-composition="editorial"]::before,
.wb-root[data-composition="editorial"]::after { content: none; }
.wb-root[data-composition="editorial"] .wb-header { align-items: flex-start; text-align: left; gap: 18px; }
.wb-root[data-composition="editorial"] .wb-name { font-size: clamp(36px,10vw,48px); max-width: 14ch; }
.wb-root[data-composition="editorial"] .wb-logo { width: 60px; height: 60px; }
.wb-root[data-composition="editorial"] .wb-blocks[data-layout] .wb-membership {
  border-width: 0 0 1px; border-radius: 0; box-shadow: none; padding-inline: 0;
  background: transparent; backdrop-filter: none;
}
.wb-root[data-composition="editorial"][data-bgimage] .wb-blocks[data-layout] .wb-membership { background: var(--wb-surface); padding-inline: 16px; }
.wb-root[data-composition="editorial"] .wb-socials { justify-content: flex-start; padding-top: 18px; }

/* Boutique: round booking, generous identity and a contained visit-information card. */
.wb-root[data-composition="boutique"] { padding-top: 48px; gap: 32px; }
.wb-root[data-composition="boutique"] .wb-name { font-size: 38px; font-weight: 500; }
.wb-root[data-composition="boutique"] .wb-blocks[data-layout] .wb-cta { border-radius: 999px; }
.wb-root[data-composition="boutique"] .wb-blocks[data-layout] .wb-schedule { margin-top: 12px; padding: 24px; border-radius: 24px; }
.wb-root[data-composition="boutique"] .wb-socials { padding-top: 24px; }
.wb-root[data-composition][data-bgimage]::before,
.wb-root[data-composition][data-bgimage]::after { content: none; }
@media (prefers-reduced-motion: reduce) {
  .wb-root[data-composition] .wb-marquee-track { animation: none; }
}

/* Photograph treatments reuse uploaded media; layouts remain complete without it. */
.wb-root .wb-photo { display: block; width: 100%; max-width: 480px; height: 230px; object-fit: cover; margin: 0 auto; border-radius: 18px; }
.wb-root .wb-photo[hidden] { display: none; }
.wb-root[data-composition] .wb-photo { box-shadow: 0 12px 40px -24px #0008; }
.wb-root[data-composition="cover"][data-heroimage] { padding-top: 0; gap: 0; }
.wb-root[data-composition="cover"] .wb-photo { width: calc(100% + 48px); max-width: none; margin-inline: -24px; height: 230px; border-radius: 0; }
.wb-root[data-composition="cover"][data-heroimage] .wb-header { position: relative; margin-top: -38px; gap: 14px; padding-bottom: 28px; }
.wb-root[data-composition="cover"] .wb-logo { border: 5px solid var(--wb-bg); }
.wb-root[data-composition="cover"] .wb-name { font-size: 38px; }
.wb-root[data-composition="cover"] .wb-blocks[data-layout] .wb-cta { border-radius: 10px; }
.wb-root[data-composition="cover"] .wb-footer { margin-top: auto; }

/* Split spreads use real DOM order: decorative photo, identity, primary action. */
.wb-root[data-composition="split"] { gap: 22px; }
.wb-root[data-composition="split"][data-heroimage] { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); align-content: start; column-gap: 18px; }
.wb-root[data-composition="split"] .wb-header { align-items: flex-start; text-align: left; }
.wb-root[data-composition="split"][data-heroimage] .wb-header { grid-column: 1; grid-row: 1; }
.wb-root[data-composition="split"] .wb-photo { grid-column: 2; grid-row: 1; height: 100%; min-height: 250px; max-height: 360px; border-radius: 80px 80px 12px 12px; }
.wb-root[data-composition="split"] :is(.wb-blocks,.wb-footer,.wb-addblock) { grid-column: 1 / -1; }
.wb-root[data-composition="split"] .wb-name { font-size: clamp(26px,7vw,36px); }
.wb-root[data-composition="split"] .wb-logo { width: 52px; height: 52px; }
.wb-root[data-composition="split"] .wb-tagline { font-size: 12px; line-height: 1.7; }
.wb-root[data-composition="split"] .wb-blocks[data-layout] .wb-block:not(:where(.wb-heading,.wb-text,.wb-spacer,.wb-socials,.wb-marquee)) { border-radius: 6px; box-shadow: none; }

/* Poster: typographic scale, ink rules and a decisive primary action. */
.wb-root[data-composition="poster"] { gap: 32px; }
.wb-root[data-composition="poster"] .wb-header { text-align: left; align-items: flex-start; border-bottom: 3px solid var(--wb-fg); padding-bottom: 24px; }
.wb-root[data-composition="poster"] .wb-name { font-size: clamp(42px,13vw,68px); line-height: .92; font-weight: 700; text-transform: uppercase; max-width: 11ch; }
.wb-root[data-composition="poster"] .wb-logo { width: 52px; height: 52px; border-radius: 0; box-shadow: none; }
.wb-root[data-composition="poster"] .wb-blocks[data-layout] :is(.wb-cta,.wb-block):not(:where(.wb-socials,.wb-spacer,.wb-text)) { border-radius: 0; border-width: 2px; box-shadow: none; }
.wb-root[data-composition="poster"] .wb-heading { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; }
.wb-root[data-composition="poster"] .wb-photo { border-radius: 0; height: 170px; }

/* Panorama: let a photograph breathe above the compact booking and visit cards. */
.wb-root[data-composition="panorama"] { padding-top: 76px; gap: 36px; }
.wb-root[data-composition="panorama"][data-bgimage] { --wb-scrim: rgba(255,255,255,.8); }
.wb-root[data-composition="panorama"].mode-dark[data-bgimage] { --wb-scrim: rgba(8,12,10,.68); }
.wb-root[data-composition="panorama"] .wb-header { padding: 20px 12px 30px; }
.wb-root[data-composition="panorama"] .wb-name { font-size: 42px; }
.wb-root[data-composition="panorama"] .wb-blocks[data-layout] .wb-cta { border-radius: 999px; min-height: 70px; }
.wb-root[data-composition="panorama"] .wb-blocks[data-layout] .wb-block:not(:where(.wb-heading,.wb-text,.wb-spacer,.wb-socials,.wb-marquee)) { backdrop-filter: blur(24px); border-radius: 22px; }

/* Frame: an inset photographic invitation with fine borders and quiet labels. */
.wb-root[data-composition="frame"] { padding: 28px; outline: 1px solid var(--wb-edge); outline-offset: -12px; gap: 24px; }
.wb-root[data-composition="frame"] .wb-photo { height: 210px; padding: 8px; border: 1px solid var(--wb-edge); border-radius: 0; box-shadow: none; }
.wb-root[data-composition="frame"] .wb-name { font-size: 38px; }
.wb-root[data-composition="frame"] .wb-logo { width: 54px; height: 54px; }
.wb-root[data-composition="frame"] .wb-blocks[data-layout] :is(.wb-cta,.wb-block):not(:where(.wb-socials,.wb-spacer,.wb-text,.wb-marquee,.wb-heading)) { border-radius: 2px; box-shadow: none; }

/* Mosaic: secondary links become tiles; services, headings and schedules keep width. */
.wb-root[data-composition="mosaic"] .wb-header { align-items: flex-start; text-align: left; }
.wb-root[data-composition="mosaic"] .wb-name { font-size: 40px; }
.wb-root[data-composition="mosaic"] .wb-blocks[data-layout] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.wb-root[data-composition="mosaic"] .wb-blocks[data-layout] > :not(.wb-link) { grid-column: 1 / -1; }
.wb-root[data-composition="mosaic"] .wb-blocks[data-layout] .wb-link { grid-column: auto; min-width: 0; min-height: 116px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; border-radius: 20px; }
.wb-root[data-composition="mosaic"] .wb-blocks[data-layout] .wb-link:nth-child(even) { background: color-mix(in srgb,var(--wb-accent) 10%,var(--wb-surface)); }
.wb-root[data-composition="mosaic"] .wb-photo { height: 180px; border-radius: 24px; }

/* Minimal: a compact identity and ruled details make content feel intentional. */
.wb-root[data-composition="minimal"]::before,.wb-root[data-composition="minimal"]::after { content: none; }
.wb-root[data-composition="minimal"] { padding-top: 32px; gap: 36px; }
.wb-root[data-composition="minimal"] .wb-header { align-items: flex-start; text-align: left; gap: 16px; }
.wb-root[data-composition="minimal"] .wb-logo { width: 48px; height: 48px; box-shadow: none; }
.wb-root[data-composition="minimal"] .wb-name { font-size: 28px; letter-spacing: -.025em; }
.wb-root[data-composition="minimal"] .wb-blocks[data-layout] .wb-block:not(:where(.wb-heading,.wb-text,.wb-spacer,.wb-socials,.wb-marquee)) { border-width: 0 0 1px; border-radius: 0; background: transparent; box-shadow: none; padding: 20px 0; }
.wb-root[data-composition="minimal"][data-bgimage] .wb-blocks[data-layout] .wb-block:not(:where(.wb-heading,.wb-text,.wb-spacer,.wb-socials,.wb-marquee)) { background: var(--wb-surface); padding-inline: 16px; }
.wb-root[data-composition="minimal"] .wb-socials { justify-content: flex-start; }

/* Ribbon: strong rails and existing bands provide graphic rhythm without invented copy. */
.wb-root[data-composition="ribbon"] { border-top: 12px solid var(--wb-accent); gap: 24px; }
.wb-root[data-composition="ribbon"] .wb-header { text-align: left; align-items: flex-start; padding-left: 18px; border-left: 4px solid var(--wb-accent); }
.wb-root[data-composition="ribbon"] .wb-name { font-size: 42px; }
.wb-root[data-composition="ribbon"] .wb-heading { background: var(--wb-surface); padding: 12px 16px; border-left: 4px solid var(--wb-accent); text-transform: uppercase; font-size: 12px; letter-spacing: .12em; }
.wb-root[data-composition="ribbon"] .wb-blocks[data-layout] .wb-cta { border-radius: 4px; }
.wb-root[data-composition="ribbon"] .wb-marquee { margin-inline: -24px; padding-block: 14px; }

/* Portrait: an architectural arch for salons, studios and wellness spaces. */
.wb-root[data-composition="portrait"] .wb-photo { width: 76%; height: 310px; border-radius: 180px 180px 6px 6px; }
.wb-root[data-composition="portrait"] .wb-header { gap: 14px; }
.wb-root[data-composition="portrait"][data-heroimage] .wb-logo { width: 48px; height: 48px; }
.wb-root[data-composition="portrait"] .wb-name { font-size: 40px; font-weight: 400; }
.wb-root[data-composition="portrait"] .wb-blocks[data-layout] .wb-cta { border-radius: 999px; }
.wb-root[data-composition="portrait"] .wb-blocks[data-layout] .wb-schedule { padding: 26px; margin-top: 10px; border-radius: 28px 28px 6px 6px; }
@media (max-width: 360px) {
  .wb-root[data-composition="split"][data-heroimage] { column-gap: 12px; padding-inline: 18px; }
  .wb-root[data-composition="split"] .wb-name { font-size: 26px; }
  .wb-root[data-composition="mosaic"] .wb-blocks[data-layout] .wb-link { padding: 16px 12px; }
}

/* Keep small copy readable over the darkest uploaded photographs in light mode. */
.wb-root[data-composition].mode-light[data-bgimage] { --wb-scrim: rgba(255,255,255,.78); --wb-muted: #41493f; }

/* Editorial rhythm: a true ribbon block and bounded copy across compositions. */
.wb-root[data-composition] .wb-logo { order: 0; }
.wb-root[data-composition] .wb-eyebrow { order: 1; }
.wb-root[data-composition] .wb-name { order: 2; text-wrap: balance; }
.wb-root[data-composition] .wb-tagline { order: 3; text-wrap: pretty; }
.wb-root[data-composition] .wb-text { max-width: 42ch; text-wrap: pretty; }
.wb-root[data-composition] .wb-membership-text { min-width: 0; }
.wb-root[data-composition] .wb-membership-label { overflow-wrap: anywhere; }
.wb-root[data-composition] .wb-membership-price { flex-shrink: 0; white-space: nowrap; }
.wb-root[data-composition] .wb-schedule-hours { font-size: clamp(16px,4.2vw,19px); text-wrap: pretty; }
.wb-root[data-composition] .wb-marquee { background: var(--wb-fg); padding-block: 12px; margin-block: 8px; }
.wb-root[data-composition] .wb-marquee-text { color: var(--wb-bg); line-height: 1.5; letter-spacing: .12em; }
.wb-root[data-composition] .wb-marquee:hover .wb-marquee-track { animation-play-state: paused; }
.wb-root[data-composition="ribbon"] .wb-marquee { border-block: 3px solid var(--wb-accent); }
.wb-root[data-composition="poster"] .wb-marquee-text { font-size: 12px; font-weight: 700; }

/* Keep each real opening-hours range readable on narrow previews. */
.wb-schedule-row { display: block; line-height: 1.55; }
.wb-schedule-row + .wb-schedule-row { margin-top: .35em; }

/* Legacy long biographies must remain body copy, even in the sticker theme. */
.wb-root .wb-tagline.wb-tagline-long {
  display: block; padding: 0; border: 0; border-radius: 0;
  background: none; color: var(--wb-fg); text-transform: none;
  font-size: 14px; line-height: 1.65; letter-spacing: 0;
  text-align: start; max-width: 100%; white-space: pre-line;
  overflow-wrap: anywhere;
}