/* cm.css · generat per bin/build.sh · no editar: edita cm-tokens/base/components/paginas */

/* ---- cm-tokens.css ---- */
/* cm-tokens.css · sistema de disseny v3 «Dulcie» (arquitectura § 6, docs/_notes/disseny.md § 16).
   Cap color escrit fora d'aquí. Disciplina de substracció: un color de lletra, una família, cinc mides
   útils, un radi per a la foto i la pastilla per al botó, cap ombra (llevat de la barra fixa).
   Els noms de variable són els de sempre perquè les plantilles i les proves els comparteixen. */
:root {
  /* 1 · paleta: la de la web antiga, amb l'oliva de Dulcie (passa AA sobre els dos papers) */
  --cm-tinta: #735545;           /* ÚNIC color de lletra (v3.1, «més clar»: la titular no vol el marró fosc) · 6.46 paper · 5.68 crema */
  --cm-oliva: #59624f;           /* etiqueta, filet que estructura i franja · 6.13 paper · 5.38 crema */
  --cm-accent: #d79177;          /* terracota: NOMÉS superfície o filet decoratiu, MAI lletra (2.45 s/paper) */
  --cm-crema: #f0ebe2;           /* ÚNIC fons secundari (el #f3f3f0 de Dulcie, escalfat) */
  --cm-blanc: #fbfaf8;           /* paper: fons dominant i lletra damunt de tinta (8.96) i d'oliva (6.13) */
  --cm-accent-clar: #efd3c9;     /* selecció de text */
  --cm-rubor: #f4e6df;           /* franja clara del moment de decidir (vídeo, tancament, preu) · tinta hi fa 5.53 */
  --cm-verd-clar: #e6ece2;       /* verd sàlvia-menta clar (v3.2, ho va demanar la titular): fets, garantia, Integr-arte i
                                    el formulari d'Empieza · tinta 5.61 · secundari 4.70 · oliva 5.32 · enllaç 5.83 */
  --cm-verd-vel: rgb(122 150 108 / .16); /* farciment dels cercles de les quatre àrees: es sumen on se solapen */
  --cm-boto: #d79177;            /* botó principal: la terracota de marca, amb lletra fosca */
  --cm-boto-hover: #cf8569;
  --cm-boto-text: #3f2a22;       /* 5.24 sobre el botó · 4.61 sobre el hover */

  /* 2 · superfícies */
  --cm-fons: var(--cm-blanc); --cm-fons-2: var(--cm-crema);

  /* 3 · text i estat · ratios paper / crema */
  --cm-tinta-2: #7d6155;         /* només metadades petites 5.42 paper · 4.76 crema · 4.64 rubor · 4.57 sàlvia clara */
  --cm-accent-fosc: #765041;     /* enllaços 6.72 · 5.91 */
  --cm-ok: #40402c;              /* 10.13 · 8.90 */
  --cm-avis: #7a4a16;            /* 7.14 · 6.27 */
  --cm-error: #8c3a24;           /* 7.33 · 6.44 */
  --cm-focus: #452b1f;           /* anell de focus 12.44 · 10.93 */
  --cm-focus-clar: var(--cm-blanc); /* anell damunt de les franges fosques: 8.96 tinta · 6.13 oliva */
  --cm-accent-suau: #f6e7e0;     /* fons de l'opció marcada; --cm-tinta hi fa 7.76 */

  /* 4 · filets (el que substitueix la caixa) i vora dels camps (3:1 no textual) */
  --cm-filet: rgb(98 62 45 / .16);
  --cm-filet-fort: rgb(98 62 45 / .42);
  --cm-filet-clar: rgb(251 250 248 / .3);   /* damunt de tinta i d'oliva */
  --cm-vora-forta: #8a6553;      /* camps 4.95 · 4.35 */

  /* 5 · tipografia: UNA família, titulars a pes 400; la jerarquia la fan la mida i l'aire */
  --cm-sans: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cm-micro: .8125rem;                                       /* 13, l'etiqueta de Dulcie; no creix */
  --cm-petit: clamp(.9375rem, .9rem + .18vw, 1.0625rem);      /* 15-17 */
  --cm-text: clamp(1.125rem, 1.07rem + .28vw, 1.3125rem);     /* 18-21 */
  --cm-gran: clamp(1.375rem, 1.17rem + 1vw, 2rem);            /* 22-32, el 24/32 de Dulcie */
  --cm-h3: clamp(1.375rem, 1.25rem + .62vw, 1.75rem);         /* 22-28 */
  --cm-h2: clamp(2.125rem, 1.45rem + 3.2vw, 4rem);            /* 34-64 */
  --cm-h1: clamp(2.625rem, 1.5rem + 5.4vw, 5.75rem);          /* 42-92 */
  --cm-xifra: clamp(4.5rem, 1.9rem + 12.5vw, 11.5rem);        /* 72-184: «75 minutos», el preu */
  --cm-linia: 1.62; --cm-linia-gran: 1.34; --cm-linia-titol: 1.04;
  --cm-esp-titol: -.028em; --cm-esp-alt: .01em;

  /* 6 · espai: sis passos nets, salt gran a dalt; les seccions respiren el doble que abans */
  --cm-e1: .5rem; --cm-e2: 1rem; --cm-e3: 1.5rem;
  --cm-e4: 2.5rem; --cm-e5: 4rem; --cm-e6: 6.5rem;
  --cm-seccio: clamp(4.25rem, 2rem + 9.5vw, 10.5rem);
  /* Amplades: pàgina gairebé a sang (el carrer de Dulcie) i una columna de lectura estreta.
     La frase GRAN travessa l'amplada; el text petit va a la columna. */
  --cm-amplada: 90rem;                                       /* 1440 px */
  --cm-amplada-text: 36rem;                                  /* 576 px ≈ 55 caràcters a 20 px */
  --cm-marge: clamp(1.25rem, .55rem + 3.4vw, 3.75rem);       /* 20 px a 320, 60 px a 1440 */

  /* 7 · radis: 3 px a la foto i al camp; la pastilla, NOMÉS al botó */
  --cm-radi: 3px; --cm-radi-btn: 999px;

  /* 8 · ombres: la barra fixa de baix i el «play» del vídeo, que ha de destacar sobre qualsevol pòster */
  --cm-ombra-play: 0 10px 30px -12px rgb(63 42 34 / .45);
  --cm-ombra-barra: 0 -1px 0 rgb(98 62 45 / .1), 0 -14px 30px -22px rgb(98 62 45 / .35);

  /* 9 · moviment: les tres durades de Dulcie i dues corbes (només transform i opacity) */
  --cm-rapid: 300ms; --cm-normal: 600ms; --cm-lent: 1100ms;
  --cm-suau: cubic-bezier(.16, 1, .3, 1);    /* sortida llarga: entrades i fotos */
  --cm-corba: cubic-bezier(.42, 0, .58, 1);  /* ease-in-out literal: color i fons */
  --cm-alcada-cap: 4.5rem; --cm-alcada-barra: 8.5rem;
  color-scheme: light;           /* un sol tema: la marca és clara i càlida */
}
@media (prefers-reduced-motion: reduce) { :root { --cm-rapid: 0ms; --cm-normal: 0ms; --cm-lent: 0ms; } }


/* ---- cm-base.css ---- */
/* cm-base.css · tipografia (una família), reset curt, escala, focus, utilitats, prosa, moviment, impressió */
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/work-sans-400.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212; }
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/work-sans-600.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212; }

/* reset curt */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip;
  scroll-padding-top: calc(var(--cm-alcada-cap) + var(--cm-e2)); scroll-padding-bottom: var(--cm-alcada-barra); }
body { min-height: 100vh; background: var(--cm-fons); color: var(--cm-tinta);
  font: 400 var(--cm-text) / var(--cm-linia) var(--cm-sans); font-synthesis: none;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-kerning: normal; }
img, svg, video, picture { display: block; max-width: 100%; height: auto; }
img { font-style: italic; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none; }
small { font-size: var(--cm-petit); }
strong, b { font-weight: 600; }
em, i, cite { font-style: normal; }
::selection { background: var(--cm-accent-clar); color: var(--cm-tinta); }

/* Titulars: mateixa família i pes que el cos; la jerarquia la fan la mida i l'espaiat. */
h1, h2, h3, h4 { font-family: var(--cm-sans); font-weight: 400; line-height: var(--cm-linia-titol);
  letter-spacing: var(--cm-esp-titol); text-wrap: balance; overflow-wrap: break-word; }
h1 { font-size: var(--cm-h1); }
h2 { font-size: var(--cm-h2); }
h3 { font-size: var(--cm-h3); line-height: 1.22; letter-spacing: -.012em; }
h4 { font-size: var(--cm-text); letter-spacing: 0; font-weight: 600; }
p, li, dd, dt, legend, label, figcaption, blockquote { overflow-wrap: break-word; }
p { text-wrap: pretty; }

/* Enllaç: subratllat d'1 px que es redibuixa des de l'esquerra en passar-hi (transform pur). */
a { color: var(--cm-accent-fosc); text-decoration-thickness: 1px; text-underline-offset: .24em;
  text-decoration-color: var(--cm-filet-fort); transition: color var(--cm-rapid) var(--cm-corba), text-decoration-color var(--cm-rapid) var(--cm-corba); }
a:hover { color: var(--cm-tinta); text-decoration-color: currentColor; }

/* Etiqueta de secció: petita, en oliva, penjada d'un filet. */
.cm-sobretitol, .cm-precio__etiqueta { display: block; padding-top: var(--cm-e2); border-top: 1px solid var(--cm-oliva);
  font-size: var(--cm-micro); font-weight: 600; line-height: 1.4; letter-spacing: var(--cm-esp-alt); color: var(--cm-oliva); }
