/* ===================================================================
   EFEITOS YOGABODHA, arquivo unico
   Criado em 18.09.2026. Os mesmos efeitos da pagina Seu caminho, agora
   compartilhados pelas outras paginas do site.

   Tres coisas vivem aqui.
   1. O cartao que sobe, ganha aureola dourada e recebe um brilho que o
      atravessa uma vez, devagar.
   2. O botao com o facho de luz que varre da esquerda para a direita.
   3. A tinta dos Textos de Realizacao, o vermelho que vira ouro, com o
      gradiente deslizando quando o ponteiro passa.

   As classes aparecem dobradas (.sg-card.sg-card) de proposito, para
   vencer as regras que ja existem dentro de cada pagina sem depender de
   qual folha carrega primeiro.

   O .btn ficou de fora por decisao: ele ja tem um facho proprio, em
   animacao continua, dentro de cada pagina. Mexer nele apagaria aquele.

   Paginas de fundo escuro recebem tambem a classe yk-escuro no <body>,
   e a sombra troca de azul para preto com ouro.
   =================================================================== */

.yk-fx.yk-fx,
.sg-card.sg-card,
.sg-item.sg-item,
.formato-card.formato-card,
.ponte-card.ponte-card,
.doacao-card.doacao-card,
.modo-faixa.modo-faixa {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform .5s cubic-bezier(.2,.7,.3,1), box-shadow .5s ease, border-color .5s ease;
}

.yk-fx.yk-fx::before,
.sg-card.sg-card::before,
.sg-item.sg-item::before,
.formato-card.formato-card::before,
.ponte-card.ponte-card::before,
.doacao-card.doacao-card::before,
.modo-faixa.modo-faixa::before {
  content: '';
  position: absolute;
  inset: -40% -60%;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.34) 47%, rgba(244,219,160,.46) 54%, transparent 64%);
  transform: translateX(-120%);
  opacity: 0;
  transition: transform 1.05s cubic-bezier(.22,.7,.28,1), opacity .4s ease;
}

.yk-fx.yk-fx:hover,
.sg-card.sg-card:hover,
.sg-item.sg-item:hover,
.formato-card.formato-card:hover,
.ponte-card.ponte-card:hover,
.doacao-card.doacao-card:hover,
.modo-faixa.modo-faixa:hover,
.yk-fx.yk-fx:focus-within,
.sg-card.sg-card:focus-within,
.sg-item.sg-item:focus-within,
.formato-card.formato-card:focus-within,
.ponte-card.ponte-card:focus-within,
.doacao-card.doacao-card:focus-within,
.modo-faixa.modo-faixa:focus-within {
  transform: translateY(-7px);
  border-color: rgba(217,146,62,.95);
  box-shadow: 0 20px 42px rgba(15,31,61,.16), 0 0 0 1px rgba(217,146,62,.30), 0 0 34px rgba(217,146,62,.14) inset;
}

.yk-fx.yk-fx:hover::before,
.sg-card.sg-card:hover::before,
.sg-item.sg-item:hover::before,
.formato-card.formato-card:hover::before,
.ponte-card.ponte-card:hover::before,
.doacao-card.doacao-card:hover::before,
.modo-faixa.modo-faixa:hover::before,
.yk-fx.yk-fx:focus-within::before,
.sg-card.sg-card:focus-within::before,
.sg-item.sg-item:focus-within::before,
.formato-card.formato-card:focus-within::before,
.ponte-card.ponte-card:focus-within::before,
.doacao-card.doacao-card:focus-within::before,
.modo-faixa.modo-faixa:focus-within::before {
  transform: translateX(120%);
  opacity: 1;
}

/* Fundo escuro, sombra de outra natureza. */
.yk-escuro .yk-fx.yk-fx:hover,
.yk-escuro .sg-card.sg-card:hover,
.yk-escuro .sg-item.sg-item:hover,
.yk-escuro .formato-card.formato-card:hover,
.yk-escuro .ponte-card.ponte-card:hover,
.yk-escuro .doacao-card.doacao-card:hover,
.yk-escuro .modo-faixa.modo-faixa:hover,
.yk-escuro .yk-fx.yk-fx:focus-within,
.yk-escuro .sg-card.sg-card:focus-within,
.yk-escuro .sg-item.sg-item:focus-within,
.yk-escuro .formato-card.formato-card:focus-within,
.yk-escuro .ponte-card.ponte-card:focus-within,
.yk-escuro .doacao-card.doacao-card:focus-within,
.yk-escuro .modo-faixa.modo-faixa:focus-within {
  box-shadow: 0 22px 46px rgba(0,0,0,.45), 0 0 0 1px rgba(217,146,62,.45), 0 0 40px rgba(232,176,64,.16) inset;
}

