/* BADGUYS STUDIO — launch page */
:root{color-scheme:dark;--ink:#050506;--white:#f7f7f7;--lime:#c6ff00;--pink:#ff0066}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:var(--ink)}
body{color:var(--white);font-family:'Inter',Arial,sans-serif;overflow:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--lime);outline-offset:7px;border-radius:2px}
.page{position:relative;width:100%;min-height:100svh;background:var(--ink)}
.desktop-layout{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100svh;overflow:hidden}
.viewport{position:relative;width:1672px;height:941px;flex:none;overflow:hidden}
.artboard{position:absolute;top:0;left:0;width:1672px;height:941px;overflow:hidden;transform-origin:top left;background:#050506}
.mascot-background{position:absolute;inset:0;width:1672px;height:941px;display:block;pointer-events:none;user-select:none}
.brand-link{position:absolute;left:56px;top:35px;display:block;width:200px;height:96px;z-index:2}
.brand-image{display:block;width:100%;height:100%;object-fit:contain}
.launch-indicator{position:absolute;left:1434px;top:42px;display:flex;align-items:center;gap:19px;white-space:nowrap;z-index:3}
.status-dot{display:inline-block;flex:none;width:14px;height:14px;border-radius:50%;background:var(--pink);box-shadow:0 0 11px rgba(255,0,102,.25);animation:status-pulse 2.4s ease-in-out infinite}
.status-label{font:500 19px/24px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:2.5px;color:#f3f0f1;transform:scaleX(.85);transform-origin:left center}
.eyebrow{position:absolute;top:196px;left:63px;margin:0;color:#e3e1e2;font:400 21px/28px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:4.25px;white-space:nowrap}
.main-title{position:absolute;inset:0;margin:0;font-family:'Archivo Black','Inter Black','Arial Black',Impact,sans-serif;font-weight:900;letter-spacing:-7px;line-height:1;pointer-events:none}
.title-word{display:block;position:absolute;white-space:nowrap;text-transform:uppercase;color:white}
.title-one{top:231px;left:52px;font-size:161px;letter-spacing:-7.8px;transform-origin:left top;transform:scaleX(.97)}
.title-two{top:372px;left:53px;font-size:151px;letter-spacing:-7px;transform-origin:left top;transform:scaleX(.92)}
.title-three{top:500px;left:54px;font-size:157px;letter-spacing:-7.5px;color:var(--lime);transform-origin:left top;transform:scaleX(.98)}
.subline{position:absolute;top:655px;left:63px;margin:0;font:400 24px/35px 'Inter',Arial,sans-serif;color:#bfbdbf}
.contact-link{position:absolute;top:722px;left:64px;display:inline-flex;align-items:center;gap:12px;height:39px;padding-bottom:11px;white-space:nowrap;border-bottom:4px solid var(--pink);font:700 20px/23px 'Inter',Arial,sans-serif;letter-spacing:.6px;transition:color .2s ease,border-color .2s ease}
.contact-link svg{width:19px;height:19px}
.contact-link:hover{color:var(--lime);border-color:var(--lime)}
.desktop-footer{position:absolute;inset:0;pointer-events:none}
.footer-divider{position:absolute;left:57px;right:57px;top:861px;height:1px;background:rgba(234,234,234,.68)}
.footer-name,.footer-domain{position:absolute;top:881px;font:400 15px/18px 'Roboto Mono','Courier New',monospace;color:#b5b1b4;white-space:nowrap;pointer-events:auto}
.footer-name{left:57px;letter-spacing:2px}
.footer-domain{right:57px;letter-spacing:1px;transition:color .2s}
.footer-domain:hover{color:#fff}
@keyframes status-pulse{0%,100%{opacity:1;box-shadow:0 0 9px rgba(255,0,102,.18)}50%{opacity:.66;box-shadow:0 0 16px rgba(255,0,102,.40)}}
.mobile-layout{display:none}
@media (max-width:700px), (max-aspect-ratio:9/11){
  body{overflow:auto}
  .desktop-layout{display:none}
  .mobile-layout{display:flex;flex-direction:column;position:relative;min-height:100svh;overflow:hidden;background:linear-gradient(180deg,#070608 0%,#070608 36%,#09070a 100%)}
  .mobile-art{position:absolute;top:1vh;right:-59vw;width:158vw;height:75vh;background:url('./assets/mascot-background.webp') no-repeat 67% 23%;background-size:auto 100%;opacity:.98;pointer-events:none;filter:saturate(1.03)}
  .mobile-layout:after{content:"";pointer-events:none;position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,2,4,.1) 0%,rgba(3,2,4,.06) 21%,rgba(3,2,4,.76) 51%,rgba(3,2,4,.97) 80%)}
  .mobile-header,.mobile-copy,.mobile-footer{position:relative;z-index:2}
  .mobile-header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:21px 23px 0}
  .mobile-brand-link{display:block;width:138px;flex:none}
  .mobile-brand-link img{width:100%;height:auto;display:block}
  .mobile-status{padding-top:12px;display:flex;align-items:center;gap:9px;white-space:nowrap;font:500 13px/16px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:1.6px}
  .mobile-status .status-dot{width:9px;height:9px}
  .mobile-copy{margin-top:auto;padding:0 23px 30px}
  .mobile-eyebrow{margin:0 0 16px;font:400 15px/20px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:3.2px;color:#e4e3e2}
  .mobile-copy h1{margin:0;font:900 clamp(55px,15.3vw,104px)/.94 'Archivo Black','Inter Black','Arial Black',Impact,sans-serif;letter-spacing:-.065em;color:#fff}
  .mobile-copy h1 em{font-style:normal;color:var(--lime)}
  .mobile-subline{max-width:330px;margin:24px 0 23px;font:400 16px/1.5 'Inter',Arial,sans-serif;color:#c6c2c5}
  .mobile-contact{display:inline-flex;align-items:center;gap:12px;border-bottom:3px solid var(--pink);padding:0 0 8px;font:700 15px/23px 'Inter',Arial,sans-serif;letter-spacing:.5px}
  .mobile-contact span:last-child{font-size:21px;line-height:17px}
  .mobile-footer{padding:15px 23px calc(20px + env(safe-area-inset-bottom));display:flex;justify-content:space-between;gap:14px;border-top:1px solid rgba(239,239,239,.47);font:400 10px/16px 'Roboto Mono','Courier New',monospace;letter-spacing:.6px;color:#b9b4b7}
}
@media (max-width:359px){.mobile-header{padding-inline:15px}.mobile-copy{padding-inline:15px}.mobile-footer{padding-inline:15px}.mobile-brand-link{width:120px}.mobile-status{font-size:11px;letter-spacing:1px}.mobile-copy h1{font-size:15vw}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
