/* Palette e interazione ToBePolo. Unico punto per i token. */
/* Ordine dei livelli (30/9, D122): tbp-caratteri subito dopo la geometria delle icone.
   Le regole !important di un livello vincono su quelle senza livello e sui livelli
   dichiarati dopo (tbp-appearance compreso): cosi' caratteri e scala valgono ovunque
   senza gare di specificita'. Il contenuto del livello sta in tbp-caratteri.css. */
@layer tbp-icon-geometry, tbp-caratteri;
:root {
  --tbp-green: #084828;
  --tbp-green-dark: #06381F;
  --tbp-red: #D0161A;
  --tbp-red-dark: #A91E2A;
  --tbp-white: #ffffff;
  --tbp-ivory: #F7F4ED;
  --tbp-sage: #F4F7F5;
  --tbp-ink: #123326;
  --tbp-muted: #5D786B;
  --tbp-line: rgba(8, 72, 40, .14);
  --tbp-gold: #C9A227;
  --tbp-gold-dark: #9D7B18;
  --tbp-gold-ink: #4A3500;
  --tbp-blue-verified: #2F80ED;
  --tbp-garda: #3A7A9A;
  /* Caratteri e scala (D122, 30/9). Testi, bottoni e campi: Schibsted Grotesk.
     Titoli e prezzi: Figtree (dal 1/10, prima Bricolage). Le riserve «TBP Riserva» sono Arial
     tarata sulle misure dei caratteri veri: niente salti mentre arrivano.
     Scala: 12 nota · 14 secondario · 16 testo · 20 titolo di sezione ·
     26 titolo di pagina. In rem: da 1024 px la radice e' 17,5 px e tutto sale. */
  --tbp-font: "Schibsted Grotesk", "TBP Riserva", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --tbp-font-titoli: "Figtree", "TBP Riserva Titoli", "Schibsted Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --tbp-testo-nota: .75rem;
  --tbp-testo-piccolo: .875rem;
  --tbp-testo: 1rem;
  --tbp-titolo-sezione: 1.25rem;
  --tbp-titolo-pagina: 1.625rem;
  --tbp-interlinea: 1.5;
  --tbp-interlinea-titoli: 1.2;
  /* Sfondo di pagina: tricolore orizzontale con le tinte del logo ufficiale,
     leggero. Verde e rosso hanno la stessa larghezza (0-42% e 58-100%), il
     bianco al centro e' una fascia morbida. Molte tappe con curva dolce:
     niente bande nette, soprattutto sul telefono dove lo schermo e' stretto.
     Il verde resta un filo piu' presente perche' e' il colore del marchio. */
  --tbp-flag-wash:
    linear-gradient(90deg,
      rgba(20, 110, 64, 0.34) 0%,
      rgba(20, 110, 64, 0.30) 8%,
      rgba(20, 110, 64, 0.24) 16%,
      rgba(20, 110, 64, 0.17) 24%,
      rgba(20, 110, 64, 0.10) 31%,
      rgba(20, 110, 64, 0.05) 36%,
      rgba(20, 110, 64, 0.018) 40%,
      rgba(20, 110, 64, 0) 43%,
      rgba(208, 22, 26, 0) 57%,
      rgba(208, 22, 26, 0.012) 60%,
      rgba(208, 22, 26, 0.035) 64%,
      rgba(208, 22, 26, 0.07) 69%,
      rgba(208, 22, 26, 0.11) 76%,
      rgba(208, 22, 26, 0.145) 84%,
      rgba(208, 22, 26, 0.17) 92%,
      rgba(208, 22, 26, 0.185) 100%),
    linear-gradient(180deg, #ffffff 0%, #fffdf9 100%);
  --tbp-text: #084828;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --tbp-radius: 16px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --tbp-radius-card: 22px;
  --tbp-radius-pill: 999px;
  --radius-pill: 999px;
  /* Content/Lava icon standard, measured from Mestiere in Cerca. */
  --tbp-icon: 48px;
  --ease-standard: cubic-bezier(.22, 1, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --duration-fast: 160ms;
  --duration-base: 240ms;
  --duration-slow: 380ms;
}

/* Authoritative icon geometry. Important declarations in this named layer
   precede legacy unlayered component sizes, without selector escalation.
   Brand logos, avatars, media and small interface glyphs are not Lava icons. */
@layer tbp-icon-geometry {
  html body .tbp-lava-icon {
    width: var(--tbp-icon) !important;
    height: var(--tbp-icon) !important;
    min-width: var(--tbp-icon) !important;
    min-height: var(--tbp-icon) !important;
    max-width: var(--tbp-icon) !important;
    max-height: var(--tbp-icon) !important;
    flex: 0 0 var(--tbp-icon) !important;
    object-fit: contain !important;
  }
  html body .tbp-lava-icon > svg {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
}

/* Current conversion palette. Auth pages retain their frozen root palette. */
body:not(.login):not(.registrazione) {
  --tbp-gold: #C9A227;
  --tbp-gold-dark: #9D7B18;
  --tbp-cta-gold: linear-gradient(135deg, #F0BE00 0%, #A8821C 100%);
  /* Scritte bianche sui CTA oro (scelta di Elind): oro leggermente più profondo + ombra bronzea per la leggibilità. */
  --tbp-gold-label: #052b18; /* D71, 23/9: testo verde sull'oro, prima bianco (13/9). 30/9 (CEO): #052b18, 5,0:1 anche sul lato scuro dell'oro (prima #084828, 3,6:1) */
  --tbp-gold-label-shadow: none;
  --tbp-cta-light: radial-gradient(ellipse at 30% 30%, rgba(255, 250, 221, .5) 0%, rgba(255, 245, 186, .22) 32%, rgba(255, 211, 0, 0) 68%), radial-gradient(ellipse at 15% 30%, rgba(255, 211, 0, .5) 0%, rgba(255, 211, 0, .24) 38%, rgba(255, 211, 0, 0) 72%), radial-gradient(ellipse at 85% 70%, rgba(201, 162, 39, .45) 0%, rgba(201, 162, 39, .22) 38%, rgba(201, 162, 39, 0) 72%);
  --tbp-cta-animation: tbp-liquid-gold 2.1s cubic-bezier(.45, 0, .55, 1) infinite;
  --tbp-register-cta: var(--tbp-cta-gold);
  --tbp-register-hover: var(--tbp-cta-gold);
  --tbp-register-border: transparent;
  --tbp-register-ink: var(--tbp-gold-label);
  --tbp-register-overflow: hidden;
  --tbp-register-light-width: 100%;
  --tbp-register-lens-animation: none;
  --tbp-control-hover-transform: none;
  --tbp-control-hover-bg: #06381F;
  --tbp-control-transition: background-color 160ms var(--ease-standard), border-color 160ms var(--ease-standard), color 160ms var(--ease-standard);
  --tbp-focus-color: #084828;
}

html body :where(a, button, [type="button"], [type="submit"], .button, .bottone) {
  -webkit-tap-highlight-color: transparent;
}

/* Design system bottoni — non tocca login/registrazione (auth freeze). */
html body:not(.login):not(.registrazione) .tbp-btn,
html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) :is(
  a.button,
  button.button,
  .woocommerce-Button,
  .woocommerce-button,
  .checkout-button,
  #place_order,
  .tbp-home-feed__btn,
  .tbp-plus-sheet__btn,
  .tbp-filter-reset,
  .tbp-map-search-area-btn,
  .single-esperienze .field-type-submit-field button
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 48px;
  min-width: 44px;
  padding: 12px 20px;
  border-radius: var(--radius-md);
  border: 1px solid var(--tbp-green);
  background: var(--tbp-green);
  color: var(--tbp-white);
  font-weight: 700;
  letter-spacing: -0.02em;
  text-decoration: none;
  box-shadow: none;
  cursor: pointer;
  transition:
    background-color var(--duration-fast) var(--ease-standard),
    border-color var(--duration-fast) var(--ease-standard),
    color var(--duration-fast) var(--ease-standard),
    transform var(--duration-fast) var(--ease-standard),
    opacity var(--duration-fast) var(--ease-standard);
}

html body:not(.login):not(.registrazione) .tbp-btn--secondary,
html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) :is(
  .tbp-filter-reset,
  a.button.alt,
  .woocommerce-Button--secondary
) {
  background: var(--tbp-white);
  color: var(--tbp-green);
  border-color: var(--tbp-line);
}

html body:not(.login):not(.registrazione) .tbp-btn--premium,
html body:not(.login):not(.registrazione) .tbp-flow-next,
html body:not(.login):not(.registrazione) .checkout-button,
html body:not(.login):not(.registrazione) #place_order,
html body:not(.login):not(.registrazione) .tbp-plus-sheet__btn--gold,
html body:not(.login):not(.registrazione) .tbp-exp-book-cta,
html body:not(.login):not(.registrazione) .tbp-exp-card__buy,
html body:not(.login):not(.registrazione) .tbp-exp-sticky-buy a,
html body:not(.login):not(.registrazione) .tbp-exp-sticky-buy button,
html body:not(.login):not(.registrazione) .single-esperienze .field-type-submit-field > button,
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__next-page,
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__submit {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  contain: paint !important;
  background: var(--tbp-cta-gold, var(--tbp-gold)) !important;
  color: var(--tbp-gold-label, #fff) !important;
  text-shadow: var(--tbp-gold-label-shadow, none) !important;
  -webkit-text-stroke: 0.5px rgba(6, 56, 31, 0.75);
  paint-order: stroke fill;
  border: 0 !important;
  border-radius: var(--radius-md, 16px) !important;
}

/* Registration keeps its component radius while clipping the same CTA ambience. */
html body:not(.login):not(.registrazione) .login-registrazione a.registrazione {
  position: relative;
  overflow: hidden !important;
  isolation: isolate;
  contain: paint;
}

/* Ambient light stays inside the gold CTA only. Never on form, card, or page. */
html body:not(.login):not(.registrazione) .tbp-btn--premium::after,
html body:not(.login):not(.registrazione) .tbp-flow-next::after,
html body:not(.login):not(.registrazione) .checkout-button::after,
html body:not(.login):not(.registrazione) #place_order::after,
html body:not(.login):not(.registrazione) a.tbp-become-pro-card__inner::after,
html body:not(.login):not(.registrazione) .login-registrazione a.registrazione::after,
html body:not(.login):not(.registrazione) .tbp-plus-sheet__btn--gold::after,
html body:not(.login):not(.registrazione) .tbp-exp-book-cta::after,
html body:not(.login):not(.registrazione) .tbp-exp-card__buy::after,
html body:not(.login):not(.registrazione) .tbp-exp-sticky-buy a::after,
html body:not(.login):not(.registrazione) .tbp-exp-sticky-buy button::after,
html body:not(.login):not(.registrazione) .single-esperienze .field-type-submit-field > button::after,
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__next-page::after,
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__submit::after {
  content: "";
  position: absolute;
  top: -45%;
  bottom: -45%;
  left: -45%;
  right: -45%;
  width: auto;
  border-radius: inherit;
  background: var(--tbp-cta-light);
  animation: var(--tbp-cta-animation);
  pointer-events: none;
  z-index: -1;
}

/* Broad, soft gold currents loop without a reset; only their layer moves. */
@keyframes tbp-liquid-gold {
  0%, 100% { transform: translate(-12%, -5%) rotate(-8deg) scale(1.35); opacity: .82; }
  33% { transform: translate(10%, 6%) rotate(7deg) scale(1.45); opacity: 1; }
  66% { transform: translate(2%, -8%) rotate(-3deg) scale(1.4); opacity: .9; }
}

html body :is(:disabled, [aria-disabled="true"], [aria-busy="true"], .is-loading, .loading, .processing) {
  --tbp-cta-animation: none;
}

html body:not(.login):not(.registrazione) .tbp-btn--danger {
  background: var(--tbp-red);
  color: var(--tbp-white);
  border-color: var(--tbp-red);
}

html body:not(.login):not(.registrazione) .tbp-btn--icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  padding: 0;
  border-radius: 14px;
}

html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) :is(
  .tbp-btn,
  a.button,
  button.button,
  .woocommerce-Button,
  .tbp-home-feed__btn,
  .tbp-plus-sheet__btn,
  .tbp-filter-reset,
  .single-esperienze .field-type-submit-field button
):not(.tbp-btn--premium):not(.tbp-exp-card__buy):not(.tbp-exp-book-cta):not(.jet-form-builder__next-page):not(.jet-form-builder__submit):hover:not(:disabled):not([aria-disabled="true"]) {
  background: var(--tbp-green-dark);
  border: 0;
  color: var(--tbp-white);
}

html body:not(.login):not(.registrazione) .tbp-btn--secondary:hover:not(:disabled),
html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) .tbp-filter-reset:hover:not(:disabled) {
  background: var(--tbp-sage);
  color: var(--tbp-green);
  border-color: var(--tbp-line);
}

