	  body { visibility: hidden; }
    body {
      font-family: 'Philosopher', sans-serif;
    }
	  
h1, h2, h3, h4, h5, h6,
a, li, label,
button, input, textarea {
  font-family: 'Philosopher', sans-serif;
}

p, span {
  font-family: 'Poppins', sans-serif;
}
    img.custm-hpover {
    filter: grayscale(1);
}
img.custm-hpover:hover {
    filter: none;
}
    .outline-orange {
      -webkit-text-stroke: 1.5px #d87f0a;
      color: transparent;
    }
    div#pageer {
    z-index: 0;
    position: relative;
}

 /* Desktop dropdown show on hover */
      nav ul li.relative.group:hover > ul.dropdown-menu {
        opacity: 1;
        visibility: visible;
      }

/* Highlight active menu item in gold */
ul li a.current-menu-item {
  color: gold !important; /* Active menu item in gold */
  font-weight: bold; /* Make the active item bold for better visibility */
}

/* Hover effect for non-active items */
ul li a:hover {
  color: #a47f2f; /* Set a subtle hover effect */
}
.whatsaprtp-chat a.chat-button {
    font-size: 10px;
    padding: 5px 16px;
}

 /* Base styles for sticky */
    nav.saeed-header.sticky {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 9999;
      background-color: white !important;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      transition: box-shadow 0.3s ease;
      /* Remove any forced height or max-height */
      max-height: none !important;
      height: auto !important;
      min-height: 0 !important;
      width: 100%;
    max-width: 100%;
    }
	  .saeed-header.sticky {
    padding-left: max(1rem, calc((100vw - 1280px) / 2));
    padding-right: max(1rem, calc((100vw - 1280px) / 2));
}
	  
/* 	  ============== */






/* General styles for the form (existing) */
.popup-dev .saeed-contact-formds {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.1rem;
    margin-left: auto;
    margin-right: auto;
    align-items: self-end;
    padding-bottom: 60px;
    padding-top: 40px;
    padding-left: 30px;
    padding-right: 30px;
}
.popup-dev .saeed-contact-formds label {
    font-size: 14px;
    color: #ffffff;
    margin-bottom: 1px;
    display: block;
}
.popup-dev .saeed-contact-formds input,
.saeed-contact-formds select,
.saeed-contact-formds date {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 14px;
}
.popup-dev .saeed-contact-formds input:focus,
.saeed-contact-formds select:focus,
.saeed-contact-formds date:focus {
    border-color: #4CAF50;
    outline: none;
}
.popup-dev .button-container {
    display: contents;
    justify-content: flex-start;
    align-items: center;
    grid-column: span 5;
}
.popup-dev .saeed-contact-formds .button-container button {
    background-color: #4CAF50;
    color: white;
    padding: 12px 10px;
    font-size: 14px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-left: 10px;
}
.popup-dev .saeed-contact-formds .button-container button:hover {
    background-color: #45a049;
}
.popup-dev .wpcf7-not-valid-tip {
    font-size: 11px;
    position: absolute;
}
.popup-dev .button-container p {
    height: 47px;
}
.popup-dev input.wpcf7-form-control.wpcf7-submit.has-spinner.bg-green-600.text-white.px-6.py-3.rounded {
    height: 49px;
    cursor: pointer;
}
.popup-dev .form-item br {
    display: none;
}
.popup-dev .form-item label {
    padding-bottom: 6px;
}
.popup-dev input.wpcf7-form-control.wpcf7-submit.has-spinner.bg-green-600.text-white.px-6.py-3.rounded {
    background-color: #0c3d3a;
    color: white;
    border: solid 1px #636363;
}

input[type="date"]::placeholder {
    color: #888;
    /* Set the placeholder text color */
    opacity: 1;
    /* Make sure the placeholder text isn't transparent */
}

/* @media (max-width: 1200px) {
    .popup-dev .saeed-contact-formds {
        grid-template-columns: repeat(2, 1fr);
    }
} */ /* This might be too broad and interfere, consider removing or making more specific */

@media screen and (min-width: 138px) and (max-width: 369px) {
    .popup-dev .saeed-contact-formds {
        transform: scale(0.91);
        padding-top: 62px;
    }
    .absolute.bottom-0.left-0.right-0.bg-\[\#0a3c3a\].bg-opacity-90.max-w-7xl.mx-auto.px-6.md\:px-12.lg\:px-20.py-8.translate-y-\[66\%\].sm\:translate-y-\[72\%\] {
        padding-top: 97px !important;
        padding-bottom: 55px !important;
    }
    main.max-w-7xl.mx-auto.px-6.md\:flex.md\:items-center.md\:gap-20.mt-\[55vh\].sm\:mt-\[32ch\] {
        margin-top: 52ch;
    }
    .saeed-contact-formds input,
    .saeed-contact-formds select,
    .saeed-contact-formds date {
        min-width: 120px;
    }
input.saeed-customf {
    min-width: 155px;
}
	.saeed-ytytyty {
    width: 135px !important;
    min-width: 117px !important;
}
}

