/* Final launch refinements: viewport-fit hero, legibility and timed enquiry prompt. */
.hero {
  height: clamp(560px, calc(100svh - 122px), 760px);
  min-height: 0;
}

.hero-inner {
  height: 100%;
  min-height: 100%;
  padding-block: clamp(54px, 8vh, 82px);
}

.hero-shade {
  background:
    linear-gradient(90deg, rgba(3, 10, 20, .97) 0%, rgba(5, 17, 31, .91) 44%, rgba(5, 17, 31, .46) 76%, rgba(5, 17, 31, .32) 100%),
    linear-gradient(0deg, rgba(3, 10, 20, .72), transparent 56%);
}

.hero h1 {
  max-width: 900px;
  font-size: clamp(2.85rem, 5.3vw, 5.35rem);
  text-shadow: 0 4px 30px rgba(0, 0, 0, .52);
}

.hero-intro {
  color: #e3ebf4;
  line-height: 1.62;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .58);
}

.hero .eyebrow-light,
.hero .text-link-light {
  text-shadow: 0 2px 14px rgba(0, 0, 0, .68);
}

.prompt-open { overflow: hidden; }

.project-prompt {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(2, 8, 16, .78);
  backdrop-filter: blur(9px);
  animation: project-prompt-fade .24s ease both;
}

.project-prompt__panel {
  position: relative;
  width: min(620px, 100%);
  max-height: min(760px, calc(100svh - 36px));
  overflow-y: auto;
  padding: clamp(34px, 6vw, 58px);
  border: 1px solid rgba(119, 234, 255, .36);
  border-top: 5px solid #77eaff;
  background: linear-gradient(135deg, rgba(112, 131, 255, .18), transparent 42%), #0d1d31;
  color: #fff;
  box-shadow: 0 36px 110px rgba(0, 0, 0, .58);
  animation: project-prompt-rise .35s cubic-bezier(.22, 1, .36, 1) both;
}

.project-prompt__close {
  position: absolute;
  top: 14px;
  right: 16px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .24);
  background: rgba(3, 10, 19, .44);
  color: #fff;
  font-size: 1.75rem;
  line-height: 1;
}

.project-prompt__close:hover,
.project-prompt__close:focus-visible { border-color: #77eaff; color: #77eaff; }

.project-prompt__eyebrow {
  margin: 0 0 15px;
  color: #77eaff;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.project-prompt h2 {
  max-width: 510px;
  margin-bottom: 22px;
  color: #fff;
  font-size: clamp(2.05rem, 5vw, 3.25rem);
}

.project-prompt__panel > p:not(.project-prompt__eyebrow) { margin-bottom: 24px; color: #d5e1ed; }
.project-prompt ul { display: grid; gap: 10px; margin: 0 0 30px; padding: 0; list-style: none; }

.project-prompt li {
  position: relative;
  padding-left: 24px;
  color: #eef4fa;
  font-size: .88rem;
}

.project-prompt li::before {
  content: "";
  position: absolute;
  top: .65em;
  left: 1px;
  width: 10px;
  height: 6px;
  border-bottom: 2px solid #77eaff;
  border-left: 2px solid #77eaff;
  transform: rotate(-45deg);
}

.project-prompt__actions { display: flex; align-items: center; gap: 24px; }
.project-prompt__phone { color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .55); font-size: .86rem; font-weight: 780; }
.project-prompt__phone:hover { color: #77eaff; border-color: #77eaff; }

@keyframes project-prompt-fade { from { opacity: 0; } }
@keyframes project-prompt-rise { from { opacity: 0; transform: translateY(28px) scale(.985); } }

@media (max-height: 760px) and (min-width: 641px) {
  .hero { height: calc(100svh - 122px); min-height: 520px; }
  .hero-inner { padding-block: 42px; }
  .hero h1 { margin-bottom: 20px; font-size: clamp(2.7rem, 4.8vw, 4.25rem); }
  .hero-intro { margin-bottom: 26px; font-size: 1rem; }
}

@media (max-width: 640px) {
  .hero { height: calc(100svh - 136px); min-height: 620px; max-height: 760px; }
  .hero-inner { padding-block: 48px 40px; }
  .hero h1 { margin-bottom: 20px; font-size: clamp(2.35rem, 11vw, 3.35rem); }
  .hero-intro { margin-bottom: 26px; font-size: .95rem; line-height: 1.55; }
  .hero-actions { gap: 16px; }
  .project-prompt { padding: 12px; }
  .project-prompt__panel { max-height: calc(100svh - 24px); padding: 42px 24px 28px; }
  .project-prompt__actions { align-items: stretch; flex-direction: column; gap: 18px; }
  .project-prompt__phone { align-self: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  .project-prompt,
  .project-prompt__panel { animation: none; }
}

/* SEO topic-cluster additions: customer-facing, accessible and responsive. */
.seo-solution-cluster .section-heading p:not(.eyebrow){max-width:760px;color:var(--muted)}
.seo-solution-cluster .related-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.seo-solution-cluster .related-grid a{min-height:250px}
.source-section{background:var(--ink-2);color:var(--white);padding-block:34px}
.source-note{margin:0;color:#c7d5e3}
.source-note a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}
.sitemap-links{margin-bottom:54px}
@media (max-width:1180px){.seo-solution-cluster .related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.seo-solution-cluster .related-grid{grid-template-columns:1fr}.seo-solution-cluster .related-grid a{min-height:220px}}

/* Search-guide tables and glossary: readable on desktop, swipeable on mobile. */
.comparison-wrap {
  width: 100%;
  margin-top: 28px;
  overflow-x: auto;
  border: 1px solid rgba(14, 42, 65, .14);
  background: #fff;
  box-shadow: 0 18px 50px rgba(8, 27, 43, .08);
}

.comparison-table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  color: var(--ink);
  font-size: .88rem;
  line-height: 1.55;
}

.comparison-table th,
.comparison-table td {
  padding: 17px 18px;
  border-bottom: 1px solid rgba(14, 42, 65, .1);
  text-align: left;
  vertical-align: top;
}

.comparison-table thead th {
  background: var(--ink-2);
  color: #fff;
  font-size: .72rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.comparison-table tbody th { width: 26%; color: var(--ink); font-weight: 820; }
.comparison-table tbody tr:last-child th,
.comparison-table tbody tr:last-child td { border-bottom: 0; }
.comparison-table tbody tr:nth-child(even) { background: #f4f8fb; }

.glossary-section { background: #f4f8fb; }
.glossary-section .section-heading { max-width: 780px; }
.glossary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 38px 0 0;
}

.glossary-term {
  min-height: 190px;
  padding: 28px;
  border-top: 4px solid var(--cyan);
  background: #fff;
  box-shadow: 0 16px 44px rgba(8, 27, 43, .07);
}

.glossary-term dt {
  margin-bottom: 14px;
  color: var(--ink);
  font-family: inherit;
  font-size: 1.22rem;
  font-weight: 820;
}

.glossary-term dd { margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.7; }

@media (max-width: 980px) { .glossary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .comparison-wrap { margin-inline: -4px; width: calc(100% + 8px); }
  .comparison-table th,
  .comparison-table td { padding: 14px; }
  .glossary-grid { grid-template-columns: 1fr; }
  .glossary-term { min-height: auto; }
}