
*{box-sizing:border-box}
input,textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px 12px;outline:none}
input:focus,textarea:focus{border-color:rgba(23,162,255,.6);box-shadow:0 0 0 3px rgba(23,162,255,.15)}
a.btn{display:inline-block;padding:10px 16px;border-radius:10px;background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;text-decoration:none;font-weight:700;box-shadow:0 8px 20px rgba(0,102,255,.35)}
a.btn:hover{filter:brightness(1.08) saturate(1.1);transform:translateY(-1px)}

.hero,.parallax-cta{will-change:background-position;}


/* Mobile polish */
@media (max-width: 820px){
  section{padding:56px 0}
  .headline{font-size:38px}
  .subhead{font-size:16px}
  header.nav .menu{justify-content:flex-start;gap:10px}
}

/* Robust mobile parallax for middle section */
.parallax-cta{position:relative; overflow:hidden}
.parallax-cta::before{
  content:"";
  position:absolute;
  inset:-10%;
  background-image:var(--hero2-bg);
  background-size:cover;
  background-position:center 25%;
  z-index:0;
  will-change:transform;
  transform:translateY(0);
}
.parallax-cta > .inner{position:relative; z-index:1}

.parallax-cta::before{ transform: translateY(var(--p2-shift,0)); }
