/* =============================================
   COOKIE / MARKETING CONSENT BANNER — The Blades Studio
   01/10/2026: da striscia in alto a SCHEDA DI VETRO che galleggia in basso.

   Il proprietario, dal suo telefono: «prende troppo spazio, non voglio che
   abbassi il sito, deve essere facile da togliere, e deve invogliare i clienti
   ad accettare». Prima era una striscia nel flusso, sotto l'intestazione fissa
   (margin-top = --header-height): a 390 px era alta 247 px e spingeva giù
   tutta la pagina di 311 px. Ora è `position: fixed`: la pagina non si sposta
   di un pixel (misurato: il primo elemento sotto l'intestazione sta alla stessa
   quota con e senza scheda).

   LE BARRE IN BASSO (.mbar del tema, .jr-sticky di /junior): finché la scheda
   è aperta SI NASCONDONO, con la loro stessa uscita (translateY + opacity).
   Scelta contro l'alternativa «la scheda sta sopra di loro»: impilate, scheda
   + barra coprivano ~230 px di un telefono da 844 e mettevano due strati di
   vetro sfocato uno sopra l'altro (il costo più caro su mobile). La scheda ha
   già il suo pulsante rosso: un tocco, e le barre tornano da sole.
   Lo fa `:has()` (lo stesso strumento che il tema usa già per .jr-sticky in
   style.css), senza JavaScript. Su un browser senza `:has()` le barre restano
   e la scheda, con z-index più alto, le copre finché non si sceglie: nessun
   pulsante della scheda resta muto.

   REGOLA DI LEGGE (GDPR, linee guida EDPB sui dark pattern): rifiutare costa
   quanto accettare. «Отказвам» sta sulla STESSA riga di «Приемам», alto uguale
   (48 px), con testo bianco leggibile: è secondario nel colore, non nascosto.
   03/10 (testo v4, «invoglia di più»): la spinta sta tutta nelle PAROLE vere (offerte
   secondo i tuoi interessi, offerte migliori) e nel COLORE; la geometria resta pari.
   «Отказвам» non perde niente: stessa riga, stessa altezza, stesso tocco, nessun
   secondo passaggio per rifiutare.
   ============================================= */

#bo-consent-banner {
  --bo-cb-ease: cubic-bezier(.16, 1, .3, 1);
  position: fixed;
  z-index: 9999;   /* sotto menu (10000) e intestazione (10001): style.css:176/315 */
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom));
  margin: 0 auto;
  max-width: 760px;
  /* col pannello «Настройки» aperto la scheda cresce, ma non oltre lo schermo
     sotto l'intestazione: dentro si scorre. */
  max-height: calc(100vh - var(--header-height, 70px) - 24px - env(safe-area-inset-bottom));
  max-height: calc(100dvh - var(--header-height, 70px) - 24px - env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
  box-sizing: border-box;
  --bo-cb-pl: 16px;
  --bo-cb-pr: 14px;
  --bo-cb-pb: 12px;
  padding: 12px var(--bo-cb-pr) var(--bo-cb-pb) var(--bo-cb-pl);
  border-radius: 14px;
  color: #fff;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  /* Vetro: UN solo strato sfocato a schermo (le barre in basso sono via). */
  background:
    radial-gradient(120% 140% at 100% 100%, rgba(176, 17, 30, .22), transparent 60%),
    rgba(16, 16, 16, .84);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, .12);
  box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .06);
  /* Entrata morbida: solo transform e opacity. */
  animation: bo-cb-entra .7s var(--bo-cb-ease) .15s both;
}
@keyframes bo-cb-entra {
  from { opacity: 0; transform: translate3d(0, 28px, 0) scale(.98); }
  to   { opacity: 1; transform: none; }
}

