/* ═══════════════════════════════════════════════════════════
   DIGITAL BOSS EXPERIENCE — CSS compartilhado (Design System "Aura")
   Usado por: index.html, sites.html, assinatura.html
═══════════════════════════════════════════════════════════ */

/* ── Fontes extras (700/800 locais) ───────────────────────── */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../vendor/fonts/Inter-Bold.ttf") format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../vendor/fonts/Inter-ExtraBold.ttf") format('truetype');
}

/* ── Marca (logo do nav/footer) ───────────────────────────── */
.brand-lockup { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-lockup img { height: 34px; width: auto; display: block; }
.brand-name { display: flex; flex-direction: column; line-height: 1; }
.brand-name .brand-top {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: 15px;
  letter-spacing: 0.22em;
  color: #ffffff;
  white-space: nowrap;
}
.brand-name .brand-bottom {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: 10px;
  letter-spacing: 0.4em;
  color: rgba(255,255,255,0.6);
  margin-top: 5px;
  white-space: nowrap;
}
.brand-lockup.brand-footer img { height: 40px; }
.brand-lockup.brand-footer .brand-top { font-size: 17px; }
.brand-lockup.brand-footer .brand-bottom { font-size: 11px; }

/* ── Base ─────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', sans-serif;
  background-color: #000000;
  color: #ededed;
}
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* ── Background grid ──────────────────────────────────────── */
.bg-gradient-mesh {
  position: fixed;
  top: 0; left: 0; width: 100vw; height: 100vh;
  z-index: -1;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,0.04), transparent 40%),
    radial-gradient(circle at 85% 100%, rgba(255,255,255,0.03), transparent 40%);
  filter: blur(80px);
  pointer-events: none;
}
.bg-grid {
  background-size: 40px 40px;
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.05) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 40%, transparent 100%);
  animation: gridMove 20s linear infinite;
}
.bg-grid-small {
  background-size: 10px 10px;
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px);
}
.dot-grid {
  background-image: radial-gradient(rgba(255,255,255,0.15) 1px, transparent 1px);
  background-size: 12px 12px;
}

