/* A BDN Planxa i Pintura — tokens del sistema de disseny (tokens.json). No editar a mà: es regeneren. */
:root {
  --navy: #0b213f;
  --amber: #f2b705;
  --ink: #293241;
  --slate: #617082;
  --muted: #7b8794;
  --line: #e3e8ef;
  --panel: #f3f5f7;
  --surface: #ffffff;
  --on-navy: #ffffff;
  --on-navy-soft: #e7edf5;
  --on-navy-muted: #cfd8e3;
  --on-amber: var(--navy);
  --overlay-photo: #0b213fbf;
  --overlay-panel: #0b213ff2;
  --overlay-soft: #0b213f73;
  --danger: #b42318;
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #0b213f;
  --focus-ring-on-navy: 0 0 0 2px #0b213f, 0 0 0 4px #f2b705;
  --space-08: 7.68px;
  --space-11: 10.56px;
  --space-12: 11.52px;
  --space-15: 14.4px;
  --space-16: 15.36px;
  --space-18: 17.28px;
  --space-20: 19.2px;
  --space-25: 24px;
  --space-30: 28.8px;
  --space-40: 38.4px;
  --space-55: 52.8px;
  --space-65: 62.4px;
  --radius-none: 0px;
  --radius-card: 7.68px;
  --radius-band: 9.6px;
  --radius-tile: 11.52px;
  --stroke-hairline: 1.33px;
  --rule-section-w: 216px;
  --rule-section-h: 4px;
  --rule-cover-w: 259.2px;
  --rule-cover-h: 5.33px;
  --label-col: 153.6px;
  --control-h: 43.2px;
  --cover-panel: 39%;
  --font-sans: Arial, "Helvetica Neue", Helvetica, "Liberation Sans", Arimo, sans-serif;
}
.cover-title { font-family: var(--font-sans); font-size: 32px; line-height: 1.15; font-weight: 700; }
.figure { font-family: var(--font-sans); font-size: 34.67px; line-height: 1.15; font-weight: 700; }
.section-title { font-family: var(--font-sans); font-size: 24px; line-height: 1.15; font-weight: 700; }
.statement { font-family: var(--font-sans); font-size: 22.67px; line-height: 1.15; font-weight: 700; }
.tagline { font-family: var(--font-sans); font-size: 21.33px; line-height: 1.15; font-weight: 700; }
.lead { font-family: var(--font-sans); font-size: 18.67px; line-height: 1.15; font-weight: 400; }
.intro { font-family: var(--font-sans); font-size: 18px; line-height: 1.15; font-weight: 400; }
.subhead { font-family: var(--font-sans); font-size: 17.33px; line-height: 1.15; font-weight: 700; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 1.15; font-weight: 400; }
.card-title { font-family: var(--font-sans); font-size: 14.67px; line-height: 1.15; font-weight: 700; }
.band-label { font-family: var(--font-sans); font-size: 14px; line-height: 1.15; font-weight: 700; }
.caption { font-family: var(--font-sans); font-size: 13.33px; line-height: 1.15; font-weight: 700; }
.subtitle { font-family: var(--font-sans); font-size: 12.67px; line-height: 1.15; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 11.33px; line-height: 1.15; font-weight: 700; }
.meta { font-family: var(--font-sans); font-size: 11.33px; line-height: 1.15; font-weight: 400; }
.closing { font-family: var(--font-sans); font-size: 12.27px; line-height: 1.15; font-weight: 400; font-style: italic; }
.footnote { font-family: var(--font-sans); font-size: 9.07px; line-height: 1.15; font-weight: 400; }
.display { font-family: var(--font-sans); font-size: 48px; line-height: 1.15; font-weight: 700; }
.body-web { font-family: var(--font-sans); font-size: 16px; line-height: 1.5; font-weight: 400; }
.small-web { font-family: var(--font-sans); font-size: 12.67px; line-height: 1.5; font-weight: 400; }

/* A BDN Planxa i Pintura — components del sistema de disseny (bundle.css). Needs tokens.css. Class prefix: ab-. ⚑ = derived for the web, not in the dossier. */

body { margin: 0; font-family: var(--font-sans); color: var(--ink); background: var(--surface); -webkit-text-size-adjust: 100%; }
[class*="ab-"], [class*="ab-"]::before, [class*="ab-"]::after { box-sizing: border-box; }
.ab-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Wordmark — the name in type; the dossier has no logo */
.ab-wordmark { display: inline-flex; flex-direction: column; align-items: flex-start; gap: var(--space-15); font-family: var(--font-sans); font-weight: 700; line-height: 1.15; color: var(--navy); text-decoration: none; }
.ab-wordmark__name { font-size: 32px; }
.ab-wordmark__rule { display: block; width: var(--rule-cover-w); max-width: 100%; height: var(--rule-cover-h); background: var(--amber); }
.ab-wordmark--md { gap: var(--space-11); }
.ab-wordmark--md .ab-wordmark__name { font-size: 24px; }
.ab-wordmark--md .ab-wordmark__rule { width: var(--rule-section-w); height: var(--rule-section-h); }
.ab-wordmark--sm { gap: var(--space-08); }
.ab-wordmark--sm .ab-wordmark__name { font-size: 17.33px; white-space: nowrap; }
.ab-wordmark--sm .ab-wordmark__rule { width: calc(var(--rule-section-w) * 17.33 / 24); height: var(--rule-section-h); }
.ab-wordmark--dark { color: var(--on-navy); }

/* SectionHeader */
.ab-section { display: block; }
.ab-section__title { margin: 0; font-size: 24px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-section__rule { display: block; width: var(--rule-section-w); max-width: 100%; height: var(--rule-section-h); margin-top: var(--space-11); background: var(--amber); }
.ab-section__subtitle { margin: var(--space-12) 0 0; font-size: 12.67px; line-height: 1.15; color: var(--slate); }
.ab-section--dark .ab-section__title { color: var(--on-navy); }
.ab-section--dark .ab-section__subtitle { color: var(--on-navy-soft); }

/* Card */
.ab-card { background: var(--surface); border: var(--stroke-hairline) solid var(--line); border-radius: var(--radius-card); padding: var(--space-16) var(--space-18); color: var(--ink); }
.ab-card__title { margin: 0; font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-card__body { margin: var(--space-08) 0 0; font-size: 16px; line-height: 1.15; }
.ab-card__list { list-style: none; margin: var(--space-08) 0 0; padding: 0; font-size: 16px; line-height: 1.15; }
.ab-card--compact { display: flex; align-items: center; min-height: 67.2px; }
.ab-card--compact .ab-card__title { font-size: 16px; }

/* Panel */
.ab-panel { background: var(--panel); border: var(--stroke-hairline) solid var(--line); border-radius: var(--radius-none); padding: var(--space-30); color: var(--ink); }
.ab-panel--white { background: var(--surface); }
.ab-panel__lead { margin: 0; font-size: 18.67px; line-height: 1.15; }
.ab-panel__statement { margin: 0; font-size: 22.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }

/* Band */
.ab-band { margin: 0; display: flex; align-items: center; justify-content: center; text-align: center; min-height: var(--control-h); padding: var(--space-16) var(--space-25); border-radius: var(--radius-card); font-size: 16px; line-height: 1.15; font-weight: 700; }
.ab-band--navy { background: var(--navy); color: var(--on-navy); }
.ab-band--amber { background: var(--amber); color: var(--on-amber); border-radius: var(--radius-band); }
.ab-band--square { border-radius: var(--radius-none); }
.ab-band--left { justify-content: flex-start; text-align: left; }
.ab-band--sm { font-size: 14px; }
.ab-band--lg { font-size: 18.67px; }
@media (max-width: 640px) { .ab-band > span > [aria-hidden="true"] { display: none; } .ab-band > span > span { display: block; } }

/* RatingTile — top-aligned: 0.14 in and 0.22 in between its three lines, as in the dossier */
.ab-rating-tile { display: flex; flex-direction: column; align-items: center; text-align: center; min-height: 220.8px; padding: var(--space-30) var(--space-25); background: var(--navy); color: var(--on-navy); border-radius: var(--radius-tile); text-decoration: none; }
.ab-rating-tile__source { font-size: 16px; line-height: 1.15; color: var(--on-navy-muted); }
.ab-rating-tile__score { margin-top: 13.44px; font-size: 34.67px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.ab-rating-tile__caption { margin-top: 21.12px; font-size: 13.33px; line-height: 1.15; font-weight: 700; color: var(--amber); }
.ab-rating-tile__count { margin-top: var(--space-08); font-size: 11.33px; line-height: 1.15; color: var(--on-navy-muted); }
a.ab-rating-tile:hover .ab-rating-tile__count { text-decoration: underline; }
a.ab-rating-tile:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }

/* ValueTile */
.ab-value-tile { margin: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; min-height: 139.2px; padding: var(--space-30) var(--space-20); background: var(--amber); color: var(--on-amber); border-radius: var(--radius-tile); font-size: 17.33px; line-height: 1.15; font-weight: 700; }
.ab-value-tile__word { display: block; }

/* DataList */
.ab-datalist { background: var(--surface); border: var(--stroke-hairline) solid var(--line); padding: var(--space-16) var(--space-30) var(--space-30); }
.ab-datalist__title { margin: 0 0 var(--space-20); font-size: 18.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-datalist__rows { display: grid; grid-template-columns: var(--label-col) 1fr; row-gap: var(--space-20); margin: 0; }
.ab-datalist__label { align-self: center; font-size: 11.33px; line-height: 1.15; font-weight: 700; color: var(--slate); }
.ab-datalist__value { margin: 0; font-size: 16px; line-height: 1.15; color: var(--ink); }
@media (max-width: 480px) {
  .ab-datalist__rows { grid-template-columns: 1fr; row-gap: 0; }
  .ab-datalist__value { margin: var(--space-08) 0 var(--space-16); }
}

/* PhotoFrame */
.ab-photo { margin: 0; display: block; }
.ab-photo__img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-none); background: var(--panel); }
.ab-photo__caption { margin-top: var(--space-12); text-align: center; font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-photo--bar .ab-photo__caption { display: flex; align-items: center; justify-content: center; min-height: 40.32px; margin-top: 0; padding: 0 var(--space-20); background: var(--navy); color: var(--on-navy); font-size: 12.67px; }

/* CaseStrip */
.ab-case { display: grid; gap: var(--space-25); }
.ab-case__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-30); margin: 0; padding: 0; list-style: none; }
.ab-case__text { margin: 0; text-align: center; }
@media (max-width: 640px) { .ab-case__steps { grid-template-columns: 1fr; } }

