:root,
.dark {
  --background: 220 34% 5%;
  --foreground: 42 48% 96%;
  --card: 218 26% 9%;
  --card-foreground: 42 48% 96%;
  --popover: 218 26% 9%;
  --popover-foreground: 42 48% 96%;
  --primary: 184 100% 55%;
  --primary-foreground: 220 34% 5%;
  --secondary: 153 82% 52%;
  --secondary-foreground: 220 34% 5%;
  --muted: 218 18% 16%;
  --muted-foreground: 42 28% 78%;
  --accent: 18 100% 61%;
  --accent-foreground: 42 48% 96%;
  --border: 184 70% 34%;
  --input: 184 70% 34%;
  --ring: 153 82% 52%;
  --steel: 184 70% 34%;
  --volt: 153 82% 52%;
  --carbon: 220 34% 5%;
  --bone: 42 48% 96%;
  --radius: .5rem;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: #05070c !important;
  background-image:
    linear-gradient(120deg, rgba(0, 229, 255, .13), transparent 28%),
    linear-gradient(235deg, rgba(255, 107, 53, .12), transparent 30%),
    linear-gradient(180deg, #05070c 0%, #0a1116 46%, #05070c 100%) !important;
  color: #fff7e8 !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .95), rgba(0, 0, 0, .28));
}

h1,
h2,
h3,
h4 {
  letter-spacing: 0 !important;
  color: #fffaf0 !important;
}

p,
li,
span {
  color: inherit;
}

.text-muted-foreground,
.text-bone\/60,
.text-bone\/70,
.text-bone\/75,
.text-bone\/80,
.text-bone\/85 {
  color: rgba(255, 247, 232, .78) !important;
}

.text-volt,
.text-primary,
.hover\:text-volt:hover {
  color: #38f59b !important;
}

.text-bone,
.text-white,
.text-foreground {
  color: #fff7e8 !important;
}

.bg-carbon,
.bg-card,
.bg-card\/20,
.bg-card\/30,
.bg-muted,
.bg-secondary,
.bg-accent {
  background-color: rgba(7, 14, 20, .72) !important;
}

.border-steel\/20,
.border-steel\/30,
.border-steel\/35,
.border-steel\/40,
.border-steel\/50,
.border-steel\/60,
.border-border,
.border-input {
  border-color: rgba(0, 229, 255, .28) !important;
}

nav.sticky {
  background: rgba(5, 8, 12, .74) !important;
  border-bottom: 1px solid rgba(0, 229, 255, .26) !important;
  box-shadow: 0 18px 50px -34px rgba(0, 229, 255, .9) !important;
  backdrop-filter: blur(22px) saturate(1.45);
  -webkit-backdrop-filter: blur(22px) saturate(1.45);
}

nav.sticky .max-w-7xl {
  min-height: 72px;
}

nav.sticky a {
  border-radius: 999px;
}

nav.sticky .xl\:flex a,
footer a,
#seo-local-content nav a {
  transition: color .2s ease, border-color .2s ease, background-color .2s ease, transform .2s ease;
}

nav.sticky .xl\:flex a {
  padding: .6rem .85rem;
  color: rgba(255, 247, 232, .82) !important;
}

nav.sticky .xl\:flex a:hover {
  background: rgba(255, 255, 255, .08);
  color: #ffffff !important;
}

nav.sticky .absolute.left-0.top-full {
  width: 22rem !important;
  border-radius: 18px !important;
  border: 1px solid rgba(0, 229, 255, .34) !important;
  background: rgba(7, 14, 20, .92) !important;
  box-shadow: 0 24px 60px -28px rgba(0, 229, 255, .9);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

nav.sticky .absolute.left-0.top-full a {
  border-radius: 12px !important;
}

.bg-gradient-to-br {
  background-image: linear-gradient(135deg, #00e5ff 0%, #38f59b 52%, #ff6b35 100%) !important;
  color: #05070c !important;
}

button,
[role="button"],
a .inline-flex,
.inline-flex.items-center.justify-center {
  border-radius: 999px !important;
}

a .inline-flex,
button.inline-flex,
.inline-flex.items-center.justify-center {
  min-height: 46px;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .06)) !important;
  color: #fff7e8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .22),
    0 14px 36px -24px rgba(0, 229, 255, .95) !important;
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
}