.cm-nota, .cm-petit { font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-mes { font-weight: 400; }

/* focus visible sempre: 2 px amb 3 px de separació; dins de les franges fosques, anell clar */
:focus-visible { outline: 2px solid var(--cm-focus); outline-offset: 3px; border-radius: var(--cm-radi); }
:focus:not(:focus-visible) { outline: 0; }
:target { scroll-margin-top: calc(var(--cm-alcada-cap) + var(--cm-e2)); }

/* utilitats d'accessibilitat */
.cm-visualment-ocult { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.cm-salta { position: absolute; top: 0; left: var(--cm-marge); z-index: 100; padding: var(--cm-e1) var(--cm-e3);
  background: var(--cm-tinta); color: var(--cm-blanc); border-radius: 0 0 var(--cm-radi) var(--cm-radi);
  text-decoration: none; font-weight: 600; transform: translateY(-120%); transition: transform var(--cm-rapid); }
.cm-salta:focus-visible { transform: none; outline-color: var(--cm-blanc); outline-offset: -6px; color: var(--cm-blanc); }
.cm-main:focus { outline: 0; }

/* prosa */
.cm-prosa > * + *, .cm-legal__seccion > * + *, .cm-legal__intro > * + * { margin-top: var(--cm-e3); }
.cm-prosa > * + h2 { margin-top: var(--cm-e5); }
.cm-prosa > * + h3, .cm-legal__seccion > * + h3 { margin-top: var(--cm-e4); }
.cm-prosa > h2 + *, .cm-prosa > h3 + *, .cm-legal__seccion > h2 + *, .cm-legal__seccion > h3 + * { margin-top: var(--cm-e2); }
.cm-prosa ul, .cm-prosa ol, .cm-legal__seccion ul, .cm-legal__seccion ol, .cm-legal__indice ol { padding-left: 1.25em; }
.cm-prosa li + li, .cm-legal__seccion li + li { margin-top: var(--cm-e1); }
/* La cita és una frase gran, sense cometes dibuixades ni filet de color: la mida ja la separa. */
.cm-prosa blockquote, .cm-cita { font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.015em; }
.cm-cita cite { display: block; margin-top: var(--cm-e3); font-size: var(--cm-micro); font-weight: 600; letter-spacing: var(--cm-esp-alt); color: var(--cm-oliva); }
.cm-prosa figcaption { margin-top: var(--cm-e1); font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-prosa img { border-radius: var(--cm-radi); }
.cm-prosa table, .cm-tabla, .cm-legal__seccion table { border-collapse: collapse; width: 100%; table-layout: fixed; font-size: var(--cm-petit); overflow-wrap: anywhere; }
.cm-prosa th, .cm-prosa td, .cm-tabla th, .cm-tabla td, .cm-legal__seccion th, .cm-legal__seccion td { padding: var(--cm-e1); border-bottom: 1px solid var(--cm-filet); text-align: left; vertical-align: top; }
.cm-valors, .cm-legal__datos { display: grid; gap: var(--cm-e3); }
.cm-valors dt, .cm-legal__datos dt { font-weight: 600; }
.cm-valors dd, .cm-legal__datos dd { margin-top: var(--cm-e1); }

/* MOVIMENT (§ 6.4): l'estat amagat només amb .cm-js i moviment normal; si no, tot hi és. Només transform i opacity. */
@media (prefers-reduced-motion: no-preference) {
  .cm-js [data-cm-ap] { opacity: 0; transform: translate3d(0, 1.25rem, 0);
    transition: opacity var(--cm-normal) var(--cm-suau), transform var(--cm-lent) var(--cm-suau);
    transition-delay: calc(var(--i, 0) * 90ms); }
  .cm-js [data-cm-ap="si"] { opacity: 1; transform: none; }
  /* Foto: el marc retalla i la imatge de dins es mou (cm.js li dona --cm-py) i entra amb un zoom curt. */
  .cm-js [data-cm-px] { overflow: hidden; }
  .cm-js [data-cm-px] img { transform: translate3d(0, var(--cm-py, 0px), 0) scale(1.1); will-change: transform; }
  .cm-js [data-cm-px][data-cm-ap] { transform: none; opacity: 0; transition: opacity var(--cm-lent) var(--cm-suau); }
  .cm-js [data-cm-px][data-cm-ap="si"] { opacity: 1; }
  /* Frase que s'omple paraula per paraula en fer scroll (el gest de Dulcie): cm.js parteix el text en
     <span> i en canvia l'opacitat; el text real no es toca. */
  .cm-js [data-cm-omple] span { opacity: .18; transition: opacity var(--cm-rapid) var(--cm-corba); }
  .cm-js [data-cm-omple] span.cm-on { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0ms; animation-duration: 0ms; animation-iteration-count: 1; }
}

/* impressió */
@media print {
  body { background: none; color: var(--cm-tinta); font-size: 11pt; }
  .cm-cap, .cm-barra, .cm-menu, .cm-salta, .cm-btn, .cm-btn__micro, .cm-urgencias, .cm-franja__enllacos, .cm-no-print, video, .cm-gate { display: none; }
  a { color: inherit; text-decoration: none; }
  .cm-legal a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .85em; }
  .cm-faq__item, .cm-card { break-inside: avoid; }
  h2, h3 { break-after: avoid; }
  [data-cm-ap], [data-cm-omple] span { opacity: 1; transform: none; }
}


/* ---- cm-components.css ---- */
/* cm-components.css · v3 «Dulcie» (disseny.md § 16). Regla mare: cap bloc en una caixa; filet d'1 px o franja. */

/* 1 · ESTRUCTURA: amplada gairebé a sang (90rem) i columna de lectura estreta (36rem). */
.cm-seccio, .cm-contenedor, .cm-hero, .cm-gate, .cm-tancat, article > .cm-faq {
  width: min(100% - 2 * var(--cm-marge), var(--cm-amplada)); margin-inline: auto; }
.cm-seccio, .cm-gate, .cm-tancat { padding-block: var(--cm-seccio); }
.cm-seccio .cm-seccio, .cm-seccio .cm-contenedor { width: 100%; padding-block: 0; }
.cm-pagina__contingut > .cm-seccio { width: 100%; }
.cm-seccio--compacta { padding-block: var(--cm-e6); }
.cm-seccio > *, .cm-contenedor > *, .cm-tancat > * { max-width: var(--cm-amplada-text); }
.cm-seccio > .cm-contenedor { max-width: none; }
.cm-seccio > * + *, .cm-contenedor > * + *, .cm-tancat > * + * { margin-top: var(--cm-e3); }
.cm-seccio > h2 + *, .cm-contenedor > h2 + * { margin-top: var(--cm-e5); }
.cm-sobretitol + * { margin-top: var(--cm-e4); }

/* 2 · TÍTOL DE SECCIÓ: gran, pes 400, a l'esquerra, penjat d'un filet (l'esquelet de la pàgina). */
.cm-seccio > h2, .cm-contenedor > h2 { max-width: 18em; }
.cm-seccio > .cm-seccio__titol:first-child, .cm-contenedor > .cm-seccio__titol:first-child,
.cm-seccio > .cm-sobretitol:first-child { max-width: none; padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet-fort); }
.cm-seccio > .cm-sobretitol:first-child + h2 { max-width: 18em; }
.cm-seccio__titol--gran { font-size: var(--cm-h1); }
.cm-seccio__subtitol { margin-top: var(--cm-e5); }
.cm-seccio__intro { font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-cierre__frase { font-size: var(--cm-h1); line-height: var(--cm-linia-titol); max-width: 16em; }
.cm-urgencias { font-size: var(--cm-petit); font-weight: 600; }

/* FRANGES a sang (box-shadow + clip-path, cap scroll horitzontal): crema informació · verd fets · rubor decidir. */
.cm-seccio--calida, .cm-seccio--cierre, .cm-seccio--hechos, .cm-garantia, .cm-gate {
  position: relative; background: var(--cm-sup); box-shadow: 0 0 0 100vmax var(--cm-sup); clip-path: inset(0 -100vmax); }
.cm-seccio--calida { --cm-sup: var(--cm-fons-2); }
.cm-seccio--calida + .cm-seccio--calida { padding-top: 0; }
.cm-seccio--hechos, .cm-garantia { --cm-sup: var(--cm-verd-clar); }
.cm-seccio--cierre, .cm-gate { --cm-sup: var(--cm-rubor); }
/* v3.1: cap franja fosca; la lletra és sempre --cm-tinta. */

/* 3 · BOTÓ: pastilla terracota, lletra fosca (5.24); només canvia de fons, no es mou. */
.cm-btn, .post-password-form input[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; gap: .7rem;
  width: 100%; min-height: 3.5rem; padding: .95rem 2rem; border: 0; border-radius: var(--cm-radi-btn);
  background: none; font-family: var(--cm-sans); font-size: var(--cm-text); font-weight: 600; line-height: 1.25;
  letter-spacing: .005em; text-align: center; text-decoration: none; text-wrap: balance;
  transition: background-color var(--cm-rapid) var(--cm-corba), color var(--cm-rapid) var(--cm-corba); }
.cm-btn--primari, .post-password-form input[type="submit"] { background: var(--cm-boto); color: var(--cm-boto-text); }
.cm-btn--primari:hover, .post-password-form input[type="submit"]:hover { background: var(--cm-boto-hover); color: var(--cm-boto-text); }
.cm-btn--gran { min-height: 3.75rem; }
/* El preu dins del botó, separat per un filet: cap sorpresa de preu més avall. */
.cm-btn__tros { white-space: nowrap; }
.cm-btn__preu { flex: none; padding-left: .7rem; border-left: 1px solid currentColor; font-weight: 400; white-space: nowrap; }
/* Desactivat: tinta-2 sobre blanc (6.41) i vora --cm-vora-forta (WCAG 1.4.11). */
.cm-btn:disabled, .cm-btn[aria-disabled="true"] { background: var(--cm-fons); color: var(--cm-tinta-2); border: 1.5px solid var(--cm-vora-forta); box-shadow: none; cursor: not-allowed; }
/* …però l'acció secundària no es torna mai una caixa: en tancat continua sent text subratllat. */
.cm-btn--secundari[aria-disabled="true"] { background: none; border: 0; }

/* Acció secundària: enllaç subratllat, mai un segon botó ple. */
.cm-btn--secundari { width: auto; min-height: 2.75rem; padding: .5rem 0; gap: 0; border-radius: 0;
  background: none; color: var(--cm-accent-fosc); font-weight: 400;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .3em; text-decoration-color: var(--cm-filet-fort); }
.cm-btn--secundari:hover { background: none; color: var(--cm-tinta); text-decoration-color: currentColor; }

.cm-btn__micro, .cm-botones__micro, .cm-botones__linea { display: block; margin-top: var(--cm-e2);
  font-size: var(--cm-petit); line-height: 1.5; color: var(--cm-tinta-2); }
.cm-accion { display: grid; gap: 0; justify-items: stretch; }
.cm-botones, .cm-hero__accions { display: grid; gap: var(--cm-e4); justify-items: start; }
.cm-hero__accions { margin-top: var(--cm-e5); }
.cm-icona { flex: none; width: 1.125em; height: 1.125em; }
/* Tot enllaç de text té 44 px efectius. */
.cm-enllac-mes, .cm-franja__enllacos a, .cm-404__enllacos a { display: inline-block; padding-block: .65rem; }
.cm-404__enllacos a { margin-block: -.65rem; }
.cm-legal__indice a { display: block; padding-block: .6rem; }

/* 4 · .cm-card: bloc amb filet a sobre i aire; cap vora, ombra, fons ni radi. */
.cm-card { position: relative; max-width: none; padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet-fort); }
.cm-card > * + * { margin-top: var(--cm-e2); }
.cm-card > h2 + *, .cm-card > h3 + *, .cm-card > .cm-sobretitol + * { margin-top: var(--cm-e3); }
/* L'únic bloc que sí que té fons: el preu i l'acció (.cm-card--accent), un panell de tinta. */
.cm-card--accent { padding: var(--cm-e5) var(--cm-e3); border: 0; border-radius: var(--cm-radi); background: var(--cm-rubor); }
/* Al tancament el panell ja és la franja: transparent i sense farciment propi. */
.cm-seccio--cierre > .cm-card--accent { padding: 0; background: none; }


/* 5 · PARELLS i composicions: les caretes van de costat des de 48em, separades per aire, no per caixes. */
.cm-para-quien, .cm-incluye, .cm-valors { max-width: none; }
.cm-para-quien { display: grid; gap: var(--cm-e5); list-style: none; padding: 0; }
.cm-incluye { display: grid; gap: var(--cm-e5); }

/* 6 · Llistes: un traç curt dibuixat, cap icona. */
.cm-llista, .cm-lista, .cm-lineas, .cm-garantia__lineas, .cm-vias, .cm-404__enllacos { display: grid; gap: var(--cm-e2); list-style: none; padding: 0; }
.cm-llista > li, .cm-lista > li, .cm-lineas > li, .cm-garantia__lineas > li { position: relative; padding-left: 1.75rem; }
.cm-llista > li::before, .cm-lista > li::before, .cm-lineas > li::before, .cm-garantia__lineas > li::before {
  content: ""; position: absolute; left: 0; top: .8em; width: .875rem; height: 1px; background: currentColor; opacity: .55; }
/* Sí: marca de verificació fina en oliva. No: el traç horitzontal, mai una creu vermella. */
.cm-llista--marcada > li::before, .cm-llista--incluido > li::before, .cm-lista--si > li::before, .cm-garantia__lineas > li::before {
  left: .15rem; top: .32em; width: .4em; height: .78em; background: none; opacity: 1;
  border: solid var(--cm-oliva); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.cm-lista--no > li::before { opacity: .7; }
.cm-llista__estado { color: var(--cm-oliva); font-size: var(--cm-petit); }
/* «Qué incluye»: línies separades per un filet d'1 px, no per aire. */
.cm-llista--incluido { gap: 0; }
.cm-llista--incluido > li { padding-block: var(--cm-e2); border-bottom: 1px solid var(--cm-filet); }
.cm-llista--incluido > li::before { top: calc(var(--cm-e2) + .32em); }
.cm-llista--incluido > li:first-child { padding-top: 0; }
.cm-llista--incluido > li:first-child::before { top: .32em; }
.cm-llista--incluido > li:last-child { border-bottom: 0; padding-bottom: 0; }
/* Credencials: tres frases separades per un filet. */
.cm-lineas { gap: 0; }
.cm-lineas > li { padding: var(--cm-e3) 0; border-top: 1px solid var(--cm-filet); }
.cm-lineas > li::before { display: none; }
/* Vies de contacte: filets guia entre files. */
.cm-vias { gap: 0; }
.cm-vias__item { padding: var(--cm-e3) 0; border-top: 1px solid var(--cm-filet); }
.cm-vias__item:last-child { border-bottom: 1px solid var(--cm-filet); }

/* 7 · Nota de tancament d'una secció: text petit amb filet oliva a l'esquerra, sense fons. */
.cm-tanca, .cm-para-quien__cierre { padding-left: var(--cm-e3); border-left: 1px solid var(--cm-oliva);
  font-size: var(--cm-petit); line-height: 1.6; }

/* 9 · Preu i garantia */
.cm-precio > * + * { margin-top: var(--cm-e2); }
.cm-precio__etiqueta { border-top-color: currentColor; }
.cm-precio__xifra { font-size: var(--cm-xifra); line-height: .9; letter-spacing: -.05em; }
.cm-precio__xifra + * { margin-top: var(--cm-e3); }
.cm-incluye .cm-precio__xifra { font-size: var(--cm-h1); }
/* Garantia: franja d'oliva (els fets que es compleixen). La secció de diners s'atura sola. */
.cm-garantia { width: min(100% - 2 * var(--cm-marge), var(--cm-amplada)); margin-inline: auto; padding-block: var(--cm-seccio); }
.cm-garantia > * + * { margin-top: var(--cm-e4); }
.cm-garantia__titol { font-size: var(--cm-h2); max-width: 14em; }
.cm-garantia__lineas { font-size: var(--cm-gran); line-height: var(--cm-linia-gran); gap: var(--cm-e3); }
.cm-garantia__lineas > li { padding-left: 2.25rem; }
/* La frase del LÍMIT: es destaca el límit, no la promesa. */
.cm-garantia__cierre { max-width: var(--cm-amplada-text); padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet-fort); color: var(--cm-tinta-2); }
.cm-seccio > .cm-garantia, .cm-seccio--calida > .cm-garantia { width: auto; margin-block: 0; box-shadow: none; clip-path: none; }

/* Avís i línia d'estat del formulari: filet de tinta a l'esquerra, sense caixa. */
.cm-aviso, .cm-form__plazas, .cm-form__cerrado, .cm-form__estado { padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border-left: 2px solid var(--cm-tinta); }
.cm-aviso--destacado { border-left-color: var(--cm-avis); font-weight: 600; color: var(--cm-avis); }
.cm-aviso--reservas { font-size: var(--cm-petit); }
.cm-seccio--cierre .cm-aviso--reservas { margin-top: var(--cm-e4); }
.cm-form__estado { font-size: var(--cm-petit); }

/* 10 · FAQ: filets horitzontals, preguntes grans, un + fi que gira 45° (transform). */
.cm-faq { border-top: 1px solid var(--cm-filet-fort); max-width: none; }
.cm-faq__bloc { margin-top: var(--cm-e6); }
.cm-faq__bloc-titol { margin-bottom: var(--cm-e4); }
.cm-faq__item { border-bottom: 1px solid var(--cm-filet-fort); }
.cm-faq__q { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--cm-e4); min-height: 2.75rem; padding: var(--cm-e3) 0; list-style: none; cursor: pointer; }
.cm-faq__q::-webkit-details-marker { display: none; }
.cm-faq__q h3 { font-size: var(--cm-h3); transition: color var(--cm-rapid) var(--cm-corba); }
/* v30: el + dins d'un cercle rosa (les marques d'Inicio); obert, terracota i girat 45°. */
.cm-faq__q::after { content: ""; flex: none; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: linear-gradient(currentColor 0 0) center / 38% 1.5px no-repeat, linear-gradient(currentColor 0 0) center / 1.5px 38% no-repeat var(--cm-rubor);
  transition: transform var(--cm-normal) var(--cm-suau), background-color var(--cm-rapid) var(--cm-corba); }