/* Media queries for smaller devices (existing) */
@media screen and (min-width: 370px) and (max-width: 767px) {
	 .saeed-contact-formds input, .saeed-contact-formds select, .saeed-contact-formds date {
        width: 157px;
    }
	 .saeed-contact-formds input.wpcf7-form-control.wpcf7-date.wpcf7-validates-as-required.wpcf7-validates-as-date.border-gray-300.rounded.px-4.py-2{
		max-width: 157px;
	}
	input.saeed-customf {
    min-width: 155px;
}
    .popup-dev .saeed-contact-formds {
        padding-top: 30px;
		top: -5ch;
    }
	  .popup-dev .saeed-contact-formds input, .saeed-contact-formds select, .saeed-contact-formds date {
        width: 130px;
    }
	 .popup-dev input.wpcf7-form-control.wpcf7-date.wpcf7-validates-as-required.wpcf7-validates-as-date.border-gray-300.rounded.px-4.py-2 {
    width: 130px;
}
	.popup-dev .saeed-contact-formds input, .saeed-contact-formds select, .saeed-contact-formds date {
        min-width: 130px;
    }
	.popup-dev .saeed-contact-formds input, .saeed-contact-formds select, .saeed-contact-formds date{
	 width: 130px;	
	}
	.popup-dev input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.border-gray-300.rounded.px-4.py-2 {
    width: 130px;
} 
	.saeed-ytytyty {
    width: 135px !important;
    min-width: 117px !important;
}
}

@media (max-width: 767px) {
    .popup-dev .saeed-contact-formds {
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
    }
    .popup-dev .button-container {
        flex-direction: column;
        gap: 10px;
    }
    .popup-dev .button-container p {
        margin-top: 3vh;
    }
    .popup-dev .button-container p {
        height: 5.5vh;
    }

    div#formContainer {
        place-self: anchor-center;
        place-self: center;
    }
    .custom-imagesfgg {
        height: 218px !important;
    }
    .overflow-customfg {
        overflow-y: auto;
        max-height: 600px;
    }

    input[type="date"] {
        width: 100%;
        /* Ensures it fits properly on small screens */
        padding: 10px;
        /* Optional: adds padding for better UX */
    }
    div#formContainer {
        place-self: anchor-center;
        place-self: center;
    }
    .overflow-customfg {
        overflow: auto;
        max-height: 600px;
        overflow-x: hidden;
    }
    .saeed-contact-formds input, .saeed-contact-formds select, .saeed-contact-formds date{
height: 44px;
}
}



/* --- iPad Pro 10" (768x1024) Media Queries --- */

/* iPad Pro 10" Portrait */
@media screen and (min-device-width: 768px) and (max-device-width: 768px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
    .saeed-contact-formds input,
    .saeed-contact-formds select,
    .saeed-contact-formds date {
        width: 100% !important;
    }
    /* Apply your specific flex rule here for portrait */
    .media-query-custom {
        display: flex;
        /* Add other styles for portrait iPad Pro 10" if needed */
    }

    /* Adjust form scaling or padding for better fit in portrait */
    .popup-dev .saeed-contact-formds {
        transform: scale(0.95); /* Slightly reduce size to ensure it fits */
        padding-top: 20px;
        padding-bottom: 20px;
    }
     main.max-w-7xl.mx-auto.px-6.md\:flex.md\:items-center.md\:gap-20.mt-\[55vh\].sm\:mt-\[32ch\] {
        margin-top: 30ch; /* Adjust as needed */
    }
}

/* iPad Pro 10" Landscape */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
    .saeed-contact-formds input,
    .saeed-contact-formds select,
    .saeed-contact-formds date {
        width: 100% !important;
    }
    /* Apply your specific flex rule here for landscape */
    .media-query-custom {
        display: flex;
        /* Add other styles for landscape iPad Pro 10" if needed */
    }

    body.home {
        zoom: 0.7;
        /* Be careful with zoom, it can have unintended side effects */
    }

    main.max-w-7xl.mx-auto.px-6.md\:flex.md\:items-center.md\:gap-20.mt-\[55vh\].sm\:mt-\[32ch\] {
        zoom: 1; /* Reset zoom if applied elsewhere */
        margin-top: 36ch; /* Adjust as needed for landscape */
    }
}

/* iPad Air Landscape (2048x1536) - High resolution */
/* This media query covers up to 1399px, ensure it doesn't conflict with iPad Pro landscape if both are meant to be distinct */
@media only screen
    and (min-device-width: 1024px)
    and (max-device-width: 1199px)
    and (orientation: landscape)
    and (-webkit-min-device-pixel-ratio: 2) {


    main.max-w-7xl.mx-auto.px-6.md\:flex.md\:items-center.md\:gap-20.mt-\[55vh\].sm\:mt-\[32ch\] {
        zoom: 1;
        margin-top: 36ch;
    }
}

/* Alternative approach - More general iPad landscape targeting */
/* This is a broader query, ensure it's not overriding specific iPad Pro 10" rules if you need those distinct */
@media only screen
    and (min-width: 768px)
    and (max-width: 1199px)
    and (orientation: landscape) {
    /* Your CSS rules for iPad landscape mode */


    main.max-w-7xl.mx-auto.px-6.md\:flex.md\:items-center.md\:gap-20.mt-\[55vh\].sm\:mt-\[32ch\] {
        zoom: 0.7;
        margin-top: 58ch;
    }
}

/* Prevents flash of unstyled content */
[x-cloak] {
    display: none !important;
}