/* Ripiego su superficie piena: senza backdrop-filter il testo resterebbe sopra
   la foto quasi trasparente; con «riduci trasparenza» lo chiede la persona. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #bo-consent-banner { background: rgba(18, 18, 18, .97); }
}
@media (prefers-reduced-transparency: reduce) {
  #bo-consent-banner { background: #121212; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

#bo-consent-banner.bo-hidden { display: none; }

/* 01/10/2026 (Safari vero): fra la scheda e il fondo dello schermo restavano 12 px di pagina, e da
   lì spuntava il pulsante rosso della pagina, come un doppione. Sul telefono la scheda si attacca
   al fondo (angoli solo in alto); il margine di sicurezza dell'iPhone diventa spazio interno. */
@media (max-width: 640px) {
  #bo-consent-banner {
    left: 0; right: 0; bottom: 0;
    border-radius: 18px 18px 0 0;
    border-bottom: 0;
    --bo-cb-pb: calc(12px + env(safe-area-inset-bottom));
  }
}

/* Finché la scheda è aperta, le barre in basso fanno un passo indietro. */
body:has(#bo-consent-banner:not(.bo-hidden)) .mbar,
body:has(#bo-consent-banner:not(.bo-hidden)) .jr-sticky {
  transform: translateY(calc(100% + 24px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

#bo-consent-banner .bo-cb-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "head" "msg" "perks" "prefs" "piede";
  row-gap: 3px;
}

/* ── 03/10 (spazzata, M4): IL PIEDE FISSO. «Запази избора», «Отказвам» e «Приемам»
   stanno in fondo alla scheda anche quando le preferenze aperte la fanno scorrere
   (a 320×568 finivano a 560–663 px su 568, raggiungibili solo scorrendo DENTRO la
   scheda e senza nessun segno). `sticky` dentro la scheda che scorre: l'elenco passa
   SOTTO il piede. I margini negativi lo allargano fino ai bordi della scheda, così il
   fondo pieno copre davvero ciò che scorre sotto. Senza preferenze aperte la scheda
   non scorre mai e il piede sta al suo posto naturale: identico a prima. */
#bo-consent-banner .bo-cb-piede {
  grid-area: piede;
  position: sticky;
  bottom: 0;   /* il margine negativo qui sotto porta già il suo bordo sul fondo della scheda */
  z-index: 1;
  margin: 0 calc(-1 * var(--bo-cb-pr)) calc(-1 * var(--bo-cb-pb)) calc(-1 * var(--bo-cb-pl));
  padding: 0 var(--bo-cb-pr) var(--bo-cb-pb) var(--bo-cb-pl);
}
#bo-consent-banner.bo-cb-scorre .bo-cb-piede {
  background: rgba(16, 16, 16, .97);
  border-top: 1px solid rgba(255, 255, 255, .1);
}
/* il segno che sopra c'è ancora da leggere: una sfumatura che sale dal piede */
#bo-consent-banner.bo-cb-scorre .bo-cb-piede::before {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 100%;
  height: 28px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(16, 16, 16, 0), rgba(16, 16, 16, .9));
}
#bo-consent-banner .bo-cb-prefs-actions[hidden] { display: none; }

#bo-consent-banner .bo-cb-head {
  grid-area: head;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

#bo-consent-banner .bo-cb-title {
  margin: 0;
  min-width: 0;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 19px;
  line-height: 1.1;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: #fff;
}
/* il tratto rosso che apre le etichette (stile-lusso.md §1 «Linee») */
#bo-consent-banner .bo-cb-title::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 2px;
  margin: 0 8px 0 0;
  vertical-align: .32em;
  background: var(--accent-red-testo, #fb3d48);
}

#bo-consent-banner .bo-cb-msg {
  grid-area: msg;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
  color: rgba(255, 255, 255, .76);
}

/* ── 03/10: I DUE VANTAGGI con la spunta, sotto la frase. Su una riga sola da 320 px in
   su (misurato in _banner-03-10/prova-testo.mjs); se una lingua futura è più lunga vanno a
   capo da soli, mai fuori dalla scheda. La spunta è un disegno, il testo è bianco all'86%. */