.cm-faq__item[open] > .cm-faq__q::after { transform: rotate(45deg); background-color: var(--cm-accent); }
.cm-faq__q:hover h3 { color: var(--cm-accent-fosc); }
.cm-faq__q:focus-visible { outline: 2px solid var(--cm-focus); outline-offset: 2px; }
.cm-faq__a { padding: 0 0 var(--cm-e4); max-width: var(--cm-amplada-text); }
.cm-faq__a > * + * { margin-top: var(--cm-e2); }
.cm-faq__a ul, .cm-faq__a ol { gap: var(--cm-e1); }
.cm-faq__pasos { display: grid; gap: var(--cm-e2); padding-left: 1.25em; }
@media (prefers-reduced-motion: no-preference) {
  .cm-faq__item[open] > .cm-faq__a { animation: cm-apareix var(--cm-normal) var(--cm-suau); }
}
@keyframes cm-apareix { from { opacity: 0; transform: translate3d(0, -.5rem, 0); } }

/* 11 · Formulari: camps amb filet inferior (la vora que el fa reconeixible, 4.35:1) damunt de paper. */
.cm-form { display: grid; gap: var(--cm-e3); max-width: var(--cm-amplada-text); }
.cm-form__campo, .cm-form__grupo, .cm-form__envio { display: grid; gap: .35rem; }
.cm-form__grupo { min-width: 0; margin: 0; padding: 0; border: 0; }
.cm-form__label, .cm-form__legend { font-size: var(--cm-petit); font-weight: 600; }
.cm-form__legend { padding: 0; margin-bottom: .35rem; line-height: 1.45; }
.cm-form__grupo { gap: 0; }
/* NOMÉS Sí/No (valor «si», «¿Vives en España?») en una línia: el camp 9 també té dues opcions i s'apila. */
.cm-form__grupo:has(input[value="si"]):has(> .cm-form__opcion:nth-of-type(2):last-of-type) { grid-template-columns: 1fr 1fr; column-gap: var(--cm-e2); }
.cm-form__input, .post-password-form input[type="password"] { width: 100%; min-height: 3.25rem; padding: .7rem .9rem;
  border: 0; border-bottom: 1.5px solid var(--cm-vora-forta); border-radius: var(--cm-radi) var(--cm-radi) 0 0; background: var(--cm-fons);
  font-size: 1.0625rem; transition: border-color var(--cm-rapid) var(--cm-corba); }
.cm-form__input:hover { border-bottom-color: var(--cm-tinta); }
.cm-form__input:focus-visible, .post-password-form input[type="password"]:focus-visible { outline: 2px solid var(--cm-focus); outline-offset: 2px; border-bottom-color: var(--cm-focus); }
.cm-form__input:user-invalid { border-bottom-color: var(--cm-error); }
/* Opcions: l'input invisible cobreix tota la fila (44 px); la marca es dibuixa a l'etiqueta. */
.cm-form__opcion, .cm-form__casilla { position: relative; display: flex; transition: background-color var(--cm-rapid) var(--cm-corba); }
.cm-form__opcion { border-top: 1px solid var(--cm-filet); }
.cm-form__opcion:last-child { border-bottom: 1px solid var(--cm-filet); }
.cm-form__opcion:hover, .cm-form__casilla:hover { background: var(--cm-fons); }
.cm-form__opcion:has(:checked), .cm-form__casilla:has(:checked) { background: var(--cm-accent-suau); }
.cm-form__opcion:has(:focus-visible), .cm-form__casilla:has(:focus-visible) { outline: 2px solid var(--cm-focus); outline-offset: 2px; }
.cm-form__opcion input, .cm-form__casilla input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.cm-form__opcion label, .cm-form__casilla label { position: relative; flex: 1; min-height: 2.75rem; padding: .7rem .5rem .7rem 2.1rem; line-height: 1.45; }
.cm-form__opcion label { font-size: var(--cm-petit); }
.cm-form__casilla label { font-size: var(--cm-micro); color: var(--cm-tinta-2); }
.cm-form__casilla:has(:checked) label { color: var(--cm-tinta); }
.cm-form__opcion label::before, .cm-form__casilla label::before { content: ""; position: absolute; left: .3rem; top: .85rem; width: 1.2rem; height: 1.2rem;
  border: 1.5px solid var(--cm-vora-forta); border-radius: var(--cm-radi); background: var(--cm-fons); transition: background-color var(--cm-rapid), border-color var(--cm-rapid); }
.cm-form__opcion input[type="radio"] + label::before { border-radius: 50%; }
.cm-form__opcion input:checked + label::before, .cm-form__casilla input:checked + label::before { border-color: var(--cm-tinta); background: var(--cm-tinta); box-shadow: inset 0 0 0 .2rem var(--cm-fons); }
.cm-form__opcion input[type="checkbox"]:checked + label::before, .cm-form__casilla input:checked + label::before { box-shadow: none; }
.cm-form__opcion input[type="checkbox"]:checked + label::after, .cm-form__casilla input:checked + label::after { content: ""; position: absolute; left: .72rem; top: 1.03rem;
  width: .35rem; height: .7rem; border: solid var(--cm-blanc); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.cm-form__opcion input:user-invalid + label::before, .cm-form__casilla input:user-invalid + label::before { border-color: var(--cm-error); }
.cm-form__ajuda { padding-top: var(--cm-e1); }
.cm-form__envio { justify-items: stretch; margin-top: var(--cm-e2); }
.cm-form__envio .cm-btn { width: 100%; }
.cm-form__campo--condicional[hidden] { display: none; }
.post-password-form label { display: block; font-weight: 600; margin-bottom: var(--cm-e1); }

/* Franja d'identificació */
.cm-franja { font-size: var(--cm-petit); line-height: 1.6; color: var(--cm-tinta-2); }
.cm-franja > * + * { margin-top: var(--cm-e2); }
.cm-franja a { color: var(--cm-tinta); }
.cm-franja__nom { font-weight: 600; color: var(--cm-tinta); }
.cm-franja__sep { margin-inline: .2em; color: var(--cm-tinta-2); }
.cm-franja__enllacos { display: flex; flex-wrap: wrap; gap: 0 var(--cm-e3); list-style: none; padding: 0; }
.cm-franja--compacta { padding: var(--cm-e2) 0; border-top: 1px solid var(--cm-filet); }

/* Barra fixa: una sola acció; entra des de baix una sola vegada (transform). */
.cm-barra { position: sticky; bottom: 0; z-index: 20; display: grid; gap: var(--cm-e1);
  padding: .5rem var(--cm-marge) calc(.5rem + env(safe-area-inset-bottom));
  background: var(--cm-fons); box-shadow: var(--cm-ombra-barra);
  transition: transform var(--cm-normal) var(--cm-suau), opacity var(--cm-rapid) var(--cm-corba); }
.cm-barra .cm-btn { width: 100%; min-height: 3rem; padding: .55rem 1.25rem; font-size: var(--cm-petit); }
.cm-barra .cm-btn__micro { display: none; }
.cm-barra--oculta { transform: translateY(110%); opacity: 0; pointer-events: none; }

/* Capçalera: paper, enganxada a dalt; s'aparta en baixar i torna en pujar (cm.js, transform). */
.cm-cap { position: sticky; top: 0; z-index: 30; background: var(--cm-fons); padding-inline: var(--cm-marge);
  transition: transform var(--cm-normal) var(--cm-suau), box-shadow var(--cm-rapid) var(--cm-corba); }
.cm-cap--sota { box-shadow: 0 1px 0 var(--cm-filet); }
.cm-cap--fora { transform: translateY(-100%); }
.cm-cap__dins { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cm-e1) var(--cm-e3);
  max-width: var(--cm-amplada); min-height: var(--cm-alcada-cap); margin-inline: auto; }