a[href^="tel:"] .inline-flex,
a[href^="tel:"].inline-flex,
.bg-\[\#f2632e\],
.bg-volt {
  background: linear-gradient(135deg, rgba(255, 107, 53, .92), rgba(255, 196, 87, .72)) !important;
  color: #080b10 !important;
  border-color: rgba(255, 196, 87, .46) !important;
}

a[href*="wa.me"] .inline-flex,
a[href*="wa.me"].inline-flex {
  background: linear-gradient(135deg, rgba(56, 245, 155, .18), rgba(0, 229, 255, .12)) !important;
  border-color: rgba(56, 245, 155, .48) !important;
  color: #f5fff8 !important;
}

a .inline-flex:hover,
button.inline-flex:hover,
.inline-flex.items-center.justify-center:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 229, 255, .58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .26),
    0 18px 44px -24px rgba(56, 245, 155, .95) !important;
}

.masonry-panel,
.rounded-xl,
article,
.bg-card\/20,
.bg-card\/30 {
  border-color: rgba(0, 229, 255, .24) !important;
}

.masonry-panel,
article.masonry-panel,
.rounded-xl.masonry-panel,
section .rounded-xl,
.group\/card,
.overflow-hidden.rounded-xl {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .035)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .12),
    0 22px 70px -46px rgba(0, 229, 255, .95) !important;
  backdrop-filter: blur(16px) saturate(1.25);
  -webkit-backdrop-filter: blur(16px) saturate(1.25);
}

.mortar-grid {
  background: transparent !important;
}

.section-gap {
  padding-top: clamp(4rem, 7vw, 7rem) !important;
  padding-bottom: clamp(4rem, 7vw, 7rem) !important;
}

section {
  border-color: rgba(0, 229, 255, .18) !important;
}

img {
  filter: saturate(1.2) contrast(1.1) brightness(1.04);
}

.relative:has(> img),
.overflow-hidden:has(> img) {
  border-color: rgba(0, 229, 255, .26) !important;
}

.relative:has(> img)::after,
.overflow-hidden:has(> img)::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}

.relative > img,
.overflow-hidden > img {
  transition: transform .35s ease, filter .35s ease;
}

.relative:hover > img,
.overflow-hidden:hover > img {
  transform: scale(1.035);
  filter: saturate(1.35) contrast(1.15) brightness(1.08);
}

.absolute.inset-0.bg-gradient-to-t,
.absolute.inset-0.bg-gradient-to-b,
.absolute.inset-0.bg-black\/55 {
  opacity: .42 !important;
}

.visual-proof-strip {
  position: relative;
  padding: clamp(3.5rem, 6vw, 6rem) 1rem;
  border-top: 1px solid rgba(0, 229, 255, .18);
  border-bottom: 1px solid rgba(0, 229, 255, .18);
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .09), transparent 34%),
    linear-gradient(240deg, rgba(255, 107, 53, .12), transparent 30%),
    rgba(5, 8, 12, .88);
}

.visual-proof-inner {
  width: min(1280px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
}

.visual-proof-copy {
  max-width: 460px;
}

.visual-eyebrow {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 1rem;
  border: 1px solid rgba(56, 245, 155, .38);
  border-radius: 999px;
  background: rgba(56, 245, 155, .12);
  color: #38f59b !important;
  padding: .42rem .75rem;
  font-family: var(--font-mono);
  font-size: .72rem;
  text-transform: uppercase;
}

.visual-proof-copy h2 {
  font-size: clamp(2rem, 4.2vw, 4.25rem);
  line-height: 1.02;
  margin-bottom: 1rem;
}

.visual-proof-copy p {
  color: rgba(255, 247, 232, .76);
  font-size: 1.05rem;
}

.visual-proof-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: clamp(150px, 16vw, 230px);
  gap: .85rem;
}