/* InfoTile */
.ab-info-tile { background: var(--navy); color: var(--line); border-radius: var(--radius-none); padding: var(--space-30) var(--space-25); }
.ab-info-tile__title { margin: 0; font-size: 17.33px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.ab-info-tile__body { margin: var(--space-12) 0 0; font-size: 12.67px; line-height: 1.15; }

/* BulletList */
.ab-bullets { margin: 0; padding: 0; list-style: none; font-size: 16px; line-height: 1.15; color: var(--ink); }
.ab-bullets--lg { font-size: 18.67px; }
.ab-bullets__item { position: relative; padding-left: 13.33px; }
.ab-bullets__item::before { content: "\2022"; position: absolute; left: 0; }
.ab-bullets--dark { color: var(--on-navy-soft); }

/* Hero — the cover: photo, 75 % veil, 39 % navy panel with the text */
.ab-hero { position: relative; display: grid; min-height: 560px; background: var(--navy); color: var(--on-navy); overflow: hidden; isolation: isolate; }
.ab-hero__media { position: absolute; inset: 0; z-index: -1; }
.ab-hero__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-hero__media::after { content: ""; position: absolute; inset: 0; background: var(--overlay-photo); }
.ab-hero__panel { display: flex; flex-direction: column; width: var(--cover-panel); min-width: 400px; padding: 100.8px var(--space-30) var(--space-55) var(--space-65); background: var(--overlay-panel); }
.ab-hero__title { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.ab-hero--display .ab-hero__title { font-size: 48px; }
.ab-hero__rule { display: block; width: var(--rule-cover-w); max-width: 100%; height: var(--rule-cover-h); margin-top: var(--space-15); background: var(--amber); }
.ab-hero__subtitle { margin: var(--space-25) 0 0; font-size: 17.33px; line-height: 1.15; color: var(--on-navy-soft); }
.ab-hero__tagline { margin: var(--space-25) 0 0; font-size: 21.33px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.ab-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-16); margin-top: var(--space-40); }
.ab-hero__foot { margin-top: auto; padding-top: var(--space-40); }
.ab-hero__member { margin: 0; font-size: 16px; line-height: 1.15; font-weight: 700; color: var(--amber); }
.ab-hero__meta { margin: var(--space-16) 0 0; font-size: 11.33px; line-height: 1.15; color: var(--on-navy-muted); }
@media (max-width: 959px) {
  .ab-hero { min-height: 0; }
  .ab-hero__media { position: relative; inset: auto; z-index: 0; aspect-ratio: 4 / 3; max-height: 56vh; width: 100%; }
  .ab-hero__media::after { background: transparent; }
  .ab-hero__panel { width: auto; min-width: 0; padding: var(--space-30) var(--space-16) var(--space-40); background: var(--navy); }
  .ab-hero--display .ab-hero__title { font-size: 32px; }
}

/* Button ⚑ — from the dossier's navy CTA band and amber band */
.ab-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-08); min-height: var(--control-h); padding: 0 var(--space-25); border: var(--stroke-hairline) solid transparent; border-radius: var(--radius-card); font-family: var(--font-sans); font-size: 14px; line-height: 1.15; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ab-btn:hover { text-decoration: underline; text-underline-offset: 3px; }
.ab-btn:active { transform: translateY(1px); }
.ab-btn:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.ab-btn--primary { background: var(--navy); border-color: var(--navy); color: var(--on-navy); }
.ab-btn--primary:hover { background: var(--ink); border-color: var(--ink); }
.ab-btn--accent { background: var(--amber); border-color: var(--amber); color: var(--on-amber); }
.ab-btn--outline { background: transparent; border-color: var(--navy); color: var(--navy); }
.ab-btn--outline:hover { background: var(--panel); }
.ab-btn--outline-light { background: transparent; border-color: var(--on-navy); color: var(--on-navy); }
.ab-btn--accent:focus-visible, .ab-btn--outline-light:focus-visible { box-shadow: var(--focus-ring-on-navy); }
.ab-btn--block { display: flex; width: 100%; }
.ab-btn[disabled], .ab-btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; transform: none; text-decoration: none; }

