@font-face {
  font-family: "SiteDisplay";
  src: local("Arial");
  font-display: swap;
}

:root {
  --font-heading: "SiteDisplay", Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --deep-blue: #183094;
  --soft-violet: #7A72AA;
  --mist-violet: #B4AED4;
  --ink: #111827;
  --body: #374151;
  --pale: #F5F4FB;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
  font-size: 16px;
  line-height: 1.65;
  color: var(--body);
  background: #fff;
}

h1,
h2,
h3,
h4 {
  color: var(--ink);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

h1 {
  font-size: clamp(39px, 8.5vw, 76px);
}

h2 {
  font-size: clamp(31px, 6vw, 52px);
}

h3,
h4 {
  font-size: clamp(22px, 3.5vw, 28px);
}

p,
li,
a,
button,
input,
textarea {
  font-size: 16px;
}

.site-shell {
  position: relative;
  isolation: isolate;
}

.sculpture {
  position: absolute;
  z-index: -1;
  width: min(48vw, 460px);
  aspect-ratio: 1;
  border-radius: 42% 58% 65% 35% / 45% 38% 62% 55%;
  background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .65), transparent 28%), linear-gradient(135deg, rgba(180, 174, 212, .78), rgba(122, 114, 170, .5));
  filter: blur(.2px);
  opacity: .7;
  animation: driftSpin 18s linear infinite;
  pointer-events: none;
}

.sculpture.one {
  top: 720px;
  right: -160px;
}

.sculpture.two {
  top: 1820px;
  left: -190px;
  background: linear-gradient(135deg, rgba(24, 48, 148, .18), rgba(180, 174, 212, .72));
  animation-duration: 24s;
}

.sculpture.three {
  bottom: 900px;
  right: -130px;
  animation-duration: 28s;
}

@keyframes driftSpin {
  0% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  50% { transform: translate3d(-22px, 34px, 0) rotate(180deg) scale(1.07); }
  100% { transform: translate3d(0, 0, 0) rotate(360deg) scale(1); }
}

.topbar {
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(24, 48, 148, .12);
}

.logo-mark {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--deep-blue);
  color: #fff;
  clip-path: polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  flex: 0 0 auto;
}

.logo-text {
  font-family: var(--font-heading);
  font-size: 24px;
  line-height: 1.05;
  color: #111827;
  font-weight: 800;
  letter-spacing: -.04em;
}

.desktop-only {
  display: none !important;
}

.mobile-only {
  display: flex !important;
}

@media (min-width: 768px) {
  .desktop-only {
    display: flex !important;
  }
  .mobile-only {
    display: none !important;
  }
}

.hero-section {
  min-height: 760px;
  background-image: linear-gradient(90deg, rgba(10, 17, 54, .94) 0%, rgba(15, 28, 94, .76) 48%, rgba(15, 28, 94, .34) 100%), var(--hero-image);
  background-size: cover;
  background-position: center;
  color: #fff;
}

.hero-section h1,
.hero-section p,
.hero-section li {
  color: #fff;
}

.trust-panel {
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .28);
  backdrop-filter: blur(18px);
  color: #fff;
}

.star-rating {
  color: var(--accent);
  letter-spacing: .12em;
  font-size: 22px;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .24);
}

.gallery-icon-row img {
  width: auto;
  height: 48px;
  max-width: 92px;
  object-fit: contain;
  border: 1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.12);
  padding: 6px;
}

.btn-primary,
.btn-dark,
.header-call,
.menu-call {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 52px;
  padding: 0 1.35rem;
  border: 0;
  border-radius: 0;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .22s ease, background .22s ease, color .22s ease;
}

.btn-primary {
  color: #111827;
  background: #fff;
  box-shadow: 0 0 0 0 rgba(255,255,255,.5);
  animation: ctaGlow 2.4s ease-in-out infinite;
}

.btn-primary:hover {
  color: #fff;
  background: var(--soft-violet);
  transform: translateY(-2px);
}

.btn-dark,
.header-call,
.menu-call {
  color: #fff;
  background: var(--deep-blue);
  animation: ctaGlowDark 2.8s ease-in-out infinite;
}

.btn-dark:hover,
.header-call:hover,
.menu-call:hover {
  color: #fff;
  background: var(--primary-dark);
  transform: translateY(-2px);
}

@keyframes ctaGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,.45); }
  50% { box-shadow: 0 0 0 12px rgba(255,255,255,.16); }
}

@keyframes ctaGlowDark {
  0%, 100% { box-shadow: 0 0 0 0 rgba(180,174,212,.48); }
  50% { box-shadow: 0 0 0 12px rgba(180,174,212,.18); }
}

.section-pad {
  padding: 72px 0;
}

.section-kicker {
  display: inline-flex;
  width: 58px;
  height: 5px;
  margin-top: 18px;
  background: linear-gradient(90deg, var(--soft-violet), var(--mist-violet));
}

.glass-card,
.service-card,
.review-card,
.process-card,
.faq-card {
  border-radius: 0;
  border: 1px solid rgba(24, 48, 148, .12);
  background: #fff;
  color: #374151;
  box-shadow: 0 18px 50px rgba(24, 48, 148, .08);
}

.dark-band {
  color: #fff;
  background: linear-gradient(135deg, #101947, #183094 62%, #2c3190);
}

.dark-band h2,
.dark-band h3,
.dark-band p,
.dark-band li,
.dark-band a {
  color: #fff;
}

.media-panel img {
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
}

.two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: center;
}

@media (min-width: 900px) {
  .two-col {
    grid-template-columns: 65% 35%;
  }
  .two-col.reverse {
    grid-template-columns: 35% 65%;
  }
}

.service-card svg,
.feature-icon,
.trust-icon {
  color: var(--deep-blue);
}

.reviews-viewport {
  overflow: hidden;
}

.reviews-track {
  display: flex;
  transition: transform .45s ease;
}

.review-slide {
  flex: 0 0 100%;
  padding: 10px;
}

@media (min-width: 768px) {
  .review-slide {
    flex-basis: 33.3333%;
  }
}

.mobile-sticky-call {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 80;
  display: none;
  transform: translateY(120%);
  opacity: 0;
  transition: transform .25s ease, opacity .25s ease;
  background: var(--deep-blue);
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  box-shadow: 0 -12px 34px rgba(0,0,0,.18);
}

.mobile-sticky-call a {
  width: 100%;
  min-height: 52px;
  color: #fff;
  background: var(--deep-blue);
  border: 1px solid rgba(255,255,255,.35);
  white-space: nowrap;
  font-weight: 800;
  text-align: center;
}

.mobile-sticky-call.is-visible {
  display: block;
  transform: translateY(0);
  opacity: 1;
}

@media (min-width: 768px) {
  .mobile-sticky-call,
  .mobile-sticky-call.is-visible {
    display: none !important;
    visibility: hidden !important;
  }
}

.site-footer {
  background: #0e1538;
  color: #e5e7eb;
  font-size: 14px;
}

.site-footer p,
.site-footer a,
.site-footer li {
  color: #e5e7eb;
  font-size: 14px;
}

.site-footer h2,
.site-footer h3 {
  color: #fff;
}

.site-footer .logo-text {
  color: #fff;
}

@media (max-width: 767px) {
  h1 {
    font-size: 39px;
  }
  h2 {
    font-size: 31px;
  }
  .hero-section {
    min-height: 790px;
    background-position: center top;
  }
  .section-pad {
    padding: 54px 0;
  }
  body {
    padding-bottom: 78px;
  }
}
