/*
  Altas Tech LTD Opening Soon Website
  File: styles.css
  Edit the colour variables below to change the full website branding.
*/
:root{--navy:#0F172A;--navy2:#111D35;--blue:#2563EB;--cyan:#06B6D4;--white:#fff;--muted:#9FB3C8;--muted2:#C7D5E5;--glass:rgba(255,255,255,.08);--glass-border:rgba(255,255,255,.16);--shadow:0 28px 70px rgba(0,0,0,.35);--radius-lg:28px;--radius-md:18px;--max-width:1180px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--white);background:radial-gradient(circle at 20% 15%,rgba(37,99,235,.28),transparent 30%),radial-gradient(circle at 85% 15%,rgba(6,182,212,.22),transparent 28%),linear-gradient(135deg,var(--navy),#06101f 60%,#020617);overflow-x:hidden}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select{font:inherit}#networkCanvas{position:fixed;inset:0;z-index:-3;width:100%;height:100%}body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:68px 68px;mask-image:linear-gradient(to bottom,transparent,black 15%,black 70%,transparent)}.preloader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;gap:1rem;background:var(--navy);transition:.55s ease}.preloader.is-hidden{opacity:0;visibility:hidden}.preloader__ring{width:74px;height:74px;border:3px solid rgba(255,255,255,.14);border-top-color:var(--cyan);border-radius:50%;animation:spin 1s linear infinite}.preloader p{color:var(--muted2);letter-spacing:.14em;text-transform:uppercase;font-size:.76rem}.site-header{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:100;width:min(calc(100% - 32px),var(--max-width));display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border:1px solid var(--glass-border);border-radius:999px;background:rgba(15,23,42,.62);backdrop-filter:blur(18px);box-shadow:0 14px 40px rgba(0,0,0,.25);transition:.3s ease}.site-header.is-scrolled{top:10px;padding:10px 16px;background:rgba(15,23,42,.82)}.brand img{width:164px;max-height:48px;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(6,182,212,.2))}.desktop-nav{display:flex;gap:1.2rem;color:var(--muted2);font-size:.94rem}.desktop-nav a{position:relative;transition:.22s}.desktop-nav a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:var(--cyan);transition:.22s}.desktop-nav a:hover{color:#fff}.desktop-nav a:hover:after{width:100%}.menu-toggle{display:none;width:46px;height:46px;border:1px solid var(--glass-border);border-radius:50%;background:rgba(255,255,255,.05);cursor:pointer}.menu-toggle span{display:block;width:18px;height:2px;margin:5px auto;background:#fff}.mobile-menu{position:fixed;top:86px;right:18px;z-index:99;width:min(290px,calc(100% - 36px));display:grid;gap:.4rem;padding:18px;border:1px solid var(--glass-border);border-radius:22px;background:rgba(15,23,42,.92);backdrop-filter:blur(18px);transform:translateY(-14px);opacity:0;pointer-events:none;transition:.25s}.mobile-menu.is-open{transform:translateY(0);opacity:1;pointer-events:auto}.mobile-menu a{padding:12px;color:var(--muted2);border-radius:12px}.mobile-menu a:hover{color:#fff;background:rgba(255,255,255,.07)}.section-panel{position:relative;max-width:var(--max-width);margin:0 auto}.section{min-height:100vh;padding:120px 20px;display:grid;align-content:center}.section__intro{max-width:760px;margin-bottom:3rem}.eyebrow{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1rem;color:var(--cyan);text-transform:uppercase;letter-spacing:.16em;font-weight:700;font-size:.78rem}.eyebrow:before{content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--cyan),transparent)}h1,h2,h3{line-height:1.04;letter-spacing:-.04em}h1{font-size:clamp(3rem,8vw,7.2rem);max-width:900px}h2{font-size:clamp(2.2rem,5vw,4.7rem)}h3{font-size:1.45rem}p{color:var(--muted2);line-height:1.75}.hero{min-height:100vh;padding:155px 20px 90px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-items:center;gap:4rem}.hero__lead{max-width:730px;margin:1.5rem 0 2rem;font-size:clamp(1.05rem,2vw,1.25rem)}.hero__actions{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:999px;border:1px solid transparent;font-weight:800;transition:.25s}.btn:hover{transform:translateY(-3px)}.btn--primary{color:#fff;background:linear-gradient(135deg,var(--blue),var(--cyan));box-shadow:0 18px 40px rgba(37,99,235,.28)}.btn--ghost{color:#fff;border-color:var(--glass-border);background:rgba(255,255,255,.06)}.hero__stats{display:flex;flex-wrap:wrap;gap:.9rem}.hero__stats div{min-width:116px;padding:14px 16px;border:1px solid var(--glass-border);border-radius:18px;background:rgba(255,255,255,.06)}.hero__stats strong{display:block;font-size:1.35rem}.hero__stats span{display:block;margin-top:.2rem;color:var(--muted);font-size:.88rem}.hero__visual{position:relative;min-height:560px;display:grid;place-items:center}.orb{position:absolute;border-radius:50%;filter:blur(10px);opacity:.85;animation:float 7s ease-in-out infinite}.orb--one{width:260px;height:260px;background:radial-gradient(circle,rgba(6,182,212,.38),transparent 70%);top:18px;right:25px}.orb--two{width:340px;height:340px;background:radial-gradient(circle,rgba(37,99,235,.34),transparent 70%);bottom:22px;left:0;animation-delay:-2.5s}.tech-card{position:relative;z-index:2;width:min(100%,430px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05)),rgba(15,23,42,.72);backdrop-filter:blur(22px);box-shadow:var(--shadow);overflow:hidden}.tech-card:before{content:"";position:absolute;inset:-1px;background:linear-gradient(135deg,rgba(6,182,212,.4),transparent 35%,rgba(37,99,235,.25));opacity:.55;z-index:-1}.tech-card--main{padding:28px}.tech-card__header{display:flex;align-items:center;gap:.6rem;color:var(--muted2);font-weight:700;margin-bottom:1.4rem}.status-dot{width:12px;height:12px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 8px rgba(6,182,212,.12),0 0 30px var(--cyan)}.tech-card h2{font-size:clamp(2.2rem,5vw,3.6rem)}.progress-block{margin:2rem 0}.progress-block__top{display:flex;justify-content:space-between;color:var(--muted2);font-weight:700;margin-bottom:.7rem}.progress-bar{height:12px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden}.progress-bar span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:width 1.2s ease}.checklist{list-style:none;display:grid;gap:.85rem;color:var(--muted2)}.checklist li{display:flex;align-items:center;gap:.65rem}.checklist li span{width:18px;height:18px;border-radius:50%;background:rgba(6,182,212,.12);border:1px solid rgba(6,182,212,.45);position:relative}.checklist li span:after{content:"";position:absolute;width:7px;height:4px;border-left:2px solid var(--cyan);border-bottom:2px solid var(--cyan);transform:rotate(-45deg);left:5px;top:5px}.floating-chip{position:absolute;z-index:3;padding:10px 16px;border:1px solid var(--glass-border);border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(14px);font-weight:800;box-shadow:0 15px 30px rgba(0,0,0,.22);animation:float 6s ease-in-out infinite}.chip--one{top:80px;left:20px}.chip--two{right:10px;top:160px;animation-delay:-2s}.chip--three{bottom:90px;left:30px;animation-delay:-4s}.scroll-indicator{position:absolute;left:20px;bottom:30px;display:inline-flex;align-items:center;gap:.7rem;color:var(--muted);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase}.scroll-indicator span{width:24px;height:38px;border:1px solid rgba(255,255,255,.28);border-radius:999px;position:relative}.scroll-indicator span:after{content:"";position:absolute;width:4px;height:7px;background:var(--cyan);border-radius:999px;left:50%;top:8px;transform:translateX(-50%);animation:scrollDot 1.35s infinite}.vision-grid,.service-track{display:grid;gap:1.2rem}.vision-grid{grid-template-columns:repeat(3,1fr)}.glass-card,.service-card,.timeline-item,.contact-card,.contact-side{border:1px solid var(--glass-border);background:rgba(255,255,255,.07);backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.22)}.glass-card{min-height:260px;padding:26px;border-radius:var(--radius-lg);transition:.25s}.glass-card:hover,.service-card:hover{transform:translateY(-8px);background:rgba(255,255,255,.1)}.card-number{display:inline-flex;margin-bottom:3rem;color:var(--cyan);font-weight:900;letter-spacing:.1em}.launch-section{grid-template-columns:.9fr 1.1fr;gap:2rem;align-items:center}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}.countdown__item{min-height:170px;display:grid;place-items:center;padding:20px;border:1px solid var(--glass-border);border-radius:var(--radius-lg);background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.04));box-shadow:var(--shadow)}.countdown__item strong{display:block;font-size:clamp(2.4rem,6vw,5rem);line-height:1}.countdown__item span{color:var(--muted);text-transform:uppercase;letter-spacing:.14em;font-size:.74rem}.service-track{grid-template-columns:repeat(4,minmax(220px,1fr))}.service-card{min-height:300px;padding:24px;border-radius:var(--radius-lg);overflow:hidden;position:relative;transition:.25s}.service-card:after{content:"";position:absolute;width:140px;height:140px;right:-60px;bottom:-60px;border-radius:50%;background:radial-gradient(circle,rgba(6,182,212,.28),transparent 70%)}.service-card__icon{width:54px;height:54px;display:grid;place-items:center;margin-bottom:3rem;border-radius:17px;background:rgba(6,182,212,.13);color:var(--cyan);font-weight:900}.timeline{position:relative;display:grid;gap:1.3rem}.timeline__line{position:absolute;left:28px;top:0;bottom:0;width:2px;background:linear-gradient(var(--cyan),rgba(37,99,235,.12))}.timeline-item{position:relative;margin-left:70px;padding:26px;border-radius:var(--radius-lg)}.timeline-item:before{content:"";position:absolute;left:-53px;top:31px;width:18px;height:18px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 8px rgba(6,182,212,.13),0 0 30px rgba(6,182,212,.55)}.timeline-item span{display:inline-flex;margin-bottom:.8rem;color:var(--cyan);font-weight:800}.contact-section{display:grid;grid-template-columns:1.15fr .85fr;gap:1.4rem;align-items:stretch}.contact-card,.contact-side{border-radius:var(--radius-lg);padding:34px}.contact-side{display:grid;align-content:end;min-height:420px;background:radial-gradient(circle at 70% 20%,rgba(6,182,212,.28),transparent 35%),rgba(255,255,255,.07)}.contact-side h3{font-size:2rem}.contact-side a{display:inline-flex;margin-top:1.2rem;color:var(--cyan);font-weight:900}.launch-form{display:grid;gap:1rem;margin-top:1.5rem}.launch-form label{display:grid;gap:.45rem;color:var(--muted2);font-weight:700}.launch-form input,.launch-form select{width:100%;min-height:54px;padding:0 16px;border:1px solid var(--glass-border);border-radius:16px;color:#fff;background:rgba(255,255,255,.08);outline:none;transition:.2s}.launch-form input:focus,.launch-form select:focus{border-color:rgba(6,182,212,.8);box-shadow:0 0 0 4px rgba(6,182,212,.12)}.launch-form option{color:#111827}.form-message{min-height:26px;color:var(--cyan);font-weight:800}.site-footer{max-width:var(--max-width);margin:0 auto;padding:28px 20px 46px;display:flex;justify-content:space-between;gap:1rem;color:var(--muted)}.site-footer a{color:var(--cyan);font-weight:800}.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}.reveal--delay{transition-delay:.16s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}@keyframes scrollDot{0%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,14px)}}@media(max-width:980px){.desktop-nav{display:none}.menu-toggle{display:block}.hero,.launch-section,.contact-section{grid-template-columns:1fr}.hero__visual{min-height:470px}.vision-grid,.service-track{grid-template-columns:1fr 1fr}.countdown{grid-template-columns:1fr 1fr}}@media(max-width:640px){.site-header{top:10px;width:calc(100% - 20px)}.brand img{width:132px}.hero{padding-top:132px}.hero__actions{flex-direction:column}.btn{width:100%}.vision-grid,.service-track,.countdown{grid-template-columns:1fr}.countdown__item{min-height:130px}.timeline-item{margin-left:52px}.timeline__line{left:20px}.timeline-item:before{left:-42px}.site-footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}


/* ---------- V4 Smooth Section Patch ---------- */
/*
  These overrides target the exact area where scroll lag can happen.
  Backdrop-filter is one of the most expensive CSS effects during scrolling.
  The hero/vision design remains rich, while the heavier lower sections use a lighter glass style.
*/

#services .service-card,
#journey .timeline-item,
#contact .contact-card,
#contact .contact-side {
  backdrop-filter: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.105), rgba(255,255,255,0.052)),
    rgba(15, 23, 42, 0.70);
  box-shadow: 0 12px 28px rgba(0,0,0,0.20);
  transform: translateZ(0);
  will-change: transform, opacity;
}