/* LangSwitch ⚑ */
.ab-lang { display: inline-flex; border: var(--stroke-hairline) solid var(--navy); border-radius: var(--radius-card); overflow: hidden; }
.ab-lang__opt { display: inline-flex; align-items: center; justify-content: center; min-width: var(--control-h); min-height: var(--control-h); padding: 0 var(--space-12); font-size: 14px; line-height: 1.15; font-weight: 700; color: var(--navy); background: var(--surface); text-decoration: none; border: 0; cursor: pointer; font-family: var(--font-sans); }
.ab-lang__opt + .ab-lang__opt { border-left: var(--stroke-hairline) solid var(--navy); }
.ab-lang__opt:hover { text-decoration: underline; text-underline-offset: 3px; }
.ab-lang__opt[aria-current="true"] { background: var(--navy); color: var(--on-navy); }
.ab-lang__opt:focus-visible { outline: 2px solid transparent; box-shadow: inset 0 0 0 2px var(--surface), inset 0 0 0 4px var(--navy); }
.ab-lang__opt[aria-current="true"]:focus-visible { box-shadow: inset 0 0 0 2px var(--navy), inset 0 0 0 4px var(--amber); }

/* Field ⚑ */
.ab-field { display: grid; gap: var(--space-08); align-content: start; min-width: 0; }
.ab-field__label { font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-field__req { margin-left: 2px; }
.ab-field__control { width: 100%; min-height: var(--control-h); padding: 0 var(--space-18); font-family: var(--font-sans); font-size: 16px; line-height: 1.5; color: var(--ink); background: var(--surface); border: var(--stroke-hairline) solid var(--muted); border-radius: var(--radius-card); box-sizing: border-box; }
textarea.ab-field__control { min-height: calc(var(--control-h) * 3); padding: var(--space-12) var(--space-18); resize: vertical; }
.ab-field__control::placeholder { color: var(--slate); opacity: 1; }
.ab-field__control:hover { border-color: var(--slate); }
.ab-field__control:focus-visible { outline: 2px solid transparent; border-color: var(--navy); box-shadow: var(--focus-ring); }
.ab-field__hint { margin: 0; font-size: 12.67px; line-height: 1.5; color: var(--slate); }
.ab-field__error { margin: 0; font-size: 12.67px; line-height: 1.5; font-weight: 700; color: var(--danger); }
.ab-field--error .ab-field__control { border-color: var(--danger); box-shadow: inset 0 0 0 1px var(--danger); }

/* Checkbox ⚑ */
.ab-check { display: grid; grid-template-columns: 20px 1fr; column-gap: var(--space-12); align-items: start; font-size: 16px; line-height: 1.5; color: var(--ink); }
.ab-check__input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--navy); cursor: pointer; }
.ab-check__input:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.ab-check a { color: var(--navy); text-decoration: underline; text-underline-offset: 2px; }
.ab-check__error { grid-column: 2; margin: var(--space-08) 0 0; font-size: 12.67px; line-height: 1.5; font-weight: 700; color: var(--danger); }