/* ---------- o botao ---------- */

.yk-bt.yk-bt,
.sg-volta.sg-volta,
.causa-link.causa-link {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s ease, background .45s ease, color .45s ease, border-color .45s ease;
}

.yk-bt.yk-bt::before,
.sg-volta.sg-volta::before,
.causa-link.causa-link::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(100deg, transparent 34%, rgba(255,255,255,.38) 47%, rgba(244,219,160,.52) 53%, transparent 66%);
  transform: translateX(-130%);
  transition: transform .95s cubic-bezier(.22,.7,.28,1);
}

.yk-bt.yk-bt:hover::before,
.sg-volta.sg-volta:hover::before,
.causa-link.causa-link:hover::before,
.yk-bt.yk-bt:focus-visible::before,
.sg-volta.sg-volta:focus-visible::before,
.causa-link.causa-link:focus-visible::before {
  transform: translateX(130%);
}

.yk-bt.yk-bt:hover,
.sg-volta.sg-volta:hover,
.causa-link.causa-link:hover,
.yk-bt.yk-bt:focus-visible,
.sg-volta.sg-volta:focus-visible,
.causa-link.causa-link:focus-visible {
  transform: translateY(-3px);
}

/* ---------- a tinta dos Textos de Realizacao ---------- */

.tinta-realizacao {
  position: relative;
  font-weight: 600;
  display: inline;
  background: linear-gradient(105deg, #8E1A10 0%, #B23A1C 34%, #C79A3F 68%, #D8B65A 100%);
  background-size: 220% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  border-bottom: 1px solid rgba(178,58,28,.38);
  transition: background-position .8s cubic-bezier(.22,.7,.28,1), filter .5s ease, border-color .5s ease;
}
.tinta-realizacao:hover,
.tinta-realizacao:focus-visible {
  background-position: 100% 50%;
  filter: brightness(1.14) saturate(1.12);
  border-color: #D8B65A;
}
/* Fundo escuro pede um vermelho que nao se apague. */
.yk-escuro .tinta-realizacao {
  background: linear-gradient(105deg, #C0392B 0%, #E06A2C 32%, #E8B040 66%, #F5D58E 100%);
  background-size: 220% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  border-bottom-color: rgba(232,176,64,.42);
}

/* ---------- paragrafos justificados ---------- */

.yk-jus p { text-align: justify; text-justify: inter-word; hyphens: auto; }
@media (max-width: 430px) { .yk-jus p { text-align: left; hyphens: none; } }

@media (prefers-reduced-motion: reduce) {
.yk-fx.yk-fx,
.sg-card.sg-card,
.sg-item.sg-item,
.formato-card.formato-card,
.ponte-card.ponte-card,
.doacao-card.doacao-card,
.modo-faixa.modo-faixa,
.yk-fx.yk-fx::before,
.sg-card.sg-card::before,
.sg-item.sg-item::before,
.formato-card.formato-card::before,
.ponte-card.ponte-card::before,
.doacao-card.doacao-card::before,
.modo-faixa.modo-faixa::before,
.yk-bt.yk-bt,
.sg-volta.sg-volta,
.causa-link.causa-link,
.yk-bt.yk-bt::before,
.sg-volta.sg-volta::before,
.causa-link.causa-link::before,
  .tinta-realizacao { transition: none; }
.yk-fx.yk-fx:hover,
.sg-card.sg-card:hover,
.sg-item.sg-item:hover,
.formato-card.formato-card:hover,
.ponte-card.ponte-card:hover,
.doacao-card.doacao-card:hover,
.modo-faixa.modo-faixa:hover,
.yk-bt.yk-bt:hover,
.sg-volta.sg-volta:hover,
.causa-link.causa-link:hover { transform: none; }
}
