/* From about.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .stat-card {
        background-color: white;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        padding: 2rem;
        text-align: center;
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From commercial-painting.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(
          90deg,
          rgba(26, 42, 56, 0.85) 0%,
          rgba(26, 42, 56, 0.6) 50%,
          rgba(26, 42, 56, 0.4) 100%
        );
      }
      .service-feature-card {
        background-color: white;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
          0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From contact.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From designer-wall.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-feature-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From exterior-painting.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-feature-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From gallery.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .gallery-item {
        position: relative;
        overflow: hidden;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      }
      .gallery-item img {
        width: 100%;
        height: 250px; /* Fixed height for consistency */
        object-fit: cover;
        transition: transform 0.3s ease;
      }
      .gallery-item:hover img {
        transform: scale(1.05);
      }
      .gallery-item-overlay {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
        color: white;
        padding: 1rem;
        transform: translateY(100%);
        transition: transform 0.3s ease;
      }
      .gallery-item:hover .gallery-item-overlay {
        transform: translateY(0);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From index.html */
:where([class^="ri-"])::before { content: "\f3c2"; }
      body {
      font-family: 'Poppins', sans-serif;
      }
      h1, h2, h3, h4, h5, h6 {
      font-family: 'Montserrat', sans-serif;
      }
      .logo {
      font-family: 'Pacifico', serif;
      }
      .rainbow-gradient {
      background: linear-gradient(90deg, #E53935, #FB8C00, #FDD835, #43A047, #1E88E5, #3949AB, #8E24AA);
      }
      .rainbow-text {
      background: linear-gradient(90deg, #E53935, #FB8C00, #FDD835, #43A047, #1E88E5, #3949AB, #8E24AA);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      }
      .hero-slide {
      background-size: cover;
      background-position: center;
      position: relative;
      }
      .hero-slide::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-card:hover {
      transform: translateY(-10px);
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
      }
      .package-card {
      border-width: 2px;
      border-style: solid;
      border-image: linear-gradient(to bottom, #E53935, #FB8C00, #FDD835, #43A047, #1E88E5, #3949AB, #8E24AA) 1;
      }
      .recommended {
      border-width: 3px;
      }
      .testimonial-card {
      position: relative;
      }
      .testimonial-card::before {
      content: '"';
      position: absolute;
      top: -20px;
      left: 20px;
      font-size: 80px;
      font-family: serif;
      color: rgba(30, 136, 229, 0.1);
      }
      input[type="number"]::-webkit-inner-spin-button,
      input[type="number"]::-webkit-outer-spin-button {
      -webkit-appearance: none;
      margin: 0;
      }
      .gallery-item {
      overflow: hidden;
      }
      .gallery-item img {
      transition: transform 0.5s ease;
      }
      .gallery-item:hover img {
      transform: scale(1.05);
      }
      .dropdown-menu {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      min-width: 200px;
      z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
      display: block;
      }

/* From interior-painting.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-feature-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From pricing.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .pricing-card {
        background-color: white;
        border-radius: 8px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .pricing-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From residential-painting.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-feature-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }

/* From texture-painting.html */
:where([class^="ri-"])::before {
        content: "\f3c2";
      }
      body {
        font-family: "Poppins", sans-serif;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Montserrat", sans-serif;
      }
      .logo {
        font-family: "Pacifico", serif;
      }
      .rainbow-gradient {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
      }
      .rainbow-text {
        background: linear-gradient(
          90deg,
          #e53935,
          #fb8c00,
          #fdd835,
          #43a047,
          #1e88e5,
          #3949ab,
          #8e24aa
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .hero-section {
        background-size: cover;
        background-position: center;
        position: relative;
      }
      .hero-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, rgba(26, 42, 56, 0.85) 0%, rgba(26, 42, 56, 0.6) 50%, rgba(26, 42, 56, 0.4) 100%);
      }
      .service-feature-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }
      .service-feature-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
      }
      .dropdown-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        z-index: 50;
      }
      .dropdown:hover .dropdown-menu {
        display: block;
      }