/* ── Keyframes ────────────────────────────────────────────── */
@keyframes gridMove { 0%{transform:translateY(0)} 100%{transform:translateY(40px)} }
@keyframes float { 0%,100%{transform:translateY(0px)} 50%{transform:translateY(-8px)} }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes shimmer { to{background-position:200% center} }
@keyframes shimmerLine { 0%{transform:translateX(-100%)} 100%{transform:translateX(300%)} }
@keyframes scan {
  0%{top:-10%;opacity:0} 10%{opacity:1} 90%{opacity:1} 100%{top:110%;opacity:0}
}
@keyframes dashDraw { to{stroke-dashoffset:-1000} }
@keyframes barPulse1 { 0%{height:30%} 100%{height:70%} }
@keyframes barPulse2 { 0%{height:60%} 100%{height:95%} }
@keyframes barPulse3 { 0%{height:40%} 100%{height:80%} }
@keyframes barPulse4 { 0%{height:75%} 100%{height:45%} }
@keyframes barPulse5 { 0%{height:50%} 100%{height:85%} }
@keyframes floatLayer {
  0%,100%{transform:translateY(0) rotateX(45deg) rotateZ(-45deg)}
  50%{transform:translateY(-10px) rotateX(45deg) rotateZ(-45deg)}
}
@keyframes ringSpin {
  0%{transform:translate(-50%,-50%) rotate(0deg)}
  100%{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes nodePulse {
  0%{transform:translate(-50%,-50%) scale(0.8);opacity:0.5}
  100%{transform:translate(-50%,-50%) scale(1.2);opacity:1}
}
@keyframes linkPulse { 0%{opacity:0.2} 100%{opacity:1;box-shadow:0 0 8px rgba(255,255,255,0.5)} }
@keyframes schemaNodePulse {
  0%{transform:translate(-50%,-50%) scale(0.8);opacity:0.5}
  100%{transform:translate(-50%,-50%) scale(1.2);opacity:1;box-shadow:0 0 15px rgba(255,255,255,0.8)}
}
@keyframes schemaRingSpin {
  0%{transform:translate(-50%,-50%) rotate(0deg)}
  100%{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes schemaBoxSpin {
  0%{transform:translate(-50%,-50%) rotate(0deg)}
  100%{transform:translate(-50%,-50%) rotate(90deg)}
}
@keyframes schemaLineHCenter { 0%{transform:scaleX(0);opacity:0} 100%{transform:scaleX(1);opacity:1} }
@keyframes schemaLineVCenter { 0%{transform:scaleY(0);opacity:0} 100%{transform:scaleY(1);opacity:1} }
@keyframes schemaFlash {
  0%,40%{opacity:0.3;background:rgba(255,255,255,0.04);box-shadow:none}
  100%{opacity:1;background:#fff;box-shadow:0 0 14px rgba(255,255,255,0.75)}
}
@keyframes schemaPulseDot { 0%{transform:scale(0.8);opacity:0.5} 100%{transform:scale(1.5);opacity:1;box-shadow:0 0 20px rgba(255,255,255,1)} }
@keyframes schemaPulseDotPos {
  0%{transform:translate(-50%,-50%) scale(0.8);opacity:0.5}
  100%{transform:translate(-50%,-50%) scale(1.5);opacity:1;box-shadow:0 0 20px rgba(255,255,255,1)}
}
@keyframes schemaRingSpinInset { 0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} }
@keyframes dataStream {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}
@keyframes typeCmd {
  0%, 10% { width: 0; }
  40%, 90% { width: var(--type-ch, 19ch); }
  100% { width: 0; }
}
@keyframes blinkCaret {
  0%, 100% { border-color: transparent; }
  50% { border-color: #fff; }
}

/* ── Utilities ────────────────────────────────────────────── */
.glass-panel {
  background: rgba(255,255,255,0.02);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 4px 30px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.05);
}
.line-gradient { background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent); }
.text-shimmer {
  background: linear-gradient(to right, #64748b 20%, #ffffff 40%, #ffffff 60%, #64748b 80%);
  background-size: 200% auto;
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  animation: shimmer 4s linear infinite;
}
.anim-bar-1 { animation: barPulse1 2s ease-in-out infinite alternate; }
.anim-bar-2 { animation: barPulse2 2.5s ease-in-out infinite alternate; }
.anim-bar-3 { animation: barPulse3 1.8s ease-in-out infinite alternate; }
.anim-bar-4 { animation: barPulse4 2.2s ease-in-out infinite alternate; }
.anim-bar-5 { animation: barPulse5 2.7s ease-in-out infinite alternate; }
.scanline {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.05), transparent);
  height: 10%; width: 100%;
  animation: scan 4s linear infinite;
  pointer-events: none;
}
.path-line { stroke-dasharray: 100; animation: dashDraw 20s linear infinite; }
.layer-float-1 { animation: floatLayer 4s ease-in-out infinite; }
.layer-float-2 { animation: floatLayer 4s ease-in-out infinite 0.5s; }
.layer-float-3 { animation: floatLayer 4s ease-in-out infinite 1s; }
.mesh-ring {
  position: absolute;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50%;
  transform: translate(-50%,-50%);
  animation: ringSpin 20s linear infinite;
}
.mesh-ring.r2 { border-style:dashed; animation-direction:reverse; animation-duration:25s; }
.mesh-ring.r3 { border-color:rgba(255,255,255,0.2); animation-duration:15s; }
.mesh-link {
  position: absolute; height: 1px;
  background: rgba(255,255,255,0.15);
  transform-origin: left center;
  animation: linkPulse 2s infinite alternate;
}
.fade-up {
  opacity: 0; transform: translateY(30px);
  transition: opacity 1s cubic-bezier(0.16,1,0.3,1), transform 1s cubic-bezier(0.16,1,0.3,1);
}
.fade-up.visible { opacity: 1; transform: translateY(0); }
.scale-in {
  opacity: 0; transform: scale(0.95);
  transition: opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1);
}
.scale-in.visible { opacity: 1; transform: scale(1); }

/* ── Schema classes ───────────────────────────────────────── */
.schema-layer { position:absolute; inset:0; pointer-events:none; }
.schema-vignette {
  position:absolute; inset:0;
  background: radial-gradient(circle at center, rgba(0,0,0,0) 30%, rgba(0,0,0,0.18) 58%, rgba(0,0,0,0.42) 80%, rgba(0,0,0,0.72) 100%);
  z-index:10;
}
.schema-node-clean {
  position:absolute; width:7px; height:7px;
  transform:translate(-50%,-50%); border-radius:9999px;
  background:rgba(255,255,255,0.92); box-shadow:0 0 10px rgba(255,255,255,0.4);
  animation:schemaNodePulse 2s infinite alternate;
}
.schema-ring-spin { animation:schemaRingSpin 20s linear infinite; }
.schema-ring-spin-reverse { animation:schemaRingSpin 25s linear infinite reverse; }
.schema-box-spin { animation:schemaBoxSpin 15s linear infinite; }
.schema-line-h-center { animation:schemaLineHCenter 4s ease-in-out infinite alternate; transform-origin:center; }
.schema-line-v-center { animation:schemaLineVCenter 4s ease-in-out infinite alternate; transform-origin:center; }
.schema-flash { animation:schemaFlash 2s infinite alternate; }
.schema-flash-1 { animation:schemaFlash 2s infinite alternate 0.5s; }
.schema-flash-2 { animation:schemaFlash 2s infinite alternate 1s; }
.schema-flash-3 { animation:schemaFlash 2s infinite alternate 1.5s; }
.schema-pulse-dot { animation:schemaPulseDot 1.5s ease-in-out infinite alternate; }
.schema-pulse-dot-pos { animation:schemaPulseDotPos 1.5s ease-in-out infinite alternate; }
.schema-ring-spin-inset { animation:schemaRingSpinInset 20s linear infinite; }
.schema-ring-spin-inset-reverse { animation:schemaRingSpinInset 25s linear infinite reverse; }
.schema-card-enhanced {
  background-color: #161616;
  background-image: linear-gradient(#161616, #161616), linear-gradient(to bottom right, rgba(255,255,255,0.4), rgba(255,255,255,0.05));
  background-origin: padding-box, border-box;
  background-clip: padding-box, border-box;
  border: 1px solid transparent;
}
.schema-card-enhanced:hover {
  background-color: #1c1c1c;
  background-image: linear-gradient(#1c1c1c, #1c1c1c), linear-gradient(to bottom right, rgba(255,255,255,0.7), rgba(255,255,255,0.15));
}

/* ── Typewriter (CTA final) ───────────────────────────────── */
.typewriter-text {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  border-right: 3px solid #fff;
  width: var(--type-ch, 19ch);
  animation: typeCmd 5s steps(var(--type-steps, 19), end) infinite, blinkCaret 0.8s step-end infinite;
}

/* ── FAQ (details/summary) ────────────────────────────────── */
.faq-item {
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  background: #050505;
  transition: border-color 0.3s;
}
.faq-item:hover, .faq-item[open] { border-color: rgba(255,255,255,0.2); }
.faq-item summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  font-weight: 600;
  color: #fff;
  font-size: 0.95rem;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .faq-icon { transition: transform 0.3s; color: rgba(255,255,255,0.4); flex-shrink: 0; }
.faq-item[open] summary .faq-icon { transform: rotate(45deg); color: #fff; }
.faq-item .faq-body {
  padding: 0 24px 22px;
  color: #a3a3a3;
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1.7;
}

/* ── Mobile menu ──────────────────────────────────────────── */
#mobile-menu {
  display: none;
  z-index: 100;
  background-color: #000;
}
#mobile-menu.open { display: flex; }

/* ═══════════════════════════════════════════════════════════
   v2 — adições (gerador estático, SEO, portfólio Netflix)
═══════════════════════════════════════════════════════════ */
.bg-mask-fade { mask-image:linear-gradient(to bottom,transparent,black 10%,black 80%,transparent); -webkit-mask-image:linear-gradient(to bottom,transparent,black 10%,black 80%,transparent); }
.bg-mask-down { mask-image:linear-gradient(to bottom,black 20%,transparent 100%); -webkit-mask-image:linear-gradient(to bottom,black 20%,transparent 100%); }
.btn-grad { background:linear-gradient(rgba(20,20,20,0.4),rgba(20,20,20,0.4)) padding-box,linear-gradient(180deg,rgba(255,255,255,0.14) 0%,rgba(255,255,255,0.03) 100%) border-box; border:1px solid transparent; }
.badge-grad { background:linear-gradient(#111,#111) padding-box,linear-gradient(90deg,rgba(255,255,255,0.12) 0%,rgba(255,255,255,0.02) 100%) border-box; border:1px solid transparent; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:absolute; left:12px; top:-60px; z-index:200; background:#fff; color:#000; padding:10px 16px; border-radius:10px; font-size:14px; font-weight:600; transition:top .2s; }
.skip-link:focus { top:12px; }
:focus-visible { outline:2px solid #fff; outline-offset:3px; border-radius:6px; }
#menu-toggle[aria-expanded="true"] { background:#fff; color:#000; }
.faq-item summary h3 { margin:0; color:#fff; }
/* reserva o espaço do ícone antes do runtime carregar (evita layout shift) */
iconify-icon { display:inline-block; width:1em; height:1em; vertical-align:-0.125em; flex-shrink:0; }

/* WhatsApp flutuante (monocromático, segue o DS) */
.wa-float { position:fixed; right:18px; bottom:18px; z-index:60; width:56px; height:56px; border-radius:9999px; display:flex; align-items:center; justify-content:center;
  background:#fff; color:#000; box-shadow:0 10px 30px rgba(0,0,0,.5), 0 0 0 6px rgba(255,255,255,.06); transition:transform .25s; }
.wa-float:hover { transform:scale(1.07); }
.wa-float::after { content:""; position:absolute; top:6px; right:6px; width:10px; height:10px; border-radius:9999px; background:#34d399; box-shadow:0 0 0 2px #fff; }

/* Texto longo (blog, artigos, políticas) */
.prose-dbe { color:#a3a3a3; font-weight:300; font-size:1.0625rem; line-height:1.8; }
.prose-dbe > * + * { margin-top:1.25em; }
.prose-dbe h2 { color:#fff; font-weight:600; font-size:1.75rem; line-height:1.2; letter-spacing:-0.02em; margin-top:2.4em; }
.prose-dbe h3 { color:#fff; font-weight:600; font-size:1.2rem; margin-top:1.8em; }
.prose-dbe strong { color:#fff; font-weight:500; }
.prose-dbe a { color:#fff; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(255,255,255,.35); }
.prose-dbe a:hover { text-decoration-color:#fff; }
.prose-dbe ul, .prose-dbe ol { padding-left:1.3em; }
.prose-dbe ul { list-style:disc; } .prose-dbe ol { list-style:decimal; }
.prose-dbe li + li { margin-top:.5em; }
.prose-dbe li::marker { color:rgba(255,255,255,.4); }
.prose-dbe table { width:100%; border-collapse:collapse; font-size:.92rem; }
.prose-dbe th, .prose-dbe td { border-bottom:1px solid rgba(255,255,255,.1); padding:.7em .6em; text-align:left; vertical-align:top; }
.prose-dbe th { color:#fff; font-weight:500; font-family:'JetBrains Mono',monospace; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.prose-dbe blockquote { border-left:2px solid rgba(255,255,255,.3); padding-left:1.1em; color:#d4d4d4; font-style:italic; }
.prose-dbe .callout { border:1px solid rgba(255,255,255,.1); background:#050505; border-radius:16px; padding:1.2em 1.4em; }
.table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* ── Portfólio estilo Netflix ─────────────────────────────── */
.nf { height:100vh; height:100svh; min-height:600px; overflow:hidden; isolation:isolate; }
.nf-stage { position:absolute; inset:0; overflow:hidden; background:#000; }
.nf-screen { position:absolute; inset:0; overflow:hidden; transition:opacity .45s ease, transform .6s ease; }
.nf.is-swapping .nf-screen { opacity:0; transform:scale(1.015); }
.nf-trailer { position:absolute; left:0; right:0; top:0; margin:0 auto; width:100%; height:auto; max-width:none; will-change:transform; }
@media (min-width:1024px) { .nf-trailer { left:auto; right:0; margin:0; width:72%; } }
@media (min-width:1900px) { .nf-trailer { width:1360px; } }
.nf-shade { position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, #000 0%, #000 26%, rgba(0,0,0,.85) 34%, rgba(0,0,0,.35) 52%, rgba(0,0,0,0) 72%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.92) 24%, rgba(0,0,0,0) 55%),
    linear-gradient(180deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,0) 20%); }
.nf-ui { position:relative; z-index:2; height:100%; max-width:1400px; margin:0 auto; display:flex; flex-direction:column; justify-content:flex-end; gap:28px; padding:100px 24px 26px; }
@media (min-width:768px) { .nf-ui { padding:110px 48px 34px; } }
.nf-info { max-width:660px; transition:opacity .4s ease; }
.nf.is-swapping .nf-info { opacity:.25; }
.nf-title { text-shadow:0 4px 40px rgba(0,0,0,.6); }
.nf-rail { display:flex; gap:12px; overflow-x:auto; overflow-y:visible; scroll-snap-type:x mandatory; scrollbar-width:none; padding:10px 6px 6px; margin:0 -6px; }
.nf-rail::-webkit-scrollbar { display:none; }
.nf-card { position:relative; display:block; flex:0 0 auto; width:clamp(148px, 17vw, 250px); aspect-ratio:16/10; border-radius:14px; overflow:hidden; cursor:pointer;
  border:1px solid rgba(255,255,255,.12); background:#111; opacity:.55; scroll-snap-align:start;
  transition:transform .35s cubic-bezier(.16,1,.3,1), opacity .35s, border-color .35s, box-shadow .35s; }
.nf-card img { width:100%; height:100%; object-fit:cover; object-position:top; display:block; }
.nf-card:hover, .nf-card:focus-visible { opacity:.95; transform:translateY(-3px); }
.nf-card.is-active { opacity:1; border-color:rgba(255,255,255,.75); transform:translateY(-5px) scale(1.04); box-shadow:0 18px 40px rgba(0,0,0,.6); }
.nf-card-name { position:absolute; left:0; right:0; bottom:0; padding:22px 10px 9px; text-align:left; font:500 10.5px/1.25 'JetBrains Mono',monospace; letter-spacing:.04em; text-transform:uppercase; color:#fff; background:linear-gradient(0deg, rgba(0,0,0,.92), rgba(0,0,0,0)); }
.nf-progress { position:absolute; left:0; bottom:0; height:2px; width:0; background:#fff; }
.nf-card.is-active .nf-progress { animation:nfProgress var(--nf-dur, 9s) linear forwards; }
.nf.is-paused .nf-card.is-active .nf-progress { animation-play-state:paused; }
@keyframes nfProgress { to { width:100%; } }
.nf-arrow { width:36px; height:36px; border-radius:9999px; display:flex; align-items:center; justify-content:center; color:#fff; border:1px solid rgba(255,255,255,.18); background:rgba(0,0,0,.5); backdrop-filter:blur(8px); transition:background .25s, border-color .25s; }
.nf-arrow:hover { background:#fff; color:#000; border-color:#fff; }
@media (max-width:767px) {
  .nf-shade { background: linear-gradient(0deg, #000 0%, rgba(0,0,0,.97) 52%, rgba(0,0,0,.55) 68%, rgba(0,0,0,.2) 82%, rgba(0,0,0,.6) 100%); }
  .nf-info .btn-grad { display:none; }
  .nf-ui { gap:20px; padding-bottom:84px; }
}
@media (max-height:700px) and (max-width:767px) { .nf-info p[data-nf-r] { display:none; } }

/* Linhas estilo Netflix (página /portfolio/) */
.nf-row { display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; padding:6px 2px 18px; }
.nf-row > * { flex:0 0 auto; width:clamp(220px, 26vw, 340px); scroll-snap-align:start; }

/* Ferramenta de diagnóstico */
.dg-opt { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border:1px solid rgba(255,255,255,.1); border-radius:14px; background:#050505; cursor:pointer; transition:border-color .2s, background .2s; }
.dg-opt:hover { border-color:rgba(255,255,255,.3); }
.dg-opt input { margin-top:3px; accent-color:#fff; width:18px; height:18px; flex-shrink:0; }
.dg-opt:has(input:checked) { border-color:#fff; background:#0d0d0d; }

/* Faixa rolante de segmentos (home). O 2º grupo é cópia (aria-hidden) para o loop sem emenda. */
.marquee { overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 6%, #000 94%, transparent); -webkit-mask-image:linear-gradient(to right, transparent, #000 6%, #000 94%, transparent); }
.marquee-track { display:flex; width:max-content; animation:marquee 90s linear infinite; }
.marquee:hover .marquee-track, .marquee:focus-within .marquee-track { animation-play-state:paused; }
.marquee-group { display:flex; gap:10px; padding-right:10px; }

@media (prefers-reduced-motion: reduce) {
  .marquee { overflow-x:auto; mask-image:none; -webkit-mask-image:none; }
  .marquee-track { animation:none; width:auto; }
  .marquee-group { flex-wrap:wrap; }
  .marquee-group[aria-hidden] { display:none; }
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .fade-up, .scale-in { opacity:1; transform:none; }
}