html body:not(.login):not(.registrazione) .tbp-btn--premium:hover:not(:disabled),
html body:not(.login):not(.registrazione) .tbp-flow-next:hover:not(:disabled),
html body:not(.login):not(.registrazione) .checkout-button:hover:not(:disabled),
html body:not(.login):not(.registrazione) #place_order:hover:not(:disabled),
html body:not(.login):not(.registrazione) .tbp-plus-sheet__btn--gold:hover:not(:disabled),
html body:not(.login):not(.registrazione) .tbp-exp-book-cta:hover:not(:disabled),
html body:not(.login):not(.registrazione) .tbp-exp-card__buy:hover:not(:disabled),
html body:not(.login):not(.registrazione) .single-esperienze .field-type-submit-field button:hover:not(:disabled),
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__next-page:hover:not(:disabled),
html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__submit:hover:not(:disabled) {
  background: var(--tbp-cta-gold, var(--tbp-gold)) !important;
  border: 0 !important;
  color: var(--tbp-gold-label, #fff) !important;
  text-shadow: var(--tbp-gold-label-shadow, none) !important;
}

html body:not(.login):not(.registrazione) .tbp-btn--danger:hover:not(:disabled) {
  background: var(--tbp-red-dark);
  border-color: var(--tbp-red-dark);
}

html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) :is(
  .tbp-btn,
  a.button,
  button.button,
  .woocommerce-Button,
  .tbp-home-feed__btn,
  .tbp-plus-sheet__btn,
  .tbp-filter-reset,
  .tbp-exp-card__buy,
  .tbp-exp-book-cta,
  .single-esperienze .field-type-submit-field button
):not(:disabled):not(.tbp-pressable):active {
  transform: translateY(1px) scale(0.97);
}

