/* Raftyx · diseño editorial: blanco, negro, grises y naranja.
   Mobile first (360 px). Sin estilos en línea (la CSP los bloquea): todo vive aquí.
   Los colores de estado (verde/ámbar/rojo) solo indican estado. Movimiento solo con prefers-reduced-motion:no-preference. */
@font-face{font-family:Geist;font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/geist-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Geist;font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/geist-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Geist;font-weight:800;font-style:normal;font-display:swap;src:url(../fonts/geist-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:Fraunces;font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/fraunces-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Fraunces;font-weight:600;font-style:italic;font-display:swap;src:url(../fonts/fraunces-latin-600-italic.woff2) format("woff2")}

:root{
  --ink:#1D1D1F;--orange:#F26A21;--white:#fff;--bg2:#F5F5F7;
  --g1:#6E6E73;--g2:#86868B;--g3:#D2D2D7;--line:#E5E5EA;
  --ok:#2E9E5B;--warn:#E8A317;--bad:#E5493C;
  --serif:Fraunces,Georgia,"Times New Roman",serif;
  --sans:Geist,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--white);color:var(--ink);font:400 1.0625rem/1.5 var(--sans);overflow-x:hidden}
img,svg{display:block;max-width:100%}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.035em;line-height:1}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.dark :focus-visible,.on-orange :focus-visible,.card-dark :focus-visible{outline-color:var(--white)}
.on-orange :focus-visible{outline-color:var(--ink)}
.wrap{width:min(100% - 40px,1240px);margin-inline:auto}
.narrow{max-width:760px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:-999px;top:8px;background:var(--white);color:var(--ink);padding:12px 16px;z-index:60}
.skip:focus{left:8px}
.light{font-weight:400;color:var(--g2)}
.accent{font-family:var(--serif);font-style:italic;font-weight:600;letter-spacing:-.01em;color:var(--orange)}
.kicker{font-size:.8125rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--g1)}

/* Botones: píldora, 56 px, una acción clara */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 30px;border-radius:999px;border:0;font:600 1.0625rem/1.1 var(--sans);text-decoration:none;text-align:center;cursor:pointer}
.btn-dark{background:var(--ink);color:var(--white)}
.btn-orange{background:var(--orange);color:var(--ink)}
.btn-white{background:var(--white);color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-sm{min-height:44px;padding:0 20px;font-size:.9375rem}
.link{font-weight:600;display:inline-flex;align-items:center;min-height:44px}

/* Cabecera */
.site{background:var(--white);position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:12px;min-height:64px}
.brand{display:flex;align-items:center;flex:none;gap:14px;text-decoration:none;margin-right:auto}
.brand img{height:40px;width:auto}
.main-nav{display:none}
.main-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;text-decoration:none;color:var(--g1)}
.main-nav a:hover{color:var(--ink)}
.langs{display:flex}
.langs a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:44px;text-decoration:none;font-weight:600;color:var(--g1)}
.langs a[aria-current]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--orange)}
.buy{display:none}