/* The service-card glowing pseudo-element was nice but caused extra paint work. This keeps a lighter glow. */
#services .service-card::after {
  width: 90px;
  height: 90px;
  right: -45px;
  bottom: -45px;
  background: radial-gradient(circle, rgba(6,182,212,0.18), transparent 70%);
}

/* Make the lower section reveal movement shorter so the transition feels less sticky. */
#services .reveal,
#journey .reveal,
#contact .reveal {
  transform: translate3d(0, 16px, 0);
  transition-duration: 0.55s;
}

#services .reveal.is-visible,
#journey .reveal.is-visible,
#contact .reveal.is-visible {
  transform: translate3d(0, 0, 0);
}

/* Prevent oversized section rendering jumps around the form area. */
#contact {
  align-content: center;
}

/* Mobile/tablet: make the lower sections even lighter. */
@media (max-width: 980px) {
  #services .service-card,
  #journey .timeline-item,
  #contact .contact-card,
  #contact .contact-side {
    box-shadow: 0 8px 20px rgba(0,0,0,0.18);
  }
}


/* ---------- V6 Lightweight Background ---------- */
.lite-bg {
  position: fixed;
  inset: 0;
  z-index: -5;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 18%, rgba(37, 99, 235, 0.24), transparent 28%),
    radial-gradient(circle at 82% 16%, rgba(6, 182, 212, 0.18), transparent 28%),
    radial-gradient(circle at 78% 78%, rgba(37, 99, 235, 0.16), transparent 30%);
}
.lite-bg__grid {
  position: absolute;
  inset: -20%;
  background-image:
    linear-gradient(rgba(6, 182, 212, 0.065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 99, 235, 0.055) 1px, transparent 1px);
  background-size: 92px 92px;
  transform: rotate(-7deg) translate3d(0, 0, 0);
  opacity: 0.42;
  animation: liteGridMove 42s linear infinite;
}
.lite-bg__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(18px);
  opacity: 0.55;
  transform: translate3d(0, 0, 0);
}
.lite-bg__glow--one {
  width: 360px;
  height: 360px;
  right: 8%;
  top: 12%;
  background: radial-gradient(circle, rgba(6, 182, 212, 0.22), transparent 68%);
  animation: liteFloat 12s ease-in-out infinite;
}
.lite-bg__glow--two {
  width: 420px;
  height: 420px;
  left: 6%;
  bottom: 6%;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.18), transparent 70%);
  animation: liteFloat 16s ease-in-out infinite reverse;
}
.lite-bg__line {
  position: absolute;
  width: 42vw;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(6, 182, 212, 0.55), transparent);
  opacity: 0.38;
}
.lite-bg__line--one {
  top: 30%;
  left: 2%;
  transform: rotate(-16deg);
  animation: litePulse 8s ease-in-out infinite;
}
.lite-bg__line--two {
  right: 2%;
  bottom: 26%;
  transform: rotate(14deg);
  animation: litePulse 10s ease-in-out infinite reverse;
}
body.is-scrolling .lite-bg__grid,
body.is-scrolling .lite-bg__glow,
body.is-scrolling .lite-bg__line {
  animation-play-state: paused;
}
@keyframes liteGridMove {
  to { transform: rotate(-7deg) translate3d(92px, 92px, 0); }
}
@keyframes liteFloat {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -18px, 0); }
}
@keyframes litePulse {
  0%, 100% { opacity: 0.16; }
  50% { opacity: 0.42; }
}