#bo-consent-banner .bo-cb-perks,
#bo-consent-banner .bo-cb-row-perks {
  list-style: none;
  margin: 0;
  padding: 0;
}
#bo-consent-banner .bo-cb-perks {
  grid-area: perks;
  display: flex;
  flex-wrap: wrap;
  gap: 2px 14px;
  margin-top: 3px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: rgba(255, 255, 255, .86);
}
#bo-consent-banner .bo-cb-perks:empty,
#bo-consent-banner .bo-cb-row-perks:empty { display: none; }
#bo-consent-banner .bo-cb-perks li,
#bo-consent-banner .bo-cb-row-perks li {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
}
#bo-consent-banner .bo-cb-perks li::before,
#bo-consent-banner .bo-cb-row-perks li::before {
  content: '';
  flex: none;
  width: 13px;
  height: 13px;
  margin-top: .1em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fb3d48' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
#bo-consent-banner .bo-cb-row-perks {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 2px 0 3px;
  font-size: 12.5px;
  line-height: 1.4;
  color: rgba(255, 255, 255, .9);
}
#bo-consent-banner .bo-cb-row-perks li::before { margin-top: .2em; }

#bo-consent-banner button {
  font-family: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* ── I due pulsanti: stessa riga, stessa altezza, un tocco ciascuno. ── */
#bo-consent-banner .bo-cb-actions {
  grid-area: actions;
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

#bo-consent-banner .bo-cb-accept,
#bo-consent-banner .bo-cb-reject {
  min-height: 48px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: transform .5s var(--bo-cb-ease);
}
#bo-consent-banner .bo-cb-accept:active,
#bo-consent-banner .bo-cb-reject:active { transform: scale(.975); }
#bo-consent-banner .bo-cb-accept:focus-visible,
#bo-consent-banner .bo-cb-reject:focus-visible,
#bo-consent-banner .bo-cb-customize:focus-visible,
#bo-consent-banner .bo-cb-save:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* «Отказвам»: contorno, testo bianco pieno — secondario, mai muto. */
#bo-consent-banner .bo-cb-reject {
  flex: 1 1 0;
  min-width: 0;
  padding: 0 14px;
  background: rgba(255, 255, 255, .04);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .34);
}
#bo-consent-banner .bo-cb-reject:hover { background: rgba(255, 255, 255, .1); }

/* «Приемам»: il pulsante dello studio (.bs-cta di style.css) — pillola rossa,
   cerchio bianco con la freccia, riflesso che passa. Più largo del rifiuto. */
#bo-consent-banner .bo-cb-accept {
  flex: 1.55 1 0;
  min-width: 0;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 4px 4px 20px;
  border: 0;
  color: #fff;
  background: linear-gradient(180deg, #c3131f 0%, var(--accent-red, #B0111E) 55%, #a00f1b 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 18px 36px -18px rgba(176, 17, 30, .95);
}
/* 03/10: «Приемам» e, sotto, piccolo e in chiaro, ciò che succede: «покажи ми офертите».
   Il sottotitolo non è maiuscolo e non è spaziato, così sta nel pulsante anche a 320 px. */
#bo-consent-banner .bo-cb-accept-txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  text-align: left;
}
#bo-consent-banner .bo-cb-accept-sub {
  margin-top: 2px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: .01em;
  text-transform: none;
  color: rgba(255, 255, 255, .92);
}
#bo-consent-banner .bo-cb-accept-sub[hidden] { display: none; }
#bo-consent-banner .bo-cb-accept::before {
  content: '';
  order: 2;
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B0111E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 17px no-repeat;
  transition: transform .5s var(--bo-cb-ease);
}
#bo-consent-banner .bo-cb-accept:hover::before { transform: translateX(2px); }
#bo-consent-banner .bo-cb-accept::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 40%;
  z-index: -1;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .2), transparent);
  transform: translateX(-130%) skewX(-18deg);
  animation: bo-cb-riflesso 6s ease-in-out 4s infinite;   /* 03/10: dopo il richiamo qui sotto, non insieme */
}
@keyframes bo-cb-riflesso {
  0% { transform: translateX(-130%) skewX(-18deg); }
  22%, 100% { transform: translateX(340%) skewX(-18deg); }
}

