/* A contained origin effect for the first screen; the rest of the site keeps its background. */
.hero{isolation:isolate}
.hero-burst{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 50% 49%,#0c1c39 0%,#030712 46%,#010308 100%)}
.hero-burst canvas{display:block;width:100%;height:100%}
.hero-burst::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 34% 42% at 50% 49%,rgba(1,4,12,.23),transparent 100%),linear-gradient(180deg,rgba(0,0,0,.15),transparent 18%,transparent 72%,rgba(0,0,0,.75))}
@media(prefers-reduced-motion:reduce){.hero-burst::after{background:linear-gradient(180deg,rgba(0,0,0,.2),transparent 35%,rgba(0,0,0,.65))}}

/* Foreground emerges from the same nucleus as the existing canvas effect. */
.hero.hero-entrance-ready .hero-content .animate-in{animation:none;transform:none}
.hero-tag{position:relative;isolation:isolate;transition:transform .38s cubic-bezier(.2,.75,.2,1),border-color .4s,background .4s,box-shadow .4s}
.hero-tag:hover{transform:translateY(-5px) scale(1.04);border-color:rgba(87,237,173,.58);background:rgba(38,91,92,.23);box-shadow:0 18px 38px rgba(0,0,0,.28),0 0 25px rgba(16,185,129,.13)}
@property --hero-trace-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.hero-tag::before{content:"";position:absolute;inset:-2px;padding:2px;border-radius:inherit;pointer-events:none;--hero-trace-angle:0deg;background:conic-gradient(from var(--hero-trace-angle),transparent 0deg 295deg,rgba(16,185,129,.2) 310deg,#10b981 331deg,#b8ffe1 345deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:0;animation:hero-tag-trace 9s linear infinite}
@keyframes hero-tag-trace{0%,10%{--hero-trace-angle:0deg;opacity:0}13%{opacity:1}29%{--hero-trace-angle:360deg;opacity:1}34%,100%{--hero-trace-angle:360deg;opacity:0}}
@media(prefers-reduced-motion:reduce){.hero .hero-content .animate-in{animation:none;opacity:1;transform:none}.hero-tag::before{animation:none;opacity:0}.hero-tag:hover{transform:none}}

/* Match the WhatsApp hover to the green accent in the hero tag. */
.hero .btn-secondary:hover,.hero .btn-secondary:focus-visible{border-color:#10b981;color:#6af0bc;background:rgba(16,185,129,.12);box-shadow:0 0 0 1px rgba(16,185,129,.16),0 12px 32px rgba(16,185,129,.12)}

/* The highlight reveals only the letter shapes and icon strokes, one item at a time. */
.hero-trust .trust-item{position:relative;isolation:isolate;display:inline-flex;color:var(--text-dim)}
.hero-trust .trust-layer{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap}
.hero-trust .trust-layer svg{width:16px;height:16px;color:inherit}
.hero-trust .trust-gold,.hero-trust .trust-glint{position:absolute;inset:0;pointer-events:none;clip-path:inset(0 100% 0 0);will-change:clip-path}
.hero-trust .trust-gold{color:#f4d174;text-shadow:0 0 11px rgba(245,199,91,.25)}
.hero-trust .trust-glint{color:#fff8db;filter:drop-shadow(0 0 5px rgba(255,241,178,.85))}
.hero-trust .trust-item:nth-child(1) .trust-gold{animation:trust-gold-one 9s linear infinite}
.hero-trust .trust-item:nth-child(2) .trust-gold{animation:trust-gold-two 9s linear infinite}
.hero-trust .trust-item:nth-child(3) .trust-gold{animation:trust-gold-three 9s linear infinite}
.hero-trust .trust-item:nth-child(1) .trust-glint{animation:trust-glint-one 9s linear infinite}
.hero-trust .trust-item:nth-child(2) .trust-glint{animation:trust-glint-two 9s linear infinite}
.hero-trust .trust-item:nth-child(3) .trust-glint{animation:trust-glint-three 9s linear infinite}
@keyframes trust-gold-one{0%,35%{clip-path:inset(0 100% 0 0)}43%,72%{clip-path:inset(0 0 0 0)}73%,100%{clip-path:inset(0 100% 0 0)}}
@keyframes trust-gold-two{0%,44%{clip-path:inset(0 100% 0 0)}52%,72%{clip-path:inset(0 0 0 0)}73%,100%{clip-path:inset(0 100% 0 0)}}
@keyframes trust-gold-three{0%,53%{clip-path:inset(0 100% 0 0)}61%,72%{clip-path:inset(0 0 0 0)}73%,100%{clip-path:inset(0 100% 0 0)}}
@keyframes trust-glint-one{0%,35%{clip-path:inset(0 100% 0 0)}36%{clip-path:inset(0 94% 0 0)}43%{clip-path:inset(0 0 0 94%)}44%,100%{clip-path:inset(0 0 0 100%)}}
@keyframes trust-glint-two{0%,44%{clip-path:inset(0 100% 0 0)}45%{clip-path:inset(0 94% 0 0)}52%{clip-path:inset(0 0 0 94%)}53%,100%{clip-path:inset(0 0 0 100%)}}
@keyframes trust-glint-three{0%,53%{clip-path:inset(0 100% 0 0)}54%{clip-path:inset(0 94% 0 0)}61%{clip-path:inset(0 0 0 94%)}62%,100%{clip-path:inset(0 0 0 100%)}}
@media(prefers-reduced-motion:reduce){.hero-trust .trust-gold,.hero-trust .trust-glint{animation:none;visibility:hidden}}