/* ---------- V6 Navigation and scroll performance patch ---------- */
section {
  scroll-margin-top: 96px;
}

#services .service-card,
#journey .timeline-item,
#contact .contact-card,
#contact .contact-side {
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
}

/* Disable hover lift while actively scrolling, preventing micro-stutters. */
body.is-scrolling .glass-card:hover,
body.is-scrolling .service-card:hover,
body.is-scrolling .btn:hover {
  transform: none;
}

/* On smaller screens, make background almost static for smoother movement. */
@media (max-width: 760px) {
  .lite-bg__line,
  .lite-bg__glow--two {
    display: none;
  }

  .lite-bg__grid {
    opacity: 0.28;
    animation-duration: 70s;
  }
}


.privacy-note {
  margin-top: -0.25rem;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  background: rgba(255,255,255,0.045);
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.6;
}


/* ---------- V8 Hero Full Logo Panel ---------- */
/*
  Full Altas Tech logo placed above the Launch Status card.
  The uploaded white-background logo has been converted to a transparent PNG.
*/
.hero-brand-panel {
  position: absolute;
  top: 34px;
  left: 50%;
  z-index: 4;
  width: min(520px, 88%);
  padding: 18px 24px;
  border: 1px solid rgba(255,255,255,0.13);
  border-radius: 24px;
  background:
    radial-gradient(circle at 20% 20%, rgba(6,182,212,0.18), transparent 34%),
    linear-gradient(135deg, rgba(15,23,42,0.70), rgba(17,29,53,0.44));
  box-shadow: 0 18px 40px rgba(0,0,0,0.22), 0 0 38px rgba(6,182,212,0.10);
  transform: translate3d(-50%, 0, 0);
  overflow: hidden;
}

