/* ============================================
   brandflow-lp — estilos da landing page
   ============================================
   Este arquivo tem:
   1. Reset e base
   2. Animações (keyframes)
   3. Efeitos de hover/after (convertidos dos style-hover/style-after do dc)
   4. Media query de acessibilidade
   ============================================ */

/* --- Reset e base --- */
body { margin: 0; background: oklch(0.17 0.012 265); }
a { color: inherit; text-decoration: none; }
a:hover { opacity: .82; }
* { box-sizing: border-box; }

/* --- Animações --- */
@keyframes cdp-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes cdp-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(163,230,53,.45); } 50% { box-shadow: 0 0 0 14px rgba(163,230,53,0); } }
@keyframes cdp-sheen { 0% { transform: translateX(-140%) skewX(-18deg); } 55%,100% { transform: translateX(360%) skewX(-18deg); } }
@keyframes cdp-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes cdp-blink { 0%,100% { opacity: 1; } 50% { opacity: .25; } }
@keyframes cdp-shield { 0%,100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes cdp-border { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }

/* --- Transições base --- */
a, button { transition: transform .18s cubic-bezier(.2,.8,.3,1), box-shadow .22s ease, background-color .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease; }
a[data-cta]:hover, button[data-cta]:hover { transform: translateY(-3px) scale(1.015); }
a[data-cta]:active, button[data-cta]:active { transform: translateY(0) scale(.985); }

/* --- Efeitos de hover em cards --- */
[data-lift] { transition: transform .25s cubic-bezier(.2,.8,.3,1), border-color .25s ease, box-shadow .25s ease, background-color .25s ease; }
[data-lift]:hover { transform: translateY(-4px); border-color: oklch(0.84 0.18 130 / .55); box-shadow: 0 18px 40px rgba(0,0,0,.35); }

[data-tile] > div:first-child { transition: transform .3s cubic-bezier(.2,.8,.3,1), filter .3s ease; }
[data-tile]:hover > div:first-child { transform: scale(1.035); filter: brightness(1.15); }

[data-row] { transition: background-color .2s ease, transform .2s cubic-bezier(.2,.8,.3,1); }
[data-row]:hover { background-color: oklch(0.84 0.18 130 / .08); transform: translateX(4px); }

[data-pain] { transition: transform .22s cubic-bezier(.2,.8,.3,1), border-left-width .22s ease, background-color .22s ease; }
[data-pain]:hover { transform: translateX(6px); border-left-width: 6px; background-color: oklch(0.24 0.014 265); }

[data-plan] { transition: transform .28s cubic-bezier(.2,.8,.3,1), box-shadow .28s ease, border-color .28s ease; }
[data-plan]:hover { transform: translateY(-8px); border-color: oklch(0.84 0.18 130 / .7); box-shadow: 0 28px 60px rgba(0,0,0,.45); }

[data-shot] { transition: transform .3s cubic-bezier(.2,.8,.3,1), box-shadow .3s ease, filter .3s ease; }
[data-shot]:hover { transform: translateY(-6px) rotate(-1deg); filter: brightness(1.12); box-shadow: 0 20px 44px rgba(0,0,0,.4); }

[data-quote] { position: relative; overflow: hidden; }
[data-quote]::before { content: ''; position: absolute; left: 0; top: 0; width: 3px; height: 0; background: oklch(0.84 0.18 130); transition: height .3s ease; }
[data-quote]:hover::before { height: 100%; }

/* --- Efeitos de hover em botões (convertidos de style-hover) --- */
.hover-glow-sm:hover { box-shadow: 0 12px 26px oklch(0.84 0.18 130 / .35); }
.hover-glow-md:hover { box-shadow: 0 18px 40px oklch(0.84 0.18 130 / .35); }
.hover-glow-lg:hover { box-shadow: 0 18px 40px oklch(0.84 0.18 130 / .4); }
.hover-glow-xl:hover { box-shadow: 0 20px 44px oklch(0.84 0.18 130 / .4); }
.hover-glow-float:hover { box-shadow: 0 20px 44px oklch(0.84 0.18 130 / .45); }

.hover-border:hover { border-color: oklch(0.84 0.18 130); color: oklch(0.84 0.18 130); }
.hover-border-bg:hover { border-color: oklch(0.84 0.18 130); color: oklch(0.84 0.18 130); background: oklch(0.84 0.18 130 / .08); }
.hover-border-bg-soft:hover { border-color: oklch(0.84 0.18 130); color: oklch(0.84 0.18 130); background: oklch(0.84 0.18 130 / .07); }
.hover-faq:hover { background: oklch(0.84 0.18 130 / .07) !important; color: oklch(0.84 0.18 130) !important; }

/* --- Efeito sheen (brilho deslizante) --- */
.sheen { position: relative; overflow: hidden; }
.sheen::after {
  content: ''; position: absolute; top: 0; left: 0;
  width: 38%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  animation: cdp-sheen 3.4s ease-in-out infinite;
  pointer-events: none;
}
.sheen-bright::after {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
}
.sheen-slow::after { animation-duration: 4.5s; }
.sheen-fast::after { animation-duration: 3s; }

/* --- Acessibilidade --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}