.visual-proof-card {
  position: relative;
  overflow: hidden;
  min-height: 160px;
  border: 1px solid rgba(0, 229, 255, .32);
  border-radius: 22px;
  background: rgba(255, 255, 255, .06);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 26px 64px -38px rgba(0, 229, 255, .95);
}

.visual-proof-card-large {
  grid-column: span 2;
  grid-row: span 2;
}

.visual-proof-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visual-proof-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(to top, rgba(0, 0, 0, .74), transparent 46%),
    linear-gradient(135deg, rgba(0, 229, 255, .16), transparent 38%);
}

.visual-proof-card figcaption {
  position: absolute;
  left: .85rem;
  right: .85rem;
  bottom: .85rem;
  z-index: 2;
  width: fit-content;
  max-width: calc(100% - 1.7rem);
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  background: rgba(5, 8, 12, .56);
  color: #fff7e8;
  padding: .42rem .72rem;
  font-size: .82rem;
  font-weight: 700;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.visual-proof-card:hover img {
  transform: scale(1.055);
}

section .grid img,
article img {
  min-height: 100%;
}

.bg-black\/55,
.from-carbon\/80,
.from-carbon\/70,
.to-carbon,
.to-carbon\/80 {
  background-color: rgba(5, 7, 12, .58) !important;
  --tw-gradient-from: rgba(5, 7, 12, .88) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(5, 7, 12, .34) var(--tw-gradient-to-position) !important;
}

footer {
  background: linear-gradient(180deg, rgba(5, 8, 12, .95), #020305) !important;
  border-top: 1px solid rgba(0, 229, 255, .25) !important;
}

footer a:hover,
#seo-local-content a:hover {
  color: #38f59b !important;
}

.fixed.bottom-0 {
  background: rgba(5, 8, 12, .78) !important;
  border-top: 1px solid rgba(0, 229, 255, .26) !important;
  backdrop-filter: blur(20px) saturate(1.45);
  -webkit-backdrop-filter: blur(20px) saturate(1.45);
}

#seo-local-content {
  margin-top: 0 !important;
  border-top: 1px solid rgba(0, 229, 255, .22);
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .10), transparent 35%),
    linear-gradient(180deg, rgba(7, 14, 20, .92), rgba(5, 8, 12, .98)) !important;
  color: #fff7e8 !important;
}

#seo-local-content h1,
#seo-local-content h2 {
  margin-bottom: .85rem;
}

#seo-local-content p,
#seo-local-content details,
#seo-local-content nav {
  margin-bottom: 1rem;
  color: rgba(255, 247, 232, .78);
}

#seo-local-content a {
  color: #38f59b;
}

#seo-local-content details {
  border: 1px solid rgba(0, 229, 255, .24);
  border-radius: 14px;
  padding: 1rem;
  background: rgba(255, 255, 255, .055);
}

#seo-local-content summary {
  cursor: pointer;
  color: #fff7e8;
  font-weight: 700;
}

#seo-local-content form {
  display: grid;
  gap: .9rem;
  max-width: 620px;
}

#seo-local-content label {
  display: grid;
  gap: .4rem;
  color: rgba(255, 247, 232, .82);
}

#seo-local-content input,
#seo-local-content textarea {
  width: 100%;
  border: 1px solid rgba(0, 229, 255, .28);
  border-radius: 14px;
  background: rgba(255, 255, 255, .07);
  color: #fff7e8;
  padding: .85rem 1rem;
}

#seo-local-content button {
  width: fit-content;
  border: 1px solid rgba(56, 245, 155, .46);
  background: rgba(56, 245, 155, .16);
  color: #fff7e8;
  padding: .85rem 1.2rem;
}

@media (max-width: 767px) {
  nav.sticky .h-16 {
    height: 4.5rem !important;
  }

  nav.sticky a[href^="tel:"] {
    min-width: 138px;
  }

  .section-gap {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }

  h1 {
    font-size: clamp(2.1rem, 13vw, 3.4rem) !important;
    line-height: 1.02 !important;
  }

  .visual-proof-inner {
    grid-template-columns: 1fr;
  }

  .visual-proof-copy {
    max-width: none;
  }

  .visual-proof-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 240px;
  }

  .visual-proof-card-large {
    grid-column: span 1;
    grid-row: span 1;
  }
}