/* ═══════════════════════════════════════════════════════════════════════
   03/10 — IL RICHIAMO, UNA VOLTA SOLA. Finita l'entrata della scheda (0,15 s + 0,7 s):
     · una luce attraversa il vetro da sinistra a destra (1,1 s);
     · «Приемам» si gonfia appena e torna (scala 1 → 1,045 → 1), la freccia fa un passo.
   Poi più niente (il riflesso del pulsante riparte da solo ogni 6 s, come sui pulsanti del
   sito). Solo transform e opacity; con «riduci movimento» non parte nulla (in fondo).
   Le animazioni non hanno `fill`: prima e dopo il pulsante è quello di sempre, e :active
   (scale .975) resta suo.
   ═══════════════════════════════════════════════════════════════════════ */
#bo-consent-banner .bo-cb-luce {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none;
}
#bo-consent-banner .bo-cb-luce::before {
  content: '';
  position: absolute;
  top: -20%; bottom: -20%; left: 0;
  width: 45%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .12), transparent);
  opacity: 0;
  transform: translateX(-120%) skewX(-18deg);
  animation: bo-cb-luce 1.1s ease-in-out .95s;
}
@keyframes bo-cb-luce {
  0%   { opacity: 0; transform: translateX(-120%) skewX(-18deg); }
  15%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { opacity: 0; transform: translateX(330%) skewX(-18deg); }
}
#bo-consent-banner .bo-cb-accept { animation: bo-cb-invito .8s ease-in-out 1.05s; }
@keyframes bo-cb-invito {
  0%, 100% { transform: scale(1); }
  40%      { transform: scale(1.045); }
  70%      { transform: scale(.99); }
}
#bo-consent-banner .bo-cb-accept::before { animation: bo-cb-passo 1s ease-in-out 1.1s; }
@keyframes bo-cb-passo {
  0%, 100% { transform: none; }
  25%      { transform: translateX(4px); }
  50%      { transform: none; }
  75%      { transform: translateX(3px); }
}

/* «Настройки»: un link testuale piccolo accanto al titolo. Il bersaglio del
   dito è ≥ 44 px senza alzare la riga (collaudo 04/10, M2): la SCATOLA stessa è alta 45 px
   (padding 15 px sopra e sotto), e il margine negativo uguale la riporta alla misura del testo
   per l'impaginazione. Prima lo faceva uno strato ::after: il dito lo prendeva, ma chi misura la
   scatola (prove, audit) leggeva 15 px. Il testo non cambia di un pixel. */
#bo-consent-banner .bo-cb-customize {
  position: relative;
  flex: none;
  white-space: nowrap;   /* 01/10: il testo (75 px) usciva da una scatola di 65 */
  padding: 15px 10px;
  margin: -15px -10px;
  border: 0;
  background: none;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, .72);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255, 255, 255, .35);
}
#bo-consent-banner .bo-cb-customize:hover,
#bo-consent-banner .bo-cb-customize[aria-expanded="true"] { color: #fff; }

/* ═══════════════════════════════════════════════════════════════════════
   IL PANNELLO «НАСТРОЙКИ» — si apre dentro la scheda, fra testo e pulsanti:
   «Приемам» e «Отказвам» restano dove sono.
   ═══════════════════════════════════════════════════════════════════════ */

#bo-consent-banner .bo-cb-prefs {
  grid-area: prefs;
  border-top: 1px solid rgba(255, 255, 255, .12);
  margin-top: 8px;
  padding-top: 10px;
}
#bo-consent-banner .bo-cb-prefs[hidden] { display: none; }

#bo-consent-banner .bo-cb-prefs-title {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .72);
}

#bo-consent-banner .bo-cb-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
}
#bo-consent-banner .bo-cb-row-click { cursor: pointer; }
#bo-consent-banner .bo-cb-row-txt {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
#bo-consent-banner .bo-cb-row-title {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
}
#bo-consent-banner .bo-cb-row-desc {
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255, 255, 255, .68);
}
/* I necessari NON sono un interruttore spento a forza: sono una scritta.
   Un interruttore che non si può muovere fa credere di poter scegliere. */