/* Hero */
.hero{padding:28px 0 16px}
.hero-grid{display:grid;gap:40px;align-items:center}
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow i{width:10px;height:10px;border-radius:50%;background:var(--orange)}
.hero h1{margin-top:20px;font-size:clamp(2.25rem,calc(6.5vw + .5rem),4.5rem);line-height:.98;letter-spacing:-.045em}
.lead{margin-top:20px;max-width:34em;font-size:clamp(1rem,2vw,1.4375rem);line-height:1.4;color:var(--g1)}
.cta{margin-top:36px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.from{margin-top:18px;color:var(--g1);font-size:.9375rem}
.hero-visual{position:relative;display:grid;place-items:center;min-height:500px}
.disc{position:absolute;width:min(500px,100%);aspect-ratio:1;border-radius:50%;background:var(--orange)}
.phone{position:relative;width:250px;height:510px;padding:10px;border-radius:46px;background:var(--ink);box-shadow:0 40px 80px rgba(0,0,0,.28)}
.screen{height:100%;border-radius:38px;background:var(--white);padding:26px 20px 20px;display:flex;flex-direction:column;align-items:center;gap:14px}
.screen-bar{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.9375rem}
.screen-bar img{width:28px;height:28px}
.cycle{display:grid;gap:12px;justify-items:center;width:100%;margin-top:6px}
.state{display:grid;justify-items:center;gap:10px;font-weight:800;font-size:1.5rem;letter-spacing:-.02em}
.state .ring{width:120px;height:120px}
.screen-note{text-align:center;font-size:.875rem;color:var(--g1)}
.screen-btn{margin-top:auto;width:100%;min-height:48px;border-radius:999px;background:var(--ink);color:var(--white);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9375rem}
.ring{width:56px;height:56px}
.ring-md{width:64px;height:64px;flex:none}
.ring-sm{width:44px;height:44px;flex:none}

/* Lema y declaración */
.motto{padding:48px 0 8px}
.motto p{border-top:1px solid var(--line);padding-top:28px;font-size:clamp(1.5rem,6vw,4rem);line-height:1.05;letter-spacing:-.03em;font-weight:400;color:var(--g2)}
.motto b{font-weight:800;color:var(--ink)}
section{padding:64px 0}
.statement p{font-size:clamp(1.5rem,6.4vw,4.375rem);line-height:1.06;letter-spacing:-.03em;font-weight:400;color:var(--g2);max-width:1100px}
.statement b{font-weight:800;color:var(--ink)}
.statement .loss{margin-top:48px;display:grid;gap:12px}
.loss li{display:flex;align-items:center;gap:14px;background:var(--bg2);border-radius:20px;padding:14px 18px;font-size:1.0625rem;font-weight:600;letter-spacing:-.01em}
h2{font-size:clamp(1.875rem,calc(5vw + .9rem),5rem);margin-bottom:36px}

/* Tres tarjetas */
.tiles{display:grid;gap:20px}
.tile{border-radius:28px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.tile h3{margin-top:12px;font-size:clamp(1.625rem,7vw,3.5rem);line-height:1.04}
.tile .txt{margin-top:14px;max-width:30em;font-size:1rem;line-height:1.45}
.on-orange{background:var(--orange);color:var(--ink)}
.card-dark{background:var(--ink);color:var(--white)}
.card-dark .kicker{color:#A1A1A6}
.card-dark .txt{color:#A1A1A6}
.card-grey{background:var(--bg2)}
.card-grey .txt{color:var(--g1)}
.tile-wide{grid-column:1/-1;min-height:0}
.notif{background:var(--white);border-radius:22px;padding:16px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 18px 40px rgba(0,0,0,.16);color:var(--ink)}
.notif .app{flex:none;width:44px;height:44px;border-radius:12px;background:var(--ink);display:grid;place-items:center}
.notif .app img{width:30px;height:30px}
.notif small{display:block;font-size:.8125rem;color:var(--g1);font-weight:600}
.notif strong{font-size:1rem;line-height:1.3}
.code{background:#000;border-radius:18px;padding:20px 22px;font:.875rem/1.75 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--line);overflow-x:auto}
.code .c{color:var(--g2)}.code .v{color:var(--orange)}
.tag{display:inline-block;margin-left:10px;border:1.5px solid var(--orange);color:var(--orange);border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:600;letter-spacing:0;text-transform:none}
.stack{display:grid;gap:10px;margin-top:8px}
.row{background:var(--white);border-radius:18px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-weight:600}
.row span:last-child{color:var(--g1);font-weight:400}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:12px}
.dot-ok{background:var(--ok)}.dot-warn{background:var(--warn)}.dot-bad{background:var(--bad)}

/* Cómo funciona */
.steps{display:grid;gap:40px 28px}
.step{display:grid;gap:18px}
.visual{background:var(--bg2);border-radius:24px;min-height:240px;overflow:hidden;display:grid;place-items:center;padding:24px}
.big-n{font-size:3rem;font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--g3)}
.step h3{margin-top:6px;font-size:1.75rem;letter-spacing:-.02em}
.step p{margin-top:8px;color:var(--g1)}
.fields{display:grid;gap:10px;width:min(220px,100%)}
.fields i{display:flex;align-items:center;min-height:40px;padding:0 14px;border-radius:12px;background:var(--white);color:var(--g1);font-style:normal;font-size:.875rem}
.fields b{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:999px;background:var(--orange);font-size:.875rem}
.qr{position:relative;width:190px;height:190px;background:var(--white);border-radius:22px;display:grid;place-items:center;overflow:hidden}
.qr svg{width:140px;height:140px}
.scan{position:absolute;left:14px;right:14px;top:8%;height:3px;border-radius:2px;background:var(--orange);box-shadow:0 0 14px var(--orange)}
.cert{width:210px;background:var(--white);border-radius:18px;padding:20px;display:grid;gap:12px;box-shadow:0 20px 40px rgba(0,0,0,.12)}
.cert header{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.9375rem}
.cert header img{width:28px;height:28px}
.cert .l{height:8px;border-radius:4px;background:var(--line)}
.cert .l2{width:70%}.cert .l3{width:85%}
.pill{justify-self:start;display:inline-flex;align-items:center;gap:8px;border-radius:999px;background:var(--bg2);padding:6px 12px;font-size:.8125rem;font-weight:600}
.extra{margin-top:48px;display:flex;align-items:center;gap:14px;font-size:1.25rem;font-weight:600}

/* Ecosistema */
.eco{background:var(--bg2)}
.eco-grid{display:grid;gap:56px;align-items:center}
.wheel{width:100%;max-width:520px;margin-inline:auto;height:auto}
.wheel .seg{fill:var(--white);stroke:var(--line)}
.wheel .seg-on{fill:var(--orange)}
.wheel text{fill:var(--ink);font-family:Geist,sans-serif;text-anchor:middle}
.wheel .t1{font-size:17px;font-weight:600}.wheel .t2{font-size:13px}
.eco h2{margin-bottom:36px}
.eco-list li{border-top:1px solid var(--g3);padding:20px 0}
.eco-list li:last-child{border-bottom:1px solid var(--g3)}
.eco-list b{display:block;font-size:1.25rem;font-weight:800;letter-spacing:-.01em}
.eco-list span{color:var(--g1)}

/* Precios y compra */
.price-grid{display:grid;gap:20px}
.plan{min-width:0;background:var(--bg2);border-radius:28px;padding:28px 22px;display:flex;flex-direction:column;gap:20px}
.plan-main{box-shadow:inset 0 0 0 3px var(--orange)}
.plan h3{font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--g1);font-weight:600}
.amount{display:flex;align-items:baseline;gap:8px;font-size:clamp(2.25rem,6vw,4.5rem);flex-wrap:wrap;font-weight:800;letter-spacing:-.05em;line-height:1}
.amount small{font-size:1.25rem;font-weight:400;letter-spacing:0;color:var(--g1)}
.plan .desc{color:var(--g1)}
.perks{display:grid;gap:12px}
.perks li{display:flex;gap:12px;align-items:flex-start}
.tick{width:20px;height:20px;flex:none;margin-top:3px;color:var(--ink)}
.plan .btn{margin-top:auto;width:100%}
.plan-dark{background:var(--ink);color:var(--white)}
.plan-dark h3,.plan-dark .desc{color:#A1A1A6}
.plan-dark .hello{font-size:3.5rem;font-weight:800;letter-spacing:-.04em;line-height:1}
.assure{margin-top:32px;display:flex;flex-wrap:wrap;gap:12px 28px;color:var(--g1);font-size:.9375rem}
.assure li{display:flex;align-items:center;gap:8px}
.assure .tick{width:18px;height:18px;margin:0}
.fine{margin-top:20px;font-size:.875rem;color:var(--g1);max-width:60em}

/* Europa */
.eu-grid{display:grid;gap:32px;align-items:center}
.map{width:100%;max-width:380px;margin-inline:auto;height:auto}
.map .rest{fill:var(--line)}
.map .spain{fill:var(--orange)}
.eu-text{font-size:clamp(1.5rem,6.4vw,3.5rem);font-weight:800;line-height:1.05;letter-spacing:-.035em}

/* CTA final */
.final{background:var(--orange);padding:72px 0 0}
.final h2{font-size:clamp(2.5rem,13vw,8rem);line-height:.95;letter-spacing:-.045em;margin-bottom:28px}
.final .lead{color:var(--ink)}
.final .light{color:var(--ink);font-weight:400}
.form{display:grid;gap:14px;margin-top:36px;max-width:640px}
.form label{font-weight:600;font-size:.9375rem}
.form-row{display:flex;flex-wrap:wrap;gap:12px}
.form input[type=email],.form input[type=text],.form select,.form textarea{width:100%;min-height:56px;padding:12px 24px;border:2px solid var(--ink);border-radius:999px;background:var(--white);font:400 1.0625rem var(--sans);color:var(--ink)}
.form-row input[type=email]{flex:1 1 280px;width:auto;min-width:0;border-color:var(--white)}
.form select{border-radius:20px}
.form textarea{min-height:160px;resize:vertical;border-radius:24px}
.consent{display:flex;gap:12px;align-items:flex-start;font-weight:400!important;line-height:1.4}
.consent input{width:24px;height:24px;flex:none;margin-top:1px;accent-color:var(--ink)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{padding:14px 20px;border-radius:18px;font-weight:600;margin-top:24px;background:var(--white);border-left:6px solid var(--ink);max-width:640px}
.notice-ok{border-left-color:var(--ok)}
.notice-invalid,.notice-fail{border-left-color:var(--bad)}
.stores{margin-top:40px;display:flex;flex-wrap:wrap;gap:12px}
.stores span{border:2px solid var(--ink);border-radius:999px;padding:12px 20px;font-weight:600;font-size:.9375rem}
.waves{margin-top:40px;height:70px;position:relative;overflow:hidden}
.waves svg{position:absolute;left:0;bottom:0;width:200%;height:100%}
.w2{height:75%}

/* FAQ */
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{min-height:64px;display:flex;align-items:center;font-weight:600;font-size:1.25rem;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;font-size:1.75rem;font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq p{padding:0 0 22px;color:var(--g1);max-width:44em}

/* Pie */
footer.foot-site{background:var(--bg2);padding:56px 0 32px}
.foot{display:grid;gap:32px}
.foot-brand{display:flex;align-items:center;gap:16px}
.foot-brand img{height:64px;width:auto;max-width:100%}
.foot-tag{margin-top:12px;color:var(--g1);font-size:.9375rem}
.foot ul{display:flex;flex-wrap:wrap;gap:0 24px}
.foot ul a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--g1)}
.foot ul a:hover{color:var(--ink)}
.foot-lang{display:flex}
.foot-lang a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;text-decoration:none;font-weight:600;color:var(--g1)}
.foot-lang a[aria-current]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--orange)}
.copy{margin-top:32px;font-size:.8125rem;color:var(--g1)}

