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; }
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }
/* 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 pvSlide { from { transform: translate3d(0,0,0); } to { transform: translate3d(-33.3333%,0,0); } }
@keyframes waveSlide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes marqueeMove { from { transform: translateX(0); } to { transform: translateX(-33.3333%); } }
.marquee-scroll::-webkit-scrollbar { display: none; }
@keyframes lbFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes lbZoom { from { transform: scale(.92); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes bobSoft { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes blobMorph { 0%, 100% { border-radius: 58% 42% 55% 45% / 52% 48% 52% 48%; } 33% { border-radius: 46% 54% 42% 58% / 58% 44% 56% 42%; } 66% { border-radius: 54% 46% 58% 42% / 44% 58% 42% 58%; } }
@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 ride { from { transform: translateX(-140px); } to { transform: translateX(calc(100vw + 140px)); } }
@keyframes rideBack { from { transform: translateX(calc(100vw + 140px)); } to { transform: translateX(-160px); } }
@keyframes sway { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }
@keyframes heroZoom { from { transform: scale(1); } to { transform: scale(1.09); } }
@keyframes heroSlide1 { 0%, 28% { opacity: 1; } 33%, 95% { opacity: 0; } 100% { opacity: 1; } }
@keyframes heroSlide2 { 0%, 28% { opacity: 0; } 33%, 61% { opacity: 1; } 66%, 100% { opacity: 0; } }
@keyframes heroSlide3 { 0%, 61% { opacity: 0; } 66%, 95% { opacity: 1; } 100% { opacity: 0; } }
@keyframes badgeSwing { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(2deg); } }
@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 blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes spinSlow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes glow { 0%, 100% { opacity: .25; transform: scale(1); } 50% { opacity: .45; transform: scale(1.14); } }
@keyframes dashMove { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -240; } }
@keyframes floatDrift { 0%, 100% { transform: translate(0,0) rotate(0deg); } 33% { transform: translate(10px,-14px) rotate(4deg); } 66% { transform: translate(-8px,-6px) rotate(-3deg); } }
@keyframes causticsA { from { background-position: 0 0; } to { background-position: 620px -1240px; } }
@keyframes causticsB { from { background-position: 0 0; } to { background-position: -1800px -900px; } }
@keyframes causticsLight { from { background-position: 0 0; } to { background-position: -560px -1120px; } }
@keyframes rayPulse { 0%, 100% { opacity: .06; } 50% { opacity: .1; } }
@keyframes floatCard { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
.fic-scroll::-webkit-scrollbar { display: none; }
.fic-scroll > figure { flex: 0 0 260px; box-sizing: border-box; }
@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-cards { flex-direction: row !important; flex-wrap: wrap !important; margin-left: 0 !important; }
  .hero-cards > div { margin-left: 0 !important; flex: 1 1 220px; max-width: none !important; }
  .hero-seal { right: 12px !important; bottom: 12px !important; gap: 9px !important; max-width: calc(100% - 24px) !important; }
  .hero-seal img { width: 56px !important; height: 56px !important; }
  .hero-seal span { font-size: 12px !important; line-height: 1.35 !important; max-width: 116px !important; text-shadow: 0 2px 10px rgba(1,25,38,.9) !important; }
  .fic-arrow { display: none !important; }
}
@media (max-width: 768px) {
  .wtr-b, .wtr-rays { display: none !important; }
}
@media (max-width: 480px) {
  .hero-seal img { width: 46px !important; height: 46px !important; }
  .hero-seal span { max-width: 96px !important; font-size: 11px !important; }
}
img, svg, video { max-width: 100%; }
@media (max-width: 1023px) {
  .hero-grid { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (max-width: 767px) {
  .pv-strip { animation-duration: 72s !important; } .pv-f, .pv-m { box-shadow: 0 6px 14px rgba(2,60,84,.16) !important; }
  .pv-f { width: 228px !important; }
  .pv-m { width: 340px !important; }
  .pv-box { height: 228px !important; }
  .pv-f figcaption, .pv-m figcaption { font-size: 17px !important; }
  .nav-desk { display: none !important; }
  .nav-burger { display: flex !important; }
  .mq-tilt { transform: none !important; }
  .pass-img { width: 100% !important; height: auto !important; aspect-ratio: 4/5 !important; }
  .cmp-table { display: none !important; }
  .cmp-cards { display: flex !important; }
  [style*="24px 92px"], [style*="24px 96px"], [style*="24px 84px"], [style*="24px 64px"], [style*="24px 128px"] { padding-top: 32px !important; padding-bottom: 52px !important; }
  [style*="font-size:15px"] { font-size: 16px !important; }
  [style*="font-size:13px"] { font-size: 14px !important; }
  [style*="margin-top:72px"], [style*="margin-top:76px"], [style*="margin-top:60px"] { margin-top: 40px !important; }
  header a, footer a, summary { min-height: 44px; }
  summary { padding-top: 6px !important; padding-bottom: 6px !important; }
  footer a { display: inline-flex !important; align-items: center; }
  [data-fic-dot] { height: 44px !important; box-sizing: border-box !important; padding: 18px 0 !important; background-clip: content-box !important; }
  span[style*="animation:rise"], span[style*="animation:riseShort"] { display: none !important; }
  .pac-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
  .pac-faixa { align-items: flex-start !important; padding: 22px !important; }
  .pac-foot > a { width: 100% !important; }
  .hero-cards { gap: 12px !important; }
  h1 { font-size: clamp(30px, 8.6vw, 40px) !important; }
  h2, h3 { overflow-wrap: break-word; }
}
@media (max-width: 400px) {
  .hero-grid, [style*="0 auto; padding:"] { padding-left: 16px !important; padding-right: 16px !important; }
}
.off-screen, .off-screen * { animation-play-state: paused !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; }
}