#bo-consent-banner .bo-cb-always {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, .6);
  white-space: nowrap;
  padding-top: 2px;
}
#bo-consent-banner .bo-cb-switch {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  accent-color: var(--accent-red, #B0111E);
  cursor: pointer;
  margin-top: 1px;
}

#bo-consent-banner .bo-cb-prefs-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
}
#bo-consent-banner .bo-cb-privacy {
  /* bersaglio del dito ≥ 44 px (prima 19 px di altezza): la riga è già alta 44 per «Запази» */
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 12px;
  color: rgba(255, 255, 255, .68);
  text-decoration: underline;
  text-underline-offset: 3px;
}
#bo-consent-banner .bo-cb-privacy:hover { color: #fff; }
#bo-consent-banner .bo-cb-save {
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .34);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;   /* 03/10: a 320 «Запази избора» andava su due righe; va a capo il link accanto */
  flex: none;
}

/* ── Computer e tablet: la stessa scheda, ancorata in basso a SINISTRA e larga
   al massimo 520 px. Al centro copriva i pulsanti dell'hero («Запази час»),
   che su schermo largo stanno nella colonna di destra: a sinistra c'è la foto. ── */
@media (min-width: 768px) {
  #bo-consent-banner {
    left: 24px;
    right: auto;
    bottom: calc(24px + env(safe-area-inset-bottom));
    width: min(520px, calc(100% - 48px));
    max-width: none;
    --bo-cb-pl: 20px;
    --bo-cb-pr: 16px;
    --bo-cb-pb: 16px;
    padding: 16px var(--bo-cb-pr) var(--bo-cb-pb) var(--bo-cb-pl);
  }
  #bo-consent-banner .bo-cb-title { font-size: 21px; }
  #bo-consent-banner .bo-cb-msg { font-size: 13px; }
  #bo-consent-banner .bo-cb-actions { margin-top: 10px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   03/10 (spazzata, A1) — DOVE GALLEGGIA LA SCHEDA. La sceglie consent-banner.js
   (scegliPosto) misurando il primo pulsante di prenotazione della pagina: se la
   scheda nel suo posto di sempre lo tocca, prova
     .bo-cb-destra — computer e tablet: in basso a DESTRA (su /junior/, /brada/ e
                     /podstrigvane/ il pulsante dell'hero sta a sinistra);
     .bo-cb-alto   — appena sotto l'intestazione (--bo-cb-top, misurata): sul
                     telefono copre per un momento la foto o le briciole di pane.
   La pagina non si muove: cambia solo il punto in cui la scheda è fissata.
   Entrata dall'alto invece che dal basso, sempre e solo transform + opacity.
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 768px) {
  #bo-consent-banner.bo-cb-destra { left: auto; right: 24px; }
}
#bo-consent-banner.bo-cb-alto {
  top: calc(var(--bo-cb-top, 70px) + 12px);
  bottom: auto;
  max-height: calc(100vh - var(--bo-cb-top, 70px) - 24px);
  max-height: calc(100dvh - var(--bo-cb-top, 70px) - 24px);
  animation-name: bo-cb-entra-alto;
}
@keyframes bo-cb-entra-alto {
  from { opacity: 0; transform: translate3d(0, -20px, 0) scale(.98); }
  to   { opacity: 1; transform: none; }
}
@media (max-width: 640px) {
  #bo-consent-banner.bo-cb-alto {
    top: var(--bo-cb-top, 64px);
    border-radius: 0 0 18px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    border-top: 0;
    --bo-cb-pb: 12px;
    max-height: calc(100vh - var(--bo-cb-top, 64px) - 12px);
    max-height: calc(100dvh - var(--bo-cb-top, 64px) - 12px);
  }
}
@media (min-width: 768px) {
  #bo-consent-banner.bo-cb-alto { top: calc(var(--bo-cb-top, 70px) + 16px); }
}