/* ContactForm ⚑ */
.ab-form { display: grid; gap: var(--space-25); max-width: 760px; }
.ab-form__row { display: grid; gap: var(--space-25); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ab-form__legend { margin: 0; font-size: 12.67px; line-height: 1.5; color: var(--slate); }
.ab-form__privacy { margin: 0; padding: var(--space-16) var(--space-18); background: var(--panel); border: var(--stroke-hairline) solid var(--line); font-size: 12.67px; line-height: 1.5; color: var(--ink); }
.ab-form__privacy a { color: var(--navy); }
.ab-form__status { margin: 0; padding: var(--space-16) var(--space-18); border-radius: var(--radius-card); font-size: 16px; line-height: 1.5; font-weight: 700; }
.ab-form__status--success { background: var(--navy); color: var(--on-navy); }
.ab-form__status--error { background: var(--surface); color: var(--danger); border: 2px solid var(--danger); }
.ab-form__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) { .ab-form__row { grid-template-columns: 1fr; } }

/* StarRating ⚑ — amber stars always carry the value as text */
.ab-stars { display: inline-flex; align-items: center; gap: var(--space-08); line-height: 1; }
.ab-stars__track { position: relative; display: inline-flex; }
.ab-stars__row { display: inline-flex; gap: 2px; }
.ab-stars__row--fill { position: absolute; inset: 0 auto 0 0; overflow: hidden; white-space: nowrap; }
.ab-stars__row svg { display: block; flex: none; width: 18px; height: 18px; }
.ab-stars--sm .ab-stars__row svg { width: 14px; height: 14px; }
.ab-stars--lg .ab-stars__row svg { width: 24px; height: 24px; }
.ab-stars__row--base svg { fill: var(--line); }
.ab-stars__row--fill svg { fill: var(--amber); }
.ab-stars__value { font-size: 14.67px; font-weight: 700; color: var(--ink); }
.ab-stars--on-navy .ab-stars__value { color: var(--on-navy); }
.ab-stars--on-navy .ab-stars__row--base svg { fill: var(--slate); }

/* ReviewCard ⚑ — literal Google reviews */
.ab-review { display: flex; flex-direction: column; gap: var(--space-12); margin: 0; background: var(--surface); border: var(--stroke-hairline) solid var(--line); border-radius: var(--radius-card); padding: var(--space-25); color: var(--ink); }
.ab-review__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-08); }
.ab-review__source { font-size: 12.67px; line-height: 1.15; color: var(--slate); }
.ab-review__text { margin: 0; font-size: 16px; line-height: 1.5; white-space: pre-line; }
.ab-review__text--clamp { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.ab-review__foot { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-08); margin-top: auto; }
.ab-review__author { font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.ab-review__when { font-size: 12.67px; line-height: 1.15; color: var(--slate); }
.ab-review__more { font-size: 12.67px; color: var(--navy); }
.ab-review__more:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); border-radius: 2px; }

/* SiteHeader ⚑ */
.ab-header { background: var(--surface); border-bottom: var(--stroke-hairline) solid var(--line); }
.ab-header__inner { display: flex; align-items: center; gap: var(--space-25); max-width: 1280px; margin: 0 auto; padding: var(--space-16) var(--space-55); }
.ab-header__brand { flex: none; text-decoration: none; border-radius: 2px; }
.ab-header__brand:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.ab-header__nav { margin-left: auto; }
.ab-header__list { display: flex; gap: var(--space-25); margin: 0; padding: 0; list-style: none; }
.ab-header__link { position: relative; display: inline-flex; align-items: center; min-height: var(--control-h); font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--navy); text-decoration: none; }
.ab-header__link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 6px; height: var(--rule-section-h); background: var(--amber); transform: scaleX(0); transform-origin: left; transition: transform .16s ease-out; }
.ab-header__link:hover::after, .ab-header__link[aria-current="page"]::after { transform: scaleX(1); }
.ab-header__link:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); border-radius: 2px; }
.ab-header__tools { display: flex; align-items: center; gap: var(--space-16); }
.ab-header__toggle { display: none; }
@media (prefers-reduced-motion: reduce) { .ab-header__link::after { transition: none; } }
@media (max-width: 959px) {
  .ab-header__inner { flex-wrap: wrap; gap: var(--space-12) var(--space-16); padding: var(--space-12) var(--space-16); }
  .ab-header__toggle { display: inline-flex; margin-left: auto; }
  .ab-header__nav { display: none; order: 3; flex-basis: 100%; margin-left: 0; }
  .ab-header__nav.is-open { display: block; }
  .ab-header__list { flex-direction: column; gap: 0; }
  .ab-header__list li + li { border-top: var(--stroke-hairline) solid var(--line); }
  .ab-header__link { display: flex; }
  .ab-header__link::after { bottom: 8px; right: auto; width: 48px; }
  .ab-header__tools { order: 4; flex-basis: 100%; }
  .ab-header__tools .ab-btn { flex: 1; }
  .ab-header__tools .ab-lang { display: none; }
  .ab-header__nav .ab-lang { display: inline-flex; margin: var(--space-12) 0 var(--space-08); }
}
@media (min-width: 960px) { .ab-header__nav .ab-lang { display: none; } }

/* SiteFooter ⚑ — from the dossier's closing slide */
.ab-footer { background: var(--navy); color: var(--on-navy-soft); }
.ab-footer__inner { display: flex; flex-wrap: wrap; gap: var(--space-40); max-width: 1280px; margin: 0 auto; padding: var(--space-55) var(--space-55) var(--space-40); }
.ab-footer__inner > * { flex: 1 1 180px; min-width: 0; }
.ab-footer__inner > :first-child { flex: 2 1 320px; }
.ab-footer__member { margin: var(--space-25) 0 0; font-size: 16px; line-height: 1.15; font-weight: 700; color: var(--amber); }
.ab-footer__tagline { margin: var(--space-16) 0 0; font-size: 16px; line-height: 1.5; color: var(--on-navy-soft); max-width: 420px; }
.ab-footer__heading { margin: 0 0 var(--space-12); font-size: 14.67px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.ab-footer__text { margin: 0; font-size: 16px; line-height: 1.5; }
.ab-footer a { color: var(--on-navy); text-underline-offset: 3px; }
.ab-footer a:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring-on-navy); border-radius: 2px; }
.ab-footer__legal { max-width: 1280px; margin: 0 auto; padding: var(--space-16) var(--space-55) var(--space-25); border-top: var(--stroke-hairline) solid var(--slate); font-size: 12.67px; line-height: 1.5; color: var(--on-navy-muted); display: flex; flex-wrap: wrap; gap: var(--space-08) var(--space-25); }
.ab-footer__legal a { color: var(--on-navy-muted); }
@media (max-width: 959px) {
  .ab-footer__inner { flex-direction: column; padding: var(--space-40) var(--space-16) var(--space-30); gap: var(--space-30); }
  .ab-footer__inner > *, .ab-footer__inner > :first-child { flex: none; }
  .ab-footer__legal { padding: var(--space-16); }
}

/* A BDN Planxa i Pintura — page layout. Components: components.css (design system). Tokens: tokens.css. */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
img { max-width: 100%; }
a { color: var(--navy); }
main:focus { outline: none; }

