/*
 Theme Name:   Kina Theme
 Theme URI:    https://www.kina.it/
 Description:  Use this child theme to extend functionality.
 Author:       KINA
 Template:     bricks
 Version:      1.2
 Text Domain:  kina
*/


/* ==========================================================================
   Footer
   ========================================================================== */

/* link sottolineati nei testi del footer (contatti, copyright) */
.footer__text a {
  text-decoration: underline;
  text-underline-offset: 0.25em;
  transition: color 0.3s ease;
}

.footer__text a:hover {
  color: var(--gold-dark);
}


/* ==========================================================================
   Header
   ========================================================================== */

/* voce "Sessione gratuita" solo nel menu mobile (su desktop c'è il bottone) */
@media (min-width: 992px) {
  .menu-item-cta {
    display: none !important;
  }
}

.bricks-mobile-menu .menu-item-cta > a {
  color: var(--gold) !important;
  font-weight: 700;
}


/* ==========================================================================
   Pagine interne
   ========================================================================== */

/* titoli senza parole sole a capo */
h1, h2, h3 {
  text-wrap: balance;
}

/* elenco con stelle oro (sp_lista) */
.lista-stelle {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.lista-stelle li {
  position: relative;
  padding-left: 3.2rem;
}

.lista-stelle li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;
  width: 1.8rem;
  height: 1.7rem;
  background: var(--gold-dark);
  -webkit-mask: url("/wp-content/uploads/2026/10/stella.svg") center / contain no-repeat;
  mask: url("/wp-content/uploads/2026/10/stella.svg") center / contain no-repeat;
}

/* FAQ (sp_faq): "+" oro che ruota in "×" quando la risposta è aperta */
.faq .accordion-title-wrapper {
  flex-wrap: nowrap;
  cursor: pointer;
}

.faq .accordion-title-wrapper::after {
  content: "+";
  flex-shrink: 0;
  font-size: 3.2rem;
  font-weight: 300;
  line-height: 1;
  color: var(--gold-dark);
  transition: transform 0.3s ease;
}

.faq .brx-open > .accordion-title-wrapper::after {
  transform: rotate(45deg);
}


/* ==========================================================================
   Pagine interne v2 (prova taste-skill) — animazioni in js/modules/
   ========================================================================== */

/* hero v2: nascosto finché GSAP non lo anima (classe js-anim messa in <head>, vedi functions.php) */
html.js-anim .hero-v2 :is(.hero-title, .hero-fade, .hero-media) {
  visibility: hidden;
}

/* timeline: la linea oro cresce dall'alto */
.timeline-fill {
  transform-origin: top center;
}

.timeline--h .timeline-fill {
  transform-origin: left center;
}

/* ==========================================================================
   Home — percorsi a scorrimento orizzontale (.hscroll, js/modules/hscroll.js)
   Senza JS / reduced motion: swipe nativo con aggancio alle card. Con il pin (.is-pinned, anche su mobile) lo scorrimento lo fa GSAP.
   ========================================================================== */
.hscroll {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 4vw;
  scrollbar-width: none;
}

.hscroll::-webkit-scrollbar {
  display: none;
}

.hscroll-track > * {
  flex-shrink: 0;
  scroll-snap-align: start;
}

.hscroll.is-pinned {
  overflow: hidden;
  scroll-snap-type: none;
}

/* ==========================================================================
   Contatti — moduli richiesta e aziende (sp2_contatti): campi a mezza larghezza su desktop, interi su mobile
   (le larghezze dei campi del Form Bricks non sono responsive)
   ========================================================================== */
@media (max-width: 767px) {
  :is(#richiesta, #aziende) .brxe-form .form-group {
    width: 100% !important;
  }
}