.cm-cap__logo { display: inline-flex; align-items: center; gap: .75rem; min-height: 2.75rem; margin-right: auto;
  color: var(--cm-tinta); font-size: var(--cm-petit); font-weight: 600; letter-spacing: .01em; line-height: 1.2; text-decoration: none; }
.cm-cap__logo:hover { color: var(--cm-accent-fosc); }
.cm-cap__monograma { width: 2.25rem; height: auto; flex: none; color: var(--cm-tinta); }
/* L'SVG porta el marró original (per a <img>); en línia, el CSS el passa a la tinta. */
.cm-cap__monograma path { fill: var(--cm-tinta); }
/* Sota 48em el nom cedeix el pas (hi queda per al lector): monograma, «Menú» i «Empieza» en una fila. */
.cm-cap__nom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.cm-menu { display: contents; }
/* «Empieza» a la capçalera: pastilla petita amb filet, mai un segon botó ple. */
.cm-menu__empieza { width: auto; min-height: 2.75rem; padding: .45rem 1.25rem; border: 1px solid var(--cm-tinta); border-radius: var(--cm-radi-btn);
  color: var(--cm-tinta); font-size: var(--cm-petit); font-weight: 600; text-decoration: none; }
.cm-menu__empieza:hover { background: var(--cm-boto); border-color: var(--cm-boto); color: var(--cm-boto-text); }
.cm-menu__empieza[aria-current="page"] { background: var(--cm-boto); border-color: var(--cm-boto); color: var(--cm-boto-text); }
/* Comunitat oberta: «Comunidad» va al desplegable al mòbil i surt a fora des de 48em (parts/menu.php). */
.cm-menu__comunitat { display: none; }
.cm-menu__boton { display: inline-flex; align-items: center; gap: .375rem; min-width: 2.75rem; min-height: 2.75rem;
  padding: .5rem .25rem; border: 0; background: none; font-size: var(--cm-petit); font-weight: 600; }
.cm-menu__boton:hover { color: var(--cm-accent-fosc); }
.cm-menu__lista { order: 3; flex-basis: 100%; display: grid; gap: 0; padding: 0 0 var(--cm-e3); list-style: none; }
.cm-menu__lista[hidden] { display: none; }
.cm-menu__enllac { display: block; padding: var(--cm-e2) 0; border-top: 1px solid var(--cm-filet);
  color: var(--cm-tinta); font-size: var(--cm-gran); letter-spacing: -.01em; text-decoration: none; transition: color var(--cm-rapid) var(--cm-corba); }
.cm-menu__enllac:hover { color: var(--cm-accent-fosc); }
.cm-menu__enllac[aria-current="page"] { color: var(--cm-oliva); }

/* Peu: franja de crema, el nom gran a dalt i la informació obligatòria a sota, en columna de lectura. */
.cm-peu { padding: var(--cm-e6) var(--cm-marge) calc(var(--cm-e5) + env(safe-area-inset-bottom));
  background: var(--cm-fons-2); font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-peu > * { max-width: var(--cm-amplada); margin-inline: auto; }
.cm-peu > * + * { margin-top: var(--cm-e4); }
.cm-peu > .cm-franja, .cm-peu > .cm-peu__correo { padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet); }
.cm-peu a { color: var(--cm-tinta); }
.cm-peu__entorn { font-size: var(--cm-micro); color: var(--cm-tinta-2); } /* només a staging (arquitectura § 4.7) */

/* 12 · Hero i fotos: a ≥48em el retrat ocupa mitja pantalla i surt per la vora dreta. */
.cm-hero { display: grid; gap: var(--cm-e5); padding-block: var(--cm-e5) var(--cm-e6); }
.cm-hero:not(:has(.cm-hero__foto)) { padding-block: var(--cm-e6) var(--cm-e5); }
.cm-hero--pagina { padding-bottom: var(--cm-e5); }
.cm-hero__text > * { max-width: var(--cm-amplada-text); }
.cm-hero__text > .cm-hero__titol { max-width: 13em; }
.cm-hero__text > * + * { margin-top: var(--cm-e3); }
.cm-hero__text > .cm-hero__titol + * { margin-top: var(--cm-e4); }
.cm-hero__titol { font-size: var(--cm-h1); }
.cm-hero__sub { font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-hero--empieza { gap: var(--cm-e3); }
.cm-hero--empieza .cm-hero__sub { max-width: 30em; }
.cm-hero__confianza, .cm-hero__inferior { font-size: var(--cm-petit); color: var(--cm-tinta-2);
  padding-top: var(--cm-e2); border-top: 1px solid var(--cm-filet); }
.cm-hero__accions + .cm-hero__confianza { margin-top: var(--cm-e5); }
/* Foto: 3 px de radi i prou; cap arc, cap pètal, cap ombra, cap gra. */
.cm-foto, .cm-hero__foto, .cm-gate__foto { display: block; overflow: hidden; border-radius: var(--cm-radi); background: var(--cm-fons-2); }
.cm-foto__img, .cm-hero__foto img { width: 100%; height: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 28%; }
.cm-hero__foto { max-width: none; margin-inline: calc(-1 * var(--cm-marge)); border-radius: 0; }
.cm-foto--petal .cm-foto__img { aspect-ratio: 4 / 5; object-position: 50% 26%; }
.cm-gate__foto img { aspect-ratio: 16 / 9; }
.cm-foto--pendent { outline: 1px dashed var(--cm-vora-forta); outline-offset: -1px; }

/* Vídeo de 2 minuts: franja de tinta, el vídeo a tota l'amplada i un «play» que és un cercle de filet. */
.cm-gate > * + * { margin-top: var(--cm-e3); }
.cm-gate > .cm-contenedor > * { max-width: none; }
.cm-gate__titol { font-size: var(--cm-h2); max-width: 14em; }
.cm-gate__titol + * { margin-top: var(--cm-e5); }
.cm-gate__marc { position: relative; overflow: hidden; border-radius: var(--cm-radi); }
.cm-gate__video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--cm-radi); background: var(--cm-fons-2); }
.cm-gate__play { position: absolute; left: 50%; top: 50%; display: flex; align-items: center; justify-content: center;
  width: 6.5rem; height: 6.5rem; margin: -3.25rem 0 0 -3.25rem; border: 0; border-radius: 50%;
  background: var(--cm-boto); color: var(--cm-boto-text); cursor: pointer; box-shadow: var(--cm-ombra-play);
  transition: background-color var(--cm-rapid) var(--cm-corba), color var(--cm-rapid) var(--cm-corba), transform var(--cm-normal) var(--cm-suau); }
.cm-gate__play:hover { background: var(--cm-boto-hover); transform: scale(1.06); }
.cm-gate__play[hidden] { display: none; }
.cm-gate__play-icona { display: block; width: 0; height: 0; margin-left: .3rem; border-style: solid; border-width: .6rem 0 .6rem 1rem; border-color: transparent transparent transparent currentColor; }
/* Compte enrere: una etiqueta callada, mai una alarma. Surt amb [hidden] i el mostra cm.js. */
.cm-gate__cuenta { padding-top: var(--cm-e2); border-top: 1px solid var(--cm-filet-fort); font-size: var(--cm-petit); font-weight: 600; font-variant-numeric: tabular-nums; }
/* Segona frase de la línia: la que desactiva la urgència falsa (§ 4.2). */
.cm-gate__oferta { display: block; font-weight: 400; font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-gate__cuenta + .cm-gate__saltar-wrap { margin-top: var(--cm-e1); }
.cm-gate__saltar { display: inline-block; padding-block: .7rem; font-size: var(--cm-petit); }
/* Tot enllaç de text de la landing té 44 px d'alçada efectiva: el coixí no toca la línia. */
.cm-empieza p a:not(.cm-btn), .cm-empieza li a { padding-block: .7rem; }
/* L'input invisible (z-index 1) cobreix la fila: l'enllaç de la política va per damunt. */
.cm-form__casilla label a { position: relative; z-index: 2; padding-block: .95rem; }

/* 13 · Lliscadors al mòbil (pacients, valors): la targeta següent treu el cap (82 %); graella des de 48em. */
@media (max-width: 47.99em) {
  .cm-pacientes, .cm-valors { display: flex; gap: var(--cm-e3); max-width: none; overflow-x: auto; overscroll-behavior-x: contain;
    margin-inline: calc(-1 * var(--cm-marge)); padding: 0 var(--cm-marge) var(--cm-e2); scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--cm-marge); scrollbar-width: none; }
  .cm-pacientes::-webkit-scrollbar, .cm-valors::-webkit-scrollbar { display: none; }
  .cm-pacientes > *, .cm-valors > * { flex: 0 0 min(82%, 22rem); scroll-snap-align: start; }
}

/* 15 · Ruptures: 1 columna; 48em hero, parells i passos; 64em títol sticky i menú horitzontal. */

/* Fins a 359 px (320×568): titulars una mica més petits perquè el «play» arribi al plec. */
@media (max-width: 22.4375em) {
  .cm-hero--empieza .cm-hero__titol { font-size: var(--cm-h2); }
  .cm-hero--empieza .cm-hero__sub { font-size: var(--cm-text); }
  .cm-gate > * + * { margin-top: var(--cm-e2); }
}

@media (min-width: 38.75em) {
  .cm-card--accent { padding: var(--cm-e5); }
}

/* 768 px: el hero es parteix; els parells i les columnes de passos, també. */
@media (min-width: 48em) {
  .cm-btn, .cm-form__envio .cm-btn, .post-password-form input[type="submit"] { width: auto; }
  .cm-menu__comunitat { display: inline-flex; }
  .cm-menu__item--comunitat { display: none; }
  .cm-cap__nom { position: static; width: auto; height: auto; clip-path: none; }
  .cm-accion { justify-items: start; }
  .cm-form__envio { justify-items: start; }
  .cm-hero:has(.cm-hero__foto) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--cm-e5); align-items: center; padding-block: 0; }
  .cm-hero:has(.cm-hero__foto) > .cm-hero__text { align-self: center; padding-block: var(--cm-e5) var(--cm-e6); }
  /* El retrat surt per la vora dreta de la finestra i fa l'alçada de la pantalla menys la capçalera. */
  .cm-hero__foto { align-self: start; position: sticky; top: var(--cm-alcada-cap); height: min(100svh - var(--cm-alcada-cap), 60rem); min-height: 34rem; margin-inline: 0 calc(-1 * var(--cm-marge)); }
  :is(.cm-hero:has(.cm-hero__foto), .cm-recurso) .cm-hero__titol { font-size: clamp(2.625rem, 1rem + 4vw, 5rem); }
  .cm-hero__foto img { aspect-ratio: auto; }
  .cm-para-quien { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--cm-e5); }
  .cm-incluye { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: var(--cm-e6); }
  .cm-incluye > .cm-card:last-child { position: sticky; top: calc(var(--cm-alcada-cap) + var(--cm-e3)); }
  .cm-garantia__lineas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--cm-e5); }
  .cm-card--accent { padding: var(--cm-e6); }
}