/* Páginas legales y contacto */
.legal{padding:64px 0 96px}
.legal h1{font-size:clamp(2.25rem,6vw,3.75rem);margin-bottom:12px}
.legal h2{font-size:1.5rem;letter-spacing:-.02em;margin:40px 0 12px}
.legal p,.legal li{margin-top:12px;color:#3A3A3C}
.legal ul{list-style:disc;padding-left:22px}
.legal .upd{color:var(--g1);font-size:.9375rem}
.draft{display:inline-block;margin:8px 0 24px;padding:10px 16px;border:2px solid var(--ink);border-radius:14px;font-weight:600}
.legal .btn{margin-top:40px}
.legal .form{margin-top:28px}

@media (min-width:720px){
  .brand img{height:44px}
  .buy{display:inline-flex}
  .plan-dark{grid-column:1/-1}
  .bar{min-height:84px}
  .hero{padding:72px 0 24px}
  section{padding:96px 0}
  .tile{min-height:460px;gap:32px;padding:clamp(28px,4vw,48px)}
  .big-n{font-size:4.5rem}
  .visual{height:290px}
  .steps{align-items:start}
  .brand{margin-right:0}
  .bar{justify-content:space-between}
  .hero{padding:72px 0 24px}
  .tiles{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:repeat(3,1fr)}
  .tile-wide{flex-direction:row;align-items:center}
  .tile-wide>*{flex:1}
  .price-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
  .eco-grid,.eu-grid{grid-template-columns:1fr 1fr}
  .foot{grid-template-columns:1fr auto;align-items:start}
  .foot ul{grid-column:1/-1}
}

.captcha-l{font-weight:600;font-size:.9375rem}
.form .captcha{max-width:140px;text-align:center;border-color:var(--ink)}
.cookie{position:fixed;left:10px;right:10px;bottom:10px;z-index:70;max-width:720px;margin-inline:auto;background:var(--ink);color:var(--white);border-radius:18px;padding:12px 14px;display:flex;align-items:center;gap:12px;box-shadow:0 20px 50px rgba(0,0,0,.3)}
.cookie[hidden]{display:none}
.cookie p{flex:1 1 auto;font-size:.8125rem;line-height:1.35}
.cookie .btn{flex:none}
.cookie a{text-decoration:underline}
.cookie .btn{background:var(--white);color:var(--ink)}
.cookie :focus-visible{outline-color:var(--white)}
.typing::after{content:none}
.caret::after{content:"";display:inline-block;width:.06em;height:.9em;margin-left:.06em;background:var(--orange);vertical-align:-.08em}
.lead .caret::after{height:1em;width:2px;background:var(--ink)}

@media (max-width:340px){
  .brand img{height:32px}
}
@media (max-width:420px){
  .brand img{height:40px}
  .plan{padding:28px 22px}
}
@media (min-width:1024px){
  .main-nav{display:flex}
  .plan-dark{grid-column:auto}
  .brand img{height:52px}
  .hero-grid{grid-template-columns:1.1fr .9fr}
  .hero h1{font-size:clamp(3rem,5.6vw,4.75rem)}
}

/* ---------- Movimiento ---------- */
@media (prefers-reduced-motion:no-preference){
  .btn{transition:transform .2s ease}
  .btn:hover{transform:translateY(-2px)}
  .float{animation:float 6s ease-in-out infinite}
  .cycle{grid-template-areas:"s"}
  .state{grid-area:s;opacity:0;animation:cyc 9s ease-in-out infinite}
  .state-warn{animation-delay:3s}
  .state-bad{animation-delay:6s}
  .scan{animation:scan 2.4s ease-in-out infinite alternate}
  .w1{animation:drift 20s linear infinite reverse}
  .w2{animation:drift 12s linear infinite}
  [data-io]:not(.in) *{animation-play-state:paused!important}
  .reveal{opacity:0;transform:translateY(40px);transition:opacity .6s ease,transform .6s ease}
  .in .reveal{opacity:1;transform:none}
  .r2{transition-delay:.08s}.r3{transition-delay:.16s}.r4{transition-delay:.24s}
}
@media (prefers-reduced-motion:reduce){
  .state{opacity:0}.state-ok{opacity:1}
}
@media (prefers-reduced-motion:no-preference){
  /* Destellos sutiles en botones */
  .btn{position:relative;overflow:hidden;isolation:isolate}
  .btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.5) 50%,transparent 62%);transform:translateX(-130%);animation:glint 6s ease-in-out infinite}
  .btn-white::after,.btn-ghost::after{background:linear-gradient(105deg,transparent 38%,rgba(242,106,33,.28) 50%,transparent 62%)}
  .btn-orange::after{animation-delay:1.5s}
  .btn-dark::after{animation-delay:3s}
  .btn:focus-visible,.btn:hover{box-shadow:0 8px 24px rgba(29,29,31,.2)}
  .btn:hover::after{animation-duration:1.2s}

  /* Titulares: se forman palabra a palabra */
  .js [data-io] h2 .w{display:inline-block;opacity:0;transform:translateY(.55em);filter:blur(8px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1),filter .6s ease}
  .js [data-io].in h2 .w{opacity:1;transform:none;filter:none}

  /* Fichas: se "construyen" de arriba abajo y sus líneas aparecen una a una */
  .js .plan.reveal,.js .tile.reveal{clip-path:inset(0 0 100% 0 round 32px);opacity:1;transform:none;transition:clip-path .9s cubic-bezier(.2,.7,.2,1)}
  .js .in .plan.reveal,.js .in .tile.reveal{clip-path:inset(0 0 -1px 0 round 32px)}
  .js .plan .perks li,.js .plan .amount,.js .plan .desc{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
  .js .in .plan .perks li,.js .in .plan .amount,.js .in .plan .desc{opacity:1;transform:none}
  .js .in .plan .amount{transition-delay:.45s}
  .js .in .plan .desc{transition-delay:.6s}
  .js .in .plan .perks li:nth-child(1){transition-delay:.75s}
  .js .in .plan .perks li:nth-child(2){transition-delay:.9s}
  .js .in .plan .perks li:nth-child(3){transition-delay:1.05s}
  .js .in .plan .perks li:nth-child(4){transition-delay:1.2s}
  .js .in .r2.plan{transition-delay:.15s}
  .js .in .r3.plan{transition-delay:.3s}
}
@keyframes blink{50%{opacity:0}}
@media (prefers-reduced-motion:no-preference){.caret-end::after{animation:blink 1s steps(1) infinite}}
@keyframes glint{0%,55%{transform:translateX(-130%)}80%,100%{transform:translateX(130%)}}
@keyframes cyc{0%{opacity:0}6%,30%{opacity:1}36%,100%{opacity:0}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes scan{from{top:8%}to{top:84%}}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}