/* ============================================================
   Millwoods Driving School - UI/UX Improvement Stylesheet
   Added: Aug 2026 (post security remediation)
   ============================================================ */

/* ---------- Base & Typography ---------- */
html { scroll-behavior: smooth; }
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.75;
  word-wrap: break-word;
}
h1, h2, h3, h4, h5, h6 { line-height: 1.3; letter-spacing: .2px; }
img { max-width: 100%; height: auto; }

/* ---------- Accessible focus states ---------- */
a:focus-visible, button:focus-visible, .c-btn:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(64,138,210,.55);
  outline-offset: 2px;
}

/* ---------- Buttons / CTAs ---------- */
.c-btn, .btn, .boxed-btn, .wpcf7-submit, button[type="submit"] {
  border-radius: 8px !important;
  transition: all .3s ease !important;
}
.c-btn:hover, .btn:hover, .boxed-btn:hover, .wpcf7-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(64,138,210,.35);
  filter: brightness(1.06);
}

/* ---------- Header ---------- */
.main-menu-area, #sticky-header {
  transition: box-shadow .3s ease, background .3s ease;
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.main-menu ul li a {
  transition: color .25s ease, transform .25s ease;
}

/* ---------- Cards / hover polish ---------- */
.single-team, .team-box, .service-box, .carly-service,
.single-blog, .postbox, .testimonial-box, .single-service {
  transition: transform .3s ease, box-shadow .3s ease;
  border-radius: 10px;
}
.single-team:hover, .team-box:hover, .service-box:hover,
.carly-service:hover, .single-blog:hover, .postbox:hover,
.testimonial-box:hover, .single-service:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

/* ---------- Forms (Contact Form 7) ---------- */
.wpcf7-form input[type="text"], .wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"], .wpcf7-form input[type="number"],
.wpcf7-form textarea, .wpcf7-form select {
  width: 100%;
  border: 1px solid #d5dbe3;
  border-radius: 8px;
  padding: 14px 16px;
  font-size: 16px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.wpcf7-form input:focus, .wpcf7-form textarea:focus, .wpcf7-form select:focus {
  border-color: #408ad2;
  box-shadow: 0 0 0 3px rgba(64,138,210,.15);
  outline: none;
}

/* ---------- Footer polish ---------- */
footer .footer-top-area { padding-top: 80px; }
.footer-wrapper h3 { margin-bottom: 18px; }
.footer-wrapper ul li { margin-bottom: 10px; }
.footer-icon a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: all .3s ease;
}
.footer-icon a:hover { transform: translateY(-3px); }

/* ---------- Section titles ---------- */
.section-title, .section-subtitle { letter-spacing: .5px; }

/* ---------- Text selection ---------- */
::selection { background: rgba(64,138,210,.25); }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .container, .container-fluid { padding-left: 18px; padding-right: 18px; }
  .main-menu-area { padding-left: 15px !important; padding-right: 15px !important; }
  h1 { font-size: 34px; }
  h2 { font-size: 28px; }
}
@media (max-width: 767px) {
  h1 { font-size: 28px; }
  h2 { font-size: 24px; }
  .c-btn, .boxed-btn { display: inline-block; padding: 12px 22px; }
}

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
  html { scroll-behavior: auto; }
}