.skip { position: absolute; left: -10000px; top: 0; z-index: 100; padding: var(--space-12) var(--space-18); background: var(--navy); color: var(--on-navy); font-weight: 700; border-radius: 0 0 var(--radius-card) 0; }
.skip:focus { left: 0; outline: 2px solid transparent; box-shadow: var(--focus-ring-on-navy); }

.wrap { max-width: 1280px; margin: 0 auto; padding: 0 var(--space-55); }
.section { padding: var(--space-65) 0; }
.section--tight { padding-top: var(--space-40); }
.section--panel { background: var(--panel); border-top: var(--stroke-hairline) solid var(--line); border-bottom: var(--stroke-hairline) solid var(--line); }
.section__top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-16) var(--space-40); margin-bottom: var(--space-30); }
.more { display: inline-flex; align-items: center; min-height: var(--control-h); font-size: 14.67px; font-weight: 700; color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.more:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); border-radius: 2px; }
.intro { margin: 0; font-size: 18px; line-height: 1.5; color: var(--ink); max-width: 62ch; }
.prose { font-size: 16px; line-height: 1.5; color: var(--ink); }
.prose p { margin: 0 0 var(--space-16); max-width: 70ch; }
.h2 { margin: 0; font-size: 24px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.h3 { margin: 0; font-size: 17.33px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.stack > * + * { margin-top: var(--space-25); }

/* Page head (every page but the home) */
.page-head { padding: var(--space-55) 0 var(--space-30); }
.page-head .ab-section__title { font-size: 32px; }
.page-head .intro { margin-top: var(--space-25); }

/* Hero additions */
.hero-proof { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-08) var(--space-12); margin: var(--space-25) 0 0; font-size: 16px; line-height: 1.15; color: var(--on-navy-soft); }
.hero-proof a { color: var(--on-navy); font-weight: 700; text-underline-offset: 3px; }
.hero-proof a:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring-on-navy); border-radius: 2px; }
.ab-hero__meta a { color: var(--on-navy-muted); }

/* Claims (home) */
.claims { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-25) var(--space-40); align-items: end; }
.steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-25); margin: var(--space-40) 0; padding: 0; list-style: none; }
.steps li { padding-top: var(--space-16); border-top: var(--rule-section-h) solid var(--amber); }
.steps__n { display: block; font-size: 34.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.steps__t { margin: var(--space-08) 0 0; font-size: 16px; line-height: 1.3; font-weight: 700; color: var(--ink); }
.insurers { margin: var(--space-12) 0 0; font-size: 14.67px; line-height: 1.5; color: var(--slate); }

/* Reviews (home + page) */
.reviews-home { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: var(--space-25); align-items: stretch; }
.reviews-home > div:first-child .ab-rating-tile { height: 100%; }
.reviews-home .ab-review__foot { flex-direction: column; align-items: flex-start; gap: 4px; }
.reviews-home__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-25); align-items: stretch; }
.reviews-wall { columns: 3 300px; column-gap: var(--space-25); }
.reviews-wall .ab-review { break-inside: avoid; margin-bottom: var(--space-25); }
.reviews-top { display: grid; grid-template-columns: 300px 192px minmax(0, 1fr); gap: var(--space-25); align-items: stretch; margin-bottom: var(--space-40); }
.reviews-top__list { align-self: center; }
.reviews-top__list .h3 { margin-bottom: var(--space-16); }
.reviews-actions { display: flex; flex-wrap: wrap; gap: var(--space-16); margin-top: var(--space-25); }
.note { margin: var(--space-16) 0 0; font-size: 12.67px; line-height: 1.5; color: var(--slate); }

/* Ecosystem (home) and services */
.split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-40); align-items: start; }
.split--flip > :first-child { order: 2; }
.split__media .ab-photo__img { aspect-ratio: auto; height: 100%; max-height: 520px; }
.duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-25); margin-top: var(--space-25); }
.service + .service { margin-top: var(--space-65); padding-top: var(--space-65); border-top: var(--stroke-hairline) solid var(--line); }
.service__text > * + * { margin-top: var(--space-25); }
.service__text .ab-bullets { margin-top: var(--space-16); }

