/* Fly Above Moving — lightweight one-page site */
/* Theme: light blue */
:root{
  --bg: #f6fbff;
  --bg2:#eef7ff;
  --card:#ffffff;
  --text:#0b2239;
  --muted:#4f6b84;
  --line: rgba(11,34,57,.12);
  --primary:#3aa7ff;
  --primary2:#2b7fff;
  --shadow: 0 18px 40px rgba(11,34,57,.10);
  --radius: 18px;
  --max: 1120px;
  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: var(--font);
  color: var(--text);
  background: linear-gradient(180deg, var(--bg), #ffffff 40%, var(--bg2));
}

a{color:inherit}
img{max-width:100%; display:block}

.container{max-width:var(--max); margin:0 auto; padding:0 18px}
.skip{
  position:absolute; left:-999px; top:8px;
  padding:10px 12px; background:var(--card); border:1px solid var(--line); border-radius:12px;
}
.skip:focus{left:18px; z-index:9999}

.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(12px);
  background: rgba(246,251,255,.80);
  border-bottom:1px solid var(--line);
}
.topbar__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; padding:12px 0;
}
.brand{display:flex; gap:10px; align-items:center; text-decoration:none}
.brand__logo{
  width:44px; height:44px; border-radius:12px; object-fit:cover;
  box-shadow: 0 10px 22px rgba(11,34,57,.12);
  border:1px solid rgba(255,255,255,.6);
}
.brand__name{display:block; font-weight:800; letter-spacing:.2px}
.brand__tag{display:block; font-size:12px; color:var(--muted); margin-top:2px}

.nav{display:flex; gap:18px; align-items:center}
.nav a{
  text-decoration:none; color:var(--muted);
  font-weight:600; font-size:14px;
  padding:10px 10px; border-radius:12px;
}
.nav a:hover{background: rgba(58,167,255,.10); color:var(--text)}

.topbar__cta{display:flex; gap:10px; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:11px 14px;
  border-radius: 14px;
  border:1px solid rgba(58,167,255,.22);
  background: linear-gradient(180deg, rgba(58,167,255,.18), rgba(58,167,255,.10));
  color: var(--text);
  text-decoration:none;
  font-weight:800;
  box-shadow: 0 10px 24px rgba(11,34,57,.08);
}
.btn:hover{transform: translateY(-1px)}
.btn:active{transform: translateY(0)}
.btn--ghost{
  background: transparent;
  border:1px solid var(--line);
  box-shadow:none;
  color: var(--text);
}
.btn--lg{padding:13px 16px; border-radius:16px}
.btn--full{width:100%}

.menuBtn{
  display:none;
  width:44px; height:44px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.7);
}
.menuBtn span{display:block; height:2px; margin:7px 10px; background:var(--text); border-radius:99px; opacity:.85}

.mobileNav{
  border-bottom:1px solid var(--line);
  background: rgba(246,251,255,.92);
}
.mobileNav__inner{
  padding:10px 0 16px;
  display:grid; gap:10px;
}
.mobileNav__inner a{
  text-decoration:none;
  padding:12px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background: rgba(255,255,255,.7);
  font-weight:700;
}

.hero{position:relative; overflow:hidden}
.hero__bg{
  position:absolute; inset:0;
  background-image:
    linear-gradient(90deg, rgba(246,251,255,.95), rgba(246,251,255,.70) 45%, rgba(246,251,255,.55)),
    url("assets/hero.jpg");
  background-size: cover;
  background-position: center;
  filter:saturate(1.05);
}
.hero__inner{
  position:relative;
  padding:56px 0 34px;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:22px;
}
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(58,167,255,.14);
  border:1px solid rgba(58,167,255,.22);
  font-weight:800;
  color: rgba(11,34,57,.92);
  width:fit-content;
}
h1{
  font-size: clamp(34px, 4vw, 54px);
  margin:14px 0 10px;
  letter-spacing:-.6px;
}
.sub{color:var(--muted); font-size:16px; line-height:1.6; max-width:56ch}
.hero__actions{display:flex; gap:10px; flex-wrap:wrap; margin:16px 0 18px}

.hero__stats{
  display:flex; gap:12px; flex-wrap:wrap;
  margin-top:14px;
}
.stat{
  background: rgba(255,255,255,.78);
  border:1px solid var(--line);
  border-radius: 16px;
  padding:12px 14px;
  box-shadow: 0 12px 30px rgba(11,34,57,.08);
  min-width: 140px;
}
.stat__num{font-weight:900}
.stat__label{font-size:12px; color:var(--muted); margin-top:2px}

.card{
  background: rgba(255,255,255,.85);
  border:1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:18px;
}
.card--soft{
  margin-top:18px;
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(58,167,255,.05));
}
.card__title{margin:0 0 6px}
.card__hint{margin:0 0 12px; color:var(--muted)}