/* Light, high-contrast visual direction */
:root,
.dark {
  --background: 205 82% 98%;
  --foreground: 216 34% 12%;
  --card: 0 0% 100%;
  --card-foreground: 216 34% 12%;
  --popover: 0 0% 100%;
  --popover-foreground: 216 34% 12%;
  --primary: 191 100% 34%;
  --primary-foreground: 0 0% 100%;
  --secondary: 151 68% 39%;
  --secondary-foreground: 0 0% 100%;
  --muted: 205 48% 92%;
  --muted-foreground: 215 18% 35%;
  --accent: 18 94% 54%;
  --accent-foreground: 0 0% 100%;
  --border: 196 58% 72%;
  --input: 196 58% 72%;
  --ring: 191 100% 34%;
  --steel: 196 58% 72%;
  --volt: 151 68% 39%;
  --carbon: 205 82% 98%;
  --bone: 216 34% 12%;
}

body {
  background-color: #f7fbff !important;
  background-image:
    linear-gradient(120deg, rgba(0, 145, 179, .13), transparent 32%),
    linear-gradient(235deg, rgba(255, 107, 53, .11), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f2f8ff 46%, #eef7f4 100%) !important;
  color: #142033 !important;
}

body::before {
  background-image:
    linear-gradient(rgba(0, 88, 120, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 88, 120, .08) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .55), rgba(0, 0, 0, .08));
}

h1,
h2,
h3,
h4,
.text-bone,
.text-white,
.text-foreground {
  color: #101928 !important;
}

.text-muted-foreground,
.text-bone\/60,
.text-bone\/70,
.text-bone\/75,
.text-bone\/80,
.text-bone\/85 {
  color: rgba(20, 32, 51, .72) !important;
}

.text-volt,
.text-primary,
.hover\:text-volt:hover {
  color: #098f61 !important;
}

.bg-carbon,
.bg-card,
.bg-card\/20,
.bg-card\/30,
.bg-muted,
.bg-secondary,
.bg-accent {
  background-color: rgba(255, 255, 255, .72) !important;
}

.border-steel\/20,
.border-steel\/30,
.border-steel\/35,
.border-steel\/40,
.border-steel\/50,
.border-steel\/60,
.border-border,
.border-input {
  border-color: rgba(0, 145, 179, .28) !important;
}

nav.sticky {
  background: rgba(255, 255, 255, .78) !important;
  border-bottom: 1px solid rgba(0, 145, 179, .22) !important;
  box-shadow: 0 18px 50px -34px rgba(0, 88, 120, .55) !important;
}

nav.sticky .xl\:flex a {
  color: rgba(20, 32, 51, .78) !important;
}

nav.sticky .xl\:flex a:hover {
  background: rgba(0, 145, 179, .08);
  color: #101928 !important;
}

nav.sticky .absolute.left-0.top-full {
  border-color: rgba(0, 145, 179, .24) !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 24px 60px -28px rgba(0, 88, 120, .55);
}

.bg-gradient-to-br {
  background-image: linear-gradient(135deg, #00a4c7 0%, #20b486 52%, #ff7848 100%) !important;
  color: #ffffff !important;
}

a .inline-flex,
button.inline-flex,
.inline-flex.items-center.justify-center {
  border-color: rgba(0, 88, 120, .18) !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .48)) !important;
  color: #142033 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .88),
    0 14px 36px -24px rgba(0, 88, 120, .6) !important;
}