/* Work */
.case + .case { margin-top: var(--space-55); }
.case__title { margin: 0 0 var(--space-25); }
.ab-case__steps--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-30); margin: var(--space-30) 0 0; padding: 0; list-style: none; }
.gallery .ab-photo__img { aspect-ratio: auto; height: 240px; }

/* CTA band section */
.cta { background: var(--surface); color: var(--on-navy-soft); }
.cta__inner { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-40); align-items: center; }
.cta__box { background: var(--navy); border-radius: var(--radius-tile); padding: var(--space-55); }
.cta__title { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 700; color: var(--on-navy); }
.cta__text { margin: var(--space-16) 0 0; font-size: 18px; line-height: 1.5; }
.cta__actions { display: flex; flex-wrap: wrap; gap: var(--space-16); margin-top: var(--space-25); }
.cta__facts { margin: 0; font-size: 16px; line-height: 1.5; }
.cta__facts dt { font-size: 13.33px; font-weight: 700; color: var(--amber); }
.cta__facts dd { margin: 0 0 var(--space-16); color: var(--on-navy-soft); }
.cta__facts a { color: var(--on-navy); }
.cta__facts a:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring-on-navy); border-radius: 2px; }

/* Contact */
.contact { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-40); align-items: start; }
.contact__aside > * + * { margin-top: var(--space-25); }
.map { position: relative; border: var(--stroke-hairline) solid var(--line); background: var(--panel); }
.map__frame { display: block; width: 100%; height: 320px; border: 0; }
.map__consent { padding: var(--space-25); }
.map__consent p { margin: 0 0 var(--space-16); font-size: 14.67px; line-height: 1.5; color: var(--ink); }
.map__actions { display: flex; flex-wrap: wrap; gap: var(--space-12); }
.ab-datalist__value a { color: var(--navy); }

/* Legal */
.legal { max-width: 820px; }
.legal h2 { margin: var(--space-40) 0 var(--space-12); font-size: 18.67px; line-height: 1.15; font-weight: 700; color: var(--navy); }
.legal p, .legal li { font-size: 16px; line-height: 1.5; color: var(--ink); }
.legal p { margin: 0 0 var(--space-12); }
.legal ul { margin: 0 0 var(--space-12); padding-left: var(--space-25); }
.legal table { width: 100%; border-collapse: collapse; margin: 0 0 var(--space-16); font-size: 14.67px; line-height: 1.5; }
.legal th, .legal td { text-align: left; vertical-align: top; padding: var(--space-08) var(--space-12); border-bottom: var(--stroke-hairline) solid var(--line); }
.legal th { color: var(--navy); }
.pending { background: var(--amber); color: var(--on-amber); font-weight: 700; padding: 0 4px; }

/* 404 */
.notfound { padding: var(--space-65) 0; }

@media (max-width: 1100px) {
  .reviews-home { grid-template-columns: 1fr; }
  .reviews-home__cards { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
  .reviews-top { grid-template-columns: 300px 192px; }
  .reviews-top__list { grid-column: 1 / -1; }
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 959px) {
  .wrap { padding: 0 var(--space-16); }
  .section { padding: var(--space-40) 0; }
  .page-head { padding: var(--space-40) 0 var(--space-20); }
  .page-head .ab-section__title { font-size: 24px; }
  .claims, .split, .cta__inner, .contact { grid-template-columns: 1fr; }
  .split--flip > :first-child { order: 0; }
  .split__media .ab-photo__img { height: auto; aspect-ratio: 4 / 3; }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-16); }
  .gallery .ab-photo__img { height: 180px; }
  .cta__title { font-size: 24px; }
  .cta__box { padding: var(--space-30) var(--space-18); }
  .reviews-home > div:first-child .ab-rating-tile { height: auto; }
}
@media (max-width: 640px) {
  .steps { grid-template-columns: 1fr; gap: var(--space-16); }
  .duo { grid-template-columns: 1fr; }
  .reviews-top { grid-template-columns: 1fr; }
  .ab-case__steps--2 { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: 1fr; }
  .gallery .ab-photo__img { height: 220px; }
}

/* vista prèvia */
.map__frame--preview { display: flex; align-items: center; justify-content: center; height: 320px; padding: var(--space-25); text-align: center; font-size: 14.67px; line-height: 1.5; color: var(--slate); background: var(--panel); }