.form{display:grid; gap:10px}
.form label span{display:block; font-size:13px; font-weight:800; margin-bottom:6px}
input, textarea, select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(11,34,57,.14);
  background: rgba(255,255,255,.9);
  outline:none;
  font:inherit;
}
input:focus, textarea:focus, select:focus{
  border-color: rgba(58,167,255,.65);
  box-shadow: 0 0 0 4px rgba(58,167,255,.16);
}
.form__fine{margin:8px 0 0; color:var(--muted); font-size:13px}
.form__msg{margin:0; color: var(--primary2); font-weight:800; font-size:13px; min-height:18px}

.section{padding:52px 0}
.section--alt{background: linear-gradient(180deg, rgba(58,167,255,.08), rgba(58,167,255,.04))}
.section__head h2{margin:0}
.section__head p{margin:8px 0 0; color:var(--muted); max-width:70ch}

.grid3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
  margin-top:18px;
}
.grid2{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:14px;
  margin-top:18px;
}

.tile{
  background: rgba(255,255,255,.78);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:18px;
  box-shadow: 0 12px 30px rgba(11,34,57,.06);
}
.tile h3{margin:0 0 8px}
.tile p{margin:0 0 12px; color:var(--muted); line-height:1.6}
.check{margin:0; padding-left:18px; color: rgba(11,34,57,.92)}
.check li{margin:8px 0}

.mediaRow{
  margin-top:20px;
  display:grid;
  grid-template-columns: .95fr 1.05fr;
  gap:16px;
  align-items:center;
}
.mediaRow__img{
  border-radius: var(--radius);
  border:1px solid var(--line);
  box-shadow: var(--shadow);
}
.mediaRow__copy h3{margin:0 0 10px}
.mediaRow__copy p{margin:0 0 14px; color:var(--muted); line-height:1.65}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px}
.chip{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(58,167,255,.20);
  background: rgba(58,167,255,.10);
  font-weight:800;
  font-size:12px;
}
.mediaRow__actions{display:flex; gap:10px; flex-wrap:wrap}

.why{
  background: rgba(255,255,255,.74);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:18px;
}
.why h3{margin:0 0 8px}
.why p{margin:0; color:var(--muted); line-height:1.65}

.ctaBand{
  margin-top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:18px;
  border-radius: var(--radius);
  border:1px solid rgba(58,167,255,.22);
  background: linear-gradient(180deg, rgba(58,167,255,.16), rgba(255,255,255,.80));
  box-shadow: 0 16px 34px rgba(11,34,57,.08);
}
.ctaBand p{margin:6px 0 0; color:var(--muted)}
.ctaBand__actions{display:flex; gap:10px; flex-wrap:wrap}

.review{
  margin:0;
  padding:18px;
  border-radius: var(--radius);
  border:1px solid var(--line);
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 30px rgba(11,34,57,.06);
}
.review__stars{font-weight:900; letter-spacing:2px}
.review blockquote{margin:12px 0 10px; color:rgba(11,34,57,.92); line-height:1.65}
.review figcaption{color:var(--muted); font-weight:800; font-size:13px}

.muted{color:var(--muted)}
.big{font-size:22px; margin:10px 0}
.phone{font-weight:900; text-decoration:none}
.phone:hover{text-decoration:underline}

.hours{display:grid; gap:6px; color:var(--muted); margin-top:12px}
.mini{
  display:flex; gap:10px; align-items:center;
  margin-top:14px; padding-top:14px;
  border-top: 1px solid var(--line);
}
.mini img{width:48px; height:48px; border-radius:14px; object-fit:cover; border:1px solid var(--line)}

.footer{
  margin-top:22px;
  padding:18px 0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--muted);
  border-top:1px solid var(--line);
}
.footer__links{display:flex; gap:12px}
.footer__links a{text-decoration:none}
.footer__links a:hover{text-decoration:underline}

.callFab{
  position:fixed;
  right:16px; bottom:16px;
  z-index:80;
  display:flex; flex-direction:column;
  gap:2px;
  padding:12px 14px;
  border-radius: 18px;
  text-decoration:none;
  border:1px solid rgba(58,167,255,.28);
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 44px rgba(11,34,57,.16);
}
.callFab span{font-size:12px; color:var(--muted); font-weight:900; letter-spacing:.2px}
.callFab strong{font-size:14px}

.form--two{
  grid-template-columns: 1fr 1fr;
}
.span2{grid-column: 1 / -1}

/* Responsive */
@media (max-width: 980px){
  .hero__inner{grid-template-columns:1fr; padding:42px 0 22px}
  .nav, .topbar__cta{display:none}
  .menuBtn{display:block}
  .grid3{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .mediaRow{grid-template-columns:1fr}
  .ctaBand{flex-direction:column; align-items:flex-start}
  .form--two{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .btn:hover{transform:none}
}