a[href^="tel:"] .inline-flex,
a[href^="tel:"].inline-flex,
.bg-\[\#f2632e\],
.bg-volt {
  background: linear-gradient(135deg, rgba(255, 120, 72, .96), rgba(255, 196, 87, .86)) !important;
  color: #101928 !important;
  border-color: rgba(255, 120, 72, .52) !important;
}

a[href*="wa.me"] .inline-flex,
a[href*="wa.me"].inline-flex {
  background: linear-gradient(135deg, rgba(32, 180, 134, .18), rgba(0, 164, 199, .12)) !important;
  border-color: rgba(32, 180, 134, .44) !important;
  color: #101928 !important;
}

.masonry-panel,
article.masonry-panel,
.rounded-xl.masonry-panel,
section .rounded-xl,
.group\/card,
.overflow-hidden.rounded-xl {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .58)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .82),
    0 22px 70px -46px rgba(0, 88, 120, .68) !important;
}

.bg-black\/55,
.from-carbon\/80,
.from-carbon\/70,
.to-carbon,
.to-carbon\/80 {
  background-color: rgba(255, 255, 255, .2) !important;
  --tw-gradient-from: rgba(255, 255, 255, .38) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(255, 255, 255, .05) var(--tw-gradient-to-position) !important;
}

footer {
  background: linear-gradient(180deg, rgba(255, 255, 255, .92), #e9f5ff) !important;
  border-top: 1px solid rgba(0, 145, 179, .22) !important;
}

.fixed.bottom-0 {
  background: rgba(255, 255, 255, .84) !important;
  border-top: 1px solid rgba(0, 145, 179, .24) !important;
}

.visual-proof-strip {
  background:
    linear-gradient(135deg, rgba(0, 164, 199, .13), transparent 34%),
    linear-gradient(240deg, rgba(255, 120, 72, .12), transparent 32%),
    rgba(255, 255, 255, .76) !important;
}

.visual-eyebrow {
  background: rgba(32, 180, 134, .12);
  border-color: rgba(32, 180, 134, .35);
  color: #087b55 !important;
}

.visual-proof-copy p {
  color: rgba(20, 32, 51, .72);
}

.visual-proof-card {
  border-color: rgba(0, 145, 179, .24);
  background: rgba(255, 255, 255, .72);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .72),
    0 26px 64px -38px rgba(0, 88, 120, .58);
}

.visual-proof-card::before {
  background:
    linear-gradient(to top, rgba(0, 0, 0, .52), transparent 46%),
    linear-gradient(135deg, rgba(0, 164, 199, .12), transparent 38%);
}

.visual-proof-card figcaption {
  background: rgba(255, 255, 255, .76);
  border-color: rgba(255, 255, 255, .72);
  color: #101928;
}

#seo-local-content {
  background:
    linear-gradient(135deg, rgba(0, 164, 199, .10), transparent 35%),
    linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(238, 247, 244, .98)) !important;
  color: #142033 !important;
}

#seo-local-content p,
#seo-local-content details,
#seo-local-content nav {
  color: rgba(20, 32, 51, .72);
}

#seo-local-content a {
  color: #087b55;
}

#seo-local-content details {
  border-color: rgba(0, 145, 179, .22);
  background: rgba(255, 255, 255, .7);
}

#seo-local-content summary,
#seo-local-content label {
  color: #101928;
}

#seo-local-content input,
#seo-local-content textarea {
  border-color: rgba(0, 145, 179, .25);
  background: rgba(255, 255, 255, .82);
  color: #101928;
}

#seo-local-content button {
  border-color: rgba(32, 180, 134, .38);
  background: rgba(32, 180, 134, .14);
  color: #101928;
}

.mobile-service-menu {
  display: none;
}

/* Final light-theme enforcement and Contact cleanup */
html,
body,
#root,
#root > div {
  background: #f7fbff !important;
  color: #142033 !important;
}