.hero-brand-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
  transform: translateX(-120%);
  animation: logoPanelShine 8s ease-in-out infinite;
}

.hero-brand-panel img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  object-fit: contain;
  opacity: 0.94;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,0.25));
}

@keyframes logoPanelShine {
  0%, 72%, 100% {
    transform: translateX(-120%);
  }
  82% {
    transform: translateX(120%);
  }
}

/* Push the Launch Status card down so the logo sits in the empty space above it. */
.hero__visual .tech-card--main {
  margin-top: 130px;
}

@media (max-width: 980px) {
  .hero-brand-panel {
    top: 18px;
    width: min(430px, 90%);
    padding: 14px 18px;
  }

  .hero__visual .tech-card--main {
    margin-top: 108px;
  }
}

@media (max-width: 640px) {
  .hero-brand-panel {
    top: 4px;
    width: min(330px, 92%);
    padding: 12px 14px;
    border-radius: 18px;
  }

  .hero__visual .tech-card--main {
    margin-top: 92px;
  }
}

/* ---------- V9 Fixed Hero Full Logo Panel ---------- */
/*
  Full Altas Tech logo placed in the empty space above the Launch Status card.
  V9 fixes:
  - Moves the logo higher.
  - Stops overlap with the Launch Status card.
  - Uses a dark-background logo version so the text is visible.
  - Reduces logo panel height so it fits better.
*/
.hero-brand-panel {
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 3;
  width: min(430px, 82%);
  padding: 12px 18px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 22px;
  background:
    radial-gradient(circle at 18% 28%, rgba(6,182,212,0.14), transparent 32%),
    linear-gradient(135deg, rgba(15,23,42,0.46), rgba(17,29,53,0.28));
  box-shadow: 0 14px 30px rgba(0,0,0,0.16), 0 0 28px rgba(6,182,212,0.08);
  transform: translate3d(-50%, 0, 0);
  overflow: hidden;
  pointer-events: none;
}

