fix: hero and footer styling

This commit is contained in:
RizqiSyahrendra 2025-02-21 16:47:15 +07:00
parent 8e0018c185
commit d9cc92463c
5 changed files with 110 additions and 95 deletions

View File

@ -47,16 +47,10 @@
--bs-black-rgb: 0, 0, 0; --bs-black-rgb: 0, 0, 0;
--bs-body-color-rgb: 33, 37, 41; --bs-body-color-rgb: 33, 37, 41;
--bs-body-bg-rgb: 255, 255, 255; --bs-body-bg-rgb: 255, 255, 255;
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans",
"Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
"Liberation Mono", "Courier New", monospace;
--bs-gradient: linear-gradient(
180deg,
rgba(255, 255, 255, 0.15),
rgba(255, 255, 255, 0)
);
--bs-body-font-family: var(--bs-font-sans-serif); --bs-body-font-family: var(--bs-font-sans-serif);
--bs-body-font-size: 1rem; --bs-body-font-size: 1rem;
--bs-body-font-weight: 400; --bs-body-font-weight: 400;
@ -232,7 +226,7 @@ sup {
} }
a { a {
color: #0d6efd; color: #0d6efd;
text-decoration: underline; /* text-decoration: underline; */
} }
a:hover { a:hover {
color: #0a58ca; color: #0a58ca;
@ -1860,7 +1854,9 @@ progress {
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
border-radius: 0.25rem; border-radius: 0.25rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition:
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-control { .form-control {
@ -1909,11 +1905,16 @@ progress {
border-width: 0; border-width: 0;
border-inline-end-width: 1px; border-inline-end-width: 1px;
border-radius: 0; border-radius: 0;
-webkit-transition: color 0.15s ease-in-out, -webkit-transition:
background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
transition:
color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out; box-shadow 0.15s ease-in-out;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
} }
.form-control::file-selector-button { .form-control::file-selector-button {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
@ -1928,8 +1929,11 @@ progress {
border-width: 0; border-width: 0;
border-inline-end-width: 1px; border-inline-end-width: 1px;
border-radius: 0; border-radius: 0;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-control::-webkit-file-upload-button { .form-control::-webkit-file-upload-button {
@ -1959,11 +1963,16 @@ progress {
border-width: 0; border-width: 0;
border-inline-end-width: 1px; border-inline-end-width: 1px;
border-radius: 0; border-radius: 0;
-webkit-transition: color 0.15s ease-in-out, -webkit-transition:
background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
transition:
color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out; box-shadow 0.15s ease-in-out;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-control::-webkit-file-upload-button { .form-control::-webkit-file-upload-button {
@ -2079,7 +2088,9 @@ textarea.form-control-lg {
background-size: 16px 12px; background-size: 16px 12px;
border: 1px solid #ced4da; border: 1px solid #ced4da;
border-radius: 0.25rem; border-radius: 0.25rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition:
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@ -2235,10 +2246,14 @@ textarea.form-control-lg {
outline: 0; outline: 0;
} }
.form-range:focus::-webkit-slider-thumb { .form-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow:
0 0 0 1px #fff,
0 0 0 0.25rem rgba(13, 110, 253, 0.25);
} }
.form-range:focus::-moz-range-thumb { .form-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow:
0 0 0 1px #fff,
0 0 0 0.25rem rgba(13, 110, 253, 0.25);
} }
.form-range::-moz-focus-outer { .form-range::-moz-focus-outer {
border: 0; border: 0;
@ -2250,9 +2265,13 @@ textarea.form-control-lg {
background-color: #0d6efd; background-color: #0d6efd;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-webkit-transition: background-color 0.15s ease-in-out, -webkit-transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; background-color 0.15s ease-in-out,
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
transition:
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out; box-shadow 0.15s ease-in-out;
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;
@ -2281,9 +2300,13 @@ textarea.form-control-lg {
background-color: #0d6efd; background-color: #0d6efd;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
-moz-transition: background-color 0.15s ease-in-out, -moz-transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; background-color 0.15s ease-in-out,
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
transition:
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out; box-shadow 0.15s ease-in-out;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@ -2332,7 +2355,9 @@ textarea.form-control-lg {
pointer-events: none; pointer-events: none;
border: 1px solid transparent; border: 1px solid transparent;
transform-origin: 0 0; transform-origin: 0 0;
transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; transition:
opacity 0.1s ease-in-out,
transform 0.1s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.form-floating > label { .form-floating > label {
@ -2439,21 +2464,19 @@ textarea.form-control-lg {
padding-right: 3rem; padding-right: 3rem;
} }
.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3), .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3),
.input-group:not(.has-validation) .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
> :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4), .input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4),
.input-group.has-validation .input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu) {
> :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu) {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.input-group .input-group
> :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not( > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(
.valid-feedback .invalid-feedback
):not(.invalid-tooltip):not(.invalid-feedback) { ) {
margin-left: -1px; margin-left: -1px;
border-top-left-radius: 0; border-top-left-radius: 0;
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
@ -2501,8 +2524,7 @@ textarea.form-control-lg {
.was-validated textarea.form-control:valid, .was-validated textarea.form-control:valid,
textarea.form-control.is-valid { textarea.form-control.is-valid {
padding-right: calc(1.5em + 0.75rem); padding-right: calc(1.5em + 0.75rem);
background-position: top calc(0.375em + 0.1875rem) right background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
calc(0.375em + 0.1875rem);
} }
.form-select.is-valid, .form-select.is-valid,
.was-validated .form-select:valid { .was-validated .form-select:valid {
@ -2515,8 +2537,12 @@ textarea.form-control.is-valid {
padding-right: 4.125rem; padding-right: 4.125rem;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"),
url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
background-position: right 0.75rem center, center right 2.25rem; background-position:
background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); right 0.75rem center,
center right 2.25rem;
background-size:
16px 12px,
calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
} }
.form-select.is-valid:focus, .form-select.is-valid:focus,
.was-validated .form-select:valid:focus { .was-validated .form-select:valid:focus {
@ -2597,8 +2623,7 @@ textarea.form-control.is-valid {
.was-validated textarea.form-control:invalid, .was-validated textarea.form-control:invalid,
textarea.form-control.is-invalid { textarea.form-control.is-invalid {
padding-right: calc(1.5em + 0.75rem); padding-right: calc(1.5em + 0.75rem);
background-position: top calc(0.375em + 0.1875rem) right background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
calc(0.375em + 0.1875rem);
} }
.form-select.is-invalid, .form-select.is-invalid,
.was-validated .form-select:invalid { .was-validated .form-select:invalid {
@ -2611,8 +2636,12 @@ textarea.form-control.is-invalid {
padding-right: 4.125rem; padding-right: 4.125rem;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"),
url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
background-position: right 0.75rem center, center right 2.25rem; background-position:
background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); right 0.75rem center,
center right 2.25rem;
background-size:
16px 12px,
calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
} }
.form-select.is-invalid:focus, .form-select.is-invalid:focus,
.was-validated .form-select:invalid:focus { .was-validated .form-select:invalid:focus {
@ -2667,8 +2696,11 @@ textarea.form-control.is-invalid {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
font-size: 1rem; font-size: 1rem;
border-radius: 0.25rem; border-radius: 0.25rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.btn { .btn {
@ -3729,7 +3761,9 @@ fieldset:disabled .btn {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
color: #0d6efd; color: #0d6efd;
text-decoration: none; text-decoration: none;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, transition:
color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out; border-color 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
@ -4438,8 +4472,11 @@ fieldset:disabled .btn {
border: 0; border: 0;
border-radius: 0; border-radius: 0;
overflow-anchor: none; overflow-anchor: none;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out,
border-radius 0.15s ease; border-radius 0.15s ease;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
@ -4562,8 +4599,11 @@ fieldset:disabled .btn {
text-decoration: none; text-decoration: none;
background-color: #fff; background-color: #fff;
border: 1px solid #dee2e6; border: 1px solid #dee2e6;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, transition:
border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; color 0.15s ease-in-out,
background-color 0.15s ease-in-out,
border-color 0.15s ease-in-out,
box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.page-link { .page-link {
@ -6088,18 +6128,8 @@ fieldset:disabled .btn {
} }
} }
.placeholder-wave { .placeholder-wave {
-webkit-mask-image: linear-gradient( -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
130deg, mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
#000 55%,
rgba(0, 0, 0, 0.8) 75%,
#000 95%
);
mask-image: linear-gradient(
130deg,
#000 55%,
rgba(0, 0, 0, 0.8) 75%,
#000 95%
);
-webkit-mask-size: 200% 100%; -webkit-mask-size: 200% 100%;
mask-size: 200% 100%; mask-size: 200% 100%;
-webkit-animation: placeholder-wave 2s linear infinite; -webkit-animation: placeholder-wave 2s linear infinite;
@ -7200,24 +7230,15 @@ fieldset:disabled .btn {
} }
.bg-primary { .bg-primary {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
background-color: rgba( background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
var(--bs-primary-rgb),
var(--bs-bg-opacity)
) !important;
} }
.bg-secondary { .bg-secondary {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
background-color: rgba( background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
var(--bs-secondary-rgb),
var(--bs-bg-opacity)
) !important;
} }
.bg-success { .bg-success {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
background-color: rgba( background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
var(--bs-success-rgb),
var(--bs-bg-opacity)
) !important;
} }
.bg-info { .bg-info {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
@ -7225,10 +7246,7 @@ fieldset:disabled .btn {
} }
.bg-warning { .bg-warning {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
background-color: rgba( background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
var(--bs-warning-rgb),
var(--bs-bg-opacity)
) !important;
} }
.bg-danger { .bg-danger {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
@ -7252,10 +7270,7 @@ fieldset:disabled .btn {
} }
.bg-body { .bg-body {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;
background-color: rgba( background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
var(--bs-body-bg-rgb),
var(--bs-bg-opacity)
) !important;
} }
.bg-transparent { .bg-transparent {
--bs-bg-opacity: 1; --bs-bg-opacity: 1;

View File

@ -754,12 +754,12 @@ body {
} }
a { a {
color: var(--color-dark-1); color: var(--color-dark-1);
text-decoration: underline; /* text-decoration: underline; */
transition: color 0.1s var(--ease-default); transition: color 0.1s var(--ease-default);
} }
a:hover { a:hover {
color: var(--color-dark-4); color: var(--color-dark-4);
text-decoration: underline; /* text-decoration: underline; */
} }
b, b,
strong { strong {
@ -10141,9 +10141,9 @@ a.link-to-top.color:before {
.footer-text { .footer-text {
text-transform: none; text-transform: none;
} }
.footer-text a { /* .footer-text a {
text-decoration: underline; text-decoration: underline;
} } */
.fw-top-link { .fw-top-link {
text-decoration: none; text-decoration: none;
} }

View File

@ -1,6 +1,5 @@
// "use client"; // "use client";
import Hero6 from "@/components/Hero"; import Hero6 from "@/components/Hero";
import dynamic from "next/dynamic";
// const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer"), { // const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer"), {
// ssr: false, // ssr: false,

View File

@ -36,7 +36,7 @@ export default function Footer() {
href="https://www.google.com/maps/place/5151+AZ-90,+Sierra+Vista,+AZ+85635" href="https://www.google.com/maps/place/5151+AZ-90,+Sierra+Vista,+AZ+85635"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="underline text-lg text-white" className="text-lg text-white"
> >
5151 E HIGHWAY 90 5151 E HIGHWAY 90
</a> </a>
@ -58,7 +58,7 @@ export default function Footer() {
href="https://www.facebook.com/p/Cochise-Oncology-61556262839823" href="https://www.facebook.com/p/Cochise-Oncology-61556262839823"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="underline text-lg text-white" className="text-lg text-white"
> >
Facebook Facebook
</a> </a>

View File

@ -2,6 +2,7 @@
import ModalVideo from "react-modal-video"; import ModalVideo from "react-modal-video";
import { useState } from "react"; import { useState } from "react";
import Link from "next/link";
export default function Hero6() { export default function Hero6() {
const [isOpen, setOpen] = useState(false); const [isOpen, setOpen] = useState(false);
@ -34,9 +35,9 @@ export default function Hero6() {
data-wow-duration="1.2s" data-wow-duration="1.2s"
data-wow-offset={0} data-wow-offset={0}
> >
<button className="bg-[#64B3B4] text-white px-4 py-2 m-3 rounded-3xl hover:opacity-[0.7]"> <Link href="/contact" className="bg-[#64B3B4] text-white px-4 py-2 m-3 rounded-3xl hover:opacity-[0.7]">
Request Consultation Request Consultation
</button> </Link>
{/* <a {/* <a
onClick={() => setOpen(true)} onClick={() => setOpen(true)}
className="link-hover-anim align-middle lightbox mfp-iframe mt-10" className="link-hover-anim align-middle lightbox mfp-iframe mt-10"