/* 1024 px: títol sticky a l'esquerra, contingut a la dreta; les composicions amples travessen sota el títol. */
@media (min-width: 64em) {
  .cm-seccio:has(> .cm-seccio__titol:first-child):not(:has(> .cm-incluye, > .cm-pacientes, > .cm-para-quien)) {
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: start; }
  .cm-seccio:has(> .cm-seccio__titol:first-child):not(:has(> .cm-incluye, > .cm-pacientes, > .cm-para-quien)) > * { grid-column: 2; max-width: none; }
  .cm-seccio:has(> .cm-seccio__titol:first-child):not(:has(> .cm-incluye, > .cm-pacientes, > .cm-para-quien)) > .cm-seccio__titol:first-child {
    grid-column: 1; grid-row: 1 / span 12; position: sticky; top: calc(var(--cm-alcada-cap) + var(--cm-e3)); }
  .cm-seccio:has(> .cm-seccio__titol:first-child):not(:has(> .cm-incluye, > .cm-pacientes, > .cm-para-quien)) > .cm-seccio__titol + * { margin-top: 0; padding-top: var(--cm-e3); }
  .cm-seccio:has(> .cm-seccio__titol:first-child):not(:has(> .cm-incluye, > .cm-pacientes, > .cm-para-quien)) > :not(.cm-seccio__titol) { border-top-color: transparent; }
  /* El panell del preu: la frase a l'esquerra, l'acció a la dreta. */
  .cm-hero:has(.cm-hero__foto) { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--cm-e6); }
  .cm-menu__lista, .cm-menu__lista[hidden] { order: 1; flex-basis: auto; display: flex; gap: var(--cm-e4); padding: 0; margin-right: var(--cm-e3); }
  .cm-menu__enllac { border-top: 0; padding: var(--cm-e1) 0; font-size: var(--cm-petit); background: linear-gradient(currentColor 0 0) 0 100% / 0 1px no-repeat; }
  .cm-menu__enllac:hover, .cm-menu__enllac[aria-current="page"] { color: var(--cm-tinta); background-size: 100% 1px; }
  .cm-menu__empieza { order: 2; }
  .cm-menu__boton, .cm-menu__boton[hidden] { display: none; }
  .cm-barra { position: fixed; left: 50%; right: auto; bottom: var(--cm-e3); transform: translateX(-50%);
    width: auto; padding: .5rem; border-radius: var(--cm-radi-btn); box-shadow: 0 0 0 1px var(--cm-filet), var(--cm-ombra-barra); }
  .cm-barra .cm-btn { padding-inline: 2.25rem; }
  .cm-barra--oculta { transform: translate(-50%, 160%); }
  .cm-peu { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6);
    padding-inline: max(var(--cm-marge), (100% - var(--cm-amplada)) / 2); }
  .cm-peu > * { max-width: none; margin-inline: 0; grid-column: 2; }
  .cm-peu > :first-child { grid-column: 1; grid-row: 1 / span 4; margin-top: 0; }
  .cm-peu > :first-child + * { margin-top: 0; }
}

/* 1024-1279 px amb la comunitat oberta: dues pastilles, els 4 enllaços i el nom no hi caben en una fila. El nom cedeix
   (com al mòbil) i «Comunidad» passa a ser el primer enllaç del menú; «Valoración 1:1» queda com a única pastilla. */
@media (min-width: 64em) and (max-width: 79.99em) {
  .cm-cap--comunitat .cm-cap__nom { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); }
  .cm-cap--comunitat .cm-menu__comunitat { display: none; }
  .cm-cap--comunitat .cm-menu__item--comunitat { display: block; }
}

/* <768: tot centrat (16/10) menys llistes, formularis, FAQ, passos i legals */
@media (max-width: 47.99em) {
  .cm-main, .cm-peu { text-align: center; }
  .cm-franja__enllacos, .cm-fet__cap, .cm-fet__temes { justify-content: center; }
  .cm-seccio > *, .cm-contenedor > *, .cm-tancat > *, .cm-hero__text > *, .cm-fet__text, .cm-perfil__text { margin-inline: auto; }
  .cm-main :is(ul, ol, dl, form, fieldset, .cm-faq, .cm-legal, .cm-cami, .cm-metode, .cm-encaixa, .cm-aviso) { text-align: left; }
  .cm-main :is(.cm-arees__ocultes, .cm-botones, .cm-fets, .cm-metode, .cm-valors, .cm-pacientes, .cm-perfil, .cm-lineas, .cm-vias,
    .cm-doctora__dades, .cm-doctora__frases, .cm-doctora__verifica, .cm-urgencias, .cm-faq__bloc-titol, .cm-legal__cap) { text-align: center; }
  .cm-botones, .cm-hero__accions { gap: var(--cm-e2); justify-items: center; margin-top: var(--cm-e4); }
  .cm-accion { justify-items: center; width: 100%; }
  .cm-botones .cm-btn--primari, .cm-hero__accions .cm-btn--primari { width: min(100%, 22rem); }
  .cm-botones > p { margin-top: 0; }
  .cm-vias__valor, .cm-metode__num { justify-self: center; }
  .cm-fet__etiqueta { padding-inline: var(--cm-e5); }
  html .cm-main :is(.cm-cita, .cm-fets__cita, .cm-para-quien__cierre, .cm-tanca, .cm-paciente__text, .cm-doctora__dades li, .cm-vias--grans .cm-vias__item):not(.cm-urgencias) {
    padding: var(--cm-e3) 0 0; border: 0; background: linear-gradient(var(--cm-accent), var(--cm-accent)) top / 4.5rem 3px no-repeat; }
}


/* ---- cm-paginas.css ---- */
/* cm-paginas.css · només el que és d'una sola plantilla (§ 6.3); el que es repeteix, a cm-components.css. */

/* Empieza (§ 4): títol → vídeo → formulari → (pacients) → Quién soy → preguntes → tancament. L'ordre no es toca. */
.cm-empieza > .cm-hero { padding-block: var(--cm-e4) var(--cm-e4); }
/* Mòbil primer: el «play» entra a la primera pantalla (390×844); des de 48em, mida i aire de la resta. */
.cm-empieza .cm-hero__titol { font-size: var(--cm-h2); }
.cm-empieza > .cm-gate { padding-block: var(--cm-e4) var(--cm-e5); }
.cm-empieza > .cm-gate .cm-gate__titol { font-size: var(--cm-h3); }
.cm-empieza > .cm-gate .cm-gate__titol + * { margin-top: var(--cm-e3); }
.cm-empieza .cm-form__envio .cm-btn { min-height: 3.75rem; }
.cm-empieza > .cm-seccio, .cm-empieza .cm-gate__form > .cm-seccio { padding-block: var(--cm-seccio); }
/* § 4.3: dues línies curtes sobre el títol; la de límits en to secundari. */
.cm-form__precio { font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-form__limites { font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-form__precio + .cm-form__limites { margin-top: var(--cm-e2); }
.cm-seccio--formulario { display: flex; flex-direction: column; }
.cm-seccio--formulario > .cm-seccio__titol { order: -1; margin-top: 0; }
.cm-seccio--formulario > .cm-seccio__titol + * { margin-top: var(--cm-e4); }
@media (min-width: 48em) { .cm-empieza .cm-botones { justify-items: start; } .cm-empieza .cm-btn--secundari { justify-self: start; text-align: left; } }
/* § 4.4: fins a tres textos de pacients en columnes, cada un amb el seu filet; sense cometes ni estrelles. */
.cm-pacientes { display: grid; gap: var(--cm-e5); list-style: none; padding: 0; max-width: none; }
.cm-pacientes__nota { font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-pacientes__cita { margin: 0; padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet-fort); font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-pacientes__cita > * + * { margin-top: var(--cm-e3); }
.cm-pacientes__cita cite { display: block; font-size: var(--cm-micro); font-weight: 600; letter-spacing: var(--cm-esp-alt); color: var(--cm-oliva); }
/* § 4.5 i Inicio «La Dra. Carreras en 3 líneas»: mòbil primer, una columna, el retrat a tota l'amplada. */
.cm-quien-soy { display: grid; gap: var(--cm-e3); border-top: 0; padding-top: 0; }
.cm-quien-soy > * { margin-top: 0; }
.cm-quien-soy > h2 { margin-top: var(--cm-e3); font-size: var(--cm-h2); }
.cm-quien-soy__figura { margin-inline: calc(-1 * var(--cm-marge)); }
.cm-quien-soy__figura .cm-foto { border-radius: 0; }
.cm-quien-soy__confianza { margin-top: 0; }
@media (min-width: 30em) {
  .cm-quien-soy { grid-template-columns: minmax(0, 1fr); align-items: end; }
  .cm-quien-soy > :not(.cm-quien-soy__figura):not(h2) { grid-column: 1 / -1; }
}

/* Inicio · fets (v14-v16): títol sticky (64em), tres blocs xifra|contingut; moviment amb data-cm-ap. */
.cm-seccio--hechos > .cm-seccio__titol:first-child { max-width: 12em; padding-top: 0; border-top: 0; }
.cm-seccio--hechos > .cm-fets { max-width: none; margin-top: var(--cm-e5); }
.cm-fets { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cm-e3); list-style: none; padding: 0; counter-reset: cm-fet; }
.cm-fet { --cm-fet-fons: var(--cm-blanc); --cm-fet-text: var(--cm-tinta); --cm-fet-suau: var(--cm-oliva); --cm-fet-filet: var(--cm-filet);
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "etiqueta" "cap" "text" "temes";
  gap: var(--cm-e3); margin: 0; padding: var(--cm-e4) var(--cm-e3) var(--cm-e4);
  background: var(--cm-fet-fons); color: var(--cm-fet-text); border-radius: var(--cm-radi); counter-increment: cm-fet;
  transition: transform var(--cm-rapid) var(--cm-suau); }
.cm-fet::before { content: "0" counter(cm-fet); position: absolute; top: var(--cm-e3); right: var(--cm-e3); font-size: var(--cm-micro);
  font-weight: 600; letter-spacing: .14em; color: var(--cm-fet-suau); }
.cm-fet--rellotge { --cm-fet-fons: var(--cm-tinta); --cm-fet-text: var(--cm-blanc); --cm-fet-suau: var(--cm-accent-clar); --cm-fet-filet: var(--cm-filet-clar); }
.cm-fet > * { margin: 0; }
.cm-fet__etiqueta { grid-area: etiqueta; padding-right: var(--cm-e5); font-size: var(--cm-micro); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-fet-suau); }
.cm-fet__cap { grid-area: cap; display: flex; align-items: center; justify-content: space-between; gap: var(--cm-e3); }
.cm-fet__xifra { margin: 0; font-size: clamp(4.25rem, 2.6rem + 3.6vw, 6.5rem); line-height: .86; letter-spacing: -.05em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cm-fet__num { display: inline-block; text-align: right; }
.cm-fet__unitat { margin-left: .1em; font-size: .3em; letter-spacing: .02em; color: var(--cm-fet-suau); }
.cm-fet__xifra--text { font-size: clamp(2.5rem, 1.8rem + 2vw, 3.5rem); line-height: .95; letter-spacing: -.035em; white-space: normal; }
.cm-fet__svg { flex: none; width: clamp(5rem, 4rem + 2.5vw, 6.5rem); height: auto; overflow: visible; }
.cm-fet__text { grid-area: text; font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; max-width: 20em; }
.cm-fet__temes { grid-area: temes; display: flex; flex-wrap: wrap; gap: var(--cm-e1); list-style: none; padding: 0; }
.cm-fet__temes li { margin: 0; padding: .35em .8em; font-size: var(--cm-petit); border: 1px solid var(--cm-fet-filet); border-radius: var(--cm-radi); }
/* rellotge: marques de 5 minuts i una agulla (sobre tinta) */
.cm-fet__marca { stroke: var(--cm-blanc); stroke-width: 4; stroke-linecap: round; }
.cm-fet__marca--quart { stroke: var(--cm-accent); stroke-width: 5; }
.cm-fet__agulla { stroke: var(--cm-accent); stroke-width: 3; stroke-linecap: round; transform-origin: 60px 60px; transform: rotate(450deg); }
.cm-fet__eix { fill: var(--cm-blanc); }
/* proves: dotze tubs, quatre de plens */
.cm-fet__tub { fill: none; stroke: var(--cm-filet-fort); stroke-width: 2; }
.cm-fet__tub--ple { fill: var(--cm-accent); stroke: var(--cm-accent); }
.cm-fet__tub:not(.cm-fet__tub--ple) { opacity: .45; }
/* dies: cinc columnes; la del lliurament, terracota */
.cm-fet__pista-dia { fill: var(--cm-verd-clar); }
.cm-fet__dia { fill: var(--cm-oliva); transform-box: fill-box; transform-origin: 50% 100%; }
.cm-fet__dia--lliurament { fill: var(--cm-accent); }
.cm-fet__lletra { font-family: var(--cm-sans); font-size: 11px; font-weight: 600; fill: var(--cm-tinta-2); }
/* la cita: frase que s'omple paraula per paraula (cm.js), amb un filet terracota a l'esquerra */
.cm-seccio--hechos > .cm-fets__cita { margin: var(--cm-e5) 0 0; padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border-left: 3px solid var(--cm-accent);
  font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.5rem); line-height: 1.2; letter-spacing: -.02em; }
.cm-fets__cita p { margin: 0; max-width: 20em; }
/* Des de 40em, cada bloc és horitzontal: xifra i visual a l'esquerra, separats per un filet; contingut a la dreta. */
@media (min-width: 40em) {
  .cm-fet { grid-template-columns: minmax(11rem, 36%) minmax(0, 1fr); grid-template-areas: "cap etiqueta" "cap text" "cap temes";
    grid-template-rows: auto auto 1fr; column-gap: var(--cm-e4); row-gap: var(--cm-e2); padding: var(--cm-e4); }
  .cm-fet__cap { flex-direction: column-reverse; align-items: flex-start; justify-content: flex-end; padding-right: var(--cm-e4);
    border-right: 1px solid var(--cm-fet-filet); }
  .cm-fet__etiqueta { padding-right: var(--cm-e5); }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .cm-fet:hover { transform: translate3d(0, -4px, 0); }
}
@media (prefers-reduced-motion: no-preference) {
  .cm-fet__agulla { transition: transform 1600ms linear 250ms; }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__agulla { transform: rotate(0deg); }
  .cm-fet__marca { transition: opacity 200ms var(--cm-corba) calc(250ms + var(--n) * 107ms); }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__marca { opacity: .14; }
  .cm-fet__tub { transform-box: fill-box; transform-origin: 50% 100%;
    transition: transform var(--cm-normal) var(--cm-suau) calc(200ms + var(--n) * 45ms), opacity var(--cm-normal) var(--cm-corba) 1100ms; }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__tub { transform: scaleY(0); }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__tub:not(.cm-fet__tub--ple) { opacity: 1; }
  .cm-fet__dia { transition: transform var(--cm-normal) var(--cm-suau) calc(300ms + var(--n) * 160ms); }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__dia { transform: scaleY(0); }
  .cm-fet__temes li { transition: opacity var(--cm-normal) var(--cm-suau), transform var(--cm-normal) var(--cm-suau); }
  .cm-js .cm-fet[data-cm-ap=""] .cm-fet__temes li { opacity: 0; transform: translate3d(0, .5rem, 0); }
  .cm-fet__temes li:nth-child(1) { transition-delay: 500ms; } .cm-fet__temes li:nth-child(2) { transition-delay: 580ms; }
  .cm-fet__temes li:nth-child(3) { transition-delay: 660ms; } .cm-fet__temes li:nth-child(4) { transition-delay: 740ms; }
  .cm-fet__temes li:nth-child(5) { transition-delay: 820ms; } .cm-fet__temes li:nth-child(6) { transition-delay: 900ms; }
}
/* Inicio · «Es para ti si…» (v18): títol sticky, línies amb marca, perfil de tinta i nota de triatge. */
.cm-seccio--para-quien > .cm-seccio__titol:first-child { max-width: 10em; padding-top: 0; border-top: 0; }
.cm-encaixa { display: grid; list-style: none; margin: var(--cm-e4) 0 0; padding: 0; }
.cm-encaixa__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--cm-e3); align-items: start; margin: 0;
  padding: var(--cm-e4) 0; border-top: 1px solid var(--cm-filet); }