.hero-brand-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.045), transparent);
  transform: translateX(-120%);
  animation: logoPanelShine 10s ease-in-out infinite;
}

.hero-brand-panel img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  object-fit: contain;
  opacity: 0.98;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.24));
}

@keyframes logoPanelShine {
  0%, 76%, 100% {
    transform: translateX(-120%);
  }
  86% {
    transform: translateX(120%);
  }
}

/* Push the Launch Status card lower, leaving a clean gap below the logo. */
.hero__visual .tech-card--main {
  margin-top: 178px;
}

/* Move floating chips slightly away from the logo/card overlap area. */
.chip--one {
  top: 152px;
  left: 0;
}

.chip--two {
  right: -8px;
  top: 230px;
}

.chip--three {
  bottom: 78px;
  left: 30px;
}

@media (max-width: 980px) {
  .hero-brand-panel {
    top: 10px;
    width: min(390px, 88%);
    padding: 11px 15px;
  }

  .hero__visual .tech-card--main {
    margin-top: 155px;
  }

  .chip--one {
    top: 132px;
  }

  .chip--two {
    top: 210px;
  }
}

@media (max-width: 640px) {
  .hero-brand-panel {
    top: 4px;
    width: min(300px, 90%);
    padding: 10px 12px;
    border-radius: 18px;
  }

  .hero__visual .tech-card--main {
    margin-top: 126px;
  }

  .floating-chip {
    display: none;
  }
}



/* ---------- V10 Formspree form states ---------- */
.hidden-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.launch-form button.is-loading {
  opacity: 0.78;
  cursor: wait;
}

.form-message.is-success {
  color: var(--cyan);
}

.form-message.is-error {
  color: #FCA5A5;
}