html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) :is(
  .tbp-btn,
  a.button,
  button.button,
  .woocommerce-Button,
  .tbp-home-feed__btn,
  .tbp-plus-sheet__btn,
  .tbp-filter-reset,
  .tbp-exp-card__buy,
  .tbp-exp-book-cta
):focus-visible {
  outline: 3px solid var(--tbp-focus-color);
  outline-offset: 3px;
}

html body:not(.login):not(.registrazione) :is(
  .tbp-btn,
  button.button,
  .woocommerce-Button
)[disabled],
html body:not(.login):not(.registrazione) :is(.tbp-btn, .button).is-loading {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  html body * { --tbp-cta-animation: none !important; }
  html body:not(.login):not(.registrazione) :is(button, [type="button"], [type="submit"], .button, .tbp-btn):not(:disabled):active {
    transform: none !important;
  }

  html body:not(.login):not(.registrazione) .tbp-btn--premium::after,
  html body:not(.login):not(.registrazione) .tbp-plus-sheet__btn--gold::after,
  html body:not(.login):not(.registrazione) .tbp-exp-book-cta::after,
  html body:not(.login):not(.registrazione) .tbp-exp-card__buy::after,
  html body:not(.login):not(.registrazione) .single-esperienze .field-type-submit-field > button::after,
  html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__next-page::after,
  html body:not(.login):not(.registrazione) .single-esperienze .jet-form-builder__submit::after {
    animation: none;
  }
}

