/* Custom Colors for MR MOVERS RAK */
      :root {
        --primary: #1363df;
        --secondary: #ff7a00;
        --text: #333333;
        --background: #f6f6f6;
        --white: #ffffff;
      }
      body {
        color: var(--text);
        background-color: var(--white);
        scroll-behavior: smooth;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6,
      strong {
        color: var(--primary);
      }
      .hero {
        background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
          url('/.netlify/images?url=https%3A%2F%2Fimages.pexels.com%2Fphotos%2F439391%2Fpexels-photo-439391.jpeg&w=1280&q=70')
            no-repeat center center/cover;
        color: var(--white);
        padding: 8rem 1rem;
        text-align: center;
      }
      .hero h1,
      .hero p {
        color: var(--white);
      }
      .cta-button {
        background-color: var(--secondary);
        color: var(--white);
        border: none;
        font-weight: bold;
        margin: 0.5rem;
      }
      .whatsapp-button {
        background-color: #25d366;
        color: var(--white);
        border: none;
        font-weight: bold;
        margin: 0.5rem;
      }
      .service-icon {
        font-size: 2.5rem;
        margin-bottom: 1rem;
        color: var(--primary);
      }
      section {
        padding: 4rem 1rem;
      }
      .section-dark {
        background-color: var(--background);
      }
      .testimonial {
        background-color: var(--white);
        padding: 2rem;
        border-radius: 5px;
        margin: 2rem 0;
        border-left: 4px solid var(--primary);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
      }
      nav.container-fluid {
        background-color: var(--white);
        border-bottom: 1px solid var(--background);
        position: sticky;
        top: 0;
        z-index: 100;
      }
      nav a[role='button'] {
        background-color: var(--secondary);
        color: var(--white);
        border: none;
      }
      footer {
        background-color: var(--primary);
        color: var(--white);
        padding: 3rem 0;
      }
      footer a {
        color: var(--white);
      }
      .card {
        background-color: var(--white);
        padding: 1.5rem;
        border-radius: 5px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        height: 100%;
        border-top: 4px solid var(--primary);
      }
      .contact-info {
        text-align: center;
        margin: 2rem 0;
      }
      .contact-methods {
        background-color: var(--white);
        padding: 2rem;
        border-radius: 5px;
        margin-bottom: 2rem;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
      }
    
      html { color-scheme: light; scroll-padding-top: 7rem; }
      body { overflow-wrap: anywhere; }
      nav.container-fluid { flex-wrap: wrap; gap: .25rem; }
      nav ul { flex-wrap: wrap; }
      .grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1.5rem; }
      .cta-button, nav a[role='button'] { background: #a84300; color: #fff; }
      .whatsapp-button { background: #126b37; color: #fff; }
      mark { background: #a84300 !important; }
      footer h4 { color: #fff; }
      a, button, input, select, summary { touch-action: manipulation; }
      a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #a84300; outline-offset: 4px; }
      .skip-link { position: absolute; left: 1rem; top: -5rem; z-index: 200; padding: 1rem; background: #fff; }
      .skip-link:focus { top: 0; }
      img { height: auto; }
      @media (max-width: 640px) { .hero { padding: 3rem 1rem; } section { padding: 2rem 1rem; } nav.container-fluid { position: static; } nav ul { margin: 0; } nav li { padding: .4rem; } h1 { font-size: 2rem; } .contact-methods { padding: 1rem; } }
      @media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }