/* Telus Agency — palette from garden-defence Theme.luau / halloween style guide */
:root{
  --midnight:#1B1035; --midnight-2:#241546; --midnight-3:#2f1c5c;
  --purple:#7B3FE4; --purple-soft:#C4B0FF;
  --pumpkin:#FF7A1A; --pumpkin-dark:#C9560A;
  --candy:#FFD23F; --mint:#9BFFE0; --blood:#E0263C; --slime:#7CFF4F;
  --bone:#F4ECD8; --pink:#FF6FC4; --plant:#4FB84F;
  --text:#F4ECD8; --muted:#cfc3e8;
  --radius:16px; --radius-lg:24px;
  --display:"Fredoka", "Trebuchet MS", system-ui, sans-serif;
  --body:"Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
  --shadow:0 18px 50px -20px rgba(0,0,0,.6);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--body);font-size:1.0625rem;line-height:1.6;color:var(--text);
  background:var(--midnight);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--mint)}
h1,h2,h3,h4{font-family:var(--display);line-height:1.1;margin:0 0 .5rem;font-weight:700}
p{margin:0 0 1rem}
ul{list-style:none;margin:0;padding:0}
.container{width:min(1160px,100% - 2.5rem);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:1rem;top:-3rem;z-index:100;background:var(--candy);color:var(--midnight);padding:.6rem 1rem;border-radius:10px;font-weight:800;transition:top .2s}
.skip-link:focus{top:1rem}
:focus-visible{outline:3px solid var(--candy);outline-offset:3px;border-radius:6px}
.mint{color:var(--mint)}
.eyebrow{font-family:var(--display);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.82rem;color:var(--candy);margin-bottom:.6rem}
.lead{font-size:1.15rem;color:var(--muted);max-width:62ch}

/* Buttons — chunky Roblox feel with darker bottom edge */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--display);font-weight:600;font-size:1.05rem;
  padding:.8rem 1.4rem;border-radius:14px;text-decoration:none;border:0;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease, background .2s}