/* 360–374 px (Android piccoli): il titolo resta su una riga. */
@media (max-width: 374px) {
  #bo-consent-banner .bo-cb-title { font-size: 17px; }
  #bo-consent-banner .bo-cb-title::before { display: none; }
  #bo-consent-banner .bo-cb-msg { font-size: 12px; }
  #bo-consent-banner .bo-cb-perks { gap: 2px 10px; font-size: 12px; }
}
@media (max-width: 359px) {
  #bo-consent-banner .bo-cb-accept,
  #bo-consent-banner .bo-cb-reject { letter-spacing: .06em; }
  #bo-consent-banner .bo-cb-accept { padding-left: 14px; gap: 6px; }
  /* 03/10: a 320 il cerchio della freccia e il sottotitolo cedono qualche pixel: con 40 px e 10,5 px
     «офертите» finiva sotto il cerchio (_banner-03-10/prova-testo.mjs, controllo «cerchio») */
  #bo-consent-banner .bo-cb-accept::before { width: 32px; height: 32px; background-size: 14px; }
  #bo-consent-banner .bo-cb-accept-sub { font-size: 12px; letter-spacing: 0; }
}

@media (prefers-reduced-motion: reduce) {
  #bo-consent-banner { animation: none; }
  #bo-consent-banner .bo-cb-accept::after { animation: none; display: none; }
  #bo-consent-banner .bo-cb-luce { display: none; }
  #bo-consent-banner .bo-cb-accept,
  #bo-consent-banner .bo-cb-accept::before { animation: none; }
  #bo-consent-banner .bo-cb-accept,
  #bo-consent-banner .bo-cb-reject,
  #bo-consent-banner .bo-cb-accept::before { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   LA PASTIGLIA «БИСКВИТКИ» — invariata. Compare solo DOPO una scelta (la
   scheda è già chiusa) e solo col piè di pagina in vista: con la scheda non
   si incontra mai. Riaprendo la scelta dalla pastiglia, lei si toglie.
   ═══════════════════════════════════════════════════════════════════════ */
#bo-consent-reopen {
  position: fixed;
  left: 12px;
  bottom: 12px;
  /* Il flusso di prenotazione (assets/app.js, non casa nostra) mette in fondo
     una barra prezzo/CTA con z-index 2147483001 (app.css:1350) larga tutto lo
     schermo: se restassimo sotto, la pastiglia sarebbe lì ma MUTA — coperta e
     non toccabile. Il resto (non rubare un tocco a uno slot) lo fa
     consent-banner.js con elementFromPoint, aggiungendo .bo-cb-occluso. */
  z-index: 2147483647;
  background: rgba(22, 22, 26, 0.92);
  color: #c7c7cc;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  font-size: 12px;
  padding: 7px 14px;
  cursor: pointer;
  display: none;
}
#bo-consent-reopen.bo-visible { display: inline-block; }
/* `visibility` e non `display`: il box resta misurabile (vedi consent-banner.js). */
#bo-consent-reopen.bo-visible.bo-cb-occluso { visibility: hidden; }

/* 27/09 — su /junior la pastiglia sale sopra la barra fissa del telefono. */
@media (max-width: 640px) {
  body:has(.jr-sticky) #bo-consent-reopen { bottom: calc(88px + env(safe-area-inset-bottom)); }
}

/* 28/09 — 44 px per il dito; la pastiglia compare solo col piè di pagina in vista
   (classe messa da consent-banner.js). */
#bo-consent-reopen { min-height: 44px; padding-top: 0; padding-bottom: 0; }
#bo-consent-reopen.bo-visible { opacity: 0; pointer-events: none; transition: opacity .2s ease; }
body.bo-piede-in-vista #bo-consent-reopen.bo-visible { opacity: 1; pointer-events: auto; }
/* 01/10/2026 (Safari vero): la pastiglia copriva metà del titolo «Следващото ви подстригване»
   e senza un carattere suo usava quello di sistema (cirillico corsivo). Dove il piè di pagina ha
   già «Настройки за бисквитки» (footer.php, data-bo-cookie-settings) la pastiglia è un DOPPIONE:
   si toglie dalla vista ma resta nel DOM, perché quel link la clicca (main.js initCookieSettings). */
#bo-consent-reopen { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
body:has([data-bo-cookie-settings]) #bo-consent-reopen.bo-visible { display: none; }