.cm-encaixa__item:first-child { padding-top: 0; border-top: 0; }
.cm-encaixa__item p { margin: 0; max-width: 18em; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.375rem); line-height: 1.2; letter-spacing: -.02em; }
.cm-encaixa__marca { width: clamp(2.5rem, 2rem + 1.5vw, 3.5rem); height: auto; margin-top: .15em; }
.cm-encaixa__marca circle { fill: var(--cm-accent); }
.cm-encaixa__marca path { fill: none; stroke: var(--cm-boto-text); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.cm-perfil { display: grid; gap: var(--cm-e3); margin-top: var(--cm-e5); padding: var(--cm-e4) var(--cm-e3);
  background: var(--cm-tinta); color: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-perfil > *, .cm-perfil__cos > * { margin: 0; }
.cm-perfil__xifra { padding-bottom: var(--cm-e3); border-bottom: 1px solid var(--cm-filet-clar); font-size: clamp(3.5rem, 2.2rem + 4vw, 6rem); line-height: .9; letter-spacing: -.05em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cm-perfil__unitat { margin-left: .12em; font-size: .3em; letter-spacing: .02em; color: var(--cm-accent-clar); }
.cm-perfil__text { max-width: 22em; font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-perfil__destacat { margin-top: var(--cm-e2); font-size: var(--cm-text); font-weight: 500; color: var(--cm-accent-clar); }
.cm-seccio--para-quien > .cm-para-quien__cierre { margin-top: var(--cm-e5); padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border-left: 3px solid var(--cm-accent);
  font-size: clamp(1.375rem, 1.1rem + 1vw, 1.875rem); line-height: 1.3; letter-spacing: -.012em; }
@media (min-width: 40em) {
  .cm-perfil { padding: var(--cm-e4); }
}
@media (prefers-reduced-motion: no-preference) {
  .cm-encaixa__marca { transition: transform var(--cm-normal) cubic-bezier(.34, 1.56, .64, 1) 250ms; }
  .cm-js .cm-encaixa__item[data-cm-ap=""] .cm-encaixa__marca { transform: scale(0); }
  .cm-encaixa__marca path { transition: opacity var(--cm-rapid) var(--cm-corba) 550ms; }
  .cm-js .cm-encaixa__item[data-cm-ap=""] .cm-encaixa__marca path { opacity: 0; }
}
/* Inicio · la doctora (v26): retrat gran | títol, credencials com a xifres, frases grans; sense sticky. */
.cm-seccio--doctora > .cm-doctora, .cm-seccio--cierre > .cm-final { max-width: none; }
.cm-doctora { display: grid; gap: var(--cm-e5); }
.cm-doctora__foto .cm-foto { width: 100%; max-width: none; }
.cm-doctora__foto { margin: 0; }
.cm-doctora__cos { display: grid; gap: var(--cm-e4); align-content: center; }
.cm-doctora__cos > * { margin: 0; }
.cm-doctora__cos > h2 { max-width: 13em; padding-top: 0; border-top: 0; }
.cm-doctora__dades { display: grid; gap: var(--cm-e3); margin: 0; padding: 0; list-style: none; }
.cm-doctora__dades li { display: grid; gap: .25rem; margin: 0; padding-left: var(--cm-e3); border-left: 3px solid var(--cm-accent); }
.cm-doctora__etiqueta, .cm-vias__etiqueta { font-size: var(--cm-micro); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-oliva); }
.cm-doctora__xifra { white-space: nowrap; font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.75rem); font-weight: 400; line-height: 1.05; letter-spacing: -.03em; }
.cm-doctora__frases { display: grid; gap: var(--cm-e3); margin: 0; padding: 0; list-style: none; }
.cm-doctora__frases li { margin: 0; padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet); font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-doctora__verifica { margin: 0; padding: 0; list-style: none; font-size: var(--cm-petit); color: var(--cm-tinta-2); }
.cm-doctora__verifica li { margin: 0; }
.cm-doctora__dades li:last-child .cm-doctora__xifra { white-space: normal; }
@media (min-width: 48em) { .cm-doctora__dades { grid-template-columns: auto auto minmax(0, 1fr); column-gap: var(--cm-e4); } }
@media (min-width: 64em) { .cm-doctora { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: center; } }
/* Entre 1024 i 1279 px les tres credencials no hi caben en una fila sense partir: es parteixen dins de la seva columna. */
@media (min-width: 64em) and (max-width: 79.99em) { .cm-doctora__dades { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cm-doctora__xifra { white-space: normal; } }
/* Inicio · tancament (v28): frase gran amb filet; l'alba (sol que surt, raigs, horitzó pla → ona) ressalta el missatge. */
.cm-final { display: grid; gap: var(--cm-e4); }
.cm-final > * { margin: 0; }
.cm-final .cm-cierre__frase::after { content: ""; display: block; width: 4.5rem; height: 3px; margin-top: var(--cm-e3); background: var(--cm-accent); transform-origin: 0 50%; }
.cm-final__alba { width: 8.5rem; height: auto; justify-self: start; overflow: visible; }
.cm-final__sol { fill: var(--cm-accent); transform: translateY(-14px); }
.cm-final__raig { stroke: var(--cm-accent); stroke-width: 3; stroke-linecap: round; }
.cm-final__ona { fill: none; stroke: var(--cm-oliva); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; transform-box: fill-box; transform-origin: center; }
/* <1024: tancament centrat, l'alba a dalt i la crida l'última */
@media (max-width: 63.99em) {
  .cm-final { justify-items: center; text-align: center; }
  .cm-final > .cm-botones { justify-self: stretch; }
  .cm-final .cm-cierre__frase, .cm-final .cm-cierre__frase::after { margin-inline: auto; transform-origin: 50%; }
  .cm-final__alba { order: -1; justify-self: center; width: min(13rem, 66%); margin-block: calc(-1 * var(--cm-e3)) calc(-1 * var(--cm-e2)); }
  .cm-seccio--cierre.cm-seccio--compacta { padding-block: var(--cm-e5); }
}
@media (min-width: 48em) and (max-width: 63.99em) { .cm-final > .cm-botones, .cm-final .cm-accion { justify-items: center; } }
@media (min-width: 64em) {
  .cm-final { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--cm-e6); align-items: center; }
  .cm-final__alba { grid-column: 2; grid-row: 1 / span 2; align-self: center; width: min(100%, 20rem); }
}
@media (prefers-reduced-motion: no-preference) {
  .cm-final .cm-cierre__frase::after { transition: transform var(--cm-lent) var(--cm-suau) 300ms; }
  .cm-js .cm-final > .cm-cierre__frase[data-cm-ap=""]::after { transform: scaleX(0); }
  .cm-final__sol { transition: transform 1600ms var(--cm-suau) 200ms; }
  .cm-js .cm-final__alba[data-cm-ap=""] .cm-final__sol { transform: translateY(70px); }
  .cm-final__raig { transition: opacity var(--cm-normal) var(--cm-corba) calc(1100ms + var(--n) * 110ms); }
  .cm-js .cm-final__alba[data-cm-ap=""] .cm-final__raig { opacity: 0; }
  .cm-final__ona { transition: transform 1400ms var(--cm-suau) 700ms; }
  .cm-js .cm-final__alba[data-cm-ap=""] .cm-final__ona { transform: scaleY(.04); }
}
/* Inicio (v21) i el camí de Cómo trabajo (v30): la secció dels passos, franja rosa. */
.cm-pagina--inicio .cm-seccio--pasos, .cm-seccio--camino { position: relative; --cm-sup: var(--cm-rubor); background: var(--cm-sup); box-shadow: 0 0 0 100vmax var(--cm-sup); clip-path: inset(0 -100vmax); }
/* Inicio · 3 pasos (v23): títol sticky, passos en vertical amb números units per una línia (--cm-k), preu a sota. */
.cm-seccio--pasos > .cm-seccio__titol:first-child, .cm-seccio--camino > .cm-seccio__titol:first-child, .cm-seccio--por-que > .cm-seccio__titol:first-child { max-width: 11em; padding-top: 0; border-top: 0; }
.cm-cami { --cm-k: 1; position: relative; display: grid; gap: var(--cm-e3); max-width: none; margin: var(--cm-e4) 0 0; padding: 0; list-style: none; }
.cm-cami::before { content: ""; position: absolute; top: 1.75rem; bottom: 1.75rem; left: calc(1.75rem - 1px); width: 2px; background: var(--cm-oliva);
  transform: scaleY(var(--cm-k)); transform-origin: 50% 0; }
.cm-cami__pas { position: relative; display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--cm-e3); align-items: start; margin: 0; }
.cm-cami__num { position: relative; z-index: 1; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%;
  background: var(--cm-tinta); color: var(--cm-blanc); font-size: var(--cm-h3); line-height: 1; }
.cm-cami__pas:last-child .cm-cami__num { background: var(--cm-accent); color: var(--cm-boto-text); }
.cm-cami__cos { display: grid; gap: var(--cm-e2); padding: var(--cm-e4) var(--cm-e3); background: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-cami__cos > * { margin: 0; }
.cm-cami__titol { font-size: var(--cm-h3); letter-spacing: -.015em; }
.cm-cami__cos p { font-size: var(--cm-text); line-height: var(--cm-linia); max-width: 34em; }
@media (min-width: 48em) { .cm-cami__cos { padding: var(--cm-e4); } }
@media (prefers-reduced-motion: no-preference) {
  .cm-js .cm-cami { --cm-k: 0; }
  .cm-cami__num { transition: transform var(--cm-normal) cubic-bezier(.34, 1.56, .64, 1) 150ms; }
  .cm-js .cm-cami__pas[data-cm-ap=""] .cm-cami__num { transform: scale(0); }
}

/* Verd clar (v3.2): Integr-arte i el formulari d'Empieza. Més específic que .cm-seccio--calida. */
.cm-seccio--calida.cm-seccio--integrarte, .cm-seccio--calida.cm-seccio--formulario { --cm-sup: var(--cm-verd-clar); }

/* Inicio · Integr-arte: quatre cercles al voltant de «Tu historia»; cm.js posa --cm-k (0 → 1) en baixar; sense JS, 1. */
.cm-arees { position: relative; width: min(100%, 24rem); aspect-ratio: 1; margin: 0 0 var(--cm-e5); --cm-k: 1; }
.cm-arees__llista { position: absolute; inset: 0; list-style: none; padding: 0; }
.cm-arees__area { position: absolute; display: flex; width: 60%; aspect-ratio: 1; padding: 13%; border: 1px solid var(--cm-oliva);
  border-radius: 50%; background: var(--cm-verd-vel); font-size: var(--cm-petit); line-height: 1.2; color: var(--cm-tinta);
  transform: translate3d(calc(var(--x) * (1 - var(--cm-k)) * 20%), calc(var(--y) * (1 - var(--cm-k)) * 20%), 0); }
.cm-arees__area:nth-child(1) { --x: -1; --y: -1; left: 6%; top: 6%; }
.cm-arees__area:nth-child(2) { --x: 1; --y: -1; right: 6%; top: 6%; justify-content: flex-end; text-align: right; }
.cm-arees__area:nth-child(3) { --x: -1; --y: 1; left: 6%; bottom: 6%; align-items: flex-end; }
.cm-arees__area:nth-child(4) { --x: 1; --y: 1; right: 6%; bottom: 6%; justify-content: flex-end; align-items: flex-end; text-align: right; }
.cm-arees__centre { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: var(--cm-micro); font-weight: 600;
  letter-spacing: var(--cm-esp-alt); color: var(--cm-oliva); white-space: nowrap; opacity: var(--cm-k); }
@media (prefers-reduced-motion: no-preference) {
  .cm-js .cm-arees { --cm-k: 0; }
  .cm-js .cm-arees__area { transition: transform 120ms linear; }
}

/* Inicio · Integr-arte (v20): text|cercles, mètode en 3 passos amb línia (--cm-k), cita. */
.cm-seccio--integrarte > .cm-integrarte, .cm-seccio--integrarte > .cm-metode, .cm-seccio--integrarte > .cm-integrarte__peu { max-width: none; }
.cm-integrarte { display: grid; gap: var(--cm-e5); align-items: center; }
.cm-integrarte__text { display: grid; gap: var(--cm-e3); }
.cm-integrarte__text > * { margin: 0; }
.cm-integrarte__text > h2 { max-width: 15em; padding-top: 0; border-top: 0; }
.cm-integrarte__tenue { color: var(--cm-oliva); }
.cm-integrarte__intro { max-width: 22em; font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-integrarte__visual { display: grid; justify-items: center; gap: var(--cm-e3); }
.cm-integrarte__visual .cm-arees { margin: 0; }
.cm-arees__ocultes { display: flex; justify-content: center; gap: var(--cm-e2); margin: 0; padding: 0; list-style: none; }
.cm-arees__ocultes li { display: grid; place-items: center; width: clamp(5.5rem, 4.6rem + 2vw, 6.75rem); aspect-ratio: 1; margin: 0; padding: .4rem;
  border: 1px dashed var(--cm-oliva); border-radius: 50%; font-size: var(--cm-micro); font-weight: 600; letter-spacing: var(--cm-esp-alt);
  color: var(--cm-oliva); text-align: center; }
.cm-metode { --cm-k: 1; position: relative; display: grid; gap: var(--cm-e3); margin: var(--cm-e6) 0 0; padding: 0; list-style: none; }
.cm-metode__pas { position: relative; z-index: 1; display: grid; align-content: start; gap: var(--cm-e2); margin: 0; padding: var(--cm-e4) var(--cm-e3);
  background: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-metode__pas > * { margin: 0; }
.cm-metode__num { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; margin-bottom: var(--cm-e2); border-radius: 50%;
  background: var(--cm-tinta); color: var(--cm-blanc); font-size: var(--cm-h3); line-height: 1; font-variant-numeric: tabular-nums; }
.cm-metode__pas:last-child .cm-metode__num { background: var(--cm-accent); color: var(--cm-boto-text); }
.cm-metode__titol { font-size: var(--cm-h3); letter-spacing: -.015em; }
.cm-metode__text { font-size: var(--cm-text); line-height: var(--cm-linia); }
.cm-metode__nota { margin-top: var(--cm-e2); padding-top: var(--cm-e2); border-top: 1px solid var(--cm-filet); font-size: var(--cm-petit); font-weight: 500; }
.cm-integrarte__peu { display: grid; gap: var(--cm-e3); margin-top: var(--cm-e6); }
.cm-integrarte__peu > * { margin: 0; }
.cm-integrarte__peu .cm-cita { padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border-left: 3px solid var(--cm-accent); border-top: 0;
  font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.375rem); line-height: 1.22; letter-spacing: -.02em; }
.cm-integrarte__peu .cm-cita p { max-width: 26em; }
@media (min-width: 48em) {
  .cm-metode { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* La línia que uneix els tres números: només es veu als buits entre fulls, i es dibuixa d'esquerra a dreta. */
  .cm-metode::before { content: ""; position: absolute; top: calc(var(--cm-e4) + 1.75rem); left: var(--cm-e3); right: var(--cm-e3); height: 2px;
    background: var(--cm-oliva); transform: scaleX(var(--cm-k)); transform-origin: 0 50%; }
}
@media (min-width: 64em) {
  .cm-integrarte { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--cm-e6); }
  .cm-integrarte__peu { grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: var(--cm-e6); }
}
@media (prefers-reduced-motion: no-preference) {
  .cm-js .cm-metode { --cm-k: 0; }
  .cm-metode__num { transition: transform var(--cm-normal) cubic-bezier(.34, 1.56, .64, 1) 200ms; }
  .cm-js .cm-metode__pas[data-cm-ap=""] .cm-metode__num { transform: scale(0); }
  .cm-arees__ocultes li { transition: opacity var(--cm-lent) var(--cm-suau), transform var(--cm-lent) var(--cm-suau); }
  .cm-js .cm-integrarte__visual[data-cm-ap=""] .cm-arees__ocultes li { opacity: 0; transform: translate3d(0, .75rem, 0); }
  .cm-arees__ocultes li:nth-child(2) { transition-delay: 120ms; } .cm-arees__ocultes li:nth-child(3) { transition-delay: 240ms; }
}

/* Inicio · «Un año a tu lado» (v24): horitzontal sense sticky; Valoración en 4 passos amb línia (--cm-k), Programa en tinta. */
.cm-seccio--programa > * { max-width: none; }
.cm-any__cap { display: grid; gap: var(--cm-e3); }
.cm-any__cap > * { margin: 0; }
.cm-any__cap > h2 { max-width: 11em; padding-top: 0; border-top: 0; }
.cm-any__intro { max-width: 26em; font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-any { display: grid; gap: var(--cm-e3); margin-top: var(--cm-e5); }
.cm-any__fase { padding: var(--cm-e4) var(--cm-e3); background: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-any__etapa { margin: 0 0 var(--cm-e3); font-size: var(--cm-micro); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-oliva); }
.cm-any__passos { --cm-k: 1; position: relative; display: grid; gap: var(--cm-e4); margin: 0; padding: 0; list-style: none; }
.cm-any__pas, .cm-any__items li { display: grid; align-content: start; gap: var(--cm-e1); margin: 0; }
.cm-any__pas > *, .cm-any__items li > * { margin: 0; }
.cm-any__num { position: relative; z-index: 1; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: var(--cm-e1);
  border-radius: 50%; background: var(--cm-tinta); color: var(--cm-blanc); }
.cm-any__titol { font-size: var(--cm-h3); letter-spacing: -.015em; }
.cm-any__pas p, .cm-any__items p { font-size: var(--cm-petit); line-height: var(--cm-linia); }
.cm-any__fase--programa { display: grid; gap: var(--cm-e4); background: var(--cm-tinta); color: var(--cm-blanc); }
.cm-any__fase--programa .cm-any__etapa, .cm-any__xifra span { color: var(--cm-accent-clar); }
.cm-any__xifra { margin: 0; font-size: clamp(4.5rem, 3rem + 4vw, 7rem); line-height: .86; letter-spacing: -.05em; }
.cm-any__xifra span { margin-left: .12em; font-size: .3em; letter-spacing: .02em; }
.cm-any__mesos { display: flex; gap: 4px; margin-top: var(--cm-e3); }
.cm-any__mesos i { flex: 1; height: .5rem; border-radius: 2px; background: var(--cm-accent); }
.cm-any__items { display: grid; gap: var(--cm-e3); margin: 0; padding: 0; list-style: none; }
.cm-any__items li { padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet-clar); }
@media (min-width: 48em) {
  .cm-any__passos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--cm-e3); }
  .cm-any__passos::before { content: ""; position: absolute; top: 1.375rem; left: 0; right: 0; height: 2px; background: var(--cm-oliva);
    transform: scaleX(var(--cm-k)); transform-origin: 0 50%; }
  .cm-any__fase { padding: var(--cm-e5) var(--cm-e4); }
}
@media (min-width: 64em) {
  .cm-any__cap { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: end; }
  .cm-any__fase--programa { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: center; }
  .cm-any__items { grid-template-columns: 1fr 1fr; }
  .cm-any__items li { padding: 0 0 0 var(--cm-e3); border-top: 0; border-left: 1px solid var(--cm-filet-clar); }
}
@media (prefers-reduced-motion: no-preference) {
  .cm-js .cm-any__passos { --cm-k: 0; }
  .cm-any__num { transition: transform var(--cm-normal) cubic-bezier(.34, 1.56, .64, 1) 150ms; }
  .cm-js .cm-any__pas[data-cm-ap=""] .cm-any__num { transform: scale(0); }
  .cm-any__mesos i { transition: opacity 300ms var(--cm-corba) calc(300ms + var(--n) * 90ms); }
  .cm-js .cm-any__fase--programa[data-cm-ap=""] .cm-any__mesos i, .cm-js .cm-precio--tinta[data-cm-ap=""] .cm-any__mesos i { opacity: .15; }
}

/* Pàgines de blocs */
.cm-pagina--blocs .cm-pagina__contingut { padding-bottom: var(--cm-seccio); }

/* v30 · Cómo trabajo, Quién soy, Preguntas frecuentes i Contacto amb la línia d'Inicio. */
/* Els títols de secció sense el filet de sobre, com a Inicio. */
:is(.cm-pagina--como-trabajo, .cm-pagina--quien-soy, .cm-pagina--contacto) .cm-seccio > .cm-seccio__titol:first-child { padding-top: 0; border-top: 0; }
/* La cita dins d'un pas del camí, amb el filet terracota de les cites d'Inicio. */
.cm-cami__cos .cm-cita { padding-left: var(--cm-e3); border-left: 3px solid var(--cm-accent); font-size: var(--cm-text); }
/* Fulls de paper sobre les franges: la llista de «Qué incluye» (crema) i els tres valors de «Cómo miro» (verd). */
.cm-seccio--calida .cm-incluye > .cm-card, .cm-seccio--como-miro .cm-valors__item {
  padding: var(--cm-e4) var(--cm-e3); border-top: 0; background: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-seccio--calida .cm-incluye > .cm-card--accent { border-top: 4px solid var(--cm-accent); }
.cm-seccio--como-miro > .cm-valors { margin-top: var(--cm-e6); }
.cm-valors dt { font-size: var(--cm-h3); font-weight: 400; letter-spacing: -.015em; }
.cm-valors dt::after { content: ""; display: block; width: 3rem; height: 3px; margin-top: var(--cm-e2); background: var(--cm-accent); }
/* El preu del Programa: el full de tinta d'«Un año a tu lado», amb l'any que s'omple. */
.cm-precio--tinta { padding: var(--cm-e4) var(--cm-e3); border-top: 0; background: var(--cm-tinta); color: var(--cm-blanc); border-radius: var(--cm-radi); }
.cm-precio--tinta > .cm-any__mesos { margin: 0 0 var(--cm-e3); }
/* Línies amb marca (cm_html_encaixa): les d'«Es para ti si…» a mida de frase llarga; el «no», cercle de filet. */
.cm-encaixa--text { margin-top: 0; }
.cm-encaixa--text .cm-encaixa__item { padding-block: var(--cm-e3); }
.cm-encaixa--text .cm-encaixa__item p { max-width: 32em; font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-encaixa--text .cm-encaixa__marca { width: 2.5rem; margin-top: 0; }
.cm-encaixa--no .cm-encaixa__marca circle { fill: none; stroke: var(--cm-accent); stroke-width: 3; }
.cm-encaixa--no .cm-encaixa__marca path { stroke: var(--cm-tinta); }
/* «Por qué trabajo así»: cada paràgraf en gran, separat per un filet (les frases de la doctora d'Inicio). */
.cm-frases > p { padding-block: var(--cm-e3); border-top: 1px solid var(--cm-filet); font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-frases > p:first-child { padding-top: 0; border-top: 0; }
/* Contacto: cada via com una credencial d'Inicio; «Si ya eres paciente» amb el filet terracota; urgències en tinta. */
.cm-pagina--contacto .cm-hero .cm-vias__item { padding-block: var(--cm-e2); }
.cm-vias--grans { gap: var(--cm-e4); }
.cm-vias--grans .cm-vias__item { display: grid; gap: .25rem; padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border: 0; border-left: 3px solid var(--cm-accent); }
.cm-vias--grans .cm-vias__item:last-child { border-bottom: 0; }
.cm-vias__valor { justify-self: start; font-size: clamp(1.125rem, .9rem + 1.2vw, 2.25rem); line-height: 1.15; letter-spacing: -.02em; overflow-wrap: anywhere; }
.cm-paciente__text { padding: var(--cm-e1) 0 var(--cm-e1) var(--cm-e3); border-left: 3px solid var(--cm-accent); font-size: var(--cm-gran); line-height: var(--cm-linia-gran); letter-spacing: -.012em; }
.cm-pagina--contacto .cm-urgencias { max-width: none; padding: var(--cm-e4) var(--cm-e3); border: 0; border-radius: var(--cm-radi);
  background: var(--cm-tinta); color: var(--cm-blanc); font-size: var(--cm-gran); font-weight: 400; line-height: var(--cm-linia-gran); }
/* Preguntas frecuentes: cada bloc, una franja (crema les parells) amb el títol enganxat a l'esquerra a ≥64em. */
.cm-pagina--faq > .cm-faq { border-top: 0; }
.cm-pagina--faq .cm-faq__bloc { margin: 0; padding-block: var(--cm-e6); }
.cm-pagina--faq .cm-faq__bloc:nth-child(even) { --cm-sup: var(--cm-fons-2); background: var(--cm-sup); box-shadow: 0 0 0 100vmax var(--cm-sup); clip-path: inset(0 -100vmax); }
.cm-pagina--faq .cm-faq__bloc-titol { max-width: 10em; }
.cm-pagina--faq .cm-faq__bloc-titol + .cm-faq__item { border-top: 1px solid var(--cm-filet-fort); }
@media (min-width: 48em) {
  .cm-seccio--calida .cm-incluye > .cm-card, .cm-precio--tinta, .cm-seccio--como-miro .cm-valors__item { padding: var(--cm-e5) var(--cm-e4); }
  .cm-pagina--contacto .cm-urgencias { padding: var(--cm-e5); }
}
@media (min-width: 64em) {
  .cm-garantia { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: start; }
  .cm-garantia > * { grid-column: 2; }
  .cm-garantia > .cm-garantia__titol { grid-column: 1; grid-row: 1 / span 4; position: sticky; top: calc(var(--cm-alcada-cap) + var(--cm-e3)); }
  .cm-garantia > .cm-garantia__titol + *, .cm-garantia > .cm-garantia__lineas { margin-top: 0; grid-template-columns: minmax(0, 1fr); }
  .cm-pagina--faq .cm-faq__bloc { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--cm-e6); align-items: start; }
  .cm-pagina--faq .cm-faq__bloc > * { grid-column: 2; }
  .cm-pagina--faq .cm-faq__bloc > .cm-faq__bloc-titol { grid-column: 1; grid-row: 1 / span 40; position: sticky; top: calc(var(--cm-alcada-cap) + var(--cm-e3)); margin: 0; }
}

/* Text legal: prosa estreta i l'índex enganxat al costat */
.cm-legal__cap { padding-bottom: var(--cm-e3); border-bottom: 1px solid var(--cm-filet-fort); }
.cm-legal__cap h1 { font-size: var(--cm-h2); }
.cm-legal__indice { padding-top: var(--cm-e2); border-top: 1px solid var(--cm-oliva); font-size: var(--cm-petit); }
/* Els apartats ja porten el número al titular: l'<ol> sense comptador, àncores de 44 px. */
.cm-legal__indice ol { list-style: none; padding-left: 0; }
.cm-legal__seccion { padding-top: var(--cm-e3); border-top: 1px solid var(--cm-filet); scroll-margin-top: calc(var(--cm-alcada-cap) + var(--cm-e2)); }
.cm-legal__seccion h2 { font-size: var(--cm-h3); }
.cm-legal__seccion + .cm-legal__seccion { margin-top: var(--cm-e5); }
.cm-legal [lang="ca"] { color: var(--cm-tinta-2); }
#resumen { padding-left: var(--cm-e3); border-left: 1px solid var(--cm-oliva); }

/* 404 */
.cm-404__urgencias { font-size: var(--cm-petit); color: var(--cm-tinta-2); }

/* Pàgina tancada (cm-neta.php): el monograma damunt del bloc, sense capçalera ni menú. */
.cm-tancat__titol { font-size: var(--cm-h2); }
.cm-tancat__marca { padding-block: var(--cm-e6) 0; }
.cm-tancat__marca + .cm-tancat { padding-top: var(--cm-e3); }

@media (min-width: 48em) {
  .cm-empieza > .cm-hero { padding-block: var(--cm-e6) var(--cm-e5); }
  .cm-empieza .cm-hero__titol { font-size: var(--cm-h1); }
  .cm-empieza > .cm-gate { padding-block: var(--cm-seccio); }
  .cm-empieza > .cm-gate .cm-gate__titol { font-size: var(--cm-h2); }
  .cm-empieza > .cm-gate .cm-gate__titol + * { margin-top: var(--cm-e5); }
  .cm-valors { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cm-e3); }
  .cm-pacientes { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
  /* Retrat gran a l'esquerra (surt per la vora; no s'estira), text a la dreta. */
  .cm-quien-soy { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: var(--cm-e6); align-items: end; }
  .cm-quien-soy > :not(.cm-quien-soy__figura):not(h2) { grid-column: 2; }
  .cm-quien-soy > h2 { grid-column: 2; margin-top: 0; }
  .cm-quien-soy__figura { grid-row: 1 / span 5; align-self: start; margin-inline: calc(-1 * var(--cm-marge)) 0; }
  /* El formulari: a l'esquerra el què i el preu, enganxats; a la dreta, els camps. */
  .cm-seccio--formulario { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: var(--cm-e6); align-items: start; }
  .cm-seccio--formulario > * { grid-column: 1; max-width: none; }
  .cm-seccio--formulario > .cm-form { grid-column: 2; grid-row: 1 / span 8; margin-top: 0; }
}
@media (min-width: 64em) {
  /* La graella va lligada a l'EXISTÈNCIA de l'índex (cm-legal.php només el pinta amb més d'una secció). */
  .cm-legal:has(> .cm-legal__indice) { display: grid; grid-template-columns: 15rem minmax(0, var(--cm-amplada-text)); column-gap: var(--cm-e6); }
  .cm-legal > * { grid-column: 2; }
  .cm-legal:has(> .cm-legal__indice) > .cm-legal__cap { grid-column: 1 / -1; max-width: none; }
  .cm-legal > .cm-legal__indice { grid-column: 1; grid-row: 2 / span 40; align-self: start; position: sticky; top: calc(var(--cm-alcada-cap) + var(--cm-e2)); margin-top: var(--cm-e3); }
}

.cm-recurso { grid-template-columns: minmax(0, 1fr); align-items: center; }
.cm-recurso .cm-hero__titol { font-size: min(var(--cm-h1), 11.5vw); }
.cm-recurso__imatge { margin: 0; justify-self: center; width: min(100%, 26rem); }
.cm-recurso__imatge img { width: 100%; height: auto; border: 1px solid var(--cm-filet); }
.cm-recurso__avis { font-size: var(--cm-petit); color: var(--cm-tinta-2); }
@media (min-width: 48em) { .cm-recurso { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); } }