.btn--primary{background:var(--pumpkin);color:var(--midnight);box-shadow:0 5px 0 var(--pumpkin-dark),0 10px 24px -8px rgba(255,122,26,.6)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--pumpkin-dark),0 14px 30px -8px rgba(255,122,26,.7)}
.btn--primary:active{transform:translateY(3px);box-shadow:0 2px 0 var(--pumpkin-dark)}
.btn--ghost{background:rgba(155,255,224,.08);color:var(--mint);box-shadow:inset 0 0 0 2px rgba(155,255,224,.5),0 5px 0 rgba(0,0,0,.25)}
.btn--ghost:hover{background:rgba(155,255,224,.16);transform:translateY(-2px)}
.btn--disabled,.btn--disabled:hover{background:#4a3a6e;color:#cdbff0;box-shadow:0 5px 0 #2c2148;cursor:not-allowed;transform:none}

/* Header */
.site-header{position:sticky;top:0;z-index:50;transition:background .3s, box-shadow .3s;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:rgba(27,16,53,.55)}
.site-header.is-scrolled{background:rgba(27,16,53,.9);box-shadow:0 8px 30px -12px rgba(0,0,0,.6)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--bone)}
.brand__mark svg{width:36px;height:36px;animation:bob 4s ease-in-out infinite}
.brand__name{font-family:var(--display);font-weight:700;font-size:1.35rem}
.brand__name span{color:var(--pumpkin)}
.nav__links{display:flex;gap:1.6rem;align-items:center}
.nav__links a{color:var(--bone);text-decoration:none;font-weight:700;position:relative}
.nav__links a:not(.nav__cta)::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;border-radius:3px;background:var(--mint);transform:scaleX(0);transition:transform .25s}
.nav__links a:not(.nav__cta):hover::after{transform:scaleX(1)}
.nav__cta{background:var(--purple);padding:.5rem 1rem;border-radius:12px;box-shadow:0 4px 0 #4f22a6;transition:transform .15s}
.nav__cta:hover{transform:translateY(-2px)}
.nav__toggle{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative}
.nav__burger,.nav__burger::before,.nav__burger::after{display:block;width:24px;height:3px;border-radius:3px;background:var(--bone);position:absolute;left:10px;transition:transform .25s, opacity .2s}
.nav__burger{top:20px}.nav__burger::before{content:"";top:-8px;left:0}.nav__burger::after{content:"";top:8px;left:0}
.nav.is-open .nav__burger{background:transparent}
.nav.is-open .nav__burger::before{transform:translateY(8px) rotate(45deg)}
.nav.is-open .nav__burger::after{transform:translateY(-8px) rotate(-45deg)}

/* Hero */
.hero{position:relative;padding:4.5rem 0 7rem;overflow:hidden;isolation:isolate;
  background:radial-gradient(1200px 600px at 80% -10%,rgba(123,63,228,.55),transparent 60%),
             radial-gradient(800px 500px at 10% 110%,rgba(255,122,26,.25),transparent 60%),
             linear-gradient(180deg,#140b2a 0%,var(--midnight) 55%,#22124a 100%);
  margin-top:-68px;padding-top:calc(68px + 4.5rem)}
.sky{position:absolute;inset:0;z-index:-1;pointer-events:none}
.moon{position:absolute;right:7%;top:90px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#fff8e4,#ffe9b8 60%,#f5d48e);box-shadow:0 0 60px 20px rgba(255,233,184,.25),0 0 160px 60px rgba(123,63,228,.3)}
.stars{position:absolute;inset:0;background-image:
  radial-gradient(1.5px 1.5px at 10% 20%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 25% 60%,#fff 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 40% 12%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 55% 40%,#fff 50%,transparent 51%),
  radial-gradient(2px 2px at 70% 25%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 85% 55%,#fff 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 92% 10%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 5% 75%,#fff 50%,transparent 51%),
  radial-gradient(1px 1px at 33% 85%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 62% 70%,#fff 50%,transparent 51%);
  opacity:.7;animation:twinkle 5s ease-in-out infinite alternate}
.fireflies span{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--candy);box-shadow:0 0 10px 3px rgba(255,210,63,.7);
  opacity:0;animation:firefly var(--d) ease-in-out var(--delay) infinite}
.fireflies span.mint{background:var(--mint);box-shadow:0 0 10px 3px rgba(155,255,224,.7)}
.ghost{position:absolute;filter:drop-shadow(0 0 18px rgba(155,255,224,.45))}
.ghost--1{width:60px;left:2%;top:auto;bottom:14%;animation:float 7s ease-in-out infinite;opacity:.9}
.ghost--2{width:44px;left:46%;top:14%;animation:float 9s ease-in-out -3s infinite;opacity:.7}
.ghost--3{width:56px;right:3%;bottom:16%;animation:float 8s ease-in-out -5s infinite;opacity:.8}
.bat{position:absolute;width:54px}
.bat--1{top:22%;left:-60px;animation:fly 22s linear infinite}
.bat--2{top:10%;left:-60px;width:36px;animation:fly 30s linear -12s infinite}
.hero__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:3rem;align-items:center}
.hero__title{font-size:clamp(3.2rem,8vw,6rem);letter-spacing:-.01em;color:var(--bone);text-shadow:0 6px 0 rgba(0,0,0,.25)}
.hero__title span{color:var(--pumpkin);display:inline-block;animation:wiggle 6s ease-in-out infinite}
.hero__tagline{font-size:clamp(1.15rem,2.2vw,1.4rem);color:var(--muted);max-width:30ch;margin-bottom:2rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:1rem}
.hero__art{margin:0;position:relative}
.hero__frame{border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 0 0 4px rgba(155,255,224,.25),0 30px 80px -20px rgba(123,63,228,.8),var(--shadow);
  transform:rotate(1.5deg);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hero__art:hover .hero__frame{transform:rotate(0) scale(1.02)}
.hero__badge{position:absolute;left:-14px;bottom:-18px;background:var(--candy);color:var(--midnight);font-family:var(--display);font-weight:700;
  padding:.55rem 1rem;border-radius:999px;box-shadow:0 5px 0 #b8931f;display:flex;align-items:center;gap:.5rem;transform:rotate(-4deg)}
.pulse{width:10px;height:10px;border-radius:50%;background:var(--blood);box-shadow:0 0 0 0 rgba(224,38,60,.7);animation:pulse 1.8s infinite}
.hero__ground{position:absolute;left:0;right:0;bottom:-1px;height:90px;z-index:-1;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 50 Q 180 10 360 45 T 720 40 T 1080 50 T 1440 35 V90 H0Z' fill='%23241546'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}

/* Sections */
.section{padding:5.5rem 0;position:relative}
.section__title{font-size:clamp(2rem,4.5vw,3rem)}
.section__head{text-align:center;margin-bottom:3rem}
.section__head .lead{margin-inline:auto}
.game{background:var(--midnight-2)}
.game__intro{display:grid;grid-template-columns:260px 1fr;gap:2.5rem;align-items:center;margin-bottom:3.5rem}
.game__logo{width:260px;animation:bob 6s ease-in-out infinite;filter:drop-shadow(0 16px 30px rgba(0,0,0,.45))}
.tagline-quote{font-family:var(--display);font-weight:600;font-size:1.25rem;color:var(--candy)}
.release{display:flex;flex-wrap:wrap;gap:1rem;align-items:stretch;margin-top:1.5rem}
.release__item{background:rgba(255,255,255,.05);border:1px solid rgba(196,176,255,.25);border-radius:var(--radius);padding:.8rem 1.1rem;display:flex;flex-direction:column;min-width:180px}
.release__label{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--mint);font-weight:800}
.release__value{font-family:var(--display);font-weight:700;font-size:1.2rem}
.release__note{font-size:.9rem;color:var(--muted)}
.release .btn{align-self:center}

.features{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-bottom:4rem}
.feature,.cap{background:linear-gradient(180deg,rgba(123,63,228,.18),rgba(123,63,228,.06));border:1px solid rgba(196,176,255,.18);border-radius:var(--radius-lg);padding:1.5rem;
  transition:transform .25s ease, border-color .25s, box-shadow .25s}
.feature:hover,.cap:hover{transform:translateY(-6px);border-color:rgba(155,255,224,.55);box-shadow:0 20px 40px -20px rgba(155,255,224,.35)}
.ico{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;display:block}
.feature__icon,.cap__icon{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:16px;margin-bottom:.9rem;font-size:26px;transition:transform .3s;
  color:var(--ic,var(--pumpkin));background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--ic,var(--pumpkin)) 30%,transparent),color-mix(in srgb,var(--ic,var(--pumpkin)) 8%,transparent));
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ic,var(--pumpkin)) 45%,transparent),0 0 22px -8px var(--ic,var(--pumpkin))}
.feature__icon .ico,.cap__icon .ico,.agent__bot .ico{filter:drop-shadow(0 0 6px color-mix(in srgb,currentColor 55%,transparent))}
.features li:nth-child(3n+1),.caps li:nth-child(3n+1),.agents li:nth-child(3n+1){--ic:var(--pumpkin)}
.features li:nth-child(3n+2),.caps li:nth-child(3n+2),.agents li:nth-child(3n+2){--ic:var(--mint)}
.features li:nth-child(3n),.caps li:nth-child(3n),.agents li:nth-child(3n){--ic:#B48CFF}
.ico--title{display:inline-block;width:.9em;height:.9em;vertical-align:-.08em;color:var(--mint);stroke-width:2;filter:drop-shadow(0 0 10px rgba(155,255,224,.5))}
.feature:hover .feature__icon,.cap:hover .cap__icon{transform:scale(1.1) rotate(-6deg)}
.feature h3,.cap h3{font-size:1.3rem}
.feature p,.cap p{color:var(--muted);margin:0}

.sub{text-align:center;margin-bottom:1.5rem}
.sub__title{font-size:clamp(1.6rem,3vw,2.1rem);color:var(--bone)}
.sub__lead{color:var(--muted)}
.plants{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;margin-bottom:4rem}
.plant{text-align:center;background:rgba(79,184,79,.08);border:1px solid rgba(79,184,79,.25);border-radius:var(--radius-lg);padding:1rem .8rem 1.2rem;transition:transform .25s, background .25s}
.plant img{width:100%;max-width:150px;margin:0 auto .6rem;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.plant:hover{transform:translateY(-4px);background:rgba(79,184,79,.16)}
.plant:hover img{transform:scale(1.08) rotate(-4deg)}
.plant h4{font-size:1.1rem}
.plant p{font-size:.92rem;color:var(--muted);margin:0}
.lvl{display:inline-block;background:var(--purple);color:#fff;border-radius:999px;padding:0 .5rem;font-size:.75rem;font-weight:800;margin-left:.2rem}

.bosses{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:4rem}
.boss{display:flex;gap:1.2rem;align-items:center;border-radius:var(--radius-lg);padding:1.2rem 1.6rem 1.2rem 1.2rem;overflow:hidden;position:relative;transition:transform .3s}
.boss--pumpking{background:radial-gradient(circle at 15% 50%,rgba(255,122,26,.45),transparent 60%),#2a1640;border:1px solid rgba(255,122,26,.4)}
.boss--harvester{background:radial-gradient(circle at 15% 50%,rgba(224,38,60,.4),transparent 60%),#2a1426;border:1px solid rgba(224,38,60,.4)}
.boss img{width:150px;flex:none;transition:transform .4s;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5))}
.boss:hover{transform:translateY(-4px)}
.boss:hover img{transform:scale(1.06) translateY(-4px)}
.boss h4{font-size:1.6rem}
.boss p{color:var(--muted);margin:0}
.boss__wave{display:inline-block;font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;background:rgba(0,0,0,.35);color:var(--candy);padding:.2rem .6rem;border-radius:999px;margin-bottom:.4rem}

.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.gallery a{display:block;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative}
.gallery img{transition:transform .5s ease;width:100%}
.gallery a:hover img{transform:scale(1.05)}
.gallery a::after{content:"";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239BFFE0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E")!important;background-size:18px 18px!important;background-repeat:no-repeat!important;background-position:center!important;position:absolute;right:.7rem;bottom:.6rem;background:rgba(27,16,53,.75);color:var(--mint);width:34px;height:34px;border-radius:10px;display:grid;place-items:center;opacity:0;transition:opacity .25s}
.gallery a:hover::after,.gallery a:focus-visible::after{opacity:1}

.what{background:var(--midnight)}
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}

.team{background:linear-gradient(180deg,var(--midnight-2),var(--midnight-3))}
.team .section__head .lead{max-width:68ch}
.lead-agent{display:flex;gap:1.2rem;align-items:center;max-width:760px;margin:0 auto 1.5rem;padding:1.4rem 1.6rem;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,rgba(255,122,26,.25),rgba(123,63,228,.25));border:2px solid rgba(255,210,63,.45);box-shadow:0 20px 50px -25px rgba(255,122,26,.6)}
.lead-agent h3{font-size:1.6rem}
.lead-agent p{margin:0;color:var(--muted)}
.agent__tag{display:inline-block;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--candy)}
.agents{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.agents .agent{flex:0 1 calc(25% - .75rem)}
.agent{text-align:center;padding:1.4rem 1rem;border-radius:var(--radius-lg);background:rgba(155,255,224,.06);border:1px solid rgba(155,255,224,.2);transition:transform .25s, border-color .25s}
.agent:hover{transform:translateY(-6px) rotate(-1deg);border-color:rgba(155,255,224,.6)}
.agent h3{font-size:1.15rem}
.agent p{font-size:.95rem;color:var(--muted);margin:0}
.agent__bot{display:inline-grid;place-items:center;width:68px;height:68px;border-radius:20px;font-size:34px;color:var(--ic,var(--mint));margin-bottom:.7rem;flex:none;
  background:radial-gradient(circle at 30% 30%,#3b2672,#1B1035);box-shadow:inset 0 0 0 2px rgba(155,255,224,.35),0 0 24px -6px rgba(155,255,224,.5);position:relative}
.agent__bot::before{content:"";position:absolute;top:-8px;left:50%;width:3px;height:9px;background:var(--mint);transform:translateX(-50%);border-radius:2px}
.agent__bot::after{content:"";position:absolute;top:-12px;left:50%;width:8px;height:8px;background:var(--mint);border-radius:50%;transform:translateX(-50%);box-shadow:0 0 8px var(--mint);animation:blink 2.4s ease-in-out infinite}
.lead-agent .agent__bot{margin:0;width:84px;height:84px;padding:0}
.agent__bot--art img{width:100%;height:100%;object-fit:cover;border-radius:20px;box-shadow:inset 0 0 0 2px rgba(255,210,63,.5)}
.agent__bot--art{box-shadow:0 0 0 2px rgba(255,210,63,.55),0 0 28px -6px rgba(255,122,26,.7)}
.agent__bot--art::before,.agent__bot--art::after{background:var(--candy);box-shadow:0 0 8px var(--candy)}
.agent:hover .agent__bot .ico{transform:scale(1.1)}
.agent__bot .ico{transition:transform .3s}
.agent:nth-child(odd) .agent__bot::after{animation-delay:-1.2s}

.about__grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:center}
.values{display:grid;gap:1rem}
.values li{padding:1rem 1.2rem 1rem 3.2rem;border-radius:var(--radius);background:rgba(255,255,255,.04);position:relative;color:var(--muted)}
.values li::before{content:"";position:absolute;left:1.1rem;top:1.25rem;width:16px;height:16px;border-radius:50% 50% 50% 0;background:var(--pumpkin);transform:rotate(-45deg);box-shadow:0 0 12px rgba(255,122,26,.6)}
.values strong{color:var(--bone)}

.contact{padding-top:2rem}
.contact__card{text-align:center;padding:3.5rem 1.5rem;border-radius:32px;position:relative;overflow:hidden;
  background:radial-gradient(600px 300px at 50% 0%,rgba(123,63,228,.55),transparent 70%),var(--midnight-2);border:1px solid rgba(196,176,255,.25)}
.contact__card .lead{margin:0 auto 1.8rem}
.ghost--contact{width:60px;position:relative;margin:0 auto 1rem;display:block;animation:float 6s ease-in-out infinite}
.socials{display:flex;justify-content:center;gap:.8rem;margin-top:1.8rem}
.social{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(155,255,224,.08);color:var(--mint);transition:transform .2s, background .2s}
.social:hover{transform:translateY(-3px) rotate(-6deg);background:rgba(155,255,224,.2)}
.social svg{width:22px;height:22px}

.site-footer{padding:2.5rem 0 3rem;color:var(--muted);font-size:.95rem}
.footer__inner{text-align:center;border-top:1px solid rgba(196,176,255,.15);padding-top:2rem}
.footer__small{font-size:.8rem;opacity:.75;max-width:70ch;margin:0 auto}

.lightbox{border:0;padding:0;background:transparent;max-width:min(1100px,94vw);color:var(--bone)}
.lightbox::backdrop{background:rgba(10,5,22,.85);backdrop-filter:blur(4px)}
.lightbox figure{margin:0}
.lightbox img{border-radius:var(--radius);width:100%}
.lightbox figcaption{text-align:center;padding:.8rem;font-family:var(--display)}
.lightbox__close{position:absolute;right:.6rem;top:.6rem;width:42px;height:42px;border-radius:12px;border:0;background:rgba(27,16,53,.85);color:var(--bone);font-size:22px;cursor:pointer;display:grid;place-items:center}

/* Reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.is-in{opacity:1;transform:none}

/* Animations */
@keyframes float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-22px) rotate(3deg)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes wiggle{0%,90%,100%{transform:rotate(0)}93%{transform:rotate(-4deg)}96%{transform:rotate(4deg)}}
@keyframes twinkle{from{opacity:.4}to{opacity:.85}}
@keyframes firefly{0%{opacity:0;transform:translate(0,0)}20%{opacity:1}80%{opacity:.8}100%{opacity:0;transform:translate(var(--dx),var(--dy))}}
@keyframes fly{0%{transform:translateX(0) translateY(0)}25%{transform:translateX(30vw) translateY(-20px)}50%{transform:translateX(60vw) translateY(10px)}75%{transform:translateX(90vw) translateY(-15px)}100%{transform:translateX(115vw) translateY(0)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(224,38,60,.7)}70%{box-shadow:0 0 0 10px rgba(224,38,60,0)}100%{box-shadow:0 0 0 0 rgba(224,38,60,0)}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}

/* Responsive */
@media (max-width:1000px){
  .plants{grid-template-columns:repeat(3,1fr)}
  .agents .agent{flex-basis:calc(50% - .5rem)}
}
@media (max-width:900px){
  .hero__grid{grid-template-columns:1fr;gap:2.5rem}
  .hero__copy{text-align:center}
  .hero__tagline{margin-inline:auto}
  .hero__actions{justify-content:center}
  .moon{width:80px;height:80px;top:84px;right:6%}
  .game__intro{grid-template-columns:1fr;text-align:center}
  .game__logo{width:200px;margin:0 auto}
  .game__intro .lead{margin-inline:auto}
  .release{justify-content:center}
  .features,.caps{grid-template-columns:repeat(2,1fr)}
  .bosses{grid-template-columns:1fr}
  .about__grid{grid-template-columns:1fr;gap:1.5rem}
}
@media (max-width:760px){
  .nav__toggle{display:block}
  .nav__links{position:absolute;top:68px;left:0;right:0;flex-direction:column;gap:0;padding:.5rem 1.25rem 1.25rem;
    background:rgba(27,16,53,.97);border-bottom:1px solid rgba(196,176,255,.2);transform:translateY(-8px);opacity:0;visibility:hidden;transition:all .25s}
  .nav.is-open .nav__links{transform:none;opacity:1;visibility:visible}
  .nav__links li{width:100%}
  .nav__links a{display:block;padding:.85rem 0}
  .nav__cta{text-align:center;margin-top:.5rem}
}
@media (max-width:560px){
  body{font-size:1rem}
  .section{padding:4rem 0}
  .features,.caps{grid-template-columns:1fr}
  .plants{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:1fr}
  .boss{flex-direction:column;text-align:center;padding:1.4rem}
  .boss img{width:140px}
  .lead-agent{flex-direction:column;text-align:center}
  .agent{padding:1.2rem .7rem}
  .ghost--2{display:none}
  .hero__badge{left:50%;transform:translateX(-50%) rotate(-3deg);white-space:nowrap}
  .release__item{min-width:0;flex:1 1 140px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}