/* Talão receipt card (from src/index.css:102-140) */
.talao-serrated-top {
  -webkit-mask:
    linear-gradient(#000, #000) 0 10px / 100% calc(100% - 10px) no-repeat,
    radial-gradient(circle 5px at 50% 0, transparent 98%, #000 100%) 0 0 / 10px 10px repeat-x;
  mask:
    linear-gradient(#000, #000) 0 10px / 100% calc(100% - 10px) no-repeat,
    radial-gradient(circle 5px at 50% 0, transparent 98%, #000 100%) 0 0 / 10px 10px repeat-x;
}
.talao-perforation { position: relative; height: 0; border-top: 2px dashed #E2E8E4; margin: 0 14px; }
.talao-perforation::before, .talao-perforation::after {
  content: ''; position: absolute; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px; border-radius: 50%; background: var(--talao-notch-bg, #EAEEEC);
}
.talao-perforation::before { left: -21px; }
.talao-perforation::after { right: -21px; }

/* Scroll reveal (from src/index.css:145-149) */
.reveal-up { opacity: 0; transform: translateY(24px); transition: opacity .75s cubic-bezier(.22,.68,.3,1), transform .75s cubic-bezier(.22,.68,.3,1); }
.reveal-left { opacity: 0; transform: translateX(-26px); transition: opacity .75s cubic-bezier(.22,.68,.3,1), transform .75s cubic-bezier(.22,.68,.3,1); }
.reveal-right { opacity: 0; transform: translateX(26px); transition: opacity .75s cubic-bezier(.22,.68,.3,1), transform .75s cubic-bezier(.22,.68,.3,1); }
.reveal-scale { opacity: 0; transform: scale(.955); transition: opacity .75s cubic-bezier(.22,.68,.3,1), transform .75s cubic-bezier(.22,.68,.3,1); }
.reveal-visible { opacity: 1; transform: none; }

/* Hero entrance (from src/index.css:151-168) */
.hero-phone { animation: hero-phone-in 1s cubic-bezier(.22,.68,.3,1) both; }
@keyframes hero-phone-in { from { opacity: 0; transform: translateY(38px) rotate(1.5deg); } to { opacity: 1; transform: translateY(0) rotate(0); } }
.hero-talao { animation: hero-talao-in .75s cubic-bezier(.22,.68,.3,1) .5s both; }
@keyframes hero-talao-in { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
.hero-talao-inner { animation: talao-float 5.5s ease-in-out 1.25s infinite; }
@keyframes talao-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }

/* Pulse dot (from src/index.css:171-182) */
.pulse-dot { position: relative; }
.pulse-dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid rgb(134 239 172); animation: pulse-ring 2s ease-out infinite;
}
@keyframes pulse-ring { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(2.75); opacity: 0; } }

/* Steps line/circle (from src/index.css:185-195) */
.steps-line { width: 0; transition: width 1.5s cubic-bezier(.22,.68,.3,1) .25s; }
.steps-line.grow { width: 80%; }
.steps-circle { opacity: 0; transform: scale(.4); }
.steps-circle.bounce { animation: circle-bounce .6s cubic-bezier(.3,1.6,.5,1) forwards; }
@keyframes circle-bounce { 0% { opacity: 0; transform: scale(.4); } 60% { opacity: 1; transform: scale(1.12); } 100% { opacity: 1; transform: scale(1); } }

/* Invoice fall (from src/index.css:198-200) */
.invoice-row { opacity: 0; transform: translateY(14px); }
.invoice-row.fall { animation: invoice-fall .75s cubic-bezier(.22,.68,.3,1) forwards; }
@keyframes invoice-fall { to { opacity: 1; transform: translateY(0); } }

/* Card / button hover (from src/index.css:215-227) */
.card-hover { transition: transform .3s cubic-bezier(.22,.68,.3,1), box-shadow .3s cubic-bezier(.22,.68,.3,1); }
.card-hover:hover { transform: translateY(-5px); box-shadow: 0 12px 32px -8px rgba(16,33,28,.22); }
.btn-hover { transition: transform .3s cubic-bezier(.22,.68,.3,1), box-shadow .3s cubic-bezier(.22,.68,.3,1), background-color .3s; }
.btn-hover:hover { transform: translateY(-2px); }
.btn-primary-hover:hover { box-shadow: 0 8px 20px -6px hsla(166,74%,21%,.5); }
.problem-card .problem-bar { transition: background-color .3s; }
.problem-card:hover .problem-bar { background-color: hsl(166 74% 21%); }
.problem-card .problem-text { transition: transform .3s cubic-bezier(.22,.68,.3,1); }
.problem-card:hover .problem-text { transform: translateX(4px); }

/* Scroll progress bar (from src/index.css:230-239) */
.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: linear-gradient(90deg, hsl(166 74% 21%), hsl(37 79% 57%)); z-index: 100; transition: width .1s linear; }

/* Navbar scrolled state (new — replaces React scrolled boolean) */
[data-navbar] { position: fixed; top: 0; left: 0; right: 0; z-index: 50; transition: all .3s; background: rgba(240,244,241,.8); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
[data-navbar].navbar-scrolled { background: rgba(240,244,241,.95); box-shadow: 0 2px 8px -2px rgba(16,33,28,.08); }

/* Focus-visible gold outline (from src/index.css:242-245) */
*:focus-visible { outline: 2px solid var(--gold) !important; outline-offset: 3px; }

/* Reduced motion (from src/index.css:305-320) */
@media (prefers-reduced-motion: reduce) {
  .reveal-up, .reveal-left, .reveal-right, .reveal-scale { opacity: 1 !important; transform: none !important; transition: none !important; }
  .hero-phone, .hero-talao, .hero-talao-inner, .pulse-dot::after, .steps-circle, .invoice-row { animation: none !important; opacity: 1 !important; transform: none !important; }
  .steps-line { width: 80% !important; transition: none !important; }
  .scroll-progress { display: none !important; }
  .card-hover:hover, .btn-hover:hover { transform: none !important; }
}