/* Compact density on all buyer pages. Auth freeze + WCFM + map canvas stay out. */
html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) .section:not(.slider-cerchio):not(.fullw),
html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui) .ux-section:not(.slider-cerchio) {
  padding-top: clamp(12px, 2vw, 20px) !important;
  padding-bottom: clamp(12px, 2vw, 20px) !important;
}

html body:not(.login):not(.registrazione):not(.tbp-wcfm-ui):not(.tbp-core-mappa) #main {
  padding-top: 0;
}


/* ── Tipografia desktop: tutto più grande e testo normale, non semibold ──
   L'html a 17.5px scala ogni misura in rem del sito; i paragrafi tornano
   a peso 400 (i titoli e i bottoni mantengono i loro pesi espliciti). */
@media (min-width: 1024px) {
  html {
    font-size: 17.5px;
  }

  body:not(.login):not(.registrazione) {
    font-weight: 400;
  }

  body:not(.login):not(.registrazione) p,
  body:not(.login):not(.registrazione) li,
  body:not(.login):not(.registrazione) label,
  body:not(.login):not(.registrazione) td {
    font-weight: 400;
  }
}


/* ── Campi senza bordi: riempimento morbido al posto dei contorni (Elind 7/9) ── */
html body input[type="text"],
html body input[type="email"],
html body input[type="tel"],
html body input[type="password"],
html body input[type="number"],
html body input[type="url"],
html body input[type="search"],
html body input[type="date"],
html body textarea,
html body select {
  border: 0 !important;
  background-color: #F1F4F2 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html body input[type="text"]:focus,
html body input[type="email"]:focus,
html body input[type="tel"]:focus,
html body input[type="password"]:focus,
html body input[type="number"]:focus,
html body input[type="url"]:focus,
html body input[type="search"]:focus,
html body input[type="date"]:focus,
html body textarea:focus,
html body select:focus {
  outline: none !important;
  box-shadow: inset 0 0 0 2px var(--tbp-green, #084828) !important;
}

/* Niente anteprima URL staging sotto il nome in registrazione. */
html body .wcfm_store_url,
html body .wcfm_store_slug_verified,
html body .wcfm_store_slug {
  display: none !important;
}

/* ------------------------------------------------------------------------
 * Movimento ToBePolo (29/9 notte, kit rilascio/motion-29-9, REPORT in
 * qa/motion-29-9). Prima il sito usava 51 durate e 21 curve diverse.
 * Da qui in poi: quattro durate e tre curve, le stesse ovunque.
 *
 *   tocco  80 ms   il dito giu' (stato premuto)
 *   breve 160 ms   stati: colore, hover, rilascio, piccole uscite
 *   medio 240 ms   fogli dal basso, finestre, cassetto, passi dei flussi, toast
 *   lungo 380 ms   solo le entrate grandi (benvenuto, marchio)
 *
 *   curva  morbida in uscita: quasi tutto
 *   esce   accelera: cio' che se ne va (chiusure), sempre piu' corto di chi entra
 *   molla  solo marchio e conferme: la stessa entrata del logo (0,92 -> 1)
 *
 * Si muovono solo transform e opacity. I colori cambiano in «breve» e non
 * spostano niente. Niente giri infiniti decorativi. Con «riduci movimento»
 * niente spostamenti: restano le dissolvenze.
 * ------------------------------------------------------------------------ */
:root {
  --tbp-moto-tocco: 80ms;
  --tbp-moto-breve: 160ms;
  --tbp-moto-medio: 240ms;
  --tbp-moto-lungo: 380ms;
  --tbp-moto-curva: cubic-bezier(.22, 1, .36, 1);
  --tbp-moto-esce: cubic-bezier(.4, 0, 1, 1);
  --tbp-moto-molla: cubic-bezier(.28, 1.6, .36, 1);
  --tbp-moto-premuto: .97;
  --tbp-moto-sposta: 16px;
  /* I nomi vecchi puntano ai nuovi, con gli stessi valori di prima. */
  --duration-fast: var(--tbp-moto-breve);
  --duration-base: var(--tbp-moto-medio);
  --duration-slow: var(--tbp-moto-lungo);
  --ease-standard: var(--tbp-moto-curva);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --tbp-moto-premuto: 1;
    --tbp-moto-sposta: 0px;
  }
}

/* Pagine di accesso e iscrizione: qui il premuto via JS non c'e' (auth
   «congelata», tbp-interaction-motion non si carica). Stesso gesto del resto
   del sito, solo con proprieta' individuali (scale/translate/filter), cosi' non
   tocca nessun transform gia' scritto per questi bottoni. */
html body:is(.login, .registrazione, .registrazione-professionista, .registrazione-comune) :is(
  .woocommerce-form-login__submit,
  .woocommerce-form-register__submit,
  .tbp-auth-flow__next,
  .tbp-auth-flow__back,
  .tbp-auth-toolbar__close,
  .tbp-social-btn:not(.is-soon),
  .tbp-registrati__cta,
  .tbp-auth-switch__scelta:not(.is-corrente)
) {
  -webkit-tap-highlight-color: transparent;
  transition-property: scale, translate, filter, background-color, border-color, color, opacity;
  transition-duration: var(--tbp-moto-breve);
  transition-timing-function: var(--tbp-moto-curva);
}
html body:is(.login, .registrazione, .registrazione-professionista, .registrazione-comune) :is(
  .woocommerce-form-login__submit,
  .woocommerce-form-register__submit,
  .tbp-auth-flow__next,
  .tbp-auth-flow__back,
  .tbp-auth-toolbar__close,
  .tbp-social-btn:not(.is-soon),
  .tbp-registrati__cta,
  .tbp-auth-switch__scelta:not(.is-corrente)
):active:not(:disabled):not([aria-disabled="true"]) {
  scale: var(--tbp-moto-premuto);
  translate: 0 1px;
  filter: brightness(.92);
  transition-duration: var(--tbp-moto-tocco);
}
@media (prefers-reduced-motion: reduce) {
  html body:is(.login, .registrazione, .registrazione-professionista, .registrazione-comune) :is(
    .woocommerce-form-login__submit,
    .woocommerce-form-register__submit,
    .tbp-auth-flow__next,
    .tbp-auth-flow__back,
    .tbp-auth-toolbar__close,
    .tbp-social-btn:not(.is-soon),
    .tbp-registrati__cta,
    .tbp-auth-switch__scelta:not(.is-corrente)
  ):active {
    scale: none;
    translate: none;
  }
}

/* Disattivato: grigio neutro e fermo, uguale in tutto il sito (REGOLE-DESIGN).
   Prima era lo stesso bottone al 45 % (oro sbiadito, verde slavato). */
html body {
  --tbp-spento-fondo: #E4E7E5;
  --tbp-spento-testo: #6B7470;
}
html[data-tbp-theme="dark"] body {
  --tbp-spento-fondo: #2B302D;
  --tbp-spento-testo: #9BA39F;
}