/* =====================================================================
   Recrutement · charte Gilles-christ Nouetowa (dark teal + jaune + crème)
   Page sans entête, sans menu, sans pied de page : un seul bandeau
   d'annonce en haut, une barre d'action collante en bas.
   ===================================================================== */
:root{
  --deep:#0a1f28; --teal:#0e2733; --teal-2:#123443;
  --cream:#F0EADD; --cream-soft:rgba(240,234,221,.72); --cream-faint:rgba(240,234,221,.46);
  --yellow:#FFE642; --yellow-2:#FFEC4D; --wa:#25D366; --red:#E5484D;
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --wrap:780px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);background:var(--deep);color:var(--cream);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;padding-bottom:104px;
}
/* fond continu : les sections se suivent sans bordure visible */
body::before{
  content:'';position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(1100px 640px at 12% -6%, #16455a 0%, transparent 58%),
    radial-gradient(900px 760px at 96% 28%, #123443 0%, transparent 55%),
    radial-gradient(900px 700px at 50% 108%, #10303e 0%, transparent 60%),
    linear-gradient(180deg,#0e2733 0%,#0a1f28 55%,#081a22 100%);
}
body::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.32;
  background-image:radial-gradient(rgba(240,234,221,.16) 1px, transparent 1px);
  background-size:3px 3px;mix-blend-mode:overlay;
}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
section{padding:clamp(30px,5.5vw,56px) 0;position:relative}

h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.1;letter-spacing:-.015em}
h1{font-size:clamp(31px,7.4vw,54px);font-weight:900}
h2{font-size:clamp(24px,4.6vw,36px);margin-bottom:16px}
h3{font-size:clamp(18px,2.2vw,21px);line-height:1.25}
p{font-size:clamp(15.5px,1.6vw,17px)}
a{color:inherit}
em{font-style:normal}

/* trait de marqueur fluo, suit chaque ligne */
.hl{
  display:inline;color:var(--deep);
  background-image:linear-gradient(var(--yellow),var(--yellow));
  background-repeat:no-repeat;background-size:100% 100%;
  padding:.02em .16em;border-radius:.3em .52em .32em .48em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
/* le marqueur se trace au chargement */
.enter .hl{animation:hlDraw .9s cubic-bezier(.16,1,.3,1) .55s both}
@keyframes hlDraw{from{background-size:0% 100%;color:var(--cream)}to{background-size:100% 100%;color:var(--deep)}}

/* ---------- bandeau d'annonce ---------- */
.topbar{
  position:sticky;top:0;z-index:40;background:var(--yellow);color:var(--deep);
  font-weight:800;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  text-align:center;padding:10px 14px;line-height:1.35;
}

/* ---------- héros ---------- */
.hero{padding-top:clamp(28px,5vw,52px);padding-bottom:clamp(20px,4vw,40px)}
.kicker{
  display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cream-soft);border:1px solid rgba(240,234,221,.22);
  padding:7px 15px;border-radius:999px;margin-bottom:20px;
}
.hero h1{max-width:16ch}
.lead{font-size:clamp(16.5px,2vw,19.5px);color:var(--cream-soft);margin-top:20px;max-width:56ch}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-size:11.5px;font-weight:800;letter-spacing:.19em;text-transform:uppercase;
  color:var(--yellow);margin-bottom:14px;
}
.eyebrow::before{content:'';width:26px;height:2px;background:var(--yellow);border-radius:2px}

/* maquette de timeline de montage (aucune image à charger) */
.tl{
  margin-top:30px;border-radius:20px;overflow:hidden;
  background:linear-gradient(180deg,#0c2a37,#0a2230);border:1px solid rgba(240,234,221,.14);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.9);
}
.tl-head{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid rgba(240,234,221,.1);font-size:12px;color:var(--cream-faint)}
.tl-head .dot{width:10px;height:10px;border-radius:50%;background:rgba(240,234,221,.2)}
.tl-head .dot.y{background:var(--yellow)}
.tl-head .name{margin-left:8px;font-weight:600;color:var(--cream-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-head .time{margin-left:auto;font-variant-numeric:tabular-nums}
.tl-preview{
  position:relative;aspect-ratio:16/7;display:grid;place-items:center;
  background:
    radial-gradient(420px 200px at 30% 40%, rgba(255,230,66,.14), transparent 60%),
    linear-gradient(135deg,#123443,#0b2431);
}
.tl-preview .play{
  width:54px;height:54px;border-radius:50%;background:var(--yellow);color:var(--deep);
  display:grid;place-items:center;font-size:20px;font-weight:900;padding-left:4px;
  box-shadow:0 14px 40px -10px rgba(255,230,66,.8);
}
.tl-preview .sub{
  position:absolute;bottom:12px;left:50%;transform:translateX(-50%);
  background:rgba(10,31,40,.85);color:var(--cream);font-weight:800;font-size:13px;
  padding:6px 12px;border-radius:8px;white-space:nowrap;
}
.tl-preview .sub b{color:var(--yellow)}
.tl-tracks{position:relative;padding:12px 14px 14px;display:grid;gap:7px}
.tl-track{position:relative;height:22px;border-radius:6px;background:rgba(240,234,221,.05)}
.tl-track .lab{position:absolute;left:8px;top:3px;font-size:10.5px;font-weight:800;letter-spacing:.08em;color:var(--cream-faint);z-index:2}
.tl-track i{position:absolute;top:3px;height:16px;border-radius:4px}
.tl-track i.v{background:linear-gradient(180deg,#2b7a8c,#1d5d6c)}
.tl-track i.y{background:var(--yellow);opacity:.9}
.tl-track i.a{background:repeating-linear-gradient(90deg,#2e8a5a 0 3px,#1f6b44 3px 6px)}
.tl-track i.a2{background:repeating-linear-gradient(90deg,#c9a800 0 2px,#8a7400 2px 5px);opacity:.75}
.tl-play{position:absolute;top:8px;bottom:10px;width:2px;background:var(--red);left:42%;z-index:3}
.tl-play::before{content:'';position:absolute;top:-6px;left:-5px;border:6px solid transparent;border-top:8px solid var(--red)}

/* questions qualifiantes */
.qualif{
  margin-top:28px;border-radius:22px;padding:20px 20px 22px;
  background:linear-gradient(180deg,rgba(240,234,221,.07),rgba(240,234,221,.03));
  border:1px solid rgba(240,234,221,.12);
}
.qualif p{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid rgba(240,234,221,.1);font-size:16px;line-height:1.5}
.qualif p::before{content:'✓';color:var(--yellow);font-weight:900;flex:none}
.qualif p:last-of-type{border-bottom:0}
.punch{display:block;margin-top:12px;font-family:var(--serif);font-weight:900;font-size:21px;color:var(--yellow)}

/* ---------- boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;
  font-family:var(--sans);font-weight:800;font-size:16.5px;text-decoration:none;line-height:1.2;
  padding:17px 30px;border-radius:999px;
  transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .25s,filter .2s;
}
.btn-main{background:var(--yellow);color:var(--deep);box-shadow:0 18px 44px -18px rgba(255,230,66,.75)}
.btn-main:hover{transform:translateY(-2px);box-shadow:0 22px 56px -16px rgba(255,230,66,.9)}
.btn-main:disabled{opacity:.7;cursor:wait;transform:none}
.btn-ghost{color:var(--cream);border:1px solid rgba(240,234,221,.28);background:transparent}
.btn-ghost:hover{border-color:var(--yellow);color:var(--yellow)}
.btn-wa{background:var(--wa);color:#fff;box-shadow:0 18px 44px -18px rgba(37,211,102,.8)}
.btn-wa:hover{transform:translateY(-2px)}
.btn-wa svg{width:22px;height:22px;fill:currentColor}
.btn-full{display:flex;width:100%}
.btn-sub{display:block;font-size:12.5px;font-weight:600;color:var(--cream-faint);text-align:center;margin-top:9px}
.hero .btn{margin-top:26px}

/* ---------- listes et blocs ---------- */
.bul{list-style:none;display:grid;gap:10px}
.bul li{
  display:flex;gap:13px;align-items:flex-start;font-size:16px;line-height:1.5;
  padding:13px 15px;border-radius:14px;
  background:linear-gradient(180deg,rgba(240,234,221,.05),rgba(240,234,221,.02));
}
.bul li::before{
  content:'';flex:none;width:21px;height:21px;margin-top:2px;border-radius:50%;
  background:rgba(255,230,66,.16);border:1px solid rgba(255,230,66,.45);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFE642' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size:13px;background-repeat:no-repeat;background-position:center;
}
.bul li b{font-weight:800}
.note{font-size:14.5px;color:var(--cream-soft);margin-top:16px}

.about p{color:var(--cream-soft);margin-bottom:12px}
.about p strong{color:var(--cream);font-weight:800}
.founder{display:flex;align-items:center;gap:16px;margin:18px 0 6px}
.founder .av{
  width:64px;height:64px;border-radius:50%;flex:none;
  background:linear-gradient(140deg,var(--yellow),#c9a800);
  display:grid;place-items:center;font-family:var(--serif);font-weight:900;font-size:24px;color:var(--deep);
  box-shadow:0 0 0 5px rgba(255,230,66,.13);overflow:hidden;
}
.founder .av img{width:100%;height:100%;object-fit:cover}
.founder b{display:block;font-family:var(--serif);font-size:18px}
.founder span{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
.stat{padding:16px 10px;border-radius:16px;border:1px solid rgba(255,230,66,.22);background:rgba(255,230,66,.06);text-align:center}
.stat b{display:block;font-family:var(--serif);font-size:18px;color:var(--yellow);line-height:1.2;margin-bottom:4px}
.stat span{font-size:12.5px;color:var(--cream-soft);line-height:1.35;display:block}

.hours{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}
.hour{padding:16px;border-radius:16px;background:rgba(240,234,221,.05);border:1px solid rgba(240,234,221,.1)}
.hour .ic{font-size:22px;display:block;margin-bottom:8px}
.hour b{display:block;font-size:15px;margin-bottom:3px}
.hour span{font-size:13.5px;color:var(--cream-soft);line-height:1.45;display:block}

.pay{
  border-radius:24px;padding:26px 22px;
  background:linear-gradient(155deg,rgba(255,230,66,.14),rgba(240,234,221,.05) 45%,rgba(240,234,221,.02));
  border:1px solid rgba(255,230,66,.3);
}
.pay h2{margin-bottom:10px}
.pay ul{list-style:none;display:grid;gap:12px;margin:16px 0 14px}
.pay li{display:flex;gap:12px;font-size:16px;line-height:1.5}
.pay li::before{content:'●';color:var(--yellow);flex:none;font-size:12px;margin-top:6px}
.pay li b{font-weight:800}
.pay .after{font-size:14px;color:var(--cream-faint)}

.warn{
  display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:16px;
  border:1px solid rgba(255,230,66,.35);background:rgba(255,230,66,.08);margin-top:18px;
}
.warn span{font-size:24px;line-height:1;flex:none}
.warn p{font-size:15px;line-height:1.55}
.warn strong{font-weight:800}

.steps{display:grid;gap:10px;margin-bottom:6px}
.step{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:rgba(240,234,221,.05)}
.step b{flex:none;width:32px;height:32px;border-radius:50%;background:var(--yellow);color:var(--deep);display:grid;place-items:center;font-weight:900;font-size:15px}
.step.wa b{background:var(--wa);color:#fff}
.step p{font-size:15.5px;line-height:1.5}
.step p strong{font-weight:800}

/* ---------- formulaire ---------- */
.formbox{
  margin-top:26px;border-radius:26px;padding:28px 22px 26px;position:relative;
  background:linear-gradient(180deg,rgba(240,234,221,.08),rgba(240,234,221,.03));
  border:1px solid rgba(240,234,221,.16);box-shadow:0 40px 90px -50px rgba(0,0,0,.9);
}
.formbox h2{text-align:center;margin-bottom:8px}
.formbox>p{text-align:center;color:var(--cream-soft);margin-bottom:22px;font-size:15px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:700;margin-bottom:7px}
.req{color:var(--yellow)}
.field input,.field select{
  width:100%;font-family:var(--sans);font-size:16px;color:var(--cream);
  background:rgba(240,234,221,.07);border:1px solid rgba(240,234,221,.22);
  padding:14px 16px;border-radius:14px;transition:border-color .2s,background .2s;
  appearance:none;-webkit-appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F0EADD' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:18px;padding-right:46px;
}
.field select option{color:#111;background:#fff}
.field input::placeholder{color:var(--cream-faint)}
.field input:focus,.field select:focus{outline:none;border-color:var(--yellow);background:rgba(240,234,221,.11)}
.field .hint{display:block;font-size:12.5px;color:var(--cream-faint);margin-top:6px}
.field.bad input,.field.bad select{border-color:var(--red);background:rgba(229,72,77,.08)}
.field .err{display:none;font-size:12.5px;color:#ff8a8e;margin-top:6px;font-weight:600}
.field.bad .err{display:block}
.phone{display:flex;gap:8px}
.phone .cc{
  flex:none;display:flex;align-items:center;gap:7px;padding:0 14px;border-radius:14px;
  border:1px solid rgba(240,234,221,.22);background:rgba(240,234,221,.07);font-weight:700;font-size:15px;
}
.phone input{flex:1;min-width:0}
.hp{position:absolute;left:-9999px;top:0;opacity:0;height:0;width:0;overflow:hidden}
.formbox .btn{margin-top:6px}
.trust{font-size:12.5px;color:var(--cream-faint);text-align:center;margin-top:14px;line-height:1.5}
.formmsg{display:none;margin-top:12px;padding:12px 14px;border-radius:12px;background:rgba(229,72,77,.12);border:1px solid rgba(229,72,77,.4);font-size:14px}
.formmsg.on{display:block}

.legal{text-align:center;font-size:12.5px;color:var(--cream-faint);padding:30px 20px 6px}

/* barre d'action collante */
.bar{
  position:fixed;left:0;right:0;bottom:0;z-index:45;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(10,31,40,.84);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid rgba(240,234,221,.1);transition:transform .35s cubic-bezier(.16,1,.3,1);
}
.bar .btn{display:flex;width:100%;max-width:520px;margin:0 auto;padding:15px 24px}
.bar.hide{transform:translateY(110%)}

/* ---------- pages merci / refus ---------- */
.card{
  margin:clamp(26px,6vw,60px) auto 0;max-width:560px;border-radius:28px;padding:32px 24px;text-align:center;
  background:linear-gradient(180deg,rgba(240,234,221,.08),rgba(240,234,221,.03));
  border:1px solid rgba(240,234,221,.16);box-shadow:0 40px 90px -50px rgba(0,0,0,.9);
}
.card .ic{
  width:72px;height:72px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;
  background:var(--yellow);color:var(--deep);box-shadow:0 16px 40px -12px rgba(255,230,66,.8);
}
.card .ic svg{width:34px;height:34px;stroke:currentColor;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.card .ic.neutral{background:rgba(240,234,221,.14);color:var(--cream)}
.badge{
  display:inline-block;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  padding:7px 16px;border-radius:999px;margin-bottom:16px;background:rgba(255,230,66,.14);color:var(--yellow);
}
.badge.red{background:var(--red);color:#fff;box-shadow:0 8px 20px rgba(229,72,77,.35)}
.card h1{font-size:clamp(28px,6vw,40px)}
.card .sub{color:var(--cream-soft);margin-top:12px}
.recap{margin:20px 0 0;padding:14px 16px;border-radius:14px;background:rgba(240,234,221,.06);font-size:14.5px;text-align:left}
.recap b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);margin-bottom:6px}
.card .steps{text-align:left;margin:22px 0}
.step.done b{background:rgba(255,230,66,.25);color:var(--yellow)}
.step.todo b{background:rgba(240,234,221,.12);color:var(--cream-soft)}
.card .btn{margin-top:6px}
.card .pulse{font-size:13px;font-weight:700;color:var(--cream-soft);margin:18px 0 10px;letter-spacing:.04em}
.card .small{font-size:13px;color:var(--cream-faint);margin-top:14px;line-height:1.5}
.why{margin:18px 0;padding:16px 18px;border-radius:16px;background:rgba(240,234,221,.06);text-align:left}
.why b{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);margin-bottom:8px}
.why p{font-size:15px;color:var(--cream-soft)}

/* ---------- apparition au défilement ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:640px){
  .stats{grid-template-columns:1fr 1fr}
  .stats .stat:last-child{grid-column:1 / -1}
  .hours{grid-template-columns:1fr}
  .tl-preview .sub{font-size:11.5px;white-space:normal;text-align:center;max-width:90%}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}


/* =====================================================================
   Animations
   ===================================================================== */
/* entrée du héros, en cascade */
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.enter .kicker,.enter h1,.enter .lead,.enter > .wrap > .btn,.enter .btn-sub{animation:rise .9s cubic-bezier(.16,1,.3,1) both}
.enter .kicker{animation-delay:.05s}
.enter h1{animation-delay:.15s}
.enter .lead{animation-delay:.3s}
.enter > .wrap > .btn{animation-delay:.45s}
.enter .btn-sub{animation-delay:.55s}

/* photos : cadre + zoom lent */
.photo{padding:6px 0 10px}
.ph{
  position:relative;border-radius:22px;overflow:hidden;aspect-ratio:16/9;
  background:rgba(240,234,221,.05);border:1px solid rgba(240,234,221,.12);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.9);
}
.ph img{display:block;width:100%;height:100%;object-fit:cover;animation:kenburns 22s ease-in-out infinite alternate;transform-origin:50% 50%}
.ph::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,31,40,0) 60%,rgba(10,31,40,.45) 100%)}
.ph-hero{margin-top:30px}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}

/* listes : les éléments arrivent l'un après l'autre */
.stagger > *{opacity:0;transform:translateY(14px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.stagger.in > *{opacity:1;transform:none}
.stagger.in > :nth-child(1){transition-delay:.05s}
.stagger.in > :nth-child(2){transition-delay:.13s}
.stagger.in > :nth-child(3){transition-delay:.21s}
.stagger.in > :nth-child(4){transition-delay:.29s}
.stagger.in > :nth-child(5){transition-delay:.37s}
.stagger.in > :nth-child(6){transition-delay:.45s}
.stagger.in > :nth-child(7){transition-delay:.53s}
.stagger.in > :nth-child(8){transition-delay:.61s}
.stagger.in > :nth-child(9){transition-delay:.69s}
.stagger.in > :nth-child(10){transition-delay:.77s}
.stagger.in > :nth-child(11){transition-delay:.85s}
.bul li{transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1),background .3s}
.bul li:hover,.hour:hover,.stat:hover{background:rgba(255,230,66,.09)}
.stat{transition:background .3s,transform .3s cubic-bezier(.16,1,.3,1)}
.stat:hover{transform:translateY(-3px)}

/* maquette de montage : tête de lecture qui avance, bouton qui pulse, sous-titre qui change */
.tl-play{animation:playhead 10s linear infinite}
@keyframes playhead{from{left:11%}to{left:97%}}
.tl-preview .play{position:relative}
.tl-preview .play::before{
  content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--yellow);
  animation:ring 2.2s ease-out infinite;
}
@keyframes ring{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.7);opacity:0}}
.tl-preview .sub{transition:opacity .35s,transform .35s}
.tl-preview .sub.swap{opacity:0;transform:translate(-50%,6px)}
.tl-track i{transform-origin:left center;animation:clip .8s cubic-bezier(.16,1,.3,1) both;animation-play-state:paused}
.tl.in .tl-track i{animation-play-state:running}
.tl-track:nth-child(1) i{animation-delay:.1s}
.tl-track:nth-child(2) i{animation-delay:.25s}
.tl-track:nth-child(3) i{animation-delay:.4s}
.tl-track:nth-child(4) i{animation-delay:.55s}
.tl-track:nth-child(5) i{animation-delay:.7s}
@keyframes clip{from{transform:scaleX(0);opacity:0}to{transform:scaleX(1);opacity:1}}

/* barre collante : un reflet passe sur le bouton toutes les quelques secondes */
.bar .btn,.formbox .btn-main{position:relative;overflow:hidden}
.bar .btn::after,.formbox .btn-main::after{
  content:'';position:absolute;top:-40%;bottom:-40%;left:-30%;width:26%;
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0));
  transform:skewX(-18deg);animation:shine 4.5s ease-in-out infinite;
}
@keyframes shine{0%,70%{left:-30%}100%{left:130%}}
.punch{animation:nudge 1.6s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}

@media(prefers-reduced-motion:reduce){
  .enter .kicker,.enter h1,.enter .lead,.enter > .wrap > .btn,.enter .btn-sub,.enter .hl,.ph img,.tl-play,.tl-preview .play::before,.tl-track i,.bar .btn::after,.formbox .btn-main::after,.punch{animation:none}
  .stagger > *{opacity:1;transform:none;transition:none}
}