/* ============================================================
   VISÃO 33 — estilos que o Tailwind (via CDN) não cobre
   ============================================================ */

/* extra utilities */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ══════════════════════════════════════════════════════════
   HERO / SLIDER PRINCIPAL (página inicial)
   As classes .hero-slide, .hero-slide-img e .slider-dot são
   geridas por assets/js/slider.js.

   As imagens ficam em posição absoluta, umas sobre as outras, e
   a altura vem da secção (.hero-full) — o texto vive fora dos
   slides, num único bloco que o JS atualiza.
   ══════════════════════════════════════════════════════════ */
.hero-full{
  min-height:max(560px, calc(100svh - var(--header-h, 108px)));
}

.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:0;
  transition:opacity .7s ease, visibility 0s linear .7s;
}

.hero-slide.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  z-index:1;
  transition:opacity .7s ease, visibility 0s;
}

.hero-slide-img{
  transform:scale(1.02);
  transform-origin:center;
  will-change:transform;
}

/* Movimento lento da imagem do slide ativo */
.hero-slide.is-active .hero-slide-img.is-kenburns{
  animation:heroKenBurns 12s ease-out forwards;
}

@keyframes heroKenBurns{
  from{ transform:scale(1.02); }
  to  { transform:scale(1.10); }
}

/* ── Indicadores (pontos) ── */
.slider-dot{
  width:28px;
  height:4px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.32);
  cursor:pointer;
  transition:background-color .25s ease, width .25s ease;
}

.slider-dot:hover{ background:rgba(255,255,255,.6); }
.slider-dot.is-on{ background:var(--gold-light,#C9A24A); width:40px; }

.slider-dot:focus-visible{
  outline:2px solid var(--gold-light,#C9A24A);
  outline-offset:3px;
}

/* ── Véu de legibilidade sobre as fotografias ── */
.hero-scrim{
  background:
    linear-gradient(90deg, rgba(11,11,11,.94) 0%, rgba(11,11,11,.78) 42%, rgba(11,11,11,.30) 100%),
    linear-gradient(0deg, rgba(11,11,11,.85) 0%, rgba(11,11,11,0) 55%);
}

/* ── Setas laterais ── */
.hero-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:30;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.30);
  background:rgba(11,11,11,.35);
  color:#fff;
  cursor:pointer;
  transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.hero-arrow:hover{
  background:var(--gold-light,#C9A24A);
  border-color:var(--gold-light,#C9A24A);
  color:#0B0B0B;
}
.hero-arrow:focus-visible{
  outline:2px solid var(--gold-light,#C9A24A);
  outline-offset:3px;
}
.hero-arrow--prev{ left:12px; }
.hero-arrow--next{ right:12px; }
@media (min-width:768px){
  .hero-arrow--prev{ left:24px; }
  .hero-arrow--next{ right:24px; }
}

/* ── Botão discreto de pausa/retoma ── */
.hero-toggle{
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.28);
  background:transparent;
  color:rgba(255,255,255,.75);
  cursor:pointer;
  transition:background-color .25s ease, color .25s ease, border-color .25s ease;
}
.hero-toggle:hover{
  background:rgba(255,255,255,.12);
  color:#fff;
}
.hero-toggle:focus-visible{
  outline:2px solid var(--gold-light,#C9A24A);
  outline-offset:3px;
}

/* Com movimento reduzido: sem zoom e sem transições */
@media (prefers-reduced-motion: reduce){
  .hero-slide,
  .hero-slide.is-active{ transition:none; }
  .hero-slide-img,
  .hero-slide.is-active .hero-slide-img.is-kenburns{
    animation:none;
    transform:none;
  }
}

/* ── Faixa de parceiros (carrossel infinito) ──
   A pista (.parceiros-marquee__track) contém DOIS grupos iguais e desliza de
   0 a -50% em loop. Como os dois grupos têm exatamente a mesma largura, o
   movimento é contínuo, sem salto no reinício. */
.parceiros-marquee{
  overflow:hidden;
  position:relative;
  /* esbate suavemente as pontas, para os cartões "entrarem e saírem" devagar */
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.parceiros-marquee__track{
  display:flex;
  width:max-content;
  animation:parceirosMarquee var(--marquee-duration,30s) linear infinite;
  will-change:transform;
  /* permite arrastar na horizontal sem bloquear o deslize vertical da página */
  touch-action:pan-y;
  cursor:grab;
}

.parceiros-marquee__track.is-dragging{
  cursor:grabbing;
  user-select:none;
  -webkit-user-select:none;
}

/* pausa quando o rato está em cima, ou quando um cartão recebe foco */
.parceiros-marquee:hover .parceiros-marquee__track,
.parceiros-marquee:focus-within .parceiros-marquee__track{
  animation-play-state:paused;
}

.parceiros-marquee__group{
  display:flex;
  flex:0 0 auto;
  list-style:none;
  margin:0;
  padding:0;
}

.parceiro{
  flex:0 0 auto;
  margin-right:16px;
}

.parceiro__card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:160px;
  height:140px;
  padding:14px;
  background:#fff;
  border:1px solid #e7e5e4;
  border-radius:14px;
  text-decoration:none;
  color:inherit;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.parceiro__card:hover{
  border-color:var(--gold-light,#C9A24A);
  box-shadow:0 10px 28px rgba(11,11,11,.08);
  transform:translateY(-2px);
}

.parceiro__logo{
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.parceiro__logo-img{
  max-height:60px;
  max-width:120px;
  width:auto;
  object-fit:contain;
}

.parceiro__placeholder{
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px dashed #d6d3d1;
  border-radius:10px;
  color:#b9b4a6;
}

.parceiro__nome{
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#57534e;
  text-align:center;
  line-height:1.3;
  max-width:130px;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

@keyframes parceirosMarquee{
  from{ transform:translateX(0); }
  to  { transform:translateX(-50%); }
}

/* Com movimento reduzido: pista estática, em grelha, sem o grupo duplicado. */
@media (prefers-reduced-motion: reduce){
  .parceiros-marquee__track{
    animation:none;
    width:100%;
    flex-wrap:wrap;
    justify-content:center;
    row-gap:16px;
  }
  .parceiros-marquee__group[aria-hidden="true"]{ display:none; }
  .parceiro{ margin-right:0; }
  .parceiro__card{ margin:0 8px; }
}

/* ══════════════════════════════════════════════════════════
   ÍCONES BOXICONS — contactos e localização
   A biblioteca está em assets/vendor/boxicons (woff2 + woff) e
   é carregada em includes/head.php. Estas regras só alinham o
   ícone com a linha de texto; a cor vem das classes do Tailwind.
   ══════════════════════════════════════════════════════════ */
.icone-contato{
  font-size:1.15rem;
  line-height:1.25;
  flex:0 0 auto;
  /* ligeiro ajuste para o glifo ficar à altura da primeira linha de texto */
  margin-top:-1px;
}

/* Nas caixas escuras o ícone ganha um pouco mais de presença */
.icone-contato--claro{ font-size:1.2rem; }

/* Marcadores com ícone: o ícone acompanha a cor do link ao passar o rato */
.contato-item a:hover .icone-contato{ color:currentColor; }