body {
  background-image:
    linear-gradient(120deg, rgba(0, 145, 179, .10), transparent 34%),
    linear-gradient(235deg, rgba(255, 120, 72, .10), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 48%, #eef8f4 100%) !important;
}

main,
section,
footer,
[class*="bg-carbon"],
[class*="bg-card"],
[class*="bg-muted"],
[class*="bg-secondary"] {
  background-color: transparent !important;
  color: #142033 !important;
}

nav.sticky,
.masonry-panel,
article,
.rounded-xl,
footer,
#seo-local-content,
.fixed.bottom-0 {
  background-color: rgba(255, 255, 255, .78) !important;
}

body[data-route="contact"] .visual-proof-strip,
body[data-route="contact"] #root section:first-of-type img,
body[data-route="contact"] #root section:first-of-type picture,
body[data-route="contact"] #root section:first-of-type .overflow-hidden:has(img),
body[data-route="contact"] #root section:nth-of-type(2) .grid:has(img) {
  display: none !important;
}

body[data-route="contact"] #root section:first-of-type {
  background:
    linear-gradient(135deg, rgba(0, 145, 179, .12), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(239, 248, 255, .92)) !important;
}

body[data-route="contact"] #root section:first-of-type .grid,
body[data-route="contact"] #root section:first-of-type .lg\:grid-cols-2 {
  grid-template-columns: 1fr !important;
}

@media (max-width: 1279px) {
  .mobile-service-menu {
    position: fixed;
    top: 4.5rem;
    left: 0;
    right: 0;
    z-index: 45;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .5rem;
    overflow: visible;
    padding: .55rem .65rem;
    border-bottom: 1px solid rgba(0, 145, 179, .18);
    background: rgba(255, 255, 255, .95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 16px 28px -24px rgba(0, 88, 120, .45);
  }

  #root main {
    padding-top: 6.2rem !important;
  }

  .mobile-service-menu a {
    min-width: 0;
    min-height: 36px;
    border: 1px solid rgba(0, 145, 179, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .86);
    color: #142033 !important;
    padding: .48rem .42rem;
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
    box-shadow: 0 12px 26px -22px rgba(0, 88, 120, .5);
  }

  h1,
  h2,
  h3,
  p,
  a,
  button,
  span,
  li {
    overflow-wrap: anywhere;
  }

  a .inline-flex,
  button.inline-flex,
  .inline-flex.items-center.justify-center {
    max-width: 100%;
    white-space: normal !important;
    text-align: center;
  }

  body[data-route="home"] #root section:first-of-type {
    min-height: calc(100svh - 8.5rem) !important;
    align-items: start !important;
  }

  body[data-route="home"] #root section:first-of-type > div:first-child::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .42) 42%, rgba(0, 0, 0, .66) 100%),
      linear-gradient(90deg, rgba(0, 0, 0, .70), rgba(0, 0, 0, .30));
    pointer-events: none;
  }

  body[data-route="home"] #root section:first-of-type > .relative {
    padding-top: 2.2rem !important;
    padding-bottom: 7.25rem !important;
    text-align: center !important;
  }

  body[data-route="home"] #root section:first-of-type > .relative > div {
    max-width: 100% !important;
    margin-inline: auto !important;
  }

  body[data-route="home"] #root section:first-of-type h1 {
    max-width: 11ch !important;
    margin-inline: auto !important;
    color: #fff !important;
    font-size: clamp(2.25rem, 10.6vw, 3.15rem) !important;
    line-height: .98 !important;
    text-align: center !important;
    text-shadow:
      0 2px 1px rgba(0, 0, 0, .95),
      0 8px 24px rgba(0, 0, 0, .92),
      0 0 2px rgba(255, 255, 255, .85) !important;
    -webkit-text-stroke: .45px rgba(0, 0, 0, .88);
  }

  body[data-route="home"] #root section:first-of-type p,
  body[data-route="home"] #root section:first-of-type span {
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .95), 0 0 1px rgba(0, 0, 0, .9) !important;
  }

  body[data-route="home"] #root section:first-of-type p {
    max-width: 32ch !important;
    margin-inline: auto !important;
    font-size: .98rem !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 767px) {
  .mobile-service-menu {
    padding: .48rem .5rem;
  }

  .mobile-service-menu a {
    font-size: .72rem;
    padding: .46rem .24rem;
  }
}

@media (max-width: 370px) {
  .mobile-service-menu {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #root main {
    padding-top: 8.85rem !important;
  }
}
