/* ===== Reset ===== */
* { margin:0; padding:0; box-sizing:border-box; font-family:Arial, sans-serif; }
body { line-height:1.6; background:#f4f4f9; color:#333; }
a { text-decoration:none; color:inherit; }

/* ===== Header & Navigation (inline) ===== */
header { background:#004080; padding:10px 0; }
.menu {
  display:flex; justify-content:center; align-items:center;
  list-style:none; margin:0; padding:0; flex-wrap:wrap;
}
.menu li { position:relative; margin:0 10px; list-style:none; }
.menu a {
  color:#fff; padding:10px 12px; display:block; white-space:nowrap; font-weight:600;
}
.menu a:hover, .menu a.active { background:#003060; border-radius:4px; }

/* Dropdown */
.submenu {
  display:none; position:absolute; top:100%; left:0; background:#004080;
  padding:0; margin:0; list-style:none; min-width:200px; border-radius:6px; overflow:hidden; z-index:1000;
}
.menu li:hover > .submenu, .menu li:focus-within > .submenu { display:block; }
.submenu li { width:100%; }
.submenu a { padding:10px; font-weight:normal; }

/* ===== Hero ===== */
.hero {
  background:linear-gradient(135deg,#004080,#0073e6);
  color:#fff; text-align:center; padding:70px 20px;
}
.hero h1 { font-size:2.4rem; margin-bottom:12px; }
.hero p  { font-size:1.15rem; max-width:780px; margin:0 auto 18px; }
.hero .button {
  display:inline-block; background:#ffb000; color:#1a1a1a;
  padding:12px 20px; border-radius:6px; font-weight:bold;
}
.hero .button:hover { background:#e39e00; }

/* ===== Generic Section Wrapper (matches class="section") ===== */
.section { padding:40px 20px; max-width:1100px; margin:0 auto; }
.section h2 { text-align:center; margin-bottom:20px; color:#004080; }

/* ===== Reviews (matches class="review-container" and .review) ===== */
.review-container {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:20px;
}
.review {
  background:#fff; padding:20px; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.1);
}
.review .author { margin-top:10px; font-style:italic; color:#555; }

/* ===== Content Cards (services/about) ===== */
.card {
  background:#fff; padding:20px; margin:15px 0; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.1);
}

/* ===== Forms ===== */
form { max-width:600px; margin:0 auto 30px; text-align:center; }
form input, form textarea, form select {
  width:100%; padding:10px 12px; margin:8px 0; border:1px solid #ccc; border-radius:6px; font-size:1rem; background:#fff;
}
form textarea { min-height:110px; resize:vertical; }
form button, form input[type="submit"] {
  background:#0078d7; color:#fff; border:none; padding:12px 18px;
  border-radius:6px; font-weight:600; cursor:pointer; transition:background .2s;
}
form button:hover, form input[type="submit"]:hover { background:#005bb5; }

/* ===== Footer ===== */
footer { background:#004080; color:#fff; text-align:center; padding:15px; margin-top:40px; font-size:.95rem; }

/* ===== Responsive tweaks ===== */
@media (max-width:480px){
  .menu { gap:10px; }
  .menu a { padding:8px 10px; }
  .hero h1 { font-size:2rem; }
  .hero p  { font-size:1rem; }
}
/* === Make .dropdown behave like the old .submenu === */
.menu .dropdown{
  display:none; position:absolute; top:100%; left:0;
  background:#004080; padding:0; margin:0; list-style:none;
  min-width:200px; border-radius:6px; overflow:hidden; z-index:1000;
}
.menu li:hover > .dropdown,
.menu li:focus-within > .dropdown { display:block; }
.menu .dropdown li{ width:100%; }
.menu .dropdown a{ padding:10px; font-weight:normal; }

/* === About page layout === */
.about-intro, .about-points, .about-team, .reviews-form{
  max-width:1100px; margin:0 auto; padding:30px 20px;
}

/* Titles */
.about-intro h1,
.about-points h2,
.reviews-form h2{
  text-align:center; color:#004080; margin-bottom:16px;
}

/* Card look for text blocks */
.about-intro p,
.about-team p,
.about-points ul,
.reviews-form form,
.reviews-form p{
  background:#fff; padding:20px; border-radius:12px;
  box-shadow:0 2px 6px rgba(0,0,0,.1);
}

/* Bullet list styling (keep bullets visible & neat) */
.about-points ul{
  list-style:disc; padding-left:1.2rem; /* bullets visible */
}
.about-points li{ margin:8px 0; }

/* Re-use the yellow CTA button anywhere (not just hero) */
.button{
  display:inline-block; background:#ffb000; color:#1a1a1a;
  padding:12px 20px; border-radius:6px; font-weight:bold;
}
.button:hover{ background:#e39e00; }

/* Review form buttons (matches site style) */
.reviews-form button{
  background:#0078d7; color:#fff; border:none; padding:12px 18px;
  border-radius:6px; font-weight:600; cursor:pointer; transition:background .2s;
}
.reviews-form button:hover{ background:#005bb5; }
