:root{
      --navy:#062d61;--navy2:#031c3d;--blue:#0b5fb3;--green:#2d8b57;
      --ink:#152033;--muted:#667085;--line:#dbe3ee;--soft:#f5f8fc;--white:#fff;
      --shadow:0 18px 48px rgba(3,28,61,.14);--radius:22px
    }
    *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);line-height:1.5;background:#fff} img{display:block;max-width:100%} a{color:inherit} button,input,select,textarea{font:inherit}.container{width:min(1080px,calc(100% - 28px));margin:auto}
    .topbar{padding:8px 14px;text-align:center;background:var(--navy2);color:#fff;font-size:.86rem;font-weight:750}
    .nav{height:70px;background:rgba(255,255,255,.96);border-bottom:1px solid rgba(219,227,238,.9);display:flex;align-items:center;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}
    .nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}.logo img{width:52px;height:52px;object-fit:contain;border-radius:50%}.nav-contact{font-weight:850;color:var(--navy);text-decoration:none;font-size:.94rem}
    .hero{color:#fff;background:linear-gradient(90deg,rgba(3,28,61,.95),rgba(3,28,61,.78) 55%,rgba(3,28,61,.18)),url('assets/full-trailer.jpg') center 55%/cover no-repeat;padding:56px 0 72px}
    .hero-content{max-width:690px}.eyebrow{margin:0 0 10px;text-transform:uppercase;letter-spacing:.13em;font-size:.76rem;font-weight:900;color:#b8dcff}.hero h1{font-size:clamp(2.55rem,8vw,4.8rem);line-height:1.02;letter-spacing:-.045em;margin:0 0 18px}.hero p{font-size:clamp(1.05rem,2vw,1.22rem);color:rgba(255,255,255,.91);max-width:630px;margin:0 0 24px}.hero-actions{display:flex;flex-wrap:wrap;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:14px;padding:15px 20px;font-weight:900;text-decoration:none;cursor:pointer}.btn-light{background:#fff;color:var(--navy);box-shadow:0 10px 24px rgba(0,0,0,.16)}.btn-primary{background:var(--navy);color:#fff}.btn-outline{border:2px solid rgba(255,255,255,.72);color:#fff;background:rgba(255,255,255,.08)}.promise{margin-top:20px;font-size:.93rem;font-weight:750;color:rgba(255,255,255,.83)}
    .quote-shell{margin-top:-34px;position:relative;z-index:5}.quote-card{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);overflow:hidden}.quote-head{padding:26px 28px 18px;border-bottom:1px solid var(--line)}.quote-head h2{font-size:clamp(1.75rem,4vw,2.45rem);letter-spacing:-.035em;margin:0 0 6px}.quote-head p{margin:0;color:var(--muted)}.form-panel{padding:24px 28px 28px}.demo{background:#fff6dc;color:#6a4e00;padding:10px 12px;border-radius:10px;font-size:.82rem;margin-bottom:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px}.field.full,.submit{grid-column:1/-1}label{font-size:.91rem;font-weight:850}input,select,textarea{width:100%;border:1px solid #cbd6e4;border-radius:12px;padding:13px 14px;background:#fbfcfe;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(11,95,179,.1)}textarea{min-height:108px;resize:vertical}.hint{font-size:.8rem;color:var(--muted);margin:0}.submit .btn{width:100%;padding:16px;border-radius:12px}.previews{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}.previews img{width:66px;height:66px;border-radius:9px;object-fit:cover;border:1px solid var(--line)}.success{display:none;margin-top:14px;padding:13px;border-radius:11px;background:#eaf7ef;color:#185b38;font-weight:800}
    .next{padding:22px 28px;background:var(--navy2);color:#fff}.next h3{margin:0 0 12px;font-size:1.2rem}.next-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.next-item{display:flex;gap:10px;align-items:flex-start}.num{width:27px;height:27px;flex:0 0 27px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);font-weight:900}.next-item p{margin:2px 0 0;color:rgba(255,255,255,.77);font-size:.86rem}
    section{padding:66px 0}.section-intro{max-width:680px;margin-bottom:28px}.section-intro h2{font-size:clamp(2rem,5vw,3rem);line-height:1.05;letter-spacing:-.04em;margin:0 0 10px}.section-intro p{color:var(--muted);margin:0}
    .services{background:var(--soft)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px;box-shadow:0 8px 28px rgba(3,28,61,.055)}.service .icon{font-size:1.5rem;margin-bottom:18px}.service h3{margin:0 0 8px}.service p{margin:0;color:var(--muted);font-size:.94rem}
    .gallery{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:255px 255px;gap:12px}.gallery figure{margin:0;border-radius:18px;overflow:hidden;position:relative;background:#dfe6ef}.gallery figure:first-child{grid-row:1/3}.gallery img{width:100%;height:100%;object-fit:cover}.gallery figcaption{position:absolute;left:10px;right:10px;bottom:10px;padding:9px 11px;border-radius:10px;color:#fff;background:rgba(3,28,61,.78);font-size:.84rem;font-weight:850;backdrop-filter:blur(6px)}
    .reviews{background:var(--navy);color:#fff}.reviews-row{display:flex;align-items:center;justify-content:space-between;gap:24px}.reviews h2{font-size:clamp(2rem,5vw,3rem);letter-spacing:-.04em;margin:0 0 8px}.reviews p{margin:0;color:rgba(255,255,255,.78)}.reviews .btn{background:#fff;color:var(--navy);white-space:nowrap}
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}details{border:1px solid var(--line);border-radius:14px;padding:17px 19px;background:#fff}summary{font-weight:850;color:var(--navy);cursor:pointer}details p{margin:10px 0 0;color:var(--muted)}
    footer{background:var(--navy2);color:rgba(255,255,255,.72);padding:30px 0;font-size:.88rem}.footer-row{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}.footer-row img{width:46px;height:46px;border-radius:50%}.footer-links{display:flex;gap:16px;flex-wrap:wrap}.footer-links a{color:#fff;text-decoration:none}
   /* ----------------------------
   Multi-Step Quote Form
---------------------------- */

.progress-wrap {
  padding: 22px 28px 0;
}

.progress-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 0.84rem;
  font-weight: 850;
  color: var(--navy);
}

.progress-track {
  height: 8px;
  background: #e8edf4;
  border-radius: 999px;
  overflow: hidden;
}

.progress-bar {
  height: 100%;
  width: 33.333%;
  background: linear-gradient(90deg, var(--blue), var(--navy));
  border-radius: 999px;
  transition: width 0.3s ease;
}

.form-step {
  display: none;
  animation: stepIn 0.24s ease;
}

.form-step.active {
  display: block;
}

@keyframes stepIn {
  from {
    opacity: 0;
    transform: translateX(12px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.step-title {
  margin: 0 0 5px;
  font-size: 1.45rem;
  letter-spacing: -0.025em;
}

.step-subtitle {
  margin: 0 0 20px;
  color: var(--muted);
}

.step-actions {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}

.step-actions .btn {
  flex: 1;
}

.btn-muted {
  background: #edf2f8;
  color: var(--navy);
}

.choice-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.choice {
  position: relative;
}

.choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.choice label {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  text-align: center;
  border: 1px solid #cbd6e4;
  border-radius: 12px;
  background: #fbfcfe;
  padding: 10px;
  cursor: pointer;
  transition: 0.15s;
}

.choice input:checked + label {
  border-color: var(--navy);
  background: #eaf2fb;
  color: var(--navy);
  box-shadow: 0 0 0 3px rgba(11, 95, 179, 0.09);
}

.date-note {
  margin-top: 7px;
  font-size: 0.78rem;
  color: var(--muted);
}

.photo-drop {
  border: 2px dashed #b8c5d6;
  border-radius: 16px;
  padding: 22px;
  text-align: center;
  background: #fbfcfe;
}

.photo-drop input {
  margin-top: 12px;
  background: #fff;
}

.screen-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #eef5fd;
  color: #174d84;
  border-radius: 12px;
  padding: 13px 14px;
  margin-top: 16px;
  font-size: 0.86rem;
} 
    @media(max-width:820px){.service-grid{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr;grid-template-rows:300px 220px 220px}.gallery figure:first-child{grid-column:1/-1;grid-row:auto}.reviews-row{align-items:flex-start;flex-direction:column}.faq-grid{grid-template-columns:1fr}}
    @media(max-width:620px){
  .topbar{font-size:.77rem}
  .nav{height:64px}
  .logo img{width:46px;height:46px}
  .nav-contact{font-size:.82rem}

  .hero{
    padding:42px 0 70px;
    background:
      linear-gradient(
        0deg,
        rgba(3,28,61,.97),
        rgba(3,28,61,.72) 72%,
        rgba(3,28,61,.26)
      ),
      url('assets/full-trailer.jpg') 57% center/cover no-repeat;
  }

  .hero-actions .btn{width:100%}
  .quote-shell{margin-top:-38px}

  .quote-head,
  .form-panel,
  .next,
  .progress-wrap{
    padding-left:19px;
    padding-right:19px;
  }

  .form-grid{grid-template-columns:1fr}
  .field.full,.submit{grid-column:auto}
  .next-grid{grid-template-columns:1fr;gap:11px}

  .step-actions{
    flex-direction:column-reverse;
  }

  .choice-grid{
    grid-template-columns:1fr 1fr;
  }

  section{padding:54px 0}
  .gallery{
    grid-template-columns:1fr;
    grid-template-rows:repeat(4,250px);
  }

  .gallery figure:first-child{grid-column:auto}
  .footer-row{align-items:flex-start}
}