/* Base font and layout */
html {font-size: 16px;scroll-behavior: smooth;}
body {font-family: 'Segoe UI', 'Trebuchet MS', sans-serif;line-height: 1.6;color: #333;margin: 0;background: #f9f9f9;}

/* Containers */
.container {width: 94%;max-width: 1500px;margin: 0 auto;}
.company-section, .faq-section, .why-choose-us, .testimonials {max-width: 1200px;margin-left: auto;margin-right: auto;}

/* Header */
.site-header {background: #006699;color: white;padding: 2rem 1rem;text-align: center;}
.site-header a[href^="tel:"] {display: block;font-size: 1.1rem;margin-top: 0.5rem;color: #fff;text-decoration: none;}
.site-header a[href^="tel:"]:hover, .site-header a[href^="tel:"]:focus {color: #ffcc00;outline: 2px solid #fff;}
.site-header img {display: block;width: 100%;max-width: 250px;height: auto;margin: 0 auto 1rem;}
.header-contact-line {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 0.35rem 0.6rem;margin: 0.9rem auto 0;color: #fff;font-size: 1rem;line-height: 1.4;}
.header-contact-line a {color: #fff;font-weight: 700;text-decoration: underline;text-underline-offset: 3px;}
.header-contact-line a:hover, .header-contact-line a:focus {color: #ffdd55;}

/* Navigation */
.main-nav {background: #004466;}
.main-nav ul {display: flex;flex-wrap: wrap;list-style: none;justify-content: center;margin: 0;padding: 0.5rem 0;}
.main-nav li {margin: 0.5rem 1rem;}
.main-nav a {color: #fff;text-decoration: none;font-weight: bold;}
.main-nav a:hover, .main-nav a:focus {color: #ffcc00;text-decoration: underline;outline: 2px dashed #ffcc00;outline-offset: 2px;}

/* Content Section */
.content {padding: 2rem 1rem;}

/* Brand Grid */
.brand-links h2, .product-section h2 {text-align: center;}
.brand-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1.75rem;margin-top: 2rem;}

/* Brand Card */
.brand {display: flex;flex-direction: column;justify-content: space-between;background: #fff;padding: 1rem;border-radius: 6px;text-align: center;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);transition: transform 0.3s ease, box-shadow 0.3s ease;}
.brand:hover, .brand:focus-within {transform: translateY(-4px);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);}
.brand img {max-width: 100%;height: auto;margin-bottom: 1rem;}
.brand h3 {margin-bottom: 0.5rem;color: #006699;}
.brand p {flex-grow: 1;margin-bottom: 1rem;}
.brand-logo-wrapper {width: 200px;height: 80px;display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem auto;}
.brand-logo-wrapper img {max-width: 100%;max-height: 100%;object-fit: contain;}

/* CTA Buttons */

.brand a.btn {display: inline-flex;align-items: center;justify-content: center;align-self: center;width: 100%;max-width: 260px;min-height: 46px;margin-top: auto;padding: 0.75rem 1.1rem;background-color: #005b8f;color: #fff;border: 2px solid #005b8f;border-radius: 4px;text-decoration: none;font-weight: 700;line-height: 1.2;transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;}
.brand a.btn:hover, .brand a.btn:focus {background-color: #004466;border-color: #004466;color: #fff;text-decoration: none;outline: 2px solid #004466;outline-offset: 2px;transform: translateY(-1px);}

/* Company Section */
.company-section {padding: .5rem 1rem;background: #fff;text-align: center;}
.company-section img {max-width: 100%;height: auto;margin: 1rem 0;border-radius: 8px;box-shadow: 0 0 6px rgba(0, 0, 0, 0.15);}

/* Footer */
.site-footer {background: #333;color: #fff;text-align: center;padding: 1.5rem 1rem;margin-top: 3rem;}
.site-footer nav {margin-bottom: 0.75rem;}
.site-footer a {display: inline-block;margin: 0.2rem 0.35rem;color: #fff;font-weight: 600;text-decoration: none;}
.site-footer a:hover, .site-footer a:focus {color: #ffdd55;text-decoration: underline;text-underline-offset: 3px;}
.site-footer p {margin: 0;color: #fff;}
.footer-contact-line {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 0.35rem 0.6rem;margin: 0.9rem auto 0.4rem;color: #fff;line-height: 1.4;}
.footer-contact-line a {color: #fff;font-weight: 700;text-decoration: underline;text-underline-offset: 3px;}
.footer-contact-line a:hover, .footer-contact-line a:focus {color: #ffdd55;}

/* Accessibility Focus */
a:focus {outline: 2px solid #006699;outline-offset: 2px;}

/* FAQ */
.faq-section {padding: 2rem 1rem;background-color: #fff;}
.faq-section h2 {text-align: center;color: #006699;margin-bottom: 1.5rem;}
.faq-item {margin-bottom: 1rem;border: 1px solid #ccc;border-radius: 4px;padding: 0.75rem;background-color: #fdfdfd;}
.faq-item summary {font-weight: bold;color: #004466;cursor: pointer;font-size: 1.1rem;}
.faq-item[open] summary {color: #006699;}
.faq-item p {margin-top: 0.5rem;}

/* Why Us */
.why-choose-us {padding: 2rem 1rem;background-color: #fff;text-align: center;}
.why-choose-us h2 {color: #006699;margin-bottom: 1.5rem;}
.benefits-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));gap: 1.5rem;}
.benefit img {width: 60px;height: 60px;margin-bottom: 1rem;}
.benefit h3 {font-size: 1.1rem;margin-bottom: 0.5rem;color: #004466;}
.benefit-icon {display: block;margin-bottom: 0.75rem;color: #006699;font-size: 2rem;font-weight: 700;line-height: 1;}

/* Testimonials */
.testimonials {background-color: #f4f4f4;padding: 2rem 1rem;text-align: center;}
.testimonials h2 {color: #006699;margin-bottom: 2rem;font-size: 1.75rem;}
.testimonial {max-width: 700px;margin: 0 auto 1.5rem auto;padding: 1rem;border-left: 4px solid #006699;background: #fff;box-shadow: 0 2px 6px rgba(0,0,0,0.05);}
.testimonial p {font-style: italic;margin-bottom: 0.5rem;color: #333;}
.testimonial cite {font-weight: bold;color: #444;font-style: normal;}
.stars {color: #b8860b;margin: 0.5rem 0;font-size: 1.2rem;letter-spacing: 0.08em;}

/* Companies */
.trusted-by {padding: 2rem 1rem;background-color: #fff;text-align: center;}
.trusted-by h2 {color: #006699;margin-bottom: 1.5rem;font-size: 1.5rem;}
.glide__slide img {max-height: 60px;margin: auto;opacity: 0.9;transition: transform 0.3s ease, opacity 0.3s ease;}
.glide__slide img:hover {transform: scale(1.05);opacity: 1;}
.trusted-by-carousel {width: 100%;background-color: #f8f8f8;padding: 2rem 0;overflow: hidden;}
.trusted-carousel-wrapper {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;}
.trusted-carousel-wrapper h2 {text-align: center;font-size: 1.75rem;color: #006699;margin-bottom: 1.5rem;}

.glide__slide img {
  max-height: 60px;
  max-width: 120px;
  margin: auto;
  opacity: 0.9;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.glide__slide img:hover {
  transform: scale(1.05);
  opacity: 1;
}


/* Mobile Adjustments */
@media (max-width: 600px) {
  .site-header {padding: 1.5rem 1rem;}
  .header-contact-line {flex-direction: column;gap: 0.2rem;font-size: 0.95rem;}
  .header-contact-line .contact-divider {display: none;}
  .header-contact-line a {display: inline-flex;align-items: center;min-height: 44px;font-size: 1.1rem;}
  .main-nav ul {flex-direction: column;align-items: center;}
  .main-nav li {margin: 0.5rem 0;}
  .brand-grid {grid-template-columns: 1fr;}
  .site-footer nav {display: flex;flex-wrap: wrap;justify-content: center;gap: 0.25rem 0.75rem;}
  .site-footer a {margin: 0;}
}

@media (prefers-color-scheme: dark) {
  body {background-color: #121212;color: #e0e0e0;}
  .site-header {background: #1e3a5f;color: #ffffff;}
  .site-header a[href^="tel:"] {color: #ccc;}
  .site-header a[href^="tel:"]:hover, .site-header a[href^="tel:"]:focus {color: #ffcc00;}
  .main-nav {background: #142d46;}
  .main-nav a {color: #ddd;}
  .main-nav a:hover, .main-nav a:focus {color: #ffcc00;}
  .brand {background: #1f1f1f;box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);}
  .brand h3 {color: #66b2ff;}
  .brand a.btn {background-color: #3385ff;color: #fff;}
  .brand a.btn:hover, .brand a.btn:focus { background-color: #2266cc;}
  .company-section {background-color: #1b1b1b;}
  .site-footer {background: #000;color: #aaa;}
  a:focus {outline-color: #66b2ff;}
}