html, body { margin: 0; padding: 0; background: #e8f3f8; }
body { font-family: 'Figtree', system-ui, sans-serif; color: #0d3441; -webkit-font-smoothing: antialiased; }
a { color: #02769a; }
a:hover { color: #015d7a; }
html { scroll-behavior: smooth; }
/* O ciano claro do layout deixava o texto ilegivel ao selecionar,
   e a palavra-chave Highlight muda conforme o tema do sistema.
   Fixamos o azul de selecao para o contraste ser sempre o mesmo. */
::selection { background: #0b57d0; color: #fff; }
::-moz-selection { background: #0b57d0; color: #fff; }
@keyframes bobSoft { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes rise { 0% { transform: translateY(40px) scale(.6); opacity: 0; } 12% { opacity: .75; } 80% { opacity: .45; } 100% { transform: translateY(-560px) scale(1.2); opacity: 0; } }
@keyframes riseShort { 0% { transform: translateY(20px) scale(.6); opacity: 0; } 15% { opacity: .7; } 80% { opacity: .4; } 100% { transform: translateY(-320px) scale(1.15); opacity: 0; } }
@keyframes heroZoom { from { transform: scale(1); } to { transform: scale(1.09); } }
@keyframes heroFade { 0% { opacity: 1; } 6.9% { opacity: 1; } 9.09% { opacity: 0; } 97.7% { opacity: 0; } 100% { opacity: 1; } }
@keyframes glow { 0%, 100% { opacity: .25; transform: scale(1); } 50% { opacity: .45; transform: scale(1.14); } }
@keyframes rayPulse { 0%, 100% { opacity: .06; } 50% { opacity: .1; } }
@keyframes fabPulse { 0% { box-shadow: 0 0 0 0 rgba(5,163,82,.5); } 100% { box-shadow: 0 0 0 22px rgba(5,163,82,0); } }
@keyframes fabRing2 { 0% { box-shadow: 0 0 0 0 rgba(56,208,126,.45); } 100% { box-shadow: 0 0 0 34px rgba(56,208,126,0); } }
@keyframes fabShake { 0%, 62%, 100% { transform: scale(1) rotate(0deg); } 66% { transform: scale(1.07) rotate(-6deg); } 71% { transform: scale(1.07) rotate(6deg); } 76% { transform: scale(1.07) rotate(-5deg); } 81% { transform: scale(1.06) rotate(4deg); } 86% { transform: scale(1.03) rotate(0deg); } }
@keyframes fabGlow { 0%, 100% { background: #05a352; } 50% { background: #0bc463; } }
@keyframes dotBlink { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .25; transform: scale(.82); } }
@keyframes causticsLight { from { background-position: 0 0; } to { background-position: -560px -1120px; } }
img, svg { max-width: 100%; }
@media (max-width: 980px) {
  .hero-shot { position: relative !important; width: 100% !important; height: min(64vw,340px) !important; }
  .hero-clip { clip-path: none !important; }
  .hero-echo { display: none !important; }
  .hero-grid { grid-template-columns: minmax(0,1fr) !important; padding-top: 34px !important; padding-bottom: 96px !important; gap: 30px !important; }
  .hero-seal { right: 12px !important; bottom: 12px !important; gap: 9px !important; max-width: calc(100% - 24px) !important; }
  .hero-seal span { font-size: 12px !important; line-height: 1.35 !important; max-width: 150px !important; text-shadow: 0 2px 10px rgba(1,25,38,.9) !important; }
}
@media (max-width: 768px) {
  .wtr-rays { display: none !important; }
}
@media (max-width: 1023px) {
  .hero-grid { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (max-width: 767px) {
  .nav-desk { display: none !important; }
  .nav-burger { display: flex !important; }
  header a, footer a { min-height: 44px; }
  footer a { display: inline-flex !important; align-items: center; }
  span[style*="animation:rise"] { display: none !important; }
  h1 { font-size: clamp(30px, 8.6vw, 40px) !important; }
  h2, h3 { overflow-wrap: break-word; }
}
@media (max-width: 400px) {
  .hero-grid, .wrap { padding-left: 16px !important; padding-right: 16px !important; }
}
/* Sob "reduzir movimento" do sistema, mantemos os efeitos leves
   (opacity e transform, processados pela GPU) e desligamos so o que
   obriga o navegador a redesenhar area grande a cada quadro. */
@media (prefers-reduced-motion: reduce) {
  [style*="caustics"], .wtr-b, .wtr-rays,
  [style*="animation:fab"], [style*="animation:dotBlink"],
  [style*="animation:blink"], [style*="animation:dashMove"],
  [style*="animation:blobMorph"] { animation: none !important; }
}
