/* ============================================================
   British Centre of Melilla — bcm.css (child theme, 1 hoja cacheada)
   Marca: azul #345199 · rojo #FD0003 · blanco. Look CLARO fijo.
   Port FIEL del prototipo aprobado (repo del proyecto, tag git
   `demo-v-final`, prototipo/home.html). Ante cualquier duda de
   diseño, ese tag es la especificación — no editar esta hoja sin
   comparar con él. Los estilos del wizard de matrícula (Fase B)
   viven aparte, SIN encolar: bcm-core/assets/css/bcm-matricula.css
   ============================================================ */
  :root {
    --bcm-blue: #345199;
    --bcm-blue-700: #2a4079;
    --bcm-blue-900: #1b2c56;
    --bcm-red: #fd0003;
    --bcm-ink: #101a33;
    --bcm-paper: #f4f7fc;
    --bcm-surface: #ffffff;
    --bcm-line: #d7deec;
    --bcm-border-strong: #b9c4da;
    --bcm-muted: #4f5b7d;
    --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
    --font-sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --bcm-radius: 14px;
    --bcm-shadow: 0 1px 2px rgba(16,26,51,.06), 0 12px 30px -12px rgba(16,26,51,.18);
    --bcm-shadow-sm: 0 1px 2px rgba(16,26,51,.06), 0 6px 16px -10px rgba(16,26,51,.16);
    --bcm-maxw: 1180px;
    /* Curvas de easing (contenido suave · interacción con carácter) */
    --bcm-ease-out: cubic-bezier(.16, 1, .3, 1);
    --bcm-ease-ui: cubic-bezier(.23, 1, .32, 1);
  }

  * { box-sizing: border-box; }
  ::selection { background: color-mix(in srgb, var(--bcm-blue) 20%, transparent); color: inherit; }
  html { scroll-behavior: smooth; }
  body { margin: 0; font-family: var(--font-sans); color: var(--bcm-ink); background: var(--bcm-paper);
    line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
  h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 700; line-height: 1.1; margin: 0; text-wrap: balance; letter-spacing: -.01em; }
  p { margin: 0; }
  a { color: inherit; text-decoration: none; }
  img, svg { display: block; max-width: 100%; }
  [hidden] { display: none !important; }

  .bcm-wrap { width: 100%; max-width: var(--bcm-maxw); margin-inline: auto; padding-inline: 22px; }
  .bcm-section { padding-block: clamp(52px, 7.5vw, 100px); }
  .bcm-section--tight { padding-block: clamp(36px, 5vw, 64px); }

  .bcm-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-sans);
    font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--bcm-blue); margin-bottom: 18px; }
  .bcm-eyebrow::before { content: ""; width: 26px; height: 12px; flex: none;
    background: linear-gradient(var(--bcm-red) 0 0) left / 26px 4px no-repeat,
                linear-gradient(var(--bcm-blue) 0 0) left 6px top 6px / 18px 4px no-repeat; }
  .bcm-h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); color: var(--bcm-ink); }
  .bcm-lead { color: var(--bcm-muted); font-size: 1.08rem; max-width: 62ch; }

  /* Botones (contraste AA garantizado, colores fijos donde el fondo es fijo) */
  .bcm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-family: var(--font-sans);
    font-weight: 600; font-size: .98rem; padding: 13px 22px; border-radius: 999px; border: 1.5px solid transparent; cursor: pointer;
    transition: transform .16s var(--bcm-ease-ui), box-shadow .16s var(--bcm-ease-ui), background .15s ease, color .15s ease, border-color .15s ease; }
  .bcm-btn--primary { background: var(--bcm-blue); color: #fff; box-shadow: 0 8px 18px -11px rgba(27,44,86,.5); }
  .bcm-btn--primary:hover, .bcm-btn--primary:focus { transform: translateY(-2px); background: var(--bcm-blue-700); color: #fff; box-shadow: 0 12px 22px -12px rgba(27,44,86,.55); }
  .bcm-btn--wa { background: #fff; color: var(--bcm-ink); border-color: var(--bcm-border-strong); }
  .bcm-btn--wa:hover { border-color: var(--bcm-blue); color: var(--bcm-blue); background: #fff; transform: translateY(-2px); box-shadow: var(--bcm-shadow-sm); }
  .bcm-btn--ghost { background: transparent; color: var(--bcm-ink); border-color: var(--bcm-border-strong); padding: 9px 16px; font-size: .9rem; }
  .bcm-btn--ghost:hover { border-color: var(--bcm-blue); color: var(--bcm-blue); background: color-mix(in srgb, var(--bcm-blue) 6%, transparent); }
  .bcm-btn--light { background: #fff; color: #17224a; }
  .bcm-btn--light:hover, .bcm-btn--light:focus { transform: translateY(-2px); color: #17224a; background: #fff; box-shadow: 0 12px 24px -14px rgba(0,0,0,.32); }
  /* Outline sobre fondos oscuros (CTA rojo, banda Trinity): al hover se rellena
     de blanco con texto de marca — legible sobre cualquier fondo (antes el
     relleno translúcido quedaba lavado/ilegible sobre el rojo). */
  .bcm-btn--outline-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.75); }
  .bcm-btn--outline-light:hover { background: #fff; color: var(--bcm-blue); border-color: #fff; transform: translateY(-2px); }
  .bcm-btn:active { transform: scale(.97); }

  :focus-visible { outline: 3px solid var(--bcm-red); outline-offset: 2px; border-radius: 4px; }

  /* Header */
  .bcm-header { position: sticky; top: 0; z-index: 50; background: transparent; border-bottom: 1px solid transparent;
    transition: transform .35s ease, background .3s ease, border-color .3s ease, box-shadow .3s ease; will-change: transform; }
  .bcm-header.is-scrolled { background: rgba(244,247,252,.82); backdrop-filter: saturate(1.4) blur(12px); border-bottom-color: var(--bcm-line); }
  .bcm-header.is-hidden { transform: translateY(-100%); }
  .bcm-header__row { display: flex; align-items: center; gap: 20px; height: 74px; }
  .bcm-brand { display: flex; align-items: center; gap: 12px; }
  .bcm-brand__mark { width: 40px; height: 40px; flex: none; }
  .bcm-brand__name { font-family: var(--font-display); font-weight: 700; font-size: 1.16rem; line-height: 1; color: var(--bcm-ink); }
  .bcm-brand__name small { display: block; font-family: var(--font-sans); font-weight: 600; font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: var(--bcm-blue); margin-top: 4px; }
  .bcm-nav { display: flex; align-items: center; gap: 26px; margin-inline-start: auto; }
  .bcm-nav a { font-size: .95rem; font-weight: 500; color: var(--bcm-ink); padding-block: 6px; position: relative; }
  .bcm-nav a:hover { color: var(--bcm-blue); }
  .bcm-nav a.is-active { color: var(--bcm-blue); font-weight: 600; }
  .bcm-nav a.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--bcm-red); border-radius: 2px; }
  .bcm-header__cta { display: flex; align-items: center; gap: 10px; }
  .bcm-burger { display: none; background: #fff; border: 1.5px solid var(--bcm-border-strong); border-radius: 10px; width: 44px; height: 44px; cursor: pointer; align-items: center; justify-content: center; margin-inline-start: auto; }
  .bcm-burger span, .bcm-burger span::before, .bcm-burger span::after { content: ""; display: block; width: 18px; height: 2px; background: var(--bcm-ink); position: relative; }
  .bcm-burger span::before { position: absolute; top: -6px; } .bcm-burger span::after { position: absolute; top: 6px; }
  /* Menú móvil — overlay «cortina» que baja desde arriba (chrome global) */
  .bcm-mobile { position: fixed; inset: 0; z-index: 100; color: #fff; overflow-y: auto;
    background: radial-gradient(130% 100% at 82% 0%, var(--bcm-blue-700), var(--bcm-blue-900));
    clip-path: inset(0 0 100% 0); visibility: hidden;
    transition: clip-path .38s var(--bcm-ease-out), visibility 0s linear .38s; }
  .bcm-mobile.is-open { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path .5s cubic-bezier(.45, .05, .35, 1); }
  .bcm-mobile::before { content: ""; position: absolute; right: -80px; top: -80px; width: 320px; height: 320px; border-radius: 50%; background: color-mix(in srgb, var(--bcm-red) 22%, transparent); filter: blur(60px); pointer-events: none; }
  .bcm-mobile__inner { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: 100%; max-width: var(--bcm-maxw); margin-inline: auto; padding: 16px 22px 36px; }
  .bcm-mobile__top { display: flex; align-items: center; justify-content: space-between; min-height: 74px; }
  .bcm-mobile__brand { display: flex; align-items: center; gap: 12px; }
  .bcm-mobile__brand .bcm-brand__name { color: #fff; }
  .bcm-mobile__brand .bcm-brand__name small { color: rgba(255,255,255,.72); }
  .bcm-mobile__close { width: 46px; height: 46px; border-radius: 12px; border: 1.5px solid rgba(255,255,255,.28); background: rgba(255,255,255,.08); color: #fff; display: grid; place-items: center; cursor: pointer; transition: background .15s, transform .15s; }
  .bcm-mobile__close:hover { background: rgba(255,255,255,.18); }
  .bcm-mobile__close:active { transform: scale(.94); }
  .bcm-mobile__close svg { width: 22px; height: 22px; }
  .bcm-mobile__nav { display: flex; flex-direction: column; margin-top: 22px; }
  .bcm-mobile__nav a { font-family: var(--font-display); font-size: clamp(1.7rem, 8vw, 2.2rem); font-weight: 700; color: #fff; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.14); display: flex; align-items: center; justify-content: space-between; }
  .bcm-mobile__nav a::after { content: "→"; font-family: var(--font-sans); font-size: 1.3rem; color: var(--bcm-red); opacity: 0; transform: translateX(-8px); transition: opacity .2s var(--bcm-ease-ui), transform .2s var(--bcm-ease-ui); }
  .bcm-mobile__nav a:hover::after, .bcm-mobile__nav a.is-active::after { opacity: 1; transform: none; }
  .bcm-mobile__nav a.is-active { color: #fff; }
  .bcm-mobile__foot { margin-top: auto; display: flex; flex-direction: column; gap: 12px; padding-top: 28px; }
  .bcm-mobile__foot .bcm-btn { width: 100%; }
  .bcm-mobile__wa { text-align: center; font-family: var(--font-sans); font-weight: 600; font-size: .92rem; color: rgba(255,255,255,.82); margin-top: 4px; }
  .bcm-mobile__wa:hover { color: #fff; }

  /* Hero */
  .bcm-hero { position: relative; overflow: hidden; }
  .bcm-hero__bg { position: absolute; inset: 0; overflow: hidden; z-index: 0; pointer-events: none; }
  .bcm-hero__bg span { position: absolute; border-radius: 50%; filter: blur(72px); }
  .bcm-hero__bg span:nth-child(1) { width: 440px; height: 440px; top: -140px; left: -90px;
    background: color-mix(in srgb, var(--bcm-blue) 32%, transparent); animation: bcmFloat 15s ease-in-out infinite; }
  .bcm-hero__bg span:nth-child(2) { width: 360px; height: 360px; bottom: -150px; right: 24%;
    background: color-mix(in srgb, var(--bcm-red) 16%, transparent); animation: bcmFloat 19s ease-in-out infinite reverse; }
  @keyframes bcmFloat { 0%,100% { transform: translate(0,0); } 50% { transform: translate(34px,26px); } }
  @keyframes bcmPageIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
  .bcm-js .bcm-page:not([hidden]) { animation: bcmPageIn .45s ease both; }
  .bcm-js .bcm-inview { opacity: 0; transform: translateY(18px) scale(.99); transition: opacity .6s var(--bcm-ease-out), transform .6s var(--bcm-ease-out); will-change: opacity, transform; }
  .bcm-js .bcm-inview.is-in { opacity: 1; transform: none; }
  .bcm-header.is-scrolled { box-shadow: 0 8px 24px -16px rgba(16,26,51,.55); }
  .bcm-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; padding-block: clamp(48px, 7vw, 90px); }
  .bcm-hero h1 { font-size: clamp(2.5rem, 6vw, 4.3rem); color: var(--bcm-ink); }
  .bcm-hero h1 em { font-style: normal; color: var(--bcm-blue); position: relative; }
  .bcm-hero h1 em::after { content: ""; position: absolute; left: 0; right: 0; bottom: .06em; height: .13em; background: var(--bcm-red); border-radius: 2px; }
  .bcm-hero__lead { margin-top: 22px; font-size: 1.18rem; color: var(--bcm-muted); max-width: 46ch; }
  .bcm-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
  .bcm-hero__chips { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--bcm-line); }
  .bcm-chip { display: inline-flex; align-items: center; gap: 8px; font-size: .86rem; font-weight: 600; color: var(--bcm-ink); }
  .bcm-chip svg { width: 18px; height: 18px; color: var(--bcm-blue); flex: none; }
  .bcm-chip .bcm-stars { color: var(--bcm-red); letter-spacing: 1px; }
  .bcm-hero__art { position: relative; aspect-ratio: 1/1; display: grid; place-items: center; }
  .bcm-hero__art::before { content: ""; position: absolute; inset: 0; border-radius: 26px;
    background: linear-gradient(160deg, color-mix(in srgb, var(--bcm-blue) 9%, #fff), #fff);
    border: 1px solid var(--bcm-line); box-shadow: var(--bcm-shadow); z-index: 0; }
  .bcm-hero__art svg { position: relative; z-index: 1; width: 74%; height: auto; filter: drop-shadow(0 24px 40px rgba(27,44,86,.22)); }

  /* Confianza */
  .bcm-trust { background: var(--bcm-surface); border-block: 1px solid var(--bcm-line); }
  .bcm-trust__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 30px; padding-block: 22px; }
  .bcm-trust__item { display: flex; align-items: center; gap: 8px; font-size: .9rem; font-weight: 600; color: var(--bcm-ink); }
  .bcm-trust__item span { color: var(--bcm-muted); font-weight: 500; }
  .bcm-trust__item b { color: var(--bcm-blue); }

  /* Tarjetas método */
  .bcm-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 44px; }
  .bcm-card { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 26px 22px; box-shadow: var(--bcm-shadow-sm); transition: transform .18s ease, box-shadow .18s ease; }
  .bcm-card:hover { transform: translateY(-4px); box-shadow: var(--bcm-shadow); }
  .bcm-card__ico { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--bcm-blue) 12%, transparent); color: var(--bcm-blue); margin-bottom: 16px; }
  .bcm-card__ico svg { width: 24px; height: 24px; }
  .bcm-card h3 { font-size: 1.16rem; color: var(--bcm-ink); margin-bottom: 8px; }
  .bcm-card p { font-size: .95rem; color: var(--bcm-muted); }

  /* Oferta (home) */
  .bcm-offer { background: var(--bcm-surface); border-block: 1px solid var(--bcm-line); }
  .bcm-offer__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; }
  .bcm-grid-courses { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 44px; }
  .bcm-course { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: var(--bcm-radius); border: 1px solid var(--bcm-line); background: var(--bcm-paper); overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
  .bcm-course:hover { transform: translateY(-4px); box-shadow: var(--bcm-shadow); border-color: color-mix(in srgb, var(--bcm-blue) 40%, var(--bcm-line)); }
  .bcm-course::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(90deg, var(--bcm-red), var(--bcm-blue)); }
  .bcm-course__age { font-family: var(--font-sans); font-size: .76rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bcm-red); }
  .bcm-course h3 { font-size: 1.3rem; color: var(--bcm-ink); }
  .bcm-course p { font-size: .93rem; color: var(--bcm-muted); flex: 1; }
  .bcm-course__link { font-size: .9rem; font-weight: 700; color: var(--bcm-blue); display: inline-flex; align-items: center; gap: 6px; }
  .bcm-course--wide { grid-column: span 3; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; background: var(--bcm-blue-900); border: none; color: #fff; padding: 34px; }
  .bcm-course--wide::before { display: none; }
  .bcm-mini { display: flex; flex-direction: column; gap: 6px; }
  .bcm-mini__k { font-family: var(--font-sans); font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #fff; opacity: .7; }
  .bcm-mini h4 { font-size: 1.28rem; margin: 0; color: #fff; }
  .bcm-mini p { font-size: .9rem; color: rgba(255,255,255,.82); }

  /* Trinity band */
  .bcm-trinity { background: linear-gradient(135deg, var(--bcm-blue-900), var(--bcm-blue-700)); color: #fff; }
  .bcm-trinity__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; align-items: center; }
  .bcm-trinity h2 { color: #fff; font-size: clamp(1.9rem, 3.4vw, 2.7rem); }
  .bcm-trinity p { color: rgba(255,255,255,.85); margin-top: 16px; }
  .bcm-trinity .bcm-eyebrow { color: #fff; }
  .bcm-trinity .bcm-eyebrow::before { background: linear-gradient(#fff 0 0) left / 26px 4px no-repeat, linear-gradient(var(--bcm-red) 0 0) left 6px top 6px / 18px 4px no-repeat; }
  .bcm-exam { display: flex; flex-direction: column; gap: 16px; }
  .bcm-exam__item { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); border-radius: 12px; padding: 20px 22px; }
  .bcm-exam__item h3 { color: #fff; font-size: 1.2rem; margin-bottom: 6px; }
  .bcm-exam__item p { margin-top: 4px; color: rgba(255,255,255,.85); font-size: .93rem; }
  .bcm-exam__item b { color: #fff; }

  /* Cifras */
  .bcm-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .bcm-stat__n { font-family: var(--font-display); font-size: clamp(2.2rem, 4vw, 3rem); color: var(--bcm-blue); line-height: 1; }
  .bcm-stat__l { font-size: .92rem; color: var(--bcm-muted); margin-top: 8px; }

  /* Testimonios */
  .bcm-quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 40px; }
  .bcm-quote { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 26px; box-shadow: var(--bcm-shadow-sm); }
  .bcm-quote__stars { color: var(--bcm-red); letter-spacing: 2px; font-size: 1rem; }
  .bcm-quote p { margin-top: 12px; font-size: 1rem; color: var(--bcm-ink); }
  .bcm-quote__who { margin-top: 16px; font-size: .86rem; font-weight: 600; color: var(--bcm-muted); }

  /* CTA */
  .bcm-cta { background: var(--bcm-red); color: #fff; }
  .bcm-cta__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
  .bcm-cta h2 { color: #fff; font-size: clamp(1.8rem, 3.4vw, 2.6rem); max-width: 18ch; }
  .bcm-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }

  /* Contacto */
  .bcm-contact__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
  .bcm-info { display: flex; flex-direction: column; gap: 18px; }
  .bcm-info__item { display: flex; gap: 14px; align-items: flex-start; }
  .bcm-info__item svg { width: 22px; height: 22px; color: var(--bcm-blue); flex: none; margin-top: 3px; }
  .bcm-info__item b { display: block; color: var(--bcm-ink); }
  .bcm-info__item span { color: var(--bcm-muted); font-size: .95rem; }
  /* Mapa de la ubicación: imagen estática (OpenStreetMap, RGPD-safe — no
     carga scripts de Google) como fondo, con la tarjeta de dirección + enlace
     a Google Maps encima. URL relativa al dominio (sobrevive al cutover). */
  .bcm-map { position: relative; border-radius: var(--bcm-radius); border: 1px solid var(--bcm-line); overflow: hidden; min-height: 340px; display: grid; place-items: end start; padding: 16px; text-align: left;
    background-image: linear-gradient(0deg, rgba(16,26,51,.32), rgba(16,26,51,0) 52%), url("/wp-content/uploads/mapa-ubicacion-british-centre.jpg");
    background-size: cover; background-position: center; }
  .bcm-map > div { position: relative; z-index: 1; background: #fff; padding: 13px 17px; border-radius: 12px; box-shadow: var(--bcm-shadow); max-width: 290px; }
  .bcm-map a { font-weight: 700; color: var(--bcm-blue); }

  /* Formulario */
  .bcm-form { display: grid; gap: 16px; background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 28px; box-shadow: var(--bcm-shadow-sm); }
  .bcm-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .bcm-field label { display: block; font-size: .84rem; font-weight: 600; margin-bottom: 6px; color: var(--bcm-ink); }
  .bcm-field input, .bcm-field textarea { width: 100%; padding: 12px 14px; border: 1.5px solid var(--bcm-border-strong); border-radius: 10px; font: inherit; background: #fff; color: var(--bcm-ink); }
  .bcm-field textarea { min-height: 120px; resize: vertical; }
  .bcm-field input:focus, .bcm-field textarea:focus { outline: none; border-color: var(--bcm-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--bcm-blue) 18%, transparent); }
  .bcm-consent { display: flex; gap: 10px; align-items: flex-start; font-size: .84rem; color: var(--bcm-muted); }
  .bcm-consent a { color: var(--bcm-blue); font-weight: 600; }

  /* Fotos / huecos con vida */
  .bcm-split { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; align-items: center; }
  .bcm-list { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
  .bcm-list li { position: relative; padding-left: 32px; font-weight: 500; color: var(--bcm-ink); }
  .bcm-list li::before { content: "\2713"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: color-mix(in srgb, var(--bcm-blue) 15%, transparent); color: var(--bcm-blue); font-size: .72rem; font-weight: 800; display: grid; place-items: center; }
  .bcm-photo { position: relative; border-radius: var(--bcm-radius); overflow: hidden; min-height: 300px; display: grid; place-items: center; background: linear-gradient(140deg, var(--bcm-blue-900), var(--bcm-blue)); box-shadow: var(--bcm-shadow); }
  .bcm-photo::before { content: ""; position: absolute; inset: 0; opacity: .1; background: repeating-linear-gradient(45deg, #fff 0 2px, transparent 2px 18px); }
  .bcm-photo--tall { min-height: 440px; }
  .bcm-photo__ill { position: relative; width: 62%; max-width: 260px; color: #fff; opacity: .96; }
  .bcm-photo[data-label]::after { content: attr(data-label); position: absolute; left: 14px; bottom: 14px; background: #fff; color: #17224a; font-size: .75rem; font-weight: 700; padding: 6px 13px; border-radius: 999px; }
  .bcm-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 40px; }
  .bcm-gallery .bcm-photo { min-height: 220px; }
  .bcm-gallery .bcm-photo__ill { width: 42%; max-width: 90px; }

  /* Página de cursos: niveles */
  .bcm-group + .bcm-group { margin-top: 56px; }
  .bcm-levels { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 28px; }
  .bcm-level { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 26px; box-shadow: var(--bcm-shadow-sm); transition: transform .18s ease, box-shadow .18s ease; }
  .bcm-level:hover { transform: translateY(-3px); box-shadow: var(--bcm-shadow); }
  .bcm-level__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .bcm-level__age { font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--bcm-blue); padding: 5px 11px; border-radius: 999px; }
  .bcm-level h3 { font-size: 1.35rem; margin-top: 14px; color: var(--bcm-ink); }
  .bcm-level p { color: var(--bcm-muted); font-size: .93rem; margin-top: 8px; }
  .bcm-level__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--bcm-line); }
  .bcm-spec b { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .07em; color: var(--bcm-blue); margin-bottom: 3px; }
  .bcm-spec span { color: var(--bcm-ink); font-weight: 500; font-size: .9rem; }

  /* Timeline nosotros */
  .bcm-timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 40px; }
  .bcm-tl { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 22px; box-shadow: var(--bcm-shadow-sm); }
  .bcm-tl__y { font-family: var(--font-display); font-size: 1.4rem; color: var(--bcm-red); }
  .bcm-tl h4 { font-family: var(--font-sans); font-size: .98rem; margin: 8px 0 6px; color: var(--bcm-ink); }
  .bcm-tl p { font-size: .88rem; color: var(--bcm-muted); }

  /* Footer */
  .bcm-footer { background: var(--bcm-blue-900); color: rgba(255,255,255,.8); padding-block: 54px 30px; }
  .bcm-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 34px; }
  .bcm-footer h4 { color: #fff; font-family: var(--font-sans); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 16px; }
  .bcm-footer a { color: rgba(255,255,255,.8); font-size: .94rem; display: block; padding: 4px 0; }
  .bcm-footer a:hover { color: #fff; }
  .bcm-footer__brand { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
  .bcm-footer__brand .bcm-brand__name { color: #fff; }
  .bcm-footer__badges { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
  .bcm-social { display: flex; gap: 10px; margin-top: 18px; }
  .bcm-social a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,.28); display: grid; place-items: center; color: #fff; padding: 0; transition: background .15s ease, transform .15s ease; }
  .bcm-social a:hover { background: rgba(255,255,255,.14); transform: translateY(-2px); color: #fff; }
  .bcm-social svg { width: 18px; height: 18px; fill: currentColor; }
  .bcm-social--light a { border-color: var(--bcm-border-strong); color: var(--bcm-blue); }
  .bcm-social--light a:hover { background: color-mix(in srgb, var(--bcm-blue) 10%, transparent); color: var(--bcm-blue); }
  .bcm-badge { font-size: .74rem; font-weight: 600; color: #fff; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; padding: 5px 12px; }
  .bcm-footer__bottom { border-top: 1px solid rgba(255,255,255,.14); margin-top: 34px; padding-top: 20px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; font-size: .84rem; color: rgba(255,255,255,.6); }
  .bcm-footer__legal a { display: inline; color: rgba(255,255,255,.6); padding: 0; }
  .bcm-footer__legal a:hover { color: #fff; text-decoration: underline; }

  /* ---- Intro de marca (preloader) ---- */
  .bcm-intro { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; overflow: hidden;
    background: radial-gradient(120% 120% at 30% 20%, var(--bcm-blue-700), var(--bcm-blue-900)); }
  .bcm-intro__logo { display: flex; flex-direction: column; align-items: center; gap: 20px; }
  .bcm-intro__card { position: relative; background: #fff; border-radius: 28px; padding: clamp(26px, 5vw, 42px); overflow: hidden;
    box-shadow: 0 30px 70px -20px rgba(0,0,0,.55); animation: bcmCardIn .38s cubic-bezier(.2,.8,.2,1) both; }
  .bcm-intro__card svg { width: clamp(110px, 20vw, 168px); height: auto; display: block;
    -webkit-clip-path: inset(0 100% 0 0); clip-path: inset(0 100% 0 0); animation: bcmWipe .5s cubic-bezier(.55,.1,.25,1) .1s forwards; }
  .bcm-intro__shine { position: absolute; inset: 0; pointer-events: none; transform: translateX(-130%);
    background: linear-gradient(105deg, transparent 42%, rgba(255,255,255,.75) 50%, transparent 58%); animation: bcmShine .65s ease .55s forwards; }
  .bcm-intro__word { font-family: var(--font-display); font-weight: 700; color: #fff; text-align: center;
    font-size: clamp(1.4rem, 3.6vw, 2.1rem); opacity: 0; transform: translateY(10px); animation: bcmWordIn .45s ease .5s forwards; }
  .bcm-intro__word small { display: block; font-family: var(--font-sans); font-weight: 600; font-size: .6rem; letter-spacing: .3em; text-transform: uppercase; color: rgba(255,255,255,.72); margin-top: 8px; }
  .bcm-intro.is-out { animation: bcmIntroOut .5s ease forwards; }
  @keyframes bcmCardIn { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: none; } }
  @keyframes bcmWipe { to { -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); } }
  @keyframes bcmShine { to { transform: translateX(130%); } }
  @keyframes bcmWordIn { to { opacity: 1; transform: none; } }
  @keyframes bcmIntroOut { to { opacity: 0; visibility: hidden; } }

  /* ---- Chat flotante ---- */
  .bcm-chat { position: fixed; right: 22px; bottom: 22px; z-index: 120; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
  .bcm-chat__fab { position: relative; width: 62px; height: 62px; border-radius: 50%; border: none; cursor: pointer; background: #fff;
    box-shadow: 0 12px 30px -8px rgba(16,26,51,.5); display: grid; place-items: center; transition: transform .2s ease, box-shadow .2s ease; }
  .bcm-chat__fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 16px 36px -8px rgba(16,26,51,.55); }
  .bcm-chat__fab svg { width: 34px; height: 34px; }
  .bcm-chat__x svg { width: 21px; height: 21px; }
  .bcm-chat__fab::before { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--bcm-blue); opacity: .55; animation: bcmPulse 2.6s ease-out infinite; }
  .bcm-chat__x { display: none; }
  .bcm-chat.is-open .bcm-chat__ico { display: none; }
  .bcm-chat.is-open .bcm-chat__x { display: block; }
  .bcm-chat.is-open .bcm-chat__fab::before { display: none; }
  @keyframes bcmPulse { 0% { transform: scale(1); opacity: .55; } 70% { transform: scale(1.4); opacity: 0; } 100% { opacity: 0; } }

  .bcm-chat__teaser { position: relative; max-width: 234px; background: #fff; color: var(--bcm-ink); border: 1px solid var(--bcm-line);
    border-radius: 16px 16px 4px 16px; padding: 12px 32px 12px 14px; box-shadow: var(--bcm-shadow); font-size: .9rem; font-weight: 500; cursor: pointer;
    transform-origin: bottom right; animation: bcmPop .32s ease both; }
  .bcm-chat__teaser[hidden] { display: none; }
  .bcm-chat__teaser b { color: var(--bcm-blue); }
  .bcm-chat__teaser-close { position: absolute; top: 5px; right: 7px; border: none; background: none; cursor: pointer; color: var(--bcm-muted); font-size: .9rem; line-height: 1; padding: 3px; }
  @keyframes bcmPop { from { opacity: 0; transform: scale(.8) translateY(10px); } to { opacity: 1; transform: none; } }

  .bcm-chat__panel { width: 350px; max-width: calc(100vw - 44px); height: 462px; max-height: calc(100vh - 130px);
    background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: 18px; box-shadow: 0 26px 64px -20px rgba(16,26,51,.5);
    overflow: hidden; display: none; flex-direction: column; transform-origin: bottom right; }
  .bcm-chat.is-open .bcm-chat__panel { display: flex; animation: bcmPanelIn .28s cubic-bezier(.2,.7,.2,1) both; }
  @keyframes bcmPanelIn { from { opacity: 0; transform: translateY(16px) scale(.96); } to { opacity: 1; transform: none; } }
  .bcm-chat__head { background: linear-gradient(135deg, var(--bcm-blue-900), var(--bcm-blue)); color: #fff; padding: 15px 15px; display: flex; align-items: center; gap: 12px; }
  .bcm-chat__avatar { width: 40px; height: 40px; border-radius: 50%; background: #fff; display: grid; place-items: center; flex: none; }
  .bcm-chat__avatar svg { width: 24px; height: 24px; }
  .bcm-chat__head b { display: block; font-family: var(--font-display); font-size: 1.05rem; line-height: 1.1; }
  .bcm-chat__head span { font-size: .74rem; color: rgba(255,255,255,.82); display: inline-flex; align-items: center; gap: 6px; margin-top: 2px; }
  .bcm-chat__head span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #46d17a; box-shadow: 0 0 0 3px rgba(70,209,122,.25); }
  .bcm-chat__close { margin-left: auto; background: rgba(255,255,255,.16); border: none; color: #fff; width: 30px; height: 30px; border-radius: 8px; cursor: pointer; font-size: 1rem; line-height: 1; }
  .bcm-chat__close:hover { background: rgba(255,255,255,.3); }
  .bcm-chat__body { flex: 1; overflow-y: auto; padding: 18px 15px; display: flex; flex-direction: column; gap: 11px; background: var(--bcm-paper); }
  .bcm-msg { max-width: 84%; padding: 11px 14px; border-radius: 14px; font-size: .92rem; line-height: 1.45; }
  .bcm-msg--bot { background: #fff; border: 1px solid var(--bcm-line); color: var(--bcm-ink); border-bottom-left-radius: 4px; align-self: flex-start; }
  .bcm-msg--user { background: var(--bcm-blue); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
  .bcm-chat__quick { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 15px 12px; background: var(--bcm-paper); }
  .bcm-chip-q { border: 1.5px solid var(--bcm-border-strong); background: #fff; color: var(--bcm-blue); font-weight: 600; font-size: .82rem; padding: 7px 13px; border-radius: 999px; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
  .bcm-chip-q:hover { background: var(--bcm-blue); color: #fff; border-color: var(--bcm-blue); }
  .bcm-chat__foot { border-top: 1px solid var(--bcm-line); padding: 10px 12px; display: flex; align-items: center; gap: 8px; background: var(--bcm-surface); }
  .bcm-chat__foot input { flex: 1; border: 1.5px solid var(--bcm-line); border-radius: 999px; padding: 10px 14px; font: inherit; background: var(--bcm-paper); color: var(--bcm-ink); }
  .bcm-chat__foot input:focus { outline: none; border-color: var(--bcm-blue); }
  .bcm-chat__send { background: var(--bcm-blue); border: none; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; display: grid; place-items: center; flex: none; }
  .bcm-chat__note { font-size: .68rem; color: var(--bcm-muted); text-align: center; padding: 0 12px 10px; background: var(--bcm-surface); }

  /* Menú móvil: entrada escalonada de los enlaces + subrayado nav escritorio */
  .bcm-mobile.is-open .bcm-mobile__nav a, .bcm-mobile.is-open .bcm-mobile__foot > * { animation: bcmMenuIn .4s var(--bcm-ease-out) both; }
  .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(1){ animation-delay:.04s } .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(2){ animation-delay:.09s }
  .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(3){ animation-delay:.14s } .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(4){ animation-delay:.19s }
  .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(5){ animation-delay:.24s } .bcm-mobile.is-open .bcm-mobile__nav a:nth-child(6){ animation-delay:.29s }
  .bcm-mobile.is-open .bcm-mobile__foot > *:nth-child(1){ animation-delay:.33s } .bcm-mobile.is-open .bcm-mobile__foot > *:nth-child(2){ animation-delay:.37s }
  .bcm-mobile.is-open .bcm-mobile__foot > *:nth-child(3){ animation-delay:.41s }
  @keyframes bcmMenuIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  .bcm-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--bcm-blue); border-radius: 2px; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
  .bcm-nav a:hover::after { transform: scaleX(1); }
  .bcm-nav a.is-active::after { background: var(--bcm-red); transform: scaleX(1); }

  /* ---- Banner del test (captación) ---- */
  .bcm-testbanner { background: linear-gradient(135deg, var(--bcm-blue-900), var(--bcm-blue)); color: #fff; border-radius: 20px;
    padding: clamp(26px, 4vw, 40px); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 22px; position: relative; overflow: hidden; }
  .bcm-testbanner::after { content: ""; position: absolute; right: -40px; top: -40px; width: 200px; height: 200px; border-radius: 50%; background: rgba(253,0,3,.16); }
  .bcm-testbanner > div { position: relative; z-index: 1; }
  .bcm-testbanner h2 { color: #fff; font-size: clamp(1.5rem, 3vw, 2.1rem); margin-top: 8px; }
  .bcm-testbanner p { color: rgba(255,255,255,.85); margin-top: 8px; max-width: 46ch; }
  .bcm-testbanner .bcm-eyebrow { color: #fff; margin-bottom: 0; }
  .bcm-testbanner .bcm-eyebrow::before { background: linear-gradient(#fff 0 0) left / 26px 4px no-repeat, linear-gradient(var(--bcm-red) 0 0) left 6px top 6px / 18px 4px no-repeat; }
  .bcm-testbanner .bcm-btn { position: relative; z-index: 1; }

  /* ---- Test de nivel (quiz) ---- */
  .bcm-quiz { max-width: 680px; margin-inline: auto; padding-block: clamp(52px, 8vw, 104px); }
  .bcm-quiz__card { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: 20px; box-shadow: var(--bcm-shadow); padding: clamp(24px, 4vw, 42px); }
  .bcm-quiz__meta { display: flex; justify-content: space-between; align-items: center; font-size: .82rem; font-weight: 600; color: var(--bcm-muted); margin-bottom: 12px; }
  .bcm-quiz__meta b { color: var(--bcm-blue); }
  .bcm-quiz__track { height: 8px; background: var(--bcm-line); border-radius: 999px; overflow: hidden; margin-bottom: 28px; }
  .bcm-quiz__fill { height: 100%; background: linear-gradient(90deg, var(--bcm-red), var(--bcm-blue)); border-radius: 999px; width: 0; transition: width .4s ease; }
  .bcm-quiz__q { font-family: var(--font-display); font-size: clamp(1.35rem, 3vw, 1.9rem); color: var(--bcm-ink); margin-bottom: 24px; line-height: 1.3; }
  .bcm-quiz__q .gap { display: inline-block; min-width: 46px; border-bottom: 2px dashed var(--bcm-border-strong); margin: 0 4px; }
  .bcm-quiz__opts { display: flex; flex-direction: column; gap: 12px; }
  .bcm-quiz__opt { text-align: left; padding: 14px 16px; border: 1.5px solid var(--bcm-line); border-radius: 12px; background: var(--bcm-paper); font: inherit; font-size: 1.02rem; font-weight: 500; color: var(--bcm-ink); cursor: pointer; transition: border-color .15s, background .15s, transform .1s; display: flex; align-items: center; gap: 12px; }
  .bcm-quiz__opt:hover { border-color: var(--bcm-blue); background: #fff; transform: translateX(3px); }
  .bcm-quiz__opt .k { width: 28px; height: 28px; flex: none; border-radius: 8px; background: color-mix(in srgb, var(--bcm-blue) 12%, transparent); color: var(--bcm-blue); font-weight: 700; font-size: .85rem; display: grid; place-items: center; }
  .bcm-quiz__start { text-align: center; }
  .bcm-quiz__ico { width: 68px; height: 68px; border-radius: 18px; margin: 0 auto 18px; display: grid; place-items: center; background: color-mix(in srgb, var(--bcm-blue) 12%, transparent); color: var(--bcm-blue); }
  .bcm-quiz__start h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); color: var(--bcm-ink); }
  .bcm-quiz__start p { color: var(--bcm-muted); margin: 14px auto 26px; max-width: 46ch; }
  .bcm-quiz__result { text-align: center; }
  .bcm-quiz__reslabel { font-size: .8rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--bcm-red); }
  .bcm-quiz__badge { font-family: var(--font-display); font-size: clamp(3rem, 8vw, 4.6rem); color: var(--bcm-blue); line-height: 1; }
  .bcm-mcer { display: flex; gap: 6px; margin: 26px 0; }
  .bcm-mcer span { flex: 1; text-align: center; padding: 10px 0; border-radius: 8px; background: var(--bcm-paper); border: 1px solid var(--bcm-line); font-weight: 700; font-size: .85rem; color: var(--bcm-muted); transition: transform .2s; }
  .bcm-mcer span.on { background: var(--bcm-blue); color: #fff; border-color: var(--bcm-blue); transform: translateY(-3px); box-shadow: var(--bcm-shadow-sm); }
  .bcm-quiz__result-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 24px; }
  .bcm-quiz__note { font-size: .82rem; color: var(--bcm-muted); margin-top: 18px; }


  /* ---- Formularios: genéricos compartidos (select, ayudas, estado de error) ---- */
  .bcm-field small { display: block; margin-top: 6px; color: var(--bcm-muted); font-size: .78rem; font-weight: 400; }
  .bcm-field select { width: 100%; padding: 12px 14px; border: 1.5px solid var(--bcm-border-strong); border-radius: 10px; font: inherit; background: #fff; color: var(--bcm-ink); }
  .bcm-field select:focus { outline: none; border-color: var(--bcm-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--bcm-blue) 18%, transparent); }
  .bcm-field.has-err input, .bcm-field.has-err textarea, .bcm-field.has-err select { border-color: #d4001a; box-shadow: 0 0 0 3px rgba(253, 0, 3, .08); }

  /* Responsive */
  @media (max-width: 940px) {
    .bcm-nav, .bcm-header__cta .bcm-btn { display: none; }
    .bcm-burger { display: inline-flex; }
    .bcm-hero__grid, .bcm-trinity__grid, .bcm-contact__grid, .bcm-split { grid-template-columns: 1fr; }
    .bcm-split { gap: 30px; }
    .bcm-hero__art { order: -1; max-width: 360px; }
    .bcm-photo--tall { min-height: 320px; }
    .bcm-cards, .bcm-stats, .bcm-timeline { grid-template-columns: repeat(2, 1fr); }
    .bcm-grid-courses, .bcm-levels { grid-template-columns: repeat(2, 1fr); }
    .bcm-course--wide { grid-column: span 2; grid-template-columns: 1fr; }
    .bcm-quotes { grid-template-columns: 1fr; }
    .bcm-footer__grid { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 560px) {
    .bcm-cards, .bcm-stats, .bcm-grid-courses, .bcm-levels, .bcm-timeline, .bcm-gallery, .bcm-form__row { grid-template-columns: 1fr; }
    .bcm-course--wide { grid-column: span 1; }
    .bcm-footer__grid { grid-template-columns: 1fr; }
    .bcm-chat { right: 12px; bottom: 12px; left: 12px; }
    .bcm-chat__panel { width: 100%; height: 72vh; }
    .bcm-mcer span { font-size: .72rem; padding: 8px 0; }
    .bcm-mcer { gap: 4px; }
  }
  @media (prefers-reduced-motion: reduce) {
    * { scroll-behavior: auto !important; }
    .bcm-hero__bg span { animation: none !important; }
    .bcm-js .bcm-page:not([hidden]) { animation: none !important; }
    .bcm-js .bcm-inview { opacity: 1 !important; transform: none !important; transition: none !important; }
    .bcm-btn:hover, .bcm-btn:active, .bcm-card:hover, .bcm-course:hover, .bcm-level:hover { transform: none; }
    .bcm-chat__fab::before { animation: none !important; }
    .bcm-chat.is-open .bcm-chat__panel, .bcm-chat__teaser, .bcm-intro__card, .bcm-intro__card svg,
    .bcm-intro__word, .bcm-mobile.is-open .bcm-mobile__nav a, .bcm-mobile.is-open .bcm-mobile__foot > * { animation: none !important; opacity: 1 !important; transform: none !important; }
    .bcm-mobile { transition: visibility 0s !important; }
    .bcm-intro__card svg { -webkit-clip-path: none !important; clip-path: none !important; }
  }

  /* ============================================================
     Adaptaciones WordPress (no existen en el prototipo)
     ============================================================ */
  /* Barra de administración de WP: desplazar el header sticky */
  body.admin-bar .bcm-header { top: 32px; }
  @media (max-width: 782px) { body.admin-bar .bcm-header { top: 46px; } }

  /* ============================================================
     Blog (S5) — dirección editorial «British Centre Gazette».
     Hereda los tokens --bcm-* y el gradiente cinta rojo→azul del
     contrato. Curvatura generosa, tarjetas con foto, una entrada
     destacada como pieza editorial y animación de carácter (solo
     transform/opacity). Plantillas PHP del child (no Elementor).
     ============================================================ */

  /* Cuerpo del artículo (contenido migrado del histórico). */
  .bcm-prose { color: var(--bcm-ink); font-size: 1.06rem; line-height: 1.78; }
  .bcm-prose > * + * { margin-top: 1.15em; }
  .bcm-prose h2 { font-size: 1.6rem; margin-top: 1.6em; color: var(--bcm-ink); }
  .bcm-prose h3 { font-size: 1.3rem; margin-top: 1.4em; color: var(--bcm-ink); }
  .bcm-prose a { color: var(--bcm-blue); text-decoration: underline; text-underline-offset: 2px; }
  .bcm-prose a:hover { color: var(--bcm-blue-700); }
  .bcm-prose ul, .bcm-prose ol { padding-left: 1.3em; }
  .bcm-prose li + li { margin-top: .4em; }
  .bcm-prose img { border-radius: 18px; margin-inline: auto; }
  .bcm-prose figure { margin-inline: 0; }
  .bcm-prose figcaption { font-size: .85rem; color: var(--bcm-muted); text-align: center; margin-top: 8px; }
  .bcm-prose blockquote { border-left: 3px solid var(--bcm-blue); padding-left: 18px; margin-left: 0; color: var(--bcm-muted); font-style: italic; }

  /* Etiqueta de categoría (cinta con el gradiente de marca) — hilo conductor */
  .bcm-tag { display: inline-flex; align-items: center; font-family: var(--font-sans); font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #fff; padding: 6px 13px; border-radius: 999px; background: linear-gradient(90deg, var(--bcm-red), var(--bcm-blue)); box-shadow: 0 8px 20px -10px rgba(27,44,86,.7); }

  /* Hero del blog / archivo */
  .bcm-blog-hero { position: relative; overflow: hidden; background: var(--bcm-surface); border-bottom: 1px solid var(--bcm-line); }
  .bcm-blog-hero__inner { position: relative; z-index: 1; text-align: center; display: flex; flex-direction: column; align-items: center; }
  .bcm-blog-hero__title { font-size: clamp(2.4rem, 5.5vw, 4rem); color: var(--bcm-ink); }
  .bcm-blog-hero__title em { font-style: italic; color: var(--bcm-blue); }
  .bcm-blog-hero .bcm-lead { margin: 16px auto 0; text-align: center; }

  /* Chips de categorías */
  .bcm-blog-cats { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
  .bcm-blog-cat { font-family: var(--font-sans); font-size: .84rem; font-weight: 600; color: var(--bcm-ink); background: var(--bcm-paper); border: 1.5px solid var(--bcm-line); border-radius: 999px; padding: 9px 18px; transition: border-color .18s var(--bcm-ease-ui), color .18s, background .18s, transform .18s var(--bcm-ease-ui); }
  .bcm-blog-cat:hover { border-color: var(--bcm-blue); color: var(--bcm-blue); transform: translateY(-2px); }
  .bcm-blog-cat.is-active { background: var(--bcm-blue); border-color: var(--bcm-blue); color: #fff; }

  /* Entrada DESTACADA — la pieza editorial (portada de la gaceta) */
  .bcm-feat { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; border-radius: 30px; overflow: hidden; background: var(--bcm-surface); border: 1px solid var(--bcm-line); box-shadow: var(--bcm-shadow); transition: transform .3s var(--bcm-ease-out), box-shadow .3s var(--bcm-ease-out); }
  .bcm-feat:hover { transform: translateY(-5px); box-shadow: 0 34px 64px -30px rgba(16,26,51,.42); }
  .bcm-feat__media { position: relative; overflow: hidden; min-height: 350px; background: linear-gradient(140deg, var(--bcm-blue-900), var(--bcm-blue)); }
  .bcm-feat__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .5s var(--bcm-ease-out); }
  .bcm-feat:hover .bcm-feat__media img { transform: scale(1.05); }
  .bcm-feat__body { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: clamp(28px, 3.4vw, 52px); }
  .bcm-feat__kicker { font-family: var(--font-sans); font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--bcm-red); display: inline-flex; align-items: center; gap: 10px; }
  .bcm-feat__kicker::before { content: ""; width: 26px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--bcm-red), var(--bcm-blue)); }
  .bcm-feat__title { font-size: clamp(1.7rem, 3.1vw, 2.7rem); color: var(--bcm-ink); line-height: 1.08; }
  .bcm-feat__meta { font-family: var(--font-sans); font-size: .86rem; color: var(--bcm-muted); display: flex; align-items: center; gap: 10px; }
  .bcm-feat__excerpt { color: var(--bcm-muted); font-size: 1.03rem; }
  .bcm-feat__more { margin-top: auto; display: inline-flex; align-items: center; gap: 9px; font-family: var(--font-sans); font-weight: 700; color: var(--bcm-blue); }
  .bcm-feat__more svg { transition: transform .2s var(--bcm-ease-ui); }
  .bcm-feat:hover .bcm-feat__more svg { transform: translateX(4px); }

  /* Rejilla de entradas */
  .bcm-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }

  /* Tarjeta de entrada */
  .bcm-post-card { position: relative; display: flex; flex-direction: column; background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: 22px; overflow: hidden; box-shadow: var(--bcm-shadow-sm); transition: transform .22s var(--bcm-ease-out), box-shadow .22s var(--bcm-ease-out), border-color .22s; }
  .bcm-post-card:hover { transform: translateY(-6px); box-shadow: 0 24px 44px -24px rgba(16,26,51,.42); border-color: color-mix(in srgb, var(--bcm-blue) 30%, var(--bcm-line)); }
  .bcm-post-card__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: linear-gradient(140deg, var(--bcm-blue-900), var(--bcm-blue)); }
  .bcm-post-card__img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .5s var(--bcm-ease-out); }
  .bcm-post-card:hover .bcm-post-card__img { transform: scale(1.06); }
  .bcm-post-card__ph { position: absolute; inset: 0; display: grid; place-items: center; }
  .bcm-post-card__ph svg { width: 34%; max-width: 84px; height: auto; opacity: .9; filter: drop-shadow(0 10px 20px rgba(0,0,0,.25)); }
  .bcm-post-card__cat { position: absolute; left: 14px; top: 14px; z-index: 2; }
  .bcm-post-card__body { display: flex; flex-direction: column; gap: 9px; padding: 20px 22px 24px; flex: 1; }
  .bcm-post-card__date { font-family: var(--font-sans); font-size: .76rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--bcm-muted); }
  .bcm-post-card__title { font-size: 1.22rem; color: var(--bcm-ink); line-height: 1.24; }
  .bcm-post-card__excerpt { font-size: .93rem; color: var(--bcm-muted); flex: 1; }
  .bcm-post-card__more { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-sans); font-size: .86rem; font-weight: 700; color: var(--bcm-blue); margin-top: 2px; }
  .bcm-post-card__more svg { transition: transform .18s var(--bcm-ease-ui); }
  .bcm-post-card:hover .bcm-post-card__more svg { transform: translateX(4px); }

  /* Paginación */
  .bcm-pagination { margin-top: 48px; }
  .bcm-pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
  .bcm-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 13px; border-radius: 12px; border: 1.5px solid var(--bcm-line); background: var(--bcm-surface); color: var(--bcm-ink); font-family: var(--font-sans); font-weight: 600; transition: border-color .15s, color .15s, transform .15s; }
  .bcm-pagination a.page-numbers:hover { border-color: var(--bcm-blue); color: var(--bcm-blue); transform: translateY(-2px); }
  .bcm-pagination .page-numbers.current { background: var(--bcm-blue); border-color: var(--bcm-blue); color: #fff; }
  .bcm-pagination .page-numbers.dots { border-color: transparent; background: transparent; }

  /* ---- Single (entrada): hero a dos columnas + póster contenido ---- */
  .bcm-single__hero { position: relative; overflow: hidden; background: var(--bcm-surface); border-bottom: 1px solid var(--bcm-line); }
  .bcm-single__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(28px, 5vw, 60px); align-items: center; }
  .bcm-single__head { display: flex; flex-direction: column; align-items: flex-start; }
  .bcm-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-family: var(--font-sans); font-size: .82rem; color: var(--bcm-muted); margin-bottom: 20px; }
  .bcm-crumbs a { color: var(--bcm-muted); }
  .bcm-crumbs a:hover { color: var(--bcm-blue); }
  .bcm-single__title { font-size: clamp(2rem, 4.2vw, 3.1rem); color: var(--bcm-ink); margin-top: 16px; }
  .bcm-single__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; font-family: var(--font-sans); font-size: .9rem; color: var(--bcm-muted); }
  /* Póster CONTENIDO (fin del muro): marco de tamaño humano, imagen completa
     sobre un velo de marca; los carteles verticales ya no desbordan. */
  .bcm-single__cover { width: 100%; max-width: 380px; margin-inline: auto; aspect-ratio: 3 / 4; border-radius: 24px; overflow: hidden; border: 1px solid var(--bcm-line); box-shadow: var(--bcm-shadow); background: linear-gradient(150deg, color-mix(in srgb, var(--bcm-blue) 12%, #fff), var(--bcm-surface)); display: grid; place-items: center; }
  .bcm-single__cover-img { width: 100%; height: 100%; object-fit: contain; padding: 12px; }
  .bcm-single__grid--solo { grid-template-columns: 1fr; max-width: 780px; margin-inline: auto; text-align: center; }
  .bcm-single__grid--solo .bcm-single__head { align-items: center; }
  .bcm-single__grid--solo .bcm-crumbs, .bcm-single__grid--solo .bcm-single__meta, .bcm-single__grid--solo .bcm-share { justify-content: center; }
  .bcm-single__body { max-width: 700px; padding-block: clamp(40px, 5.5vw, 68px); }
  /* Primer párrafo como entradilla: da presencia a las noticias cortas
     (muchas del histórico son una sola frase) y aire editorial. */
  .bcm-single__body .bcm-prose > p:first-of-type { font-size: 1.24rem; line-height: 1.65; color: var(--bcm-ink); }

  /* Compartir — círculos con icono correcto que se tiñen del color de la red */
  .bcm-share { display: flex; align-items: center; gap: 10px; margin-top: 26px; }
  .bcm-share__label { font-family: var(--font-sans); font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bcm-muted); margin-right: 2px; }
  .bcm-share__btn { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--bcm-border-strong); background: var(--bcm-surface); color: var(--bcm-ink); transition: transform .18s var(--bcm-ease-ui), border-color .18s, background .18s, color .18s; }
  .bcm-share__btn svg { width: 18px; height: 18px; fill: currentColor; }
  .bcm-share__btn:hover { transform: translateY(-3px); color: #fff; }
  .bcm-share__btn--wa:hover { background: #25d366; border-color: #25d366; }
  .bcm-share__btn--fb:hover { background: #1877f2; border-color: #1877f2; }
  .bcm-share__btn--x:hover  { background: #101a33; border-color: #101a33; }

  .bcm-single__related { border-top: 1px solid var(--bcm-line); }
  .bcm-single__related .bcm-blog-grid { margin-top: 34px; }

  /* Lightbox: las imágenes del artículo (póster + imágenes del cuerpo) se
     amplían al ancho del cuerpo (no a pantalla completa) para leer horarios,
     cuadrantes o mapas. */
  .bcm-single__cover, .bcm-prose img { cursor: zoom-in; }
  .bcm-lightbox { position: fixed; inset: 0; z-index: 300; display: none; place-items: center; padding: 28px; background: rgba(16,26,51,.86); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); cursor: zoom-out; opacity: 0; transition: opacity .25s var(--bcm-ease-out); }
  .bcm-lightbox.is-open { display: grid; opacity: 1; }
  .bcm-lightbox img { max-width: min(920px, 94vw); max-height: 90vh; width: auto; height: auto; border-radius: 14px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.7); background: #fff; transform: scale(.96); transition: transform .28s var(--bcm-ease-out); }
  .bcm-lightbox.is-open img { transform: scale(1); }
  .bcm-lightbox__close { position: absolute; top: 20px; right: 24px; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.4); background: rgba(255,255,255,.12); color: #fff; display: grid; place-items: center; cursor: pointer; transition: background .15s; }
  .bcm-lightbox__close:hover { background: rgba(255,255,255,.24); }
  .bcm-lightbox__close svg { width: 22px; height: 22px; }
  @media (prefers-reduced-motion: reduce) {
    .bcm-lightbox, .bcm-lightbox img { transition: none; }
    .bcm-lightbox img { transform: none; }
  }

  /* Páginas legales (plantilla page-legal.php) — dos columnas editoriales */
  .bcm-legal { display: grid; grid-template-columns: 250px 1fr; gap: 48px; align-items: start; }
  .bcm-legal__aside { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 22px; }
  .bcm-legal__nav { display: flex; flex-direction: column; gap: 3px; }
  .bcm-legal__navlabel { font-family: var(--font-sans); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--bcm-muted); margin-bottom: 8px; }
  .bcm-legal__nav a { font-family: var(--font-sans); font-size: .95rem; font-weight: 500; color: var(--bcm-ink); padding: 10px 14px; border-radius: 10px; border-left: 2px solid transparent; transition: background .15s, color .15s, border-color .15s; }
  .bcm-legal__nav a:hover { background: var(--bcm-paper); color: var(--bcm-blue); }
  .bcm-legal__nav a.is-active { background: color-mix(in srgb, var(--bcm-blue) 8%, transparent); color: var(--bcm-blue); border-left-color: var(--bcm-red); font-weight: 700; }
  .bcm-legal__dpd { background: var(--bcm-surface); border: 1px solid var(--bcm-line); border-radius: var(--bcm-radius); padding: 20px; box-shadow: var(--bcm-shadow-sm); }
  .bcm-legal__dpd-eyebrow { font-family: var(--font-sans); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bcm-red); }
  .bcm-legal__dpd p { font-size: .9rem; color: var(--bcm-muted); margin: 10px 0 14px; }
  .bcm-legal__dpd strong { display: block; color: var(--bcm-ink); }
  .bcm-legal__dpd a { font-size: .88rem; color: var(--bcm-blue); font-weight: 600; word-break: break-word; }
  .bcm-legal__main { max-width: 720px; }
  .bcm-legal__main .bcm-prose h2 { font-size: 1.4rem; margin-top: 1.9em; }
  .bcm-legal__main .bcm-prose h2:first-child { margin-top: 0; }
  .bcm-legal__meta { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--bcm-line); font-size: .85rem; color: var(--bcm-muted); }
  @media (max-width: 860px) {
    .bcm-legal { grid-template-columns: 1fr; gap: 30px; }
    .bcm-legal__aside { position: static; }
    .bcm-legal__nav { flex-direction: row; flex-wrap: wrap; }
  }

  @media (max-width: 940px) {
    .bcm-blog-grid { grid-template-columns: repeat(2, 1fr); }
    .bcm-feat { grid-template-columns: 1fr; }
    .bcm-feat__media { min-height: 0; aspect-ratio: 16 / 9; }
    .bcm-single__grid { grid-template-columns: 1fr; }
    .bcm-single__cover { order: -1; max-width: 340px; aspect-ratio: 3 / 4; }
    .bcm-single__head { align-items: center; text-align: center; }
    .bcm-crumbs, .bcm-single__meta, .bcm-share { justify-content: center; }
  }
  @media (max-width: 560px) {
    .bcm-blog-grid { grid-template-columns: 1fr; }
  }

  /* ============================================================
     Adaptador Elementor (build WP, S2b) — neutraliza interferencias
     del maquetador sobre el contrato visual. Verificado en vivo:
     medidas pixel-perfect contra el tag demo-v-final-2.
     ============================================================ */
  /* El kit de Elementor/Hello impone «Roboto» al texto de los widgets;
     aquí manda la sans del contrato (doble selector por especificidad). */
  .elementor-widget-text-editor,
  [class*="elementor-kit-"] .elementor-widget-text-editor { font-family: var(--font-sans); }
  /* Los wrappers de widget son position:relative; las capas decorativas
     con inset:0 (p. ej. .bcm-hero__bg) deben anclarse a su SECCIÓN.
     El generador marca esos widgets con la clase bcm-fondo. */
  .elementor-widget.bcm-fondo { position: static; }
  /* Equivalente del style="padding-top:0" de 3 secciones del prototipo
     (el control de padding parcial de Elementor no emite clamp()). */
  .e-con.bcm-pt0 { padding-top: 0; }
  /* Defaults globales del kit medidos en vivo: 10px de padding y 20px de
     gap en cada contenedor. Se anulan por VARIABLE (no por propiedad) para
     no pisar ni los paddings/gaps de las clases bcm- ni los ajustes por
     elemento del post-CSS (más específicos). El espaciado del diseño lo
     dan las clases del contrato, nunca el kit. */
  .e-con {
    --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
    --widgets-spacing: 0px 0px; --widgets-spacing-row: 0px; --widgets-spacing-column: 0px;
  }
  /* .e-con impone flex-direction:column por variable; estas filas del
     prototipo confiaban en el `row` por defecto de un <div>. */
  .e-con.bcm-trust__row, .e-con.bcm-offer__head, .e-con.bcm-testbanner { flex-direction: row; }
  /* Hello estila <button> (padding 8px 16px); estos botones del prototipo
     usaban el default del navegador. */
  .bcm-chat__close, .bcm-chat__send, .bcm-chat__teaser-close, .bcm-burger { padding: 1px 6px; }
  /* reset.css de Hello pone button:hover/focus{background:#cc3366 (rosa)}: se
     blindan los botones-icono de marca que no fijan su propio fondo en hover. */
  .bcm-chat__fab:hover, .bcm-chat__fab:focus { background: #fff; }
  .bcm-burger:hover, .bcm-burger:focus { background: #fff; color: var(--bcm-ink); }
  .bcm-chat__teaser-close:hover, .bcm-chat__teaser-close:focus { background: transparent; color: var(--bcm-blue); }