@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=optional");

:root { --light-x: 50%; --light-y: -100px; }
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: #ffffff;
  color: #0f172a;
  overflow-x: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
}


.nav-mega-dropdown > a:not(:first-child) { min-width: 0; overflow-wrap: anywhere; }
.nav-mega-dropdown > a:nth-child(3) { counter-reset: nav-service; }
.nav-mega-aside {
  grid-column: 4;
  grid-row: 3 / span 3;
  align-self: stretch;
  padding: 1.2rem;
  border-radius: .75rem;
  color: #cbd5e1;
  background: #001a4d;
  box-shadow: 0 16px 36px rgba(0,26,77,.2);
  display: flex;
  flex-direction: column;
  gap: .7rem;
}
.nav-mega-kicker {
  color: #67e8f9;
  font: 700 .64rem/1 "JetBrains Mono", monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.nav-mega-aside strong { color: #fff; font-size: 1.05rem; line-height: 1.25; }
.nav-mega-aside p { margin: 0; color: #cbd5e1; font-size: .78rem; line-height: 1.5; }
.nav-mega-aside a {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem .7rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: .5rem;
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
}
.nav-mega-aside a:last-child { color: #052e16; background: #34d399; border-color: #34d399; }
.nav-mega-aside a:hover, .nav-mega-aside a:focus-visible { transform: translateY(-1px); }
@media (max-width: 1023px) {
  .nav-mega-aside { display: none; }
}
.navbar-glass:not(.scrolled) nav button:hover,
.navbar-glass:not(.scrolled) nav > a:hover,
.navbar-glass:not(.scrolled) .portal-signin:hover {
  color: #001a4d;
  text-shadow: none;
  background: rgba(255,255,255,.94);
  border-radius: .5rem;
}
/* ===== ENHANCED NAVBAR STYLES ===== */
.navbar-glass {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
  transition: all 0.3s ease;
}

.navbar-glass.scrolled {
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
}

.navbar-glass:not(.scrolled) {
  background: rgba(255, 255, 255, 0.85);
}

/* Enhanced nav links */
.navbar-glass nav > a:not(.nav-primary-extra),
.navbar-glass nav .relative.group > button {
  position: relative;
  padding: 0.5rem 0;
  color: #334155;
  font-weight: 500;
  transition: color 0.2s ease;
}

.navbar-glass nav > a:not(.nav-primary-extra)::after,
.navbar-glass nav .relative.group > button::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #0039A6, #00A3FF);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.navbar-glass nav > a:not(.nav-primary-extra):hover::after,
.navbar-glass nav > a:not(.nav-primary-extra).active::after,
.navbar-glass nav .relative.group > button:hover::after {
  transform: scaleX(1);
}

.navbar-glass nav > a:not(.nav-primary-extra):hover,
.navbar-glass nav .relative.group > button:hover {
  color: #0039A6;
}

/* Enhanced dropdown */
.nav-dropdown {
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.25s ease;
}

.relative.group:hover .nav-dropdown,
.relative.group:focus-within .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Nav mega dropdown enhancement */
.nav-mega-dropdown {
  border: 1px solid rgba(226, 232, 240, 0.9);
  box-shadow: 0 20px 60px rgba(0, 26, 77, 0.12), 0 8px 24px rgba(0, 0, 0, 0.08);
}

.nav-mega-dropdown > a:not(:first-child):hover {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  box-shadow: inset 0 -2px 0 #0039A6;
}

/* Enhanced primary extra buttons */
.nav-primary-extra {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 2.5rem;
  padding: .55rem .85rem;
  border: 1px solid #0039A6;
  border-radius: .55rem;
  background: linear-gradient(135deg, #0039A6 0%, #001a4d 100%);
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(0, 57, 166, 0.25);
  transition: all 0.2s ease;
}

.nav-primary-extra:hover,
.nav-primary-extra:focus-visible {
  border-color: #001a4d;
  background: linear-gradient(135deg, #001a4d 0%, #0039A6 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 57, 166, 0.35);
}

.nav-primary-extra svg { color: #fff; stroke-width: 2.4; }

/* Enhanced portal signin */
.portal-signin {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .5rem .75rem;
  border-radius: .5rem;
  color: #334155;
  font-size: .8rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.portal-signin:hover {
  background: #f1f5f9;
  color: #0039A6;
}

/* Announcement bar enhancement */
.announcement-layout {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0;
}

.announcement-location-window {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 0.375rem;
  padding: 0.25rem 0.75rem;
}

.announcement-location-track {
  display: flex;
  gap: 2rem;
  color: #94a3b8;
  font-size: 0.65rem;
  letter-spacing: 0.05em;
}

.announcement-contact {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.65rem;
}

.announcement-contact a {
  color: #cbd5e1;
  transition: color 0.2s ease;
}

.announcement-contact a:hover {
  color: #fff;
}

/* Mobile menu enhancement */
#mobile-menu {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

#mobile-menu a {
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  transition: all 0.2s ease;
}

#mobile-menu a:hover {
  background: #eff6ff;
  color: #0039A6;
}

/* Logo shine effect */
.logo-shine {
  position: relative;
  overflow: hidden;
}

.logo-shine::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  transition: left 0.5s ease;
}

.logo-shine:hover::before {
  left: 100%;
}
.font-serif { font-family: 'Lora', serif; }
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* Ambient Light Beam */
.ambient-light-beam {
  position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
  pointer-events: none; z-index: 10;
  background: radial-gradient(600px circle at var(--light-x) var(--light-y),
    rgba(0, 82, 204, 0.08), rgba(16, 185, 129, 0.04) 40%, transparent 80%);
  transition: background 0.08s ease-out;
}

.network-notice { position: fixed; left: 50%; bottom: 1rem; z-index: 10001; width: min(92vw, 34rem); transform: translate(-50%, 150%); padding: .8rem 1rem; border: 1px solid #f6c453; border-radius: .75rem; background: #fff8df; color: #713f12; box-shadow: 0 12px 35px rgba(15,23,42,.16); font-size: .78rem; line-height: 1.45; transition: transform .24s ease; }
.network-notice.is-visible { transform: translate(-50%, 0); }
.network-notice strong { display: block; margin-bottom: .15rem; font-weight: 800; }
@media (prefers-reduced-motion: reduce) {
  .network-notice { transition: none; }
}

body {
  background:
    radial-gradient(circle at top left, rgba(0, 57, 166, 0.10), transparent 28%),
    radial-gradient(circle at bottom right, rgba(16, 185, 129, 0.08), transparent 24%),
    linear-gradient(180deg, #f8fbff 0%, #ebf3ff 100%);
}

#home.hero-fullscreen {
  position: relative;
  background: #031427;
}

#home.hero-fullscreen .hero-backdrop::before {
  content: "";
  position: absolute;
  inset: -15% -10% 10% -10%;
  background:
    radial-gradient(circle at 15% 20%, rgba(34, 211, 238, 0.42), transparent 18%),
    radial-gradient(circle at 55% 30%, rgba(59, 130, 246, 0.38), transparent 20%),
    radial-gradient(circle at 80% 10%, rgba(16, 185, 129, 0.34), transparent 18%);
  filter: blur(20px);
  opacity: 0.95;
  animation: aurora-shift 16s ease-in-out infinite alternate;
}

#home.hero-fullscreen .hero-copy h1,
#home.hero-fullscreen .hero-copy p,
#home.hero-fullscreen .hero-copy .text-white\/80,
#home.hero-fullscreen .hero-copy .text-white\/60 {
  text-shadow: 0 18px 48px rgba(2, 6, 23, 0.56);
}

#home.hero-fullscreen .glass-card {
  position: relative;
  transform-style: preserve-3d;
  background: rgba(255, 255, 255, 0.87);
  border: 1px solid rgba(148, 163, 184, 0.3);
  box-shadow: 0 26px 80px rgba(2, 6, 23, 0.22);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

#home.hero-fullscreen .glass-card:hover {
  transform: translateY(-8px) rotateX(4deg) rotateY(-4deg);
  box-shadow: 0 32px 120px rgba(2, 6, 23, 0.32);
}

#home.hero-fullscreen .hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin-top: 1.1rem;
}

/* ===== ENHANCED HERO SECTION ===== */
#home.hero-fullscreen {
  position: relative;
  background: #031427;
  overflow: hidden;
}

#home.hero-fullscreen::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 20% 20%, rgba(0, 57, 166, 0.4) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(16, 185, 129, 0.2) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(0, 163, 255, 0.15) 0%, transparent 60%);
  z-index: 1;
  pointer-events: none;
}

#home.hero-fullscreen .hero-backdrop::before {
  content: "";
  position: absolute;
  inset: -15% -10% 10% -10%;
  background:
    radial-gradient(circle at 15% 20%, rgba(34, 211, 238, 0.42), transparent 18%),
    radial-gradient(circle at 55% 30%, rgba(59, 130, 246, 0.38), transparent 20%),
    radial-gradient(circle at 80% 10%, rgba(16, 185, 129, 0.34), transparent 18%);
  filter: blur(20px);
  opacity: 0.95;
  animation: aurora-shift 16s ease-in-out infinite alternate;
}

/* Enhanced glass card */
#home.hero-fullscreen .glass-card {
  position: relative;
  transform-style: preserve-3d;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow:
    0 26px 80px rgba(2, 6, 23, 0.22),
    0 0 0 1px rgba(0, 57, 166, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  border-radius: 1.5rem;
}

#home.hero-fullscreen .glass-card:hover {
  transform: translateY(-8px) rotateX(2deg) rotateY(-2deg);
  box-shadow:
    0 32px 120px rgba(2, 6, 23, 0.32),
    0 0 0 1px rgba(0, 57, 166, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Enhanced CTA buttons */
.hero-cta-primary {
  background: linear-gradient(135deg, #0039A6 0%, #001a4d 100%) !important;
  border: none !important;
  box-shadow: 0 8px 30px rgba(0, 57, 166, 0.4) !important;
}

.hero-cta-primary:hover {
  background: linear-gradient(135deg, #001a4d 0%, #0039A6 100%) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 16px 40px rgba(0, 57, 166, 0.5) !important;
}

.hero-cta-secondary {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.hero-cta-secondary:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  transform: translateY(-3px) !important;
}

/* Enhanced stat cards */
#home.hero-fullscreen .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

#home.hero-fullscreen .reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

#home.hero-fullscreen .reveal-delay-1 { transition-delay: 0.1s; }
#home.hero-fullscreen .reveal-delay-2 { transition-delay: 0.2s; }
#home.hero-fullscreen .reveal-delay-3 { transition-delay: 0.3s; }

/* Enhanced service cards in hero */
#home.hero-fullscreen .group .relative.h-28 {
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

#home.hero-fullscreen .group:hover .relative.h-28 {
  transform: scale(1.05);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}

/* Enhanced tab buttons */
.tab-active {
  background: linear-gradient(135deg, #0039A6 0%, #001a4d 100%);
  color: #fff;
  box-shadow: 0 4px 15px rgba(0, 57, 166, 0.3);
}

.tab-inactive {
  background: #f1f5f9;
  color: #64748b;
  border: 1px solid #e2e8f0;
}

.tab-inactive:hover {
  background: #e2e8f0;
  color: #334155;
}

/* ===== ENHANCED SECTION STYLING ===== */
section {
  position: relative;
}

section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 57, 166, 0.1), transparent);
}

/* Enhanced about section */
.about-corporate {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 50%, #ffffff 100%);
}

/* Enhanced who-we-are section */
.who-we-are {
  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 50%, #f0fdf4 100%);
}

/* Enhanced position statement */
.position-statement {
  background: linear-gradient(135deg, #001a4d 0%, #0039A6 50%, #001a4d 100%);
  position: relative;
  overflow: hidden;
}

.position-statement::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 50%, rgba(16, 185, 129, 0.15) 0%, transparent 50%),
    radial-gradient(circle at 80% 50%, rgba(0, 163, 255, 0.15) 0%, transparent 50%);
}

/* Enhanced partners section */
.multi-photo-section {
  position: relative;
}

.partners-track {
  animation: scroll-partners 30s linear infinite;
}

@keyframes scroll-partners {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.partners-track:hover {
  animation-play-state: paused;
}

/* ===== ENHANCED CARDS ===== */
.tab-content-card {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  box-shadow: 0 10px 40px rgba(0, 26, 77, 0.08);
}

/* ===== ENHANCED TYPOGRAPHY ===== */
.fluid-h1 {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  line-height: 1.1;
}

.fluid-h2 {
  font-size: clamp(1.75rem, 3vw, 3rem);
  line-height: 1.2;
}

.fluid-p {
  font-size: clamp(1rem, 1.5vw, 1.25rem);
  line-height: 1.6;
}

/* ===== ENHANCED ANIMATIONS ===== */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.float-anim {
  animation: float 6s ease-in-out infinite;
}

@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 20px rgba(0, 57, 166, 0.2); }
  50% { box-shadow: 0 0 40px rgba(0, 57, 166, 0.4); }
}

.pulse-glow {
  animation: pulse-glow 3s ease-in-out infinite;
}

/* ===== RESPONSIVE ENHANCEMENTS ===== */
@media (max-width: 767px) {
  .hero-cta-primary,
  .hero-cta-secondary {
    min-height: 3.5rem;
    padding: 0.75rem 1.5rem;
    font-size: 0.9rem;
  }

  #home.hero-fullscreen .glass-card {
    border-radius: 1rem;
    margin: 0 0.5rem;
  }
}

.project-empty-state {
  display: grid;
  gap: .8rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid #bfdbfe;
  border-radius: 1rem;
  background: #fff;
}
.project-empty-state h3 {
  margin: 0;
  color: #001a4d;
  font: 600 clamp(1.3rem, 2.5vw, 1.8rem)/1.2 "Lora", Georgia, serif;
}
.project-empty-state > p:not(.product-audience) {
  max-width: 68ch;
  margin: 0;
  color: #475569;
  font-size: 1rem;
  line-height: 1.65;
}
.project-empty-state .product-audience { margin: 0; }
.project-empty-actions { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; }
.events-list-section { background: #f8fafc; }
.events-kind-list { border-top: 1px solid #cbd5e1; }
.events-kind-list article {
  display: grid;
  grid-template-columns: minmax(13rem, .8fr) minmax(0, 1.4fr) auto;
  align-items: center;
  gap: 1.25rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid #cbd5e1;
}
.events-kind-list .product-audience { margin: 0 0 .4rem; }
.events-kind-list h3 {
  margin: 0;
  color: #001a4d;
  font: 600 clamp(1.25rem, 2.3vw, 1.65rem)/1.2 "Lora", Georgia, serif;
}
.events-kind-list article > p,
.events-contact-note {
  max-width: 65ch;
  margin: 0;
  color: #475569;
  font-size: 1rem;
  line-height: 1.65;
}
.event-date-status {
  display: inline-flex;
  justify-self: end;
  border-radius: 999px;
  padding: .45rem .7rem;
  color: #334155;
  background: #eaf3ff;
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}
.events-contact-note { margin-top: 1.5rem; }
.events-contact-note a { color: #0039a6; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
body.theme-dark .project-empty-state {
  border-color: #29415e;
  background: #0d2039;
}
body.theme-dark .project-empty-state h3,
body.theme-dark .events-kind-list h3 { color: #f4f8ff; }
body.theme-dark .project-empty-state > p:not(.product-audience),
body.theme-dark .events-kind-list article > p,
body.theme-dark .events-contact-note { color: #d6e2f2; }
body.theme-dark .events-kind-list,
body.theme-dark .events-kind-list article { border-color: #29415e; }
body.theme-dark .event-date-status { color: #e2e8f0; background: #18314f; }
@media (max-width: 760px) {
  .events-kind-list article {
    grid-template-columns: 1fr;
    align-items: start;
    gap: .7rem;
  }
  .event-date-status { justify-self: start; }
}

.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 10002;
  transform: translateY(-180%);
  padding: .7rem 1rem;
  border-radius: .5rem;
  background: #001a4d;
  color: #fff;
  font-weight: 800;
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, a:focus-visible {
  outline: 3px solid #00a3ff;
  outline-offset: 2px;
}
.field-error {
  margin-top: .35rem;
  color: #b91c1c;
  font-size: .72rem;
  line-height: 1.35;
}
.service-pill {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: .4rem .65rem;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  color: #0039a6;
  background: #fff;
  font-size: .7rem;
  font-weight: 800;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
.service-pill:hover, .service-pill:focus-visible {
  border-color: #0039a6;
  background: #eff6ff;
  color: #001a4d;
}
.form-invalid {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .12);
}
.tech-option {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.8rem;
  padding: .55rem .7rem;
  border: 1px solid #e2e8f0;
  border-radius: .65rem;
  color: #334155;
  background: #f8fafc;
}
.tech-option img,
.tech-option svg {
  width: 1.15rem;
  height: 1.15rem;
  flex: 0 0 auto;
}
.tech-option svg { color: #0039a6; stroke-width: 2.2; }
.shop-hero,
.saints-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(110deg, #001a4d, #0039a6 62%, #0f766e);
}
.shop-hero-image,
.saints-hero-image {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(0, 26, 77, .94), rgba(0, 57, 166, .62)),
    url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=1800&q=85") center / cover no-repeat;
}
.saints-hero-image {
  background:
    linear-gradient(90deg, rgba(0, 26, 77, .92), rgba(15, 118, 110, .62)),
    url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1800&q=85") center / cover no-repeat;
}
.shop-hero-content,
.saints-hero-content { position: relative; z-index: 1; width: 100%; min-width: 0; }
.shop-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}
.shop-card {
  display: grid;
  gap: .55rem;
  min-width: 0;
  overflow: hidden;
  padding: 1.35rem;
  border: 1px solid #dbe5f0;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 12px 35px rgba(0, 26, 77, .06);
}
.shop-card-image {
  width: calc(100% + 2.7rem);
  height: 11rem;
  margin: -1.35rem -1.35rem .45rem;
  object-fit: cover;
  background: #dbeafe;
}
.shop-card-icon {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: .8rem;
  color: #0039a6;
  background: #eaf3ff;
}
.shop-card h3 { font: 800 1.2rem/1.15 "Lora", Georgia, serif; }
.shop-card p:not(.shop-category) { color: #64748b; font-size: .85rem; line-height: 1.55; }
.shop-card strong { color: #0039a6; font-size: .82rem; }
.shop-card a { display: inline-flex; align-items: center; gap: .35rem; color: #0039a6; font-size: .8rem; font-weight: 800; }
.shop-card a svg { width: .9rem; }
.shop-category { color: #0f766e; font: 700 .65rem/1 "JetBrains Mono", monospace; letter-spacing: .12em; text-transform: uppercase; }
.shop-note { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.15rem; border: 1px solid #bfdbfe; border-radius: .8rem; color: #1e3a8a; background: #eff6ff; font-size: .85rem; }
.shop-note svg { flex: 0 0 auto; width: 1.1rem; margin-top: .1rem; }
.shop-market-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.shop-search-row {
  display: flex;
  gap: .75rem;
  margin-bottom: 1rem;
}
.shop-search-box {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex: 1 1 auto;
  min-width: 0;
  padding: .85rem 1rem;
  border: 1px solid #cbd5e1;
  border-radius: .75rem;
  color: #64748b;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 26, 77, .05);
}
.shop-search-box:focus-within { border-color: #0039a6; box-shadow: 0 0 0 3px rgba(0, 57, 166, .12); }
.shop-search-box svg { width: 1.1rem; flex: 0 0 auto; color: #0039a6; }
.shop-search-box input { width: 100%; min-width: 0; border: 0; outline: 0; color: #0f172a; background: transparent; }
.shop-filter-toggle { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid #cbd5e1; border-radius: .75rem; padding: .75rem 1rem; color: #0039a6; background: #fff; font-weight: 800; }
.shop-filter-toggle svg { width: 1.1rem; }
.shop-catalog-layout { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.shop-filter-panel { position: sticky; top: 5rem; padding: 1rem; border: 1px solid #dbe5f0; border-radius: .9rem; background: #fff; box-shadow: 0 12px 35px rgba(0, 26, 77, .05); }
.shop-filter-heading { display: flex; align-items: start; justify-content: space-between; gap: .75rem; }
.shop-filter-heading h2, .shop-filter-heading h3 { margin: 0; color: #001a4d; font: 800 1.2rem/1.2 "Lora", Georgia, serif; }
.shop-filter-heading button { border: 0; color: #64748b; background: transparent; font-size: 1.5rem; line-height: 1; }
.shop-filter-panel fieldset { display: grid; gap: .6rem; margin: 1.2rem 0; border: 0; padding: 0; }
.shop-filter-panel legend { margin-bottom: .55rem; color: #001a4d; font-size: .75rem; font-weight: 800; }
.shop-filter-panel label { display: flex; align-items: center; gap: .5rem; color: #475569; font-size: .78rem; line-height: 1.35; }
.shop-filter-panel input { accent-color: #0f766e; }
.shop-reset-filter { width: 100%; border: 1px solid #99f6e4; border-radius: .5rem; padding: .6rem; color: #0f766e; background: #f0fdfa; font-size: .75rem; font-weight: 800; }
.shop-empty-state { grid-column: 1 / -1; padding: 2rem; border: 1px dashed #94a3b8; border-radius: .9rem; color: #475569; text-align: center; }
.shop-buy-link { margin-top: .25rem; }
.shop-sell-band { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding: 1.25rem; border: 1px solid #99f6e4; border-radius: 1rem; background: linear-gradient(120deg, #ecfdf5, #eff6ff); }
.shop-sell-band h2 { margin: .2rem 0 .35rem; color: #001a4d; font: 800 1.5rem/1.1 "Lora", Georgia, serif; }
.shop-sell-band p:not(.text-xs) { max-width: 42rem; color: #475569; font-size: .85rem; line-height: 1.55; }
.shop-modal[hidden] { display: none; }
.shop-modal { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 1rem; background: rgba(0, 26, 77, .62); }
.shop-modal-card { width: min(100%, 36rem); max-height: min(90vh, 48rem); overflow-y: auto; padding: 1.25rem; border-radius: 1rem; background: #fff; box-shadow: 0 24px 80px rgba(0, 26, 77, .25); }
.shop-modal form label { display: grid; gap: .35rem; color: #334155; font-size: .8rem; font-weight: 800; }
.shop-modal form input, .shop-modal form select, .shop-modal form textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: .55rem; padding: .7rem .75rem; color: #0f172a; background: #fff; font: inherit; font-weight: 400; }
.shop-modal form input:focus, .shop-modal form select:focus, .shop-modal form textarea:focus { border-color: #0039a6; outline: 3px solid rgba(0, 57, 166, .12); }
.shop-form-status { min-height: 1.2rem; color: #0f766e; font-size: .8rem; }
.hub-step { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem; border: 1px solid #dbe5f0; border-radius: .85rem; background: #fff; }
.hub-step > svg { flex: 0 0 auto; width: 1.3rem; color: #059669; }
.hub-step strong { display: block; color: #001a4d; }
.hub-step p { margin-top: .25rem; color: #64748b; font-size: .85rem; line-height: 1.5; }
.hub-section-heading { max-width: 48rem; }
.hub-feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.hub-feature {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dbe5f0;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 12px 35px rgba(0, 26, 77, .06);
}
.hub-feature img {
  display: block;
  width: 100%;
  height: 10rem;
  object-fit: cover;
  background: #dbeafe;
}
.hub-feature > div { padding: 1rem; }
.hub-feature svg { width: 1.3rem; color: #059669; }
.hub-feature h3 { margin-top: .65rem; color: #001a4d; font: 800 1.15rem/1.15 "Lora", Georgia, serif; }
.hub-feature p { margin-top: .4rem; color: #64748b; font-size: .82rem; line-height: 1.5; }
.saints-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.hub-program-grid, .hub-project-grid, .hub-event-grid, .hub-training-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hub-program-card, .hub-project-grid article, .hub-training-grid article { min-width: 0; padding: 1.25rem; border: 1px solid #dbe5f0; border-radius: 1rem; background: #fff; box-shadow: 0 12px 35px rgba(0, 26, 77, .05); }
.hub-program-card svg, .hub-training-grid svg { width: 1.5rem; color: #059669; }
.hub-program-card h3, .hub-project-grid h3, .hub-training-grid h3 { margin-top: .8rem; color: #001a4d; font: 800 1.15rem/1.15 "Lora", Georgia, serif; }
.hub-program-card p, .hub-project-grid p, .hub-training-grid p { margin-top: .4rem; color: #64748b; font-size: .84rem; line-height: 1.55; }
.hub-program-card a, .hub-event-grid a { display: inline-flex; margin-top: .8rem; color: #0039a6; font-size: .78rem; font-weight: 800; }
.hub-status { display: inline-flex; border-radius: 999px; padding: .3rem .55rem; color: #047857; background: #d1fae5; font: 800 .65rem/1 "JetBrains Mono", monospace; text-transform: uppercase; }
.hub-status-build { color: #1d4ed8; background: #dbeafe; }.hub-status-learn { color: #1d4ed8; background: #dbeafe; }
.hub-project-grid small { display: block; margin-top: .8rem; color: #64748b; font-size: .72rem; }
.hub-member-list { display: grid; gap: .75rem; }
.hub-member-list > div { display: flex; gap: .75rem; align-items: flex-start; padding: .85rem; border-radius: .75rem; background: #fff; }
.hub-member-list svg { width: 1.2rem; flex: 0 0 auto; color: #0f766e; }
.hub-member-list strong, .hub-member-list small { display: block; }.hub-member-list small { margin-top: .2rem; color: #64748b; font-size: .78rem; }
.hub-event-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.hub-event-grid article { padding: 1.25rem; border: 1px solid rgba(255,255,255,.18); border-radius: 1rem; background: rgba(255,255,255,.08); }.hub-event-grid span { color: #6ee7b7; font: 700 .65rem/1 "JetBrains Mono", monospace; letter-spacing: .12em; }.hub-event-grid h3 { margin-top: .75rem; font: 800 1.2rem/1.15 "Lora", Georgia, serif; }.hub-event-grid p { margin-top: .45rem; color: #cbd5e1; font-size: .84rem; line-height: 1.5; }.hub-event-grid a { color: #a7f3d0; }
.hub-training-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.hub-compact-form { display: grid; gap: .8rem; padding: 1.5rem; border: 1px solid #dbe5f0; border-radius: 1rem; background: #fff; box-shadow: 0 12px 35px rgba(0, 26, 77, .05); }.hub-compact-form h2 { margin: .1rem 0 .6rem; color: #001a4d; font: 800 1.4rem/1.15 "Lora", Georgia, serif; }.hub-compact-form label { display: grid; gap: .3rem; color: #334155; font-size: .78rem; font-weight: 800; }.hub-compact-form input, .hub-compact-form select, .hub-compact-form textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: .55rem; padding: .65rem .75rem; font: inherit; font-weight: 400; }.hub-compact-form button { border-radius: .55rem; padding: .75rem 1rem; color: #fff; background: #0039a6; font-weight: 800; }.hub-compact-form p[role="status"] { min-height: 1.2rem; color: #047857; font-size: .78rem; }
.hub-accepted-list { display: grid; gap: .65rem; }.hub-accepted-list > div { display: grid; grid-template-columns: 2rem 1fr auto; gap: .7rem; align-items: center; padding: .8rem; border-bottom: 1px solid #dbe5f0; }.hub-accepted-list > div > span { color: #0039a6; font: 700 .75rem/1 "JetBrains Mono", monospace; }.hub-accepted-list strong, .hub-accepted-list small { display: block; }.hub-accepted-list small { margin-top: .2rem; color: #64748b; font-size: .75rem; }.hub-accepted-list em { color: #0f766e; font-size: .7rem; font-style: normal; font-weight: 800; }
.client-fit-section { position: relative; overflow: hidden; }
.client-sector-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.client-sector-grid > div { display: grid; grid-template-columns: 2rem 1fr; column-gap: .65rem; align-items: start; min-width: 0; padding: 1rem; border: 1px solid #dbe5f0; border-radius: .85rem; background: #fff; }
.client-sector-grid svg { grid-row: span 2; width: 1.25rem; margin-top: .1rem; color: #0f766e; }
.client-sector-grid strong { color: #0f172a; font-size: .85rem; }
.client-sector-grid span { margin-top: .25rem; color: #64748b; font-size: .75rem; line-height: 1.4; }
.delivery-promise-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding-top: 1.25rem; border-top: 1px solid #cbd5e1; }
.delivery-promise-grid > div { display: flex; gap: .8rem; min-width: 0; }
.delivery-promise-grid > div > span { flex: 0 0 auto; color: #0039a6; font: 700 .72rem/1 "JetBrains Mono", monospace; }
.delivery-promise-grid h3 { color: #001a4d; font: 800 1rem/1.2 "Lora", Georgia, serif; }
.delivery-promise-grid p { margin-top: .35rem; color: #64748b; font-size: .78rem; line-height: 1.5; }
.social-letter {
  color: currentColor;
  font-size: .8rem;
  line-height: 1;
  font-weight: 800;
}
.contact-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.contact-hero-backdrop {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(3, 10, 24, .68), rgba(0, 57, 166, .34)),
    url("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=2200&q=85") center / cover no-repeat;
}
.contact-location-visual {
  min-height: 16rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(125, 211, 252, .3);
  border-radius: 1.25rem;
  background: #001a4d;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
}
.contact-location-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 24%;
}
.contact-location-visual > iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  filter: saturate(.75) contrast(1.05);
}
.contact-location-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 26, 77, .1), rgba(0, 26, 77, .82));
}
.contact-location-visual::before,
.contact-location-visual::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(103, 232, 249, .22);
  border-radius: 999px;
  width: 10rem;
  height: 10rem;
}
.contact-location-visual::after { width: 15rem; height: 15rem; }
.contact-location-pin {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 4rem;
  height: 4rem;
  border-radius: 999px;
  color: #001a4d;
  background: #67e8f9;
  box-shadow: 0 0 0 1rem rgba(103, 232, 249, .12), 0 14px 30px rgba(0, 0, 0, .25);
}
.contact-location-pin svg { width: 2rem; height: 2rem; }
.contact-location-card {
  position: absolute;
  left: 1.25rem;
  bottom: 1.25rem;
  display: grid;
  gap: .2rem;
  padding: .8rem 1rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .75rem;
  color: #e0f2fe;
  background: rgba(3, 10, 24, .72);
  backdrop-filter: blur(8px);
}
.contact-location-card strong { color: #fff; font-size: 1rem; }
.contact-location-card > span:last-child { color: #bae6fd; font-size: .75rem; }
.contact-location-card a {
  color: #67e8f9;
  font-size: .72rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: .15rem;
}
.contact-hero-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 2rem;
}
.contact-hero-fact {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  padding: .75rem;
  min-width: 0;
  border: 1px solid rgba(186, 230, 253, .2);
  border-radius: .75rem;
  background: rgba(3, 10, 24, .45);
  color: #e0f2fe;
  font-size: .72rem;
  line-height: 1.35;
}
.contact-hero-fact svg { flex: 0 0 auto; width: 1rem; color: #67e8f9; }
.contact-hero-fact > span,
.contact-hero-fact > a {
  min-width: 0;
  overflow-wrap: anywhere;
}
.contact-hero-fact > a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: .15rem;
}
.contact-hero-fact > a:hover { color: #67e8f9; }
.contact-page main > section:nth-child(2) {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(rgba(248, 250, 252, .9), rgba(239, 246, 255, .86)),
    url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2200&q=75") center / cover no-repeat;
}
.contact-page main > section:nth-child(2)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .25;
  background-image: linear-gradient(rgba(0, 57, 166, .12) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 57, 166, .12) 1px, transparent 1px);
  background-size: 3rem 3rem;
  pointer-events: none;
}
.contact-technology-card {
  background: rgba(255,255,255,.92) !important;
  color: #0f172a !important;
  border-color: #cbd5e1 !important;
  backdrop-filter: blur(8px);
}
.contact-technology-card h2,
.contact-technology-card p,
.contact-technology-card label,
.contact-technology-card .text-slate-500 {
  color: #0f172a !important;
}
.contact-technology-card p { color: #475569 !important; }
.contact-technology-select {
  color: #001a4d;
  background: #f8fafc;
}
#contact-form select,
#contact-form select option,
#contact-form select optgroup,
.contact-technology-select,
.contact-technology-select option,
.contact-technology-select optgroup {
  color: #0f172a !important;
  background-color: #fff !important;
  -webkit-text-fill-color: #0f172a;
}
#contact-form select:focus,
.contact-technology-select:focus {
  border-color: #0039a6;
  box-shadow: 0 0 0 3px rgba(0,57,166,.12);
}
#contact-form > div:first-of-type h3,
.contact-form-panel > h3 {
  color: #001a4d !important;
  font: 800 clamp(1.5rem, 2.2vw, 2.2rem)/1.05 "Lora", Georgia, serif;
  letter-spacing: -.025em;
}
.tech-selected-preview {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  margin-top: .75rem;
  padding: .6rem .75rem;
  border: 1px solid #bfdbfe;
  border-radius: .65rem;
  color: #0039a6;
  background: #eff6ff;
  font-size: .8rem;
  font-weight: 700;
}
.tech-selected-preview img {
  width: 2rem;
  height: 2rem;
  object-fit: contain;
}
.contact-form-map {
  margin-top: 1rem;
  overflow: hidden;
  border: 1px solid #dbe5f0;
  border-radius: .9rem;
  background: #f8fafc;
}
.contact-form-map-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: .75rem;
  padding: .8rem .9rem;
}
.contact-form-map-heading h3 {
  margin: 0;
  color: #001a4d;
  font: 800 1rem/1.2 "Lora", Georgia, serif;
}
.contact-form-map-heading a {
  color: #0039a6;
  font-size: .7rem;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .15rem;
  white-space: nowrap;
}
.contact-form-map iframe {
  display: block;
  width: 100%;
  min-height: 13rem;
  border: 0;
}
@media (max-width: 639px) {
  .contact-hero-facts { grid-template-columns: 1fr 1fr; }
  .contact-location-visual { min-height: 13rem; }
  .contact-location-card { left: .75rem; bottom: .75rem; }
}
.contact-hero > .contact-fluid-container,
.contact-hero + section > .contact-fluid-container {
  min-width: 0;
  width: 100%;
}
.contact-hero h1,
.contact-hero p,
#contact-form,
#contact-form input,
#contact-form select,
#contact-form textarea,
.contact-hero .contact-location-card {
  overflow-wrap: anywhere;
  min-width: 0;
}
@media (max-width: 1023px) {
  .navbar-glass nav .nav-primary-extra { display: none; }
  .contact-hero > .contact-fluid-container {
    grid-template-columns: minmax(0, 1fr);
  }

  .contact-location-visual {
    min-height: clamp(14rem, 48vw, 22rem);
    max-width: 38rem;
  }

  .contact-hero + section > .contact-fluid-container {
    grid-template-columns: minmax(0, 1fr);
  }

  #contact-form {
    width: 100%;
  }
}

@media (max-width: 639px) {
  .contact-hero {
    padding-block: 3.5rem 3rem !important;
  }

  .contact-hero > .contact-fluid-container,
  .contact-hero + section > .contact-fluid-container {
    padding-inline: 1rem;
    gap: 2rem;
  }

  .contact-hero h1 {
    font-size: clamp(2.35rem, 12vw, 3.8rem);
    line-height: .98;
  }

  .contact-hero .contact-location-card {
    right: .75rem;
    max-width: calc(100% - 1.5rem);
  }

  .contact-hero + section {
    padding-block: 2.5rem;
  }

  #contact-form,
  .contact-hero + section aside > div {
    border-radius: 1rem;
    padding: 1.25rem;
  }

  #contact-form .grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #contact-form textarea {
    min-height: 9rem;
  }
}

/* Marquee */
@keyframes marquee { 0% { transform: translateX(0%); } 100% { transform: translateX(-50%); } }
.animate-marquee { display: flex; width: 200%; animation: marquee 35s linear infinite; }
.animate-marquee:hover { animation-play-state: paused; }

.announcement-track {
  display: flex;
  width: max-content;
  min-width: 100%;
  animation: announcement-scroll 32s linear infinite;
}
.announcement-track:hover,
.announcement-track:focus-within,
.announcement-track:focus {
  animation-play-state: paused;
}
.announcement-item {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  min-width: 100vw;
  padding: .45rem 1rem;
  white-space: nowrap;
}
@keyframes announcement-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.contact-icon-image { width: 1.1rem; height: 1.1rem; display: block; }
.contact-icon { min-width: 2.6rem; justify-content: center; }
.whatsapp-brand-icon {
  display: inline-grid;
  place-items: center;
  width: 1.2rem;
  height: 1.2rem;
  color: #25d366;
  flex: 0 0 auto;
}
.whatsapp-brand-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
}
.language-multi-select {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem;
  max-height: 15rem;
  overflow-y: auto;
  margin-top: .5rem;
  padding: .45rem;
  border: 1px solid rgba(148,163,184,.35);
  border-radius: .65rem;
  background: #f8fafc;
}
.language-choice {
  display: flex;
  align-items: center;
  gap: .4rem;
  min-width: 0;
  padding: .35rem .4rem;
  border-radius: .4rem;
  color: #334155;
  font-size: .7rem;
  cursor: pointer;
}
.language-choice:hover { background: #dbeafe; }
.language-choice input { accent-color: #0039a6; }
.language-choice img { width: 1.25rem; height: .875rem; object-fit: cover; border-radius: 2px; }
.language-code {
  min-width: 1.45rem;
  color: #0039a6;
  font: 800 .58rem/1 "Inter", sans-serif;
}
.language-choice span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 639px) {
  .language-multi-select { grid-template-columns: 1fr; }
}
.technology-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .4rem;
  max-height: 15rem;
  overflow-y: auto;
  margin-top: .55rem;
  padding: .4rem;
  border: 1px solid #cbd5e1;
  border-radius: .65rem;
  background: #f8fafc;
}
.technology-choice {
  position: relative;
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  padding: .5rem;
  border: 1px solid #dbe5f0;
  border-radius: .5rem;
  color: #0f172a;
  background: #fff;
  text-align: left;
  font: 700 .7rem/1.2 "Inter", sans-serif;
  cursor: pointer;
}
.technology-choice:hover,
.technology-choice[aria-selected="true"] {
  border-color: #0039a6;
  background: #eff6ff;
  color: #0039a6;
}
.technology-choice:focus-visible {
  outline: 3px solid rgba(0, 57, 166, .35);
  outline-offset: 1px;
}
.technology-choice img,
.technology-choice-fallback {
  flex: 0 0 auto;
  width: 1.5rem;
  height: 1.5rem;
  object-fit: contain;
}
.technology-choice-fallback {
  display: inline-grid;
  place-items: center;
  border-radius: .35rem;
  color: #fff;
  background: #0039a6;
  font-size: .55rem;
}
.technology-choice-fallback[hidden] { display: none; }
.technology-choice img + .technology-choice-fallback { display: none; }
@media (max-width: 639px) {
  .technology-picker { grid-template-columns: 1fr; }
}
.announcement-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.5rem;
  min-height: 2.15rem;
}
.announcement-location-window { min-width: 0; overflow: hidden; }
.announcement-location-track {
  display: flex;
  width: max-content;
  animation: announcement-location-scroll 26s linear infinite;
}
.announcement-location-track span {
  min-width: min(100vw, 34rem);
  padding-right: 2.5rem;
  white-space: nowrap;
}
.announcement-location-track:hover,
.announcement-location-track:focus { animation-play-state: paused; }
.announcement-contact {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .8rem;
  white-space: nowrap;
}
@keyframes announcement-location-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.inquiry-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  padding: .55rem .85rem;
  border-radius: .55rem;
  background: #10b981;
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
}
.inquiry-button:hover { background: #059669; }
@media (prefers-reduced-motion: reduce) {
  .announcement-track, .announcement-location-track { animation: none; }
  html { scroll-behavior: auto !important; }
  .ambient-light-beam, #networkCanvas { display: none !important; }
  .site-loader-mark { animation: none !important; }
}
@media (max-width: 900px) {
  .announcement-layout { display: block; }
  .announcement-contact { justify-content: center; gap: .55rem; overflow-x: auto; padding-bottom: .25rem; }
}

/* Glow Card */
.glow-card { transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s cubic-bezier(0.16, 1, 0.3, 1); position: relative; }
.glow-card:hover { box-shadow: 0 20px 60px rgba(0, 82, 204, 0.15); border-color: rgba(0, 82, 204, 0.4); transform: translateY(-4px); }

/* Scroll reveal stays visible without JavaScript and animates only when observed. */
.reveal,
html.js .reveal { opacity: 1; transform: none; }
html.js .reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* Interactive corporate surfaces */
.interaction-card {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease, border-color .35s ease;
}
.interaction-card:hover {
  box-shadow: 0 22px 55px rgba(0, 57, 166, .14);
}
.tab-content-card {
  transition: opacity .22s ease, transform .22s ease, box-shadow .3s ease;
}
.tab-content-card.is-switching {
  opacity: .35;
  transform: translateY(8px) scale(.99);
}
.tab-item-enter {
  animation: tabItemEnter .42s both cubic-bezier(.16,1,.3,1);
}
@keyframes tabItemEnter {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.scroll-progress {
  position: fixed;
  inset: 0 auto auto 0;
  width: 0;
  height: 3px;
  z-index: 10001;
  background: linear-gradient(90deg, #10b981, #00a3ff, #0039a6);
  box-shadow: 0 0 12px rgba(0, 163, 255, .55);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  html.js .reveal { opacity: 1; transform: none; transition: none; }
  .interaction-card, .tab-content-card { transition: none; transform: none !important; }
  .tab-item-enter { animation: none; }
}

/* Float animation */
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.float-anim { animation: float 6s ease-in-out infinite; }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #0039A6; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #10b981; }

/* Nav dropdown */
.nav-dropdown {
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
  visibility: hidden;
}
.group:hover .nav-dropdown,
.group:focus-within .nav-dropdown,
.group.nav-open .nav-dropdown {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
}
.nav-link-current {
  color: #0039a6 !important;
  font-weight: 800;
}
.nav-mega-dropdown {
  width: min(78rem, calc(100vw - 2rem)) !important;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 17rem;
  gap: .65rem;
  padding: 1.15rem !important;
  background: #fff !important;
  border: 1px solid #d9e2ef !important;
  border-radius: 1rem !important;
  box-shadow: 0 26px 70px rgba(0, 26, 77, .22) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.nav-mega-dropdown > :first-child {
  grid-column: 1 / -1;
}
.nav-mega-dropdown > :nth-child(2) {
  grid-column: 1 / -1;
  position: relative;
  margin-top: .1rem;
  padding: .3rem .45rem .65rem;
  border-bottom: 1px solid #e2e8f0;
  color: #64748b;
  font: 800 .58rem/1 'JetBrains Mono', monospace;
  letter-spacing: .12em;
}
.nav-mega-heading { display:flex; justify-content:space-between; padding:.25rem .45rem .65rem; border-bottom:1px solid #e2e8f0; color:#64748b; font:800 .58rem/1 'JetBrains Mono',monospace; letter-spacing:.12em; }
.nav-mega-heading strong { color:#0039a6; }
.nav-mega-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.25rem; grid-column:1 / 3; }
.nav-mega-dropdown > a:not(:first-child) {
  position: relative;
  display: block;
  min-height: 4.1rem;
  padding: .75rem .7rem .7rem 2.45rem !important;
  border: 1px solid transparent;
  border-radius: .7rem;
  color: #0f172a !important;
}
.nav-mega-dropdown > a:not(:first-child)::before {
  content: counter(nav-service, decimal-leading-zero);
  counter-increment: nav-service;
  position: absolute;
  left: .7rem;
  top: .8rem;
  color: #0039a6;
  font: 800 .62rem/1 'JetBrains Mono', monospace;
}
.nav-mega-dropdown > a:nth-child(3) { counter-reset: nav-service; }
.nav-mega-dropdown > a:not(:first-child):hover,
.nav-mega-dropdown > a:not(:first-child):focus-visible {
  background: #f1f7ff !important;
  border-color: #cfe1f7;
  transform: translateY(-1px);
}
.nav-mega-item { display:grid; grid-template-columns:1.5rem minmax(0,1fr) auto; gap:.45rem; align-items:start; padding:.55rem; border-radius:.55rem; color:#0f172a; }
.nav-mega-item:hover { background:#eff6ff; }
.nav-mega-number { color:#0039a6; font:800 .65rem/1 'JetBrains Mono',monospace; padding-top:.1rem; }
.nav-mega-item strong { display:block; font-size:.7rem; line-height:1.2; }
.nav-mega-item small { display:block; margin-top:.2rem; color:#64748b; font-size:.58rem; line-height:1.25; }
.nav-mega-item > span:last-child { color:#0039a6; font-size:.8rem; }
.nav-mega-aside { grid-column:3; grid-row:2; display:flex; flex-direction:column; justify-content:center; gap:.45rem; margin:.25rem 0 0 .4rem; padding:1rem; border-radius:.65rem; background:#001a4d; color:#fff; }
.nav-mega-aside strong { font:800 1.05rem/1.1 'Lora',Georgia,serif; }
.nav-mega-aside p { margin:0; color:#cbd5e1; font-size:.65rem; line-height:1.4; }
.nav-mega-aside a { color:#6ee7b7; font-size:.65rem; font-weight:800; }
.nav-mega-kicker { color:#6ee7b7; font:800 .55rem/1 'JetBrains Mono',monospace; letter-spacing:.1em; }
.nav-mega-dropdown a {
  min-width: 0;
  transition: background-color .18s ease, color .18s ease, transform .18s ease;
}
.nav-mega-dropdown a:hover,
.nav-mega-dropdown a:focus-visible {
  background: #eaf3ff !important;
  color: #0039a6;
  outline: none;
  transform: translateY(-1px);
}
.nav-dropdown a:focus-visible {
  outline: 2px solid #00a3ff;
  outline-offset: 1px;
}
.mobile-nav-group { border-top: 1px solid #e2e8f0; padding-top: .35rem; }
.mobile-nav-group-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: .7rem 0;
  color: #0f172a;
  font-weight: 800;
  text-align: left;
}
.mobile-nav-group-toggle svg { width: 1rem; transition: transform .2s ease; }
.mobile-nav-group.open .mobile-nav-group-toggle { color: #0039a6; }
.mobile-nav-group.open .mobile-nav-group-toggle svg { transform: rotate(180deg); }
.mobile-nav-submenu[hidden] { display: none; }
.mobile-nav-submenu {
  display: grid;
  gap: .25rem;
  max-height: 24rem;
  overflow-y: auto;
  padding: .35rem .5rem .65rem;
  border: 1px solid #d9e2ef;
  border-radius: .7rem;
  background: #f8fbff;
}
.mobile-nav-submenu a {
  display: block;
  padding: .65rem;
  border-radius: .5rem;
  color: #0f172a;
  font-size: .78rem;
}
.mobile-nav-submenu a:hover,
.mobile-nav-submenu a:focus-visible { background: #eaf3ff; color: #0039a6; }
@media (max-width: 1023px) {
  .nav-mega-dropdown { display: block; width: min(100%, calc(100vw - 2rem)) !important; }
  .nav-mega-dropdown::after { display: none; }
}
@media (max-width: 1200px) {
  .nav-mega-dropdown,
  .navbar-glass .nav-mega-dropdown { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nav-mega-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nav-mega-aside { grid-column:1 / -1; grid-row:auto; margin:.25rem 0 0; }
}

/* Compact, wide service menu: visual icons carry the grouping instead of ordinal labels. */
@media (min-width: 1201px) {
  .navbar-glass .nav-mega-dropdown {
    width: min(78rem, calc(100vw - 2rem));
    grid-template-columns: repeat(3, minmax(0, 1fr)) 17rem;
    grid-template-rows: auto auto repeat(3, minmax(3.75rem, auto));
    gap: .25rem .6rem;
    padding: 1rem !important;
  }
  .navbar-glass .nav-mega-dropdown > :first-child { grid-column: 1 / -1; grid-row: 1; }
  .navbar-glass .nav-mega-dropdown > :nth-child(2) { grid-column: 1 / 4; grid-row: 2; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(n+3):nth-child(-n+11) {
    min-height: 3.7rem;
    padding: .55rem .55rem .55rem 2.6rem !important;
  }
  .navbar-glass .nav-mega-dropdown > a:nth-child(3) { grid-column: 1; grid-row: 3; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(4) { grid-column: 2; grid-row: 3; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(5) { grid-column: 3; grid-row: 3; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(6) { grid-column: 1; grid-row: 4; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(7) { grid-column: 2; grid-row: 4; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(8) { grid-column: 3; grid-row: 4; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(9) { grid-column: 1; grid-row: 5; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(10) { grid-column: 2; grid-row: 5; }
  .navbar-glass .nav-mega-dropdown > a:nth-child(11) { grid-column: 3; grid-row: 5; }
  .navbar-glass .nav-mega-dropdown > a:not(:first-child)::before { content: none; }
  .navbar-glass .nav-mega-aside { grid-column: 4; grid-row: 2 / 6; margin: .25rem 0 0; padding: 1rem; }
  .nav-mega-service { position: relative; }
  .nav-mega-icon {
    position: absolute;
    left: .55rem;
    top: .62rem;
    display: grid;
    place-items: center;
    width: 1.65rem;
    height: 1.65rem;
    border-radius: .4rem;
    color: #0039a6;
    background: #edf5ff;
  }
  .nav-mega-icon svg { width: .85rem; height: .85rem; stroke-width: 2.2; }
  .nav-mega-service > div:first-of-type { font-size: .72rem; line-height: 1.2; }
  .nav-mega-service > div:last-of-type { margin-top: .2rem; font-size: .58rem; line-height: 1.25; }
}

/* Logo shine */
.logo-shine { position: relative; overflow: hidden; }
.logo-shine::after {
  content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
  background: linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.25) 50%, transparent 60%);
  animation: logoShine 4s ease-in-out infinite;
}
@keyframes logoShine { 0%, 100% { transform: translateX(-100%) rotate(45deg); } 50% { transform: translateX(100%) rotate(45deg); } }

/* Back to top */
.back-to-top {
  position: fixed; bottom: 30px; right: 30px; width: 48px; height: 48px;
  background: #0039A6; color: white; border: none; border-radius: 12px;
  cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden;   transition: opacity 0.3s, visibility 0.3s, transform 0.3s; z-index: 100;
  box-shadow: 0 4px 20px rgba(0, 57, 166, 0.4);
}
.back-to-top.visible { opacity: 1; visibility: visible; }
.back-to-top:hover { transform: translateY(-4px); background: #10b981; }

/* Loader */
.loader { position: fixed; inset: 0; background: radial-gradient(circle at 50% 35%, #f8fbff 0%, #ffffff 55%, #eaf4ff 100%); z-index: 10000; display: flex; align-items: center; justify-content: center; text-align: center; transition: opacity 0.6s, visibility 0.6s; }
.loader.hidden { opacity: 0; visibility: hidden; }
.loader-card { width: min(92vw, 34rem); padding: clamp(2rem, 5vw, 3.5rem); border: 1px solid rgba(0,57,166,.14); border-radius: 1.5rem; background: rgba(255,255,255,.88); box-shadow: 0 28px 90px rgba(0,39,115,.16); }
.loader-logo { display: block; width: min(100%, 20rem); height: auto; max-height: 5rem; object-fit: contain; margin: 0 auto 1.75rem; }
.loader-welcome { margin: 0; color: #001a4d; font: 800 clamp(1.2rem, 3vw, 1.8rem)/1.2 'Lora', Georgia, serif; }
.loader-subtitle { margin: .65rem auto 1.4rem; color: #475569; font-size: .86rem; max-width: 25rem; }
.loader-spinner { width: 48px; height: 48px; border: 3px solid rgba(0, 57, 166, 0.15); border-top-color: #0039A6; border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.loader-message { margin-top: 1rem; color: #475569; font: 600 .75rem/1.5 'JetBrains Mono', monospace; text-align: center; max-width: 22rem; }
.loader-offline { display: none; color: #b45309; margin-top: .5rem; font-size: .7rem; }
.loader.slow .loader-offline { display: block; }
.portal-actions { display: flex; align-items: center; gap: .5rem; }
.portal-signin { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid #cbd5e1; border-radius: .55rem; padding: .55rem .75rem; color: #0039A6; background: #fff; font-size: .72rem; font-weight: 800; }
.portal-signin:hover { border-color: #0039A6; background: #eff6ff; }
.portal-whatsapp { display: inline-flex; align-items: center; gap: .4rem; border-radius: .55rem; padding: .55rem .75rem; color: #fff; background: #25d366; font-size: .72rem; font-weight: 800; }
.portal-whatsapp:hover { background: #128c7e; }
.nav-a11y { position: relative; }
.nav-a11y-trigger { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.5rem; border: 1px solid #cbd5e1; border-radius: .5rem; background: #fff; color: #334155; padding: .5rem .7rem; font-size: .72rem; font-weight: 800; cursor: pointer; }
.nav-a11y-trigger:hover, .nav-a11y-trigger:focus-visible { border-color: #0039A6; color: #0039A6; outline: 3px solid rgba(0,57,166,.16); }
.nav-a11y-panel { display: none; position: absolute; top: calc(100% + .65rem); right: 0; z-index: 1000; width: min(22rem, calc(100vw - 2rem)); padding: 1.15rem; background: #fff; border: 1px solid #dbe5f0; border-radius: .75rem; box-shadow: 0 18px 50px rgba(15,23,42,.2); }
.nav-a11y.open .nav-a11y-panel { display: block; }
.nav-a11y-panel h2 { margin: 0 0 .8rem; font: 800 1.05rem/1.2 'Lora', Georgia, serif; color: #13213a; }
.nav-a11y-group { margin-top: .75rem; }
.nav-a11y-label { display: block; margin-bottom: .4rem; color: #64748b; font: 800 .6rem/1 'JetBrains Mono', monospace; letter-spacing: .14em; text-transform: uppercase; }
.nav-a11y-options { display: flex; flex-wrap: wrap; gap: .35rem; }
.nav-a11y-panel button, .nav-a11y-panel select { min-height: 2.1rem; border: 1px solid #cbd5e1; border-radius: .65rem; background: #fff; color: #0f172a; padding: .35rem .65rem; font: 700 .68rem/1 'Inter', sans-serif; cursor: pointer; }
.nav-a11y-panel button:hover, .nav-a11y-panel select:hover { background: #ecfdf5; border-color: #10b981; }
.nav-a11y-panel .nav-a11y-options { gap: .45rem; }
.nav-a11y-panel .nav-a11y-options button,
.nav-a11y-panel .nav-a11y-options select { flex: 1 1 7rem; }
.nav-a11y-panel button:hover, .nav-a11y-panel button:focus-visible, .nav-a11y-panel select:focus-visible { border-color: #0039A6; outline: 3px solid rgba(0,57,166,.16); }
body.font-large { font-size: 1.12em; }
body.dyslexia-friendly, body.dyslexia-friendly button, body.dyslexia-friendly input, body.dyslexia-friendly textarea, body.dyslexia-friendly select { font-family: Verdana, Arial, sans-serif !important; letter-spacing: .02em; line-height: 1.75; }
body.high-contrast { filter: contrast(1.16); }
body.theme-dark { background: #071326; color: #edf4ff; }
body.theme-dark .bg-white, body.theme-dark .bg-slate-50 { background-color: #0d203d !important; }
body.theme-dark .text-slate-900 { color: #f8fafc !important; }
body.theme-dark .text-slate-600, body.theme-dark .text-slate-700, body.theme-dark .text-slate-500 { color: #cbd5e1 !important; }
body.theme-dark .border-slate-200, body.theme-dark .border-slate-300 { border-color: #284467 !important; }
body.theme-dark .nav-a11y-panel { background: #0d203d; border-color: #42617f; }
body.theme-dark .nav-a11y-panel h2, body.theme-dark .nav-a11y-panel button, body.theme-dark .nav-a11y-panel select { color: #f8fafc; background: #132b4d; border-color: #42617f; }
@media (max-width: 1023px) { .portal-actions { display: none; } }
@media (max-width: 1279px) { .nav-extra-label { display: none; } }
.map-frame { width: 100%; height: 100%; border: 0; position: absolute; inset: 0; opacity: .88; }
.map-label { position: relative; z-index: 1; }

/* Full-screen responsive hero */
#home.hero-fullscreen {
  min-height: max(46rem, 100svh);
  display: flex;
  align-items: stretch;
  isolation: isolate;
  background: #06142f;
}
#home.hero-fullscreen > .hero-backdrop { position: absolute; inset: 0; z-index: -2; }
#home.hero-fullscreen > .hero-grid-overlay { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
#home.hero-fullscreen .hero-content-shell {
  width: 100%;
  min-height: max(46rem, 100svh);
  display: flex;
  align-items: center;
  padding-block: clamp(4rem, 9vh, 9rem) clamp(5rem, 11vh, 10rem);
}
#home.hero-fullscreen .hero-copy {
  width: 100%;
  max-width: min(100%, 112rem);
}
#home.hero-fullscreen .hero-copy h1 {
  max-width: min(100%, 110rem);
  font-size: clamp(3rem, 7.2vw, 10.5rem);
  line-height: .91;
  text-wrap: balance;
  text-shadow: 0 5px 30px rgba(0,0,0,.28);
}
#home.hero-fullscreen .hero-copy > p {
  width: min(100%, 78rem);
  max-width: none;
  font-size: clamp(1.05rem, 1.55vw, 2rem);
  line-height: 1.55;
  text-wrap: pretty;
}
#home.hero-fullscreen .hero-lower { width: 100%; }
#home.hero-fullscreen > .absolute.bottom-0 {
  bottom: -2px;
  line-height: 0;
  z-index: 2;
}
#home.hero-fullscreen > .absolute.bottom-0 svg {
  display: block;
  transform: scaleY(1.04);
  transform-origin: bottom;
}
#home.hero-fullscreen + #about-company {
  border-top: 0 !important;
  margin-top: -1px;
}
@media (min-width: 1536px) {
  #home.hero-fullscreen .hero-copy h1 { max-width: 95rem; }
  #home.hero-fullscreen .hero-copy > p { width: min(100%, 90rem); }
}
@media (max-width: 1023px) {
  #home.hero-fullscreen, #home.hero-fullscreen .hero-content-shell { min-height: auto; }
  #home.hero-fullscreen .hero-content-shell { align-items: flex-start; }
  #home.hero-fullscreen .hero-copy h1 { font-size: clamp(3rem, 11vw, 6rem); }
}
@media (max-width: 639px) {
  #home.hero-fullscreen .hero-content-shell { padding-top: 3rem; padding-bottom: 4rem; }
  #home.hero-fullscreen .hero-copy h1 { font-size: clamp(2.8rem, 14vw, 5rem); line-height: .94; }
  #home.hero-fullscreen .hero-copy > p { font-size: clamp(1rem, 4.5vw, 1.25rem); }
}

/* Hero canvas */
#networkCanvas { position: absolute; inset: 0; width: 100%; height: 100%; }

/* Hero image overlay */
.hero-image-overlay {
  background: linear-gradient(135deg, rgba(3,7,18,0.75) 0%, rgba(0,57,166,0.5) 50%, rgba(3,7,18,0.4) 100%);
}

/* Glass card */
.glass-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Tab active */
.tab-active { background: #0039A6; color: white; border-color: #0039A6 !important; }
.tab-inactive { background: white; color: #475569; border-color: #e2e8f0; }
.tab-inactive:hover { background: #f1f5f9; color: #0039A6; border-color: #0039A6; }

/* Responsive TV sizing */
@media (min-width: 2560px) { html { font-size: 18px; } }
@media (min-width: 3840px) { html { font-size: 22px; } }
@media (max-width: 474px) { html { font-size: 14px; } }

/* Map */
.map-container { background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 50%, #94a3b8 100%); position: relative; overflow: hidden; border-radius: 12px; }
.map-container::before { display: none; }

section { position: relative; }

/* About section - NEW corporate white/green/blue gradient */
.about-corporate {
  background: linear-gradient(135deg, #ffffff 0%, #ecfdf5 30%, #eff6ff 70%, #ffffff 100%);
  position: relative;
  overflow: hidden;
}
.about-corporate::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 10% 20%, rgba(16, 185, 129, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 90% 80%, rgba(0, 57, 166, 0.06) 0%, transparent 50%);
  pointer-events: none;
}

/* Who We Are - white/green */
.who-we-are {
  background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 50%, #ffffff 100%);
  position: relative;
}
.who-we-are::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 0% 50%, rgba(16, 185, 129, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 100% 100%, rgba(0, 57, 166, 0.04) 0%, transparent 50%);
  pointer-events: none;
}

/* Position statement */
.position-statement {
  background: linear-gradient(135deg, #001a4d 0%, #0039A6 100%);
  position: relative;
  overflow: hidden;
}
.position-statement::before {
  content: '';
  position: absolute;
  top: -50%; right: -20%;
  width: 60%; height: 200%;
  background: radial-gradient(ellipse, rgba(16, 185, 129, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

/* Partners carousel */
.partners-track {
  display: flex;
  width: max-content;
  animation: scrollPartners 30s linear infinite;
}
.partners-track:hover { animation-play-state: paused; }
@keyframes scrollPartners {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Blog card */
.blog-card-img { transition: transform 0.6s ease; }
.blog-card:hover .blog-card-img { transform: scale(1.08); }

/* Project card */
.project-card { transition: transform 0.4s ease, box-shadow 0.4s ease; }
.project-card:hover { transform: translateY(-6px); }

/* Navbar glass effect */
.navbar-glass {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  transition: background .3s ease, box-shadow .3s ease, border-color .3s ease, color .3s ease;
}
.social-icon {
  display: inline-grid;
  place-items: center;
  width: 1.1rem;
  height: 1.1rem;
  color: currentColor;
}
.social-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
  stroke: currentColor;
}
.social-brand-facebook { color: #1877f2; }
.social-brand-twitter { color: #f8fafc; }
.social-brand-linkedin { color: #0a66c2; }
.social-brand-instagram { color: #e4405f; }
.social-brand-youtube { color: #ff0033; }
.social-brand-tiktok { color: #f8fafc; }
.social-brand-send { color: #2aabee; }
.footer-social-links a:hover .social-brand-facebook { color: #fff; }
.footer-social-links a:hover .social-brand-twitter,
.footer-social-links a:hover .social-brand-tiktok { color: #fff; }
.footer-social-links a:hover .social-brand-linkedin,
.footer-social-links a:hover .social-brand-instagram,
.footer-social-links a:hover .social-brand-youtube,
.footer-social-links a:hover .social-brand-send { color: #fff; }
.navbar-glass:not(.scrolled) {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  background: linear-gradient(180deg, rgba(0, 26, 77, .3), rgba(0, 26, 77, 0)) !important;
}
.navbar-glass.scrolled {
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 34px rgba(0, 26, 77, 0.14);
  border-bottom: 1px solid rgba(0, 57, 166, 0.15);
}
.navbar-glass:not(.scrolled) nav,
.navbar-glass:not(.scrolled) nav button,
.navbar-glass:not(.scrolled) nav > a,
.navbar-glass:not(.scrolled) .portal-signin {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 26, 77, .95), 0 0 12px rgba(0, 0, 0, .3);
}
.navbar-glass:not(.scrolled) nav button i,
.navbar-glass:not(.scrolled) .portal-signin i {
  color: rgba(255,255,255,.72) !important;
}
.navbar-glass:not(.scrolled) .nav-a11y-trigger {
  color: #fff;
  border-color: rgba(255,255,255,.3);
  background: rgba(255,255,255,.1);
}
.navbar-glass:not(.scrolled) > div > a > .logo-shine {
  box-shadow: 0 8px 28px rgba(0,0,0,.18);
}
.navbar-glass.scrolled .nav-mega-dropdown,
.navbar-glass.scrolled .nav-dropdown {
  box-shadow: 0 22px 50px rgba(0, 26, 77, .18);
}
.navbar-glass .nav-mega-dropdown {
  border-color: rgba(0, 57, 166, .14);
  width: min(78rem, calc(100vw - 2rem));
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .15rem;
  background: #fff !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 26px 70px rgba(0, 26, 77, .22);
}
.navbar-glass .nav-mega-dropdown > a:first-child,
.navbar-glass .nav-mega-dropdown > div {
  grid-column: 1 / -1;
}
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) {
  min-width: 18rem;
  padding: .75rem !important;
  border: 1px solid #d9e2ef;
  border-radius: 1rem;
  background: #fff !important;
  box-shadow: 0 24px 60px rgba(0, 26, 77, .2);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown)::before {
  content: "MORE";
  display: block;
  padding: .25rem .65rem .7rem;
  border-bottom: 1px solid #e2e8f0;
  color: #64748b;
  font: 800 .58rem/1 "JetBrains Mono", monospace;
  letter-spacing: .16em;
}
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) a {
  display: flex;
  align-items: center;
  min-height: 2.35rem;
  border-radius: .55rem;
  color: #0f172a !important;
}
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) a:hover,
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) a:focus-visible {
  background: #f1f7ff !important;
  color: #0039a6 !important;
}
.navbar-glass nav > *,
.navbar-glass nav a,
.navbar-glass nav button,
.navbar-glass .nav-actions > a,
.navbar-glass .nav-actions > button {
  white-space: nowrap;
}
.navbar-glass nav {
  min-width: 0;
  flex-shrink: 1;
  column-gap: clamp(.45rem, .8vw, 1rem);
}
.navbar-glass nav > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.navbar-glass .nav-actions {
  flex-shrink: 0;
  min-width: max-content;
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .navbar-glass nav {
    font-size: .75rem;
  }
  .navbar-glass .nav-primary-extra span,
  .navbar-glass .nav-extra-label {
    display: none;
  }
  .navbar-glass .nav-actions {
    gap: .25rem;
  }
}
.navbar-glass #mobile-menu {
  background: #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Fluid typography */
.fluid-h1 { font-size: clamp(2rem, 5vw, 4.5rem); }
.fluid-h2 { font-size: clamp(1.75rem, 4vw, 3.5rem); }
.fluid-h3 { font-size: clamp(1.5rem, 3vw, 2.5rem); }
.fluid-p { font-size: clamp(0.9rem, 1.2vw, 1.15rem); }

/* Full-width stretch container */
.full-stretch {
  width: 100%;
  max-width: 100%;
}

/* Keep image layout predictable; loading behavior belongs on each image element. */
img { max-width: 100%; height: auto; }
/* Better hover states */
a { transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease; }

/* Section dividers */
.section-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 57, 166, 0.2), transparent);
}

/* Tab content card - white/green/blue corporate */
.tab-content-card {
  background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 50%, #eff6ff 100%);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(16, 185, 129, 0.2);
  box-shadow: 0 10px 40px rgba(0, 57, 166, 0.08);
}

/* Section full-bleed wrapper */
.section-full {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  padding-left: calc((100vw - 1400px) / 2);
  padding-right: calc((100vw - 1400px) / 2);
}
@media (max-width: 1400px) {
  .section-full {
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
  }
}

/* Fluid margin-filling content sections */
#home.hero-fullscreen .hero-content-shell,
#about-company > .max-w-\[2560px\],
.position-statement > .max-w-\[2560px\] {
  width: 100%;
  max-width: none;
}
#home.hero-fullscreen .hero-copy h1 {
  width: 100%;
  max-width: none;
  font-size: clamp(3rem, 7.5vw, 11rem);
}
#home.hero-fullscreen .hero-copy > p {
  width: 100%;
  max-width: 92rem;
  font-size: clamp(1.05rem, 1.45vw, 2rem);
}
#home.hero-fullscreen .hero-copy h1 {
  font-family: Georgia, "Times New Roman", serif;
}
#home.hero-fullscreen .hero-copy > .grid.grid-cols-2.sm\:grid-cols-4 {
  width: 100%;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 5rem);
}
#home.hero-fullscreen .hero-copy > .grid.grid-cols-2.sm\:grid-cols-4 > div {
  min-width: 0;
}
#about-company {
  padding-block: clamp(4rem, 8vw, 10rem);
}
#about-company > .max-w-\[2560px\] > .max-w-4xl {
  width: 100%;
  max-width: none;
  text-align: left;
  margin-bottom: clamp(2rem, 4vw, 5rem);
}
#about-company > .max-w-\[2560px\] > .max-w-4xl h2 {
  max-width: 100%;
  font-size: clamp(2.4rem, 5vw, 6rem);
}
#about-company > .max-w-\[2560px\] > .max-w-4xl p {
  max-width: 78rem;
  font-size: clamp(1rem, 1.35vw, 1.8rem);
}
#about-company > .max-w-\[2560px\] > .flex.flex-wrap {
  justify-content: flex-start;
  gap: clamp(.5rem, 1.2vw, 1.25rem);
}
#about-company > .max-w-\[2560px\] > .flex.flex-wrap button {
  flex: 1 1 12rem;
  min-height: clamp(3rem, 5vw, 5rem);
  font-size: clamp(.8rem, 1vw, 1.25rem);
}
#about-company > .max-w-\[2560px\] > .max-w-5xl {
  width: 100%;
  max-width: none;
}
#about-tab-content {
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 1rem;
  padding: clamp(1.5rem, 4vw, 5rem);
}
#about-tab-content > .flex {
  align-items: flex-start;
  gap: clamp(1rem, 2vw, 3rem);
  margin-bottom: 0;
}
#about-tab-content #tab-title {
  font-size: clamp(1.5rem, 2.6vw, 3.25rem);
}
#about-tab-content #tab-desc {
  max-width: 100%;
  font-size: clamp(.95rem, 1.15vw, 1.5rem);
  line-height: 1.7;
}
#about-tab-content #tab-items {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem clamp(.75rem, 1.2vw, 1.25rem);
  margin-top: 0;
}
#about-tab-content #tab-items > div {
  min-height: 2.75rem;
  padding: .65rem .85rem;
  border: 1px solid rgba(16,185,129,.14);
  border-radius: .75rem;
  font-size: clamp(.78rem, .9vw, 1.15rem);
}
.position-statement {
  padding-block: clamp(4rem, 8vw, 10rem);
}
.position-statement > .max-w-\[2560px\] > .max-w-5xl {
  width: 100%;
  max-width: none;
}
.position-statement p {
  max-width: 100%;
  font-size: clamp(1.5rem, 3.2vw, 4.5rem);
  line-height: 1.16;
}
@media (max-width: 900px) {
  #home.hero-fullscreen .hero-copy > .grid.grid-cols-2.sm\:grid-cols-4,
  #about-tab-content #tab-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  #home.hero-fullscreen .hero-copy > .grid.grid-cols-2.sm\:grid-cols-4,
  #about-tab-content #tab-items { grid-template-columns: 1fr 1fr; gap: .7rem; }
  #about-company > .max-w-\[2560px\] > .max-w-4xl { text-align: left; }
  #about-company > .max-w-\[2560px\] > .flex.flex-wrap button { flex-basis: 100%; }
  #about-tab-content > .flex { flex-direction: column; }
  .position-statement p { font-size: clamp(1.45rem, 7vw, 2.4rem); }
}

/* Keep the position statement visually continuous with the surrounding white sections. */
.position-statement {
  background: #fff !important;
  color: #071b3d !important;
  border: 0 !important;
}
.position-statement::before { display: none; }
.position-statement .text-white,
.position-statement .text-white\/90 { color: #071b3d !important; }
.position-statement .text-emerald-300 { color: #059669 !important; }
.position-statement .bg-white { background: #0039A6 !important; color: #fff !important; }
.position-statement .text-slate-300 { color: #64748b !important; }
.position-statement .border-white\/20 { border-color: transparent !important; }

/* Keep the Who We Are / About surface consistently white. */
.about-corporate,
.who-we-are {
  background: #fff !important;
}
.about-corporate::before,
.who-we-are::before {
  display: none;
}

/* Contact backdrop: architectural scale with a quiet AI/network texture. */
#contact.contact-corporate {
  isolation: isolate;
  background: #fff !important;
  min-height: 32rem;
  display: flex;
  align-items: center;
}
#contact.contact-corporate::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3,10,24,.52) 0%, rgba(3,10,24,.28) 45%, rgba(0,26,77,.42) 100%),
    url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2200&q=85') center/cover no-repeat;
  opacity: 1;
}
#contact.contact-corporate::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(135deg, transparent 0 45%, rgba(0,57,166,.05) 45% 45.2%, transparent 45.2%),
    radial-gradient(circle at 82% 18%, rgba(0,200,220,.18), transparent 28%),
    repeating-linear-gradient(90deg, transparent 0 74px, rgba(103,232,249,.08) 75px, transparent 76px);
  mix-blend-mode: screen;
}
#contact.contact-corporate > .max-w-\[2560px\] {
  position: relative;
}
#contact.contact-corporate .contact-form-panel {
  background: #fff;
  border-color: #dbe5f0;
  box-shadow: 0 18px 45px rgba(0, 26, 77, .14);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
#contact.contact-corporate h2,
#contact.contact-corporate h3,
#contact.contact-corporate .text-slate-900,
#contact.contact-corporate .text-slate-600 {
  color: #fff !important;
}
#contact.contact-corporate .text-slate-500,
#contact.contact-corporate label {
  color: #475569 !important;
}
#contact.contact-corporate .space-y-4.pt-6 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
#contact.contact-corporate .space-y-4.pt-6 > div {
  min-width: 0;
  padding: .85rem;
  border: 1px solid rgba(125, 211, 252, .22);
  border-radius: .75rem;
  background: rgba(3, 10, 24, .42);
}
#contact.contact-corporate .space-y-4.pt-6 > div > div:first-child {
  background: rgba(0, 57, 166, .28);
  border-color: rgba(125, 211, 252, .25);
  color: #67e8f9;
}
#contact.contact-corporate .map-container {
  border-color: rgba(125, 211, 252, .25);
  border-radius: .9rem;
  opacity: .9;
}
#contact.contact-corporate .contact-form-panel input,
#contact.contact-corporate .contact-form-panel select,
#contact.contact-corporate .contact-form-panel textarea {
  color: #0f172a;
  background: #fff;
  border-color: #cbd5e1;
}
#contact.contact-corporate .contact-form-panel label,
#contact.contact-corporate .contact-form-panel .text-slate-600,
#contact.contact-corporate .contact-form-panel .text-slate-500 {
  color: #334155 !important;
}
#contact.contact-corporate .contact-form-panel h3 {
  color: #001a4d !important;
}
#contact.contact-corporate .contact-form-panel input::placeholder,
#contact.contact-corporate .contact-form-panel textarea::placeholder {
  color: #64748b;
}
#contact.contact-corporate .contact-technology-card,
#contact.contact-corporate .contact-technology-card h2,
#contact.contact-corporate .contact-technology-card h3,
#contact.contact-corporate .contact-technology-card p,
#contact.contact-corporate .contact-technology-card label {
  color: #0f172a !important;
}
@media (max-width: 640px) {
  #contact.contact-corporate { min-height: auto; }
  #contact.contact-corporate .space-y-4.pt-6 { grid-template-columns: 1fr; }
}

/* Keep the wide menu inside the viewport; the service group should never be
   pushed off-screen by the side rail's fixed column. */
@media (min-width: 1201px) {
  .navbar-glass .nav-mega-dropdown {
    box-sizing: border-box;
    width: min(78rem, calc(100vw - 2rem)) !important;
    max-width: calc(100vw - 2rem);
    overflow: hidden;
    grid-template-columns: repeat(3, minmax(0, 1fr)) 17rem !important;
  }
  .navbar-glass .group:first-of-type .nav-mega-dropdown {
    left: 50% !important;
    transform: translate(-50%, 10px);
  }
  .navbar-glass .group:first-of-type:hover .nav-mega-dropdown,
  .navbar-glass .group:first-of-type:focus-within .nav-mega-dropdown,
  .navbar-glass .group:first-of-type.nav-open .nav-mega-dropdown {
    transform: translate(-50%, 0);
  }
  .navbar-glass.scrolled .group:first-of-type .nav-mega-dropdown {
    top: calc(100% - 1rem);
  }
}

/* Add light between content bands without flattening the dark hero/CTA work. */
.interior-page main > section:not(:last-of-type):not(#live-screen),
.pricing-neural-page main > section:not(:last-of-type):not(#live-screen) {
  background-image: linear-gradient(135deg, rgba(239,246,255,.72), rgba(255,255,255,.96) 52%, rgba(236,253,245,.58));
}
.interior-page main > section:not(:last-of-type) h2,
.interior-page main > section:not(:last-of-type) h3,
.pricing-neural-page main > section:not(:last-of-type) h2,
.pricing-neural-page main > section:not(:last-of-type) h3 {
  color: #001a4d;
}
.contact-page main > section:nth-child(2) {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 -1px 0 rgba(0,57,166,.08);
}

/* Final navbar cascade: the mega-menu is a viewport-wide surface, not a
   narrow child of the Solutions button. */
@media (min-width: 1201px) {
  .navbar-glass nav > .group:first-of-type { position: static; }
  .navbar-glass nav > .group:first-of-type > .nav-mega-dropdown {
    left: 50% !important;
    right: auto !important;
    top: 100% !important;
    width: min(78rem, calc(100vw - 2rem)) !important;
    max-width: calc(100vw - 2rem);
    grid-template-columns: repeat(3, minmax(0, 1fr)) 17rem !important;
    overflow: hidden;
    transform: translate(-50%, 10px);
  }
  .navbar-glass nav > .group:first-of-type:hover > .nav-mega-dropdown,
  .navbar-glass nav > .group:first-of-type:focus-within > .nav-mega-dropdown,
  .navbar-glass nav > .group:first-of-type.nav-open > .nav-mega-dropdown {
    transform: translate(-50%, 0);
  }
  .navbar-glass nav > .group:first-of-type > .nav-mega-dropdown .nav-mega-aside {
    grid-column: 4;
    grid-row: 2 / 6;
    min-width: 0;
    overflow: hidden;
  }
}

/* Image-led closing panels for interior pages. Homepage remains intentionally
   separate so its final section can be refined independently. */
body.responsive-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 18rem;
  background:
    linear-gradient(105deg, rgba(2,12,30,.7), rgba(0,38,92,.46) 55%, rgba(2,12,30,.66)),
    var(--closing-photo, url("/assets/billing/cafe-management.jpg")) center 48% / cover no-repeat !important;
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type::before,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type::before,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type::before {
  content: none !important;
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type::after,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type::after,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2,12,30,.04), rgba(2,12,30,.12));
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type > *,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type > *,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type > * {
  position: relative;
  z-index: 1;
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type h2,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type h2,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type h2 {
  max-width: 14ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  letter-spacing: -.035em;
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type p,
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type p,
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type p {
  color: #cbd5e1;
}
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type [class*="text-slate-400"],
body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type [class*="text-slate-300"],
body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type [class*="text-slate-400"],
body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type [class*="text-slate-400"] {
  color: #bfdbfe !important;
}
.shop-page .shop-sell-band {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #fff;
  border-color: rgba(125,211,252,.25);
  background: #06152d !important;
}
.shop-page .shop-sell-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(3,10,24,.9), rgba(0,57,166,.58)),
    url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1800&q=85") center / cover no-repeat;
}
.shop-page .shop-sell-band h2,
.shop-page .shop-sell-band p { color: #fff; }
@media (max-width: 640px) {
  body.responsive-page:not(.shop-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type h2,
  body:not(.responsive-page) main > section[class*="bg-[#020712]"]:last-of-type h2,
  body:not(.responsive-page) main > section[class*="bg-[#02120b]"]:last-of-type h2 { max-width: none; }
}

/* Explicit interior-page target: articles, service detail, billing,
   documentation and company pages. Home, Contact, Shop Lift and Saints Hub
   intentionally opt out. */
.interior-page > section:last-of-type,
.pricing-neural-page > section:last-of-type {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 16rem;
  padding-block: clamp(2.1rem, 4vw, 3.4rem) !important;
  background: transparent !important;
}
.interior-page > section:last-of-type::before,
.pricing-neural-page > section:last-of-type::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(3,10,24,.5) 0%, rgba(0,57,166,.28) 52%, rgba(3,10,24,.38) 100%),
    url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2200&q=85") center / cover no-repeat;
}
.interior-page > section:last-of-type::after,
.pricing-neural-page > section:last-of-type::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(3,10,24,.06), transparent 45%, rgba(3,10,24,.12));
}
.interior-page > section:last-of-type > *,
.pricing-neural-page > section:last-of-type > * {
  position: relative;
  z-index: 1;
}
.interior-page > section:last-of-type h2,
.pricing-neural-page > section:last-of-type h2 {
  max-width: 16ch;
  color: #fff !important;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 4vw, 4.2rem);
  letter-spacing: -.04em;
  line-height: .98;
  text-wrap: balance;
}
.interior-page > section:last-of-type p,
.pricing-neural-page > section:last-of-type p {
  max-width: 62ch;
  color: #cbd5e1 !important;
}
.interior-page > section:last-of-type [class*="text-slate-300"],
.interior-page > section:last-of-type [class*="text-slate-400"],
.pricing-neural-page > section:last-of-type [class*="text-slate-300"],
.pricing-neural-page > section:last-of-type [class*="text-slate-400"] {
  color: #bfdbfe !important;
}
.interior-page > section:last-of-type [class*="border-white"],
.pricing-neural-page > section:last-of-type [class*="border-white"] {
  border-color: rgba(191,219,254,.24) !important;
}
.interior-page > section:last-of-type [class*="bg-white/10"],
.pricing-neural-page > section:last-of-type [class*="bg-white/10"] {
  background: rgba(255,255,255,.1) !important;
}
.interior-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .72fr);
  gap: 1rem 2rem;
  align-items: center;
  max-width: 74rem;
  margin: 2.5rem auto 0;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(191,219,254,.25);
}
.interior-action-buttons { display: flex; flex-wrap: wrap; gap: .7rem; }
.interior-action-buttons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 3.25rem;
  padding: .8rem 1.25rem;
  border-radius: .65rem;
  font-size: .78rem;
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease;
}
.interior-action-buttons a:hover { transform: translateY(-2px); }
.interior-action-primary { color: #fff; background: #0f766e; box-shadow: 0 10px 24px rgba(15,118,110,.28); }
.interior-action-primary:hover { background: #0d9488; }
.interior-action-secondary { color: #fff; border: 1px solid rgba(191,219,254,.5); background: rgba(3,10,24,.35); }
.interior-action-secondary:hover { background: rgba(3,10,24,.65); border-color: #67e8f9; }
.interior-action-buttons svg { width: 1rem; height: 1rem; }
.interior-direct-lines {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem .9rem;
  align-items: center;
  padding: 1rem;
  border: 1px solid rgba(191,219,254,.25);
  border-radius: .75rem;
  background: rgba(3,10,24,.84);
}
.interior-direct-label { grid-column: 1 / -1; color: #67e8f9; font: 700 .7rem/1.2 "JetBrains Mono", monospace; letter-spacing: .15em; }
.interior-direct-lines a {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  min-width: 0;
  color: #e0f2fe;
  font: 700 .8rem/1.45 "JetBrains Mono", monospace;
  text-decoration: none;
}
.interior-direct-lines a:hover { color: #67e8f9; }
.interior-direct-lines svg { flex: 0 0 auto; width: .95rem; color: #34d399; }
.interior-direct-lines span { min-width: 0; overflow-wrap: anywhere; }
.interior-direct-lines small { display: block; margin-bottom: .22rem; color: #bfdbfe; font-size: .65rem; letter-spacing: .12em; }
.interior-page > section:last-of-type > .site-container > .grid > div:last-child,
.pricing-neural-page > section:last-of-type > .site-container > .grid > div:last-child {
  padding: 1.4rem;
  border: 1px solid rgba(191,219,254,.25);
  border-radius: 1rem;
  background: rgba(3,10,24,.58);
  box-shadow: 0 18px 50px rgba(0,0,0,.2);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
@media (max-width: 640px) {
  .interior-page > section:last-of-type,
  .pricing-neural-page > section:last-of-type { min-height: 20rem; }
  .interior-page > section:last-of-type h2,
  .pricing-neural-page > section:last-of-type h2 { max-width: none; }
  .interior-action-row { grid-template-columns: 1fr; }
  .interior-action-buttons { display: grid; grid-template-columns: 1fr; }
  .interior-action-buttons a { width: 100%; }
  .interior-direct-lines { grid-template-columns: minmax(0, 1fr); }
}

/* Saints Man live analytics surface */
#smas.saints-analytics {
  isolation: isolate;
  background: #031b45 !important;
}
#smas.saints-analytics::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(110deg, rgba(1,24,61,.96), rgba(3,27,69,.86) 54%, rgba(0,48,94,.78)),
    url('https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1600&q=85') center/cover no-repeat;
}
#smas.saints-analytics::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .45;
  background:
    linear-gradient(rgba(45,212,191,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(45,212,191,.08) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(90deg, transparent, #000 30%, #000 100%);
}
#smas .analytics-panel {
  background: rgba(11, 42, 91, .72);
  border-color: rgba(148, 196, 255, .22);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .3);
}
#smas .analytics-chart {
  height: clamp(7rem, 13vw, 11rem);
  background: linear-gradient(180deg, rgba(16,185,129,.1), transparent);
}
#smas .analytics-line {
  stroke-dasharray: 420;
  stroke-dashoffset: 420;
  animation: drawAnalyticsLine 1.8s ease-out forwards;
}
@keyframes drawAnalyticsLine { to { stroke-dashoffset: 0; } }
#smas .analytics-bar {
  transform-origin: bottom;
  animation: riseAnalyticsBar .8s cubic-bezier(.16,1,.3,1) both;
}
#smas .analytics-bar:nth-child(2) { animation-delay: .08s; }
#smas .analytics-bar:nth-child(3) { animation-delay: .16s; }
#smas .analytics-bar:nth-child(4) { animation-delay: .24s; }
#smas .analytics-bar:nth-child(5) { animation-delay: .32s; }
#smas .analytics-bar:nth-child(6) { animation-delay: .4s; }
@keyframes riseAnalyticsBar { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) {
  #smas .analytics-line { animation: none; stroke-dashoffset: 0; }
  #smas .analytics-bar { animation: none; }
}

/* Brand portfolio backdrop */
#brands.brands-corporate {
  isolation: isolate;
  background: #001a4d !important;
}
#brands.brands-corporate::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(115deg, rgba(0, 17, 55, .96) 0%, rgba(0, 26, 77, .9) 48%, rgba(0, 26, 77, .72) 100%),
    url('https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&w=1600&q=85') center/cover no-repeat;
}
#brands.brands-corporate::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(rgba(52, 211, 153, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(52, 211, 153, .06) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, transparent, #000 35%, #000);
}
#brands.brands-corporate > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}

/* Distinct editorial backgrounds for the major content sections. */
.multi-photo-section {
  isolation: isolate;
  overflow: hidden;
}
.multi-photo-section::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.multi-photo-section::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.multi-photo-section > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}
#about-company.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=85');
  opacity: .12;
}
#about-company.multi-photo-section::after,
#divisions.multi-photo-section::after,
#projects.multi-photo-section::after,
#how-we-work.multi-photo-section::after,
#client-notes.multi-photo-section::after,
#blog.multi-photo-section::after,
#partners.multi-photo-section::after {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.97));
}
.who-we-are.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85');
  opacity: .13;
}
.who-we-are.multi-photo-section::after {
  background: linear-gradient(110deg, rgba(255,255,255,.95), rgba(255,255,255,.88));
}
.position-statement.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1556761175-5973dc0f32e7?auto=format&fit=crop&w=1600&q=85');
  opacity: .18;
}
.position-statement.multi-photo-section::after {
  background: linear-gradient(110deg, rgba(255,255,255,.96), rgba(239,246,255,.9));
}
#divisions.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85');
  opacity: .1;
}
#projects.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1504384308090-c894fdcc538d?auto=format&fit=crop&w=1600&q=85');
  opacity: .12;
}
#blog.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1523731407965-2430cd12f5e4?auto=format&fit=crop&w=1600&q=85');
  opacity: .1;
}
#how-we-work.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85');
  opacity: .1;
}
#client-notes.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85');
  opacity: .26;
}
#partners.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1556761175-129418cb2dfe?auto=format&fit=crop&w=1600&q=85');
  opacity: .1;
}
#about.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85');
  opacity: .22;
}
#how-we-work.multi-photo-section::before {
  background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85');
  opacity: .2;
}
#about.multi-photo-section::after,
#how-we-work.multi-photo-section::after,
#client-notes.multi-photo-section::after {
  background: linear-gradient(110deg, rgba(255,255,255,.78), rgba(255,255,255,.9));
}
.footer-photo {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  background-color: #001a4d !important;
  background-image:
    linear-gradient(rgba(0,12,30,.78), rgba(0,12,30,.84)),
    url("/assets/billing/cafe-management.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
}
.footer-photo::before,
.footer-photo::after {
  display: none;
}
.footer-photo > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}

/* Site-wide visual cleanup: preserve the existing layout and content while
   removing competing effects that reduce image quality and hierarchy. */
.shadow,
.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl,
body:not(:has(> section#home)) .shadow-2xl,
.shadow-inner,
.glow-card,
.interaction-card,
.shop-card,
.hub-feature,
.hub-program-card,
.hub-project-grid article,
.hub-training-grid article,
.hub-compact-form,
.shop-filter-panel,
.shop-search-box,
.shop-modal-card,
.billing-compare-wrap,
.loader-card {
  box-shadow: none !important;
}

.glow-card,
.interaction-card,
.project-card {
  transform: none !important;
}

.glow-card:hover,
.interaction-card:hover,
.project-card:hover,
.shop-card:hover,
.hub-feature:hover {
  box-shadow: none !important;
  transform: none !important;
}

*:not(.site-loader-mark):not(.loader-spinner) {
  text-shadow: none !important;
}

[class*="backdrop-blur"],
.glass-card,
.navbar-glass:not(.scrolled),
.interior-page > section:last-of-type > .site-container > .grid > div:last-child,
.pricing-neural-page > section:last-of-type > .site-container > .grid > div:last-child {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.glass-card {
  background: #fff !important;
  border: 1px solid #dbe5f0 !important;
}

body:not(:has(> section#home)) .glass-card,
body:not(:has(> section#home)) .float-anim {
  animation: none !important;
}

body:not(:has(> section#home)) .glass-card:hover {
  transform: none !important;
  box-shadow: none !important;
}

.navbar-glass:not(.scrolled) {
  background: rgba(0, 26, 77, .94) !important;
}

.navbar-glass:not(.scrolled) nav,
.navbar-glass:not(.scrolled) nav button,
.navbar-glass:not(.scrolled) nav > a,
.navbar-glass:not(.scrolled) .portal-signin {
  text-shadow: none !important;
}

.logo-shine::after {
  display: none !important;
}

.scroll-progress {
  box-shadow: none !important;
}

.footer-photo {
  background-image:
    linear-gradient(rgba(0, 26, 77, .72), rgba(0, 26, 77, .82)),
    url("/assets/billing/cafe-management.jpg") !important;
}

.multi-photo-section::after {
  background: rgba(255, 255, 255, .62) !important;
}

.multi-photo-section::before {
  opacity: .42 !important;
}

.position-statement.multi-photo-section::after {
  background: rgba(3, 7, 18, .48) !important;
}

.position-statement.multi-photo-section::before {
  opacity: .72 !important;
}

.interior-action-primary {
  box-shadow: none !important;
}

.interior-action-secondary,
.interior-direct-lines,
.interior-page > section:last-of-type > .site-container > .grid > div:last-child,
.pricing-neural-page > section:last-of-type > .site-container > .grid > div:last-child {
  background: rgba(3, 10, 24, .82) !important;
  box-shadow: none !important;
}

.footer-payment-band {
  display: flex;
  align-items: center;
  gap: clamp(.75rem, 2vw, 1.5rem);
  padding: 1rem 0;
  margin: 0 0 2.5rem;
  border-block: 1px solid rgba(255,255,255,.12);
  overflow-x: auto;
  scrollbar-width: thin;
}
.footer-payment-label {
  flex: 0 0 auto;
  color: #fff;
  font: 800 .62rem/1 'JetBrains Mono', monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.footer-payment-logo {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.6rem;
  height: 2.2rem;
  padding: .35rem .6rem;
  border-radius: .35rem;
  background: #fff;
}
.footer-payment-logo img {
  max-width: 100%;
  max-height: 1.25rem;
  object-fit: contain;
}
.footer-payment-fallback {
  color: #001a4d;
  font-size: .65rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.footer-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.footer-social-links > a {
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.footer-social-links > a:hover {
  transform: translateY(-2px);
}
.footer-payment-band {
  background: rgba(2, 7, 18, .18);
  border-block-color: rgba(255,255,255,.2);
}
@media (max-width: 639px) {
  .navbar-glass .nav-mega-dropdown {
    display: block;
    width: min(100%, calc(100vw - 2rem));
  }
  .footer-payment-band {
    align-items: flex-start;
    flex-direction: column;
    width: 100%;
  }
  .footer-payment-logo {
    width: min(100%, 12rem);
    min-width: 0;
    justify-content: flex-start;
    padding-inline: .8rem;
  }
}

/* Match the Contact section's layered image treatment on the selected white sections. */
#client-notes.multi-photo-section,
#how-we-work.multi-photo-section {
  isolation: isolate;
  background: #f8fafc !important;
}
#client-notes.multi-photo-section::before,
#how-we-work.multi-photo-section::before {
  z-index: -2;
  opacity: 1;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
#client-notes.multi-photo-section::before {
  background-image:
    linear-gradient(110deg, rgba(248,250,252,.9), rgba(239,246,255,.72)),
    url('https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85');
}
#how-we-work.multi-photo-section::before {
  background-image:
    linear-gradient(110deg, rgba(248,250,252,.91), rgba(255,255,255,.7)),
    url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85');
}
#client-notes.multi-photo-section::after,
#how-we-work.multi-photo-section::after {
  z-index: -1;
  background:
    linear-gradient(rgba(0,57,166,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,57,166,.045) 1px, transparent 1px),
    radial-gradient(circle at 88% 20%, rgba(16,185,129,.1), transparent 28%);
  background-size: 56px 56px, 56px 56px, auto;
  mix-blend-mode: multiply;
}
#client-notes.multi-photo-section > .max-w-\[2560px\],
#how-we-work.multi-photo-section > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}

/* Extend the photo treatment to the remaining selected sections without grid lines. */
#about.multi-photo-section,
#divisions.multi-photo-section,
#blog.multi-photo-section,
#projects.multi-photo-section,
#partners.multi-photo-section,
.who-we-are.multi-photo-section,
#about-company.about-corporate.multi-photo-section {
  isolation: isolate;
  background: #f8fafc !important;
}
#about.multi-photo-section::before,
#divisions.multi-photo-section::before,
#blog.multi-photo-section::before,
#projects.multi-photo-section::before,
#partners.multi-photo-section::before,
.who-we-are.multi-photo-section::before,
#about-company.about-corporate.multi-photo-section::before {
  z-index: -2;
  opacity: 1;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
#about.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.91), rgba(239,246,255,.74)),
    url('https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85');
}
#divisions.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.94), rgba(255,255,255,.76)),
    url('https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85');
}
#blog.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.9), rgba(255,255,255,.72)),
    url('https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1600&q=85');
}
#projects.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.92), rgba(239,246,255,.74)),
    url('https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85');
}
#partners.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.88), rgba(255,255,255,.7)),
    url('https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85');
}
.who-we-are.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.9), rgba(255,255,255,.73)),
    url('https://images.unsplash.com/photo-1560250097-0b93528c311a?auto=format&fit=crop&w=1600&q=85');
}
#about-company.about-corporate.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.92), rgba(239,246,255,.74)),
    url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=85');
}
#about.multi-photo-section::after,
#divisions.multi-photo-section::after,
#blog.multi-photo-section::after,
#projects.multi-photo-section::after,
#partners.multi-photo-section::after,
.who-we-are.multi-photo-section::after,
#about-company.about-corporate.multi-photo-section::after {
  z-index: -1;
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.38));
}
#about.multi-photo-section > .max-w-\[2560px\],
#divisions.multi-photo-section > .max-w-\[2560px\],
#blog.multi-photo-section > .max-w-\[2560px\],
#projects.multi-photo-section > .max-w-\[2560px\],
#partners.multi-photo-section > .max-w-\[2560px\],
.who-we-are.multi-photo-section > .max-w-\[2560px\],
#about-company.about-corporate.multi-photo-section > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}

/* Add distinct full-bleed imagery to the three remaining corporate sections. */
#about-company.about-corporate.multi-photo-section,
.who-we-are.multi-photo-section,
.position-statement.multi-photo-section {
  isolation: isolate;
  overflow: hidden;
}
#about-company.about-corporate.multi-photo-section::before,
.who-we-are.multi-photo-section::before,
.position-statement.multi-photo-section::before {
  display: block;
  z-index: -2;
  opacity: 1;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
#about-company.about-corporate.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.9), rgba(239,246,255,.72)),
    url('https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1600&q=85');
}
.who-we-are.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(248,250,252,.88), rgba(255,255,255,.7)),
    url('https://images.unsplash.com/photo-1529156069898-49953e39b3ac?auto=format&fit=crop&w=1600&q=85');
}
.position-statement.multi-photo-section {
  background: #06142f !important;
  color: #fff !important;
}
.position-statement.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(3,7,18,.86), rgba(0,57,166,.68)),
    url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1600&q=85');
}
#about-company.about-corporate.multi-photo-section::after,
.who-we-are.multi-photo-section::after {
  z-index: -1;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.4));
}
.position-statement.multi-photo-section::after {
  z-index: -1;
  background: radial-gradient(circle at 84% 18%, rgba(16,185,129,.16), transparent 34%);
}
#about-company.about-corporate.multi-photo-section > .max-w-\[2560px\],
.who-we-are.multi-photo-section > .max-w-\[2560px\],
.position-statement.multi-photo-section > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}
.position-statement.multi-photo-section .text-white,
.position-statement.multi-photo-section .text-white\/90 {
  color: #fff !important;
}
.position-statement.multi-photo-section .text-slate-300 {
  color: rgba(226,232,240,.86) !important;
}
@media (prefers-reduced-motion: reduce) {
  .multi-photo-section::before { background-attachment: initial; }
}

/* Fluid corporate layout: use the full viewport without making large displays feel empty. */
html { font-size: clamp(15px, 0.32vw + 11px, 24px); }
body { min-width: 320px; overflow-x: hidden; }
.max-w-\[2560px\] { width: 100%; max-width: none !important; }
section, footer { width: 100%; }
section > .max-w-\[2560px\], footer > .max-w-\[2560px\] {
  padding-inline: clamp(1rem, 4vw, 7rem);
}
.hero-image-overlay { background: linear-gradient(110deg, rgba(3,7,18,.88), rgba(0,57,166,.54) 58%, rgba(3,7,18,.28)); }
.hero-image-overlay + * { max-width: 100%; }
.service-hero-overlay {
  background:
    linear-gradient(90deg, rgba(3, 7, 18, .9), rgba(3, 7, 18, .55) 52%, rgba(3, 7, 18, .35)),
    linear-gradient(0deg, rgba(3, 7, 18, .82), transparent 58%);
}
.service-hero-title { text-wrap: balance; }
#home.hero-fullscreen {
  min-height: 100svh;
  display: grid;
  align-items: center;
  isolation: isolate;
}
#home.hero-fullscreen > div.relative.z-10 {
  width: 100%;
  padding-block: clamp(5rem, 10vh, 9rem);
}
#home.hero-fullscreen .hero-grid {
  min-height: calc(100svh - 4rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(2rem, 5vh, 4rem);
  text-align: center;
}
#home.hero-fullscreen .hero-grid > div {
  width: min(100%, 78rem);
  display: flex;
  flex-direction: column;
  align-items: center;
}
#home.hero-fullscreen h1 {
  max-width: 16ch;
  margin-inline: auto;
  font-size: clamp(2.75rem, 7vw, 8rem);
  line-height: .94;
  text-wrap: balance;
}
#home.hero-fullscreen .hero-grid p {
  max-width: min(42rem, 90vw);
  margin-inline: auto;
  font-size: clamp(1rem, 1.35vw, 1.5rem);
  text-wrap: balance;
}
#home.hero-fullscreen .hero-grid .grid.grid-cols-2 {
  width: min(100%, 72rem);
}
#home.hero-fullscreen .hero-grid .grid.grid-cols-2 + .grid {
  width: min(100%, 62rem);
  justify-content: center;
}
#home.hero-fullscreen .hero-grid .flex.items-center.justify-between {
  width: min(100%, 72rem);
}
#home.hero-fullscreen .hero-grid .flex.items-center.justify-between h3,
#home.hero-fullscreen .hero-grid .flex.items-center.justify-between a {
  text-align: left;
}
#home.hero-fullscreen .hero-grid .flex.flex-wrap.items-center {
  justify-content: center;
}
.hero-visual-caption { font-size: clamp(.72rem, .8vw, 1rem); }
.logo-shine [data-supplied-logo] {
  display: block !important;
  width: clamp(9rem, 13vw, 14rem);
  height: 2.5rem;
  object-fit: cover;
  object-position: center;
}
.logo-shine > svg { display: none; }
button, a { touch-action: manipulation; }
input, textarea, select { font-size: max(16px, 1em); }

@media (min-width: 2200px) {
  .fluid-h1 { font-size: clamp(4.5rem, 6vw, 9rem); }
  .fluid-h2 { font-size: clamp(3rem, 4vw, 5.5rem); }
  .fluid-p { font-size: clamp(1.15rem, 1.3vw, 1.65rem); }
  .hero-image-overlay { background: linear-gradient(110deg, rgba(3,7,18,.9), rgba(0,57,166,.58) 60%, rgba(3,7,18,.2)); }
}
@media (min-width: 3840px) {
  html { font-size: clamp(18px, 0.3vw + 12px, 30px); }
  section > .max-w-\[2560px\], footer > .max-w-\[2560px\] {
    padding-inline: clamp(4rem, 6vw, 12rem);
  }
}
@media (max-width: 1023px) {
  .navbar-glass > div { min-height: 4.5rem; }
  .navbar-glass .logo-shine { height: 2.75rem; padding-inline: .75rem; }
  .navbar-glass .logo-shine svg { height: 2rem; }
}
@media (max-width: 639px) {
  section > .max-w-\[2560px\], footer > .max-w-\[2560px\] { padding-inline: 1rem; }
  .hero-image-overlay { background: linear-gradient(160deg, rgba(3,7,18,.94), rgba(0,57,166,.66)); }
  #home.hero-fullscreen { min-height: 100svh; }
  #home.hero-fullscreen > div.relative.z-10 { padding-block: 4rem 5rem; }
  #home.hero-fullscreen .hero-grid { min-height: 100svh; gap: 2rem; }
  #home.hero-fullscreen .hero-grid .grid.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  #home.hero-fullscreen .hero-grid .grid.grid-cols-2 + .grid { gap: 1rem; }
  #home.hero-fullscreen .hero-grid .grid.grid-cols-2 + .grid > div { min-width: 0; }
  #networkCanvas { opacity: .45; }
}
@media (prefers-reduced-motion: reduce) {
  .ambient-light-beam, #networkCanvas { display: none; }
}

/* Services page uses the same fluid sizing system as the landing page. */
.services-page {
  min-width: 0;
}

.services-page .site-container {
  width: min(100%, 100vw);
  max-width: none;
}

.services-compact-hero {
  min-height: clamp(25rem, 42vw, 38rem);
  isolation: isolate;
}
.services-compact-hero > .site-container {
  min-height: clamp(21rem, 34vw, 31rem);
}
.services-compact-hero h1 {
  max-width: 18ch;
  text-wrap: balance;
}
.services-compact-hero p {
  text-wrap: pretty;
}

.services-page .hero-wrapper {
  min-height: clamp(42rem, 78vh, 58rem);
  display: flex;
  align-items: center;
  background:
    linear-gradient(90deg, rgba(2, 7, 18, .96) 0%, rgba(2, 7, 18, .82) 46%, rgba(2, 7, 18, .7) 100%),
    url('https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1600&q=85') center / cover;
  isolation: isolate;
}

.services-compact-hero {
  min-height: 26rem;
}

.services-page .hero-wrapper::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 72% 38%, rgba(0, 163, 255, .16), transparent 30%),
    linear-gradient(180deg, rgba(2, 7, 18, .2), rgba(2, 7, 18, .72));
  pointer-events: none;
}

.services-page .hero-wrapper > .site-container {
  width: 100%;
}

.services-page .hero-grid-layout {
  min-height: clamp(28rem, 62vh, 42rem);
}

.services-page .hero-grid-layout > div:last-child {
  align-self: center;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.services-page .hero-title {
  font-size: clamp(2.4rem, 6vw, 8vw);
  max-width: 13ch;
  text-wrap: balance;
}

.services-compact-hero > .site-container {
  min-height: 22rem;
}

.services-page .division-title {
  font-size: clamp(1.6rem, 2.7vw, 3.25rem);
}

.services-page section:not(#home) {
  padding-block: clamp(3.5rem, 4vw, 6rem);
}

.services-page section img {
  max-width: 100%;
}

@media (min-width: 2200px) {
  .services-page {
    font-size: clamp(1rem, .35vw + .8rem, 1.35rem);
  }

  .services-page .hero-grid-layout {
    grid-template-columns: minmax(0, 1.6fr) minmax(20rem, .9fr);
  }
}

@media (max-width: 1023px) {
  .services-page .hero-wrapper {
    padding-top: clamp(4rem, 10vw, 7rem);
    display: block;
  }

  .services-page .hero-grid-layout {
    gap: clamp(2.5rem, 8vw, 5rem);
  }

  .services-page .site-container {
    padding-inline: clamp(1rem, 4vw, 2.5rem);
  }
}

@media (max-width: 639px) {
  .services-page .hero-wrapper {
    min-height: auto;
    background-position: 62% center;
  }

  .services-page .hero-title {
    font-size: clamp(2.35rem, 13vw, 5rem);
    line-height: .98;
    max-width: 12ch;
  }

  .services-page section:not(#home) {
    padding-block: 3.5rem;
  }

  .services-page .back-to-top {
    right: 1rem;
    bottom: 1rem;
  }
}

@media (min-width: 3840px) {
  .services-page .site-container {
    padding-inline: clamp(4rem, 6vw, 12rem);
  }
}

/* Shared mobile contract for the uploaded pages, billing, and blog. */
.responsive-page {
  min-width: 0;
  overflow-x: clip;
}

.responsive-page main,
.responsive-page section,
.responsive-page article,
.responsive-page footer,
.responsive-page .site-container {
  min-width: 0;
  max-width: 100%;
}

.responsive-page img,
.responsive-page video,
.responsive-page canvas,
.responsive-page svg {
  max-width: 100%;
}

.responsive-page h1,
.responsive-page h2,
.responsive-page h3,
.responsive-page p,
.responsive-page a {
  overflow-wrap: anywhere;
}

.responsive-page h1 {
  text-wrap: balance;
}

.responsive-page h1,
.responsive-page h2,
.responsive-page h3 {
  font-family: "Lora", Georgia, serif;
  letter-spacing: -0.03em;
}

.responsive-page .font-mono,
.responsive-page code,
.responsive-page pre {
  font-family: "JetBrains Mono", monospace;
}

.responsive-page .site-hero-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0.2;
  pointer-events: none;
}

.responsive-page .site-hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.responsive-page .site-hero-content {
  position: relative;
  z-index: 1;
}

.responsive-page .content-hero-compact {
  min-height: clamp(22rem, 34vw, 34rem);
  padding: clamp(3rem, 7vw, 5.5rem) 0 clamp(2.5rem, 5vw, 4rem);
  isolation: isolate;
}

.responsive-page #home.content-hero-compact {
  display: block;
  min-height: clamp(22rem, 34vw, 34rem);
  align-items: initial;
}

.responsive-page .content-hero-compact .site-hero-image {
  opacity: 0.46;
}

.responsive-page .content-hero-compact .hero-content-overlay {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2, 7, 18, 0.96) 0%, rgba(2, 7, 18, 0.72) 48%, rgba(2, 7, 18, 0.42) 100%);
}

.responsive-page .content-hero-compact > .site-container,
.responsive-page .content-hero-compact > .relative {
  position: relative;
  z-index: 1;
}

@media (max-width: 640px) {
  .responsive-page .content-hero-compact {
    min-height: 22rem;
    padding-top: 2.75rem;
    padding-bottom: 2.5rem;
  }

  .responsive-page .content-hero-compact .hero-content-overlay {
    background: linear-gradient(180deg, rgba(2, 7, 18, 0.86), rgba(2, 7, 18, 0.96));
  }
}

.responsive-page .grid,
.responsive-page .flex {
  min-width: 0;
}

.responsive-page .grid > *,
.responsive-page .flex > * {
  min-width: 0;
}

.responsive-page table,
.responsive-page pre {
  max-width: 100%;
  overflow-x: auto;
}

.image-fallback {
  background:
    linear-gradient(135deg, rgba(0, 26, 77, .96), rgba(0, 57, 166, .84)),
    radial-gradient(circle at 75% 20%, rgba(16, 185, 129, .5), transparent 42%);
}
.filter-btn {
  border: 1px solid rgb(226 232 240);
  background: rgb(248 250 252);
  color: rgb(71 85 105);
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.filter-btn:hover,
.filter-btn:focus-visible {
  border-color: rgb(16 185 129);
  color: rgb(4 120 87);
  background: rgb(236 253 245);
}

.filter-btn.active {
  border-color: rgb(4 120 87);
  background: rgb(5 150 105);
  color: white;
}

/* New pages follow the homepage's full-width, zoom-safe shell without changing
   the layout rules of existing pages. */
.shop-page > main,
.saints-page > main {
  width: 100%;
  min-width: 0;
  overflow-x: clip;
}
.shop-page main > section > .max-w-6xl,
.saints-page main > section > .max-w-6xl {
  width: 100%;
  max-width: 2560px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 4.5rem);
}
.shop-page .shop-hero-content,
.saints-page .saints-hero-content {
  padding-top: clamp(1rem, 2vw, 2rem);
  padding-bottom: clamp(1rem, 2vw, 2rem);
}
.shop-page h1,
.saints-page h1,
.shop-page h2,
.saints-page h2,
.shop-page h3,
.saints-page h3 {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
.shop-page .shop-product-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.saints-page .hub-feature-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1023px) {
  .shop-page .shop-product-grid,
  .saints-page .hub-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hub-program-grid, .hub-project-grid, .hub-event-grid, .hub-training-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-catalog-layout { grid-template-columns: 1fr; }
  .shop-filter-panel { position: fixed; inset: 0 auto 0 0; z-index: 70; width: min(19rem, 88vw); overflow-y: auto; border-radius: 0 1rem 1rem 0; transform: translateX(-105%); transition: transform .2s ease; }
  .shop-filter-panel.open { transform: translateX(0); }
}


@media (max-width: 767px) {
  .shop-product-grid,
  .hub-feature-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .shop-hero,
  .saints-hero {
    min-height: 28rem;
  }
  .shop-hero h1,
  .saints-hero h1 {
    font-size: clamp(2.25rem, 11vw, 4rem);
    line-height: 1;
  }
  .shop-hero p,
  .saints-hero p {
    max-width: 100%;
  }
  .shop-page .shop-product-grid,
  .saints-page .hub-feature-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .hub-program-grid, .hub-project-grid, .hub-event-grid, .hub-training-grid { grid-template-columns: minmax(0, 1fr); }
  .saints-hero-actions { flex-direction: column; align-items: stretch; }
  .saints-hero-actions a { justify-content: center; }
  .client-sector-grid, .delivery-promise-grid { grid-template-columns: minmax(0, 1fr); }
  .shop-market-head, .shop-sell-band { align-items: stretch; flex-direction: column; }
  .shop-search-row { align-items: stretch; flex-direction: column; }
  .shop-filter-toggle { justify-content: center; }
  .shop-page main > section > .max-w-6xl,
  .saints-page main > section > .max-w-6xl {
    padding-inline: 1rem;
  }
  .shop-page .shop-hero-content,
  .saints-page .saints-hero-content {
    padding-top: 0;
    padding-bottom: 0;
  }
  .responsive-page .grid[class*="grid-cols-2"],
  .responsive-page .grid.grid-cols-3,
  .responsive-page .grid.grid-cols-4,
  .responsive-page .grid.grid-cols-5,
  .responsive-page .grid.grid-cols-6,
  .responsive-page .grid.grid-cols-12 {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .responsive-page .hero-wrapper,
  .responsive-page [class*="hero"] {
    max-width: 100%;
    overflow: hidden;
  }

  .responsive-page .hero-title,
  .responsive-page h1 {
    max-width: 100%;
    font-size: clamp(2.35rem, 12vw, 4.75rem);
    line-height: .98;
  }

  .responsive-page .flex-wrap {
    row-gap: .75rem;
  }

  .responsive-page .footer-photo .grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .responsive-page .footer-photo .grid > * {
    width: 100%;
  }


  .responsive-page input,
  .responsive-page select,
  .responsive-page textarea,
  .responsive-page button {
    max-width: 100%;
  }
  .responsive-page main,
  .responsive-page section,
  .responsive-page .max-w-6xl {
    width: 100%;
    min-width: 0;
  }
  .responsive-page .max-w-6xl {
    max-width: none;
  }
}

/* Keep the shared shell usable on narrow viewports. */
[data-site-navbar] {
  display: contents;
}
[data-site-navbar][data-reserve-space] {
  display: block;
}

.site-container,
.navbar-glass > div,
.navbar-glass > div > a,
.navbar-glass .nav-actions {
  min-width: 0;
}

.site-container {
  width: 100%;
  max-width: 1920px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 4.5rem);
}

.navbar-glass > div {
  width: 100%;
}

.navbar-glass > div > a {
  flex: 0 1 auto;
}

.navbar-glass .logo-shine {
  max-width: min(68vw, 14rem);
}

.navbar-glass .nav-actions {
  flex: 0 0 auto;
  gap: clamp(.25rem, 1vw, .5rem);
}

@media (max-width: 1023px) {
  .navbar-glass .nav-actions > .portal-signin,
  .navbar-glass .nav-actions > a[href="/billing/"] {
    display: none;
  }

  .navbar-glass .nav-actions .nav-a11y-trigger {
    min-height: 2.5rem;
    padding-inline: .55rem;
  }

  .navbar-glass #mobile-menu {
    position: absolute;
    inset: 100% 0 auto;
    max-height: calc(100svh - 4.5rem);
    overflow-y: auto;
    padding-inline: clamp(1rem, 4vw, 2rem);
  }
}

@media (max-width: 639px) {
  .site-container {
    padding-inline: 1rem;
  }

  .navbar-glass > div {
    gap: .5rem;
    padding-inline: 1rem;
  }

  .navbar-glass .logo-shine {
    height: 2.5rem;
    padding-inline: .55rem;
  }

  .navbar-glass .logo-shine [data-supplied-logo] {
    width: min(52vw, 11rem);
  }

  .navbar-glass .nav-a11y-panel {
    right: -.25rem;
    width: min(22rem, calc(100vw - 1rem));
  }

  .navbar-glass #mobile-menu {
    max-height: calc(100svh - 4rem);
  }

  footer form {
    flex-wrap: wrap;
  }

  footer form input,
  footer form button {
    min-width: 0;
  }
}


/* ===== ACCESSIBILITY + IMAGE-RICH PAGE SYSTEM ===== */
:root {
  --access-text: #0b1220;
  --access-surface: rgba(255,255,255,.92);
  --access-focus: #005fcc;
}
:focus-visible {
  outline: 3px solid var(--access-focus) !important;
  outline-offset: 3px !important;
}
.sr-only:not(:focus):not(:active) {
  clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden;
  position: absolute; white-space: nowrap; width: 1px;
}
html[lang] { text-rendering: optimizeLegibility; }
body {
  background-color: #f8fafc;
  background-image: none;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .announcement-track, .announcement-location-track, .ambient-light-beam,
  #networkCanvas, .site-loader-mark, .hero-city-drift, .hero-light-pulse {
    animation: none !important;
  }
  .announcement-track, .announcement-location-track, .navbar-glass,
  .nav-dropdown, .nav-mega-dropdown, .mobile-nav-submenu {
    transition: none !important;
  }
}
@media (forced-colors: active) { * { forced-color-adjust: auto; } }


/* Accessibility and Google Translate controls */
html[data-text-scale="1.05"] { font-size:105%; } html[data-text-scale="1.1"] { font-size:110%; } html[data-text-scale="1.15"] { font-size:115%; } html[data-text-scale="1.2"] { font-size:120%; }
html[data-text-scale="0.95"] { font-size:95%; } html[data-text-scale="0.9"] { font-size:90%; }
html.accessibility-high-contrast body { filter:contrast(1.18); }
html.accessibility-high-contrast a,html.accessibility-high-contrast button { text-decoration-thickness:2px; }


/* Keep Google Translate inside the existing navbar accessibility menu. */
.nav-a11y-translate { margin:.15rem 0 .6rem; min-height:2rem; }
.nav-a11y-translate .goog-te-gadget { color:inherit !important; font-size:0 !important; }
.nav-a11y-translate .goog-te-gadget .goog-te-combo { width:100%; min-height:2.15rem; font-size:.78rem !important; padding:.4rem .5rem; border-radius:.5rem; border:1px solid rgba(148,163,184,.7); background:#fff; color:#0f172a; }
.nav-a11y-translate .goog-te-banner-frame { display:none !important; }
body { top:0 !important; }

/* ===== GALLERY PAGE ===== */
body.gallery-page {
  min-height: 100vh;
  background: #071426 !important;
  color: #e5eefb;
}
body.gallery-page main {
  background: transparent !important;
}
.gallery-page .gallery-hero {
  min-height: 28rem;
  display: flex;
  align-items: center;
  background-image: linear-gradient(90deg,rgba(2,7,18,.82),rgba(2,7,18,.48)),url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=2400&q=85") !important;
  background-size: cover !important;
  background-position: center !important;
}
.gallery-page .gallery-section {
  background-image: linear-gradient(rgba(3,10,24,.60),rgba(3,10,24,.72)),url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2400&q=85") !important;
  background-size: cover !important;
  background-position: center !important;
}
.gallery-page .gallery-grid {
  width: min(1500px, calc(100% - 2rem));
  margin-inline: auto;
  padding: 3rem 0 6rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.2rem;
}
.gallery-page .gallery-card {
  position: relative;
  min-height: 270px;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.18);
  background: #0b1730;
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
}
.gallery-page .gallery-card img {
  width: 100%;
  height: 100%;
  min-height: 270px;
  object-fit: cover;
  display: block;
  background: linear-gradient(135deg,#0039a6,#001a4d);
  transition: transform .5s ease;
}
.gallery-page .gallery-card:hover img { transform: scale(1.06); }
.gallery-page .gallery-card::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,transparent 38%,rgba(2,7,18,.92));
}
.gallery-page .gallery-label { position:absolute; z-index:2; left:1rem; right:1rem; bottom:1rem; font-weight:800; color:#fff; }
@media (max-width:1100px){ .gallery-page .gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:760px){ .gallery-page .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .gallery-page .gallery-card,.gallery-page .gallery-card img{min-height:220px;} }
@media (max-width:520px){ .gallery-page .gallery-grid{grid-template-columns:1fr;} .gallery-page .gallery-card,.gallery-page .gallery-card img{min-height:280px;} }

/* Gallery layout is untouched; only label contrast is improved. */
.gallery-page .gallery-label { text-shadow: 0 2px 10px rgba(0,0,0,.95); }


/* ===== AFRICAN VISUAL BALANCE ===== */
/* Saints Hub/gallery: brighter, welcoming presentation. */
body.saints-page .gallery-card,
body.saints-page .gallery-item,
body.saints-page .saints-gallery-card {
  background: #f8fafc;
}

body.saints-page .gallery-card::after,
body.saints-page .gallery-item::after,
body.saints-page .saints-gallery-card::after {
  background: linear-gradient(180deg, transparent 52%, rgba(2,7,18,.72)) !important;
}

body.saints-page .gallery-label,
body.saints-page .gallery-item .label,
body.saints-page .saints-gallery-card .label {
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.9) !important;
}

/* Human and city imagery should remain visible instead of being buried under overlays. */
body.saints-page img {
  filter: saturate(.98) contrast(.98) brightness(1.02);
}

/* City-focused visual treatment: Kampala, Arusha and Kigali can be introduced without changing layout. */
.africa-city-card {
  overflow: hidden;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
}
.africa-city-card img {
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
  display: block;
}
.africa-city-card .city-copy {
  padding: 1rem 1.1rem 1.15rem;
  color: #172033;
}
.africa-city-card .city-copy h3 {
  color: #0039a6;
  margin: 0 0 .35rem;
}
.africa-city-card .city-copy p {
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

/* ===== FINAL PHOTO READABILITY PASS ===== */
/* Do not let global photo backgrounds compete with Saints Hub copy. */
body.saints-page main > section:not(.saints-hero):not(#events) {
  background-image: none !important;
  background-color: #f8fafc !important;
  color: #0f172a !important;
}
body.saints-page main > section.bg-white {
  background-color: #ffffff !important;
}
body.saints-page main > section.bg-slate-950#events {
  background-image: linear-gradient(rgba(2,7,18,.18),rgba(2,7,18,.18)) !important;
}
body.saints-page .saints-hero {
  position: relative;
  isolation: isolate;
  background: #0b1730 !important;
}
body.saints-page .saints-hero-image {
  opacity: 1 !important;
  filter: brightness(1.08) saturate(.96) !important;
}
body.saints-page .saints-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2,12,28,.56) 0%, rgba(2,12,28,.28) 55%, rgba(2,12,28,.12) 100%);
}
body.saints-page .saints-hero-content {
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 10px rgba(0,0,0,.72);
}
body.saints-page .saints-hero-content p,
body.saints-page .saints-hero-content h1 {
  text-shadow: 0 2px 12px rgba(0,0,0,.82), 0 1px 3px rgba(0,0,0,.9);
}

/* Gallery: keep the photographs bright enough that labels can be read instantly. */
body.gallery-page .gallery-hero {
  background-image: linear-gradient(90deg,rgba(2,7,18,.52),rgba(2,7,18,.18)),
    url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=2400&q=85") !important;
}
body.gallery-page .gallery-section {
  background-image: linear-gradient(rgba(3,10,24,.22),rgba(3,10,24,.30)),
    url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2400&q=85") !important;
}
body.gallery-page .gallery-card::after {
  background: linear-gradient(180deg,
    rgba(2,7,18,0) 48%,
    rgba(2,7,18,.18) 68%,
    rgba(2,7,18,.58) 100%) !important;
}
body.gallery-page .gallery-label {
  color: #fff !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.95), 0 0 12px rgba(0,0,0,.55) !important;
  background: rgba(2,7,18,.34);
  border: 1px solid rgba(255,255,255,.24);
  border-radius: .55rem;
  padding: .45rem .65rem;
  backdrop-filter: blur(2px);
}

/* Images themselves should never be darkened by a page-wide image filter. */
body.gallery-page .gallery-card img,
body.saints-page .hub-feature img {
  filter: none !important;
}


/* ===== TEXT MUST ALWAYS WIN OVER PHOTOGRAPHY ===== */
body.gallery-page .gallery-hero .gallery-wrap,
body.gallery-page .gallery-section .gallery-wrap,
body.gallery-page .gallery-card .gallery-label {
  position: relative;
  z-index: 3;
}
body.gallery-page .gallery-label {
  color:#fff !important;
  background:rgba(2,7,18,.78) !important;
  box-shadow:0 4px 18px rgba(0,0,0,.45);
  text-shadow:0 1px 2px rgba(0,0,0,.95) !important;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
body.gallery-page .gallery-card::after {
  background:linear-gradient(to top,rgba(2,7,18,.30),rgba(2,7,18,0) 70%) !important;
}
body.gallery-page .gallery-hero {
  background-image:linear-gradient(90deg,rgba(2,7,18,.38),rgba(2,7,18,.08)) !important;
}
body.gallery-page .gallery-section {
  background-image:linear-gradient(rgba(3,10,24,.08),rgba(3,10,24,.12)) !important;
}

/* Saints Hub hero: darken only behind the words, not the whole photograph. */
body.saints-page .saints-hero-content h1,
body.saints-page .saints-hero-content p {
  width:fit-content;
  max-width:100%;
  background:rgba(2,12,28,.58);
  border-radius:.65rem;
  padding:.28rem .65rem;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  text-shadow:0 2px 5px rgba(0,0,0,.95) !important;
}
body.saints-page .saints-hero-content h1 {
  background:rgba(2,12,28,.64);
}
body.saints-page .saints-hero-content .text-emerald-300 {
  background:rgba(2,12,28,.72);
  padding:.35rem .6rem;
  border-radius:.45rem;
  text-shadow:0 1px 3px rgba(0,0,0,.95);
}


/* ===== FINAL READABILITY: SAINTS HUB + CONTACT HEROES ===== */
/* Keep the photography visible, but give every hero text a guaranteed readable surface. */
body.saints-page .saints-hero-content,
body.contact-page .contact-hero > .contact-fluid-container {
  position: relative;
  z-index: 2;
}
body.saints-page .saints-hero-content > p,
body.saints-page .saints-hero-content > h1,
body.saints-page .saints-hero-content > .saints-hero-actions {
  text-shadow: none !important;
}
body.saints-page .saints-hero-content > p:first-child {
  display: inline-block;
  padding: .45rem .7rem;
  border-radius: .5rem;
  background: rgba(0,0,0,.78) !important;
  color: #6ee7b7 !important;
}
body.saints-page .saints-hero-content > h1 {
  display: block;
  width: fit-content;
  max-width: min(100%, 52rem);
  margin-top: .15rem;
  padding: .55rem .8rem;
  border-radius: .7rem;
  background: rgba(0,0,0,.82) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body.saints-page .saints-hero-content > p:not(:first-child) {
  display: block;
  width: fit-content;
  max-width: min(100%, 44rem);
  padding: .55rem .8rem;
  border-radius: .65rem;
  background: rgba(0,0,0,.78) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Contact hero: do not darken the entire photo; put contrast exactly behind text. */
body.contact-page .contact-hero-backdrop {
  background:
    linear-gradient(90deg, rgba(3,10,24,.38), rgba(0,57,166,.12)),
    url("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=2200&q=85") center / cover no-repeat;
}
body.contact-page .contact-hero .max-w-3xl {
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 1.25rem;
  background: rgba(3,10,24,.84);
  box-shadow: 0 24px 70px rgba(0,0,0,.24);
}
body.contact-page .contact-hero .max-w-3xl > p:first-child {
  display: inline-block;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: #67e8f9 !important;
}
body.contact-page .contact-hero .max-w-3xl > h1 {
  width: auto;
  max-width: 100%;
  margin-top: .25rem;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.32) !important;
}
body.contact-page .contact-hero .max-w-3xl > p:nth-of-type(2) {
  width: auto;
  max-width: 100%;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.45) !important;
}
body.contact-page .contact-hero-fact {
  background: rgba(0,0,0,.76) !important;
  border-color: rgba(255,255,255,.28) !important;
  color: #fff !important;
}
body.contact-page .contact-hero-fact small {
  color: #dbeafe !important;
}


/* ===== SAINTS HUB SECTION READABILITY — NO TEXT ON BUSY PHOTO AREAS ===== */
/* The global interior closing-panel rule was putting a photo behind the final Saints Hub section.
   Keep Saints Hub sections clean and readable instead of placing dark text over photography. */
body.saints-page main > section:last-of-type {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 0 !important;
  background: #f8fafc !important;
  color: #0f172a !important;
}
body.saints-page main > section:last-of-type::before,
body.saints-page main > section:last-of-type::after {
  display: none !important;
}

body:has(> section#home) #home #search-solutions,
body:has(> section#home) #home #search-solutions > span {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body:has(> section#home) #projects .project-card .absolute.bg-emerald-700 {
  background-color: #047857 !important;
  color: #fff !important;
}

body.solution-audience-page[data-solution="schools"] .shero {
  background:
    linear-gradient(110deg, rgba(3, 7, 18, .84), rgba(0, 26, 77, .62)),
    url("/assets/billing/schools-labs.jpg") center 52% / cover no-repeat;
}

body.solution-audience-page[data-solution="hospitality"] .shero {
  background:
    linear-gradient(110deg, rgba(3, 7, 18, .8), rgba(0, 26, 77, .56)),
    url("/assets/billing/guest-wifi.jpg") center 52% / cover no-repeat;
}
body.saints-page main > section:last-of-type h2,
body.saints-page main > section:last-of-type h3,
body.saints-page main > section:last-of-type strong {
  color: #001a4d !important;
  text-shadow: none !important;
}
body.saints-page main > section:last-of-type p,
body.saints-page main > section:last-of-type small {
  color: #475569 !important;
  text-shadow: none !important;
}
body.saints-page main > section:last-of-type .hub-step {
  background: #fff !important;
  border: 1px solid #dbe5f0 !important;
  border-radius: .9rem;
  padding: .9rem 1rem;
  box-shadow: 0 8px 24px rgba(0,26,77,.06);
}
body.saints-page main > section:last-of-type form {
  background: #fff !important;
  color: #0f172a !important;
}

/* Any Saints Hub content that sits on an image must have its own readable surface. */
body.saints-page main section [class*="bg-"],
body.saints-page main section article,
body.saints-page main section .hub-section-heading {
  text-shadow: none;
}
body.saints-page main section article h3,
body.saints-page main section article p,
body.saints-page main section article small,
body.saints-page main section article strong {
  text-shadow: none !important;
}

/* Preserve the intentionally dark Events section, but force all its copy to white/light tones. */
body.saints-page #events,
body.saints-page #events h2,
body.saints-page #events h3,
body.saints-page #events p,
body.saints-page #events span,
body.saints-page #events a {
  text-shadow: none !important;
}
body.saints-page #events h2,
body.saints-page #events h3,
body.saints-page #events p {
  color: #fff !important;
}
body.saints-page #events article {
  background: rgba(0,0,0,.32);
  border-radius: .9rem;
  padding: 1rem;
}


/* ===== SAINTS HUB CONTENT SECTIONS — CLEAR TEXT SURFACES ===== */
/* Keep the Saints Hub HERO exactly as designed. The readability fix applies only below it. */
body.saints-page main > section:not(.saints-hero) {
  background-image: none !important;
  background-color: #f8fafc !important;
  color: #0f172a !important;
}

/* Alternate the existing white sections without changing their layout. */
body.saints-page main > section.bg-white:not(.saints-hero) {
  background-color: #ffffff !important;
}

/* All normal Saints Hub section copy gets a solid, high-contrast text color. */
body.saints-page main > section:not(.saints-hero):not(#events) h2,
body.saints-page main > section:not(.saints-hero):not(#events) h3,
body.saints-page main > section:not(.saints-hero):not(#events) strong {
  color: #001a4d !important;
  text-shadow: none !important;
}

body.saints-page main > section:not(.saints-hero):not(#events) p,
body.saints-page main > section:not(.saints-hero):not(#events) small {
  color: #475569 !important;
  text-shadow: none !important;
}

/* Keep labels/links distinct and readable. */
body.saints-page main > section:not(.saints-hero):not(#events) .text-blue-600,
body.saints-page main > section:not(.saints-hero):not(#events) .text-emerald-700 {
  text-shadow: none !important;
}

body.saints-page main > section:not(.saints-hero):not(#events) .hub-feature,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-program-card,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-project-grid article,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-training-grid article,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-member-list > div,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-compact-form,
body.saints-page main > section:not(.saints-hero):not(#events) .hub-step {
  background: #ffffff !important;
  color: #0f172a !important;
}

/* Forms: labels and fields remain readable on their white surfaces. */
body.saints-page main > section:not(.saints-hero):not(#events) label {
  color: #334155 !important;
}

body.saints-page main > section:not(.saints-hero):not(#events) input,
body.saints-page main > section:not(.saints-hero):not(#events) select,
body.saints-page main > section:not(.saints-hero):not(#events) textarea {
  color: #0f172a !important;
  background: #ffffff !important;
}

/* The Events section is intentionally dark, so its text stays light. */
body.saints-page main > section#events,
body.saints-page main > section#events h2,
body.saints-page main > section#events h3,
body.saints-page main > section#events p,
body.saints-page main > section#events span,
body.saints-page main > section#events a {
  color: #ffffff !important;
  text-shadow: none !important;
}
body.saints-page main > section#events {
  background-color: #020712 !important;
  background-image: none !important;
}


/* ===== SAINTS HUB — KEEP THE PHOTOS, PROTECT THE WORDS ===== */
/* Content sections keep photographic backgrounds, but a soft light veil prevents
   the photograph from competing with the typography. HERO IS NOT TOUCHED. */
body.saints-page main > section:not(.saints-hero) {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background-color: #eef3f8 !important;
  background-image: none !important;
}

body.saints-page main > section:not(.saints-hero)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(248,250,252,.88), rgba(248,250,252,.88)),
    var(--saints-section-photo);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Give each major content area its own photograph. */
body.saints-page main > section:nth-of-type(2) {
  --saints-section-photo: url("https://images.unsplash.com/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#hub-programmes {
  --saints-section-photo: url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#projects {
  --saints-section-photo: url("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#teams {
  --saints-section-photo: url("https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#training {
  --saints-section-photo: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#space-form {
  --saints-section-photo: url("https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section#internships {
  --saints-section-photo: url("https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=2200&q=85");
}
body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) {
  --saints-section-photo: url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=2200&q=85");
}

/* Keep the actual content above the photo veil. */
body.saints-page main > section:not(.saints-hero) > * {
  position: relative;
  z-index: 1;
}

/* White cards stay genuinely white: photography remains visible around them,
   never through the text. */
body.saints-page .hub-feature,
body.saints-page .hub-program-card,
body.saints-page .hub-project-grid article,
body.saints-page .hub-training-grid article,
body.saints-page .hub-member-list > div,
body.saints-page .hub-compact-form,
body.saints-page .hub-step,
body.saints-page #idea-form,
body.saints-page .hub-accepted-list > div {
  background: rgba(255,255,255,.97) !important;
  color: #0f172a !important;
  text-shadow: none !important;
  box-shadow: 0 10px 28px rgba(0,26,77,.10);
}

/* Section headings sit on a clean translucent reading surface rather than
   directly over the photograph. */
body.saints-page .hub-section-heading,
body.saints-page #teams > div:first-child,
body.saints-page #space-form > div:first-child,
body.saints-page #internships > div:first-child {
  background: rgba(255,255,255,.92);
  border-radius: 1rem;
  padding: 1rem 1.15rem;
  box-shadow: 0 8px 24px rgba(0,26,77,.07);
}

body.saints-page main > section:not(.saints-hero):not(#events) h2,
body.saints-page main > section:not(.saints-hero):not(#events) h3,
body.saints-page main > section:not(.saints-hero):not(#events) strong {
  color: #001a4d !important;
  text-shadow: none !important;
}

body.saints-page main > section:not(.saints-hero):not(#events) p,
body.saints-page main > section:not(.saints-hero):not(#events) small,
body.saints-page main > section:not(.saints-hero):not(#events) label {
  color: #475569 !important;
  text-shadow: none !important;
}

/* The Events section remains intentionally dark and is excluded from the
   photographic treatment above. */
body.saints-page main > section#events {
  background-image: none !important;
}


/* ===== SAINTS HUB — PHOTO + READABLE CONTENT (FINAL BALANCE) ===== */
/* Keep real photography in every content section. Contrast is added locally,
   so the image remains visible without making text disappear. */
body.saints-page main > section:not(.saints-hero):not(#events) {
  background-color: #eef3f8 !important;
  background-image: none !important;
  position: relative !important;
  isolation: isolate !important;
}
body.saints-page main > section:not(.saints-hero):not(#events)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.82) 48%, rgba(255,255,255,.68) 100%),
    var(--saints-section-photo);
  background-size: cover;
  background-position: center;
}

/* Stronger, proper photograph for OPPORTUNITIES. */
body.saints-page main > section#internships {
  --saints-section-photo: url("https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=2400&q=88");
}
body.saints-page main > section#internships::before {
  background:
    linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 52%, rgba(255,255,255,.58) 100%),
    var(--saints-section-photo);
  background-size: cover;
  background-position: center;
}

/* Put the Opportunities copy on a clean glass-white reading panel. */
body.saints-page main > section#internships > .max-w-6xl > div:first-child {
  padding: 1.15rem 1.25rem;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 1rem;
  background: rgba(255,255,255,.94);
  box-shadow: 0 12px 32px rgba(0,26,77,.10);
  backdrop-filter: blur(3px);
}
body.saints-page main > section#internships .hub-accepted-list > div {
  background: rgba(255,255,255,.98) !important;
}

/* Keep the other section headings readable without hiding their photographs. */
body.saints-page .hub-section-heading {
  padding: 1rem 1.15rem;
  border-radius: .9rem;
  background: rgba(255,255,255,.90);
  box-shadow: 0 8px 24px rgba(0,26,77,.08);
  backdrop-filter: blur(3px);
}
body.saints-page main > section:not(.saints-hero):not(#events) h2,
body.saints-page main > section:not(.saints-hero):not(#events) h3,
body.saints-page main > section:not(.saints-hero):not(#events) strong {
  color: #001a4d !important;
  text-shadow: none !important;
}
body.saints-page main > section:not(.saints-hero):not(#events) p,
body.saints-page main > section:not(.saints-hero):not(#events) small {
  color: #475569 !important;
  text-shadow: none !important;
}

/* ===== GALLERY — CLEAN CARD TITLES ===== */
/* Keep the photographs bright and let every title sit in a deliberate title bar. */
body.gallery-page .gallery-card {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
}
body.gallery-page .gallery-card::after {
  z-index: 1 !important;
  background: linear-gradient(
    to bottom,
    rgba(2,7,18,0) 45%,
    rgba(2,7,18,.08) 60%,
    rgba(2,7,18,.78) 100%
  ) !important;
}
body.gallery-page .gallery-card img {
  position: relative !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 270px !important;
  object-fit: cover !important;
}
body.gallery-page .gallery-label {
  position: absolute !important;
  z-index: 3 !important;
  left: .85rem !important;
  right: .85rem !important;
  bottom: .85rem !important;
  display: block !important;
  width: auto !important;
  max-width: calc(100% - 1.7rem) !important;
  margin: 0 !important;
  padding: .65rem .8rem !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  border-radius: .65rem !important;
  background: rgba(0,10,28,.82) !important;
  color: #fff !important;
  font: 800 .9rem/1.25 Inter, system-ui, sans-serif !important;
  letter-spacing: .01em;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: left !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.9) !important;
  box-shadow: 0 5px 18px rgba(0,0,0,.30) !important;
  backdrop-filter: blur(4px);
}
@media (max-width: 760px) {
  body.gallery-page .gallery-label {
    left: .65rem !important;
    right: .65rem !important;
    bottom: .65rem !important;
    max-width: calc(100% - 1.3rem) !important;
    padding: .55rem .65rem !important;
    font-size: .82rem !important;
  }
}


/* ===== GLOBAL READABILITY & ACCESSIBILITY — PREMIUM BLUE SYSTEM =====
   Shared across interior pages. Photography stays visible, but typography always wins.
*/
:root {
  --readable-white: #ffffff;
  --readable-blue: #dbeafe;
  --readable-body-on-dark: #f1f5f9;
  --readable-muted-on-dark: #cbd5e1;
  --readable-ink: #0f172a;
  --readable-blue-ink: #001a4d;
}

/* Any major photographic hero gets a stronger 40–70% contrast layer. */
.hero-backdrop,
.shop-hero-image,
.saints-hero-image,
.contact-hero-backdrop,
.gallery-hero {
  isolation: isolate;
}
.hero-backdrop::after,
.shop-hero-image::after,
.saints-hero-image::after,
.contact-hero-backdrop::after,
.gallery-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(2, 7, 18, .72) 0%, rgba(2, 7, 18, .58) 52%, rgba(2, 7, 18, .48) 100%);
}
.hero-backdrop > *,
.shop-hero-image > *,
.saints-hero-image > *,
.contact-hero-backdrop > *,
.gallery-hero > * {
  position: relative;
  z-index: 1;
}

/* Homepage hero: guaranteed contrast while retaining the image. */
body > section#home .hero-backdrop::after {
  background:
    linear-gradient(90deg, rgba(1, 8, 24, .76) 0%, rgba(1, 8, 24, .64) 48%, rgba(1, 8, 24, .54) 100%);
}

/* Hero typography: white/light blue, heavier weights, no faded copy. */
.hero-fullscreen h1,
.hero-fullscreen h2,
.hero-fullscreen h3,
.hero-fullscreen p,
.hero-fullscreen span,
.hero-fullscreen strong,
.hero-fullscreen li,
.shop-hero h1,
.shop-hero h2,
.shop-hero h3,
.shop-hero p,
.shop-hero span,
.shop-hero strong,
.saints-hero h1,
.saints-hero h2,
.saints-hero h3,
.saints-hero p,
.saints-hero span,
.saints-hero strong,
.contact-hero h1,
.contact-hero h2,
.contact-hero h3,
.contact-hero p,
.contact-hero span,
.contact-hero strong,
.gallery-hero h1,
.gallery-hero h2,
.gallery-hero h3,
.gallery-hero p,
.gallery-hero span,
.gallery-hero strong {
  color: var(--readable-white);
  text-shadow: 0 2px 5px rgba(0,0,0,.72);
}

/* Supporting copy should remain bright enough on every photo. */
.hero-fullscreen p,
.shop-hero p,
.saints-hero p,
.contact-hero p,
.gallery-hero p {
  color: var(--readable-body-on-dark);
  font-weight: 500;
  line-height: 1.7;
}

/* Small labels/kickers use light blue rather than low-contrast grey. */
.hero-fullscreen .text-slate-400,
.hero-fullscreen .text-slate-500,
.shop-hero .text-slate-400,
.saints-hero .text-slate-400,
.contact-hero .text-slate-400,
.gallery-hero .text-slate-400 {
  color: var(--readable-blue) !important;
  font-weight: 700;
}

/* Dark/blue sections: never allow Tailwind grey text to become faint. */
section.bg-\[\#020712\],
section.bg-\[\#001a4d\],
section.bg-slate-900,
section.bg-blue-950,
section[class*="bg-[#020"],
section[class*="bg-[#001"] {
  color: var(--readable-body-on-dark);
}
section.bg-\[\#020712\] h1,
section.bg-\[\#020712\] h2,
section.bg-\[\#020712\] h3,
section.bg-\[\#001a4d\] h1,
section.bg-\[\#001a4d\] h2,
section.bg-\[\#001a4d\] h3,
section.bg-slate-900 h1,
section.bg-slate-900 h2,
section.bg-slate-900 h3,
section[class*="bg-[#020"] h1,
section[class*="bg-[#020"] h2,
section[class*="bg-[#020"] h3,
section[class*="bg-[#001"] h1,
section[class*="bg-[#001"] h2,
section[class*="bg-[#001"] h3 {
  color: #fff !important;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(0,0,0,.45);
}
section.bg-\[\#020712\] p,
section.bg-\[\#001a4d\] p,
section.bg-slate-900 p,
section[class*="bg-[#020"] p,
section[class*="bg-[#001"] p {
  color: #e2e8f0 !important;
  font-weight: 500;
  line-height: 1.7;
}

/* Prevent translucent/glass surfaces from making text disappear. */
[class*="bg-white/"],
[class*="bg-black/"],
[class*="bg-slate-"] {
  --tw-prose-body: #0f172a;
}
.glass-card,
[class*="glass"] {
  color: #0f172a;
}
.glass-card h1,
.glass-card h2,
.glass-card h3,
.glass-card strong {
  color: #001a4d;
  font-weight: 800;
}
.glass-card p {
  color: #334155;
  font-weight: 500;
}

/* Interactive controls need a visible keyboard state and readable labels. */
a, button, input, select, textarea {
  font-weight: 500;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid #67e8f9 !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 2px rgba(0,26,77,.9);
}

/* Do not allow tiny muted copy to fall below comfortable readability. */
main p,
main li {
  line-height: 1.6;
}
main small {
  line-height: 1.45;
}
main .text-slate-400 {
  color: #475569;
  font-weight: 600;
}

/* Mobile: strengthen overlays and typography because image/text overlap is tighter. */
@media (max-width: 767px) {
  .hero-backdrop::after,
  .shop-hero-image::after,
  .saints-hero-image::after,
  .contact-hero-backdrop::after,
  .gallery-hero::after {
    background:
      linear-gradient(180deg, rgba(2,7,18,.70) 0%, rgba(2,7,18,.64) 100%);
  }
  .hero-fullscreen p,
  .shop-hero p,
  .saints-hero p,
  .contact-hero p,
  .gallery-hero p {
    font-size: .98rem;
  }
}

/* Respect reduced-motion preferences for accessibility. */
@media (prefers-reduced-motion: reduce) {
  .ambient-light-beam {
    transition: none;
  }
}


/* ===== PHOTO SECTION TEXT VISIBILITY — CONTRAST ONLY =====
   Preserve existing layout, spacing, imagery and card positions.
   The overlay sits above the image and below the existing content. */
.multi-photo-section::after {
  background: rgba(0, 0, 0, 0.55) !important;
  z-index: 0 !important;
}
.multi-photo-section > .max-w-\\[2560px\\],
.multi-photo-section > * {
  position: relative;
  z-index: 1;
}
.multi-photo-section h1,
.multi-photo-section h2,
.multi-photo-section h3,
.multi-photo-section h4 {
  color: #FFFFFF !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.7) !important;
}
.multi-photo-section p,
.multi-photo-section li {
  color: #E5E7EB !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.65) !important;
}
.multi-photo-section .text-slate-400,
.multi-photo-section .text-slate-500,
.multi-photo-section .text-slate-600,
.multi-photo-section .text-slate-700,
.multi-photo-section .text-slate-900 {
  color: #E5E7EB !important;
}

/* Brand photo section uses the same contrast layer without moving its content. */
#brands.brands-corporate::after {
  background: rgba(0, 0, 0, 0.55) !important;
  z-index: 0 !important;
  mask-image: none !important;
}
#brands.brands-corporate > .max-w-\\[2560px\\] {
  position: relative;
  z-index: 1;
}
#brands.brands-corporate h1,
#brands.brands-corporate h2,
#brands.brands-corporate h3,
#brands.brands-corporate h4 {
  color: #FFFFFF !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.7) !important;
}
#brands.brands-corporate p,
#brands.brands-corporate li,
#brands.brands-corporate .text-slate-400,
#brands.brands-corporate .text-slate-500,
#brands.brands-corporate .text-slate-600,
#brands.brands-corporate .text-slate-700 {
  color: #E5E7EB !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.65) !important;
}

/* Keep existing cards themselves unchanged; only text directly on photo sections
   receives the contrast treatment. */
.multi-photo-section .bg-white h1,
.multi-photo-section .bg-white h2,
.multi-photo-section .bg-white h3,
.multi-photo-section .bg-white h4,
.multi-photo-section .bg-white p,
.multi-photo-section .bg-white li,
.multi-photo-section .bg-slate-50 h1,
.multi-photo-section .bg-slate-50 h2,
.multi-photo-section .bg-slate-50 h3,
.multi-photo-section .bg-slate-50 h4,
.multi-photo-section .bg-slate-50 p,
.multi-photo-section .bg-slate-50 li {
  text-shadow: none !important;
}



/* ===== BILLING TEXT CONTRAST — CORRECT TARGET =====
   The billing page has light sections after the hero. Do not make those sections
   white-text on white backgrounds. Keep their existing surfaces and layout;
   only use a clean navy/slate text palette. Photo/dark sections keep light text. */
body:has(#story) main > section#story h1,
body:has(#story) main > section#story h2,
body:has(#story) main > section#story h3,
body:has(#story) main > section#features h1,
body:has(#story) main > section#features h2,
body:has(#story) main > section#features h3,
body:has(#story) main > section#pricing h1,
body:has(#story) main > section#pricing h2,
body:has(#story) main > section#pricing h3,
body:has(#story) main > section#pricing h4,
body:has(#story) main > section#story .section-title {
  color: #12395b !important;
  text-shadow: none !important;
}

body:has(#story) main > section#story p,
body:has(#story) main > section#story li,
body:has(#story) main > section#features p,
body:has(#story) main > section#features li,
body:has(#story) main > section#pricing p,
body:has(#story) main > section#pricing li {
  color: #475569 !important;
  text-shadow: none !important;
}

body:has(#story) main > section#story .text-slate-400,
body:has(#story) main > section#features .text-slate-400,
body:has(#story) main > section#pricing .text-slate-400,
body:has(#story) main > section#pricing .text-slate-500 {
  color: #64748b !important;
}

/* Existing white cards: readable text, no card redesign. */
body:has(#story) main > section#story .bg-white h1,
body:has(#story) main > section#story .bg-white h2,
body:has(#story) main > section#story .bg-white h3,
body:has(#story) main > section#story .bg-white p,
body:has(#story) main > section#story .bg-white li,
body:has(#story) main > section#features .bg-white h1,
body:has(#story) main > section#features .bg-white h2,
body:has(#story) main > section#features .bg-white h3,
body:has(#story) main > section#features .bg-white p,
body:has(#story) main > section#features .bg-white li,
body:has(#story) main > section#pricing .bg-white h1,
body:has(#story) main > section#pricing .bg-white h2,
body:has(#story) main > section#pricing .bg-white h3,
body:has(#story) main > section#pricing .bg-white h4,
body:has(#story) main > section#pricing .bg-white p,
body:has(#story) main > section#pricing .bg-white li {
  color: #12395b !important;
  text-shadow: none !important;
}

/* Dark live-screen section: keep the existing dark design and make its text light. */
body:has(#story) main > section#live-screen h1,
body:has(#story) main > section#live-screen h2,
body:has(#story) main > section#live-screen h3,
body:has(#story) main > section#live-screen h4,
body:has(#story) main > section#live-screen td,
body:has(#story) main > section#live-screen span {
  color: #ffffff !important;
}
body:has(#story) main > section#live-screen p,
body:has(#story) main > section#live-screen li,
body:has(#story) main > section#live-screen th {
  color: #e5e7eb !important;
}

/* Standalone pricing comparison/add-on content: same readable palette. */
body:has(#story) .billing-compare-wrap h1,
body:has(#story) .billing-compare-wrap h2,
body:has(#story) .billing-compare-wrap h3,
body:has(#story) .billing-addons h1,
body:has(#story) .billing-addons h2,
body:has(#story) .billing-addons h3,
body:has(#story) .billing-addon-card h4 {
  color: #12395b !important;
}
body:has(#story) .billing-compare-wrap,
body:has(#story) .billing-compare-note,
body:has(#story) .billing-addon-card p {
  color: #475569 !important;
}



/* ===== FINAL PHOTO TEXT VISIBILITY — TEXT ABOVE IMAGE ===== */
/* ONLY contrast: do not alter layout, spacing, cards, imagery, or typography sizes. */
.multi-photo-section,
#brands.brands-corporate {
  isolation: isolate !important;
}

/* Darken the photograph first. Content stays above it. */
.multi-photo-section::after,
#brands.brands-corporate::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: rgba(0,0,0,.55) !important;
  mask-image: none !important;
}

.multi-photo-section > *,
#brands.brands-corporate > * {
  position: relative !important;
  z-index: 2 !important;
}

/* Every word directly over the photograph is bright — including spans,
   labels, links and small text that Tailwind may otherwise make dark grey. */
.multi-photo-section h1,
.multi-photo-section h2,
.multi-photo-section h3,
.multi-photo-section h4,
.multi-photo-section h5,
.multi-photo-section h6,
.multi-photo-section p,
.multi-photo-section li,
.multi-photo-section span,
.multi-photo-section strong,
.multi-photo-section small,
.multi-photo-section label,
.multi-photo-section a,
#brands.brands-corporate h1,
#brands.brands-corporate h2,
#brands.brands-corporate h3,
#brands.brands-corporate h4,
#brands.brands-corporate h5,
#brands.brands-corporate h6,
#brands.brands-corporate p,
#brands.brands-corporate li,
#brands.brands-corporate span,
#brands.brands-corporate strong,
#brands.brands-corporate small,
#brands.brands-corporate label,
#brands.brands-corporate a {
  color: #FFFFFF !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.78) !important;
}

.multi-photo-section p,
.multi-photo-section li,
.multi-photo-section small,
.multi-photo-section label,
#brands.brands-corporate p,
#brands.brands-corporate li,
#brands.brands-corporate small,
#brands.brands-corporate label {
  color: #E5E7EB !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.78) !important;
}

/* Preserve readable text inside deliberately light cards. */
.multi-photo-section .bg-white h1,
.multi-photo-section .bg-white h2,
.multi-photo-section .bg-white h3,
.multi-photo-section .bg-white h4,
.multi-photo-section .bg-white p,
.multi-photo-section .bg-white li,
.multi-photo-section .bg-white span,
.multi-photo-section .bg-white strong,
.multi-photo-section .bg-white small,
.multi-photo-section .bg-slate-50 h1,
.multi-photo-section .bg-slate-50 h2,
.multi-photo-section .bg-slate-50 h3,
.multi-photo-section .bg-slate-50 h4,
.multi-photo-section .bg-slate-50 p,
.multi-photo-section .bg-slate-50 li,
.multi-photo-section .bg-slate-50 span,
.multi-photo-section .bg-slate-50 strong,
.multi-photo-section .bg-slate-50 small {
  color: #001A4D !important;
  text-shadow: none !important;
}
.multi-photo-section .bg-white p,
.multi-photo-section .bg-white li,
.multi-photo-section .bg-white small,
.multi-photo-section .bg-slate-50 p,
.multi-photo-section .bg-slate-50 li,
.multi-photo-section .bg-slate-50 small {
  color: #334155 !important;
}


/* ===== BILLING READABILITY FINAL — FIX DARK TEXT ON DARK SURFACES =====
   Keep the existing billing layout and surfaces. Only correct text contrast. */
body:has(#story) main > section#story .section-title,
body:has(#story) main > section#features .section-title,
body:has(#story) main > section#pricing .section-title,
body:has(#story) main > section#story p,
body:has(#story) main > section#features > .site-container > p,
body:has(#story) main > section#pricing > .site-container > p {
  color: #0039A6 !important;
  text-shadow: none !important;
}

body:has(#story) main > section#story > .site-container > .text-xs,
body:has(#story) main > section#features > .site-container > .text-xs,
body:has(#story) main > section#pricing > .site-container > .text-xs {
  color: #0052CC !important;
}

/* Dark-theme/accessibility mode: never leave dark-blue words on a dark surface. */
body.theme-dark:has(#story) main > section#story .section-title,
body.theme-dark:has(#story) main > section#features .section-title,
body.theme-dark:has(#story) main > section#pricing .section-title,
body.theme-dark:has(#story) main > section#story p,
body.theme-dark:has(#story) main > section#features > .site-container > p,
body.theme-dark:has(#story) main > section#pricing > .site-container > p,
body.theme-dark:has(#story) main > section#story .text-xs,
body.theme-dark:has(#story) main > section#features .text-xs,
body.theme-dark:has(#story) main > section#pricing .text-xs {
  color: #FFFFFF !important;
  text-shadow: 0 2px 5px rgba(0,0,0,.75) !important;
}

body.theme-dark:has(#story) main > section#story .bg-white h3,
body.theme-dark:has(#story) main > section#story .bg-white p,
body.theme-dark:has(#story) main > section#features .bg-white h3,
body.theme-dark:has(#story) main > section#features .bg-white p,
body.theme-dark:has(#story) main > section#pricing .bg-white h3,
body.theme-dark:has(#story) main > section#pricing .bg-white p,
body.theme-dark:has(#story) .billing-addon-card h4,
body.theme-dark:has(#story) .billing-addon-card p {
  color: #FFFFFF !important;
}


/* ===== TEXT VISIBILITY FIX — CONTRAST ONLY =====
   Do not redesign. Do not move anything. Put existing content above photo overlays. */
.multi-photo-section,#brands.brands-corporate{position:relative!important;isolation:isolate!important}
.multi-photo-section::before,#brands.brands-corporate::before{z-index:-2!important}
.multi-photo-section::after,#brands.brands-corporate::after{z-index:-1!important;background:rgba(0,0,0,.55)!important}
.multi-photo-section>.max-w-\\[2560px\\],#brands.brands-corporate>.max-w-\\[2560px\\]{position:relative!important;z-index:1!important}
.multi-photo-section h1,.multi-photo-section h2,.multi-photo-section h3,.multi-photo-section h4,
.multi-photo-section p,.multi-photo-section li,.multi-photo-section span,.multi-photo-section strong,.multi-photo-section small,.multi-photo-section label,.multi-photo-section a,
#brands.brands-corporate h1,#brands.brands-corporate h2,#brands.brands-corporate h3,#brands.brands-corporate h4,
#brands.brands-corporate p,#brands.brands-corporate li,#brands.brands-corporate span,#brands.brands-corporate strong,#brands.brands-corporate small,#brands.brands-corporate label,#brands.brands-corporate a{color:#fff!important;text-shadow:0 2px 5px rgba(0,0,0,.8)!important}
.multi-photo-section p,.multi-photo-section li,.multi-photo-section small,.multi-photo-section label,#brands.brands-corporate p,#brands.brands-corporate li,#brands.brands-corporate small,#brands.brands-corporate label{color:#e5e7eb!important}
.multi-photo-section .bg-white h1,.multi-photo-section .bg-white h2,.multi-photo-section .bg-white h3,.multi-photo-section .bg-white h4,.multi-photo-section .bg-white p,.multi-photo-section .bg-white li,.multi-photo-section .bg-white span,.multi-photo-section .bg-white strong,.multi-photo-section .bg-white small,.multi-photo-section .bg-slate-50 h1,.multi-photo-section .bg-slate-50 h2,.multi-photo-section .bg-slate-50 h3,.multi-photo-section .bg-slate-50 h4,.multi-photo-section .bg-slate-50 p,.multi-photo-section .bg-slate-50 li,.multi-photo-section .bg-slate-50 span,.multi-photo-section .bg-slate-50 strong,.multi-photo-section .bg-slate-50 small{color:#001a4d!important;text-shadow:none!important}
.multi-photo-section .bg-white p,.multi-photo-section .bg-white li,.multi-photo-section .bg-white small,.multi-photo-section .bg-slate-50 p,.multi-photo-section .bg-slate-50 li,.multi-photo-section .bg-slate-50 small{color:#334155!important}

/* Billing: text contrast only, including all sections after the hero. */
body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) h1,body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) h2,body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) h3,body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) h4{color:#0039a6!important;text-shadow:none!important}
body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) p,body:has(#story) main>section:not(#live-screen):not(.billing-hero-v2) li{color:#334155!important;text-shadow:none!important}
body:has(#story) main>section#live-screen h1,body:has(#story) main>section#live-screen h2,body:has(#story) main>section#live-screen h3,body:has(#story) main>section#live-screen h4,body:has(#story) main>section#live-screen span{color:#fff!important}
body:has(#story) main>section#live-screen p,body:has(#story) main>section#live-screen li,body:has(#story) main>section#live-screen th{color:#e5e7eb!important}
body:has(#story) main>section.bg-slate-900 h1,body:has(#story) main>section.bg-slate-900 h2,body:has(#story) main>section.bg-slate-900 h3,body:has(#story) main>section.bg-slate-900 h4,body:has(#story) main>section.bg-slate-900 p,body:has(#story) main>section.bg-slate-900 li{color:#fff!important;text-shadow:0 2px 5px rgba(0,0,0,.8)!important}

/* Preserve readable foregrounds on dark billing cards and glass panels. */
body:has(#story) main > section:not(#live-screen):not(.billing-hero-v2) .bg-slate-900 :is(h1, h2, h3, h4, .text-slate-900, .text-blue-600) {
  color: #f8fafc !important;
  text-shadow: none !important;
}
body:has(#story) main > section:not(#live-screen):not(.billing-hero-v2) .bg-slate-900 :is(p, li, .text-slate-500, .text-slate-600, .text-slate-700) {
  color: #cbd5e1 !important;
  text-shadow: none !important;
}

/* White action pills sit on photo sections; keep their labels dark and their
   colored calls to action white even when the section's copy is restyled. */
.multi-photo-section :is(a, button, span)[class*="bg-white"],
.multi-photo-section :is(a, button, span)[class*="bg-slate-50"] {
  color: #0039a6 !important;
  text-shadow: none !important;
}
.multi-photo-section :is(a, button)[class*="bg-blue-"],
.multi-photo-section :is(a, button)[class*="bg-emerald-"],
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button)[class*="bg-blue-"],
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button)[class*="bg-emerald-"] {
  color: #fff !important;
  text-shadow: none !important;
}


/* UI restoration: keep the shared footer readable while bringing back its image treatment. */
.footer-photo {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(105deg, rgba(0, 12, 35, .94), rgba(0, 26, 77, .78)),
    url("/assets/billing/cafe-management.jpg") center / cover no-repeat !important;
}
.footer-photo::before {
  content: "";
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(115deg, rgba(0, 26, 77, .42), rgba(0, 4, 18, .66)),
    url("/assets/billing/print-shops.jpg") center / cover no-repeat;
  opacity: .78;
  pointer-events: none;
}
.footer-photo::after {
  content: "";
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(0, 26, 77, .12), rgba(1, 4, 10, .78));
  pointer-events: none;
}
.footer-photo > .max-w-\[2560px\] {
  position: relative;
  z-index: 1;
}
.footer-photo a:focus-visible,
.footer-photo button:focus-visible {
  outline-color: #67e8f9;
}

/* Shared finishing layer: stronger reading rhythm, reliable contrast and clear controls. */
:root {
  --site-ink: #10233f;
  --site-muted: #45566f;
  --site-blue: #0039a6;
  --site-navy: #001a4d;
}

html {
  scroll-padding-top: 5.5rem;
}

body {
  color: var(--site-ink);
  font-size: clamp(1rem, .18vw + .96rem, 1.125rem);
  line-height: 1.65;
}

main h1,
main h2,
main h3 {
  text-wrap: balance;
}

main p,
main li {
  text-wrap: pretty;
}

main p {
  line-height: 1.7;
}

main :is(input, select, textarea, button, a) {
  scroll-margin-block: 5.5rem;
}

/* Keep the shared navigation compact and consistent on desktop and mobile. */
.navbar-glass {
  z-index: 100;
  background: rgba(255, 255, 255, .98);
  border-bottom: 1px solid #dce5f2;
  box-shadow: 0 6px 22px rgba(16, 35, 63, .09);
  transition: background-color .2s ease, box-shadow .2s ease;
}

.navbar-glass.scrolled {
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 35, 63, .14);
}

.navbar-glass > div:first-child {
  min-height: 4.5rem;
  height: auto;
  gap: 1rem;
}

.navbar-glass nav {
  align-items: center;
  gap: clamp(.45rem, .8vw, 1rem);
  color: var(--site-ink);
}

.navbar-glass nav.space-x-8 > :not([hidden]) ~ :not([hidden]) {
  margin-left: 0 !important;
}

.navbar-glass nav .relative.group > button,
.navbar-glass nav > a:not(.nav-primary-extra) {
  min-height: 2.75rem;
  padding: .6rem .55rem;
  border-radius: .6rem;
  color: #20334e;
  font-size: .9rem;
  font-weight: 700;
  transition: color .18s ease, background-color .18s ease;
}

.navbar-glass nav .relative.group > button:hover,
.navbar-glass nav > a:not(.nav-primary-extra):hover,
.navbar-glass nav .relative.group > button[aria-expanded="true"] {
  color: var(--site-blue);
  background: #edf4ff;
}

.navbar-glass .nav-primary-extra {
  min-height: 2.75rem;
  padding: .65rem 1rem;
  border: 1px solid var(--site-blue);
  border-radius: .7rem;
  background: var(--site-blue);
  box-shadow: 0 4px 12px rgba(0, 57, 166, .18);
  color: #fff;
  font-size: .88rem;
  transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.navbar-glass .nav-primary-extra:hover,
.navbar-glass .nav-primary-extra:focus-visible {
  background: #002d82;
  box-shadow: 0 7px 16px rgba(0, 57, 166, .24);
  color: #fff;
  transform: translateY(-1px);
}

.navbar-glass .nav-dropdown {
  z-index: 120;
  border: 1px solid #d8e2f0;
  border-radius: .9rem;
  background: #fff;
  box-shadow: 0 18px 42px rgba(16, 35, 63, .18);
  color: var(--site-ink);
}

.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) {
  width: min(20rem, calc(100vw - 2rem));
  min-width: min(18rem, calc(100vw - 2rem));
  max-height: min(75vh, 38rem);
  overflow-y: auto;
}

.navbar-glass .nav-dropdown a {
  min-height: 2.75rem;
  align-items: center;
  border-radius: .55rem;
  color: #263c58 !important;
  font-size: .84rem;
  line-height: 1.4;
}

.navbar-glass .nav-dropdown a:hover,
.navbar-glass .nav-dropdown a:focus-visible {
  background: #edf4ff !important;
  color: var(--site-blue) !important;
}

.navbar-glass .nav-mega-dropdown {
  width: min(54rem, calc(100vw - 3rem)) !important;
  max-height: min(78vh, 44rem);
  overflow-y: auto;
  padding: 1rem !important;
}

#mobile-menu {
  z-index: 110;
  border-color: #dce5f2;
  background: #fff;
  box-shadow: 0 18px 36px rgba(16, 35, 63, .16);
  padding: .75rem clamp(1rem, 4vw, 2rem) 1.25rem;
}

#mobile-menu > a {
  min-height: 2.9rem;
  display: flex;
  align-items: center;
  border-radius: .65rem;
  color: #20334e;
  font-size: .95rem;
  font-weight: 700;
}

#mobile-menu > a:hover,
#mobile-menu > a:focus-visible {
  background: #edf4ff;
  color: var(--site-blue);
}

.mobile-nav-group {
  padding-top: .55rem;
  border-color: #e1e9f4;
}

.mobile-nav-group-toggle {
  min-height: 2.9rem;
  padding: .6rem .25rem;
  color: #20334e;
  font-size: .98rem;
}

.mobile-nav-submenu {
  max-height: min(55vh, 25rem);
  padding: .45rem;
  border-color: #dce5f2;
  background: #f6f9fe;
}

.mobile-nav-submenu > .nav-dropdown {
  position: static;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100% !important;
  min-width: 0 !important;
  max-height: none;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  overflow: visible;
  pointer-events: auto;
  transform: none;
  visibility: visible;
}

.mobile-nav-submenu > .nav-mega-dropdown {
  grid-template-columns: minmax(0, 1fr);
}

.mobile-nav-submenu .nav-mega-dropdown > a,
.mobile-nav-submenu .nav-mega-dropdown > div {
  grid-column: auto;
}

.navbar-glass [data-mobile-menu-toggle] {
  display: inline-flex;
  min-width: 2.75rem;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid #d6e0ee;
  background: #f3f7fc;
}

@media (max-width: 1023px) {
  .navbar-glass .nav-actions > .contact-icon {
    display: none;
  }

  .navbar-glass #mobile-menu {
    position: absolute;
    inset: 100% 0 auto;
    max-height: calc(100svh - 4.5rem);
    overflow-y: auto;
  }
}

@media (max-width: 639px) {
  .navbar-glass > div:first-child {
    min-height: 4rem;
    padding-inline: .75rem;
  }

  .navbar-glass .logo-shine {
    max-width: 48vw;
  }

  .navbar-glass .logo-shine [data-supplied-logo] {
    width: min(43vw, 10rem);
  }

  .navbar-glass .nav-a11y-trigger {
    min-height: 2.65rem;
  }
}

/* Give compact interior pages the same crisp, readable finish as the home page. */
.detail-hero h1 {
  max-width: 16ch;
  line-height: 1.03;
}

.detail-hero p,
.detail-cta p {
  color: #e6eef8;
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  line-height: 1.75;
}

/* Keep the restored homepage on its September 24 image treatment. */
body:has(> section#home) > #home::before,
body:has(> section#home) > #home .hero-backdrop::before,
body:has(> section#home) > #home .hero-backdrop::after {
  content: none !important;
  display: none !important;
}

body:has(> section#home) > #home .hero-image-overlay {
  background: linear-gradient(
    135deg,
    rgba(3, 7, 18, .75) 0%,
    rgba(0, 57, 166, .5) 50%,
    rgba(3, 7, 18, .4) 100%
  ) !important;
}

body:has(> section#home) > #home > .hero-backdrop {
  z-index: 0 !important;
}

body:has(> section#home) > #home > .hero-content-shell {
  position: relative;
  z-index: 2;
}

body:has(> section#home) .multi-photo-section::after {
  z-index: -1 !important;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, .74),
    rgba(255, 255, 255, .86)
  ) !important;
  mix-blend-mode: normal !important;
}

body:has(> section#home) > section {
  border-block-width: 0 !important;
}

body:has(> section#home) > section:not(.multi-photo-section):not(.brands-corporate):not(.contact-corporate):not(.saints-analytics)::before {
  content: none !important;
  display: none !important;
}

body:has(> section#home) > section::before {
  content: none !important;
  display: none !important;
  height: 0 !important;
  background: none !important;
}

body:has(> section#home) #projects > div > div:first-child,
body:has(> section#home) #blog > div > div:first-child,
body:has(> section#home) #divisions > div > div:first-child {
  border-bottom: 0 !important;
}

body:has(> section#home) #about-company.multi-photo-section,
body:has(> section#home) .who-we-are.multi-photo-section,
body:has(> section#home) .multi-photo-section.bg-white {
  background-color: #fff !important;
}

body:has(> section#home) .multi-photo-section.bg-slate-50 {
  background-color: #f8fafc !important;
}

body:has(> section#home) #about-company.multi-photo-section::before,
body:has(> section#home) #divisions.multi-photo-section::before,
body:has(> section#home) #projects.multi-photo-section::before,
body:has(> section#home) #blog.multi-photo-section::before,
body:has(> section#home) #how-we-work.multi-photo-section::before,
body:has(> section#home) #client-notes.multi-photo-section::before,
body:has(> section#home) #partners.multi-photo-section::before,
body:has(> section#home) #about.multi-photo-section::before,
body:has(> section#home) .who-we-are.multi-photo-section::before,
body:has(> section#home) .position-statement.multi-photo-section::before {
  display: block !important;
  z-index: -2 !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important;
  height: auto !important;
}

body:has(> section#home) #about-company.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .42 !important;
}

body:has(> section#home) #divisions.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .42 !important;
}

body:has(> section#home) #projects.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1504384308090-c894fdcc538d?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .38 !important;
}

body:has(> section#home) #blog.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1523731407965-2430cd12f5e4?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .34 !important;
}

body:has(> section#home) #how-we-work.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .4 !important;
}

body:has(> section#home) #client-notes.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .38 !important;
}

body:has(> section#home) #partners.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-129418cb2dfe?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .3 !important;
}

body:has(> section#home) #about.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .42 !important;
}

body:has(> section#home) .who-we-are.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: .38 !important;
}

body:has(> section#home) .position-statement.multi-photo-section::before {
  background-image:
    linear-gradient(112deg, rgba(3, 7, 18, .86), rgba(0, 57, 166, .68)),
    url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1600&q=85") !important;
  opacity: 1 !important;
}

body:has(> section#home) .who-we-are.multi-photo-section::after {
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, .74),
    rgba(255, 255, 255, .84)
  ) !important;
}

body:has(> section#home) .position-statement.multi-photo-section::after {
  background: radial-gradient(
    circle at 84% 18%,
    rgba(16, 185, 129, .16),
    transparent 34%
  ) !important;
}

body:has(> section#home) .position-statement.multi-photo-section {
  background-color: #06142f !important;
  color: #fff !important;
}

/* The shared photo-readability layer makes homepage copy white; these sections
   have light overlays, so use dark text to keep the words readable. */
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(
  h1, h2, h3, h4, h5, h6, p, li, small, label, strong, span,
  a:not([class*="bg-"])
) {
  color: #1e293b !important;
  text-shadow: none !important;
}

body:has(> section#home) .multi-photo-section:not(.position-statement) :is(
  .text-white, .text-white\/80, .text-white\/70, .text-white\/60,
  .text-slate-400, .text-slate-500, .text-slate-600, .text-slate-700,
  .text-slate-900
) {
  color: #334155 !important;
  text-shadow: none !important;
}

body:has(> section#home) #about.multi-photo-section::after {
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, .78),
    rgba(255, 255, 255, .9)
  ) !important;
}

body:has(> section#home) #home .glass-card :is(
  p, label, .text-slate-500, .text-slate-900, span
) {
  color: #334155 !important;
  text-shadow: none !important;
}

body:has(> section#home) #home .glass-card :is(h1, h2, h3, h4, strong) {
  color: #001a4d !important;
  text-shadow: none !important;
}

body:has(> section#home) #home .glass-card label {
  color: #475569 !important;
}

body:has(> section#home) #home .glass-card :is(input, select, option) {
  color: #0f172a !important;
}

body:has(> section#home) #contact > div > .grid > div:first-child {
  padding: clamp(1.25rem, 2.4vw, 2rem);
  border: 1px solid rgba(191, 219, 254, .3);
  border-radius: 1rem;
  background: rgba(0, 18, 52, .9);
  box-shadow: 0 18px 45px rgba(0, 12, 35, .24);
}

body:has(> section#home) #contact > div > .grid > div:first-child :is(
  h2, .text-slate-600, .text-slate-900, .text-slate-500
) {
  color: #fff !important;
  text-shadow: none !important;
}

body:has(> section#home) #contact > div > .grid > div:first-child .text-slate-500 {
  color: #bfdbfe !important;
}

body:has(> section#home) #contact > div > .grid > div:first-child > div:first-child {
  color: #bfdbfe !important;
}

body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button)[class*="bg-blue-"],
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button)[class*="bg-emerald-"] {
  color: #fff !important;
  text-shadow: none !important;
}
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button, span)[class*="bg-white"],
body:has(> section#home) .multi-photo-section:not(.position-statement) :is(a, button, span)[class*="bg-slate-50"] {
  color: #0039a6 !important;
  text-shadow: none !important;
}

.detail-section {
  background: #f3f7fc;
}

.info-card {
  border-color: #dbe5f1;
  border-radius: 1rem;
  box-shadow: 0 5px 18px rgba(16, 35, 63, .05);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.info-card:hover,
.info-card:focus-visible {
  border-color: #83a9e8;
  box-shadow: 0 14px 30px rgba(16, 35, 63, .12);
  transform: translateY(-3px);
}

.info-card p {
  color: #45566f;
  font-size: .95rem;
  line-height: 1.65;
}

.info-card b {
  font-size: .88rem;
}

body.theme-dark {
  background-color: #071326 !important;
  background-image: none !important;
  color: #edf4ff !important;
}

body.theme-dark #navbar,
body.theme-dark #mobile-menu,
body.theme-dark .nav-dropdown,
body.theme-dark .nav-mega-dropdown {
  border-color: #29415e;
  background-color: #0d2039 !important;
  color: #edf4ff !important;
}

body.theme-dark .navbar-glass nav .relative.group > button,
body.theme-dark .navbar-glass nav > a:not(.nav-primary-extra),
body.theme-dark .mobile-nav-group-toggle,
body.theme-dark #mobile-menu > a,
body.theme-dark .nav-dropdown a {
  color: #edf4ff !important;
}

body.theme-dark .navbar-glass nav .relative.group > button:hover,
body.theme-dark .navbar-glass nav > a:not(.nav-primary-extra):hover,
body.theme-dark #mobile-menu > a:hover,
body.theme-dark .nav-dropdown a:hover {
  background: #19375b !important;
  color: #b8d6ff !important;
}

body.theme-dark .mobile-nav-submenu {
  border-color: #29415e;
  background: #091a30;
}

body.theme-dark .detail-section,
body.theme-dark .info-card {
  border-color: #29415e;
  background: #0d2039 !important;
  color: #edf4ff;
}

body.theme-dark .info-card p {
  color: #c4d1e1;
}

body.theme-dark .info-card h2 {
  color: #f4f8ff;
}

@media (prefers-reduced-motion: reduce) {
  .info-card,
  .navbar-glass .nav-primary-extra {
    transition: none;
  }

  .info-card:hover,
  .info-card:focus-visible,
  .navbar-glass .nav-primary-extra:hover {
    transform: none;
    }
}

/* Homepage section photos belong to the section surface, not the global
     section::before decoration. This prevents a hairline from appearing between
     adjacent section backgrounds. */
body:has(> section#home) > section::before {
    content: none !important;
    display: none !important;
}

body:has(> section#home) > section {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body:has(> section#home) > section::before {
    content: none !important;
    display: none !important;
    height: 0 !important;
    background: none !important;
}

body:has(> section#home) .multi-photo-section::after {
    background: none !important;
}

body:has(> section#home) #divisions {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #projects {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1504384308090-c894fdcc538d?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #blog {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1523731407965-2430cd12f5e4?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #how-we-work {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #client-notes {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #about {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #about-company {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) > section.who-we-are {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) > section.position-statement {
    background:
      linear-gradient(112deg, rgba(3, 7, 18, .86), rgba(0, 57, 166, .68)),
      url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #partners {
    background:
      linear-gradient(110deg, rgba(248, 250, 252, .68), rgba(255, 255, 255, .76)),
      url("https://images.unsplash.com/photo-1556761175-129418cb2dfe?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #smas {
    background:
      linear-gradient(110deg, rgba(1, 24, 61, .96), rgba(3, 27, 69, .86) 54%, rgba(0, 48, 94, .78)),
      url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #brands {
    background:
      linear-gradient(115deg, rgba(0, 17, 55, .96), rgba(0, 26, 77, .9) 48%, rgba(0, 26, 77, .72)),
      url("https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(> section#home) #contact {
    background:
      linear-gradient(90deg, rgba(3, 10, 24, .52), rgba(3, 10, 24, .28) 45%, rgba(0, 26, 77, .42)),
      url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2200&q=85")
      center / cover no-repeat !important;
}

#solutions-for-work {
  isolation: isolate;
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .48), rgba(255, 255, 255, .62)),
    url("https://images.unsplash.com/photo-1497366216548-37526070297c?auto=format&fit=crop&w=1800&q=85")
      center / cover no-repeat,
    #f8fafc;
  color: #001a4d;
}

#solutions-for-work .homepage-solutions__inner {
  position: relative;
  z-index: 1;
}

#solutions-for-work .homepage-solutions__eyebrow,
#platform-capabilities .homepage-platform__eyebrow {
  color: #047857;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.4;
  text-transform: uppercase;
}

#solutions-for-work h2,
#solutions-for-work .homepage-solutions__intro {
  color: #001a4d;
}

#solutions-for-work .homepage-solutions__intro,
#platform-capabilities .homepage-platform__intro {
  max-width: 68ch;
}

.homepage-solution-card,
.homepage-capability-card {
  display: flex;
  min-height: 18rem;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 1.15rem;
  overflow: hidden;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.homepage-solution-card {
  border: 1px solid rgba(191, 219, 254, .6);
  background: #fff;
  box-shadow: 0 14px 35px rgba(0, 14, 48, .2);
  color: #001a4d;
}

.homepage-solution-card__image,
.homepage-capability-card__image {
  display: block;
  width: 100%;
  height: clamp(8rem, 12vw, 10rem);
  overflow: hidden;
  background: #0b2852;
}

.homepage-solution-card__image img,
.homepage-capability-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .65s cubic-bezier(.16, 1, .3, 1);
}

.homepage-solution-card__content,
.homepage-capability-card__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: clamp(1.25rem, 2vw, 1.7rem);
}

.homepage-solution-card__label {
  margin-bottom: 1rem;
  color: #00664f;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.homepage-solution-card h3,
.homepage-capability-card h3 {
  margin: 0 0 .8rem;
  color: #001a4d;
  font-size: clamp(1.2rem, 1.55vw, 1.55rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.18;
}

.homepage-solution-card p,
.homepage-capability-card p {
  margin: 0 0 1.6rem;
  color: #263f63;
  font-size: .96rem;
  line-height: 1.65;
}

.homepage-solution-card__cta,
.homepage-capability-card__cta {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-top: auto;
  font-size: .9rem;
  font-weight: 800;
}

.homepage-solution-card__cta {
  color: #0052cc;
}

.homepage-solution-card--community {
  border-color: rgba(110, 231, 183, .7);
  background: #eafff5;
}

#platform-capabilities {
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, .64)),
    url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=1800&q=85")
      center / cover no-repeat,
    #fff;
  color: #001a4d;
}

#platform-capabilities .homepage-platform__eyebrow {
  color: #00664f;
}

#platform-capabilities h2 {
  color: #001a4d;
}

#platform-capabilities .homepage-platform__intro {
  color: #263f63;
}

.homepage-capability-card {
  border: 1px solid #b8d8f5;
  border-bottom: 4px solid #00a3ff;
  background: #fff;
  box-shadow: 0 12px 28px rgba(0, 57, 166, .09);
}

.homepage-capability-card__content {
  min-height: 15rem;
}

.homepage-capability-card:nth-child(2) {
  border-bottom-color: #10b981;
}

.homepage-capability-card:nth-child(3) {
  border-bottom-color: #0052cc;
}

.homepage-capability-card:nth-child(4) {
  border-bottom-color: #f59e0b;
}

.homepage-capability-card__number {
  margin-bottom: 1.35rem;
  color: #00664f;
  font-family: "JetBrains Mono", monospace;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
}

.homepage-capability-card__cta {
  color: #0052cc;
}

.homepage-solution-card:hover,
.homepage-capability-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 38px rgba(0, 26, 77, .2);
}

.homepage-solution-card:hover .homepage-solution-card__image img,
.homepage-capability-card:hover .homepage-capability-card__image img {
  transform: scale(1.06);
}

.homepage-solution-card:focus-visible,
.homepage-capability-card:focus-visible {
  outline: 3px solid #10b981;
  outline-offset: 4px;
}

#home.hero-fullscreen .hero-backdrop > img {
  animation: homepage-hero-photo-drift 18s ease-in-out infinite alternate;
  transform-origin: center;
  will-change: transform;
}

#home.hero-fullscreen .hero-backdrop {
  overflow: hidden;
}

#home.hero-fullscreen .hero-backdrop .homepage-hero-slide {
  position: absolute !important;
  inset: 0;
  z-index: 0 !important;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.025);
  transition: opacity .9s cubic-bezier(.16, 1, .3, 1);
}

#home.hero-fullscreen .hero-backdrop .homepage-hero-slide.is-active {
  opacity: 1;
  animation: homepage-hero-photo-drift 18s ease-in-out infinite alternate;
}

#home.hero-fullscreen .hero-backdrop .hero-image-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.homepage-hero-slideshow {
  position: absolute;
  z-index: 4;
  top: clamp(1rem, 3vh, 2rem);
  right: clamp(1rem, 3vw, 3rem);
  display: flex;
  align-items: center;
  gap: 1.1rem;
  max-width: calc(100% - 2rem);
  padding: .7rem .8rem .7rem 1rem;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: .9rem;
  background: rgba(2, 12, 30, .7);
  color: #fff;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
  backdrop-filter: blur(8px);
}

.homepage-hero-slideshow__location {
  display: grid;
  gap: .2rem;
  min-width: 0;
}

.homepage-hero-slideshow__location > span,
.homepage-hero-slideshow__location small {
  color: #c6d7eb;
  font: 700 .57rem/1.2 "JetBrains Mono", monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.homepage-hero-slideshow__location strong {
  overflow: hidden;
  color: #fff;
  font-size: .9rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.homepage-hero-slideshow__controls {
  display: flex;
  flex: 0 0 auto;
  gap: .3rem;
}

.homepage-hero-slideshow__controls button {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  cursor: pointer;
  transition: background-color .18s ease, transform .18s ease;
}

.homepage-hero-slideshow__controls button:hover {
  transform: translateY(-2px);
  background: rgba(16, 185, 129, .82);
}

.homepage-hero-slideshow__controls svg {
  width: 1rem;
  height: 1rem;
}

.homepage-hero-slideshow__controls button > span {
  font-size: .88rem;
  font-weight: 800;
  line-height: 1;
}

.homepage-hero-slideshow__controls button:focus-visible {
  outline: 3px solid #6ee7b7;
  outline-offset: 3px;
}

@keyframes homepage-hero-photo-drift {
  from { transform: scale(1.02); }
  to { transform: scale(1.075); }
}

#home.hero-fullscreen .hero-backdrop::before {
  animation: aurora-shift 11s ease-in-out infinite alternate;
  will-change: transform;
}

@keyframes aurora-shift {
  0% { transform: translate3d(-2%, -1%, 0) scale(1); }
  50% { transform: translate3d(1.5%, 1%, 0) scale(1.06); }
  100% { transform: translate3d(3%, -1.5%, 0) scale(1.1); }
}

#home.hero-fullscreen .glass-card {
  animation: homepage-finder-float 5.2s ease-in-out infinite;
  transition: box-shadow .3s ease;
  will-change: translate;
}

#home.hero-fullscreen .glass-card:hover {
  animation-play-state: paused;
  translate: 0 -8px;
}

@keyframes homepage-finder-float {
  0%, 100% {
    translate: 0 0;
    box-shadow: 0 26px 80px rgba(2, 6, 23, .22), 0 0 0 1px rgba(0, 57, 166, .1), inset 0 1px 0 rgba(255, 255, 255, .8);
  }
  50% {
    translate: 0 -13px;
    box-shadow: 0 38px 92px rgba(2, 6, 23, .3), 0 0 0 1px rgba(0, 57, 166, .14), inset 0 1px 0 rgba(255, 255, 255, .8);
  }
}

body > section#home .hero-backdrop::after {
  background: linear-gradient(90deg, rgba(1, 8, 24, .67), rgba(1, 8, 24, .45) 50%, rgba(1, 8, 24, .28));
}

body > section#home .hero-image-overlay {
  background: linear-gradient(110deg, rgba(3, 7, 18, .46), rgba(0, 57, 166, .2) 58%, rgba(3, 7, 18, .14));
}

#home.hero-fullscreen .homepage-service-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

#home.hero-fullscreen .homepage-service-link:focus-visible {
  outline: 3px solid #6ee7b7;
  outline-offset: 4px;
  border-radius: .8rem;
}

#home.hero-fullscreen #solution-finder button {
  transition: transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

#home.hero-fullscreen #solution-finder button:hover {
  transform: translateY(-2px);
}

#home.hero-fullscreen #solution-finder button:focus-visible,
#home.hero-fullscreen #search-solutions:focus-visible {
  outline: 3px solid #10b981;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  #home.hero-fullscreen .hero-backdrop > img,
  #home.hero-fullscreen .hero-backdrop::before,
  #home.hero-fullscreen .glass-card {
    animation: none;
    translate: none;
    will-change: auto;
  }

  #home.hero-fullscreen .hero-backdrop .homepage-hero-slide {
    transition: none;
  }

  .homepage-solution-card__image img,
  .homepage-capability-card__image img,
  #home.hero-fullscreen #solution-finder button,
  #home.hero-fullscreen .glass-card {
    transition: none;
  }

  .homepage-solution-card,
  .homepage-capability-card {
    transition: none;
  }

  .homepage-solution-card:hover,
  .homepage-capability-card:hover {
    transform: none;
  }

  .homepage-solution-card:hover .homepage-solution-card__image img,
  .homepage-capability-card:hover .homepage-capability-card__image img,
  #home.hero-fullscreen #solution-finder button:hover,
  #home.hero-fullscreen .glass-card:hover {
    transform: none;
    translate: none;
  }
}

@media (max-width: 639px) {
  .homepage-hero-slideshow {
    left: .75rem;
    top: .75rem;
    right: .75rem;
    width: auto;
    justify-content: space-between;
    gap: .4rem;
    padding: .55rem;
  }

  .homepage-hero-slideshow__location > span {
    font-size: .56rem;
  }

  .homepage-hero-slideshow__location strong {
    max-width: 100%;
    font-size: .8rem;
    white-space: normal;
  }

  .homepage-hero-slideshow__location small {
    font-size: .55rem;
  }

  .homepage-hero-slideshow__controls {
    gap: .15rem;
  }

  .homepage-hero-slideshow__controls button {
    width: 44px;
    height: 44px;
  }
}

body:has(> section#home) > section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

body:has(> section#home) > section::before {
  content: none !important;
  display: none !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
}

#home.hero-fullscreen .hero-proof-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: start;
  gap: clamp(.65rem, 2.2vw, 2rem);
}

#home.hero-fullscreen .hero-proof-grid > div {
  min-width: 0;
}

#home.hero-fullscreen .hero-proof-grid > div > div:first-child {
  overflow-wrap: anywhere;
  font-size: clamp(1.1rem, 2.5vw, 2.25rem);
}

#home.hero-fullscreen .hero-proof-grid > div > div:last-child {
  font-size: clamp(.52rem, .78vw, .68rem);
  line-height: 1.4;
}

#home.hero-fullscreen .hero-trust-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: start;
  gap: clamp(.35rem, 1vw, .65rem);
  width: 100%;
}

#home.hero-fullscreen .hero-trust-grid > div {
  min-width: 0;
}

#home.hero-fullscreen .hero-trust-grid > div > div:last-child {
  font-size: clamp(.52rem, .75vw, .65rem);
  line-height: 1.3;
}

.footer-payment-band {
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
  overflow: visible;
}

.footer-payment-label {
  flex-basis: 100%;
}

@media (min-width: 640px) and (max-width: 900px) {
  #home.hero-fullscreen .hero-proof-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 639px) {
  #home.hero-fullscreen .hero-proof-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .85rem 1rem;
  }

  #home.hero-fullscreen .hero-proof-grid > div > div:first-child {
    font-size: clamp(1.2rem, 6vw, 1.8rem);
  }

  #home.hero-fullscreen .hero-trust-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: .3rem;
  }

  #home.hero-fullscreen .hero-trust-grid > div > div:first-child {
    width: 2.5rem;
    height: 2.5rem;
  }

  #home.hero-fullscreen .hero-trust-grid > div > div:last-child {
    font-size: clamp(.48rem, 2.4vw, .62rem);
    overflow-wrap: anywhere;
  }

  .footer-payment-band {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: .55rem;
    width: 100%;
    padding: .85rem;
  }

  .footer-payment-label {
    grid-column: 1 / -1;
    padding-bottom: .25rem;
  }

  .footer-payment-logo {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 2.75rem;
    height: auto;
    justify-content: center;
    padding-inline: .45rem;
  }

  .footer-payment-fallback {
    font-size: clamp(.58rem, 2.8vw, .7rem);
    text-align: center;
    white-space: normal;
  }
}

/* Shared navigation: readable frosted glass at the top, solid white on scroll. */
.navbar-glass,
.navbar-glass:not(.scrolled) {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  border-bottom: 1px solid rgba(15, 42, 74, .1) !important;
  background: rgba(255, 255, 255, .82) !important;
  color: #102a4c !important;
  box-shadow: 0 8px 28px rgba(0, 26, 77, .08);
  -webkit-backdrop-filter: saturate(170%) blur(18px) !important;
  backdrop-filter: saturate(170%) blur(18px) !important;
  transition: background-color .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.navbar-glass.scrolled {
  border-bottom-color: rgba(15, 42, 74, .1) !important;
  background: #fff !important;
  color: #102a4c !important;
  box-shadow: 0 10px 28px rgba(0, 26, 77, .12);
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

.navbar-glass > div:first-child {
  min-height: 4.75rem;
  height: auto;
  gap: clamp(.6rem, .8vw, 1rem) !important;
}

.navbar-glass nav {
  display: flex;
  flex: 1 1 auto;
  justify-content: center;
  align-items: center;
  gap: clamp(.3rem, .45vw, .55rem);
  min-width: 0;
  color: #102a4c !important;
  font-size: clamp(.72rem, .79vw, .86rem);
  font-weight: 650;
}

.navbar-glass nav > *,
.navbar-glass nav a,
.navbar-glass nav button {
  white-space: nowrap;
}

.navbar-glass nav > .group {
  padding-block: .55rem !important;
}

.navbar-glass nav > a:not(.nav-primary-extra),
.navbar-glass nav .relative.group > button,
.navbar-glass:not(.scrolled) nav > a,
.navbar-glass:not(.scrolled) nav button,
.navbar-glass.scrolled nav > a,
.navbar-glass.scrolled nav button {
  min-height: 2.75rem;
  padding: .55rem .18rem;
  border-radius: .5rem;
  color: #102a4c !important;
  font-weight: 650;
  text-shadow: none !important;
}

.navbar-glass nav > a:not(.nav-primary-extra)::after,
.navbar-glass nav .relative.group > button::after {
  bottom: .22rem;
  height: 2px;
  background: #047857;
}

.navbar-glass nav > a:hover,
.navbar-glass nav > a:focus-visible,
.navbar-glass nav button:hover,
.navbar-glass nav button:focus-visible,
.navbar-glass nav button[aria-expanded="true"] {
  color: #0039a6 !important;
  background: rgba(0, 82, 204, .06);
}

.navbar-glass nav button:focus-visible,
.navbar-glass nav a:focus-visible,
.navbar-glass .nav-actions a:focus-visible,
.navbar-glass .nav-actions button:focus-visible {
  outline: 2px solid #047857;
  outline-offset: 3px;
}

.navbar-glass .nav-actions {
  flex: 0 0 auto;
  align-items: center;
  gap: clamp(.25rem, .45vw, .55rem);
  min-width: 0;
}

.navbar-glass .nav-actions > .portal-signin,
.navbar-glass .nav-actions > a[href="/billing/"],
.navbar-glass .nav-a11y-trigger {
  min-height: 2.65rem;
  border: 1px solid rgba(0, 57, 166, .16);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .72);
  color: #12365d !important;
  box-shadow: 0 2px 8px rgba(0, 26, 77, .04);
}

.navbar-glass .nav-actions > a[href="/billing/"] {
  border-color: #059669;
  background: #059669 !important;
  color: #fff !important;
}

.navbar-glass .nav-actions > a[href="/billing/"]:hover {
  background: #047857 !important;
}

.navbar-glass .nav-actions > .contact-icon {
  display: inline-flex;
}

.navbar-glass:not(.scrolled) .nav-actions > .portal-signin,
.navbar-glass:not(.scrolled) .nav-a11y-trigger {
  border-color: rgba(0, 57, 166, .16);
  background: rgba(255, 255, 255, .72);
  color: #12365d !important;
}

.navbar-glass .nav-quick-link {
  display: inline-flex;
  min-height: 2.55rem;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  padding: .45rem .65rem;
  border: 1px solid rgba(0, 57, 166, .16);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .72);
  color: #12365d;
  font-size: .72rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.navbar-glass .nav-quick-link:hover,
.navbar-glass .nav-quick-link:focus-visible {
  border-color: rgba(0, 82, 204, .35);
  background: #f1f7ff;
  color: #0039a6;
}

.navbar-glass .nav-quick-link svg {
  width: 1rem;
  height: 1rem;
}

.navbar-glass .nav-a11y-trigger {
  padding-inline: .65rem;
}

.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) {
  top: calc(100% - .15rem);
  border-color: rgba(15, 42, 74, .12);
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 20px 48px rgba(0, 26, 77, .18);
}

.navbar-glass .nav-dropdown:not(.nav-mega-dropdown) a {
  min-height: 2.7rem;
  padding-inline: .8rem;
  color: #102a4c !important;
  font-size: .82rem;
}

.navbar-glass .nav-mega-dropdown {
  top: calc(100% - .15rem);
  border-color: rgba(15, 42, 74, .12);
  background: #fff !important;
}

.navbar-glass #mobile-menu {
  border-top: 1px solid rgba(15, 42, 74, .1);
  background: #fff;
  box-shadow: 0 18px 36px rgba(16, 35, 63, .14);
}

@media (min-width: 1280px) and (max-width: 1799px) {
  .navbar-glass .nav-extra-label,
  .navbar-glass .nav-quick-link span {
    display: none;
  }

  .navbar-glass .nav-quick-link {
    width: 2.65rem;
    padding-inline: .4rem;
  }
}

@media (min-width: 1360px) and (max-width: 1799px) {
  .navbar-glass .nav-quick-link span {
    display: inline;
  }

  .navbar-glass .nav-quick-link {
    width: auto;
    padding-inline: .55rem;
  }
}

@media (min-width: 1800px) {
  .navbar-glass .nav-actions > .portal-signin,
  .navbar-glass .nav-actions > a[href="/billing/"] {
    padding-inline: .7rem;
  }
}

@media (max-width: 1279px) {
  .navbar-glass > div:first-child {
    min-height: 4.25rem;
  }

  .navbar-glass nav {
    display: none !important;
  }

  .navbar-glass [data-mobile-menu-toggle] {
    display: inline-flex !important;
  }

  .navbar-glass #mobile-menu {
    position: absolute;
    inset: 100% 0 auto;
    width: 100%;
    max-height: calc(100svh - 4.25rem);
    overflow-y: auto;
  }

  .navbar-glass #mobile-menu.hidden {
    display: none !important;
  }

  .navbar-glass #mobile-menu:not(.hidden) {
    display: block !important;
  }

  .navbar-glass .nav-quick-link {
    display: none;
  }
}

.managed-wifi-home-section {
  padding: clamp(3.5rem, 7vw, 6.5rem) 0;
  background:
    linear-gradient(112deg, rgba(2, 13, 29, .96), rgba(4, 27, 50, .92) 58%, rgba(0, 47, 76, .84)),
    url("https://images.unsplash.com/photo-1523805009345-7448845a9e53?auto=format&fit=crop&w=2000&q=85")
      center 52% / cover no-repeat,
    #061728;
  color: #f4f8ff;
}

.managed-wifi-home-section--compact {
  padding-block: clamp(2rem, 4vw, 3.25rem);
}

.managed-wifi-home-inner {
  width: min(calc(100% - clamp(2rem, 8vw, 12rem)), 82rem);
  margin-inline: auto;
}

.managed-wifi-home-teaser {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.5rem 3rem;
}

.managed-wifi-home-teaser h2 {
  max-width: 34ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.2;
  text-wrap: balance;
}

.managed-wifi-home-teaser p {
  max-width: 70ch;
  margin-top: .65rem;
  color: #e5eff8;
  font-size: .98rem;
  line-height: 1.6;
}

.managed-wifi-home-section--compact .managed-wifi-home-links {
  margin-top: 0;
}

.managed-wifi-home-section--compact .managed-wifi-home-links a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  padding: .65rem .9rem;
  border: 1px solid rgba(213, 233, 249, .5);
  color: #fff;
  text-decoration: none;
}

.managed-wifi-home-section--compact .managed-wifi-home-links a:hover,
.managed-wifi-home-section--compact .managed-wifi-home-links a:focus-visible {
  border-color: #fff;
  background: rgba(255, 255, 255, .1);
}

.managed-wifi-home-main {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr);
  align-items: stretch;
  gap: clamp(2rem, 5vw, 5rem);
}

.managed-wifi-home-copy h2 {
  max-width: 16ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2.25rem, 4.4vw, 4.2rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.04;
  text-wrap: balance;
}

.managed-wifi-home-copy > p {
  max-width: 66ch;
  margin-top: 1rem;
  color: #e5eff8;
  font-size: 1rem;
  line-height: 1.7;
}

.managed-wifi-home-copy .managed-wifi-home-sites {
  margin-top: 1.4rem;
  color: #f5fbff;
}

.managed-wifi-home-speeds {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: .35rem 1rem;
  margin-top: 1.6rem;
  padding-block: 1rem;
  border-top: 1px solid rgba(199, 225, 245, .42);
  border-bottom: 1px solid rgba(199, 225, 245, .42);
}

.managed-wifi-home-speeds > span {
  color: #d6e9f7;
  font-size: .92rem;
  font-weight: 700;
}

.managed-wifi-home-speeds > strong {
  color: #9ce9d2;
  font-size: 1rem;
  font-weight: 850;
  white-space: nowrap;
}

.managed-wifi-home-speeds > p {
  grid-column: 1 / -1;
  max-width: 68ch;
  color: #d6e9f7;
  font-size: .84rem;
  line-height: 1.55;
}

.managed-wifi-home-links {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  margin-top: 1.5rem;
}

.managed-wifi-home-links a,
.managed-wifi-home-status a {
  color: #a6f0dc;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(166, 240, 220, .6);
  text-underline-offset: .22em;
}

.managed-wifi-home-links a:hover,
.managed-wifi-home-links a:focus-visible,
.managed-wifi-home-status a:hover,
.managed-wifi-home-status a:focus-visible {
  color: #fff;
  text-decoration-color: #fff;
}

.managed-wifi-home-visual {
  display: flex;
  min-height: 25rem;
  align-items: end;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  background:
    linear-gradient(180deg, rgba(3, 15, 29, .02) 5%, rgba(3, 15, 29, .9) 100%),
    url("/assets/billing/guest-wifi.jpg") center / cover no-repeat,
    #0b3150;
}

.managed-wifi-home-visual-copy h3 {
  max-width: 18ch;
  margin-bottom: 1.15rem;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.55rem, 2.4vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.15;
}

.managed-wifi-home-visual-copy ol {
  display: grid;
  gap: .55rem;
}

.managed-wifi-home-visual-copy li {
  color: #eff7ff;
  font-size: .94rem;
  line-height: 1.5;
}

.managed-wifi-home-visual-copy li span {
  color: #a6f0dc;
  font-weight: 850;
}

.managed-wifi-home-proposal {
  display: grid;
  grid-template-columns: minmax(14rem, .8fr) minmax(0, 1.2fr);
  gap: 1.2rem 3rem;
  margin-top: clamp(3rem, 6vw, 5rem);
  padding-top: 1.75rem;
  border-top: 1px solid rgba(199, 225, 245, .42);
}

.managed-wifi-home-proposal h3 {
  max-width: 21ch;
  color: #fff;
  font-size: clamp(1.3rem, 2.1vw, 1.75rem);
  font-weight: 850;
  letter-spacing: -.025em;
  line-height: 1.2;
}

.managed-wifi-home-proposal > div > p {
  max-width: 48ch;
  margin-top: .65rem;
  color: #d6e9f7;
  font-size: .94rem;
  line-height: 1.6;
}

.managed-wifi-home-proposal ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2rem;
}

.managed-wifi-home-proposal li {
  display: grid;
  gap: .2rem;
  padding: .65rem 0;
  border-bottom: 1px solid rgba(199, 225, 245, .25);
}

.managed-wifi-home-proposal li strong {
  color: #fff;
  font-size: .93rem;
}

.managed-wifi-home-proposal li span {
  color: #d6e9f7;
  font-size: .86rem;
  line-height: 1.5;
}

.managed-wifi-home-proposal .managed-wifi-home-status {
  grid-column: 1 / -1;
  max-width: 90ch;
  color: #d6e9f7;
  font-size: .88rem;
  line-height: 1.6;
}

.billing-managed-wifi {
  margin-top: clamp(3rem, 5vw, 4.5rem);
  padding-block: 2rem;
  border-top: 1px solid rgba(208, 231, 250, .35);
  border-bottom: 1px solid rgba(208, 231, 250, .35);
}

.billing-managed-wifi header h3 {
  max-width: 26ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.7rem, 3vw, 2.5rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.12;
}

.billing-managed-wifi header p {
  max-width: 72ch;
  margin-top: .75rem;
  color: #e2edf8;
  font-size: 1rem;
  line-height: 1.7;
}

.billing-wifi-sites {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1.4rem;
  border-top: 1px solid rgba(208, 231, 250, .25);
  border-bottom: 1px solid rgba(208, 231, 250, .25);
}

.billing-wifi-sites a {
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  padding: .7rem .85rem;
  border-right: 1px solid rgba(208, 231, 250, .25);
  color: #f4f8ff;
  font-weight: 750;
  text-decoration: none;
}

.billing-wifi-sites a:last-child {
  border-right: 0;
}

.billing-wifi-sites a:hover,
.billing-wifi-sites a:focus-visible {
  background: rgba(255, 255, 255, .1);
  color: #a6f0dc;
}

.billing-wifi-link {
  display: inline-flex;
  gap: .55rem;
  margin-top: 1.1rem;
  color: #a6f0dc;
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: .22em;
}

.billing-wifi-link:hover,
.billing-wifi-link:focus-visible {
  color: #fff;
}

.managed-wifi-page main > .managed-wifi-proposal {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #f5f8fc;
  color: #18314f;
}

.managed-wifi-page .managed-wifi-proposal-intro {
  display: grid;
  grid-template-columns: minmax(15rem, .85fr) minmax(0, 1.15fr);
  align-items: end;
  gap: 1.5rem 3rem;
}

.managed-wifi-page .managed-wifi-proposal-intro h2 {
  max-width: 16ch;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.06;
  text-wrap: balance;
}

.managed-wifi-page .managed-wifi-proposal-intro > p {
  max-width: 67ch;
  color: #334155;
  font-size: 1rem;
  line-height: 1.7;
}

.managed-wifi-page .managed-wifi-concept-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(2rem, 5vw, 5rem);
  margin-top: 2.25rem;
  border-top: 1px solid #cbd5e1;
}

.managed-wifi-page .managed-wifi-concept-list li {
  padding: 1.25rem 0;
  border-bottom: 1px solid #cbd5e1;
}

.managed-wifi-page .managed-wifi-concept-list h3 {
  color: #001a4d;
  font-size: 1.12rem;
  font-weight: 850;
  letter-spacing: -.015em;
}

.managed-wifi-page .managed-wifi-concept-list p {
  max-width: 56ch;
  margin-top: .45rem;
  color: #334155;
  font-size: .94rem;
  line-height: 1.65;
}

.managed-wifi-page .managed-wifi-proposal-note {
  max-width: 88ch;
  margin-top: 1.35rem;
  color: #334155;
  font-size: .9rem;
  line-height: 1.65;
}

.managed-wifi-page .managed-wifi-proposal-note a {
  color: #0052cc;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .22em;
}

.managed-wifi-page .managed-wifi-proposal-note a:hover,
.managed-wifi-page .managed-wifi-proposal-note a:focus-visible {
  color: #00306f;
}

@media (max-width: 900px) {
  .managed-wifi-home-main {
    grid-template-columns: minmax(0, 1fr);
  }

  .managed-wifi-home-visual {
    min-height: 21rem;
  }

  .managed-wifi-home-proposal {
    grid-template-columns: minmax(0, 1fr);
  }

  .managed-wifi-home-proposal .managed-wifi-home-status {
    grid-column: auto;
  }

  .managed-wifi-page .managed-wifi-proposal-intro {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 700px) {
  .managed-wifi-home-inner {
    width: min(calc(100% - 2rem), 42rem);
  }

  .managed-wifi-home-speeds {
    grid-template-columns: minmax(0, 1fr);
  }

  .managed-wifi-home-speeds > strong {
    white-space: normal;
  }

  .managed-wifi-home-proposal ul,
  .managed-wifi-page .managed-wifi-concept-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .billing-wifi-sites {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-wifi-sites a:nth-child(2) {
    border-right: 0;
  }

  .billing-wifi-sites a:nth-child(n + 3) {
    border-top: 1px solid rgba(208, 231, 250, .25);
  }
}

@media (max-width: 1023px) {
  .navbar-glass .nav-actions > .contact-icon {
    display: none;
  }
}

@media (max-width: 639px) {
  .navbar-glass > div:first-child {
    min-height: 4rem;
    padding-inline: .75rem;
  }

  .navbar-glass .logo-shine {
    height: 2.7rem;
    max-width: 42vw;
    padding-inline: .45rem;
  }

  .navbar-glass .logo-shine [data-supplied-logo] {
    width: min(36vw, 9.2rem);
  }

  .navbar-glass .nav-actions {
    gap: .25rem;
  }

  .navbar-glass .nav-actions > .portal-signin {
    display: none;
  }

  .navbar-glass .nav-actions > a[href="/billing/"] {
    width: 2.65rem;
    padding-inline: .35rem;
  }

  .navbar-glass .nav-a11y-trigger {
    width: 2.65rem;
    justify-content: center;
    padding-inline: .35rem;
  }

  .navbar-glass .nav-a11y-trigger span,
  .navbar-glass .nav-a11y-trigger [data-lucide="chevron-down"],
  .navbar-glass .nav-extra-label {
    display: none;
  }

  .navbar-glass .nav-a11y-trigger {
    min-height: 2.65rem;
  }
}

  body.solution-audience-page[data-solution="business"] {
    --solution-hero-image: url("/assets/billing/cafe-management.jpg");
  }

  body.solution-audience-page[data-solution="hospitality"] {
    --solution-hero-image: url("/assets/billing/guest-wifi.jpg");
  }

  body.solution-audience-page[data-solution="internet-hubs"] {
    --solution-hero-image: url("/assets/billing/print-shops.jpg");
  }

  body.solution-audience-page[data-solution="healthcare"] {
    --solution-hero-image: url("/assets/billing/print-shops.jpg");
  }

  body.solution-audience-page[data-solution="isps"] {
    --solution-hero-image: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=72");
  }

  body.solution-audience-page[data-solution="retail"] {
    --solution-hero-image: url("https://images.unsplash.com/photo-1556742049-0a67d1656c12?auto=format&fit=crop&w=1600&q=72");
  }

  body.solution-audience-page[data-solution="ngos"] {
    --solution-hero-image: url("/assets/billing/print-shops.jpg");
  }

  body.solution-audience-page[data-solution="schools"] {
    --solution-hero-image: url("/assets/billing/schools-labs.jpg");
  }

  body.solution-audience-page .shero {
    display: flex;
    min-height: clamp(27rem, 58vh, 42rem);
    align-items: flex-end;
    padding: clamp(6rem, 12vw, 9rem) 1rem clamp(3.5rem, 7vw, 5.5rem);
    background:
      linear-gradient(90deg, rgba(3, 7, 18, .88), rgba(0, 26, 77, .58) 70%, rgba(0, 26, 77, .36)),
      var(--solution-hero-image, linear-gradient(135deg, #030712, #001a4d)) center 48% / cover no-repeat;
  }

  body.solution-audience-page .shero .wrap,
  body.solution-audience-page .band .wrap,
  body.solution-audience-page .cta .wrap {
    width: min(100%, 74rem);
  }

  body.solution-audience-page .shero h1 {
    max-width: 15ch;
    margin: .8rem 0 0;
    font-size: clamp(2.35rem, 6vw, 5rem);
    line-height: 1.04;
    letter-spacing: -.035em;
    text-wrap: balance;
  }

  body.solution-audience-page .shero p {
    max-width: 66ch;
    margin-top: 1rem;
    color: #f1f5f9;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    line-height: 1.7;
  }

  body.solution-audience-page .band {
    background: #f4f7fb;
  }

  body.solution-audience-page .grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
    align-items: stretch;
    gap: clamp(.9rem, 2vw, 1.35rem);
    padding-block: clamp(2.5rem, 6vw, 4.5rem);
  }

  body.solution-audience-page .card {
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
    padding: 0;
    border: 1px solid #dce5ef;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 63, .07);
  }

  body.solution-audience-page .card h2 {
    margin: 1.2rem 1.25rem .55rem;
    color: #0f172a;
    font-size: clamp(1.1rem, 1.7vw, 1.35rem);
    line-height: 1.25;
  }

  body.solution-audience-page .card p {
    margin: 0 1.25rem;
    color: #475569;
    font-size: .95rem;
    line-height: 1.65;
  }

  body.solution-audience-page .card a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    margin: .75rem 1.25rem .8rem;
    color: #0039a6;
    font-size: .85rem;
  }

  body.solution-audience-page .cta {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(3rem, 7vw, 5.5rem) 1rem;
    background: #001a4d;
  }

  body.solution-audience-page .cta h2,
  .site-closing-photo h2 {
    max-width: 22ch;
    font-size: clamp(1.8rem, 4.4vw, 3.25rem);
    line-height: 1.1;
    text-wrap: balance;
  }

  body.solution-audience-page .cta p,
  .site-closing-photo p {
    max-width: 66ch;
    color: #f1f5f9;
    font-size: 1rem;
  }

  body.solution-audience-page .cta a,
  .site-closing-photo > .wrap > a,
  .site-closing-photo .detail-shell > a {
    display: inline-flex;
    min-height: 2.9rem;
    align-items: center;
    justify-content: center;
    padding: .8rem 1.1rem;
    border-radius: .7rem;
    background: #fff;
    color: #001a4d;
  }

  .site-closing-photo {
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }

  .site-closing-photo > :not(.site-section-photo) {
    position: relative;
    z-index: 1;
  }

  @media (max-width: 639px) {
    body.solution-audience-page .shero {
      min-height: 29rem;
      padding-top: 6rem;
      padding-bottom: 3rem;
      background-position: 56% center;
    }

    body.solution-audience-page .shero h1 {
      max-width: 12ch;
      font-size: clamp(2.15rem, 10vw, 3.2rem);
    }

    body.solution-audience-page .grid {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  @media (min-width: 761px) and (max-width: 900px) {
    .home-discovery-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-discovery-feature:last-child {
      grid-column: 1 / -1;
      min-height: 14rem;
    }
  }

  @media (prefers-reduced-motion: reduce) {
  .navbar-glass,
  .navbar-glass * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Keep shared layouts fluid when the viewport narrows through zoom or grows to TV size. */
html,
body {
  width: 100%;
  max-width: 100%;
}
body {
  min-width: 0;
  overflow-x: clip;
}
main,
main > * {
  min-width: 0;
  max-width: 100%;
}
main :is(img, video, iframe, canvas) {
  max-width: 100%;
}
main :is(p, li, a, button, label, input, select, textarea) {
  overflow-wrap: anywhere;
}
main pre,
main table {
  max-width: 100%;
  overflow-x: auto;
}

@media (min-width: 2200px) {
  section > .max-w-\[2560px\],
  footer > .max-w-\[2560px\],
  .gallery-grid {
    width: min(100%, 2560px);
    margin-inline: auto;
  }
}

@media (min-width: 640px) and (max-width: 1023px) {
  body:not(:has(> section#home)) main .grid[class*="grid-cols-"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body:not(:has(> section#home)) main .grid[class*="grid-cols-"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  main > section,
  main > section > * {
    min-width: 0;
  }

  main :is(input, select, textarea, button) {
    max-width: 100%;
  }
}

/* Mobile navigation keeps the expandable service/resource groups in one scrollable panel. */
@media (max-width: 1279px) {
  .navbar-glass #mobile-menu:not(.hidden) {
    display: block !important;
    max-height: calc(100vh - 4.25rem);
    max-height: calc(100dvh - 4.25rem);
    padding: .75rem max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .navbar-glass #mobile-menu > * + * {
    margin-top: .25rem;
  }

  .mobile-nav-group-toggle {
    min-height: 2.9rem;
    padding: .65rem .25rem;
  }

  .mobile-nav-submenu {
    max-height: none;
    overflow: visible;
    gap: .25rem;
    padding: .35rem;
  }

  .mobile-nav-submenu > .nav-mega-dropdown {
    max-height: none !important;
    overflow: visible !important;
  }

  .mobile-nav-submenu > .nav-mega-dropdown > *,
  .mobile-nav-submenu > .nav-dropdown > * {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  .mobile-nav-submenu a,
  .mobile-nav-submenu .nav-mega-service {
    min-height: 2.75rem;
    align-content: center;
    padding: .65rem;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Match closing imagery to the page's subject without changing its copy or layout. */
html:has(head link[rel="canonical"][href*="/services/10-hardware-networking/"]),
html:has(head link[rel="canonical"][href*="/solutions/internet-hubs/"]),
html:has(head link[rel="canonical"][href*="/solutions/isps/"]),
html:has(head link[rel="canonical"][href$="/products/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/services/11-cybersecurity/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}
html:has(head link[rel="canonical"][href*="/services/12-cloud-computing/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}
html:has(head link[rel="canonical"][href*="/services/13-web-software/"]),
html:has(head link[rel="canonical"][href*="/products/saints-man/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/services/14-data-business-intel/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}
html:has(head link[rel="canonical"][href*="/services/15-iot-smart/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/services/16-digital-media/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/services/17-ict-training/"]),
html:has(head link[rel="canonical"][href*="/solutions/schools/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/solutions/hospitality/"]) {
  --closing-photo: url("/assets/billing/guest-wifi.jpg");
}
html:has(head link[rel="canonical"][href*="/solutions/retail/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}
html:has(head link[rel="canonical"][href*="/solutions/healthcare/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}
html:has(head link[rel="canonical"][href*="/solutions/ngos/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/resources/"]),
html:has(head link[rel="canonical"][href*="/blog/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/case-studies/"]) {
  --closing-photo: url("/assets/billing/print-shops.jpg");
}
html:has(head link[rel="canonical"][href*="/solutions/business/"]),
html:has(head link[rel="canonical"][href*="/services/18-customer-freelance/"]) {
  --closing-photo: url("/assets/billing/cafe-management.jpg");
}

/* Put the photo and contrast veil behind every shared interior closing CTA. */
body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.documentation-page) > section:last-of-type,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.documentation-page) > section:last-of-type,
body > section:is(.detail-cta, .cta),
body main > section.detail-cta,
body main > section.cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(3, 10, 24, .99) 0%, rgba(3, 10, 24, .97) 30%, rgba(3, 10, 24, .84) 54%, rgba(3, 10, 24, .58) 100%),
    linear-gradient(0deg, rgba(0, 57, 166, .2), transparent 68%),
    var(--closing-photo, url("/assets/billing/cafe-management.jpg")) right center / cover no-repeat !important;
  background-color: #06152d !important;
}

body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type::before,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type::before,
body > section:is(.detail-cta, .cta)::before {
  content: none !important;
}

body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type::after,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type::after,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type::after,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type::after,
body > section:is(.detail-cta, .cta)::after,
body main > section.detail-cta::after,
body main > section.cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(2, 12, 30, .08), rgba(2, 12, 30, .18));
}

body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type > *,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type > *,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type > *,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type > *,
body > section:is(.detail-cta, .cta) > *,
body main > section.detail-cta > *,
body main > section.cta > * {
  position: relative;
  z-index: 2;
}

body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type :is(h1, h2, h3, h4, p, li, small),
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type :is(h1, h2, h3, h4, p, li, small),
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type :is(h1, h2, h3, h4, p, li, small),
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type :is(h1, h2, h3, h4, p, li, small),
body > section:is(.detail-cta, .cta) :is(h1, h2, h3, h4, p, li, small),
body main > section.detail-cta :is(h1, h2, h3, h4, p, li, small),
body main > section.cta :is(h1, h2, h3, h4, p, li, small) {
  color: #f1f5f9 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}

body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type p,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type p,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type p,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type p,
body > section:is(.detail-cta, .cta) p,
body main > section.detail-cta p,
body main > section.cta p {
  color: #e2e8f0 !important;
  font-size: clamp(1rem, 1.15vw, 1.125rem);
  line-height: 1.7;
}

body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link),
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link),
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link),
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link) {
  color: #dbeafe;
}

body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type a,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type a,
body > section:is(.detail-cta, .cta) a,
body main > section.detail-cta a,
body main > section.cta a,
body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a {
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
body main > section.detail-cta a:hover,
body main > section.detail-cta a:focus-visible,
body main > section.cta a:hover,
body main > section.cta a:focus-visible,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type a:hover,
body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type a:focus-visible,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type a:hover,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page) > section:last-of-type a:focus-visible,
body > section:is(.detail-cta, .cta) a:hover,
body > section:is(.detail-cta, .cta) a:focus-visible,
body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:hover,
body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:focus-visible,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:hover,
body.responsive-page:not(.shop-page):not(.gallery-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type a:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.22);
}
body main > section.detail-cta a,
body > section.detail-cta a {
  color: #001a4d !important;
}
body main > section.cta a,
body > section.cta a {
  color: #001a4d !important;
}

/* Keep the contact form surface light, readable, and free of fixed photo scrolling. */
body.contact-page main > section:last-of-type {
  background: #fff !important;
}
body.contact-page main > section:has(#contact-form) {
  background: #fff !important;
  background-image: none !important;
}
body.contact-page main > section:last-of-type > * {
  position: relative;
  z-index: 1;
}

@media (prefers-reduced-motion: no-preference) {
  .contact-location-visual::before,
  .contact-location-visual::after {
    animation: contact-location-pulse 4.8s ease-in-out infinite;
  }
  .contact-location-visual::after {
    animation-delay: 1.1s;
  }
}
@keyframes contact-location-pulse {
  0%, 100% { opacity: .35; transform: scale(.96); }
  50% { opacity: .85; transform: scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  .contact-location-visual::before,
  .contact-location-visual::after {
    animation: none;
  }
  body main > section.detail-cta a,
  body main > section.cta a,
  body.interior-page main > section:last-of-type a,
  body.responsive-page main > section:last-of-type a {
    transition: none;
    transform: none;
  }
}

/* Keep injected footer content readable even when utility CSS loads late. */
.footer-photo {
  color: #dbeafe !important;
}
.footer-photo :is(h1, h2, h3, h4, h5, strong, dt) {
  color: #fff !important;
}
.footer-photo a {
  color: #dbeafe;
}
.footer-photo a:hover,
.footer-photo a:focus-visible {
  color: #6ee7b7 !important;
}
.footer-photo button {
  color: #fff !important;
}
.footer-photo #newsletter-status {
  color: #6ee7b7 !important;
}
.footer-photo input::placeholder {
  color: #bfdbfe;
  opacity: 1;
}

@media (max-width: 640px) {
  body.interior-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type,
  body.responsive-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page):not(.content-structure-page) main > section:last-of-type,
  body:is(.interior-page, .pricing-neural-page):not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type,
  body.responsive-page:not(.gallery-page):not(.shop-page):not(.saints-page):not(.contact-page) > section:last-of-type,
  body > section:is(.detail-cta, .cta),
  body main > section.detail-cta,
  body main > section.cta {
    background:
      linear-gradient(180deg, rgba(3, 10, 24, .98) 0%, rgba(3, 10, 24, .94) 42%, rgba(3, 10, 24, .72) 100%),
      linear-gradient(0deg, rgba(0, 57, 166, .24), transparent 72%),
      var(--closing-photo, url("/assets/billing/cafe-management.jpg")) 72% bottom / cover no-repeat !important;
  }
}

/* Keep gallery photography present while anchoring every title on a solid, high-contrast label. */
body.gallery-page .gallery-hero {
  position: relative;
  isolation: isolate;
  background-color: #071426 !important;
  background-image: url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=2400&q=85") !important;
  background-position: center 48% !important;
  background-size: cover !important;
}
body.gallery-page .gallery-hero::after {
  z-index: 0;
  background: linear-gradient(90deg, rgba(2, 7, 18, .72), rgba(2, 7, 18, .45) 55%, rgba(2, 7, 18, .3)) !important;
}
body.gallery-page .gallery-hero .gallery-wrap {
  position: relative;
  z-index: 1;
  width: min(100%, 2560px);
  margin-inline: auto;
  padding: clamp(2rem, 6vw, 6rem);
}
body.gallery-page .gallery-section {
  background-color: #e8eef5;
  background-image:
    linear-gradient(rgba(236, 242, 248, .78), rgba(236, 242, 248, .78)),
    url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=2400&q=85") !important;
  background-position: center;
  background-size: cover;
}
body.gallery-page .gallery-grid {
  width: min(calc(100% - 2rem), 2560px);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
}
body.gallery-page .gallery-card {
  min-width: 0;
  min-height: clamp(15rem, 20vw, 22rem);
}
body.gallery-page .gallery-card img {
  min-height: inherit !important;
}
body.gallery-page .gallery-label {
  background: rgba(2, 12, 28, .92) !important;
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .8) !important;
}

/* Reveal the Shop Lift photo without reducing the contrast of hero or seller-panel copy. */
body.shop-page .shop-hero-image {
  background:
    linear-gradient(100deg, rgba(0, 26, 77, .72), rgba(0, 57, 166, .42)),
    url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=2200&q=88") center / cover no-repeat !important;
}
body.shop-page .shop-hero-image::after {
  background: linear-gradient(90deg, rgba(2, 7, 18, .42), rgba(2, 7, 18, .2)) !important;
}
body.shop-page .shop-sell-band::before {
  background:
    linear-gradient(100deg, rgba(2, 12, 30, .76), rgba(0, 57, 166, .54)),
    url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=2200&q=85") center / cover no-repeat !important;
}
body.shop-page .shop-sell-band :is(h2, p) {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}

/* The shared footer photo stays recognizable beneath a softer, readable overlay. */
.footer-photo {
  background-color: #001a4d !important;
  background-image:
    linear-gradient(rgba(0, 12, 30, .62), rgba(0, 12, 30, .72)),
    url("/assets/billing/cafe-management.jpg") !important;
  background-position: center 48% !important;
  background-size: cover !important;
}

@media (max-width: 639px) {
  body.gallery-page .gallery-hero .gallery-wrap {
    padding: 2rem 1rem;
  }
  body.gallery-page .gallery-grid {
    width: calc(100% - 1.5rem);
    grid-template-columns: minmax(0, 1fr);
    gap: .85rem;
  }
  body.gallery-page .gallery-card {
    min-height: 17rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.gallery-page .gallery-card img,
  body.gallery-page .gallery-card:hover img {
    transition: none !important;
    transform: none !important;
  }
}
@media (max-width: 639px) {
  .announcement-layout {
    display: grid;
    gap: 0.25rem;
    padding-block: 0.35rem;
  }

  .announcement-location-window {
    padding: 0;
  }

  .announcement-location-track {
    animation: none;
    justify-content: center;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    text-align: center;
    white-space: normal;
  }

  .announcement-location-track span:not([aria-hidden="true"]) {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding-right: 0;
    text-overflow: ellipsis;
  }

  .announcement-location-track [aria-hidden="true"] {
    display: none;
  }

  .announcement-contact {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.2rem 0.75rem;
    font-size: 0.75rem;
    white-space: normal;
  }

  .announcement-contact > :not(a) {
    display: none;
  }

  .announcement-contact a {
    min-height: 1.5rem;
    align-items: center;
  }
}

@media (max-width: 767px) {
  #home .hero-content-shell > .grid {
    min-height: auto !important;
  }

  #home .hero-content-shell {
    padding-block: 4.5rem 3rem;
  }

  #home.hero-fullscreen .hero-copy h1 {
    font-size: clamp(1.9rem, 9.5vw, 2.5rem);
    line-height: 1;
  }

  #home .homepage-hero-slideshow { display: flex; }

  #contact-form input,
  #contact-form select,
  #contact-form textarea {
    font-size: 1rem;
  }

  #contact-form button[type="submit"] {
    min-height: 2.75rem;
  }
}

.contact-hero .contact-location-card {
  position: relative;
  z-index: 1;
  inset: auto;
  width: min(100% - 2rem, 28rem);
  margin: 1rem;
}

.contact-technology-disclosure {
  border-top: 1px solid #e2e8f0;
  padding-top: 0.75rem;
}

.contact-technology-disclosure summary {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: #0039a6;
  font-size: 0.875rem;
  font-weight: 700;
}

/* Editorial layouts for the Products, Resource Center, and Projects pages. */
html {
  --detail-hero-image: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href$="/products/"]) {
  --detail-hero-image: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href$="/resources/"]) {
  --detail-hero-image: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href$="/case-studies/"]) {
  --detail-hero-image: url("/assets/billing/cafe-management.jpg");
}

body.network-engineering-page {
  --detail-hero-image: url("/assets/billing/internet-hubs.jpg");
}

body.hotspot-programmes-page {
  --detail-hero-image: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href$="/programmes/community-hotspots/"]) {
  --detail-hero-image: url("/assets/billing/schools-labs.jpg");
}

html:has(head link[rel="canonical"][href$="/programmes/commercial-hotspots/"]) {
  --detail-hero-image: url("/assets/billing/guest-wifi.jpg");
}

html:has(head link[rel="canonical"][href$="/company/"]) {
  --detail-hero-image: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href$="/company/board-of-directors/"]) {
  --detail-hero-image: url("/assets/billing/internet-hubs.jpg");
}

html:has(head link[rel="canonical"][href$="/company/executive-leadership/"]) {
  --detail-hero-image: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href$="/company/team-leaders/"]) {
  --detail-hero-image: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href$="/company/staff/"]) {
  --detail-hero-image: url("/assets/billing/schools-labs.jpg");
}

.detail-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5.5rem, 10vw, 8rem) 0 4.5rem;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(3, 7, 18, .92), rgba(0, 26, 77, .76) 58%, rgba(0, 26, 77, .62)),
    var(--detail-hero-image) center / cover no-repeat,
    #030712;
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .detail-hero {
  min-height: clamp(38rem, 72svh, 54rem);
  display: grid;
  align-items: center;
  background-image:
    linear-gradient(110deg, rgba(0, 26, 77, .78), rgba(0, 57, 166, .52) 58%, rgba(0, 26, 77, .42)),
    var(--detail-hero-image);
  background-position: center;
  background-size: cover;
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(19rem, .8fr);
  align-items: center;
  gap: clamp(1.25rem, 3vw, 3rem);
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero > :first-child,
body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero-note {
  padding: clamp(1.4rem, 3.2vw, 3rem);
  border: 1px solid rgba(191, 219, 254, .48);
  border-radius: 1.25rem;
  background: rgba(3, 30, 79, .78);
  box-shadow: 0 22px 56px rgba(0, 12, 38, .28);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .detail-hero p {
  color: #f1f7ff;
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  line-height: 1.75;
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero-note {
  padding-top: 1.4rem;
}

body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero-photo {
  display: none;
}

.detail-shell {
  width: min(calc(100% - clamp(2rem, 8vw, 12rem)), 2560px);
  margin-inline: auto;
}

body.company-readable-page .company-reading p,
body.company-readable-page .company-reading li {
  color: #334155;
  font-size: 1.05rem;
  line-height: 1.75;
}

body.company-readable-page .company-reading h2 {
  color: #001a4d;
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

body.company-readable-page .company-reading h3 {
  color: #0039a6;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 800;
  line-height: 1.25;
}

body.company-readable-page .company-reading :is(h2, h3) {
  color: #001a4d;
}

body.company-readable-page .company-reading .company-callout {
  border: 1px solid #bfdbfe;
  border-radius: 1rem;
  background: #fff;
}

body.company-readable-page .company-reading .company-callout p {
  color: #334155;
}

body.company-readable-page .company-hero-copy {
  color: #f1f7ff;
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  line-height: 1.75;
}

body.company-readable-page .company-identity-grid,
body.company-readable-page .company-mandate,
body.company-readable-page .company-target,
body.company-readable-page .company-directory-content {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: start;
  gap: clamp(2rem, 6vw, 6rem);
}

body.company-readable-page .company-identity-grid h2,
body.company-readable-page .company-mandate h2,
body.company-readable-page .company-target h2,
body.company-readable-page .company-directory-content h2,
body.company-readable-page .company-section-intro h2,
body.company-readable-page .company-people-section h2 {
  max-width: 16ch;
  color: #001a4d;
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

body.company-readable-page .company-identity-grid h3,
body.company-readable-page .company-directory-notice h3 {
  margin-bottom: .75rem;
  color: #0039a6;
  font-size: 1.2rem;
  font-weight: 800;
}

body.company-readable-page .company-mission-statement {
  padding: 1.5rem 0 0;
  border-top: 2px solid #0039a6;
}

body.company-readable-page .company-mission-statement p {
  color: #001a4d;
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  font-weight: 700;
  line-height: 1.45;
}

body.company-readable-page .company-mandate ul,
body.company-readable-page .company-target ul {
  display: grid;
  gap: 1.15rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.company-readable-page .company-mandate li {
  padding: 0 0 1.1rem;
  border-bottom: 1px solid #dbe5f1;
}

body.company-readable-page .company-mandate li strong {
  color: #001a4d;
}

body.company-readable-page .company-section-intro {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: end;
  gap: clamp(2rem, 6vw, 6rem);
  margin-bottom: 2rem;
}

body.company-readable-page .company-portfolio-links,
body.company-readable-page .company-people-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #b9cbe3;
}

body.company-readable-page .company-portfolio-links a,
body.company-readable-page .company-people-links a,
body.company-readable-page .company-team-links a {
  display: grid;
  align-content: start;
  gap: .65rem;
  min-height: 10rem;
  padding: 1.5rem;
  border-right: 1px solid #b9cbe3;
  border-bottom: 1px solid #b9cbe3;
  color: #001a4d;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease;
}

body.company-readable-page .company-portfolio-links a:hover,
body.company-readable-page .company-people-links a:hover,
body.company-readable-page .company-team-links a:hover {
  background: #e8f1ff;
}

body.company-readable-page .company-portfolio-links strong,
body.company-readable-page .company-people-links a,
body.company-readable-page .company-team-links a {
  font-size: 1.1rem;
  font-weight: 800;
}

body.company-readable-page .company-portfolio-links span,
body.company-readable-page .company-people-links span,
body.company-readable-page .company-team-links span {
  color: #334155;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.6;
}

body.company-readable-page .company-portfolio-links b {
  align-self: end;
  color: #0039a6;
  font-size: 1rem;
}

body.company-readable-page .company-people-section {
  padding: clamp(2.5rem, 4vw, 3.5rem) 0;
  background: #001a4d;
  color: #fff;
}

body.company-readable-page .company-people-section h2 {
  color: #fff;
}

body.company-readable-page .company-people-section > .detail-shell > h2 {
  margin-bottom: 2rem;
}

body.company-readable-page .company-people-section .company-section-intro {
  margin-bottom: 1.25rem;
}

body.company-readable-page .company-people-section .company-section-intro p {
  color: #e2ecff;
}

body.company-readable-page .company-people-links {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-color: rgba(255, 255, 255, .3);
}

body.company-readable-page .company-people-links a {
  min-height: 6.25rem;
  padding: 1.1rem;
  border-color: rgba(255, 255, 255, .3);
  color: #fff;
}

body.company-readable-page .company-people-links a:hover {
  background: rgba(255, 255, 255, .12);
}

body.company-readable-page .company-reading-blue .company-portfolio-links b {
  color: #a9e7ff;
}

body.company-readable-page #about-company {
  padding-block: clamp(2.75rem, 5vw, 4.5rem);
}

body.company-readable-page #about-company > .max-w-\[2560px\] {
  width: min(calc(100% - clamp(2rem, 8vw, 12rem)), 78rem);
  max-width: 78rem;
  margin-inline: auto;
  padding-inline: 0;
}

body.company-readable-page #about-company > .max-w-\[2560px\] > .max-w-4xl h2 {
  max-width: 20ch;
  font-size: clamp(2rem, 4vw, 3.5rem);
}

body.company-readable-page #about-company > .max-w-\[2560px\] > .max-w-4xl p {
  max-width: 64ch;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
}

body.company-readable-page #about-company > .max-w-\[2560px\] > .flex.flex-wrap button {
  min-height: 3.25rem;
}

body.company-readable-page #about-company #about-tab-content {
  padding: clamp(1.25rem, 3vw, 2.5rem);
}

body.company-readable-page .company-people-links a {
  min-height: 0;
}

body.pricing-neural-page .pricing-neural-hero {
  background: #020712 !important;
}

body.pricing-neural-page .pricing-neural-hero .site-hero-image {
  opacity: 1;
}

body.pricing-neural-page .pricing-neural-hero .site-hero-image::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(2, 7, 18, .48), rgba(2, 7, 18, .7));
  content: "";
  pointer-events: none;
}

.home-discovery-section {
  padding: clamp(2.75rem, 5vw, 4.5rem) 0;
  background: #f4f8fc;
  scroll-margin-top: 6.5rem;
}

.home-discovery-inner {
  width: min(calc(100% - clamp(2rem, 8vw, 12rem)), 82rem);
  margin-inline: auto;
}

.home-discovery-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.5rem;
}

.home-discovery-header h2 {
  max-width: 18ch;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.home-discovery-header p {
  max-width: 55ch;
  margin-top: .6rem;
  color: #334155;
  font-size: 1rem;
  line-height: 1.65;
}

.home-discovery-header > a {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1rem;
  border: 1px solid #b9cbe3;
  border-radius: .7rem;
  color: #0039a6;
  font-size: .9rem;
  font-weight: 800;
  text-decoration: none;
}

.home-discovery-header > a:hover,
.home-discovery-header > a:focus-visible {
  border-color: #0039a6;
  background: #fff;
}

.home-discovery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.home-discovery-feature {
  position: relative;
  display: flex;
  min-height: 17rem;
  align-items: end;
  overflow: hidden;
  border-radius: 1rem;
  background: #001a4d;
  color: #fff;
  text-decoration: none;
  isolation: isolate;
}

.home-discovery-feature::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 15, 42, .08) 12%, rgba(0, 15, 42, .9) 100%);
  content: "";
}

.home-discovery-feature > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.home-discovery-feature:hover > img,
.home-discovery-feature:focus-visible > img {
  transform: scale(1.035);
}

.home-discovery-copy {
  display: grid;
  gap: .5rem;
  padding: 1.25rem;
}

.home-discovery-copy strong {
  max-width: 18ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.35rem, 2vw, 1.85rem);
  line-height: 1.15;
}

.home-discovery-copy small {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  color: #eef6ff;
  font-size: .9rem;
  line-height: 1.5;
}

.home-discovery-copy small b {
  flex: 0 0 auto;
  color: #6fe5c1;
  font-size: 1.15rem;
}

.home-discovery-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1.25rem;
  border-top: 1px solid #c8d7e8;
  border-bottom: 1px solid #c8d7e8;
}

.home-discovery-links a {
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .75rem 1rem;
  border-right: 1px solid #c8d7e8;
  color: #00306f;
  font-size: .9rem;
  font-weight: 800;
  text-decoration: none;
}

.home-discovery-links a:last-child {
  border-right: 0;
}

.home-discovery-links a:hover,
.home-discovery-links a:focus-visible {
  background: #fff;
  color: #0039a6;
}

.home-discovery-links a span {
  color: #008a70;
}

@media (max-width: 760px) {
  .home-discovery-inner {
    width: min(calc(100% - 2rem), 42rem);
  }

  .home-discovery-header {
    align-items: start;
    flex-direction: column;
    gap: 1rem;
  }

  .home-discovery-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-discovery-feature {
    min-height: 15rem;
  }

  .home-discovery-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-discovery-links a:nth-child(2) {
    border-right: 0;
  }

  .home-discovery-links a:nth-child(n + 3) {
    border-top: 1px solid #c8d7e8;
  }

  body.company-readable-page #about-company > .max-w-\[2560px\] {
    width: min(calc(100% - 2rem), 78rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-discovery-feature > img {
    transition: none;
  }
}

body.company-readable-page .company-people-links span {
  color: #dbeafe;
}

/* Let the wide pages keep their proportions as zoom changes the CSS viewport. */
.detail-shell {
  width: min(calc(100% - clamp(1.5rem, 4vw, 4rem)), 2560px);
}

.homepage-open-section > .max-w-\[2560px\] {
  width: 100%;
  max-width: 2560px;
}

.company-overview-inner,
.company-mandate-inner,
.company-purpose > .detail-shell,
.company-services-section > .detail-shell,
.company-credentials-section > .detail-shell,
.company-connectivity-pricing > .detail-shell,
.company-portfolio-section > .detail-shell,
.company-people-section > .detail-shell {
  width: min(calc(100% - clamp(1.5rem, 4vw, 4rem)), 160rem);
  max-width: 160rem;
}

.company-team-page .detail-shell {
  width: min(calc(100% - clamp(1.5rem, 3vw, 3rem)), 160rem);
  max-width: 160rem;
}

.company-area-nav {
  display: flex;
  gap: .35rem;
  width: min(calc(100% - clamp(1.5rem, 4vw, 4rem)), 160rem);
  margin: 0 auto;
  padding: .85rem 0;
  overflow-x: auto;
  border-bottom: 1px solid #dbe4ed;
  scrollbar-width: thin;
}

.company-area-nav a {
  display: inline-flex;
  min-height: 2.75rem;
  flex: 0 0 auto;
  align-items: center;
  padding: .6rem .9rem;
  border-radius: .55rem;
  color: #334a67;
  font-size: .9rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.company-area-nav a:hover,
.company-area-nav a:focus-visible {
  background: #eff6ff;
  color: #0039a6;
}

.company-area-nav a[aria-current="page"] {
  background: #e8f2fc;
  color: #00306f;
}

.company-area-nav a:focus-visible {
  outline: 3px solid #0876b9;
  outline-offset: 2px;
}

body.company-team-page .company-directory-content {
  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 24rem), .9fr);
  gap: clamp(2rem, 5vw, 5rem);
}

body.company-team-page .company-directory-content > * {
  min-width: 0;
}

body.company-team-page .company-directory-content > div > p {
  max-width: 68ch;
}

body.company-team-page .company-directory-notice p {
  max-width: 58ch;
}

body.company-team-page .company-people-links {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

body.company-team-page .company-team-links {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: 0 clamp(1rem, 2vw, 2rem);
}

body.company-team-page .company-team-links a,
body.company-team-page .company-team-links a:nth-child(odd) {
  min-width: 0;
  border-right: 0;
}

body.company-team-page .company-executive-profile {
  width: min(100%, 76rem);
}

.billing-internet-pricing-inner {
  width: min(100% - 2.5rem, 160rem);
}

.billing-internet-group:nth-child(2) {
  container-type: inline-size;
}

@container (min-width: 68rem) {
  .billing-internet-group:nth-child(2) .billing-internet-rates {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body.company-team-page .company-directory-content {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 540px) {
  .homepage-open-section > .max-w-\[2560px\] {
    width: 100%;
  }

  body.company-team-page .detail-shell {
    width: min(calc(100% - 1.5rem), 160rem);
  }
}

body.company-readable-page .company-directory-notice {
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid #bfdbfe;
  border-radius: 1rem;
  background: #fff;
}

body.company-readable-page .company-executive-profile {
  display: grid;
  grid-template-columns: minmax(12rem, .55fr) minmax(0, 1.45fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 4rem);
  max-width: 68rem;
  margin-top: 2rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid #bfdbfe;
  border-radius: 1rem;
  background: #fff;
}

body.company-readable-page .company-executive-profile img {
  width: 100%;
  max-height: 24rem;
  border-radius: .75rem;
  object-fit: cover;
  object-position: center 25%;
}

body.company-readable-page .company-executive-profile h3 {
  color: #001a4d;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 900;
}

body.company-readable-page .company-executive-profile .company-profile-role {
  margin: .25rem 0 1rem;
  color: #0039a6;
  font-weight: 800;
}

body.company-readable-page .company-primary-link {
  display: inline-flex;
  margin-top: 1.25rem;
  color: #0039a6;
  font-size: 1rem;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .2em;
}

body.company-readable-page .company-profile-footnote {
  margin-top: 1.5rem;
  color: #475569;
  font-size: .95rem;
}

body.company-readable-page .company-team-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 2rem;
  border-top: 1px solid #b9cbe3;
}

body.company-readable-page .company-team-links a {
  min-height: 0;
  border-right: 0;
  padding: 1.25rem .5rem;
}

body.company-readable-page .company-team-links a:nth-child(odd) {
  border-right: 1px solid #b9cbe3;
}

body.company-readable-page .company-team-links span {
  color: #334155;
}

@media (max-width: 760px) {
  body.company-readable-page .company-identity-grid,
  body.company-readable-page .company-mandate,
  body.company-readable-page .company-target,
  body.company-readable-page .company-directory-content,
  body.company-readable-page .company-section-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  body.company-readable-page .company-portfolio-links,
  body.company-readable-page .company-people-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.company-readable-page .company-executive-profile {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-executive-profile img {
    width: min(100%, 24rem);
    max-height: 26rem;
  }
}

@media (max-width: 480px) {
  body.company-readable-page .company-portfolio-links,
  body.company-readable-page .company-people-links,
  body.company-readable-page .company-team-links {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-portfolio-links a,
  body.company-readable-page .company-people-links a,
  body.company-readable-page .company-team-links a,
  body.company-readable-page .company-team-links a:nth-child(odd) {
    min-height: 0;
    border-right: 0;
  }
}

.company-hero {
  position: relative;
  display: grid;
  min-height: min(39rem, calc(100svh - 6rem));
  grid-template-columns: minmax(0, 1.1fr) minmax(17rem, .9fr);
  align-items: stretch;
  overflow: hidden;
  background: #06152d;
  color: #fff;
}

.company-hero-inner {
  position: relative;
  z-index: 1;
  width: min(100% - clamp(2rem, 8vw, 7rem), 52rem);
  justify-self: end;
  align-self: center;
  padding: clamp(3rem, 7vw, 6rem) clamp(2rem, 5vw, 5rem) clamp(3rem, 7vw, 6rem) 0;
}

.company-hero h1 {
  max-width: 13ch;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2.8rem, 5.3vw, 5.35rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: 1.02;
  text-wrap: balance;
}

.company-hero-copy {
  max-width: 62ch;
  margin-top: 1.25rem;
  color: #e7f0fb;
  font-size: clamp(1rem, 1.2vw, 1.15rem);
  line-height: 1.7;
}

.company-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem 1.25rem;
  margin-top: 1.65rem;
}

.company-hero-actions a {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  gap: .6rem;
  color: #fff;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: #83ead0;
  text-underline-offset: .25em;
}

.company-hero-actions a:first-child {
  padding: .7rem 1rem;
  background: #0876b9;
  text-decoration: none;
}

.company-hero-actions a:hover,
.company-hero-actions a:focus-visible {
  color: #a7f3d9;
}

.company-hero-image {
  min-height: 100%;
  background:
    linear-gradient(90deg, #06152d 0%, rgba(6, 21, 45, .55) 22%, rgba(6, 21, 45, .06) 100%),
    url("/assets/billing/cafe-management.jpg") center / cover no-repeat,
    #0b3150;
}

.company-overview {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #f3f7fb;
}

.company-overview-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(17rem, .7fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 78rem;
}

.company-overview-copy h2,
.company-purpose h2,
.company-mandate-heading h2,
.company-services-heading h2,
.company-credentials-inner h2,
.company-connectivity-pricing h2,
.company-portfolio-section h2,
.company-people-section h2 {
  max-width: 18ch;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 3.8vw, 3.35rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.company-overview-copy p {
  max-width: 68ch;
  margin-top: 1rem;
  color: #293f5c;
  font-size: 1.03rem;
  line-height: 1.75;
}

.company-overview-copy > p strong {
  color: #00306f;
  font-size: clamp(1.2rem, 2vw, 1.45rem);
  font-weight: 850;
  line-height: 1.35;
}

.company-overview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  margin-top: 1.5rem;
}

.company-overview-actions a {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  gap: .55rem;
  color: #00306f;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: #0876b9;
  text-underline-offset: .22em;
}

.company-overview-actions a:first-child {
  padding: .7rem 1rem;
  background: #0759a5;
  color: #fff;
  text-decoration: none;
}

.company-overview-actions a:hover,
.company-overview-actions a:focus-visible {
  color: #0052cc;
}

.company-overview-actions a:first-child:hover,
.company-overview-actions a:first-child:focus-visible {
  background: #003f80;
  color: #fff;
}

.company-leader-portrait {
  margin: 0;
}

.company-leader-portrait img {
  display: block;
  width: 100%;
  max-height: 23rem;
  object-fit: cover;
  object-position: center 25%;
}

.company-leader-portrait figcaption {
  display: grid;
  gap: .2rem;
  padding-top: .8rem;
}

.company-leader-portrait figcaption strong {
  color: #001a4d;
  font-size: 1rem;
}

.company-leader-portrait figcaption span {
  color: #425875;
  font-size: .9rem;
}

.company-purpose {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #fff;
}

.company-connectivity-pricing > .detail-shell,
.company-portfolio-section > .detail-shell {
  max-width: 78rem;
}

.company-purpose > .detail-shell {
  max-width: 160rem;
}

.company-purpose header,
.company-connectivity-pricing header,
.company-portfolio-section header,
.company-people-section header {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: end;
  gap: 1.5rem 4rem;
  margin-bottom: 2rem;
}

.company-purpose header p,
.company-connectivity-pricing header p,
.company-portfolio-section header p,
.company-people-section header p {
  max-width: 62ch;
  color: #334a67;
  font-size: 1rem;
  line-height: 1.7;
}

.company-purpose-grid {
  display: block;
  border: 0;
}

.company-purpose-grid .home-card-carousel-track > article {
  display: flex;
  flex: 0 0 clamp(17rem, 28vw, 25rem);
  flex-direction: column;
  min-height: 14rem;
  padding: clamp(1.35rem, 2vw, 1.8rem);
  border: 1px solid #d6e2ef;
  border-radius: 1rem;
  background: #f7fafd;
  scroll-snap-align: start;
}

.company-purpose-grid .home-card-carousel-track > article:nth-child(even) {
  background: #eef5fb;
}

.company-purpose-grid article {
  min-width: 0;
}

.company-purpose-grid article + article {
  padding-left: clamp(1.35rem, 2vw, 1.8rem);
}

.company-purpose-grid h3 {
  color: #00306f;
  font-size: 1.1rem;
  font-weight: 850;
}

.company-purpose-grid p {
  margin-top: .65rem;
  color: #334a67;
  font-size: .95rem;
  line-height: 1.65;
}

.company-purpose-grid p strong {
  display: block;
  margin-bottom: .35rem;
  color: #00306f;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .01em;
}

.company-purpose-grid .home-card-carousel-track {
  padding-top: .25rem;
}

.company-purpose-grid .home-card-carousel-track::-webkit-scrollbar {
  height: .45rem;
}

.company-mandate-section {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #08254a;
  color: #fff;
}

.company-mandate-inner {
  display: grid;
  grid-template-columns: minmax(15rem, .75fr) minmax(0, 1.25fr);
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 78rem;
}

.company-mandate-heading h2,
.company-people-section h2 {
  color: #fff;
}

.company-mandate-heading p {
  max-width: 48ch;
  margin-top: 1rem;
  color: #dceafb;
  font-size: 1rem;
  line-height: 1.7;
}

.company-mandate-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.company-mandate-list li {
  display: grid;
  align-content: start;
  gap: .45rem;
  padding: 1.1rem 0;
  border-top: 1px solid rgba(220, 234, 251, .34);
}

.company-mandate-list strong {
  color: #fff;
  font-size: 1rem;
}

.company-mandate-list span {
  color: #dceafb;
  font-size: .94rem;
  line-height: 1.65;
}

.company-services-section {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #f3f7fb;
}

.company-services-section > .detail-shell {
  max-width: 78rem;
}

.company-services-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: end;
  gap: 1.5rem 4rem;
  margin-bottom: 1.75rem;
}

.company-services-heading p {
  max-width: 64ch;
  color: #334a67;
  font-size: 1rem;
  line-height: 1.7;
}

.company-service-lines {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid #b8c8da;
}

.company-service-lines a {
  display: grid;
  gap: .35rem;
  padding: 1.1rem 1rem 1.1rem 0;
  border-bottom: 1px solid #b8c8da;
  color: #001a4d;
  text-decoration: none;
}

.company-service-lines a:nth-child(even) {
  padding-left: 1.25rem;
  border-left: 1px solid #cbd5e1;
}

.company-service-lines strong {
  font-size: 1rem;
  font-weight: 850;
}

.company-service-lines span {
  color: #334a67;
  font-size: .9rem;
  line-height: 1.5;
}

.company-service-lines a:hover strong,
.company-service-lines a:focus-visible strong {
  color: #0052cc;
  text-decoration: underline;
  text-underline-offset: .18em;
}

.company-credentials-section {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #06152d;
  color: #fff;
}

.company-credentials-inner {
  display: block;
  max-width: 160rem;
}

.company-credentials-inner > div {
  max-width: 82rem;
}

.company-credentials-inner h2 {
  color: #fff;
}

.company-credentials-inner > div > p {
  max-width: 62ch;
  margin-top: 1rem;
  color: #e2edf8;
  font-size: 1rem;
  line-height: 1.7;
}

.company-credentials-inner aside {
  margin-top: clamp(1.75rem, 4vw, 3rem);
  padding: 1.25rem 0 0;
  border-top: 1px solid rgba(226, 237, 248, .44);
}

.company-credentials-inner h3 {
  color: #a7f3d9;
  font-size: 1.1rem;
  font-weight: 850;
}

.company-credentials-inner aside p {
  margin-top: .75rem;
  color: #e2edf8;
  font-size: .95rem;
  line-height: 1.7;
}

.company-credentials-inner aside ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: .8rem;
  margin-top: .9rem;
  padding: 0;
  list-style: none;
}

.company-credentials-inner aside li {
  color: #e2edf8;
  font-size: .95rem;
  line-height: 1.65;
}

.company-credentials-inner aside li strong {
  color: #fff;
}

.company-hotspot-details {
  padding-block: clamp(3rem, 5vw, 4.5rem);
  background: #f3f7fb;
  scroll-margin-top: 7rem;
}

.company-hotspot-details-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, .8fr);
  align-items: end;
  gap: 1rem 3rem;
}

.company-hotspot-details-heading h2 {
  max-width: 22ch;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.7rem, 3vw, 2.5rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.15;
  text-wrap: balance;
}

.company-hotspot-details-heading p {
  max-width: 55ch;
  color: #334a67;
  font-size: .98rem;
  line-height: 1.65;
}

.company-hotspot-carousel {
  margin-top: 1.75rem;
  border-top: 1px solid #b8c8da;
  border-bottom: 1px solid #b8c8da;
}

.company-hotspot-carousel-track {
  min-height: 15rem;
  padding-block: clamp(1.5rem, 3vw, 2.25rem);
  outline: none;
}

.company-hotspot-carousel-track:focus-visible {
  outline: 3px solid #0067c5;
  outline-offset: 4px;
}

.company-hotspot-slide {
  width: min(100%, 78ch);
  max-width: 78ch !important;
}

.company-hotspot-slide h3 {
  max-width: 38ch;
  color: #00306f;
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.25;
}

.company-hotspot-slide p {
  margin-top: .8rem;
  color: #263f5c;
  font-size: 1rem;
  line-height: 1.75;
}

.company-hotspot-slide a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .4rem;
  margin-top: 1rem;
  color: #003f80;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .2em;
}

.company-hotspot-carousel-controls {
  display: flex;
  min-height: 4.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid #d1dce8;
}

.company-hotspot-carousel-controls > button {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .5rem;
  padding: .5rem .7rem;
  border: 1px solid #aebfd2;
  color: #00306f;
  font-size: .88rem;
  font-weight: 800;
}

.company-hotspot-carousel-controls > button:hover,
.company-hotspot-carousel-controls > button:focus-visible {
  border-color: #003f80;
  background: #fff;
}

.company-hotspot-carousel-dots {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.company-hotspot-carousel-dots button {
  display: grid;
  width: 2.5rem;
  height: 2.75rem;
  place-items: center;
}

.company-hotspot-carousel-dots button::before {
  width: .55rem;
  height: .55rem;
  border: 1px solid #45617f;
  border-radius: 50%;
  background: transparent;
  content: "";
}

.company-hotspot-carousel-dots button[aria-current="true"]::before {
  width: 1.4rem;
  border-color: #0052a5;
  border-radius: 999px;
  background: #0052a5;
}

.company-hotspot-carousel-status {
  color: #425a73;
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
}

.company-connectivity-pricing {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #fff;
}

.company-connectivity-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid #b8c8da;
  border-bottom: 1px solid #b8c8da;
}

.company-connectivity-options article {
  padding: 1.4rem 1.5rem 1.5rem 0;
}

.company-connectivity-options article + article {
  padding-left: 1.5rem;
  border-left: 1px solid #cbd5e1;
}

.company-connectivity-options h3 {
  color: #00306f;
  font-size: 1.25rem;
  font-weight: 850;
}

.company-connectivity-options p {
  max-width: 56ch;
  margin-top: .65rem;
  color: #334a67;
  font-size: .95rem;
  line-height: 1.65;
}

.company-connectivity-options span {
  display: block;
  margin-top: 1rem;
  color: #001a4d;
  font-size: .9rem;
  font-weight: 800;
}

.company-connectivity-tiers {
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}

.company-connectivity-tiers li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .6rem 1rem;
  padding: 1rem 0;
  border-top: 1px solid #cbd5e1;
}

.company-connectivity-tiers h4 {
  color: #001a4d;
  font-size: 1rem;
  font-weight: 850;
}

.company-connectivity-tiers li p {
  margin-top: .25rem;
}

.company-connectivity-tiers li p strong {
  color: #00306f;
  font-size: 1.05rem;
}

.company-connectivity-tiers .company-connectivity-vat {
  color: #334a67;
  font-size: .82rem;
}

.company-connectivity-tiers a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .65rem .8rem;
  background: #0759a5;
  color: #fff;
  font-size: .82rem;
  font-weight: 800;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
}

.company-connectivity-tiers a:hover,
.company-connectivity-tiers a:focus-visible {
  background: #003f80;
}

.company-connectivity-options .company-connectivity-popular {
  display: inline-block;
  margin-left: .35rem;
  margin-top: 0;
  padding: .15rem .45rem;
  background: #e4f4ef;
  color: #075a47;
  font-size: .68rem;
  font-weight: 800;
  vertical-align: .12em;
  line-height: 1.4;
}

.company-connectivity-notes {
  display: grid;
  gap: .65rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid #b8c8da;
}

.company-connectivity-notes p {
  max-width: 78ch;
  color: #334a67;
  font-size: .92rem;
  line-height: 1.65;
}

.company-connectivity-notes strong {
  color: #001a4d;
}

.company-connectivity-cta {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  gap: .65rem;
  margin-top: 1.35rem;
  padding: .75rem 1rem;
  background: #0759a5;
  color: #fff;
  font-weight: 850;
  text-decoration: none;
}

.company-connectivity-cta:hover,
.company-connectivity-cta:focus-visible {
  background: #003f80;
}

.company-portfolio-section {
  padding-block: clamp(3.5rem, 6vw, 5.5rem);
  background: #f3f7fb;
}

.company-brand-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #b8c8da;
  border-bottom: 1px solid #b8c8da;
}

.company-brand-strip a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .2rem .6rem;
  align-content: center;
  min-height: 5.5rem;
  padding: .9rem 1rem .9rem 0;
  color: #001a4d;
  text-decoration: none;
}

.company-brand-strip a + a {
  padding-left: 1rem;
  border-left: 1px solid #cbd5e1;
}

.company-brand-strip strong {
  font-size: 1.15rem;
  font-weight: 900;
}

.company-brand-strip span {
  color: #334a67;
  font-size: .86rem;
  line-height: 1.4;
}

.company-brand-strip b {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  color: #0052cc;
}

.company-brand-strip a:hover strong,
.company-brand-strip a:focus-visible strong {
  color: #0052cc;
}

.company-partner-note {
  max-width: 78ch;
  margin-top: 1rem;
  color: #425875;
  font-size: .9rem;
  line-height: 1.6;
}

.company-people-section {
  padding-block: clamp(3rem, 5vw, 4.25rem);
  background: #08254a;
  color: #fff;
}

.company-people-section > .detail-shell {
  max-width: 78rem;
}

.company-people-section header {
  margin-bottom: 1.5rem;
}

.company-people-section header p {
  color: #dceafb;
}

.company-people-links {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top-color: rgba(220, 234, 251, .38);
}

.company-people-links a {
  min-height: 5.5rem;
  padding: 1rem 1rem 1rem 0;
  border-color: rgba(220, 234, 251, .38);
  color: #fff;
}

.company-people-links a + a {
  padding-left: 1rem;
}

.company-people-links a:hover,
.company-people-links a:focus-visible {
  background: rgba(255, 255, 255, .08);
}

.company-people-links span {
  color: #dceafb;
}

.company-board-leader {
  display: grid;
  grid-template-columns: minmax(9rem, .48fr) minmax(0, 1fr);
  align-items: center;
  gap: 1.25rem;
  padding-top: 1rem;
  border-top: 2px solid #0759a5;
}

.company-board-leader img {
  display: block;
  width: 100%;
  max-height: 13rem;
  object-fit: cover;
  object-position: center 25%;
}

.company-board-leader h3 {
  color: #001a4d;
  font-size: 1.35rem;
  font-weight: 900;
}

.company-board-leader .company-profile-role {
  margin-top: .25rem;
  color: #0039a6;
  font-weight: 800;
}

.company-board-leader p:not(.company-profile-role) {
  margin-top: .65rem;
  color: #334a67;
  font-size: .92rem;
  line-height: 1.6;
}

.company-board-content {
  align-items: center;
}

.company-readable-page :is(.company-hero, .company-overview, .company-purpose,
.company-mandate-section, .company-services-section, .company-credentials-section,
.company-hotspot-details, .company-connectivity-pricing, .company-portfolio-section,
.company-people-section)
  :is(a, button):focus-visible,
.company-board-leader a:focus-visible {
  outline: 3px solid #73d9ff;
  outline-offset: 4px;
}

@media (max-width: 850px) {
  .managed-wifi-home-teaser {
    grid-template-columns: minmax(0, 1fr);
  }

  .managed-wifi-home-section--compact .managed-wifi-home-links {
    margin-top: .25rem;
  }

  .company-hotspot-details-heading {
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
  }

  .company-hero {
    min-height: 0;
    grid-template-columns: minmax(0, 1fr);
  }

  .company-hero-inner {
    width: min(calc(100% - 2rem), 52rem);
    justify-self: center;
    padding: 4rem 0 2.5rem;
  }

  .company-hero-image {
    min-height: 16rem;
    background:
      linear-gradient(0deg, #06152d 0%, rgba(6, 21, 45, .08) 70%),
      url("/assets/billing/cafe-management.jpg") center / cover no-repeat,
      #0b3150;
  }

  .company-purpose-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .company-purpose-grid article:nth-child(3) {
    border-left: 0;
  }

  .company-purpose-grid article:nth-child(n + 3) {
    border-top: 1px solid #cbd5e1;
  }

  .company-mandate-inner,
  .company-credentials-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-people-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .company-hotspot-carousel-track {
    min-height: 18rem;
  }

  .company-hotspot-carousel-controls {
    flex-wrap: wrap;
    justify-content: center;
    padding-block: .5rem;
  }

  .company-hotspot-carousel-status {
    flex-basis: 100%;
    order: 1;
    text-align: center;
  }

  .company-overview-inner,
  .company-purpose header,
  .company-services-heading,
  .company-connectivity-pricing header,
  .company-portfolio-section header,
  .company-people-section header {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-leader-portrait {
    max-width: 22rem;
  }

  .company-purpose-grid,
  .company-mandate-list,
  .company-service-lines,
  .company-connectivity-options,
  .company-brand-strip {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-purpose-grid article,
  .company-purpose-grid article + article,
  .company-service-lines a,
  .company-service-lines a:nth-child(even),
  .company-connectivity-options article,
  .company-connectivity-options article + article,
  .company-brand-strip a,
  .company-brand-strip a + a {
    padding-inline: 0;
    border-left: 0;
  }

  .company-connectivity-tiers li {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .company-connectivity-tiers a {
    justify-self: start;
  }

  .company-purpose-grid article + article,
  .company-service-lines a,
  .company-connectivity-options article + article,
  .company-brand-strip a + a {
    border-top: 1px solid #cbd5e1;
  }

  .company-purpose-grid article {
    min-height: 0;
    padding-block: 1.1rem;
  }

  .company-people-links {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-people-links a,
  .company-people-links a + a {
    padding-inline: 0;
  }

  .company-board-leader {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-board-leader img {
    width: min(100%, 16rem);
    max-height: 17rem;
  }
}

.detail-hero h1 {
  max-width: 18ch;
  color: #fff;
  font-size: clamp(2.75rem, 6vw, 7.5rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .99;
  text-wrap: balance;
}

.detail-hero p {
  max-width: 62ch;
}

.directory-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(15rem, .65fr);
  align-items: end;
  gap: clamp(2rem, 7vw, 6rem);
}

.directory-hero-side {
  display: grid;
  gap: 1.25rem;
}

.directory-hero-photo {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  margin: 0;
  background: #0d2039;
}

.directory-hero-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.directory-hero-note {
  padding: 1.25rem 0 0;
  border-top: 1px solid rgba(226, 232, 240, .38);
}

.directory-note-label {
  margin: 0 0 .8rem;
  color: #bfdbfe;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
}

.directory-hero-note > a {
  display: grid;
  grid-template-columns: 2rem 1fr auto;
  align-items: center;
  gap: .75rem;
  min-height: 3.6rem;
  border-top: 1px solid rgba(226, 232, 240, .18);
  color: #fff;
  text-decoration: none;
}

.directory-hero-note > a > span:first-child {
  color: #67e8f9;
  font-size: .75rem;
  font-weight: 800;
}

.directory-hero-note > a > strong {
  font-size: .94rem;
}

.directory-hero-note > a > span:last-child {
  color: #67e8f9;
  transition: transform .2s ease;
}

.resource-shortcuts > a {
  grid-template-columns: minmax(0, 1fr) auto;
}

.directory-hero-note > a:hover > span:last-child,
.directory-hero-note > a:focus-visible > span:last-child {
  transform: translate(2px, 2px);
}

.directory-hero-note > a:focus-visible,
.detail-actions a:focus-visible,
.text-link:focus-visible,
.resource-read-link:focus-visible,
.resource-list h4 a:focus-visible,
.product-next-step-inner > a:focus-visible {
  outline: 3px solid #67e8f9;
  outline-offset: 4px;
}

.detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 2rem;
}

.detail-actions a,
.detail-cta a,
.product-next-step-inner > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 2.9rem;
  padding: .75rem 1rem;
  border: 1px solid #fff;
  border-radius: .35rem;
  background: #fff;
  color: #001a4d;
  font-size: .875rem;
  font-weight: 800;
  text-decoration: none;
}

.detail-actions a + a {
  border-color: rgba(255, 255, 255, .38);
  background: rgba(255, 255, 255, .08);
  color: #fff;
}

.detail-actions a:hover,
.detail-cta a:hover,
.product-next-step-inner > a:hover {
  transform: translateY(-2px);
}

.detail-section {
  padding: clamp(3.75rem, 7vw, 6rem) 0;
}

body:not(.theme-dark) .detail-section p:is(.text-slate-400, .text-slate-500, .text-slate-600, .text-slate-700) {
  color: #334155;
  font-size: max(1rem, 1em);
  line-height: 1.7;
}

.directory-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, .75fr);
  align-items: end;
  gap: 1.5rem 3rem;
  margin-bottom: 2.5rem;
}

.directory-section-heading h2 {
  max-width: 19ch;
  color: #001a4d;
  font-size: clamp(1.9rem, 4vw, 3.15rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.05;
  text-wrap: balance;
}

.directory-section-heading > p {
  max-width: 58ch;
  margin: 0;
  color: #43546b;
  font-size: 1rem;
  line-height: 1.75;
}

.product-list {
  border-top: 1px solid #cbd5e1;
}

.product-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, .85fr);
  gap: clamp(2rem, 8vw, 8rem);
  padding: clamp(2rem, 5vw, 4rem) 0;
  border-bottom: 1px solid #cbd5e1;
  scroll-margin-top: 6rem;
}

.product-row-intro h3,
.project-area-list h3 {
  max-width: 16ch;
  margin: 0;
  color: #001a4d;
  font-size: clamp(1.65rem, 3vw, 2.3rem);
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: 1.08;
}

.product-audience {
  margin: 0 0 .7rem;
  color: #075e54;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
}

.product-row-intro > p:not(.product-audience) {
  max-width: 48ch;
  margin: 1rem 0 1.4rem;
  color: #43546b;
  font-size: 1rem;
  line-height: 1.75;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: #0039a6;
  font-size: .92rem;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: #93c5fd;
  text-underline-offset: .25rem;
}

.text-link:hover {
  text-decoration-color: currentColor;
}

.product-row-detail {
  align-self: center;
  padding-top: .25rem;
}

.product-row-detail h4 {
  margin: 0 0 .9rem;
  color: #001a4d;
  font-size: 1rem;
  font-weight: 850;
}

.product-row-detail ul,
.project-preparation ul {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-row-detail li,
.project-preparation li {
  position: relative;
  padding-left: 1.35rem;
  color: #334155;
  font-size: .94rem;
  line-height: 1.6;
}

.product-row-detail li::before,
.project-preparation li::before {
  position: absolute;
  left: 0;
  color: #047857;
  content: "•";
  font-size: 1.1rem;
  font-weight: 900;
}

.product-fit {
  margin: 1.25rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid #dbe5f1;
  color: #52627a;
  font-size: .88rem;
  line-height: 1.65;
}

.product-brand-panel {
  display: grid;
  grid-template-columns: minmax(8rem, .7fr) minmax(10rem, 1fr);
  align-items: center;
  gap: 1.5rem;
  padding: 1.5rem;
  background: #eaf4f6;
}

.product-brand-panel img {
  width: 100%;
  max-width: 14rem;
  max-height: 8rem;
  margin-inline: auto;
  object-fit: contain;
}

.product-brand-panel p {
  margin: 0;
  color: #284456;
  font-size: .92rem;
  line-height: 1.7;
}

.product-next-step {
  padding: clamp(2.5rem, 5vw, 4rem) 0;
  background: #eaf1fa;
}

.product-next-step-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.product-next-step h2,
.project-preparation h2 {
  max-width: 22ch;
  margin: 0;
  color: #001a4d;
  font-size: clamp(1.6rem, 3.3vw, 2.4rem);
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: 1.1;
}

.product-next-step p,
.project-preparation-inner > div > p {
  max-width: 58ch;
  margin: .8rem 0 0;
  color: #43546b;
  font-size: .96rem;
  line-height: 1.7;
}

.product-next-step-inner > a {
  flex: 0 0 auto;
  border-color: #0039a6;
  background: #0039a6;
  color: #fff;
}

.detail-cta {
  padding: clamp(3.5rem, 7vw, 5.5rem) 0;
}

.detail-cta h2 {
  max-width: 18ch;
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.25rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.05;
}

.detail-cta p {
  max-width: 65ch;
  margin: 1rem 0;
}

.detail-cta a {
  margin-top: .5rem;
}

html.js .detail-hero h1 {
  animation: directory-title-arrive .7s cubic-bezier(.16, 1, .3, 1) both;
}

html.js .directory-hero-photo img {
  animation: directory-photo-arrive 1s cubic-bezier(.16, 1, .3, 1) both;
}

@keyframes directory-title-arrive {
  from { opacity: 0; transform: translateY(1rem); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes directory-photo-arrive {
  from { opacity: .65; transform: scale(1.08); clip-path: inset(8% 5% 8% 5%); }
  to { opacity: 1; transform: scale(1); clip-path: inset(0); }
}

.resource-index {
  background: #f8fafc;
}

.resource-groups {
  border-top: 1px solid #cbd5e1;
}

.resource-group {
  display: grid;
  grid-template-columns: minmax(12rem, .65fr) minmax(0, 1.35fr);
  gap: 1.25rem clamp(2rem, 6vw, 6rem);
  padding: 2.25rem 0;
  border-bottom: 1px solid #cbd5e1;
  scroll-margin-top: 6rem;
}

.resource-group-heading h3 {
  max-width: 15ch;
  margin: 0;
  color: #001a4d;
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
  font-weight: 850;
  letter-spacing: -.025em;
  line-height: 1.2;
}

.resource-group-heading p {
  max-width: 34ch;
  margin: .65rem 0 0;
  color: #52627a;
  font-size: .9rem;
  line-height: 1.65;
}

.resource-list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.resource-list li {
  display: grid;
  grid-template-columns: minmax(6rem, .35fr) minmax(0, 1fr) auto;
  align-items: start;
  gap: .85rem 1rem;
  padding: 1rem 0;
  border-top: 1px solid #dbe5f1;
}

.resource-list li:first-child {
  padding-top: 0;
  border-top: 0;
}

.resource-topic {
  padding-top: .25rem;
  color: #075e54;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .07em;
}

.resource-list h4 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.4;
}

.resource-list h4 a {
  color: #001a4d;
  text-decoration-color: #94a3b8;
  text-underline-offset: .18rem;
}

.resource-list h4 a:hover {
  color: #0039a6;
  text-decoration-color: currentColor;
}

.resource-list li > div > p {
  margin: .35rem 0 0;
  color: #45566f;
  font-size: .88rem;
  line-height: 1.6;
}

.resource-read-link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: #0039a6;
  font-size: .82rem;
  font-weight: 800;
  text-decoration: none;
}

.project-truth > p:last-child {
  max-width: 33ch;
  margin: 0;
  color: #e2e8f0;
  font-size: .95rem;
  line-height: 1.75;
}

.project-areas {
  background: #f8fafc;
}

.project-area-list {
  border-top: 1px solid #cbd5e1;
}

.project-area-list article {
  display: grid;
  grid-template-columns: minmax(12rem, .85fr) minmax(14rem, 1fr) minmax(11rem, .8fr);
  align-items: center;
  gap: 1rem 2rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid #cbd5e1;
}

.project-area-list .product-audience {
  margin-bottom: .45rem;
}

.project-area-list h3 {
  font-size: clamp(1.25rem, 2.3vw, 1.65rem);
}

.project-area-list article > p {
  margin: 0;
  color: #43546b;
  font-size: .93rem;
  line-height: 1.65;
}

.project-area-list .text-link {
  justify-self: start;
  font-size: .85rem;
}

.project-process {
  padding: clamp(3.75rem, 7vw, 6rem) 0;
  background: #fff;
}

.project-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  border-top: 1px solid #cbd5e1;
  list-style: none;
}

.project-steps li {
  padding: 1.4rem 1.25rem 0 0;
}

.project-steps li + li {
  padding-left: 1.25rem;
  border-left: 1px solid #cbd5e1;
}

.project-steps li > span {
  display: block;
  margin-bottom: 1.2rem;
  color: #047857;
  font-size: .8rem;
  font-weight: 900;
}

.project-steps h3 {
  margin: 0;
  color: #001a4d;
  font-size: 1.1rem;
  font-weight: 850;
  line-height: 1.3;
}

.project-steps p {
  margin: .7rem 0 0;
  color: #43546b;
  font-size: .9rem;
  line-height: 1.7;
}

.project-preparation {
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: #eaf1fa;
}

.project-preparation-inner {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(17rem, 1.1fr);
  gap: 2rem clamp(2rem, 8vw, 8rem);
}

.project-preparation ul {
  align-self: center;
}

body.theme-dark .detail-section,
body.theme-dark .product-next-step,
body.theme-dark .project-process,
body.theme-dark .project-preparation {
  background: #0d2039;
}

body.theme-dark .directory-section-heading h2,
body.theme-dark .product-row-intro h3,
body.theme-dark .product-row-detail h4,
body.theme-dark .product-next-step h2,
body.theme-dark .resource-group-heading h3,
body.theme-dark .resource-list h4 a,
body.theme-dark .project-area-list h3,
body.theme-dark .project-steps h3,
body.theme-dark .project-preparation h2 {
  color: #f4f8ff;
}

body.theme-dark .directory-section-heading > p,
body.theme-dark .product-row-intro > p:not(.product-audience),
body.theme-dark .product-row-detail li,
body.theme-dark .product-fit,
body.theme-dark .product-brand-panel p,
body.theme-dark .product-next-step p,
body.theme-dark .resource-group-heading p,
body.theme-dark .resource-list li > div > p,
body.theme-dark .project-area-list article > p,
body.theme-dark .project-steps p,
body.theme-dark .project-preparation-inner > div > p,
body.theme-dark .project-preparation li {
  color: #c4d1e1;
}

body.theme-dark .product-brand-panel {
  background: #152b42;
}

body.theme-dark .resource-index {
  background: #0a192e;
}

body.theme-dark .product-list,
body.theme-dark .product-row,
body.theme-dark .resource-groups,
body.theme-dark .resource-group,
body.theme-dark .resource-list li,
body.theme-dark .project-area-list,
body.theme-dark .project-area-list article,
body.theme-dark .project-steps,
body.theme-dark .project-steps li + li {
  border-color: #29415e;
}

body.theme-dark .text-link,
body.theme-dark .resource-read-link,
body.theme-dark .resource-list h4 a:hover {
  color: #8fc5ff;
}

@media (max-width: 760px) {
  html:has(head link[rel="canonical"][href$="/products/"]) {
    --closing-photo: url("/assets/billing/print-shops.jpg");
  }

  html:has(head link[rel="canonical"][href*="/resources/"]) {
    --closing-photo: url("/assets/billing/print-shops.jpg");
  }

  html:has(head link[rel="canonical"][href*="/case-studies/"]) {
    --closing-photo: url("/assets/billing/print-shops.jpg");
  }

  .footer-photo {
    background-image:
      linear-gradient(rgba(0, 12, 30, .62), rgba(0, 12, 30, .72)),
      url("/assets/billing/cafe-management.jpg") !important;
  }

  .footer-photo::before {
    background-image:
      linear-gradient(115deg, rgba(0, 26, 77, .42), rgba(0, 4, 18, .66)),
      url("/assets/billing/print-shops.jpg") !important;
  }

  .directory-hero {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .detail-hero {
    min-height: 0;
    padding-block: 6rem 3rem;
    background-position: 60% center;
  }

  body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero {
    gap: 1rem;
  }

  body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero > :first-child,
  body:is(.network-engineering-page, .hotspot-programmes-page, .hotspot-programme-detail) .directory-hero-note {
    padding: 1.25rem;
    border-radius: 1rem;
  }

  .directory-section-heading,
  .product-row,
  .project-preparation-inner {
    grid-template-columns: 1fr;
  }

  .directory-section-heading {
    align-items: start;
    gap: .8rem;
  }

  .resource-group {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .project-area-list article {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .project-area-list article > p {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}

@media (max-width: 560px) {
  .detail-hero {
    padding-top: 5.5rem;
  }

  .detail-shell {
    width: min(100% - 1.5rem, 1180px);
  }

  .detail-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .detail-actions a {
    justify-content: space-between;
    width: 100%;
  }

  .product-brand-panel {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .product-brand-panel img {
    margin-inline: 0;
  }

  .product-next-step-inner {
    align-items: flex-start;
    flex-direction: column;
  }

  .resource-list li {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .55rem .75rem;
  }

  .resource-topic {
    grid-column: 1 / -1;
  }

  .project-area-list article {
    grid-template-columns: 1fr;
    gap: .85rem;
  }
}

html:has(head link[rel="canonical"][href$="/products/managed-wifi/"]) {
  --managed-wifi-landscape: url("https://images.unsplash.com/photo-1523805009345-7448845a9e53?auto=format&fit=crop&w=2000&q=85");
  --managed-wifi-night: url("https://images.unsplash.com/photo-1516026672322-bc52d61a55d5?auto=format&fit=crop&w=1400&q=82");
}

.managed-wifi-page main {
  background: #071521;
  color: #f1f7ff;
}

.managed-wifi-page .managed-wifi-hero {
  display: grid;
  min-height: min(54rem, calc(100svh - 7.5rem));
  align-items: center;
  padding-block: clamp(4rem, 7vw, 6.5rem);
  background:
    linear-gradient(90deg, rgba(3, 12, 24, .94) 0%, rgba(3, 16, 31, .84) 48%, rgba(3, 19, 37, .4) 100%),
    var(--managed-wifi-landscape) center 54% / cover no-repeat,
    #071521;
}

.managed-wifi-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(21rem, .9fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  max-width: 82rem;
}

.managed-wifi-hero-copy {
  max-width: 43rem;
}

.managed-wifi-eyebrow,
.managed-wifi-section-label,
.managed-wifi-package-type {
  color: #7ce5ff;
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .12em;
  line-height: 1.45;
  text-transform: uppercase;
}

.managed-wifi-eyebrow {
  font-size: .68rem;
  letter-spacing: .09em;
}

.managed-wifi-hero h1 {
  max-width: 11ch;
  margin: .8rem 0 1.25rem;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(3rem, 6.3vw, 6.25rem);
  font-weight: 900;
  letter-spacing: -.055em;
  line-height: .98;
  text-wrap: balance;
}

.managed-wifi-hero-copy > p:not(.managed-wifi-eyebrow, .managed-wifi-hero-note) {
  max-width: 62ch;
  color: #f0f6fc;
  font-size: clamp(1.02rem, 1.25vw, 1.2rem);
  line-height: 1.75;
}

.managed-wifi-page .detail-actions {
  margin-top: 1.75rem;
}

.managed-wifi-page .detail-actions a {
  min-height: 3.25rem;
  border-color: rgba(191, 219, 254, .56);
  background: rgba(4, 32, 62, .72);
  color: #fff;
}

.managed-wifi-page .detail-actions a:first-child {
  border-color: #8be7ff;
  background: #0876b9;
}

.managed-wifi-page .detail-actions a:hover,
.managed-wifi-page .detail-actions a:focus-visible {
  border-color: #a4efff;
  background: #0b8aca;
}

.managed-wifi-hero-note {
  max-width: 58ch;
  margin-top: 1rem;
  color: #d0e7f8;
  font-size: .82rem;
  line-height: 1.6;
}

.managed-wifi-hero-visual {
  position: relative;
  min-height: 27rem;
  display: grid;
  align-items: end;
  padding: clamp(1rem, 2vw, 1.5rem);
  overflow: hidden;
  border: 1px solid rgba(144, 218, 255, .5);
  background: #0a2d4a;
}

.managed-wifi-landscape-photo {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 20, 42, .06), rgba(2, 16, 31, .35) 42%, rgba(2, 14, 27, .88)),
    var(--managed-wifi-night) center / cover no-repeat;
}

.managed-wifi-flow {
  position: relative;
  width: 100%;
  padding: 1rem 1rem .85rem;
  border: 1px solid rgba(122, 210, 255, .52);
  background: rgba(3, 17, 32, .94);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .32);
}

.managed-wifi-flow-label {
  color: #92d7ed;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .1em;
}

.managed-wifi-flow svg {
  display: block;
  width: 100%;
  height: auto;
  margin-top: .2rem;
}

.managed-wifi-flow > p {
  margin: .2rem 0 0;
  color: #e2f4ff;
  font-size: .78rem;
  line-height: 1.5;
}

.managed-wifi-intro {
  padding-block: clamp(2.5rem, 5vw, 4.25rem);
  background: #0874b5;
}

.managed-wifi-intro-inner {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 82rem;
}

.managed-wifi-intro h2,
.managed-wifi-section-heading h2,
.managed-wifi-system h2,
.managed-wifi-isp h2 {
  margin: .5rem 0 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-weight: 850;
  letter-spacing: -.045em;
  line-height: 1.08;
  text-wrap: balance;
}

.managed-wifi-intro-inner > p {
  max-width: 64ch;
  margin: 0;
  color: #effaff;
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.75;
}

.managed-wifi-packages {
  padding-block: clamp(3.5rem, 7vw, 6.5rem);
  background: #071521;
}

.managed-wifi-section-heading {
  max-width: 54rem;
  margin-bottom: 2.25rem;
}

.managed-wifi-section-heading > p:last-child {
  max-width: 66ch;
  margin-top: 1rem;
  color: #c7d8e7;
  font-size: 1rem;
  line-height: 1.7;
}

.managed-wifi-package-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(181, 218, 240, .24);
}

.managed-wifi-package {
  display: grid;
  grid-template-columns: minmax(10rem, .78fr) minmax(0, 1.22fr);
  min-height: 15rem;
  border-bottom: 1px solid rgba(181, 218, 240, .24);
}

.managed-wifi-package:nth-child(odd) {
  border-right: 1px solid rgba(181, 218, 240, .24);
}

.managed-wifi-package:nth-child(even) {
  padding-left: 1.25rem;
}

.managed-wifi-package:nth-child(odd) {
  padding-right: 1.25rem;
}

.managed-wifi-package-photo {
  min-height: 12rem;
  background:
    linear-gradient(180deg, rgba(3, 12, 24, .06), rgba(3, 12, 24, .2)),
    url("/assets/billing/guest-wifi.jpg") center / cover no-repeat;
}

.managed-wifi-package-photo--cafe {
  background-image:
    linear-gradient(180deg, rgba(3, 12, 24, .06), rgba(3, 12, 24, .2)),
    url("/assets/billing/cafe-management.jpg");
}

.managed-wifi-package-photo--school {
  background-image:
    linear-gradient(180deg, rgba(3, 12, 24, .06), rgba(3, 12, 24, .2)),
    url("/assets/billing/schools-labs.jpg");
}

.managed-wifi-package-photo--community {
  background-image:
    linear-gradient(180deg, rgba(3, 12, 24, .06), rgba(3, 12, 24, .2)),
    var(--managed-wifi-night);
  background-position: center;
  background-size: cover;
}

.managed-wifi-package-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1rem, 2vw, 1.6rem);
}

.managed-wifi-package-type {
  margin: 0 0 .45rem;
  color: #78dfff;
  font-size: .65rem;
}

.managed-wifi-package h3 {
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  font-weight: 800;
  line-height: 1.15;
}

.managed-wifi-package-copy > p:not(.managed-wifi-package-type) {
  margin: .7rem 0 1rem;
  color: #d2e1ed;
  font-size: .9rem;
  line-height: 1.6;
}

.managed-wifi-package-copy > .managed-wifi-package-internet {
  margin-top: 0;
  color: #effaff;
  font-size: .82rem;
}

.managed-wifi-package-internet strong {
  color: #fff;
}

.managed-wifi-package a,
.managed-wifi-system-copy > a,
.managed-wifi-isp-inner > div > a {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  margin-top: auto;
  color: #8be7ff;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.5;
  text-decoration: none;
}

.managed-wifi-package a:hover,
.managed-wifi-package a:focus-visible,
.managed-wifi-system-copy > a:hover,
.managed-wifi-system-copy > a:focus-visible,
.managed-wifi-isp-inner > div > a:hover,
.managed-wifi-isp-inner > div > a:focus-visible {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: .2em;
}

.managed-wifi-package-note {
  margin: 1.25rem 0 0;
  color: #bed3e3;
  font-size: .82rem;
  line-height: 1.65;
}

.managed-wifi-speed-guide {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .8rem 2rem;
  margin-top: 1.75rem;
  padding-block: 1.25rem;
  border-top: 1px solid rgba(181, 218, 240, .3);
  border-bottom: 1px solid rgba(181, 218, 240, .3);
}

.managed-wifi-speed-guide h3 {
  margin: 0;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
}

.managed-wifi-speed-guide p {
  max-width: 75ch;
  margin: .45rem 0 0;
  color: #c7d8e7;
  font-size: .82rem;
  line-height: 1.6;
}

.managed-wifi-speed-guide ul {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.managed-wifi-speed-guide li {
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  white-space: nowrap;
}

.managed-wifi-speed-guide > p {
  grid-column: 1 / -1;
}

.managed-wifi-billing-note {
  max-width: 76ch;
  margin: 1.25rem 0 0;
  color: #d2e1ed;
  font-size: .9rem;
  line-height: 1.7;
}

.managed-wifi-billing-note a {
  color: #8be7ff;
  font-weight: 800;
  text-underline-offset: .2em;
}

.managed-wifi-billing-note a:hover,
.managed-wifi-billing-note a:focus-visible {
  color: #fff;
}

.managed-wifi-system {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #0b2030;
}

.managed-wifi-system-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(20rem, .86fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 82rem;
}

.managed-wifi-system-copy > p:not(.managed-wifi-section-label) {
  max-width: 62ch;
  margin-top: 1rem;
  color: #d5e4ef;
  line-height: 1.7;
}

.managed-wifi-system-copy ul {
  display: grid;
  gap: .75rem;
  margin: 1.5rem 0;
  padding: 0;
  list-style: none;
}

.managed-wifi-system-copy li {
  position: relative;
  padding-left: 1.4rem;
  color: #f0f8ff;
  line-height: 1.5;
}

.managed-wifi-system-copy li::before {
  position: absolute;
  left: 0;
  color: #63ddff;
  content: "✓";
  font-weight: 900;
}

.managed-wifi-system-photo {
  margin: 0;
}

.managed-wifi-system-photo img {
  display: block;
  width: 100%;
  max-height: 25rem;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.managed-wifi-system-photo figcaption {
  padding-top: .7rem;
  color: #c5d9e8;
  font-size: .8rem;
  line-height: 1.5;
}

.managed-wifi-delivery {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  color: #fff;
  background: linear-gradient(115deg, #0576b8, #07539a 58%, #06396d);
}

.managed-wifi-delivery .managed-wifi-section-heading > p:last-child {
  color: #e4f5ff;
}

.managed-wifi-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 2.5rem 0 0;
  padding: 0;
  border-top: 1px solid rgba(227, 247, 255, .46);
  list-style: none;
}

.managed-wifi-steps li {
  min-height: 8rem;
  padding: 1rem 1.1rem 0 0;
}

.managed-wifi-steps li + li {
  padding-left: 1.1rem;
  border-left: 1px solid rgba(227, 247, 255, .32);
}

.managed-wifi-steps span {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 850;
}

.managed-wifi-steps p {
  max-width: 30ch;
  margin: .55rem 0 0;
  color: #e4f5ff;
  font-size: .88rem;
  line-height: 1.55;
}

.managed-wifi-isp {
  padding-block: clamp(3rem, 6vw, 5rem);
  background: #071521;
}

.managed-wifi-isp-inner {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 82rem;
}

.managed-wifi-isp-inner > div > p:not(.managed-wifi-section-label) {
  margin: 0 0 1rem;
  color: #d5e4ef;
  font-size: .94rem;
  line-height: 1.75;
}

.managed-wifi-next-step {
  background: #0b2030;
}

.managed-wifi-page .product-next-step h2 {
  color: #fff;
}

.managed-wifi-page .product-next-step p {
  color: #d5e4ef;
}

.managed-wifi-page .product-next-step-inner > a {
  border-color: #9beaff;
  background: #0876b9;
  color: #fff;
}

.managed-wifi-page .product-next-step-inner > a:hover,
.managed-wifi-page .product-next-step-inner > a:focus-visible {
  background: #0b8aca;
}

.managed-wifi-page :is(a, button):focus-visible {
  outline: 3px solid #a4efff;
  outline-offset: 4px;
}

@media (max-width: 900px) {
  .managed-wifi-hero-inner {
    grid-template-columns: 1fr;
  }

  .managed-wifi-hero-visual {
    min-height: 23rem;
  }

  .managed-wifi-system-inner {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 680px) {
  .managed-wifi-page .managed-wifi-hero {
    min-height: 0;
    padding-block: 4rem 3rem;
    background-position: 56% center;
  }

  .managed-wifi-hero-inner,
  .managed-wifi-intro-inner,
  .managed-wifi-system-inner,
  .managed-wifi-isp-inner {
    grid-template-columns: 1fr;
  }

  .managed-wifi-hero h1 {
    max-width: 9ch;
    font-size: clamp(3rem, 14vw, 4.5rem);
  }

  .managed-wifi-hero-visual {
    min-height: 19rem;
    padding: .7rem;
  }

  .managed-wifi-flow {
    padding: .75rem;
  }

  .managed-wifi-flow svg {
    min-height: 8rem;
  }

  .managed-wifi-intro-inner {
    gap: 1rem;
  }

  .managed-wifi-package-list {
    grid-template-columns: 1fr;
  }

  .managed-wifi-package,
  .managed-wifi-package:nth-child(even),
  .managed-wifi-package:nth-child(odd) {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    min-height: 13rem;
    padding: 0;
    border-right: 0;
  }

  .managed-wifi-package-photo {
    min-height: 12rem;
  }

  .managed-wifi-package-copy {
    padding: 1rem;
  }

  .managed-wifi-speed-guide {
    grid-template-columns: 1fr;
    gap: .65rem;
  }

  .managed-wifi-speed-guide > p {
    grid-column: auto;
  }

  .managed-wifi-system-inner {
    gap: 2rem;
  }

  .managed-wifi-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
  }

  .managed-wifi-steps li {
    min-height: 7rem;
    padding: 1rem .75rem 1rem 0;
    border-bottom: 1px solid rgba(227, 247, 255, .32);
  }

  .managed-wifi-steps li + li {
    padding-left: .75rem;
  }

  .managed-wifi-steps li:nth-child(odd) {
    border-left: 0;
  }

  .managed-wifi-steps li:nth-child(even) {
    border-left: 1px solid rgba(227, 247, 255, .32);
  }
}

@media (max-width: 420px) {
  .managed-wifi-package,
  .managed-wifi-package:nth-child(even),
  .managed-wifi-package:nth-child(odd) {
    grid-template-columns: 1fr;
  }

  .managed-wifi-package-photo {
    min-height: 10rem;
  }

  .managed-wifi-package-copy {
    min-height: 12rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .managed-wifi-page *,
  .managed-wifi-page *::before,
  .managed-wifi-page *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .project-area-list article > p {
    grid-column: auto;
    grid-row: auto;
  }

  .project-steps {
    grid-template-columns: 1fr;
  }

  .project-steps li,
  .project-steps li + li {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: .5rem;
    padding: 1.2rem 0;
    border: 0;
    border-bottom: 1px solid #dbe5f1;
  }

  .project-steps li > span {
    margin: .1rem 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .reveal {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }

  html.js .detail-hero h1,
  html.js .directory-hero-photo img {
    animation: none !important;
  }

  .directory-hero-note > a > span:last-child,
  .detail-actions a,
  .detail-cta a,
  .product-next-step-inner > a {
    transition: none;
  }
}

html.js .reveal {
  opacity: 1;
  transform: none;
  transition: none;
}

/* Keep primary navigation concise; use dropdowns to classify the full site map. */
.navbar-glass .nav-dropdown.nav-category-dropdown::before {
  display: none !important;
}

.navbar-glass .nav-category-dropdown {
  width: min(25rem, calc(100vw - 2rem));
  padding: .8rem !important;
}

.navbar-glass .nav-dropdown.nav-category-dropdown:not(.nav-services-dropdown) {
  display: grid;
  align-content: start;
  gap: .2rem;
}

.navbar-glass .nav-category-dropdown > h2,
.navbar-glass .nav-service-menu-group > h2 {
  margin: 0;
  padding: .55rem .65rem .7rem;
  border-bottom: 1px solid #e2e8f0;
  color: #64748b;
  font-family: Inter, system-ui, sans-serif;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .09em;
  line-height: 1.35;
  text-transform: uppercase;
}

.navbar-glass .nav-category-dropdown a.nav-category-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .18rem;
  min-height: 0;
  padding: .65rem !important;
  border-radius: .55rem;
  color: #102a4c !important;
  white-space: normal;
}

.navbar-glass .nav-category-dropdown a.nav-category-link strong {
  font-size: .82rem;
  font-weight: 750;
  line-height: 1.3;
}

.navbar-glass .nav-category-dropdown a.nav-category-link span {
  color: #64748b;
  font-size: .7rem;
  line-height: 1.4;
}

.navbar-glass .nav-category-dropdown a.nav-category-link:hover,
.navbar-glass .nav-category-dropdown a.nav-category-link:focus-visible {
  background: #edf4ff !important;
  color: #0039a6 !important;
}

.navbar-glass .nav-dropdown.nav-services-dropdown {
  left: 50%;
  width: min(68rem, calc(100vw - 2rem));
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  padding: 1.15rem !important;
}

.navbar-glass nav > .nav-services-group {
  position: static;
}

.navbar-glass nav > .nav-services-group > .nav-services-dropdown {
  top: calc(100% - .15rem);
}

.navbar-glass .group:hover .nav-dropdown.nav-services-dropdown,
.navbar-glass .group:focus-within .nav-dropdown.nav-services-dropdown,
.navbar-glass .group.nav-open .nav-dropdown.nav-services-dropdown {
  transform: translate(-50%, 0);
}

.nav-service-menu-group {
  min-width: 0;
}

.nav-service-menu-links {
  display: grid;
  gap: .15rem;
  padding-top: .35rem;
}

.navbar-glass .nav-category-dropdown a.nav-category-all {
  grid-column: 1 / -1;
  display: flex;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #e2e8f0;
  border-radius: 0;
  color: #0039a6 !important;
  font-size: .78rem;
  font-weight: 800;
}

.navbar-glass .nav-category-dropdown a.nav-category-all:hover,
.navbar-glass .nav-category-dropdown a.nav-category-all:focus-visible {
  background: #edf4ff !important;
}

.navbar-glass .nav-dropdown.nav-products-dropdown {
  width: min(24rem, calc(100vw - 2rem));
}

.navbar-glass .nav-dropdown.nav-company-dropdown,
.navbar-glass .nav-dropdown.nav-resources-dropdown {
  width: min(22rem, calc(100vw - 2rem));
}

.mobile-nav-submenu .nav-services-dropdown {
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  gap: .65rem;
  padding: .65rem !important;
}

.mobile-nav-submenu .nav-category-dropdown > h2,
.mobile-nav-submenu .nav-service-menu-group > h2 {
  padding-inline: .45rem;
}

@media (min-width: 1201px) and (max-width: 1535px) {
  .navbar-glass nav {
    column-gap: .2rem;
    font-size: .75rem;
  }

  .navbar-glass nav .relative.group > button,
  .navbar-glass nav > a:not(.nav-primary-extra) {
    padding-inline: .2rem;
  }
}

@media (max-width: 760px) {
  .mobile-nav-submenu .nav-category-dropdown a.nav-category-link {
    padding: .6rem !important;
  }
}

/* Use one restrained glass surface for every desktop dropdown. */
.navbar-glass .nav-dropdown:not(.nav-mega-dropdown),
.navbar-glass .nav-dropdown.nav-mega-dropdown {
  border: 1px solid rgba(255, 255, 255, .78) !important;
  background: rgba(248, 251, 255, .98) !important;
  box-shadow:
    0 24px 64px rgba(0, 26, 77, .2),
    inset 0 1px 0 rgba(255, 255, 255, .92) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.45) !important;
  backdrop-filter: blur(24px) saturate(1.45) !important;
}

.navbar-glass .nav-dropdown.nav-services-dropdown {
  transform: translate(-50%, 10px);
}

.navbar-glass .nav-dropdown.nav-category-dropdown {
  max-height: min(75vh, 42rem);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 57, 166, .3) transparent;
}

.navbar-glass .nav-category-dropdown a.nav-category-link {
  transition:
    background-color .18s ease,
    border-color .18s ease,
    color .18s ease,
    transform .18s ease;
}

.navbar-glass .nav-category-dropdown a.nav-category-link:hover,
.navbar-glass .nav-category-dropdown a.nav-category-link:focus-visible {
  border-color: rgba(0, 57, 166, .12);
  background: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 5px 14px rgba(0, 26, 77, .07);
  transform: translateY(-1px);
}

.navbar-glass .nav-dropdown.nav-services-dropdown {
  align-items: start;
  gap: .75rem;
}

.navbar-glass .nav-service-menu-group {
  padding-inline: .35rem;
}

.navbar-glass .nav-service-menu-group:not(:last-of-type) {
  border-right: 1px solid rgba(15, 42, 74, .1);
}

.navbar-glass .nav-category-dropdown > h2,
.navbar-glass .nav-service-menu-group > h2 {
  border-color: rgba(15, 42, 74, .12);
}

.navbar-glass .nav-mega-dropdown .nav-mega-heading {
  border-color: rgba(15, 42, 74, .12);
}

.navbar-glass .nav-mega-dropdown .nav-mega-service {
  min-width: 0;
  border: 1px solid transparent;
  border-radius: .65rem;
}

.navbar-glass .nav-mega-dropdown .nav-mega-service:hover,
.navbar-glass .nav-mega-dropdown .nav-mega-service:focus-visible {
  border-color: rgba(0, 57, 166, .12);
  background: rgba(255, 255, 255, .68) !important;
}

.navbar-glass .nav-mega-dropdown .nav-mega-aside {
  background: rgba(0, 26, 77, .9);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.navbar-glass nav > .nav-restored-link {
  flex: 0 0 auto;
  justify-content: center;
}

@media (min-width: 1280px) and (max-width: 1535px) {
  .navbar-glass nav {
    column-gap: .12rem;
    font-size: .71rem;
  }

  .navbar-glass nav .relative.group > button,
  .navbar-glass nav > a:not(.nav-primary-extra) {
    padding-inline: .12rem;
  }

  .navbar-glass nav > .nav-restored-link {
    width: 2.3rem;
    min-width: 2.3rem;
    padding-inline: .35rem;
  }

  .navbar-glass nav > .nav-restored-link span {
    display: none;
  }
}

@media (max-width: 1279px) {
  .mobile-nav-submenu .nav-dropdown {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .mobile-nav-submenu .nav-service-menu-group:not(:last-of-type) {
    border-right: 0;
  }
}

body.theme-dark .navbar-glass .nav-dropdown {
  border-color: rgba(255, 255, 255, .16) !important;
  background: rgba(9, 24, 44, .94) !important;
  box-shadow:
    0 24px 64px rgba(0, 0, 0, .38),
    inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

body.theme-dark .navbar-glass .nav-category-dropdown > h2,
body.theme-dark .navbar-glass .nav-service-menu-group > h2 {
  border-color: rgba(255, 255, 255, .16);
  color: #bfcee2;
}

body.theme-dark .navbar-glass .nav-category-dropdown a.nav-category-link,
body.theme-dark .navbar-glass .nav-category-dropdown a.nav-category-link span {
  color: #d6e2f2 !important;
}

body.theme-dark .navbar-glass .nav-category-dropdown a.nav-category-link strong {
  color: #f5f8fc;
}

body.theme-dark .navbar-glass .nav-category-dropdown a.nav-category-link:hover,
body.theme-dark .navbar-glass .nav-category-dropdown a.nav-category-link:focus-visible,
body.theme-dark .navbar-glass .nav-mega-dropdown .nav-mega-service:hover,
body.theme-dark .navbar-glass .nav-mega-dropdown .nav-mega-service:focus-visible {
  border-color: rgba(148, 190, 255, .2);
  background: rgba(255, 255, 255, .1) !important;
}

@media (prefers-reduced-motion: reduce) {
  .navbar-glass .nav-category-dropdown a.nav-category-link {
    transition: none;
  }
}

.navbar-glass nav > .nav-disclosure-group {
  display: flex;
  align-self: stretch;
  align-items: center;
  padding-block: 0 !important;
}

.navbar-glass nav > .nav-disclosure-group > button {
  display: inline-flex;
  min-height: 2.7rem;
  align-items: center;
}

.navbar-glass .nav-dropdown.nav-services-dropdown {
  background: rgba(248, 251, 255, .94) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.4) !important;
  backdrop-filter: blur(30px) saturate(1.4) !important;
}

.navbar-glass .nav-service-menu-group {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.navbar-glass .nav-service-menu-group > h2 {
  display: flex;
  min-height: 2.6rem;
  align-items: center;
}

.navbar-glass .nav-service-menu-links {
  grid-template-rows: repeat(3, minmax(4.45rem, auto));
  align-content: start;
}

.navbar-glass .nav-service-menu-links > .nav-category-link {
  min-height: 4.45rem;
  align-content: start;
}

.navbar-glass .nav-category-dropdown a.nav-category-link strong {
  font-size: .84rem;
  line-height: 1.35;
}

.navbar-glass .nav-category-dropdown a.nav-category-link span {
  font-size: .74rem;
  line-height: 1.4;
}

body.responsive-page :is(main section, body > section) {
  position: relative;
  isolation: isolate;
}

.site-section-photo {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.site-section-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-section-photo::after {
  position: absolute;
  inset: 0;
  background: var(--section-photo-wash, rgba(255, 255, 255, .84));
  content: "";
}

.context-image-card {
  overflow: hidden;
  padding: 0 !important;
}

.context-card-media {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.info-card.context-image-card > :not(.context-card-media),
.band .grid > article.card.context-image-card > :not(.context-card-media),
.billing-addon-card.context-image-card > :not(.context-card-media),
.saints-page .hub-program-card.context-image-card > :not(.context-card-media),
.saints-page .hub-project-grid article.context-image-card > :not(.context-card-media),
.saints-page .hub-event-grid article.context-image-card > :not(.context-card-media),
.saints-page .hub-training-grid article.context-image-card > :not(.context-card-media) {
  margin-inline: 1.25rem;
}

.info-card.context-image-card > span,
.billing-addon-card.context-image-card > i,
.saints-page .hub-program-card.context-image-card > svg,
.saints-page .hub-training-grid article.context-image-card > svg {
  margin-top: 1.15rem;
}

.info-card.context-image-card > b,
.band .grid > article.card.context-image-card > a,
.billing-addon-card.context-image-card > p:last-child,
.saints-page .hub-program-card.context-image-card > a,
.saints-page .hub-event-grid article.context-image-card > a,
.saints-page .hub-project-grid article.context-image-card > small,
.saints-page .hub-training-grid article.context-image-card > p:last-child {
  margin-bottom: 1.25rem;
}

@media (max-width: 560px) {
  .context-card-media {
    aspect-ratio: 16 / 10;
  }
}

body.responsive-page main :is(
  [class~="bg-white"][class*="rounded-2xl"],
  [class~="bg-white"][class*="rounded-xl"],
  [class~="bg-slate-50"][class*="rounded-2xl"],
  [class~="bg-slate-50"][class*="rounded-xl"],
  .glass-card
) {
  border-color: rgba(255, 255, 255, .8) !important;
  background-color: rgba(255, 255, 255, .84) !important;
  box-shadow:
    0 18px 48px rgba(0, 26, 77, .1),
    inset 0 1px 0 rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(12px) saturate(1.12);
  backdrop-filter: blur(12px) saturate(1.12);
}

body.responsive-page main p:not(.font-mono):not([class*="font-mono"]) {
  line-height: 1.65;
}

body.responsive-page main p.text-xs:not(.font-mono):not([class*="font-mono"]) {
  font-size: max(.9rem, 1em);
}

body.theme-dark.responsive-page main :is(
  [class~="bg-white"][class*="rounded-2xl"],
  [class~="bg-white"][class*="rounded-xl"],
  [class~="bg-slate-50"][class*="rounded-2xl"],
  [class~="bg-slate-50"][class*="rounded-xl"],
  .glass-card
) {
  border-color: rgba(191, 219, 254, .2) !important;
  background-color: rgba(10, 25, 48, .8) !important;
  box-shadow:
    0 18px 48px rgba(0, 0, 0, .22),
    inset 0 1px 0 rgba(255, 255, 255, .1);
}

@media (max-width: 640px) {
  body.responsive-page main :is(
    [class~="bg-white"][class*="rounded-2xl"],
    [class~="bg-white"][class*="rounded-xl"],
    [class~="bg-slate-50"][class*="rounded-2xl"],
    [class~="bg-slate-50"][class*="rounded-xl"],
    .glass-card
  ) {
    -webkit-backdrop-filter: blur(7px) saturate(1.08);
    backdrop-filter: blur(7px) saturate(1.08);
  }
}

@media (prefers-reduced-transparency: reduce) {
  body.responsive-page main :is(
    [class~="bg-white"][class*="rounded-2xl"],
    [class~="bg-white"][class*="rounded-xl"],
    [class~="bg-slate-50"][class*="rounded-2xl"],
    [class~="bg-slate-50"][class*="rounded-xl"],
    .glass-card
  ) {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

.navbar-glass .nav-mega-dropdown .nav-mega-aside,
.navbar-glass .nav-mega-dropdown .nav-mega-aside > * {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.navbar-glass .nav-mega-dropdown .nav-mega-aside strong {
  display: block;
}

.navbar-glass .nav-mega-dropdown .nav-mega-aside a {
  box-sizing: border-box;
  width: 100%;
  flex-wrap: wrap;
}

.navbar-glass .nav-mega-dropdown .nav-mega-aside a:not(:last-child) {
  color: #dbeafe !important;
}

/* One typographic baseline for every desktop navigation item. */
.navbar-glass nav {
  align-items: center;
  line-height: 1.2;
}

.navbar-glass nav > a,
.navbar-glass nav > .nav-disclosure-group > button {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  font-size: clamp(.78rem, .74vw, .875rem) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.navbar-glass nav > .nav-disclosure-group {
  align-self: center;
  height: 2.75rem;
  padding-block: 0 !important;
}

.navbar-glass nav > .nav-disclosure-group > button {
  height: 100%;
}

.navbar-glass nav > .nav-primary-extra {
  min-height: 2.75rem;
  padding: .55rem .45rem;
  border: 1px solid transparent;
  border-radius: .5rem;
  background: transparent;
  box-shadow: none;
  color: #102a4c !important;
  transform: none;
}

.navbar-glass nav > .nav-primary-extra svg,
.navbar-glass nav > .nav-primary-extra i {
  color: #047857;
}

.navbar-glass nav > .nav-primary-extra:hover,
.navbar-glass nav > .nav-primary-extra:focus-visible {
  border-color: rgba(4, 120, 87, .14);
  background: rgba(4, 120, 87, .07);
  box-shadow: none;
  color: #065f46 !important;
  transform: none;
}

.navbar-glass nav > .nav-primary-extra:focus-visible {
  outline: 2px solid #047857;
  outline-offset: 2px;
}

.announcement-location-window {
  padding: 0;
  background: transparent;
}

.announcement-location-track {
  width: auto;
  gap: 0;
  animation: none;
  color: #d9e3ee;
  font-size: .75rem;
  letter-spacing: .015em;
}

.announcement-location-track span[aria-hidden="true"],
.announcement-contact > span {
  display: none;
}

@media (min-width: 1280px) and (max-width: 1535px) {
  .navbar-glass nav > a,
  .navbar-glass nav > .nav-disclosure-group > button {
    font-size: .75rem !important;
  }
}

.homepage-presence-strip {
  border-block: 1px solid #e5ebf1;
  background: #f7f9fb;
  color: #10233f;
}

.presence-strip-inner {
  display: grid;
  grid-template-columns: minmax(15rem, .85fr) minmax(0, 1.6fr);
  align-items: center;
  gap: 1.5rem;
  width: min(100% - 3rem, 88rem);
  margin-inline: auto;
  padding-block: 1.15rem;
}

.presence-strip-copy {
  display: grid;
  gap: .2rem;
}

.presence-strip-copy > span {
  color: #047857;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1.3;
  text-transform: uppercase;
}

.presence-strip-copy > strong {
  color: #10233f;
  font-size: .92rem;
  font-weight: 750;
  line-height: 1.35;
}

.presence-strip-locations {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.presence-strip-locations li {
  padding: .35rem .65rem;
  border: 1px solid #dce5e9;
  border-radius: 999px;
  background: #fff;
  color: #405268;
  font-size: .75rem;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .presence-strip-inner {
    grid-template-columns: 1fr;
    gap: .8rem;
    width: min(100% - 2rem, 42rem);
    padding-block: 1rem;
  }

  .presence-strip-locations {
    justify-content: flex-start;
  }
}

@media (pointer: coarse) {
  .navbar-glass .nav-a11y-trigger,
  .navbar-glass [data-mobile-menu-toggle],
  .navbar-glass .nav-actions > a,
  .navbar-glass .nav-primary-extra,
  .navbar-glass .mobile-nav-group-toggle,
  #mobile-menu > a,
  .announcement-contact a,
  footer form input,
  footer form button,
  .interior-action-row a {
    min-height: 44px;
  }

  .navbar-glass [data-mobile-menu-toggle],
  .navbar-glass .nav-a11y-trigger {
    min-width: 44px;
  }

  footer form input {
    font-size: 16px;
  }
}

@media (min-width: 1280px) {
  .navbar-glass [data-mobile-menu-toggle] {
    display: none !important;
  }
}

.navbar-glass .nav-search-toggle {
  display: inline-flex;
  min-width: 2.75rem;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid #d6e0ee;
  border-radius: .65rem;
  background: #f3f7fc;
  color: #20334e;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

.navbar-glass .nav-search-toggle:hover,
.navbar-glass .nav-search-toggle:focus-visible,
.navbar-glass .nav-search-toggle[aria-expanded="true"] {
  border-color: #b7cae8;
  background: #eaf2ff;
  color: var(--site-blue);
}

.navbar-glass .nav-search-toggle svg {
  width: 1.2rem;
  height: 1.2rem;
}

.navbar-glass .nav-search-panel {
  position: absolute;
  z-index: 130;
  top: calc(100% + .55rem);
  right: clamp(1rem, 4vw, 3rem);
  width: min(27rem, calc(100vw - 2rem));
  padding: 1rem;
  border: 1px solid #dce5f2;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 20px 48px rgba(0, 26, 77, .2);
}

.navbar-glass .nav-search-panel[hidden] {
  display: none !important;
}

.nav-search-panel > label {
  display: block;
  margin-bottom: .5rem;
  color: #20334e;
  font-size: .84rem;
  font-weight: 750;
}

.nav-search-panel input {
  width: 100%;
  min-height: 2.9rem;
  padding: .65rem .8rem;
  border: 1px solid #cbd8e9;
  border-radius: .65rem;
  background: #f8faff;
  color: #142944;
  font: inherit;
}

.nav-search-panel input:focus {
  border-color: var(--site-blue);
  outline: 3px solid rgba(0, 57, 166, .14);
}

.nav-search-status {
  margin: .65rem 0 .35rem;
  color: #53657c;
  font-size: .76rem;
  line-height: 1.45;
}

.nav-search-results {
  display: grid;
  gap: .2rem;
  max-height: min(50vh, 20rem);
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
}

.nav-search-result {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: .55rem;
  color: #20334e;
  font-size: .85rem;
  font-weight: 650;
  text-decoration: none;
}

.nav-search-result:hover,
.nav-search-result:focus-visible {
  background: #edf4ff;
  color: var(--site-blue);
}

.mobile-nav-intro {
  display: grid;
  gap: .2rem;
  padding: .35rem .25rem .75rem;
  border-bottom: 1px solid #e1e9f4;
}

.mobile-nav-intro strong {
  color: #142944;
  font-size: 1rem;
}

.mobile-nav-intro span {
  color: #53657c;
  font-size: .82rem;
  line-height: 1.45;
}

@media (max-width: 639px) {
  .navbar-glass .nav-search-panel {
    right: .75rem;
    width: calc(100vw - 1.5rem);
  }
}

#featured .text-slate-400,
#posts .text-slate-400 {
  color: #475569 !important;
}

#featured a.bg-emerald-600 {
  background-color: #047857;
}

#featured a.bg-emerald-600:hover {
  background-color: #065f46;
}

/* Keep glass for editorial sections and let card grids sit directly on the photo. */
body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) {
  position: relative;
  isolation: isolate;
  padding-block: clamp(.75rem, 2vw, 1.5rem) !important;
}

body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  width: calc(100% - clamp(1rem, 3vw, 2.5rem));
  margin: clamp(.5rem, 1vw, 1rem) auto;
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid rgba(116, 205, 255, .38);
  border-radius: clamp(1rem, 2vw, 1.75rem);
  background: linear-gradient(
    135deg,
    rgba(0, 57, 166, .6),
    rgba(0, 26, 77, .57) 58%,
    rgba(0, 57, 166, .52)
  );
  box-shadow: 0 24px 64px rgba(0, 12, 54, .34), inset 0 1px 0 rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(11px) saturate(160%);
  backdrop-filter: blur(11px) saturate(160%);
}

body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] :is(h1, h2, h3, h4, p, li, small, [class*="text-slate-"], [class*="text-[#0039A6]"]) {
  color: #f1f6fb !important;
}

body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] :is([class*="card"], article, .bg-white, .bg-slate-50, .tab-content-card):not([class*="home-card-carousel"]) {
  border-color: #bfdbfe !important;
  background-color: #fff !important;
  box-shadow: 0 14px 36px rgba(1, 8, 22, .16);
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] :is([class*="card"], article, .bg-white, .bg-slate-50, .tab-content-card) :is(h1, h2, h3, h4, p, li, small, strong, [class*="text-slate-"]) {
  color: #18314f !important;
}

body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] :is(a, button, span)[class~="bg-white"],
body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] :is(a, button, span)[class~="bg-slate-50"] {
  color: #0039a6 !important;
  text-shadow: none !important;
}

body:has(main > section#home):not(.content-structure-page) main > section.multi-photo-section:not(#home) {
  padding-block: clamp(.75rem, 1.5vw, 1.25rem) !important;
  background-color: transparent !important;
}

body:has(main > section#home):not(.content-structure-page) main > section.multi-photo-section:not(#home)::before {
  z-index: 0 !important;
  opacity: .94 !important;
}

body:has(main > section#home) main > #about-company.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #divisions.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #projects.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #how-we-work.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #client-notes.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #about.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > .position-statement.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-5973dc0f32e7?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #partners.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1556761175-129418cb2dfe?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) main > #blog.multi-photo-section::before {
  background-image: url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1600&q=85") !important;
}

body:has(main > section#home) .multi-photo-section::after {
  z-index: 0 !important;
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)) !important;
}

body:has(main > section#home) .multi-photo-section > div[class*="max-w"] :is([class*="card"], article):not([class*="home-card-carousel"]) {
  border-color: #bfdbfe !important;
  background-color: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body:has(main > section#home) .multi-photo-section > div[class*="max-w"] :is([class*="card"], article) :is(h1, h2, h3, h4, p, li, small, strong, [class*="text-slate-"]) {
  color: #18314f !important;
}

body:has(main > section#home) main > #client-fit {
  overflow: hidden;
  background-color: transparent !important;
}

body:has(main > section#home) main > #client-fit::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("/assets/billing/print-shops.jpg") center 42% / cover no-repeat;
}

body:has(main > section#home) main > #client-fit::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(120deg, rgba(2, 12, 29, .28), rgba(2, 12, 29, .5));
  pointer-events: none;
}

body:has(main > section#home) #client-fit .client-sector-grid > div {
  border-color: rgba(255, 255, 255, .62);
  background: rgba(255, 255, 255, .9);
  -webkit-backdrop-filter: blur(14px) saturate(145%);
  backdrop-filter: blur(14px) saturate(145%);
}

body:has(main > section#home) #client-fit .delivery-promise-grid > div {
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .62);
  border-radius: .85rem;
  background: rgba(255, 255, 255, .9);
  -webkit-backdrop-filter: blur(14px) saturate(145%);
  backdrop-filter: blur(14px) saturate(145%);
}

body:has(main > section#home) main > #client-fit.client-fit-section > div[class*="max-w"] .client-sector-grid :is(strong, span),
body:has(main > section#home) main > #client-fit.client-fit-section > div[class*="max-w"] .delivery-promise-grid :is(h3, p) {
  color: #18314f !important;
}

body:has(main > section#home) #solutions-for-work {
  background:
    linear-gradient(115deg, rgba(2, 12, 29, .24), rgba(2, 12, 29, .42)),
    url("https://images.unsplash.com/photo-1497366216548-37526070297c?auto=format&fit=crop&w=1800&q=85")
      center / cover no-repeat,
    #031b45 !important;
}

body:has(main > section#home) #platform-capabilities {
  background:
    linear-gradient(115deg, rgba(2, 12, 29, .24), rgba(2, 12, 29, .42)),
    url("https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=1800&q=85")
      center / cover no-repeat,
    #031b45 !important;
}

body:has(main > section#home) :is(#solutions-for-work, #platform-capabilities) > div[class*="max-w"] > header :is(h2, p) {
  color: #f1f6fb !important;
}

body:has(main > section#home) :is(.homepage-solution-card, .homepage-capability-card) {
  border-color: rgba(255, 255, 255, .68);
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(14px) saturate(145%);
  backdrop-filter: blur(14px) saturate(145%);
}

body:has(main > section#home) #smas.saints-analytics::before {
  z-index: 0 !important;
  background:
    linear-gradient(110deg, rgba(1, 24, 61, .62), rgba(3, 27, 69, .5) 54%, rgba(0, 48, 94, .42)),
    url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat;
}

body:has(main > section#home) main > #smas.saints-analytics,
body:has(main > section#home) main > #contact.contact-corporate {
  background-color: transparent !important;
}

body:has(main > section#home) main > #contact.contact-corporate::before,
body:has(main > section#home) main > #smas.saints-analytics::after {
  z-index: 0 !important;
}

body:has(main > section#home) #brands {
  background:
    linear-gradient(115deg, rgba(0, 17, 55, .76), rgba(0, 26, 77, .64) 48%, rgba(0, 26, 77, .48)),
    url("https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&w=1600&q=85")
      center / cover no-repeat !important;
}

body:has(main > section#home) #contact > div[class*="max-w"] .contact-form-panel {
  border-color: #dbe5f0;
  background: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body:has(main > section#home) #contact .contact-form-panel :is(input, select, textarea) {
  background-color: #fff !important;
}

body:has(main > section#home) #contact > div[class*="max-w"] .contact-form-panel :is(h2, h3, p, label, [class*="text-slate-"]) {
  color: #18314f !important;
}

body:has(main > section#home) .position-statement > div[class*="max-w"] :is(h2, h3, p, [class*="text-white"], [class*="text-slate-"]) {
  color: #f1f6fb !important;
}

@media (max-width: 639px) {
  body:has(main > section#home):not(.content-structure-page) main > section:not(#home):not(.homepage-presence-strip) > div[class*="max-w"] {
    padding: 1.25rem 1rem;
    border-radius: 1rem;
  }

  body:has(main > section#home):not(.content-structure-page) main > section.multi-photo-section {
    padding-block: .5rem !important;
  }
}

body:has(main > section#home):not(.content-structure-page) main > section.multi-photo-section:not(#home)::before,
body:has(main > section#home):not(.content-structure-page) main > section.multi-photo-section:not(#home)::after,
body:has(main > section#home) main > #client-fit::before,
body:has(main > section#home) main > #client-fit::after,
body:has(main > section#home) main > #smas.saints-analytics::before,
body:has(main > section#home) main > #contact.contact-corporate::before {
  content: none !important;
  display: none !important;
}

body:has(main > section#home) main > #about-company {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #divisions {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #projects {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #how-we-work {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #client-notes {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1556761175-4b46a572b786?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #about {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > .position-statement {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1556761175-5973dc0f32e7?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #partners {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1556761175-129418cb2dfe?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #blog {
  background: linear-gradient(125deg, rgba(2, 12, 29, .22), rgba(2, 12, 29, .48)), url("https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #client-fit {
  background: linear-gradient(120deg, rgba(2, 12, 29, .28), rgba(2, 12, 29, .5)), url("/assets/billing/print-shops.jpg") center 42% / cover no-repeat !important;
}

body:has(main > section#home) main > #smas.saints-analytics {
  background: linear-gradient(110deg, rgba(1, 24, 61, .62), rgba(3, 27, 69, .5) 54%, rgba(0, 48, 94, .42)), url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1600&q=85") center / cover no-repeat !important;
}

body:has(main > section#home) main > #contact.contact-corporate {
  background: linear-gradient(90deg, rgba(3, 10, 24, .52), rgba(3, 10, 24, .28) 45%, rgba(0, 26, 77, .42)), url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2200&q=85") center / cover no-repeat !important;
}

/* Extend the homepage's blue photo-and-glass language to populated interior
   sections, using the site's local image set to keep the added imagery light. */
html {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href*="/services/11-cybersecurity"]),
html:has(head link[rel="canonical"][href*="/services/10-hardware-networking"]),
html:has(head link[rel="canonical"][href*="/services/12-cloud-computing"]),
html:has(head link[rel="canonical"][href*="/services/14-data-business-intel"]),
html:has(head link[rel="canonical"][href*="/solutions/internet-hubs/"]),
html:has(head link[rel="canonical"][href*="/solutions/isps/"]),
html:has(head link[rel="canonical"][href*="/products/"]) {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/guest-wifi.jpg");
}

html:has(head link[rel="canonical"][href*="/services/17-ict-training"]),
html:has(head link[rel="canonical"][href*="/services/05-about-us"]),
html:has(head link[rel="canonical"][href*="/services/03-blueprint-blog"]),
html:has(head link[rel="canonical"][href*="/resources/"]),
html:has(head link[rel="canonical"][href*="/documentation/"]),
html:has(head link[rel="canonical"][href*="/solutions/schools/"]),
html:has(head link[rel="canonical"][href*="/solutions/healthcare/"]),
html:has(head link[rel="canonical"][href*="/solutions/ngos/"]) {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href*="/services/13-web-software"]),
html:has(head link[rel="canonical"][href*="/services/16-digital-media"]),
html:has(head link[rel="canonical"][href*="/services/18-customer-freelance"]) {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href*="/services/06-partners-vendors"]),
html:has(head link[rel="canonical"][href*="/services/07-ongoing-projects"]),
html:has(head link[rel="canonical"][href*="/services/09-pricing-payment"]),
html:has(head link[rel="canonical"][href*="/case-studies/"]),
html:has(head link[rel="canonical"][href*="/company/"]),
html:has(head link[rel="canonical"][href*="/partners/"]),
html:has(head link[rel="canonical"][href*="/pricing/"]),
html:has(head link[rel="canonical"][href*="/solutions/business/"]) {
  --content-photo-primary: url("/assets/billing/cafe-management.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href*="/services/15-iot-smart"]),
html:has(head link[rel="canonical"][href*="/solutions/hospitality/"]) {
  --content-photo-primary: url("/assets/billing/guest-wifi.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href*="/billing/"]),
html:has(head link[rel="canonical"][href*="/contact/"]),
html:has(head link[rel="canonical"][href*="/shop/"]) {
  --content-photo-primary: url("/assets/billing/cafe-management.jpg");
  --content-photo-secondary: url("/assets/billing/guest-wifi.jpg");
}

html:has(head link[rel="canonical"][href*="/saints-hub/"]) {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

body.solution-audience-page[data-solution="business"] {
  --content-photo-primary: url("/assets/billing/cafe-management.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

body.solution-audience-page[data-solution="hospitality"] {
  --content-photo-primary: url("/assets/billing/guest-wifi.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

body.solution-audience-page[data-solution="internet-hubs"],
body.solution-audience-page[data-solution="isps"] {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/guest-wifi.jpg");
}

body.solution-audience-page[data-solution="schools"],
body.solution-audience-page[data-solution="healthcare"],
body.solution-audience-page[data-solution="ngos"] {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

body.solution-audience-page[data-solution="retail"] {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href$="/solutions/"]) {
  --detail-hero-image: url("/assets/billing/print-shops.jpg");
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type):not([class*="bg-[#020712]"]):not([class*="bg-[#02120b]"]) {
  position: relative;
  isolation: isolate;
  background-image:
    linear-gradient(120deg, rgba(0, 26, 77, .28), rgba(0, 57, 166, .18)),
    var(--content-photo-primary) !important;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:nth-of-type(odd):not(:first-of-type):not(:last-of-type):not([class*="bg-[#020712]"]):not([class*="bg-[#02120b]"]) {
  background-image:
    linear-gradient(120deg, rgba(0, 26, 77, .28), rgba(0, 57, 166, .18)),
    var(--content-photo-secondary) !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type):not([class*="bg-[#020712]"]):not([class*="bg-[#02120b]"]) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) {
  box-sizing: border-box;
  width: min(calc(100% - clamp(1rem, 3vw, 2.5rem)), 90rem);
  max-width: 90rem;
  margin: clamp(.5rem, 1vw, 1rem) auto;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid rgba(116, 205, 255, .38);
  border-radius: clamp(1rem, 2vw, 1.5rem);
  background: linear-gradient(135deg, rgba(0, 57, 166, .72), rgba(0, 26, 77, .76) 58%, rgba(0, 57, 166, .68));
  box-shadow: 0 20px 54px rgba(0, 12, 54, .3), inset 0 1px 0 rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(10px) saturate(150%);
  backdrop-filter: blur(10px) saturate(150%);
  color: #f1f6fb;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(h1, h2, h3, h4, p, li, small, label, strong) {
  color: #f1f6fb !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link) {
  color: #c9efff;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) [class*="text-emerald-600"] {
  color: #a7f3d0 !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(.bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"], .card, .info-card, article) {
  border-color: #bfdbfe !important;
  background-color: #fff !important;
  box-shadow: 0 14px 34px rgba(0, 12, 54, .16);
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #18314f !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(.bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"], .card, .info-card, article) :is(h1, h2, h3, h4, p, li, small, label, strong, span, a:not([class*="bg-"])) {
  color: #18314f !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) p {
  max-width: 72ch;
  font-size: clamp(16px, calc(.9rem + .2vw), 17px);
  line-height: 1.7;
}

@media (max-width: 639px) {
  :is(
    body.interior-page:not(.gallery-page),
    body.responsive-page:not(:has(main > section#home)),
    body.pricing-neural-page,
    body.solution-audience-page,
    body.services-page,
    body.contact-page,
    body:has(main > section.detail-hero):not(.gallery-page)
  ):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) {
    background-attachment: scroll;
    background-position: center;
  }

  :is(
    body.interior-page:not(.gallery-page),
    body.responsive-page:not(:has(main > section#home)),
    body.pricing-neural-page,
    body.solution-audience-page,
    body.services-page,
    body.contact-page,
    body:has(main > section.detail-hero):not(.gallery-page)
  ):not(.content-structure-page) main > section:not(:first-of-type):not(:last-of-type) > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) {
    width: calc(100% - 1rem);
    padding: 1.15rem 1rem;
    border-radius: 1rem;
  }
}

body.interior-page main > section .grid > div[class*="bg-slate-200/50"]:empty {
  display: none;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) {
  position: relative;
  isolation: isolate;
  background-color: #001a4d !important;
  background-image:
    linear-gradient(120deg, rgba(0, 26, 77, .28), rgba(0, 57, 166, .18)),
    url("/assets/billing/print-shops.jpg") !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] {
  box-sizing: border-box;
  width: min(calc(100% - clamp(1rem, 3vw, 2.5rem)), 90rem);
  max-width: 90rem;
  margin: clamp(.5rem, 1vw, 1rem) auto;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid rgba(116, 205, 255, .38);
  border-radius: clamp(1rem, 2vw, 1.5rem);
  background: linear-gradient(135deg, rgba(0, 57, 166, .72), rgba(0, 26, 77, .76) 58%, rgba(0, 57, 166, .68));
  box-shadow: 0 20px 54px rgba(0, 12, 54, .3), inset 0 1px 0 rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(10px) saturate(150%);
  backdrop-filter: blur(10px) saturate(150%);
  color: #f1f6fb;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] :is(h1, h2, h3, h4, p, li, small, label, strong) {
  color: #f1f6fb !important;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] [class*="text-emerald-600"] {
  color: #a7f3d0 !important;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] p:not([class*="text-xs"]) {
  color: #f1f6fb !important;
  font-size: clamp(16px, calc(.9rem + .2vw), 17px);
  line-height: 1.7;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] p[class*="text-xs"] {
  color: #b9e9ff !important;
  font-size: .75rem !important;
  line-height: 1.4;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] :is(.bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"], .card, .info-card, .hub-step, article, form) {
  border-color: #bfdbfe !important;
  background-color: #fff !important;
  box-shadow: 0 14px 34px rgba(0, 12, 54, .16);
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #18314f !important;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] :is(.bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"], .card, .info-card, .hub-step, article, form) :is(h1, h2, h3, h4, p, li, small, label, strong, span, a:not([class*="bg-"])) {
  color: #18314f !important;
}

@media (max-width: 639px) {
  body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] {
    width: calc(100% - 1rem);
    padding: 1.15rem 1rem;
    border-radius: 1rem;
  }
}

/* Keep page photography varied after removing the disliked matrix and rack shots. */
html {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("/assets/billing/cafe-management.jpg");
}

html:has(head link[rel="canonical"][href*="/services/10-hardware-networking"]),
html:has(head link[rel="canonical"][href*="/services/11-cybersecurity"]),
html:has(head link[rel="canonical"][href*="/solutions/internet-hubs/"]),
html:has(head link[rel="canonical"][href*="/solutions/isps/"]) {
  --content-photo-primary: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1800&q=85");
  --content-photo-secondary: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/services/12-cloud-computing"]),
html:has(head link[rel="canonical"][href*="/services/14-data-business-intel"]),
html:has(head link[rel="canonical"][href*="/services/15-iot-smart"]),
html:has(head link[rel="canonical"][href*="/services/13-web-software"]) {
  --content-photo-primary: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1800&q=85");
  --content-photo-secondary: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/services/17-ict-training"]),
html:has(head link[rel="canonical"][href*="/resources/"]),
html:has(head link[rel="canonical"][href*="/documentation/"]),
html:has(head link[rel="canonical"][href*="/solutions/schools/"]),
html:has(head link[rel="canonical"][href*="/solutions/healthcare/"]),
html:has(head link[rel="canonical"][href*="/solutions/ngos/"]) {
  --content-photo-primary: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1800&q=85");
  --content-photo-secondary: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/services/06-partners-vendors"]),
html:has(head link[rel="canonical"][href*="/services/07-ongoing-projects"]),
html:has(head link[rel="canonical"][href*="/services/09-pricing-payment"]),
html:has(head link[rel="canonical"][href*="/company/"]),
html:has(head link[rel="canonical"][href*="/partners/"]),
html:has(head link[rel="canonical"][href*="/pricing/"]),
html:has(head link[rel="canonical"][href*="/solutions/business/"]) {
  --content-photo-primary: url("/assets/billing/cafe-management.jpg");
  --content-photo-secondary: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/solutions/hospitality/"]),
html:has(head link[rel="canonical"][href*="/billing/"]) {
  --content-photo-primary: url("/assets/billing/guest-wifi.jpg");
  --content-photo-secondary: url("/assets/billing/print-shops.jpg");
}

html:has(head link[rel="canonical"][href*="/shop/"]),
html:has(head link[rel="canonical"][href*="/saints-hub/"]) {
  --content-photo-primary: url("/assets/billing/print-shops.jpg");
  --content-photo-secondary: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/services/10-hardware-networking"]),
html:has(head link[rel="canonical"][href*="/services/11-cybersecurity"]),
html:has(head link[rel="canonical"][href*="/services/12-cloud-computing"]),
html:has(head link[rel="canonical"][href*="/services/13-web-software"]),
html:has(head link[rel="canonical"][href*="/services/14-data-business-intel"]),
html:has(head link[rel="canonical"][href*="/services/15-iot-smart"]),
html:has(head link[rel="canonical"][href*="/solutions/internet-hubs/"]),
html:has(head link[rel="canonical"][href*="/solutions/isps/"]) {
  --closing-photo: url("https://images.unsplash.com/photo-1581092160607-ee22621dd758?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/solutions/schools/"]),
html:has(head link[rel="canonical"][href*="/solutions/ngos/"]),
html:has(head link[rel="canonical"][href*="/services/17-ict-training"]) {
  --closing-photo: url("https://images.unsplash.com/photo-1531482615713-2afd69097998?auto=format&fit=crop&w=1800&q=85");
}

html:has(head link[rel="canonical"][href*="/solutions/business/"]),
html:has(head link[rel="canonical"][href*="/services/06-partners-vendors"]),
html:has(head link[rel="canonical"][href*="/services/07-ongoing-projects"]),
html:has(head link[rel="canonical"][href*="/services/09-pricing-payment"]) {
  --closing-photo: url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1800&q=85");
}

/* Match the homepage's broad canvas when users zoom out on interior pages. */
:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) {
  width: calc(100% - clamp(1rem, 3vw, 2.5rem)) !important;
  max-width: none !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(p, li, dd, dt, blockquote) {
  color: #f1f6fb !important;
  font-size: max(16px, 1em) !important;
  line-height: 1.7;
  max-width: 75ch;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(small, label, span, strong) {
  color: #f1f6fb !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(
  [class*="text-xs"]:not(p):not(li):not(dd):not(dt):not(blockquote),
  [class*="text-[10px]"]:not(p):not(li):not(dd):not(dt):not(blockquote),
  [class*="text-[11px]"]:not(p):not(li):not(dd):not(dt):not(blockquote),
  [class*="text-[12px]"]:not(p):not(li):not(dd):not(dt):not(blockquote)
) {
  font-size: max(14px, 1em) !important;
  line-height: 1.5;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(p, li, dd, dt, blockquote) {
  font-size: max(16px, 1em) !important;
  line-height: 1.7;
  max-width: 75ch;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) a:not([class*="bg-"]):not(.detail-actions a):not(.detail-cta a):not(.product-next-step-inner > a):not(.text-link) {
  color: #c9efff !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main > section > :is(.site-container, .detail-shell, .wrap, [class*="max-w"]) :is(.bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"], [class*="bg-blue-50"], [class*="bg-sky-50"], [class*="bg-emerald-50"], .card, .info-card, article, form) :is(h1, h2, h3, h4, p, li, dd, dt, blockquote, small, label, strong, span, a:not([class*="bg-"])) {
  color: #18314f !important;
}

:is(
  body.interior-page:not(.gallery-page),
  body.responsive-page:not(:has(main > section#home)),
  body.pricing-neural-page,
  body.solution-audience-page,
  body.services-page,
  body.contact-page,
  body:has(main > section.detail-hero):not(.gallery-page)
):not(.content-structure-page) main .wrap {
  width: calc(100% - clamp(1rem, 3vw, 2.5rem)) !important;
  max-width: none !important;
}

body.saints-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] {
  width: calc(100% - clamp(1rem, 3vw, 2.5rem)) !important;
  max-width: none !important;
}

/* Keep controls and text readable when photo-section copy sits on a light pill/card. */
.multi-photo-section .service-pill {
  color: #0039a6 !important;
  text-shadow: none !important;
}
.multi-photo-section .service-pill:hover,
.multi-photo-section .service-pill:focus-visible {
  color: #001a4d !important;
}
.multi-photo-section .bg-white a:not([class*="bg-"]),
.multi-photo-section .bg-slate-50 a:not([class*="bg-"]) {
  color: #0039a6 !important;
  text-shadow: none !important;
}

/* Saints Hub headings and intro panels are intentionally light surfaces. */
body.saints-page main > section:not(.saints-hero):not(#events) :is(
  .hub-section-heading,
  #teams > .max-w-6xl > div:first-child,
  #space-form > .max-w-6xl > div:first-child,
  #internships > .max-w-6xl > div:first-child
) :is(h1, h2, h3, h4, p, small, strong, span, a, li) {
  color: #18314f !important;
  text-shadow: none !important;
}
body.saints-page main > section:not(.saints-hero):not(#events) :is(
  .hub-section-heading,
  #teams > .max-w-6xl > div:first-child,
  #space-form > .max-w-6xl > div:first-child,
  #internships > .max-w-6xl > div:first-child
) :is(p, span)[class*="text-blue-"] {
  color: #0039a6 !important;
}
body.saints-page main > section:not(.saints-hero):not(#events) :is(
  .hub-section-heading,
  #teams > .max-w-6xl > div:first-child,
  #space-form > .max-w-6xl > div:first-child,
  #internships > .max-w-6xl > div:first-child
) :is(p, span)[class*="text-emerald-"] {
  color: #047857 !important;
}

/* Billing content sits on blue glass; only its explicitly light cards use dark text. */
body:has(#story) main > section:not(#live-screen):not(.billing-hero-v2) :is(
  h1, h2, h3, h4, p, li, small, label, strong, span, th, td, dt, dd, blockquote
) {
  color: #f1f6fb !important;
  text-shadow: none !important;
}
body:has(#story) main > section:not(#live-screen):not(.billing-hero-v2) > .site-container > .text-xs {
  color: #b9e9ff !important;
}
body:has(#story) main > section:not(#live-screen):not(.billing-hero-v2) > .site-container :is(
  .bg-white, .bg-slate-50, [class*="bg-white"], [class*="bg-slate-50"],
  [class*="bg-blue-50"], [class*="bg-sky-50"], [class*="bg-emerald-50"],
  .card, .info-card, article, form
) :is(h1, h2, h3, h4, p, li, small, label, strong, span, a:not([class*="bg-"]), th, td, dt, dd, blockquote) {
  color: #18314f !important;
  text-shadow: none !important;
}

/* Homepage-style cards stay dark-on-white inside Billing's photo-glass bands. */
body:has(#story) #main-content > section:is(#network-installation, #hotspot-programmes)
  :is(.homepage-capability-card, .homepage-solution-card)
  :is(h3, p, small, strong, span, a) {
  color: #18314f !important;
  text-shadow: none !important;
}
body:has(#story) #main-content > section:is(#network-installation, #hotspot-programmes)
  :is(.homepage-capability-card, .homepage-solution-card) {
  background: #fff !important;
}
body:has(#story) #main-content > section:is(#network-installation, #hotspot-programmes)
  :is(.homepage-capability-card, .homepage-solution-card)
  :is(.products-card-label, .homepage-solution-card__label) {
  color: #00664f !important;
}
body:has(#story) #main-content > section:is(#network-installation, #hotspot-programmes)
  :is(.homepage-capability-card, .homepage-solution-card)
  :is(.homepage-capability-card__cta, .homepage-solution-card__cta) {
  color: #0052cc !important;
}

/* Keep the billing controls readable on their white surface inside the blue glass section. */
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar {
  background: #fff !important;
  border-color: #bfdbfe !important;
  color: #18314f !important;
}
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar :is(
  h1, h2, h3, h4, p, li, small, label, strong, span, th, td, caption,
  a:not([class*="bg-"])
) {
  color: #18314f !important;
  text-shadow: none !important;
}
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar .billing-pricing-kicker {
  color: #0039a6 !important;
}
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar .billing-term-switch {
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar .billing-term-btn.active {
  color: #fff !important;
}
body.interior-page.responsive-page main#main-content > section#pricing:not(#live-screen):not(.billing-hero-v2) .billing-pricing-toolbar .billing-term-btn:not(.active) {
  color: #475569 !important;
}

/* Keep existing glass and photography; use the requested blue/white palette for light surfaces. */
:root {
  --surface-clean-white: #fff;
  --surface-blue-border: rgba(0, 57, 166, .24);
  --surface-blue-ink: #18314f;
  --surface-blue-muted: #31577d;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-gray-50"],
  [class~="bg-slate-100"],
  [class~="bg-gray-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-200"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"]
) {
  background-color: var(--surface-clean-white) !important;
  border-color: var(--surface-blue-border) !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-gray-50"],
  [class~="bg-slate-100"],
  [class~="bg-gray-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-200"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"]
) :is(
  [class~="text-slate-400"],
  [class~="text-slate-500"],
  [class~="text-slate-600"],
  [class~="text-slate-700"],
  [class~="text-gray-400"],
  [class~="text-gray-500"],
  [class~="text-gray-600"],
  [class~="text-gray-700"]
) {
  color: var(--surface-blue-muted) !important;
}

body:not(.theme-dark) :is(
  [class~="border-slate-100"],
  [class~="border-slate-200"],
  [class~="border-slate-300"],
  [class~="border-gray-100"],
  [class~="border-gray-200"],
  [class~="border-gray-300"]
) {
  border-color: var(--surface-blue-border) !important;
}

body.contact-page .contact-hero-backdrop::after {
  background: linear-gradient(
    90deg,
    rgba(0, 12, 30, .24),
    rgba(0, 26, 77, .18) 55%,
    rgba(0, 57, 166, .12)
  ) !important;
}

body.contact-page .contact-location-shade {
  background: linear-gradient(
    180deg,
    rgba(0, 26, 77, .12),
    rgba(0, 26, 77, .5)
  ) !important;
}

body.contact-page #contact-form,
body.contact-page .contact-technology-card,
body.contact-page .contact-hero + section aside .bg-white {
  background-color: var(--surface-clean-white) !important;
  border-color: var(--surface-blue-border) !important;
  color: var(--surface-blue-ink) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body.contact-page :is(
  #contact-form,
  .contact-technology-card,
  .contact-hero + section aside .bg-white
) :is(h2, h3, p, li, small, label, strong, dt, dd, [class*="text-slate-"]) {
  color: var(--surface-blue-ink) !important;
  text-shadow: none !important;
}

body.contact-page #contact-form :is(input, select, textarea),
body.contact-page .contact-technology-select {
  color: var(--surface-blue-ink) !important;
  background-color: #fff !important;
  border-color: #93c5fd !important;
  -webkit-text-fill-color: var(--surface-blue-ink);
}

body.contact-page #contact-form :is(input, textarea)::placeholder {
  color: var(--surface-blue-muted) !important;
  opacity: 1;
}

body.contact-page #contact-form button[type="submit"] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.contact-page .contact-form-map {
  background: #fff;
  border-color: #93c5fd;
}

body.contact-page .contact-form-map-heading h3,
body.contact-page .contact-form-map-heading a {
  color: #0039a6;
}

/* Unavailable feature marks are amber rather than pink/red; the meaning stays clear. */
.text-rose-500 {
  color: #c2410c !important;
}

@media (max-width: 639px) {
  body.contact-page .contact-hero h1 {
    font-size: clamp(2rem, 9.2vw, 3.2rem);
    line-height: 1.02;
  }
}

/* Warm editorial headlines pair with a familiar, highly readable body face. */
:root {
  --site-font-body: "Inter", system-ui, sans-serif;
  --site-font-display: "Lora", Georgia, serif;
  --site-surface-white: rgba(255, 255, 255, .98);
  --site-surface-border: #bfdbfe;
  --site-ink: #18314f;
}

body {
  font-family: var(--site-font-body) !important;
}

body .font-mono:not(code):not(pre) {
  font-family: var(--site-font-body) !important;
}

body code,
body pre {
  font-family: "JetBrains Mono", ui-monospace, monospace !important;
}

body :is(h1, h2),
body .font-serif {
  font-family: var(--site-font-display) !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em;
}

body :is(h3, h4) {
  font-family: var(--site-font-body) !important;
  font-weight: 700 !important;
}

body .shop-filter-heading h2,
body .hub-compact-form h2,
body .nav-a11y-panel h2 {
  font-family: var(--site-font-body) !important;
  font-weight: 700 !important;
}

/* Pale utility cards stay white; transparent glass utilities remain untouched. */
body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) {
  background-color: var(--site-surface-white) !important;
  border-color: var(--site-surface-border) !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) :is(h1, h2, h3, h4, p, li, small, label, strong, dt, dd, blockquote) {
  color: var(--site-ink) !important;
  text-shadow: none !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) :is(p, li, blockquote) {
  font-size: max(15px, 1em) !important;
  line-height: 1.65 !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) :is([class~="text-xs"], [class~="text-[10px]"], [class~="text-[11px]"]) {
  font-size: max(13px, 1em) !important;
  line-height: 1.45 !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) small {
  font-size: max(13px, 1em) !important;
  line-height: 1.5 !important;
}

body main :is(input, select, textarea) {
  font-family: var(--site-font-body) !important;
  font-size: max(14px, 1em) !important;
  line-height: 1.5 !important;
}

body main label {
  font-family: var(--site-font-body) !important;
  font-size: max(12px, 1em) !important;
  line-height: 1.45 !important;
}

body:not(.theme-dark) main :is(
  [class~="bg-white"],
  [class~="bg-slate-50"],
  [class~="bg-slate-100"],
  [class~="bg-slate-200"],
  [class~="bg-gray-50"],
  [class~="bg-gray-100"],
  [class~="bg-zinc-50"],
  [class~="bg-neutral-50"],
  [class~="bg-pink-50"],
  [class~="bg-pink-100"],
  [class~="bg-rose-50"],
  [class~="bg-rose-100"],
  [class~="bg-fuchsia-50"],
  [class~="bg-fuchsia-100"],
  [class~="bg-purple-50"],
  [class~="bg-purple-100"],
  [class~="bg-violet-50"],
  [class~="bg-violet-100"]
) a:not([class*="bg-"]) {
  color: #0039a6 !important;
  text-shadow: none !important;
}

/* Keep the chosen section photos, but replace the dull dark wash with clear blue-white. */
body:not(.theme-dark) main > section.multi-photo-section:not(.position-statement):not(#brands)::before {
  background-blend-mode: multiply;
}

body:not(.theme-dark) main > section.multi-photo-section:not(.position-statement):not(#brands)::after {
  background: linear-gradient(
    125deg,
    rgba(255, 255, 255, .76),
    rgba(239, 246, 255, .78)
  ) !important;
}

body:not(.theme-dark) main > section.multi-photo-section:not(.position-statement):not(#brands) :is(
  h1, h2, h3, h4, p, li, small, label, strong, blockquote
) {
  color: var(--site-ink) !important;
  text-shadow: none !important;
}

body:not(.theme-dark) main > section.multi-photo-section:not(.position-statement):not(#brands) :is(p, li) {
  font-size: max(15px, 1em) !important;
  line-height: 1.65;
}

/* Responsive glass-card defaults were tinting pale cards with the photo beneath them. */
body:not(.theme-dark).responsive-page main :is(
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  .glass-card
) {
  background-color: var(--site-surface-white) !important;
  border-color: var(--site-surface-border) !important;
}

body:not(.theme-dark).responsive-page main :is(
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  .glass-card
) svg {
  color: #0039a6 !important;
}

body:not(.theme-dark).responsive-page main :is(
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  .glass-card
) :is(a, button)[class*="bg-"] svg {
  color: #fff !important;
}

/* Give light photo sections a blue-white wash, not a grey-black overlay. */
body:not(.theme-dark) main > section#about.multi-photo-section::after,
body:not(.theme-dark) main > section#about-company.multi-photo-section::after,
body:not(.theme-dark) main > section#divisions.multi-photo-section::after,
body:not(.theme-dark) main > section#projects.multi-photo-section::after,
body:not(.theme-dark) main > section#how-we-work.multi-photo-section::after,
body:not(.theme-dark) main > section#client-notes.multi-photo-section::after,
body:not(.theme-dark) main > section#blog.multi-photo-section::after,
body:not(.theme-dark) main > section#partners.multi-photo-section::after,
body:not(.theme-dark) main > section.who-we-are.multi-photo-section::after {
  background: linear-gradient(
    125deg,
    rgba(255, 255, 255, .76),
    rgba(239, 246, 255, .78)
  ) !important;
}

body:not(.theme-dark) main > section#about.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#about-company.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#divisions.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#projects.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#how-we-work.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#client-notes.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#blog.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section#partners.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote),
body:not(.theme-dark) main > section.who-we-are.multi-photo-section :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote) {
  color: var(--site-ink) !important;
  text-shadow: none !important;
}

/* Keep photo-backed sections blue-glass while making every light card opaque white. */
body:not(.theme-dark).responsive-page main :is(
  .glow-card,
  .glass-card,
  .info-card,
  .contact-form-panel,
  .tab-content-card,
  .service-card,
  .feature-card,
  .card,
  [class*="card"][class*="rounded-"],
  article[class*="rounded-"],
  [class*="rounded-"][class~="bg-white"],
  [class*="rounded-"][class~="bg-slate-50"],
  [class*="rounded-"][class~="bg-gray-50"],
  [class*="rounded-"][class*="bg-pink-"],
  [class*="rounded-"][class*="bg-rose-"],
  [class*="rounded-"][class*="bg-fuchsia-"],
  [class*="rounded-"][class*="bg-purple-"],
  [class*="rounded-"][class*="bg-violet-"]
):not([class*="/"]) {
  background-color: #fff !important;
  border-color: var(--site-surface-border) !important;
}

/* The first section after the homepage hero introduces the leadership portrait. */
html.js #about .about-founder-column.visible .about-founder-image-frame {
  animation: about-portrait-arrive .85s cubic-bezier(.16, 1, .3, 1) both;
}

html.js #about .about-founder-column.visible .about-founder-badge {
  animation: about-leadership-arrive .82s cubic-bezier(.16, 1, .3, 1) .2s both;
}

html.js #about .about-copy-column.visible {
  animation: about-copy-arrive .72s cubic-bezier(.16, 1, .3, 1) .12s both;
}

html.js #about .about-copy-column.visible .about-proof-grid > div {
  animation: about-proof-arrive .5s cubic-bezier(.16, 1, .3, 1) both;
}

html.js #about .about-copy-column.visible .about-proof-grid > div:nth-child(2) {
  animation-delay: .08s;
}

html.js #about .about-copy-column.visible .about-proof-grid > div:nth-child(3) {
  animation-delay: .16s;
}

html.js #about .about-copy-column.visible .about-proof-grid > div:nth-child(4) {
  animation-delay: .24s;
}

@keyframes about-portrait-arrive {
  from {
    clip-path: inset(0 0 14% 0 round 1rem);
    opacity: .72;
    transform: translateY(18px) scale(.985);
  }
  to {
    clip-path: inset(0 round 1rem);
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes about-leadership-arrive {
  from {
    opacity: 0;
    transform: translateY(16px) scale(.98);
  }
  72% {
    opacity: 1;
    transform: translateY(-2px) scale(1);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes about-copy-arrive {
  from {
    opacity: .72;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes about-proof-arrive {
  from {
    opacity: .6;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js #about .about-founder-column.visible .about-founder-image-frame,
  html.js #about .about-founder-column.visible .about-founder-badge,
  html.js #about .about-copy-column.visible,
  html.js #about .about-copy-column.visible .about-proof-grid > div {
    animation: none !important;
    clip-path: none;
    opacity: 1;
    transform: none;
  }
}

/* A shared hero contract keeps every route legible without flattening its imagery. */
body :is(
  .content-hero-compact,
  .service-hero,
  .services-compact-hero,
  .contact-hero,
  .detail-hero,
  .gallery-hero,
  .shop-hero,
  .saints-hero,
  .billing-hero-v2,
  .shero
) h1,
body.services-page .hero-wrapper h1 {
  max-width: min(100%, 24ch);
  font-size: clamp(2.4rem, 4.8vw, 5.25rem);
  line-height: 1.04;
  letter-spacing: -.035em;
  text-wrap: balance;
}

body :is(
  .content-hero-compact,
  .service-hero,
  .services-compact-hero,
  .contact-hero,
  .detail-hero,
  .gallery-hero,
  .shop-hero,
  .saints-hero,
  .billing-hero-v2,
  .shero
) h1 + p,
body.services-page .hero-wrapper h1 + p {
  max-width: min(100%, 66ch);
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  line-height: 1.65;
  text-wrap: pretty;
}

#home.hero-fullscreen .hero-content-shell {
  padding-block: clamp(3.5rem, 7vh, 6rem) clamp(4rem, 8vh, 7rem);
}

#home.hero-fullscreen .hero-copy h1 {
  max-width: 100%;
  font-size: clamp(2.65rem, 5.8vw, 6.25rem);
  line-height: 1;
}

#home.hero-fullscreen .hero-copy > p {
  max-width: 66ch;
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  line-height: 1.65;
}

#home.hero-fullscreen .hero-copy > .flex.flex-wrap.items-center {
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
}

#home.hero-fullscreen .hero-cta-secondary {
  color: #fff !important;
  background: rgba(0, 26, 77, .72) !important;
  border-color: rgba(255, 255, 255, .46) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .45);
}

.service-hero {
  min-height: clamp(34rem, 52vw, 41rem);
}

.contact-hero {
  padding-block: clamp(3.5rem, 6vw, 5.25rem);
}

.services-page .services-compact-hero {
  min-height: clamp(30rem, 55vh, 38rem);
}

body.solution-audience-page .shero {
  padding-block: clamp(4rem, 7vw, 6rem);
}

@media (max-width: 640px) {
  body :is(
    .content-hero-compact,
    .service-hero,
    .services-compact-hero,
    .contact-hero,
    .detail-hero,
    .gallery-hero,
    .shop-hero,
    .saints-hero,
    .billing-hero-v2,
    .shero
  ) h1,
  body.services-page .hero-wrapper h1 {
    font-size: clamp(2.2rem, 9vw, 3.35rem);
    line-height: 1.06;
  }

  #home.hero-fullscreen,
  #home.hero-fullscreen .hero-content-shell {
    min-height: auto;
  }

  #home.hero-fullscreen > div.relative.z-10.hero-content-shell {
    padding-block: 6rem 4rem;
  }

  #home .hero-layout-grid {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    row-gap: .25rem;
    min-height: 0 !important;
  }

  #home .hero-copy,
  #home .hero-tools {
    display: contents;
  }

  #home .hero-eyebrow { order: 1; margin-bottom: .75rem; }
  #home .hero-copy h1 { order: 2; }
  #home .hero-copy > p { order: 3; }
  #home .hero-actions { order: 4; }
  #home .hero-solution-finder { order: 5; }
  #home .hero-trust-grid { order: 6; margin-top: 1rem; }
  #home .hero-services { order: 7; margin-bottom: 0; }
  #home .hero-proof-grid { order: 8; padding-top: 1rem; }

  #home #solution-finder {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #home .hero-layout-grid .hero-solution-finder .grid.grid-cols-2,
  #home .hero-layout-grid .hero-services > .grid.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.responsive-page > main#main-content > #home.hero-fullscreen .hero-layout-grid .hero-trust-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.responsive-page > main#main-content > #home.hero-fullscreen .hero-layout-grid .hero-trust-grid > div > div:last-child {
    font-size: .72rem;
  }

  #home.hero-fullscreen .hero-copy h1 {
    font-size: clamp(2.35rem, 10.6vw, 3.4rem);
    line-height: 1.04;
  }

  #home.hero-fullscreen .hero-copy > p {
    font-size: 1rem;
    line-height: 1.6;
  }

  .service-hero {
    min-height: 0;
  }

  .service-hero > .site-container {
    padding-block: 5rem 3rem;
  }

  body.solution-audience-page .shero {
    padding-block: 3.5rem;
  }
}

/* Keep translucent white utilities as glass instead of treating them as white cards. */
body:not(.theme-dark).responsive-page main :is(
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  .glow-card,
  .info-card,
  .contact-form-panel,
  .tab-content-card,
  .service-card,
  .feature-card,
  .card,
  [class*="card"][class*="rounded-"],
  article[class*="rounded-"]
):not([class*="bg-white/"]):not([class*="bg-slate-50/"]):not([class*="bg-gray-50/"]) {
  background-color: #fff !important;
  background-image: none;
  border-color: #bfdbfe !important;
}

body:not(.theme-dark).responsive-page main :is(
  [class*="bg-pink-"],
  [class*="bg-rose-"],
  [class*="bg-fuchsia-"],
  [class*="bg-purple-"],
  [class*="bg-violet-"]
) {
  background-color: #fff !important;
  background-image: none !important;
  border-color: #bfdbfe !important;
}

body:not(.theme-dark).responsive-page main :is(
  [class*="bg-pink-"],
  [class*="bg-rose-"],
  [class*="bg-fuchsia-"],
  [class*="bg-purple-"],
  [class*="bg-violet-"]
) :is(h1, h2, h3, h4, p, li, small, label, strong, dt, dd, blockquote, span, a:not([class*="bg-"])) {
  color: #18314f !important;
  text-shadow: none !important;
}

body:not(.theme-dark).responsive-page main :is(
  .glow-card,
  .info-card,
  .contact-form-panel,
  .tab-content-card,
  .service-card,
  .feature-card,
  .card,
  [class*="card"][class*="rounded-"],
  article[class*="rounded-"],
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  [class*="bg-pink-"],
  [class*="bg-rose-"],
  [class*="bg-fuchsia-"],
  [class*="bg-purple-"],
  [class*="bg-violet-"]
):not([class*="/"]) :is(h1, h2, h3, h4, p, li, small, label, strong, dt, dd, blockquote, span, a:not([class*="bg-"])) {
  color: #18314f !important;
  text-shadow: none !important;
}

body:not(.theme-dark).responsive-page main :is(
  .glow-card,
  .info-card,
  .contact-form-panel,
  .tab-content-card,
  .service-card,
  .feature-card,
  .card,
  [class*="card"][class*="rounded-"],
  article[class*="rounded-"],
  [class~="bg-white"][class*="rounded-"],
  [class~="bg-slate-50"][class*="rounded-"],
  [class~="bg-gray-50"][class*="rounded-"],
  [class*="bg-pink-"],
  [class*="bg-rose-"],
  [class*="bg-fuchsia-"],
  [class*="bg-purple-"],
  [class*="bg-violet-"]
):not([class*="/"]) :is(p, li, small, label, blockquote) {
  font-size: max(15px, 1em) !important;
  line-height: 1.6 !important;
}

/* Keep the homepage product dashboard on its intended blue-glass surface. */
#smas .analytics-panel {
  color: #f8fbff;
  background: rgba(0, 26, 77, .92) !important;
  border-color: rgba(191, 219, 254, .42) !important;
  -webkit-backdrop-filter: blur(14px) saturate(145%) !important;
  backdrop-filter: blur(14px) saturate(145%) !important;
}

#smas .analytics-panel > .grid > div {
  min-width: 0;
  border-color: rgba(191, 219, 254, .3);
  background-color: rgba(0, 12, 38, .62);
}

#smas .analytics-panel :is(.text-slate-300, .text-slate-500) {
  color: #dbeafe !important;
}

#smas .analytics-panel > .grid > div > div:first-child,
#smas .analytics-chart > div:first-child,
#smas .analytics-panel > .space-y-3 > div:first-child {
  font-family: var(--site-font-body);
  font-size: .8rem !important;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .035em;
}

#smas .analytics-panel > .space-y-3 > div:not(:first-child) {
  font-family: var(--site-font-body);
  font-size: .85rem;
  line-height: 1.5;
}

#smas .analytics-panel > .mt-4 {
  flex-wrap: wrap;
  gap: .75rem;
  color: #dbeafe !important;
  font-family: var(--site-font-body);
  font-size: .8rem !important;
  line-height: 1.5;
}

#smas .saints-analytics-metrics > div,
#smas .grid.grid-cols-2.mb-8 > div {
  border-color: rgba(191, 219, 254, .35);
  background-color: rgba(0, 26, 77, .8) !important;
}

#smas .grid.grid-cols-2.mb-8 :is(.text-slate-400, .text-white, .text-emerald-400) {
  color: #f8fbff !important;
}

#smas .grid.grid-cols-2.mb-8 > div > div:first-child {
  font-family: var(--site-font-body);
  font-size: .8rem !important;
  font-weight: 700;
  line-height: 1.4;
}

/* Shop Lift: preserve its hero photo and glass palette; make catalogue reading effortless. */
.shop-page .shop-market-head {
  align-items: center;
  padding: clamp(1.25rem, 2.5vw, 2rem);
  border: 1px solid #bfdbfe;
  border-radius: 1rem;
  background: rgba(255, 255, 255, .98);
}

body.shop-page.responsive-page #main-content .shop-market-head > div > p:first-child,
.shop-page .shop-market-head > div > p:first-child {
  color: #047857 !important;
  font-size: .85rem;
  font-weight: 800;
  letter-spacing: .08em;
}

.shop-page .shop-market-head h2,
.shop-page .shop-sell-band h2 {
  color: #001a4d;
  font-family: var(--site-font-display);
  font-size: clamp(1.9rem, 3vw, 2.6rem);
  line-height: 1.12;
  letter-spacing: -.025em;
  text-wrap: balance;
}

body.shop-page.responsive-page #main-content .shop-market-head p.mt-2,
.shop-page .shop-market-head p.mt-2 {
  max-width: 68ch;
  color: #334155 !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

.shop-page .shop-card {
  background: #fff !important;
  border-color: #bfdbfe !important;
}

.shop-page .shop-card h3 {
  color: #001a4d !important;
  font-family: var(--site-font-display);
  font-size: 1.3rem;
  line-height: 1.2;
  text-wrap: balance;
}

.shop-page .shop-card p:not(.shop-category) {
  color: #334155 !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
}

.shop-page .shop-card .shop-category {
  color: #047857 !important;
  font-family: var(--site-font-body);
  font-size: .8rem !important;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.4;
}

.shop-page .shop-card strong {
  color: #0039a6 !important;
  font-size: .95rem;
  line-height: 1.4;
}

.shop-page .shop-card a {
  color: #0039a6 !important;
  font-size: .95rem;
  line-height: 1.4;
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}

body.shop-page.responsive-page #main-content .shop-filter-panel :is(legend, label),
.shop-page .shop-filter-panel :is(legend, label) {
  color: #18314f !important;
  font-family: var(--site-font-body);
  font-size: .9rem !important;
  line-height: 1.5;
}

.shop-page .shop-filter-panel legend {
  color: #001a4d !important;
  font-size: 1rem !important;
}

body.shop-page.responsive-page #main-content .shop-filter-toggle span {
  color: #0039a6 !important;
}

.shop-page .shop-note {
  color: #18314f !important;
  font-size: .95rem !important;
  line-height: 1.6 !important;
}

.shop-page .shop-sell-band {
  border-color: rgba(191, 219, 254, .7);
}

.shop-page .shop-sell-band h2,
.shop-page .shop-sell-band p:not(.text-xs) {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
}

.shop-page .shop-sell-band p:not(.text-xs) {
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

.contact-technology-kicker {
  color: #047857;
  font-family: var(--site-font-display);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .01em;
}

.contact-project-scope {
  padding-top: 1.35rem;
  border-top: 1px solid #d7e0ea;
}

.contact-project-scope__heading {
  margin-bottom: 1rem;
}

.contact-project-scope__heading h3 {
  color: #001a4d;
  font-size: 1.05rem;
  font-weight: 800;
}

.contact-project-scope__heading p {
  margin-top: .3rem;
  color: #475569;
  font-size: .85rem;
  line-height: 1.55;
}

.community-rollout-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2rem;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #cbd5e1;
}

.community-rollout-steps li {
  padding: 1.35rem 0;
  border-bottom: 1px solid #cbd5e1;
}

.community-rollout-steps h3 {
  color: #00306f;
  font-size: 1.05rem;
  font-weight: 850;
}

.community-rollout-steps p {
  max-width: 62ch;
  margin-top: .5rem;
  color: #334a67;
  font-size: .92rem;
  line-height: 1.65;
}

@media (max-width: 767px) {
  .community-rollout-steps {
    grid-template-columns: minmax(0, 1fr);
  }

  .shop-page .shop-market-head {
    align-items: stretch;
  }

  .shop-page .shop-market-head h2 {
    font-size: 1.85rem;
  }

  #smas .analytics-panel {
    padding: 1rem;
  }

  #smas .analytics-panel > .space-y-3 > div:not(:first-child) {
    overflow-wrap: anywhere;
  }
}

.directory-board .directory-hero-surface {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5.5rem, 10vw, 8rem) 0 4.5rem;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(3, 7, 18, .92), rgba(0, 26, 77, .76) 58%, rgba(0, 26, 77, .62)),
    url("/assets/billing/internet-hubs.jpg") center / cover no-repeat,
    #030712;
}

.events-page.directory-board .directory-hero-surface {
  background-image:
    linear-gradient(90deg, rgba(3, 7, 18, .92), rgba(0, 26, 77, .76) 58%, rgba(0, 26, 77, .62)),
    url("/assets/billing/print-shops.jpg");
}

.directory-board .directory-hero-surface h1 {
  max-width: 18ch;
  color: #fff;
  font-size: clamp(2.75rem, 6vw, 7.5rem);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .99;
  text-wrap: balance;
}

.directory-board .directory-hero-surface p {
  max-width: 62ch;
  color: #e6eef8;
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  line-height: 1.7;
}

.directory-board .detail-actions a:first-child {
  color: #001a4d !important;
}

.directory-board .detail-actions a + a {
  color: #fff !important;
}

.directory-board .project-areas {
  background-color: #f8fafc;
}

.theme-dark.directory-board .project-areas {
  background-color: #071326;
}

@media (max-width: 560px) {
  .directory-board .directory-hero-surface {
    padding-top: 5.5rem;
  }
}

.saints-man-page .detail-hero h1 {
  max-width: 18ch;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2.5rem, 5.5vw, 5.5rem);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.04;
}

.saints-breadcrumbs {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: 1.5rem;
  color: #dbeafe;
  font-size: .85rem;
}

.saints-breadcrumbs a {
  color: #fff;
  text-decoration: underline;
  text-decoration-color: rgba(191, 219, 254, .6);
  text-underline-offset: .2rem;
}

.saints-breadcrumbs a:focus-visible {
  outline: 3px solid #67e8f9;
  outline-offset: 4px;
}

.saints-man-audience > p:not(.directory-note-label) {
  max-width: 38ch;
  color: #e6eef8;
  font-size: 1rem;
  line-height: 1.7;
}

.saints-man-page .saints-feature-list {
  margin: 0;
  padding: 0;
  border-top: 1px solid #cbd5e1;
  list-style: none;
}

.saints-feature-list li {
  display: grid;
  grid-template-columns: minmax(12rem, .7fr) minmax(0, 1fr);
  align-items: baseline;
  gap: 1rem 2rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid #cbd5e1;
}

.saints-feature-list h3 {
  margin: 0;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.35;
}

.saints-feature-list p {
  margin: 0;
  color: #43546b;
  font-size: 1rem;
  line-height: 1.7;
}

.documentation-page .site-container {
  max-width: 1440px;
}

.documentation-page #documentation h1,
.documentation-page #documentation-topics h2,
.documentation-page #documentation-topics h3,
.documentation-page aside h3,
.documentation-page aside h4 {
  font-family: "Lora", Georgia, serif;
}

.documentation-page #documentation h1 {
  max-width: 18ch;
  font-size: clamp(2.25rem, 4vw, 3.25rem);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.08;
}

.documentation-page #documentation-topics h2 {
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1.3;
}

.documentation-page #documentation-topics h3,
.documentation-page aside .doc-card span {
  font-size: .92rem;
  line-height: 1.45;
}

.documentation-page #documentation-topics .doc-card {
  min-height: 5rem;
}

.documentation-page #documentation-topics .doc-card span {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
}

.documentation-page #documentation-topics > div > div:first-child p {
  color: #52627a;
  font-size: .9rem;
  line-height: 1.55;
}

.documentation-page aside .doc-card span {
  font-size: .88rem;
}

.documentation-page aside > div > p,
.documentation-page aside > div > a {
  font-size: .9rem;
  line-height: 1.55;
}

.documentation-page [data-doc-empty-state] {
  color: #f1f5f9;
  font-size: .9rem;
  line-height: 1.5;
}

body.directory-board:has(#hotspots) main > section .detail-shell .project-empty-state :is(h3, p:not(.product-audience)) {
  color: #18314f !important;
  text-shadow: none !important;
}

body.directory-board:has(#hotspots) main > section .detail-shell .project-empty-state .product-audience {
  color: #075e54 !important;
}

body.directory-board:has(#hotspots) main > section .detail-shell .project-empty-state .text-link {
  color: #0039a6 !important;
}

@media (max-width: 760px) {
  .saints-feature-list li {
    grid-template-columns: 1fr;
    gap: .35rem;
  }
}

/* Keep product, delivery and support pages readable instead of applying the
   sitewide glass treatment to their editorial content sections. */
body.content-structure-page main > section:not(:first-of-type):not(:last-of-type) {
  background-color: #f5f8fc !important;
  background-image: none !important;
}

body.content-structure-page main > section.project-process {
  background-color: #fff !important;
}

body.content-structure-page main > section.project-preparation {
  background-color: #eaf1fa !important;
}

body.content-structure-page main > section.detail-cta {
  background-color: #001a4d !important;
  background-image: none !important;
}

body.content-structure-page main > section:not(:first-of-type):not(:last-of-type) > .detail-shell {
  box-sizing: border-box;
  width: min(calc(100% - 3rem), 76rem) !important;
  max-width: 76rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #18314f !important;
}

body.content-structure-page main > section:not(:first-of-type):not(:last-of-type) > .detail-shell :is(h1, h2, h3, h4, p, li, small, label, strong, span) {
  color: #18314f !important;
  text-shadow: none !important;
}

body.content-structure-page main > section:not(:first-of-type):not(:last-of-type) > .detail-shell :is(p, li) {
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

body.content-structure-page .directory-section-heading {
  margin-bottom: 2rem;
}

body.content-structure-page .directory-section-heading > p {
  max-width: 58ch;
  color: #43546b !important;
}

body.content-structure-page .product-row,
body.content-structure-page .project-area-list article {
  min-width: 0;
  background: transparent !important;
  border-color: #d4deea !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body.content-structure-page .product-row-detail,
body.content-structure-page .project-area-list article > *,
body.content-structure-page .project-preparation-inner > * {
  min-width: 0;
}

body.content-structure-page .product-row-detail li,
body.content-structure-page .project-area-list article > p,
body.content-structure-page .project-steps p,
body.content-structure-page .project-preparation li {
  color: #43546b !important;
}

body.content-structure-page .text-link {
  color: #0039a6 !important;
}

body.company-readable-page.content-structure-page main > section.company-overview,
body.company-readable-page.content-structure-page main > section.company-services-section,
body.company-readable-page.content-structure-page main > section.company-portfolio-section {
  background-color: #f3f7fb !important;
  background-image: none !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose,
body.company-readable-page.content-structure-page main > section.company-connectivity-pricing {
  background-color: #fff !important;
  background-image: none !important;
}

body.company-readable-page.content-structure-page main > section.company-mandate-section {
  background-color: #08254a !important;
  background-image: none !important;
}

body.company-readable-page.content-structure-page main > section.company-mandate-section
  .company-mandate-heading h2,
body.company-readable-page.content-structure-page main > section.company-mandate-section
  .company-mandate-list strong {
  color: #fff !important;
}

body.company-readable-page.content-structure-page main > section.company-mandate-section
  .company-mandate-heading p,
body.company-readable-page.content-structure-page main > section.company-mandate-section
  .company-mandate-list span {
  color: #dceafb !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section {
  background-color: #06152d !important;
  background-image: none !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  .company-credentials-inner h2 {
  color: #fff !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  .company-credentials-inner h3 {
  color: #a7f3d9 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  .company-credentials-inner p {
  color: #e2edf8 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  .company-credentials-inner aside li {
  color: #e2edf8 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  .company-credentials-inner aside li strong {
  color: #fff !important;
}

.hotspot-rollout-section {
  padding-block: clamp(3rem, 6vw, 5rem);
  background: #f3f7fb;
}

body:has(#story) main > section#hotspot-rollout {
  background: #f3f7fb !important;
  background-image: none !important;
}

body:has(#story) main > section#hotspot-rollout .hotspot-rollout-copy h2 {
  color: #001a4d !important;
}

body:has(#story) main > section#hotspot-rollout .hotspot-rollout-copy > p {
  color: #334a67 !important;
}

.hotspot-rollout-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1.5rem, 3.5vw, 2.75rem);
  width: min(calc(100% - clamp(2rem, 8vw, 7rem)), 78rem);
  margin-inline: auto;
}

.hotspot-rollout-copy h2 {
  max-width: 26ch;
  color: #001a4d;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 3.8vw, 3.15rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.hotspot-rollout-copy > p {
  max-width: 72ch;
  margin-top: 1rem;
  color: #334a67;
  font-size: 1rem;
  line-height: 1.7;
}

.hotspot-rollout-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2.4vw, 1.75rem);
}

.hotspot-rollout-card {
  width: 100%;
  min-height: 100%;
}

.hotspot-rollout-card .homepage-solution-card__image {
  height: clamp(10rem, 17vw, 13rem);
}

.hotspot-rollout-card .homepage-solution-card__content {
  min-height: 17rem;
}

.hotspot-rollout-card .homepage-solution-card__content h3 {
  max-width: 22ch;
}

.hotspot-rollout-card .homepage-solution-card__content p {
  max-width: 48ch;
}

body.billing-page:has(#story) main > section#hotspot-rollout .hotspot-rollout-card h3 {
  color: #001a4d !important;
}

body.billing-page:has(#story) main > section#hotspot-rollout .hotspot-rollout-card p {
  color: #263f63 !important;
}

body.billing-page:has(#story) main > section#hotspot-rollout .hotspot-rollout-card .homepage-solution-card__cta {
  color: #0052cc !important;
}

.hotspot-rollout-card__logo {
  display: block;
  width: 7.5rem;
  height: 3.5rem;
  margin-bottom: 1rem;
  padding: .35rem .55rem;
  border: 1px solid #e1e9f4;
  border-radius: .65rem;
  background: #fff;
  object-fit: contain;
}

.hotspot-rollout-card--network {
  border-color: rgba(110, 231, 183, .7);
}

body.billing-page:has(#story) main > section#hotspot-rollout .hotspot-rollout-card--network .homepage-solution-card__cta {
  color: #00664f !important;
}

body.billing-page #network-installation {
  background-color: #f3f7fb !important;
  background-image: none !important;
}

body.billing-page #network-installation > div.max-w-\[2560px\] {
  box-sizing: border-box;
  width: min(calc(100% - clamp(2rem, 4vw, 6rem)), 2560px) !important;
  max-width: 2560px !important;
  margin: 0 auto !important;
  padding: clamp(2.75rem, 5vw, 4.5rem) 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #18314f !important;
}

body.billing-page #network-installation > div.max-w-\[2560px\]
  :is(h2, h3, h4, p, li, small, strong) {
  color: #18314f !important;
  text-shadow: none !important;
}

body.billing-page #network-installation > div.max-w-\[2560px\]
  .homepage-platform__intro {
  max-width: 70ch;
  color: #334a67 !important;
  line-height: 1.7;
}

body.billing-page #network-installation .homepage-capability-card {
  border-color: #d6e1ed;
  background: #fff;
}

body.billing-page #network-installation .homepage-capability-card :is(h3, p, span) {
  color: #18314f !important;
}

body.billing-page #network-installation .homepage-capability-card__cta {
  color: #003f80 !important;
}

.billing-managed-wifi {
  display: grid;
  grid-template-columns: minmax(15rem, .78fr) minmax(0, 1.22fr);
  gap: clamp(1.5rem, 4vw, 3.25rem);
  margin-top: clamp(3rem, 5vw, 4.5rem);
  padding: clamp(1rem, 2.5vw, 1.75rem);
  background: #fff;
  color: #18314f;
}

.billing-managed-wifi-visual {
  position: relative;
  min-height: 23rem;
  overflow: hidden;
  background: #0b3150;
}

.billing-managed-wifi-visual::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 17, 42, .02) 35%, rgba(0, 17, 42, .76) 100%);
  content: "";
}

.billing-managed-wifi-visual img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
}

.billing-managed-wifi-visual > span {
  position: absolute;
  z-index: 1;
  right: 1rem;
  bottom: 1rem;
  left: 1rem;
  color: #fff;
  font-size: .88rem;
  font-weight: 800;
}

.billing-managed-wifi-content {
  min-width: 0;
  align-self: center;
  padding-block: .75rem;
}

.billing-managed-wifi-content h3 {
  max-width: 22ch;
  color: #001a4d !important;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.8rem, 3vw, 2.65rem);
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: 1.1;
}

.billing-managed-wifi-content > p {
  max-width: 65ch;
  margin-top: .8rem;
  color: #334a67 !important;
  font-size: .98rem;
  line-height: 1.7;
}

.billing-managed-wifi .billing-wifi-sites {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 1.2rem;
  border-color: #cbd5e1;
  border-bottom: 0;
}

.billing-managed-wifi .billing-wifi-sites a {
  min-height: 3rem;
  padding-inline: .25rem .75rem;
  border-color: #cbd5e1;
  color: #00306f !important;
  font-size: .88rem;
}

.billing-managed-wifi .billing-wifi-sites a:nth-child(even) {
  padding-left: .75rem;
  border-right: 0;
}

.billing-managed-wifi .billing-wifi-sites a:hover,
.billing-managed-wifi .billing-wifi-sites a:focus-visible {
  background: #edf6ff;
  color: #0052cc !important;
}

.billing-managed-wifi .billing-wifi-billing {
  margin-top: 1rem;
  padding-top: .9rem;
  border-top: 1px solid #cbd5e1;
}

.billing-wifi-speed-list {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.billing-wifi-speed-list span {
  padding: .35rem .6rem;
  background: #e9f3fd;
  color: #00306f;
  font-size: .8rem;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}

.billing-managed-wifi .billing-wifi-billing p {
  max-width: 65ch;
  margin: 0;
  color: #425875 !important;
  font-size: .9rem;
  line-height: 1.6;
}

.billing-managed-wifi .billing-wifi-billing a {
  color: #0052a3;
  font-weight: 800;
  text-underline-offset: .2em;
}

.billing-managed-wifi .billing-wifi-link {
  min-height: 2.9rem;
  align-items: center;
  margin-top: 1rem;
  padding: .7rem .9rem;
  background: #0759a5;
  color: #fff !important;
  text-decoration: none;
}

.billing-managed-wifi .billing-wifi-link:hover,
.billing-managed-wifi .billing-wifi-link:focus-visible {
  background: #003f80;
}

.billing-partner-callout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(15rem, .7fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 4rem);
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border: 1px solid #cbd5e1;
  background: #fff;
}

.billing-partner-callout h3 {
  max-width: 30ch;
  margin: 0;
  color: #092342;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.6rem, 2.6vw, 2.25rem);
  font-weight: 850;
  letter-spacing: -.03em;
  line-height: 1.15;
}

.billing-partner-callout p {
  max-width: 78ch;
  margin: .65rem 0 0;
  color: #334a67;
  font-size: .96rem;
  line-height: 1.65;
}

.billing-partner-actions {
  display: grid;
  justify-items: start;
  gap: .85rem;
}

.billing-partner-apply {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  padding: .7rem .95rem;
  background: #0759a5;
  color: #fff;
  font-size: .9rem;
  font-weight: 850;
  text-decoration: none;
}

.billing-partner-apply:hover,
.billing-partner-apply:focus-visible {
  background: #003f80;
}

.billing-partner-details {
  color: #0052a3;
  font-size: .88rem;
  font-weight: 800;
  text-underline-offset: .2em;
}

.billing-partner-details:hover,
.billing-partner-details:focus-visible {
  color: #00366b;
}

body:has(#story).billing-page main > section#network-installation:not(#live-screen):not(.billing-hero-v2)
  > div[class*="max-w"] .billing-partner-callout :is(h3, p) {
  color: #18314f !important;
  text-shadow: none !important;
}

body:has(#story).billing-page main > section#network-installation:not(#live-screen):not(.billing-hero-v2)
  > div[class*="max-w"] .billing-partner-callout .billing-partner-apply {
  background: #0759a5 !important;
  color: #fff !important;
}

body:has(#story).billing-page main > section#network-installation:not(#live-screen):not(.billing-hero-v2)
  > div[class*="max-w"] .billing-partner-callout .billing-partner-details {
  color: #0052a3 !important;
}

.hotspot-programmes-page .product-next-step {
  position: relative;
  min-height: 0;
  padding-block: clamp(3rem, 6vw, 5rem);
  background: #06244b;
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}

.hotspot-programmes-page .product-next-step-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(13rem, .75fr);
  align-items: center;
  width: min(calc(100% - clamp(2rem, 8vw, 7rem)), 78rem);
  min-height: 0;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  margin-inline: auto;
}

body.hotspot-programmes-page.responsive-page main > section.product-next-step > .site-section-photo {
  position: absolute;
  z-index: 0;
  inset-inline-start: 42%;
}

body.hotspot-programmes-page.responsive-page main > section.product-next-step > .site-section-photo > img {
  position: absolute;
  inset: 0;
}

.hotspot-programmes-page .site-section-photo img {
  object-position: 62% center;
}

.hotspot-programmes-page .site-section-photo::after {
  background: linear-gradient(90deg, #06244b 0%, rgba(6, 36, 75, .96) 24%, rgba(6, 36, 75, .34) 100%);
}

.hotspot-programmes-page .product-next-step h2 {
  color: #fff;
}

.hotspot-programmes-page .product-next-step p {
  color: #e2edf8;
}

.hotspot-programmes-page .product-next-step-inner > a {
  justify-self: start;
  border-color: #fff;
  background: #fff;
  color: #00306f;
}

.hotspot-programmes-page .product-next-step-inner > a:hover,
.hotspot-programmes-page .product-next-step-inner > a:focus-visible {
  border-color: #d6ebff;
  background: #d6ebff;
  color: #00264d;
}

@media (max-width: 850px) {
  .hotspot-rollout-cards {
    grid-template-columns: minmax(0, 1fr);
  }

  .hotspot-programmes-page .product-next-step-inner {
    grid-template-columns: minmax(0, 1fr);
    width: min(calc(100% - 2rem), 42rem);
  }

  body.hotspot-programmes-page.responsive-page main > section.product-next-step > .site-section-photo {
    inset-inline-start: 0;
  }

  .hotspot-programmes-page .site-section-photo::after {
    background: linear-gradient(90deg, rgba(6, 36, 75, .96), rgba(6, 36, 75, .7));
  }

  .billing-managed-wifi {
    grid-template-columns: minmax(0, 1fr);
  }

  .billing-partner-callout {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
  }

  .billing-managed-wifi-visual {
    min-height: 18rem;
  }
}

@media (max-width: 600px) {
  .company-overview-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: .5rem;
  }

  .hotspot-rollout-inner {
    width: min(calc(100% - 2rem), 42rem);
  }

  .hotspot-rollout-card .homepage-solution-card__content {
    min-height: 0;
  }

  body.billing-page #network-installation > div.max-w-\[2560px\] {
    width: min(calc(100% - 2rem), 42rem) !important;
  }

  .billing-managed-wifi {
    padding: 0;
  }

  .billing-managed-wifi-content {
    padding: 0 0 1.25rem;
  }
}

.navbar-glass .nav-category-dropdown a.nav-events-cta {
  display: grid !important;
  grid-template-columns: 2.65rem minmax(0, 1fr) auto;
  align-items: center;
  justify-content: initial;
  gap: .75rem;
  min-height: 4.4rem;
  margin: .2rem 0 .55rem;
  padding: .75rem !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: .75rem !important;
  background: linear-gradient(110deg, #ecfdf5, #f0fdf4 62%, #eff6ff) !important;
  color: #064e3b !important;
  text-align: left;
  text-decoration: none;
  transition: border-color .18s ease, background-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.navbar-glass .nav-category-dropdown a.nav-events-cta:hover,
.navbar-glass .nav-category-dropdown a.nav-events-cta:focus-visible {
  border-color: #059669 !important;
  background: #dcfce7 !important;
  box-shadow: 0 8px 20px rgba(6, 95, 70, .14);
  color: #064e3b !important;
  transform: translateY(-1px);
}

.nav-events-icon {
  display: grid;
  width: 2.65rem;
  height: 2.65rem;
  place-items: center;
  border-radius: .65rem;
  background: #047857;
  color: #fff;
}

.nav-events-icon svg {
  width: 1.35rem;
  height: 1.35rem;
  stroke-width: 2.2;
}

.nav-events-copy {
  display: grid;
  gap: .18rem;
  min-width: 0;
}

.nav-events-copy strong {
  color: #064e3b;
  font-size: .88rem;
  font-weight: 850;
  line-height: 1.25;
}

.nav-events-copy small {
  color: #365c52;
  font-size: .71rem;
  font-weight: 600;
  line-height: 1.35;
}

.nav-events-arrow {
  width: 1rem;
  height: 1rem;
  color: #047857;
}

.documentation-page .content-hero-compact {
  min-height: 0;
  padding: clamp(3rem, 6vw, 5rem) 0;
}

body.documentation-page .content-hero-compact {
  background: linear-gradient(115deg, #06152b, #0b2340 70%, #102e4a) !important;
}

.documentation-page .content-hero-compact .site-hero-image,
.documentation-page .content-hero-compact .hero-content-overlay,
.documentation-page .content-hero-compact .interior-action-row {
  display: none !important;
}

.documentation-page .content-hero-compact {
  padding-block: clamp(2.5rem, 5vw, 4rem) !important;
}

.documentation-page .site-container {
  width: min(calc(100% - 3rem), 78rem) !important;
  max-width: 78rem !important;
  padding-inline: 0 !important;
}

.documentation-page main > section#documentation > .site-container {
  margin: 0 auto !important;
  padding-block: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.documentation-page main {
  background: #f5f8fc;
}

.documentation-page main > .site-container {
  padding-block: clamp(2.5rem, 5vw, 4rem);
}

.documentation-page #documentation-topics > div {
  padding-bottom: 1.75rem;
  border-bottom: 1px solid #d9e2ee;
}

.documentation-page #documentation-topics > div:last-child {
  border-bottom: 0;
}

.documentation-page #documentation-topics .doc-card {
  min-height: 5.25rem;
  border-color: #d5dfeb !important;
  border-radius: .65rem !important;
  background: #fff !important;
  box-shadow: 0 2px 6px rgba(16, 35, 63, .035) !important;
  color: #18314f !important;
}

.documentation-page #documentation-topics .doc-card:hover,
.documentation-page #documentation-topics .doc-card:focus-visible {
  border-color: #8fb3dd !important;
  box-shadow: 0 8px 18px rgba(16, 35, 63, .08) !important;
  transform: translateY(-1px);
}

@media (max-width: 760px) {
  body.content-structure-page main > section:not(:first-of-type):not(:last-of-type) > .detail-shell,
  .documentation-page .site-container {
    width: min(calc(100% - 1.5rem), 76rem) !important;
  }

  .documentation-page .content-hero-compact {
    padding-block: 2.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .navbar-glass .nav-category-dropdown a.nav-events-cta {
    transition: none;
  }
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands):not(#how-we-work)::after {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 0 !important;
  background: linear-gradient(125deg, rgba(0, 26, 77, .42), rgba(0, 57, 166, .34)) !important;
  pointer-events: none;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands):not(#how-we-work) > div[class*="max-w"] :is(
  h1, h2, h3, h4, p, li, small, label, strong, blockquote,
  [class*="text-slate-"], [class*="text-[#0039A6]"]
):not(.glow-card *):not(.project-card *):not(.blog-card *):not(.homepage-solution-card *):not(.homepage-capability-card *):not(.client-sector-grid > div *):not(.delivery-promise-grid > div *) {
  color: #f1f6fb !important;
  text-shadow: 0 1px 2px rgba(0, 16, 48, .28) !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands) > div[class*="max-w"] :is(
  .glow-card,
  .project-card,
  .blog-card,
  .homepage-solution-card,
  .homepage-capability-card,
  .client-sector-grid > div,
  .delivery-promise-grid > div
) :is(h1, h2, h3, h4, p, li, small, label, strong, blockquote, [class*="text-slate-"], [class*="text-[#0039A6]"]) {
  color: #18314f !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands) > div[class*="max-w"] a:not([class*="bg-"]) {
  color: #e7f1ff !important;
  text-shadow: 0 1px 2px rgba(0, 16, 48, .28) !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands) > div[class*="max-w"] a.service-pill:not([class*="bg-"]) {
  color: #0039a6 !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands) > div[class*="max-w"] :is(
  .glow-card,
  .project-card,
  .blog-card,
  .homepage-solution-card,
  .homepage-capability-card,
  .client-sector-grid > div,
  .delivery-promise-grid > div
) a:not([class*="bg-"]) {
  color: #0039a6 !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands) > div[class*="max-w"] :is(p, li) {
  line-height: 1.65;
  text-wrap: pretty;
}

body:has(main > section#home) .homepage-section-kicker {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: 0 0 .75rem;
  color: #047857;
  font-family: var(--site-font-body);
  font-size: .78rem;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .11em;
  text-transform: uppercase;
}

body:has(main > section#home) .homepage-section-kicker::before {
  width: 1.75rem;
  height: 2px;
  flex: 0 0 auto;
  background: #059669;
  content: "";
}

@media (max-width: 639px) {
  body:has(main > section#home):not(.content-structure-page) main > section.homepage-open-section > div[class*="max-w"] {
    padding-inline: 1rem;
  }
}

/* Keep the brand-entity reading order clear, with one consistent card rhythm. */
body:has(main > section#home) #brands .brand-entity-intro {
  max-width: 48rem;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

body:has(main > section#home) #brands .brand-entity-intro > p {
  max-width: 44rem;
  margin-inline: auto;
  color: #d7e6f8 !important;
  font-size: 1rem;
  line-height: 1.65;
}

body:has(main > section#home) #brands .brand-entity-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  height: 100%;
  padding: clamp(1.25rem, 1.6vw, 1.75rem) !important;
  border-color: rgba(255, 255, 255, .76) !important;
  border-radius: 1rem !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(0, 12, 45, .2) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body:has(main > section#home) #brands .brand-entity-mark {
  display: flex;
  flex: 0 0 3.5rem;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 1rem;
  border-radius: .75rem;
}

body:has(main > section#home) #brands .brand-entity-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body:has(main > section#home) #brands .brand-entity-name {
  margin-bottom: .35rem;
  color: #047857 !important;
  font-size: 1.2rem;
  line-height: 1.3;
}

body:has(main > section#home) #brands .brand-entity-type {
  margin-bottom: .85rem;
  color: #18314f !important;
  font-family: var(--site-font-body);
  font-size: .875rem;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .045em;
}

body:has(main > section#home) #brands .brand-entity-description {
  margin: 0;
  color: #102a4c !important;
  font-size: 1rem !important;
  font-weight: 500;
  line-height: 1.6 !important;
}

body:has(main > section#home) #brands > div[class*="max-w"] > div:last-child {
  gap: 1rem 2rem;
}

@media (max-width: 639px) {
  body:has(main > section#home) #brands .brand-entity-intro {
    margin-bottom: 1.75rem;
  }
}

body#company-page.company-page #leadership-team .site-container > .grid > .bg-white {
  border-color: #dbe5f0 !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: 0 12px 30px rgba(0, 26, 77, .1) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body#company-page.company-page #leadership-team .bg-white :is(h3, h4, p) {
  color: #102a4c !important;
  text-shadow: none !important;
}

body#company-page.company-page #leadership-team .bg-white :is(h3, h4) {
  font-size: max(1rem, 1em) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

body#company-page.company-page #leadership-team .bg-white :is(p) {
  font-size: max(1rem, 1em) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

body#company-page.company-page #leadership-team .bg-white :is(h3, h4) + div {
  color: #047857 !important;
  font-size: max(.875rem, .95em) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

/* Pale gray card utilities resolve to crisp white surfaces across every light page. */
body:not(.theme-dark) main :is(
  [class*="card"],
  article,
  form,
  [class~="rounded-xl"]:not([role="tablist"]):not(button):not(a):not(input):not(select):not(textarea),
  [class~="rounded-2xl"],
  [class~="rounded-3xl"]
):is(
  [class~="bg-slate-50"],
  [class*="bg-slate-50/"],
  [class~="bg-slate-100"],
  [class*="bg-slate-100/"],
  [class~="bg-slate-200"],
  [class*="bg-slate-200/"],
  [class~="bg-gray-50"],
  [class*="bg-gray-50/"],
  [class~="bg-gray-100"],
  [class*="bg-gray-100/"],
  [class~="bg-gray-200"],
  [class*="bg-gray-200/"],
  [class~="bg-zinc-50"],
  [class*="bg-zinc-50/"],
  [class~="bg-neutral-50"],
  [class*="bg-neutral-50/"],
  [class~="bg-stone-50"],
  [class*="bg-stone-50/"]
) {
  background: #fff !important;
  background-image: none !important;
  border-color: #bfdbfe !important;
  box-shadow: 0 12px 30px rgba(0, 26, 77, .08);
}

body:not(.theme-dark) main :is(
  [class*="card"],
  article,
  form,
  [class~="rounded-xl"]:not([role="tablist"]):not(button):not(a):not(input):not(select):not(textarea),
  [class~="rounded-2xl"],
  [class~="rounded-3xl"]
):is(
  [class~="bg-slate-50"],
  [class*="bg-slate-50/"],
  [class~="bg-slate-100"],
  [class*="bg-slate-100/"],
  [class~="bg-slate-200"],
  [class*="bg-slate-200/"],
  [class~="bg-gray-50"],
  [class*="bg-gray-50/"],
  [class~="bg-gray-100"],
  [class*="bg-gray-100/"],
  [class~="bg-gray-200"],
  [class*="bg-gray-200/"],
  [class~="bg-zinc-50"],
  [class*="bg-zinc-50/"],
  [class~="bg-neutral-50"],
  [class*="bg-neutral-50/"],
  [class~="bg-stone-50"],
  [class*="bg-stone-50/"]
) :is(h1, h2, h3, h4) {
  color: #001a4d !important;
  text-shadow: none !important;
}

/* Outrank older interior-section surface overrides without changing blue glass panels. */
:is(body:not(.theme-dark).interior-page.responsive-page, body:not(.theme-dark)) :is(main#main-content, main) :is(
  [class*="card"],
  article,
  form,
  [class~="rounded-xl"]:not([role="tablist"]):not(button):not(a):not(input):not(select):not(textarea),
  [class~="rounded-2xl"],
  [class~="rounded-3xl"]
):is(
  [class~="bg-slate-50"],
  [class*="bg-slate-50/"],
  [class~="bg-slate-100"],
  [class*="bg-slate-100/"],
  [class~="bg-slate-200"],
  [class*="bg-slate-200/"],
  [class~="bg-gray-50"],
  [class*="bg-gray-50/"],
  [class~="bg-gray-100"],
  [class*="bg-gray-100/"],
  [class~="bg-gray-200"],
  [class*="bg-gray-200/"],
  [class~="bg-zinc-50"],
  [class*="bg-zinc-50/"],
  [class~="bg-neutral-50"],
  [class*="bg-neutral-50/"],
  [class~="bg-stone-50"],
  [class*="bg-stone-50/"]
) {
  background: #fff !important;
  background-image: none !important;
  border-color: #bfdbfe !important;
}

body:not(.theme-dark) main :is(
  [class*="card"],
  article,
  form,
  [class~="rounded-xl"]:not([role="tablist"]):not(button):not(a):not(input):not(select):not(textarea),
  [class~="rounded-2xl"],
  [class~="rounded-3xl"]
):is(
  [class~="bg-slate-50"],
  [class*="bg-slate-50/"],
  [class~="bg-slate-100"],
  [class*="bg-slate-100/"],
  [class~="bg-slate-200"],
  [class*="bg-slate-200/"],
  [class~="bg-gray-50"],
  [class*="bg-gray-50/"],
  [class~="bg-gray-100"],
  [class*="bg-gray-100/"],
  [class~="bg-gray-200"],
  [class*="bg-gray-200/"],
  [class~="bg-zinc-50"],
  [class*="bg-zinc-50/"],
  [class~="bg-neutral-50"],
  [class*="bg-neutral-50/"],
  [class~="bg-stone-50"],
  [class*="bg-stone-50/"]
) :is(p, li, dd, dt, blockquote) {
  color: #18314f !important;
  font-size: max(15px, 1em) !important;
  line-height: 1.6 !important;
  text-shadow: none !important;
}

body:not(.theme-dark) main :is(
  [class*="card"],
  article,
  form,
  [class~="rounded-xl"]:not([role="tablist"]):not(button):not(a):not(input):not(select):not(textarea),
  [class~="rounded-2xl"],
  [class~="rounded-3xl"]
):is(
  [class~="bg-slate-50"],
  [class*="bg-slate-50/"],
  [class~="bg-slate-100"],
  [class*="bg-slate-100/"],
  [class~="bg-slate-200"],
  [class*="bg-slate-200/"],
  [class~="bg-gray-50"],
  [class*="bg-gray-50/"],
  [class~="bg-gray-100"],
  [class*="bg-gray-100/"],
  [class~="bg-gray-200"],
  [class*="bg-gray-200/"],
  [class~="bg-zinc-50"],
  [class*="bg-zinc-50/"],
  [class~="bg-neutral-50"],
  [class*="bg-neutral-50/"],
  [class~="bg-stone-50"],
  [class*="bg-stone-50/"]
) :is(small, [class~="text-slate-400"], [class~="text-slate-500"], [class~="text-gray-400"], [class~="text-gray-500"]) {
  color: #31577d !important;
  font-size: max(13px, 1em) !important;
  line-height: 1.5 !important;
  text-shadow: none !important;
}

.navbar-glass .nav-dropdown.nav-products-dropdown,
.navbar-glass .nav-dropdown.nav-resources-dropdown {
  left: 50%;
  width: min(70rem, calc(100vw - 2rem));
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  padding: 1rem !important;
}

.navbar-glass nav > .nav-products-group,
.navbar-glass nav > .nav-company-group,
.navbar-glass nav > .nav-resources-group {
  position: static;
}

.navbar-glass nav > .nav-products-group > .nav-products-dropdown,
.navbar-glass nav > .nav-company-group > .nav-company-dropdown,
.navbar-glass nav > .nav-resources-group > .nav-resources-dropdown {
  top: calc(100% - .15rem);
}

.navbar-glass .nav-dropdown.nav-company-dropdown {
  left: 50%;
  width: min(54rem, calc(100vw - 2rem));
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  padding: 1rem !important;
}

.navbar-glass .nav-dropdown.nav-products-dropdown,
.navbar-glass .nav-dropdown.nav-company-dropdown,
.navbar-glass .nav-dropdown.nav-resources-dropdown {
  transform: translate(-50%, 10px);
}

.navbar-glass .group:hover .nav-dropdown.nav-products-dropdown,
.navbar-glass .group:focus-within .nav-dropdown.nav-products-dropdown,
.navbar-glass .group.nav-open .nav-dropdown.nav-products-dropdown,
.navbar-glass .group:hover .nav-dropdown.nav-company-dropdown,
.navbar-glass .group:focus-within .nav-dropdown.nav-company-dropdown,
.navbar-glass .group.nav-open .nav-dropdown.nav-company-dropdown,
.navbar-glass .group:hover .nav-dropdown.nav-resources-dropdown,
.navbar-glass .group:focus-within .nav-dropdown.nav-resources-dropdown,
.navbar-glass .group.nav-open .nav-dropdown.nav-resources-dropdown {
  transform: translate(-50%, 0);
}

.navbar-glass .nav-category-dropdown > h2 {
  grid-column: 1 / -1;
}

.nav-category-group {
  min-width: 0;
  padding-inline: .45rem;
}

.nav-category-group:not(:last-child) {
  border-right: 1px solid rgba(15, 42, 74, .1);
}

.nav-category-group h3 {
  margin: 0;
  padding: .45rem .65rem .6rem;
  color: #526982;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1.4;
}

.nav-category-group-links {
  display: grid;
  gap: .12rem;
}

.navbar-glass .nav-category-dropdown a.nav-category-link strong {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}

.products-page .products-card-label {
  margin-bottom: 1rem;
  color: #00664f;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  line-height: 1.4;
  text-transform: uppercase;
}

.products-page .products-card-label--development {
  color: #0039a6;
}

.nav-category-badge {
  display: inline-flex;
  align-items: center;
  padding: .12rem .35rem;
  border-radius: .25rem;
  background: #dbeafe;
  color: #0039a6 !important;
  font-size: .56rem !important;
  font-weight: 850;
  letter-spacing: .04em;
  line-height: 1.2 !important;
}

@media (max-width: 1279px) {
  .mobile-nav-submenu .nav-dropdown.nav-products-dropdown,
  .mobile-nav-submenu .nav-dropdown.nav-company-dropdown,
  .mobile-nav-submenu .nav-dropdown.nav-resources-dropdown {
    left: auto;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    transform: none;
  }

  .mobile-nav-submenu .nav-category-group {
    padding-inline: .25rem;
  }

  .mobile-nav-submenu .nav-category-group:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid rgba(15, 42, 74, .1);
    padding-bottom: .45rem;
  }

  .mobile-nav-submenu .nav-category-group h3 {
    padding-inline: .65rem;
  }

  .mobile-nav-submenu .nav-category-group-links {
    grid-template-columns: minmax(0, 1fr);
  }
}

body:has(#story).billing-page #network-installation .billing-managed-wifi .billing-managed-wifi-content :is(
  h3, p, strong, .billing-wifi-speed-list span, .billing-wifi-sites a
) {
  color: #18314f !important;
  text-shadow: none !important;
}

body:has(#story).billing-page #network-installation .billing-managed-wifi .billing-managed-wifi-content a.billing-wifi-link {
  color: #fff !important;
}

body:has(#story).billing-page #network-installation .billing-managed-wifi .billing-wifi-sites a span {
  color: #0759a5 !important;
}

body:has(#story).billing-page #network-installation .billing-managed-wifi .billing-wifi-billing a {
  color: #0052a3 !important;
}

/* Keep these content canvases aligned with the homepage's 2560px hero shell. */
.home-discovery-inner,
.managed-wifi-home-inner {
  box-sizing: border-box;
  width: min(100%, 2560px);
  max-width: 2560px;
  padding-inline: clamp(1rem, 4vw, 3rem);
}

.homepage-open-section > .max-w-\[2560px\] {
  box-sizing: border-box;
  width: min(100%, 2560px);
  max-width: 2560px;
  margin-inline: auto;
}

body.company-readable-page :is(
  .company-overview-inner,
  .company-mandate-inner,
  .company-purpose > .detail-shell,
  .company-services-section > .detail-shell,
  .company-credentials-section > .detail-shell,
  .company-hotspot-details > .detail-shell,
  .company-connectivity-pricing > .detail-shell,
  .company-portfolio-section > .detail-shell,
  .company-people-section > .detail-shell
) {
  box-sizing: border-box;
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px);
  max-width: 2560px;
  margin-inline: auto;
}

body.company-readable-page.content-structure-page main > section:is(
  .company-overview,
  .company-purpose,
  .company-mandate-section,
  .company-services-section,
  .company-credentials-section,
  .company-connectivity-pricing,
  .company-portfolio-section,
  .company-people-section
) > .detail-shell {
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px) !important;
  max-width: 2560px !important;
  margin-inline: auto !important;
}

.home-card-carousel {
  min-width: 0;
}

.home-card-carousel-track {
  display: flex;
  align-items: stretch;
  gap: 1.25rem;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding: .5rem .25rem 1.25rem;
  scroll-padding-inline: .25rem;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  scrollbar-color: #94a3b8 transparent;
}

.home-card-carousel-track:focus-visible {
  outline: 3px solid #00a3ff;
  outline-offset: 2px;
}

#divisions .home-card-carousel-track > .glow-card,
#projects .home-card-carousel-track > .project-card {
  display: flex;
  flex: 0 0 clamp(19rem, 30vw, 26rem);
  flex-direction: column;
  min-width: 0;
  scroll-snap-align: start;
}

.home-card-carousel-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 3rem;
  margin-top: .25rem;
}

.home-card-carousel-controls[hidden] {
  display: none;
}

.home-card-carousel-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-width: 7.5rem;
  min-height: 2.75rem;
  padding: .55rem .85rem;
  border: 1px solid #bfdbfe;
  border-radius: .75rem;
  background: #fff;
  color: #0039a6;
  font-size: .8rem;
  font-weight: 750;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.home-card-carousel-button:hover:not(:disabled) {
  border-color: #0039a6;
  background: #eff6ff;
  color: #001a4d;
}

.home-card-carousel-button:disabled {
  color: #64748b;
  cursor: not-allowed;
  opacity: .55;
}

.home-card-carousel-button i {
  width: 1rem;
  height: 1rem;
}

.home-card-carousel-status {
  margin: 0;
  color: #31577d;
  font-size: .78rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  text-align: center;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:is(#divisions, #projects):not(#home):not(#smas):not(#brands) > div[class*="max-w"] .home-card-carousel-controls .home-card-carousel-status {
  color: #18314f !important;
  font-size: .78rem !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:is(#divisions, #projects):not(#home):not(#smas):not(#brands) > div[class*="max-w"] .home-card-carousel-controls .home-card-carousel-button span {
  color: #0039a6 !important;
  font-size: .8rem !important;
  text-shadow: none !important;
}

body.theme-dark .home-card-carousel-button {
  border-color: #31577d;
  background: #0d2039;
  color: #dbeafe;
}

body.theme-dark .home-card-carousel-button:hover:not(:disabled) {
  border-color: #60a5fa;
  background: #18314f;
}

body.theme-dark .home-card-carousel-status {
  color: #d6e2f2;
}

body.theme-dark:has(main > section#home) main > section.homepage-open-section:is(#divisions, #projects):not(#home):not(#smas):not(#brands) > div[class*="max-w"] .home-card-carousel-controls .home-card-carousel-status {
  color: #d6e2f2 !important;
  text-shadow: none !important;
}

body.theme-dark:has(main > section#home) main > section.homepage-open-section:is(#divisions, #projects):not(#home):not(#smas):not(#brands) > div[class*="max-w"] .home-card-carousel-controls .home-card-carousel-button span {
  color: #dbeafe !important;
  text-shadow: none !important;
}

@media (max-width: 640px) {
  .home-card-carousel-track {
    gap: .9rem;
  }

  #divisions .home-card-carousel-track > .glow-card,
  #projects .home-card-carousel-track > .project-card {
    flex-basis: min(86vw, 26rem);
  }

  .home-card-carousel-button {
    min-width: 6.5rem;
    padding-inline: .65rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-card-carousel-track {
    scroll-behavior: auto;
  }
}

.home-card-carousel-track {
  gap: clamp(1rem, 1.5vw, 1.5rem);
  padding: .75rem 0 1.25rem;
  scrollbar-width: none;
}

.home-card-carousel,
.home-card-carousel-track,
.home-card-carousel-controls {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.home-card-carousel {
  display: block;
}

body.billing-page .hotspot-rollout-inner {
  box-sizing: border-box;
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px);
  max-width: 2560px;
}

body.billing-page .hotspot-rollout-cards .home-card-carousel-track > .hotspot-rollout-card {
  flex-basis: clamp(20rem, 35vw, 32rem);
}

.home-card-carousel--billing .home-card-carousel-track > * {
  box-sizing: border-box;
  flex: 0 0 clamp(18rem, 30vw, 27rem);
  min-width: 0;
  scroll-snap-align: start;
}

.home-card-carousel--billing .billing-step-card {
  flex-basis: clamp(18rem, 25vw, 23rem);
}

.home-card-carousel--billing .billing-use-case-card {
  flex-basis: clamp(19rem, 27vw, 25rem);
}

.home-card-carousel--billing .billing-plan-card {
  flex-basis: clamp(20rem, 31vw, 27rem);
}

body.billing-page #pricing .billing-plan-card.bg-slate-900 {
  background-color: #0f172a !important;
}

.home-card-carousel--billing .billing-addon-card {
  flex-basis: clamp(17rem, 22vw, 21rem);
}

.home-card-carousel--billing .homepage-capability-card,
.home-card-carousel--billing .homepage-solution-card {
  width: auto;
}

body.billing-page #story > .site-container,
body.billing-page #pricing > .site-container {
  box-sizing: border-box;
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px);
  max-width: 2560px;
  margin-inline: auto;
}

body.billing-page .billing-compare-wrap,
body.billing-page .billing-addons {
  box-sizing: border-box;
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px);
  max-width: 2560px;
  margin-inline: auto;
}

body.billing-page .billing-compare-wrap {
  margin-top: 4rem;
}

body.billing-page .billing-addons {
  margin-top: 3rem;
}

@media (max-width: 48rem) {
  body.billing-page #network-installation > div.max-w-\[2560px\] {
    width: min(calc(100% - 2rem), 2560px) !important;
    max-width: 2560px !important;
  }

  body.billing-page .hotspot-rollout-inner {
    width: min(calc(100% - 2rem), 2560px);
  }
}

.home-card-carousel-track::-webkit-scrollbar {
  display: none;
}

#divisions .home-card-carousel-track > .glow-card,
#projects .home-card-carousel-track > .project-card {
  flex-basis: clamp(22rem, 35vw, 30rem);
  border-radius: 1.35rem;
  scroll-snap-align: start;
}

#divisions .home-card-carousel-track > .glow-card > div:first-child,
#projects .home-card-carousel-track > .project-card > div:first-child {
  height: clamp(12rem, 16vw, 15rem);
}

#projects .home-card-carousel-track > .project-card > div:nth-child(2) {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: .2rem;
  padding: clamp(1.35rem, 2vw, 1.85rem);
}

#projects .home-card-carousel-track > .project-card > div:nth-child(2) > p {
  margin-bottom: 1.25rem;
}

#projects .home-card-carousel-track > .project-card > div:nth-child(2) > div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem 1rem;
  margin-top: auto;
}

.home-card-carousel-controls {
  justify-content: center;
  gap: 1.15rem;
  min-height: 3.5rem;
  margin-top: .15rem;
}

.home-card-carousel-button {
  width: 3rem;
  min-width: 3rem;
  min-height: 3rem;
  padding: 0;
  border-color: #dbe4ed;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 26, 77, .06);
}

.home-card-carousel-button:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0, 26, 77, .12);
}

.home-card-carousel-button:disabled {
  opacity: .42;
}

.home-card-carousel-progress {
  width: min(32vw, 14rem);
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: #dbe4ed;
}

.home-card-carousel-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #0039a6;
  transform: scaleX(.12);
  transform-origin: left center;
  transition: transform .24s ease-out;
}

body.theme-dark .home-card-carousel-progress {
  background: #31577d;
}

body.theme-dark .home-card-carousel-progress > span {
  background: #60a5fa;
}

body:has(main > section#home) main > section:is(#divisions, #projects) > div[class*="max-w"] :is(
  .home-card-carousel,
  .home-card-carousel-track,
  .home-card-carousel-controls
) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.how-we-work-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #fff !important;
}

.how-we-work-section::before,
.how-we-work-section::after {
  display: none !important;
}

.how-work-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, .7fr);
  align-items: end;
  gap: 1rem 3rem;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.how-work-heading h2 {
  max-width: 20ch;
  margin: 0;
  color: #001a4d !important;
  text-shadow: none !important;
}

.how-work-heading > p {
  max-width: 52ch;
  margin: 0 0 .25rem;
  color: #405572 !important;
  font-size: clamp(.98rem, 1.3vw, 1.1rem) !important;
  line-height: 1.65;
  text-shadow: none !important;
}

.how-work-marquee {
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
  overflow: hidden;
  border-block: 1px solid #dbe4ed;
  color: #18314f;
}

.how-work-marquee__track,
.how-work-marquee__group {
  display: flex;
  width: max-content;
  align-items: center;
}

.how-work-marquee__track {
  animation: how-work-marquee-scroll 34s linear infinite;
}

.how-work-marquee:hover .how-work-marquee__track {
  animation-play-state: paused;
}

.how-work-marquee__group {
  flex: 0 0 auto;
  gap: clamp(1rem, 2.2vw, 2.4rem);
  padding: .95rem clamp(1rem, 2.2vw, 2.4rem) .95rem 0;
}

.how-work-marquee__group > span:not(.how-work-marquee__separator) {
  color: #f1f6fb;
  font-size: clamp(.95rem, 1.25vw, 1.15rem);
  font-weight: 700;
  letter-spacing: -.015em;
  white-space: nowrap;
}

.how-work-marquee__separator {
  color: #34d399;
  font-size: 1.15rem;
  font-weight: 800;
}

@keyframes how-work-marquee-scroll {
  to { transform: translateX(-50%); }
}

.how-work-layout {
  display: grid;
  grid-template-columns: minmax(14rem, .72fr) minmax(0, 2fr);
  align-items: start;
  gap: clamp(2rem, 5vw, 5rem);
}

.how-work-intro h3 {
  margin: 0 0 .7rem;
  color: #001a4d !important;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  font-weight: 800;
  letter-spacing: -.025em;
  text-shadow: none !important;
}

.how-work-intro p {
  max-width: 34ch;
  margin: 0;
  color: #405572 !important;
  font-size: 1rem !important;
  line-height: 1.65;
  text-shadow: none !important;
}

.how-work-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid #dbe4ed;
}

.how-work-steps > article {
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr);
  align-content: start;
  gap: .8rem;
  min-width: 0;
  padding: 1.5rem clamp(.75rem, 2vw, 1.75rem) 1.5rem 0;
  border-bottom: 1px solid #dbe4ed;
}

.how-work-steps > article:nth-child(odd) {
  padding-right: clamp(.75rem, 2vw, 1.75rem);
}

.how-work-steps > article:nth-child(even) {
  padding-left: clamp(.75rem, 2vw, 1.75rem);
  border-left: 1px solid #dbe4ed;
}

.how-work-steps > article > span {
  color: #00866a;
  font-size: .85rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  line-height: 1.5;
}

.how-work-steps h3 {
  margin: 0 0 .4rem;
  color: #001a4d !important;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.35;
  text-shadow: none !important;
}

.how-work-steps p {
  max-width: 48ch;
  margin: 0;
  color: #405572 !important;
  font-size: .92rem !important;
  line-height: 1.6;
  text-shadow: none !important;
}

body.theme-dark .how-we-work-section {
  background: #081a30 !important;
}

body.theme-dark .how-work-heading h2,
body.theme-dark .how-work-intro h3,
body.theme-dark .how-work-steps h3,
body.theme-dark .how-work-marquee__group > span:not(.how-work-marquee__separator) {
  color: #f1f6fb !important;
}

body.theme-dark .how-work-heading > p,
body.theme-dark .how-work-intro p,
body.theme-dark .how-work-steps p {
  color: #c1d2e5 !important;
}

body.theme-dark .how-work-marquee {
  border-color: #31577d;
}

body.theme-dark .how-work-steps,
body.theme-dark .how-work-steps > article,
body.theme-dark .how-work-steps > article:nth-child(even) {
  border-color: #31577d;
}

#solutions-for-work {
  padding-block: clamp(4rem, 7vw, 7rem);
  background-color: #f7f9fc;
}

#solutions-for-work .homepage-solutions__header {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(17rem, .7fr);
  align-items: end;
  gap: 1rem 3rem;
  max-width: 76rem;
  margin-bottom: clamp(1.75rem, 3.5vw, 3rem);
}

#solutions-for-work .homepage-solutions__header h2 {
  max-width: 19ch;
  margin: 0;
}

#solutions-for-work .homepage-solutions__intro {
  margin: 0 0 .3rem;
}

.homepage-solutions__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  grid-template-rows: repeat(3, minmax(10rem, 1fr));
  gap: clamp(.85rem, 1.5vw, 1.35rem);
}

.homepage-solution-card {
  min-width: 0;
  min-height: 11rem;
  border-color: rgba(191, 219, 254, .78);
  border-radius: 1.2rem;
  box-shadow: 0 9px 26px rgba(0, 14, 48, .1);
}

.homepage-solution-card--featured {
  position: relative;
  grid-row: 1 / 4;
  min-height: 35rem;
  isolation: isolate;
  justify-content: flex-end;
  background: #0b2852;
}

.homepage-solution-card--featured::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 16, 48, .02) 22%, rgba(0, 16, 48, .88) 100%);
  content: "";
}

.homepage-solution-card--featured .homepage-solution-card__image {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
}

.homepage-solution-card--featured .homepage-solution-card__image img {
  object-position: center 42%;
}

.homepage-solution-card--featured .homepage-solution-card__content {
  flex: 0 0 auto;
  padding: clamp(1.5rem, 3.2vw, 3rem);
}

.homepage-solution-card--featured .homepage-solution-card__label {
  margin-bottom: .75rem;
  color: #a7f3d0;
}

.homepage-solution-card--featured h3,
body:not(.theme-dark):has(main > section#home) main > section#solutions-for-work .homepage-solution-card--featured h3 {
  max-width: 14ch;
  color: #fff !important;
  font-size: clamp(1.8rem, 3.2vw, 3.4rem);
  line-height: 1.05;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .28) !important;
}

.homepage-solution-card--featured p,
body:not(.theme-dark):has(main > section#home) main > section#solutions-for-work .homepage-solution-card--featured p {
  max-width: 46ch;
  margin-bottom: 1.35rem;
  color: #f1f6fb !important;
  font-size: 1rem !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .32) !important;
}

.homepage-solution-card--featured .homepage-solution-card__cta {
  color: #fff;
}

.homepage-solution-card--compact {
  flex-direction: row;
  align-items: stretch;
  background: #fff;
}

.homepage-solution-card--compact .homepage-solution-card__image {
  flex: 0 0 34%;
  width: 34%;
  height: auto;
  min-height: 100%;
}

.homepage-solution-card--compact .homepage-solution-card__content {
  justify-content: center;
  min-width: 0;
  padding: clamp(1rem, 1.8vw, 1.55rem);
}

.homepage-solution-card--compact .homepage-solution-card__label {
  margin-bottom: .4rem;
}

.homepage-solution-card--compact h3 {
  margin-bottom: .45rem;
  font-size: clamp(1.05rem, 1.35vw, 1.35rem);
}

.homepage-solution-card--compact p {
  margin-bottom: .7rem;
  font-size: .88rem;
  line-height: 1.5;
}

.homepage-solution-card--compact .homepage-solution-card__cta {
  font-size: .84rem;
}

.homepage-solution-card--compact.homepage-solution-card--community {
  border-color: #b8e6d3;
  background: #f1fbf6;
}

@media (max-width: 760px) {
  .home-card-carousel-track {
    gap: .9rem;
  }

  #divisions .home-card-carousel-track > .glow-card,
  #projects .home-card-carousel-track > .project-card {
    flex-basis: min(84vw, 30rem);
  }

  .how-work-heading,
  #solutions-for-work .homepage-solutions__header {
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
  }

  .how-work-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  .how-work-intro p {
    max-width: 55ch;
  }

  .homepage-solutions__grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .homepage-solution-card--featured {
    grid-row: auto;
    min-height: 28rem;
  }

  .homepage-solution-card--compact {
    min-height: 12rem;
  }
}

@media (max-width: 520px) {
  .how-work-steps {
    grid-template-columns: minmax(0, 1fr);
  }

  .how-work-steps > article:nth-child(even) {
    padding-left: 0;
    border-left: 0;
  }

  .how-work-steps > article:nth-child(odd) {
    padding-right: 0;
  }

  .homepage-solution-card--compact .homepage-solution-card__image {
    flex-basis: 30%;
    width: 30%;
  }

  .homepage-solution-card--compact .homepage-solution-card__content {
    padding: .9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .how-work-marquee__track {
    width: 100%;
    animation: none;
    transform: none;
  }

  .how-work-marquee__group {
    flex: 1 1 auto;
    flex-wrap: wrap;
    width: 100%;
    padding: .9rem 0;
  }

  .how-work-marquee__group[aria-hidden="true"] {
    display: none;
  }

  .home-card-carousel-progress > span {
    transition: none;
  }
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout {
  isolation: isolate;
  padding-block: clamp(4rem, 7vw, 6rem) !important;
  background:
    radial-gradient(circle at 12% 8%, rgba(16, 185, 129, .2), transparent 32%),
    linear-gradient(125deg, #061728, #0b2852 58%, #073b4d) !important;
  color: #f1f6fb;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout::before,
body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout::after {
  content: none !important;
  display: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout > div[class*="max-w"] {
  box-sizing: border-box;
  width: min(100%, 2560px) !important;
  max-width: 2560px !important;
  padding-inline: clamp(1rem, 4vw, 3rem) !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.homepage-community-rollout__header {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(17rem, .7fr);
  align-items: end;
  gap: 1rem 3rem;
  width: 100%;
  max-width: none;
  margin-bottom: clamp(2rem, 3.5vw, 3rem) !important;
}

.homepage-community-rollout__header h2 {
  max-width: 30ch;
  margin: 0;
  color: #fff !important;
  font-size: clamp(2rem, 2.8vw, 3.2rem);
  line-height: 1.08;
  text-shadow: none !important;
  text-wrap: balance;
}

.homepage-community-rollout__header p {
  max-width: 52ch;
  margin: 0 0 .25rem;
  color: #d4e5f5 !important;
  font-size: clamp(1rem, 1.3vw, 1.15rem) !important;
  line-height: 1.65;
  text-shadow: none !important;
}

.homepage-community-rollout__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
}

.homepage-rollout-card {
  position: relative;
  isolation: isolate;
  justify-content: flex-end;
  min-width: 0;
  min-height: clamp(25rem, 34vw, 33rem);
  border: 1px solid rgba(220, 240, 255, .4);
  border-radius: 1.4rem;
  overflow: hidden;
  background: #0b2852;
  box-shadow: 0 18px 40px rgba(0, 8, 24, .3);
  transition: transform .24s ease, box-shadow .24s ease;
}

.homepage-rollout-card::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 16, 48, .02) 8%, rgba(0, 16, 48, .94) 100%);
  content: "";
}

.homepage-rollout-card .homepage-solution-card__image {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
}

.homepage-rollout-card .homepage-solution-card__image img {
  object-position: center;
}

.homepage-rollout-card--regional .homepage-solution-card__image img {
  object-position: center 48%;
}

.homepage-rollout-card .homepage-solution-card__content {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  align-items: flex-start;
  padding: clamp(1.5rem, 3vw, 2.5rem);
}

.homepage-rollout-card .homepage-solution-card__label {
  display: inline-flex;
  align-items: center;
  margin-bottom: .9rem;
  padding: .35rem .75rem;
  border: 1px solid rgba(167, 243, 208, .55);
  border-radius: 999px;
  background: rgba(5, 39, 48, .72);
  color: #a7f3d0 !important;
  font-size: .7rem;
  letter-spacing: .11em;
}

.homepage-rollout-card h3 {
  max-width: 18ch;
  margin-bottom: .7rem;
  color: #fff !important;
  font-size: clamp(1.65rem, 2.5vw, 2.4rem);
  line-height: 1.12;
  text-shadow: none !important;
}

.homepage-rollout-card p {
  max-width: 48ch;
  margin-bottom: 1.25rem;
  color: #f1f6fb !important;
  font-size: 1rem !important;
  line-height: 1.65;
  text-shadow: none !important;
}

.homepage-rollout-card .homepage-solution-card__cta {
  color: #a7f3d0 !important;
  font-size: .95rem;
  text-decoration: underline;
  text-decoration-color: rgba(167, 243, 208, .6);
  text-underline-offset: .25em;
}

.homepage-rollout-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 48px rgba(0, 8, 24, .4);
}

.homepage-rollout-card:focus-visible {
  outline: 3px solid #a7f3d0;
  outline-offset: 4px;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card {
  border-color: rgba(220, 240, 255, .4) !important;
  background: #0b2852 !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card .homepage-solution-card__content {
  background: transparent !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card .homepage-solution-card__label {
  background: rgba(5, 39, 48, .72) !important;
  color: #a7f3d0 !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card h3,
body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card p {
  color: #fff !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card p {
  color: #f1f6fb !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout:not(#home):not(#smas):not(#brands) > div[class*="max-w"] .homepage-rollout-card .homepage-solution-card__cta {
  background: transparent !important;
  color: #a7f3d0 !important;
}

body:not(.theme-dark):has(main > section#home) main > section#how-we-work {
  background: #eef3f8 !important;
  background-image: none !important;
  color: #18314f;
}

body:not(.theme-dark):has(main > section#home) main > section#how-we-work::before,
body:not(.theme-dark):has(main > section#home) main > section#how-we-work::after {
  content: none !important;
  display: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#how-we-work > div[class*="max-w"] {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#how-we-work:not(#home):not(#smas):not(#brands) > div[class*="max-w"] :is(.how-work-heading h2, .how-work-intro h3, .how-work-steps h3) {
  color: #001a4d !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#how-we-work:not(#home):not(#smas):not(#brands) > div[class*="max-w"] :is(.how-work-heading > p, .how-work-intro p, .how-work-steps p) {
  color: #334b67 !important;
  text-shadow: none !important;
}

.how-work-marquee {
  padding-inline: 1rem;
  border: 0;
  border-radius: .85rem;
  background: #0b2852;
  color: #f1f6fb;
}

.how-work-steps {
  gap: .9rem;
  border-top: 0;
}

.how-work-steps > article,
.how-work-steps > article:nth-child(odd),
.how-work-steps > article:nth-child(even) {
  padding: 1.35rem;
  border: 1px solid #d8e3ed;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 8px 20px rgba(0, 26, 77, .07);
}

.how-work-steps > article > span {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border-radius: 50%;
  background: #e3f5ed;
  color: #00664f;
}

.how-work-steps h3 {
  color: #001a4d !important;
}

.how-work-steps p {
  color: #334b67 !important;
}

body.theme-dark .how-work-steps > article,
body.theme-dark .how-work-steps > article:nth-child(odd),
body.theme-dark .how-work-steps > article:nth-child(even) {
  border-color: #31577d;
  background: #10263f;
  box-shadow: none;
}

body.theme-dark .how-work-steps > article > span {
  background: #123b3a;
  color: #a7f3d0;
}

@media (max-width: 760px) {
  .homepage-community-rollout__header {
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
  }

  .homepage-community-rollout__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .homepage-rollout-card {
    min-height: 27rem;
  }
}

@media (max-width: 520px) {
  .homepage-rollout-card {
    min-height: 25rem;
  }

  .how-work-steps > article,
  .how-work-steps > article:nth-child(odd),
  .how-work-steps > article:nth-child(even) {
    padding: 1.15rem;
  }
}

.managed-wifi-page.content-structure-page main > section > .detail-shell {
  box-sizing: border-box;
  width: min(calc(100% - clamp(2rem, 4vw, 6rem)), 2560px) !important;
  max-width: 2560px !important;
  margin-inline: auto !important;
  color: inherit !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.managed-wifi-page .managed-wifi-hero-inner,
.managed-wifi-page .managed-wifi-intro-inner,
.managed-wifi-page .managed-wifi-system-inner,
.managed-wifi-page .managed-wifi-isp-inner {
  max-width: 2560px !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section:is(
  .managed-wifi-intro,
  .managed-wifi-packages,
  .managed-wifi-system,
  .managed-wifi-delivery,
  .managed-wifi-isp
) > .detail-shell :is(h1, h2, h3, h4, p, li, small, label, strong, span) {
  color: inherit !important;
  text-shadow: none !important;
}

body.managed-wifi-page.content-structure-page main > section:not(:first-of-type):not(:last-of-type) > .detail-shell {
  width: min(calc(100% - clamp(2rem, 4vw, 6rem)), 2560px) !important;
  max-width: 2560px !important;
  margin-inline: auto !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section:is(
  .managed-wifi-intro,
  .managed-wifi-packages,
  .managed-wifi-system,
  .managed-wifi-delivery,
  .managed-wifi-isp
) > .detail-shell {
  color: #eaf6ff !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section.managed-wifi-intro {
  background: #0874b5 !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section.managed-wifi-packages,
body.managed-wifi-page.content-structure-page main#main-content > section.managed-wifi-isp {
  background: #071521 !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section.managed-wifi-system {
  background: #0b2030 !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section.managed-wifi-delivery {
  background: linear-gradient(115deg, #0576b8, #07539a 58%, #06396d) !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section:is(
  .managed-wifi-intro,
  .managed-wifi-packages,
  .managed-wifi-system,
  .managed-wifi-delivery,
  .managed-wifi-isp
) > .detail-shell :is(.managed-wifi-section-label, .managed-wifi-package-type) {
  color: #78dfff !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section#wifi-packages > .detail-shell :is(.managed-wifi-package h3, .managed-wifi-speed-guide h3) {
  color: #fff !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section#wifi-packages > .detail-shell :is(.managed-wifi-package-copy > p:not(.managed-wifi-package-type), .managed-wifi-speed-guide p, .managed-wifi-package-note, .managed-wifi-billing-note) {
  color: #d2e1ed !important;
}

body.managed-wifi-page.content-structure-page main#main-content > section#wifi-packages > .detail-shell .managed-wifi-package-internet {
  color: #effaff !important;
}

.home-card-carousel--content .home-card-carousel-track > * {
  flex: 0 0 min(86vw, 36rem);
  min-width: 0;
  scroll-snap-align: start;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-solution-card {
  min-height: 29rem;
  flex-direction: column;
  align-items: stretch;
  justify-content: initial;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-solution-card .homepage-solution-card__image {
  position: relative;
  z-index: auto;
  inset: auto;
  flex: 0 0 auto;
  width: 100%;
  height: clamp(11rem, 16vw, 15rem);
  min-height: 0;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured::after {
  display: none;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured .homepage-solution-card__content {
  position: relative;
  z-index: auto;
  flex: 1;
  padding: clamp(1.25rem, 2vw, 1.7rem);
}

#solutions-for-work .home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured :is(.homepage-solution-card__label, h3, p, .homepage-solution-card__cta) {
  color: #18314f !important;
  text-shadow: none !important;
}

#solutions-for-work .home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured .homepage-solution-card__label {
  color: #00664f !important;
}

#solutions-for-work .home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured .homepage-solution-card__cta {
  color: #0052cc !important;
}

body:has(main > section#home) main > section#solutions-for-work .home-card-carousel--content .home-card-carousel-track > .homepage-solution-card--featured h3 {
  max-width: 24ch;
  font-size: clamp(1.25rem, 1.55vw, 1.65rem) !important;
  line-height: 1.18;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-capability-card {
  min-height: 31rem;
}

.home-card-carousel--content .home-card-carousel-track > .glow-card {
  display: flex;
  flex-direction: column;
  padding: clamp(1.4rem, 2.2vw, 2rem);
}

.home-card-carousel--content .home-card-carousel-track > .glow-card > div:last-child {
  margin-top: auto;
}

.home-card-carousel--content .home-card-carousel-track > .blog-card {
  display: flex;
  flex-direction: column;
}

.home-card-carousel--content .home-card-carousel-track > .blog-card > div:last-child {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
}

.home-card-carousel--content .home-card-carousel-track > .blog-card > div:last-child > a {
  margin-top: auto;
}

.home-card-carousel--content .home-card-carousel-track > .homepage-rollout-card {
  flex-basis: min(86vw, 46rem);
}

.homepage-solutions__grid.home-card-carousel-track {
  display: flex;
  grid-template-columns: none;
  grid-template-rows: none;
}

.client-sector-grid.home-card-carousel > .home-card-carousel-track {
  display: flex;
  grid-template-columns: none;
}

.client-sector-grid .home-card-carousel-track > div {
  display: grid;
  grid-template-columns: 2rem 1fr;
  column-gap: .65rem;
  align-content: start;
  min-width: 0;
  padding: 1rem;
  border: 1px solid #dbe5f0;
  border-radius: .85rem;
  background: #fff;
}

.delivery-promise-grid.home-card-carousel > .home-card-carousel-track {
  display: flex;
  grid-template-columns: none;
}

.delivery-promise-grid .home-card-carousel-track > div {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  min-width: 0;
}

.client-sector-grid.home-card-carousel,
.delivery-promise-grid.home-card-carousel {
  display: block;
  padding-top: 0;
  border-top: 0;
}

.client-sector-grid .home-card-carousel-track > div {
  flex: 0 0 min(86vw, 28rem);
}

.delivery-promise-grid .home-card-carousel-track > div {
  flex: 0 0 min(86vw, 36rem);
  padding: 1.25rem;
  border: 1px solid #d8e3ed;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 8px 20px rgba(0, 26, 77, .07);
}

body.theme-dark .delivery-promise-grid .home-card-carousel-track > div {
  border-color: #31577d;
  background: #10263f;
  box-shadow: none;
}

.home-card-carousel--managed-wifi {
  display: block;
  border-top: 0;
}

.home-card-carousel--managed-wifi .home-card-carousel-track > .managed-wifi-package {
  flex: 0 0 clamp(30rem, 42vw, 40rem);
  min-height: 0;
  padding: 0;
  border: 1px solid rgba(181, 218, 240, .24);
  border-radius: 1.15rem;
  background: #0c1e2c;
  overflow: hidden;
}

.home-card-carousel--managed-wifi .managed-wifi-package-photo {
  min-height: 16rem;
}

.home-card-carousel--managed-wifi .managed-wifi-package-copy {
  padding: clamp(1.25rem, 2.2vw, 1.8rem);
}

.home-card-carousel--managed-wifi .managed-wifi-package-copy > a {
  margin-top: auto;
}

.managed-wifi-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(20rem, .8fr);
  align-items: end;
  gap: .9rem clamp(2rem, 5vw, 5rem);
  max-width: none;
}

.managed-wifi-section-heading .managed-wifi-section-label {
  grid-column: 1 / -1;
  margin: 0;
}

.managed-wifi-section-heading h2 {
  max-width: 25ch;
  margin-top: 0;
}

.managed-wifi-section-heading > p:last-child {
  max-width: 66ch;
  margin: 0 0 .35rem;
}

@media (max-width: 900px) {
  .managed-wifi-section-heading {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 680px) {
  .home-card-carousel--content .home-card-carousel-track > * {
    flex-basis: min(88vw, 32rem);
  }

  .home-card-carousel--content .home-card-carousel-track > .homepage-solution-card,
  .home-card-carousel--content .home-card-carousel-track > .homepage-capability-card {
    min-height: 28rem;
  }

  .home-card-carousel--content .home-card-carousel-track > .homepage-rollout-card {
    flex-basis: min(88vw, 38rem);
    min-height: 25rem;
  }

  .client-sector-grid .home-card-carousel-track > div,
  .delivery-promise-grid .home-card-carousel-track > div {
    flex-basis: min(88vw, 32rem);
  }

  .home-card-carousel--managed-wifi .home-card-carousel-track > .managed-wifi-package {
    flex-basis: min(90vw, 40rem);
    grid-template-columns: minmax(0, 1fr);
  }

  .home-card-carousel--managed-wifi .managed-wifi-package-photo {
    min-height: 12rem;
  }

  .managed-wifi-section-heading h2 {
    font-size: clamp(2rem, 8vw, 3rem);
  }
}

body.billing-page #features > .site-container {
  box-sizing: border-box;
  width: min(100% - clamp(2rem, 4vw, 6rem), 2560px);
  max-width: 2560px;
  margin-inline: auto;
}

.billing-features-carousel .home-card-carousel-track > .billing-feature-card {
  display: flex;
  flex: 0 0 clamp(19rem, 28vw, 26rem);
  flex-direction: column;
  min-width: 0;
  scroll-snap-align: start;
}

body.billing-page .hotspot-rollout-cards {
  display: block;
  min-width: 0;
}

body.billing-page .hotspot-rollout-cards .home-card-carousel-track {
  width: 100%;
}

body.billing-page .hotspot-rollout-cards .home-card-carousel-track > .hotspot-rollout-card {
  flex: 0 0 min(46rem, calc(50% - .75rem));
}

.homepage-community-rollout__grid .home-card-carousel-track > .homepage-rollout-card {
  flex: 0 0 min(46rem, calc(50% - .75rem));
}

@media (max-width: 680px) {
  .billing-features-carousel .home-card-carousel-track > .billing-feature-card {
    flex-basis: min(86vw, 26rem);
  }

  body.billing-page .hotspot-rollout-cards .home-card-carousel-track > .hotspot-rollout-card,
  .homepage-community-rollout__grid .home-card-carousel-track > .homepage-rollout-card {
    flex-basis: min(88vw, 38rem);
  }
}

/* Company pages use the same wide canvas as the homepage, with content grids
   providing readable measures instead of a narrow, page-wide shell. */
body.company-readable-page.content-structure-page main > section:not(.company-hero):not(.detail-hero) > .detail-shell {
  box-sizing: border-box;
  width: min(calc(100% - clamp(1.5rem, 4vw, 4rem)), 2560px) !important;
  max-width: 2560px !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

body.company-readable-page.content-structure-page main > section.detail-section.company-reading {
  background: #f3f7fb !important;
}

body.company-readable-page.content-structure-page main > section.detail-section.company-reading-blue {
  background: #fff !important;
}

body.company-readable-page .company-overview-inner {
  grid-template-columns: minmax(0, 1.35fr) minmax(19rem, .65fr);
  gap: clamp(2rem, 6vw, 7rem);
}

body.company-readable-page .company-leader-portrait {
  width: min(100%, 38rem);
  justify-self: end;
}

body.company-readable-page .company-leader-portrait img {
  max-height: 32rem;
  aspect-ratio: 1.15;
  object-position: center 24%;
}

body.company-readable-page .company-purpose header,
body.company-readable-page .company-services-heading,
body.company-readable-page .company-connectivity-pricing header,
body.company-readable-page .company-portfolio-section header,
body.company-readable-page .company-people-section header {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(1.5rem, 4vw, 5rem);
}

body.company-readable-page .company-purpose header p,
body.company-readable-page .company-services-heading p,
body.company-readable-page .company-connectivity-pricing header p,
body.company-readable-page .company-portfolio-section header p,
body.company-readable-page .company-people-section header p {
  max-width: 72ch;
}

body.company-readable-page .company-mandate-inner {
  grid-template-columns: minmax(18rem, .7fr) minmax(0, 1.6fr);
  max-width: 2560px;
}

body.company-readable-page .company-mandate-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0 clamp(1.25rem, 2vw, 2.25rem);
}

body.company-readable-page .company-services-section > .detail-shell {
  max-width: 2560px;
}

body.company-readable-page .company-service-lines {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0 clamp(1rem, 2vw, 2rem);
}

body.company-readable-page .company-service-lines a,
body.company-readable-page .company-service-lines a:nth-child(even) {
  min-width: 0;
  padding-inline: 0;
  border-left: 0;
}

body.company-readable-page .company-credentials-inner {
  display: block;
  max-width: 2560px;
}

body.company-readable-page .company-credentials-inner > div > p {
  max-width: 68ch;
}

body.company-readable-page .company-credentials-inner aside ul {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: clamp(1rem, 2vw, 2rem);
}

body.company-readable-page .company-credentials-inner aside li {
  padding-top: .8rem;
  border-top: 1px solid rgba(226, 237, 248, .32);
  color: #e2edf8 !important;
}

body.company-readable-page .company-hotspot-details-heading {
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(1.5rem, 4vw, 5rem);
}

body.company-readable-page .company-hotspot-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(19rem, .75fr);
  align-items: stretch;
  gap: clamp(1.5rem, 3vw, 3rem);
  margin-top: 1.75rem;
}

body.company-readable-page .company-hotspot-carousel {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  margin-top: 0;
}

body.company-readable-page .company-hotspot-carousel-track {
  display: flex;
  min-height: 22rem;
  flex: 1;
  align-items: center;
}

body.company-readable-page .company-hotspot-slide {
  display: grid;
  width: 100%;
  max-width: none !important;
  grid-template-columns: minmax(12rem, .72fr) minmax(0, 1.28fr);
  align-content: center;
  align-items: start;
  gap: .75rem clamp(1.5rem, 3vw, 3rem);
}

body.company-readable-page .company-hotspot-slide[hidden] {
  display: none;
}

body.company-readable-page .company-hotspot-slide h3 {
  grid-row: span 2;
  max-width: 18ch;
}

body.company-readable-page .company-hotspot-slide p {
  max-width: 72ch;
  margin-top: 0;
}

body.company-readable-page .company-hotspot-slide a {
  justify-self: start;
  margin-top: .25rem;
}

body.company-readable-page .company-hotspot-carousel-controls {
  flex-wrap: wrap;
  justify-content: space-between;
}

body.company-readable-page .company-hotspot-carousel-controls > button {
  min-width: 5.75rem;
  flex: 0 0 auto;
  justify-content: center;
  white-space: nowrap;
}

body.company-readable-page .company-hotspot-carousel-status {
  min-width: 0;
  flex: 1 1 10rem;
  margin: 0;
}

body.company-readable-page .company-hotspot-visual {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  margin: 0;
  overflow: hidden;
  background: #e8eff5;
}

body.company-readable-page .company-hotspot-visual img {
  display: block;
  width: 100%;
  min-height: 15rem;
  flex: 1;
  object-fit: cover;
}

body.company-readable-page .company-hotspot-visual figcaption {
  display: grid;
  gap: .4rem;
  padding: clamp(1rem, 1.6vw, 1.5rem);
}

body.company-readable-page .company-hotspot-visual figcaption strong {
  color: #001a4d;
  font-size: 1rem;
}

body.company-readable-page .company-hotspot-visual figcaption span {
  color: #334a67;
  font-size: .9rem;
  line-height: 1.55;
}

body.company-readable-page .company-connectivity-pricing > .detail-shell,
body.company-readable-page .company-portfolio-section > .detail-shell,
body.company-readable-page .company-people-section > .detail-shell {
  max-width: 2560px;
}

body.company-readable-page .company-connectivity-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.5rem, 3vw, 3rem);
}

body.company-readable-page .company-connectivity-options article,
body.company-readable-page .company-connectivity-options article + article {
  min-width: 0;
  padding-inline: 0;
  border-left: 0;
}

body.company-readable-page .company-connectivity-tiers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(1rem, 1.8vw, 1.75rem);
}

body.company-readable-page .company-connectivity-tiers li {
  min-width: 0;
}

body.company-readable-page .company-brand-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.company-readable-page .company-people-links {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.company-readable-page.company-team-page .company-directory-content {
  grid-template-columns: minmax(0, 1.2fr) minmax(20rem, .8fr);
  align-items: start;
  gap: clamp(2rem, 6vw, 7rem);
}

body.company-readable-page .company-executive-profile {
  width: min(100%, 160rem);
  max-width: 160rem;
  grid-template-columns: minmax(18rem, .65fr) minmax(0, 1.35fr);
  gap: clamp(2rem, 5vw, 6rem);
}

body.company-readable-page .company-executive-profile img {
  max-height: 32rem;
}

@media (max-width: 1100px) {
  body.company-readable-page .company-mandate-list,
  body.company-readable-page .company-service-lines {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.company-readable-page .company-hotspot-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(17rem, .8fr);
  }

  body.company-readable-page .company-hotspot-slide {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-hotspot-slide h3 {
    grid-row: auto;
    max-width: 30ch;
  }

}

@media (max-width: 760px) {
  body.company-readable-page .company-overview-inner,
  body.company-readable-page .company-purpose header,
  body.company-readable-page .company-services-heading,
  body.company-readable-page .company-connectivity-pricing header,
  body.company-readable-page .company-portfolio-section header,
  body.company-readable-page .company-people-section header,
  body.company-readable-page .company-mandate-inner,
  body.company-readable-page .company-credentials-inner,
  body.company-readable-page.company-team-page .company-directory-content,
  body.company-readable-page .company-executive-profile {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-leader-portrait {
    width: min(100%, 30rem);
    justify-self: start;
  }

  body.company-readable-page .company-mandate-list,
  body.company-readable-page .company-service-lines,
  body.company-readable-page .company-connectivity-options,
  body.company-readable-page .company-brand-strip,
  body.company-readable-page .company-people-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.company-readable-page .company-hotspot-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-hotspot-visual {
    max-height: 28rem;
  }

  body.company-readable-page .company-hotspot-visual img {
    max-height: 20rem;
  }

}

@media (max-width: 560px) {
  body.company-readable-page.content-structure-page main > section:not(.company-hero):not(.detail-hero) > .detail-shell {
    width: min(calc(100% - 1.5rem), 2560px) !important;
  }

  body.company-readable-page .company-mandate-list,
  body.company-readable-page .company-service-lines,
  body.company-readable-page .company-connectivity-options,
  body.company-readable-page .company-connectivity-tiers,
  body.company-readable-page .company-brand-strip,
  body.company-readable-page .company-people-links,
  body.company-readable-page .company-credentials-inner aside ul {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-service-lines a,
  body.company-readable-page .company-service-lines a:nth-child(even),
  body.company-readable-page .company-brand-strip a,
  body.company-readable-page .company-brand-strip a + a {
    padding-inline: 0;
    border-left: 0;
  }

  body.company-readable-page .company-brand-strip a + a {
    border-top: 1px solid #cbd5e1;
  }

  body.company-readable-page .company-purpose-grid .home-card-carousel-track > article {
    flex-basis: min(86vw, 25rem);
    min-height: 0;
    padding: 1.25rem;
  }

  body.company-readable-page .company-purpose-grid article + article {
    padding-left: 1.25rem;
  }

  body.company-readable-page .company-hotspot-carousel-track {
    min-height: 22rem;
  }

  body.company-readable-page .company-hotspot-carousel-controls {
    gap: .4rem;
  }

  body.company-readable-page .company-hotspot-carousel-controls > button {
    min-height: 2.75rem;
  }
}

main > section#home-software-spotlight {
  padding-block: clamp(3.5rem, 6vw, 5.5rem) !important;
  background: #fff !important;
  color: #18314f;
}

main > section#home-software-spotlight::before,
main > section#home-software-spotlight::after {
  content: none !important;
  display: none !important;
}

.software-spotlight-inner {
  box-sizing: border-box;
  width: min(100%, 2560px);
  max-width: 2560px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 3rem);
}

.software-spotlight-header {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(17rem, .85fr);
  align-items: end;
  gap: 1rem 3rem;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.software-spotlight-header h2 {
  max-width: 23ch;
  margin: 0;
  color: #092b4d !important;
  font-size: clamp(2rem, 3.4vw, 3.5rem);
  font-weight: 800;
  line-height: 1.08;
  text-wrap: balance;
}

.software-spotlight-header p {
  max-width: 55ch;
  margin: 0 0 .25rem;
  color: #40566e !important;
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.65;
}

.software-spotlight-carousel .home-card-carousel-track {
  gap: clamp(.9rem, 1.4vw, 1.25rem);
  padding: .25rem .1rem 1rem;
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card {
  box-sizing: border-box;
  display: flex;
  flex: 0 0 clamp(19rem, 24vw, 25rem);
  flex-direction: column;
  min-width: 0;
  min-height: 27rem;
  overflow: hidden;
  border: 1px solid #d8e2ed;
  border-radius: 1.2rem;
  background: #fff;
  color: #18314f;
  text-align: left;
  text-decoration: none;
  box-shadow: 0 12px 32px rgba(12, 37, 64, .08);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card--featured {
  flex-basis: clamp(24rem, 34vw, 35rem);
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:hover {
  transform: translateY(-3px);
  border-color: #93b4d3;
  box-shadow: 0 18px 40px rgba(12, 37, 64, .14);
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:focus-visible {
  outline: 3px solid #087b73;
  outline-offset: 4px;
}

.software-spotlight-card__image {
  position: relative;
  display: block;
  flex: 0 0 auto;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #dce8f1;
}

.software-spotlight-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:hover .software-spotlight-card__image img {
  transform: scale(1.035);
}

.software-spotlight-card__status {
  position: absolute;
  top: .85rem;
  left: .85rem;
  display: inline-flex;
  align-items: center;
  min-height: 1.9rem;
  padding: .25rem .7rem;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 999px;
  background: rgba(5, 48, 58, .9);
  color: #fff;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .025em;
}

.software-spotlight-card__status--pending {
  background: rgba(58, 68, 81, .92);
}

.software-spotlight-card__status--development {
  background: rgba(26, 67, 127, .92);
}

.software-spotlight-card__status--service {
  background: rgba(9, 58, 85, .92);
}

.software-spotlight-card__content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: .65rem;
  padding: clamp(1.15rem, 2vw, 1.6rem);
}

.software-spotlight-card__category {
  color: #087b73;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  line-height: 1.4;
  text-transform: uppercase;
}

.software-spotlight-card__content strong {
  color: #102c4a;
  font-size: clamp(1.25rem, 1.65vw, 1.65rem);
  line-height: 1.2;
}

.software-spotlight-card__description {
  color: #455b72;
  font-size: .95rem;
  line-height: 1.6;
}

.software-spotlight-card__action {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-top: auto;
  padding-top: .55rem;
  color: #075b75;
  font-size: .9rem;
  font-weight: 750;
}

.software-spotlight-card__action span {
  font-size: 1.2em;
  transition: transform .2s ease;
}

.software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:hover .software-spotlight-card__action span {
  transform: translateX(3px);
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands):not(#how-we-work)#home-community-rollout::after {
  content: none !important;
  display: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section#home-community-rollout {
  padding-block: clamp(3.5rem, 6vw, 5.5rem) !important;
  background: #fff !important;
  color: #18314f !important;
}

main > section#home-community-rollout::before,
main > section#home-community-rollout::after {
  content: none !important;
  display: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands):not(#how-we-work)#home-community-rollout > div[class*="max-w"] .homepage-community-rollout__header h2 {
  color: #092b4d !important;
  text-shadow: none !important;
}

body:not(.theme-dark):has(main > section#home) main > section.homepage-open-section:not(#home):not(#smas):not(#brands):not(#how-we-work)#home-community-rollout > div[class*="max-w"] .homepage-community-rollout__header p {
  color: #40566e !important;
  text-shadow: none !important;
}

@media (max-width: 760px) {
  .software-spotlight-header {
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
  }

  .software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card,
  .software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card--featured {
    flex-basis: min(87vw, 32rem);
    min-height: 25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card,
  .software-spotlight-card__image img,
  .software-spotlight-card__action span {
    transition: none;
  }

  .software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:hover .software-spotlight-card__image img,
  .software-spotlight-carousel.home-card-carousel--content .home-card-carousel-track > .software-spotlight-card:hover .software-spotlight-card__action span {
    transform: none;
  }
}

body.company-readable-page .company-purpose-grid .home-card-carousel-track > .company-purpose-card {
  position: relative;
  flex: 0 0 clamp(18rem, 25vw, 26rem);
  min-height: 22rem;
  gap: 1rem;
  padding: clamp(1.35rem, 2.3vw, 2rem);
  border: 1px solid #d6e2ef;
  border-radius: 1.2rem;
  background: #f7fafd;
  box-shadow: 0 14px 34px rgba(8, 37, 74, .08);
  scroll-snap-align: start;
}

body.company-readable-page .company-purpose-grid .home-card-carousel-track > .company-purpose-card--mission {
  flex-basis: clamp(23rem, 34vw, 35rem);
  justify-content: flex-end;
  min-height: 25rem;
  border-color: #173f68;
  background:
    linear-gradient(145deg, rgba(5, 28, 56, .94), rgba(7, 54, 92, .92)),
    #08254a;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card__icon,
body.company-readable-page.content-structure-page main > section.company-mandate-section > .detail-shell .company-mandate-card__icon {
  display: inline-flex;
  width: 2.8rem;
  height: 2.8rem;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: .85rem;
  background: #dff5ed;
  color: #075f55 !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card__icon svg,
body.company-readable-page.content-structure-page main > section.company-mandate-section > .detail-shell .company-mandate-card__icon svg {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  stroke-width: 2;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card h3 {
  margin: 0;
  color: #092b4d !important;
  font-size: clamp(1.3rem, 1.7vw, 1.65rem);
  text-shadow: none !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card p {
  max-width: 40ch;
  margin: 0;
  color: #40566e !important;
  font-size: 1rem;
  line-height: 1.65;
  text-shadow: none !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card p strong {
  display: block;
  margin-bottom: .4rem;
  color: #075f55 !important;
  font-size: .88rem;
  letter-spacing: 0;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card--mission h3,
body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card--mission p {
  color: #fff !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card--mission p strong {
  color: #a7f3d9 !important;
}

body.company-readable-page.content-structure-page main > section.company-purpose > .detail-shell .company-purpose-card--mission .company-purpose-card__icon {
  background: rgba(167, 243, 217, .13);
  color: #a7f3d9 !important;
}

body.company-readable-page .company-purpose-card--vision {
  background: #eff7fc;
}

body.company-readable-page .company-purpose-card--objective {
  background: #f3fbf7;
}

body.company-readable-page.content-structure-page main > section.company-purpose .company-purpose-grid .home-card-carousel-button span {
  color: #0039a6 !important;
  font-size: 1.2rem !important;
  line-height: 1;
}

body.company-readable-page .company-mandate-inner {
  grid-template-columns: minmax(18rem, .62fr) minmax(0, 1.8fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
}

body.company-readable-page .company-mandate-list.home-card-carousel-track {
  display: flex !important;
  grid-template-columns: none;
  gap: 1rem;
  min-width: 0;
  margin: 0;
  padding: .35rem .15rem 1rem;
  list-style: none;
}

body.company-readable-page .company-mandate-list.home-card-carousel-track > li {
  box-sizing: border-box;
  display: flex;
  flex: 0 0 clamp(16rem, 22vw, 22rem);
  min-width: 0;
  min-height: 19rem;
  flex-direction: column;
  align-items: flex-start;
  gap: .85rem;
  padding: clamp(1.25rem, 2vw, 1.7rem);
  border: 1px solid rgba(183, 214, 241, .25);
  border-radius: 1.1rem;
  background: #10365f;
  box-shadow: 0 15px 34px rgba(0, 10, 30, .2);
  scroll-snap-align: start;
}

body.company-readable-page .company-mandate-list.home-card-carousel-track > li:nth-child(even) {
  background: #123d69;
}

body.company-readable-page .company-mandate-list .company-mandate-card__icon {
  background: rgba(167, 243, 217, .13);
  color: #a7f3d9;
}

body.company-readable-page .company-mandate-list strong {
  margin-top: .25rem;
  color: #fff;
  font-size: 1.1rem;
}

body.company-readable-page .company-mandate-list li > span:last-child {
  color: #e1edf8;
  font-size: .94rem;
  line-height: 1.65;
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-controls {
  justify-content: flex-start;
  gap: 1rem;
  margin-top: .4rem;
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-button,
body.company-readable-page .company-mandate-carousel .home-card-carousel-progress {
  flex: 0 0 auto;
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-button {
  min-width: 3rem;
  border-color: rgba(219, 234, 254, .34);
  background: #0d2d52;
  color: #e6f3ff;
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-button:hover:not(:disabled) {
  border-color: #a7f3d9;
  background: #164671;
}

body.company-readable-page.content-structure-page main > section.company-mandate-section .company-mandate-carousel .home-card-carousel-button span {
  color: #e6f3ff !important;
  font-size: 1.2rem !important;
  line-height: 1;
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-progress {
  background: rgba(219, 234, 254, .25);
}

body.company-readable-page .company-mandate-carousel .home-card-carousel-progress > span {
  background: #a7f3d9;
}

body.company-readable-page .company-package-carousel .home-card-carousel-track {
  align-items: stretch;
  gap: clamp(.9rem, 1.5vw, 1.3rem);
  padding: .35rem .15rem 1rem;
}

body.company-readable-page .company-package-carousel.home-card-carousel--content .home-card-carousel-track > .company-package-card {
  box-sizing: border-box;
  display: flex;
  flex: 0 0 clamp(18rem, 22vw, 22.5rem);
  min-width: 0;
  min-height: 30rem;
  flex-direction: column;
  align-items: flex-start;
  gap: .8rem;
  padding: clamp(1.25rem, 1.8vw, 1.7rem);
  border: 1px solid #d9e4ef;
  border-radius: 1.15rem;
  background: #f8fbfd;
  color: #18314f;
  box-shadow: 0 13px 30px rgba(8, 37, 74, .08);
  scroll-snap-align: start;
}

body.company-readable-page .company-package-card--shared {
  background: #f4fbf8 !important;
}

body.company-readable-page .company-package-card--dedicated {
  background: #f7f9fd !important;
}

body.company-readable-page .company-package-card--popular {
  border-color: #78adca !important;
  background: #eaf5fa !important;
  box-shadow: 0 18px 38px rgba(7, 63, 101, .14);
}

body.company-readable-page .company-package-type {
  display: inline-flex;
  align-items: center;
  min-height: 1.9rem;
  margin: 0;
  padding: .3rem .7rem;
  border-radius: 999px;
  background: #e0f2ec;
  color: #075b50;
  font-size: .74rem;
  font-weight: 800;
}

body.company-readable-page .company-package-card--dedicated .company-package-type {
  background: #e7effa;
  color: #174d81;
}

body.company-readable-page .company-package-card h3 {
  display: flex;
  min-height: 2.2rem;
  align-items: center;
  gap: .5rem;
  margin: .1rem 0 0;
  color: #092b4d;
  font-size: clamp(1.4rem, 1.8vw, 1.75rem);
}

body.company-readable-page .company-package-card .company-connectivity-popular {
  margin: 0;
  padding: .25rem .5rem;
  white-space: nowrap;
}

body.company-readable-page .company-package-fit {
  min-height: 3.25rem;
  margin: 0;
  color: #40566e;
  font-size: .94rem;
  line-height: 1.6;
}

body.company-readable-page .company-package-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem;
  margin: .25rem 0 0;
  color: #40566e;
  font-size: .88rem;
}

body.company-readable-page .company-package-price strong {
  color: #092b4d;
  font-size: clamp(1.35rem, 1.9vw, 1.8rem);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.025em;
  line-height: 1.2;
}

body.company-readable-page .company-package-card .company-connectivity-vat {
  margin: -.35rem 0 0;
  color: #4a6179;
  font-size: .82rem;
  line-height: 1.5;
}

body.company-readable-page .company-package-features {
  display: grid;
  gap: .6rem;
  margin: .35rem 0 .5rem;
  padding: 0;
  color: #344c65;
  font-size: .88rem;
  line-height: 1.55;
  list-style: none;
}

body.company-readable-page .company-package-features li {
  position: relative;
  padding-left: 1.25rem;
}

body.company-readable-page .company-package-features li::before {
  position: absolute;
  top: .56em;
  left: .15rem;
  width: .42rem;
  height: .42rem;
  border-radius: 50%;
  background: #0b8c70;
  content: "";
}

body.company-readable-page .company-package-order {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: auto;
  padding: .7rem 1rem;
  border: 1px solid #075f73;
  border-radius: .75rem;
  background: #075f73;
  color: #fff !important;
  font-size: .84rem;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
}

body.company-readable-page .company-package-order:hover {
  border-color: #064d5d;
  background: #064d5d;
}

body.company-readable-page.content-structure-page main > section.company-connectivity-pricing .company-package-carousel .home-card-carousel-button span {
  color: #0039a6 !important;
  font-size: 1.2rem !important;
  line-height: 1;
}

body.company-readable-page.content-structure-page main > section.company-connectivity-pricing .company-package-order span {
  color: #fff !important;
  font-size: .9rem !important;
}

body.company-readable-page .company-package-order:focus-visible {
  outline: 3px solid #087b73;
  outline-offset: 3px;
}

@media (max-width: 980px) {
  body.company-readable-page .company-mandate-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  body.company-readable-page .company-mandate-heading p {
    max-width: 65ch;
  }
}

@media (max-width: 760px) {
  body.company-readable-page .company-purpose-grid .home-card-carousel-track > .company-purpose-card,
  body.company-readable-page .company-purpose-grid .home-card-carousel-track > .company-purpose-card--mission {
    flex-basis: min(86vw, 28rem);
    min-height: 22rem;
  }

  body.company-readable-page .company-mandate-list.home-card-carousel-track > li {
    flex-basis: min(82vw, 25rem);
    min-height: 18rem;
  }

  body.company-readable-page .company-package-carousel.home-card-carousel--content .home-card-carousel-track > .company-package-card {
    flex-basis: min(84vw, 27rem);
    min-height: 29rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.company-readable-page .company-package-order {
    transition: none;
  }
}

body.company-readable-page.content-structure-page main > section.company-story {
  padding-block: clamp(4rem, 8vw, 7rem);
  background: #092342 !important;
  color: #f5f9ff;
}

.company-story-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 92rem;
}

.company-story-visual {
  position: relative;
  min-width: 0;
  margin: 0;
}

.company-story-visual img {
  display: block;
  width: 100%;
  aspect-ratio: 1.12;
  object-fit: cover;
}

.company-story-visual figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 29rem;
  padding: 1rem 1.25rem;
  background: #063c65;
  color: #f5f9ff;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.5;
}

.company-story-copy h2 {
  max-width: 17ch;
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2.15rem, 4.2vw, 4rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.company-story-copy > p {
  max-width: 62ch;
  margin: 1.15rem 0 0;
  color: #d8e8f6;
  font-size: 1rem;
  line-height: 1.75;
}

.company-story-copy > a,
.company-why-feature > a {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  margin-top: 1.5rem;
  color: #8be7ff;
  font-size: .92rem;
  font-weight: 800;
  text-decoration: none;
  text-underline-offset: .2em;
}

.company-story-copy > a:hover,
.company-story-copy > a:focus-visible,
.company-why-feature > a:hover,
.company-why-feature > a:focus-visible {
  color: #fff;
  text-decoration: underline;
}

body.company-readable-page.content-structure-page main > section.company-why {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #eaf2f8 !important;
  color: #12304d;
}

.company-why > .detail-shell {
  max-width: 92rem;
}

.company-why-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(17rem, .9fr);
  align-items: end;
  gap: 1.5rem 4rem;
  margin-bottom: clamp(1.75rem, 4vw, 3.25rem);
}

.company-why-heading h2 {
  max-width: 20ch;
  margin: 0;
  color: #092342;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 3.8vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.company-why-heading > p {
  max-width: 58ch;
  margin: 0;
  color: #334e68;
  font-size: 1rem;
  line-height: 1.7;
}

.company-why-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
  gap: clamp(1.5rem, 4vw, 4rem);
  align-items: stretch;
}

.company-why-feature {
  display: flex;
  min-height: 23rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: clamp(1.5rem, 3vw, 3rem);
  background:
    linear-gradient(180deg, rgba(4, 26, 53, .2), rgba(4, 26, 53, .94)),
    url("/assets/billing/guest-wifi.jpg") center / cover no-repeat,
    #092342;
  color: #fff;
}

.company-why-feature h3 {
  max-width: 18ch;
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.75rem, 2.8vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.12;
  text-wrap: balance;
}

.company-why-feature > p {
  max-width: 55ch;
  margin: .9rem 0 0;
  color: #e0edf7;
  font-size: .96rem;
  line-height: 1.7;
}

.company-why-reasons {
  display: grid;
}

.company-why-reason {
  padding: 1.15rem 0;
  border-bottom: 1px solid #b8cad8;
}

.company-why-reason:first-child {
  padding-top: .35rem;
}

.company-why-reason h3 {
  margin: 0;
  color: #092342;
  font-size: 1.15rem;
  font-weight: 850;
  line-height: 1.35;
}

.company-why-reason p {
  max-width: 62ch;
  margin: .45rem 0 0;
  color: #334e68;
  font-size: .94rem;
  line-height: 1.65;
}

.saints-man-story {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #092342;
  color: #f5f9ff;
}

.saints-man-story-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .85fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
  max-width: 86rem;
}

.saints-man-story-copy h2 {
  max-width: 19ch;
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.saints-man-story-copy > p {
  max-width: 62ch;
  margin: 1rem 0 0;
  color: #d8e8f6;
  font-size: 1rem;
  line-height: 1.75;
}

.saints-man-story-copy > a,
.saints-man-why-list article > a {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: 1.2rem;
  color: #8be7ff;
  font-size: .9rem;
  font-weight: 800;
  text-underline-offset: .2em;
}

.saints-man-story-copy > a:hover,
.saints-man-story-copy > a:focus-visible,
.saints-man-why-list article > a:hover,
.saints-man-why-list article > a:focus-visible {
  color: #fff;
}

.saints-man-story-visual {
  position: relative;
  margin: 0;
}

.saints-man-story-visual img {
  display: block;
  width: 100%;
  aspect-ratio: 1.18;
  object-fit: cover;
}

.saints-man-story-visual figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 28rem;
  padding: .9rem 1.1rem;
  background: #063c65;
  color: #f5f9ff;
  font-size: .86rem;
  font-weight: 750;
  line-height: 1.5;
}

.saints-man-why {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #edf3f8;
  color: #12304d;
}

.saints-man-why-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(17rem, .8fr);
  align-items: end;
  gap: 1.5rem 4rem;
  margin-bottom: clamp(1.75rem, 4vw, 3rem);
}

.saints-man-why-heading h2 {
  max-width: 22ch;
  margin: 0;
  color: #092342;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(2rem, 3.8vw, 3.4rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.08;
  text-wrap: balance;
}

.saints-man-why-heading > p {
  max-width: 58ch;
  margin: 0;
  color: #334e68;
  line-height: 1.7;
}

.saints-man-why-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(1.5rem, 4vw, 4rem);
}

.saints-man-why-feature {
  display: flex;
  min-height: 22rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: clamp(1.5rem, 3vw, 2.75rem);
  background: #0b4166;
  color: #fff;
}

.saints-man-why-feature h3 {
  max-width: 20ch;
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.7rem, 2.7vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.12;
  text-wrap: balance;
}

.saints-man-why-feature p {
  max-width: 58ch;
  margin: .9rem 0 0;
  color: #e2f2fb;
  font-size: .96rem;
  line-height: 1.7;
}

.saints-man-why-feature > a {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: 1.2rem;
  color: #a4efff;
  font-size: .9rem;
  font-weight: 800;
  text-underline-offset: .2em;
}

.saints-man-why-list {
  display: grid;
  align-content: stretch;
}

.saints-man-why-list article {
  padding: 1rem 0;
  border-bottom: 1px solid #b8cad8;
}

.saints-man-why-list article:first-child {
  padding-top: .25rem;
}

.saints-man-why-list h3 {
  margin: 0;
  color: #092342;
  font-size: 1.12rem;
  font-weight: 850;
  line-height: 1.35;
}

.saints-man-why-list p {
  max-width: 62ch;
  margin: .4rem 0 0;
  color: #334e68;
  font-size: .94rem;
  line-height: 1.65;
}

.managed-wifi-rate-guide {
  margin-top: clamp(2.5rem, 5vw, 4.5rem);
  padding: clamp(1.25rem, 2.8vw, 2.5rem);
  background: #10283b;
}

.managed-wifi-rate-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .85fr);
  align-items: end;
  gap: 1.25rem 3rem;
  margin-bottom: 1.15rem;
}

.managed-wifi-rate-heading h3 {
  margin: 0;
  color: #fff;
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.7rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.1;
}

.managed-wifi-rate-heading > p {
  max-width: 62ch;
  margin: 0;
  color: #d2e1ed;
  font-size: .92rem;
  line-height: 1.65;
}

.managed-wifi-rate-carousel {
  display: block;
}

.managed-wifi-rate-carousel .home-card-carousel-track > .managed-wifi-rate-card {
  box-sizing: border-box;
  display: flex;
  flex: 0 0 clamp(17rem, 25vw, 21rem);
  min-width: 0;
  flex-direction: column;
  padding: 1.3rem;
  border: 1px solid rgba(169, 204, 229, .35);
  background: #f8fbff;
  color: #18314f;
  scroll-snap-align: start;
}

.managed-wifi-rate-carousel .home-card-carousel-track > .managed-wifi-rate-card--featured {
  border-color: #77d8f2;
  background: #e8f8fd;
}

.managed-wifi-rate-type {
  margin: 0;
  color: #075f79;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.managed-wifi-rate-card h4 {
  margin: .65rem 0 0;
  color: #092342;
  font-family: "Lora", Georgia, serif;
  font-size: 1.8rem;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
}

.managed-wifi-rate-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .45rem;
  margin: 1.1rem 0 0;
}

.managed-wifi-rate-price strong {
  color: #003f80;
  font-size: clamp(1.35rem, 2vw, 1.7rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.2;
}

.managed-wifi-rate-price span {
  color: #52677d;
  font-size: .8rem;
}

.managed-wifi-rate-vat {
  margin: .35rem 0 0;
  color: #435b72;
  font-size: .78rem;
  font-weight: 700;
}

.managed-wifi-rate-card ul {
  display: grid;
  gap: .5rem;
  margin: 1.1rem 0 1.25rem;
  padding: 1rem 0 0;
  border-top: 1px solid #d5e1eb;
  list-style: none;
}

.managed-wifi-rate-card li {
  position: relative;
  padding-left: 1.1rem;
  color: #334e68;
  font-size: .84rem;
  line-height: 1.5;
}

.managed-wifi-rate-card li::before {
  position: absolute;
  left: 0;
  color: #087b73;
  content: "•";
  font-weight: 900;
}

.managed-wifi-rate-card > a {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: auto;
  color: #0052a3;
  font-size: .86rem;
  font-weight: 850;
  text-underline-offset: .2em;
}

.managed-wifi-rate-card > a:hover,
.managed-wifi-rate-card > a:focus-visible {
  color: #00366b;
}

.managed-wifi-rate-carousel .home-card-carousel-controls {
  color: #f1f7ff;
}

.managed-wifi-rate-carousel .home-card-carousel-controls .home-card-carousel-status {
  color: #d2e1ed !important;
}

.managed-wifi-rate-carousel .home-card-carousel-button {
  border-color: #76a5c6;
  background: #0b2030;
  color: #fff;
}

.managed-wifi-rate-carousel .home-card-carousel-button:hover:not(:disabled),
.managed-wifi-rate-carousel .home-card-carousel-button:focus-visible {
  border-color: #8be7ff;
  background: #123d5d;
  color: #fff;
}

.managed-wifi-rate-note {
  max-width: 96ch;
  margin: .35rem 0 0;
  color: #d2e1ed;
  font-size: .84rem;
  line-height: 1.7;
}

.managed-wifi-rate-note a {
  color: #8be7ff;
  font-weight: 800;
  text-underline-offset: .2em;
}

.managed-wifi-rate-note a:hover,
.managed-wifi-rate-note a:focus-visible {
  color: #fff;
}

@media (max-width: 760px) {
  .company-story-inner,
  .company-why-heading,
  .company-why-layout,
  .saints-man-story-inner,
  .saints-man-why-heading,
  .saints-man-why-layout,
  .managed-wifi-rate-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-story-inner,
  .saints-man-story-inner {
    gap: 1.75rem;
  }

  .company-story-visual {
    order: 2;
  }

  .company-story-copy {
    order: 1;
  }

  .company-story-visual img,
  .saints-man-story-visual img {
    aspect-ratio: 1.2;
  }

  .company-why-heading,
  .saints-man-why-heading {
    gap: .8rem;
  }

  .company-why-feature,
  .saints-man-why-feature {
    min-height: 19rem;
  }

  .managed-wifi-rate-carousel .home-card-carousel-track > .managed-wifi-rate-card {
    flex-basis: min(84vw, 23rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .company-story-copy > a,
  .company-why-feature > a,
  .saints-man-story-copy > a,
  .saints-man-why-list article > a,
  .managed-wifi-rate-card > a {
    transition: none;
  }
}

body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-copy :is(h2, p),
body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-copy h2 {
  color: #f5f9ff !important;
  text-shadow: none !important;
}

body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-copy > p {
  color: #d8e8f6 !important;
}

body.company-readable-page.content-structure-page main > section.company-why > .detail-shell
  :is(.company-why-heading h2, .company-why-heading p, .company-why-reason h3, .company-why-reason p) {
  color: #12304d !important;
  text-shadow: none !important;
}

body.company-readable-page.content-structure-page main > section.company-why > .detail-shell
  .company-why-feature h3 {
  color: #fff !important;
  text-shadow: none !important;
}

body.company-readable-page.content-structure-page main > section.company-why > .detail-shell
  .company-why-feature > p {
  color: #e0edf7 !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-heading h3 {
  color: #fff !important;
  text-shadow: none !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-heading > p {
  color: #d2e1ed !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-carousel .managed-wifi-rate-card {
  background-color: #f8fbff !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-carousel .managed-wifi-rate-card--featured {
  border-color: #77d8f2 !important;
  background-color: #e8f8fd !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-card :is(.managed-wifi-rate-type, h4, p, li) {
  color: #18314f !important;
  text-shadow: none !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-card .managed-wifi-rate-type {
  color: #075f79 !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-card .managed-wifi-rate-price strong {
  color: #003f80 !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-card > a {
  color: #0052a3 !important;
}

body.managed-wifi-page.content-structure-page main > section#wifi-packages > .detail-shell
  .managed-wifi-rate-note {
  color: #d2e1ed !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) {
  background: #edf3f8 !important;
  background-image: none !important;
  color: #12304d !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why::before {
  display: none !important;
  content: none !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell {
  width: min(calc(100% - clamp(1.5rem, 4vw, 4rem)), 86rem) !important;
  max-width: 86rem !important;
  margin-inline: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #12304d !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-heading :is(h2, p),
body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-list :is(h3, p) {
  color: #12304d !important;
  text-shadow: none !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-feature {
  background: #0b4166 !important;
  box-shadow: none !important;
  color: #fff !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-feature :is(h3, p) {
  color: #fff !important;
  text-shadow: none !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-feature > a {
  color: #a4efff !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-list article {
  border-bottom-color: #b8cad8 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.saints-man-page.responsive-page:not(.content-structure-page):not(:has(main > section#home))
  main > section#saints-man-why:not(:first-of-type):not(:last-of-type) > .detail-shell
  .saints-man-why-list article > a {
  color: #0052a3 !important;
}

body.company-readable-page main > section.company-story {
  padding-block: clamp(3.5rem, 7vw, 7rem);
  background: #f1f6fa;
}

body.company-readable-page .company-story-inner {
  display: grid;
  grid-template-columns: minmax(19rem, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 7rem);
}

body.company-readable-page .company-story-visual {
  position: relative;
  min-width: 0;
  margin: 0;
}

body.company-readable-page .company-story-visual img {
  display: block;
  width: 100%;
  min-height: 27rem;
  aspect-ratio: 1.08;
  border-radius: 1.1rem;
  object-fit: cover;
}

body.company-readable-page .company-story-visual figcaption {
  position: absolute;
  inset: auto 1rem 1rem;
  max-width: 34rem;
  padding: .9rem 1rem;
  border-radius: .65rem;
  background: #061f3b;
  color: #fff;
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.5;
}

body.company-readable-page .company-story-copy h2 {
  max-width: 17ch;
  margin: 0 0 1.1rem;
  color: #08284a !important;
  font-size: clamp(2.2rem, 4vw, 4.2rem);
  line-height: 1.04;
  letter-spacing: -.035em;
  text-wrap: balance;
}

body.company-readable-page .company-story-copy > p {
  max-width: 65ch;
  color: #40566e !important;
  font-size: 1.02rem;
  line-height: 1.7;
}

body.company-readable-page .company-story-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(1rem, 3vw, 2.5rem);
  margin-top: 1.4rem;
}

body.company-readable-page .company-story-links a {
  display: grid;
  gap: .3rem;
  min-width: 0;
  padding: .85rem 0;
  border-bottom: 1px solid #c8d6e2;
  color: #075f79;
  text-decoration: none;
}

body.company-readable-page .company-story-links a:hover,
body.company-readable-page .company-story-links a:focus-visible {
  color: #0039a6;
  text-decoration: underline;
  text-underline-offset: .2em;
}

body.company-readable-page .company-story-links a strong {
  color: #092b4d !important;
  font-size: 1rem;
}

body.company-readable-page .company-story-links a > span {
  color: #40566e !important;
  font-size: .85rem;
  line-height: 1.45;
}

body.company-readable-page main > section.company-credentials-section {
  padding-block: clamp(3.5rem, 7vw, 7rem);
  background: #e8f0f6;
}

body.company-readable-page .company-credentials-inner {
  display: grid;
  gap: 1.8rem;
  max-width: 120rem;
}

body.company-readable-page .company-credentials-heading {
  max-width: 74rem;
}

body.company-readable-page .company-credentials-heading h2 {
  max-width: 22ch;
  margin: 0;
  color: #08284a !important;
  font-size: clamp(2rem, 3.5vw, 3.5rem);
  line-height: 1.08;
  letter-spacing: -.03em;
  text-wrap: balance;
}

body.company-readable-page .company-credentials-heading p {
  max-width: 68ch;
  margin: .85rem 0 0;
  color: #40566e !important;
  font-size: 1rem;
  line-height: 1.65;
}

body.company-readable-page .company-credentials-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

body.company-readable-page .company-credential-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1rem;
  padding: clamp(1.25rem, 2vw, 2rem);
  border: 1px solid #cbd9e5;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 12px 28px rgba(8, 37, 74, .07);
}

body.company-readable-page .company-credential-card h3 {
  margin: 0;
  color: #092b4d !important;
  font-size: clamp(1.2rem, 1.6vw, 1.55rem);
  line-height: 1.2;
}

body.company-readable-page .company-credential-card > p {
  margin: 0;
  color: #40566e !important;
  font-size: .96rem;
  line-height: 1.65;
}

body.company-readable-page .company-registration-logos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}

body.company-readable-page .company-registration-logos figure {
  display: grid;
  min-width: 0;
  min-height: 7.5rem;
  align-content: center;
  justify-items: center;
  gap: .6rem;
  margin: 0;
  padding: .8rem;
  border-radius: .7rem;
  background: #f3f7fa;
  text-align: center;
}

body.company-readable-page .company-registration-logos img {
  display: block;
  width: 100%;
  max-width: 9rem;
  height: 3.5rem;
  object-fit: contain;
}

body.company-readable-page .company-registration-logos figcaption {
  color: #23435f;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.35;
}

body.company-readable-page .company-regulator-reference {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .9rem;
  border-radius: .7rem;
  background: #f3f7fa;
}

body.company-readable-page .company-regulator-reference img {
  display: block;
  width: 5rem;
  height: 5rem;
  flex: 0 0 auto;
  object-fit: contain;
}

body.company-readable-page .company-regulator-reference p {
  display: grid;
  gap: .25rem;
  margin: 0;
}

body.company-readable-page .company-regulator-reference strong {
  color: #092b4d !important;
  font-size: .9rem;
  line-height: 1.35;
}

body.company-readable-page .company-regulator-reference span {
  color: #40566e !important;
  font-size: .76rem;
  line-height: 1.45;
}

body.company-readable-page .company-credentials-note {
  max-width: 100ch;
  margin: 0;
  color: #40566e !important;
  font-size: .88rem;
  line-height: 1.6;
}

body.saints-page main > section > .max-w-6xl,
body.shop-page main > section > .max-w-6xl {
  max-width: 112rem;
}

body.saints-page .hub-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .7fr);
  align-items: end;
  gap: clamp(1rem, 4vw, 4rem);
  max-width: none;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body.saints-page .hub-section-heading h2 {
  max-width: 22ch;
  margin: 0;
  color: #08284a !important;
  font-size: clamp(2rem, 3.7vw, 3.8rem);
  line-height: 1.05;
  letter-spacing: -.035em;
  text-wrap: balance;
}

body.saints-page .hub-section-heading p {
  max-width: 56ch;
  margin: 0;
  color: #40566e !important;
  font-size: 1rem;
  line-height: 1.65;
}

body.saints-page .hub-pathway-nav {
  display: flex;
  gap: .65rem;
  overflow-x: auto;
  padding: 0 0 .8rem;
  border-bottom: 1px solid #cbd9e5;
  scrollbar-width: thin;
}

body.saints-page .hub-pathway-nav a {
  display: inline-flex;
  min-height: 3.1rem;
  flex: 1 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 1.1rem;
  padding: .7rem 1rem;
  border: 1px solid #cbd9e5;
  border-radius: .65rem;
  background: #fff;
  color: #123a62 !important;
  font-size: .9rem;
  font-weight: 750;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

body.saints-page .hub-pathway-nav a:hover,
body.saints-page .hub-pathway-nav a:focus-visible {
  border-color: #0f766e;
  background: #e5f6f1;
  color: #075f55 !important;
}

body.saints-page .hub-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: minmax(13rem, auto);
  gap: 1rem;
}

body.saints-page .hub-feature {
  border-radius: .8rem;
  box-shadow: 0 10px 25px rgba(8, 37, 74, .08);
}

body.saints-page .hub-feature--lead {
  display: grid;
  grid-column: span 2;
  grid-row: span 2;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, .85fr);
  align-items: stretch;
}

body.saints-page .hub-feature--lead img {
  height: 100%;
  min-height: 100%;
  grid-column: 1;
  grid-row: 1;
}

body.saints-page .hub-feature--lead > div {
  display: flex;
  grid-column: 2;
  grid-row: 1;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(1.25rem, 2.5vw, 2.5rem);
}

body.saints-page .hub-feature--lead h3 {
  font-size: clamp(1.5rem, 2.4vw, 2.4rem);
}

body.saints-page .hub-feature--lead p {
  max-width: 42ch;
  font-size: .95rem;
  line-height: 1.65;
}

body.shop-page .shop-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

body.shop-page .shop-hero-actions a,
body.shop-page .shop-hero-actions button {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: .65rem;
  padding: .75rem 1rem;
  color: #fff;
  font: inherit;
  font-weight: 750;
  text-decoration: none;
}

body.shop-page .shop-hero-actions .shop-hero-primary {
  border-color: #a7f3d0;
  background: #047857;
}

body.shop-page .shop-hero-actions .shop-hero-secondary {
  background: rgba(0, 26, 77, .65);
}

body.shop-page .shop-hero-actions a:hover,
body.shop-page .shop-hero-actions button:hover,
body.shop-page .shop-hero-actions a:focus-visible,
body.shop-page .shop-hero-actions button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}

body.shop-page .shop-market-head {
  align-items: center;
  margin-bottom: 1.25rem;
  padding: clamp(1.25rem, 3vw, 2.25rem);
  border: 1px solid #cbd9e5;
  border-radius: .9rem;
  background: #fff;
  box-shadow: 0 12px 28px rgba(8, 37, 74, .06);
}

body.shop-page .shop-market-head h2 {
  max-width: 22ch;
  color: #08284a !important;
  font-size: clamp(2rem, 3.5vw, 3.3rem);
  line-height: 1.08;
  letter-spacing: -.03em;
  text-wrap: balance;
}

body.shop-page .shop-market-head p.mt-2 {
  max-width: 67ch;
  color: #334e68 !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

body.shop-page .shop-category-tabs {
  display: flex;
  gap: .55rem;
  overflow-x: auto;
  margin-bottom: 1rem;
  padding: .15rem .1rem .75rem;
  scrollbar-width: thin;
}

body.shop-page .shop-category-tabs button {
  min-height: 2.8rem;
  flex: 0 0 auto;
  border: 1px solid #cbd9e5;
  border-radius: 999px;
  padding: .6rem 1rem;
  background: #fff;
  color: #23435f;
  font-size: .86rem;
  font-weight: 750;
  white-space: nowrap;
  cursor: pointer;
}

body.shop-page .shop-category-tabs button[aria-pressed="true"] {
  border-color: #075f55;
  background: #075f55;
  color: #fff;
}

body.shop-page .shop-category-tabs button:hover,
body.shop-page .shop-category-tabs button:focus-visible {
  border-color: #0039a6;
  outline: 2px solid #0039a6;
  outline-offset: 2px;
}

body.shop-page .shop-product-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

body.shop-page .shop-card {
  min-height: 27rem;
  grid-template-rows: 11rem auto auto auto minmax(2.8rem, 1fr) auto auto;
  gap: .7rem;
  border-radius: .85rem;
  box-shadow: 0 10px 25px rgba(8, 37, 74, .07);
}

body.shop-page .shop-card .shop-card-image {
  width: calc(100% + 2.7rem);
  height: 11rem;
  margin: -1.35rem -1.35rem .15rem;
  grid-column: 1 / -1;
  grid-row: 1;
}

body.shop-page .shop-card .shop-card-icon { grid-row: 2; }
body.shop-page .shop-card .shop-category { grid-row: 3; }
body.shop-page .shop-card h3 { grid-row: 4; }
body.shop-page .shop-card p:not(.shop-category) { grid-row: 5; }
body.shop-page .shop-card strong { grid-row: 6; }
body.shop-page .shop-card .shop-buy-link {
  align-self: end;
  grid-row: 7;
}

body.shop-page .shop-card--feature {
  grid-column: span 2;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  grid-template-rows: auto auto auto minmax(2.5rem, 1fr) auto auto;
  align-items: start;
  padding: 0;
}

body.shop-page .shop-card--feature .shop-card-image {
  width: 100%;
  height: 100%;
  min-height: 100%;
  margin: 0;
  grid-column: 1;
  grid-row: 1 / 7;
}

body.shop-page .shop-card--feature .shop-card-icon,
body.shop-page .shop-card--feature .shop-category,
body.shop-page .shop-card--feature h3,
body.shop-page .shop-card--feature p:not(.shop-category),
body.shop-page .shop-card--feature strong,
body.shop-page .shop-card--feature .shop-buy-link {
  grid-column: 2;
  margin-inline: 0;
}

body.shop-page .shop-card--feature .shop-card-icon { margin-top: 1.2rem; grid-row: 1; }
body.shop-page .shop-card--feature .shop-category { grid-row: 2; }
body.shop-page .shop-card--feature h3 { grid-row: 3; }
body.shop-page .shop-card--feature p:not(.shop-category) { grid-row: 4; }
body.shop-page .shop-card--feature strong { grid-row: 5; }
body.shop-page .shop-card--feature .shop-buy-link { grid-row: 6; margin-bottom: 1.2rem; }

body.shop-page.responsive-page:not(:has(main > section#home)) main > section:not(.shop-hero) {
  background: #f0f4f8 !important;
  background-image: none !important;
}

body.shop-page.responsive-page:not(:has(main > section#home)) main > section > #shop-lift-catalog
  .shop-filter-panel :is(.shop-filter-heading h3, legend, label, span, strong) {
  color: #08284a !important;
}

body.shop-page.responsive-page:not(:has(main > section#home)) main > section > #shop-lift-catalog
  .shop-filter-toggle {
  border-color: #a8b9c8 !important;
  background: #fff !important;
  color: #0039a6 !important;
}

body.shop-page.responsive-page:not(:has(main > section#home)) main > section > #shop-lift-catalog
  .shop-filter-toggle :is(span, svg) {
  color: #0039a6 !important;
}

body.shop-page.responsive-page:not(:has(main > section#home)) main > section > #shop-lift-catalog
  .shop-note p {
  color: #18314f !important;
}

@media (min-width: 1600px) {
  body.shop-page .shop-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  body.company-readable-page .company-story-inner {
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    gap: 2rem;
  }

  body.company-readable-page .company-credentials-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.company-readable-page .company-credential-approvals {
    grid-column: 1 / -1;
  }

  body.saints-page .hub-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.saints-page .hub-feature--lead {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  body.shop-page .shop-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body.company-readable-page .company-story-inner,
  body.company-readable-page .company-credentials-grid,
  body.saints-page .hub-section-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-story-visual img {
    min-height: 18rem;
    aspect-ratio: 1.2;
  }

  body.company-readable-page .company-story-links {
    grid-template-columns: minmax(0, 1fr);
  }

  body.company-readable-page .company-credential-approvals {
    grid-column: auto;
  }

  body.saints-page .hub-feature-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
  }

  body.saints-page .hub-feature--lead {
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  body.saints-page .hub-feature--lead img {
    height: 13rem;
    min-height: 13rem;
    grid-column: 1;
    grid-row: 1;
  }

  body.saints-page .hub-feature--lead > div {
    grid-column: 1;
    grid-row: 2;
  }

  body.shop-page .shop-card--feature {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  body.shop-page .shop-card--feature .shop-card-image {
    height: 13rem;
    min-height: 13rem;
    margin: -1.35rem -1.35rem .15rem;
    grid-column: 1;
    grid-row: auto;
  }

  body.shop-page .shop-card--feature .shop-card-icon,
  body.shop-page .shop-card--feature .shop-category,
  body.shop-page .shop-card--feature h3,
  body.shop-page .shop-card--feature p:not(.shop-category),
  body.shop-page .shop-card--feature strong,
  body.shop-page .shop-card--feature .shop-buy-link {
    grid-column: 1;
    grid-row: auto;
  }

  body.shop-page .shop-card--feature .shop-card-icon { margin-top: 0; }
  body.shop-page .shop-card--feature .shop-buy-link { margin-bottom: 0; }

  body.shop-page .shop-product-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.saints-page .hub-pathway-nav a {
    transition: none;
  }
}

body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-links a strong {
  color: #f8fbff !important;
}

body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-links a > span {
  color: #d6e7f5 !important;
}

body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-links a:hover,
body.company-readable-page.content-structure-page main > section.company-story > .detail-shell
  .company-story-links a:focus-visible {
  color: #a7f3d9 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-credential-card h3,
body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-regulator-reference strong {
  color: #092b4d !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-credential-card > p,
body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-regulator-reference p,
body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-regulator-reference span,
body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-registration-logos figcaption,
body.company-readable-page.content-structure-page main > section.company-credentials-section > .detail-shell
  .company-credentials-note {
  color: #40566e !important;
}

body.saints-page .saints-hero-content > h1 {
  width: auto;
  max-width: 58rem;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: #fff !important;
  text-shadow: none !important;
}

body.saints-page .saints-hero-content > p {
  width: fit-content;
  max-width: min(100%, 46rem);
  margin-top: 1rem;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: #f1f7fb !important;
  text-shadow: none !important;
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  line-height: 1.65;
}

body.saints-page .saints-hero-content > p:not(:first-child) {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #f1f7fb !important;
}

body.saints-page .saints-hero-content > .saints-hero-actions {
  margin-top: 1.75rem;
}

/* Hub and Shop Lift: put navigation beside the content and keep actions readable. */
body.saints-page .hub-showcase {
  display: grid;
  grid-template-columns: minmax(13rem, .28fr) minmax(0, 1fr);
  align-items: stretch;
  gap: clamp(1rem, 2vw, 2rem);
}

body.saints-page .hub-showcase-nav,
body.company-readable-page .company-credentials-nav {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

body.saints-page .hub-showcase-nav button,
body.company-readable-page .company-credentials-nav button {
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  border: 1px solid #cbd9e5;
  border-radius: .7rem;
  padding: .75rem 1rem;
  background: #fff;
  color: #18314f !important;
  font-size: .95rem;
  font-weight: 750;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
}

body.saints-page .hub-showcase-nav button[aria-pressed="true"],
body.company-readable-page .company-credentials-nav button[aria-pressed="true"] {
  border-color: #0039a6;
  background: #0039a6;
  color: #fff !important;
}

body.saints-page .hub-showcase-nav button > span,
body.company-readable-page .company-credentials-nav button > span {
  color: #0039a6 !important;
}

body.saints-page.responsive-page main > section > div[class*="max-w"] .hub-showcase
  .hub-showcase-nav button > span {
  color: #0039a6 !important;
}

body.saints-page .hub-showcase-nav button > i,
body.company-readable-page .company-credentials-nav button > i {
  color: inherit !important;
  font-style: normal;
}

body.saints-page .hub-showcase-nav button[aria-pressed="true"] > span,
body.company-readable-page .company-credentials-nav button[aria-pressed="true"] > span {
  color: #fff !important;
}

body.saints-page.responsive-page main > section > div[class*="max-w"] .hub-showcase
  .hub-showcase-nav button[aria-pressed="true"] > span {
  color: #fff !important;
}

body.saints-page .hub-showcase-nav button:hover,
body.saints-page .hub-showcase-nav button:focus-visible,
body.company-readable-page .company-credentials-nav button:hover,
body.company-readable-page .company-credentials-nav button:focus-visible {
  outline: 3px solid #0f766e;
  outline-offset: 2px;
}

body.saints-page .hub-showcase-content,
body.saints-page .hub-showcase-track,
body.company-readable-page .company-credentials-content,
body.company-readable-page .company-credentials-track {
  min-width: 0;
}

body.saints-page .hub-showcase-slide[hidden],
body.company-readable-page .company-credential-slide[hidden] {
  display: none !important;
}

body.saints-page .hub-showcase-slide {
  display: grid;
  min-height: 24rem;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid #cbd9e5;
  border-radius: 1rem;
  background: #fff !important;
  box-shadow: 0 16px 36px rgba(8, 37, 74, .1);
}

body.saints-page .hub-showcase-slide > img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 24rem;
  object-fit: cover;
}

body.saints-page .hub-showcase-slide > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(1.35rem, 3vw, 3rem);
}

body.saints-page .hub-showcase-slide > div > svg {
  width: 2rem;
  height: 2rem;
  color: #047857 !important;
}

body.saints-page .hub-showcase-slide h3 {
  max-width: 20ch;
  margin: 1rem 0 0;
  color: #08284a !important;
  font-size: clamp(1.6rem, 2.7vw, 2.8rem);
  font-weight: 850;
  line-height: 1.12;
  text-wrap: balance;
}

body.saints-page .hub-showcase-slide p {
  max-width: 56ch;
  margin: .85rem 0 0;
  color: #334e68 !important;
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
}

body.saints-page .hub-showcase-slide a {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  gap: .6rem;
  margin-top: 1.25rem;
  border: 1px solid #0039a6;
  border-radius: .55rem;
  padding: .7rem 1rem;
  background: #0039a6 !important;
  color: #fff !important;
  font-size: .95rem !important;
  font-weight: 800;
  line-height: 1.35;
  text-decoration: none;
}

body.saints-page .hub-showcase-slide a:hover,
body.saints-page .hub-showcase-slide a:focus-visible {
  background: #002d80 !important;
  outline: 3px solid #0f766e;
  outline-offset: 2px;
}

body.saints-page .hub-showcase-slide a > span {
  color: #fff !important;
}

body.saints-page .hub-showcase-slide a > i {
  color: inherit !important;
  font-style: normal;
}

body.saints-page.responsive-page main > section > div[class*="max-w"] .hub-showcase
  .hub-showcase-slide a,
body.saints-page.responsive-page main > section > div[class*="max-w"] .hub-showcase
  .hub-showcase-slide a > span {
  color: #fff !important;
}

body.saints-page .hub-showcase-controls,
body.company-readable-page .company-credentials-controls {
  justify-content: flex-start;
  margin-top: .9rem;
}

body.saints-page .hub-showcase-controls .home-card-carousel-button > span,
body.company-readable-page .company-credentials-controls .home-card-carousel-button > span,
body.shop-page .shop-product-carousel .home-card-carousel-button > span {
  color: #0039a6 !important;
}

body.saints-page .hub-showcase-controls .home-card-carousel-button > i,
body.company-readable-page .company-credentials-controls .home-card-carousel-button > i,
body.shop-page .shop-product-carousel .home-card-carousel-button > i {
  color: inherit !important;
  font-style: normal;
}

body.saints-page .hub-showcase-controls .home-card-carousel-status,
body.company-readable-page .company-credentials-controls .home-card-carousel-status {
  min-width: 5rem;
  color: #18314f !important;
  font-size: .9rem !important;
  font-weight: 750;
  text-align: center;
}

body.saints-page .hub-program-grid .hub-program-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: #fff !important;
  background-image: none !important;
  color: #18314f !important;
}

body.saints-page .hub-program-grid .hub-program-card::before,
body.saints-page .hub-program-grid .hub-program-card::after {
  display: none !important;
  content: none !important;
}

body.saints-page .hub-program-grid .hub-program-card h3 {
  color: #08284a !important;
}

body.saints-page .hub-program-grid .hub-program-card p {
  color: #334e68 !important;
  font-size: .98rem !important;
  line-height: 1.65 !important;
}

body.saints-page .hub-program-grid .hub-program-card a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  margin-top: auto;
  border: 1px solid #0039a6;
  border-radius: .5rem;
  padding: .65rem .85rem;
  background: #0039a6 !important;
  color: #fff !important;
  font-size: .92rem !important;
  font-weight: 800;
  line-height: 1.3;
  text-decoration: none;
}

body.saints-page .hub-program-grid .hub-program-card a:hover,
body.saints-page .hub-program-grid .hub-program-card a:focus-visible {
  background: #002d80 !important;
  outline: 3px solid #0f766e;
  outline-offset: 2px;
}

body.shop-page .shop-filter-toggle,
body.shop-page .shop-filter-heading [data-filter-close] {
  display: none !important;
}

body.shop-page .shop-catalog-layout {
  grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr);
  align-items: start;
  gap: clamp(1rem, 2vw, 2rem);
}

body.shop-page .shop-filter-panel {
  position: sticky;
  top: 1rem;
  width: auto;
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  transform: none;
}

body.shop-page .shop-filter-panel fieldset:first-of-type label {
  min-height: 2.75rem;
  gap: .7rem;
  border: 1px solid transparent;
  border-radius: .55rem;
  padding: .45rem .55rem;
  color: #18314f !important;
  font-size: .95rem !important;
  cursor: pointer;
}

body.shop-page .shop-filter-panel fieldset:first-of-type label:has(input:checked) {
  border-color: #b9d3f3;
  background: #eaf2fc;
  color: #0039a6 !important;
  font-weight: 800;
}

body.shop-page .shop-filter-panel fieldset:first-of-type input {
  flex: 0 0 auto;
}

body.shop-page .shop-products-column,
body.shop-page .shop-product-carousel {
  min-width: 0;
}

body.shop-page .shop-product-grid [data-shop-product][hidden] {
  display: none !important;
}

body.shop-page .shop-product-grid.home-card-carousel-track {
  display: flex;
  gap: clamp(.9rem, 1.5vw, 1.25rem);
  overflow-x: auto;
  overflow-y: hidden;
  padding: .25rem .15rem 1rem;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: #8aa6c4 transparent;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card {
  display: grid;
  flex: 0 0 clamp(18rem, 29vw, 25rem);
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 12rem auto auto auto 1fr auto auto;
  min-height: 31rem;
  scroll-snap-align: start;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card--feature {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 12rem auto auto auto 1fr auto auto;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-card-image,
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card--feature .shop-card-image {
  width: calc(100% + 2.7rem);
  max-width: none;
  height: 12rem;
  min-height: 12rem;
  grid-column: 1;
  grid-row: 1;
  margin: -1.35rem -1.35rem .15rem;
  object-fit: cover;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card > :not(.shop-card-image),
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card--feature > :not(.shop-card-image) {
  grid-column: 1;
  margin-inline: 0;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-card-icon { grid-row: 2; }
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-category { grid-row: 3; }
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card h3 { grid-row: 4; }
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card p:not(.shop-category) {
  grid-row: 5;
  color: #334e68 !important;
  font-size: .98rem !important;
  line-height: 1.6 !important;
}
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card strong { grid-row: 6; }

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-buy-link {
  display: inline-flex;
  min-height: 2.9rem;
  grid-row: 7;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  border: 1px solid #0039a6;
  border-radius: .55rem;
  padding: .7rem .9rem;
  background: #0039a6 !important;
  color: #fff !important;
  font-size: .95rem !important;
  font-weight: 800;
  line-height: 1.3;
  text-decoration: none;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-buy-link:hover,
body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-buy-link:focus-visible {
  background: #002d80 !important;
  outline: 3px solid #0f766e;
  outline-offset: 2px;
}

body.shop-page.responsive-page main > section > div#shop-lift-catalog .shop-catalog-layout
  .shop-products-column .shop-product-carousel .shop-product-grid .shop-card .shop-buy-link,
body.shop-page.responsive-page main > section > div#shop-lift-catalog .shop-catalog-layout
  .shop-products-column .shop-product-carousel .shop-product-grid .shop-card .shop-buy-link > svg {
  color: #fff !important;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card .shop-buy-link > svg {
  color: #fff !important;
}

body.shop-page.responsive-page main > section > div#shop-lift-catalog .shop-catalog-layout
  .shop-products-column .shop-product-carousel .home-card-carousel-controls
  .home-card-carousel-button > span {
  color: #0039a6 !important;
}

body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card--feature .shop-buy-link {
  margin-bottom: 0;
}

body.shop-page .shop-empty-state {
  margin-top: 1rem;
  color: #18314f !important;
  font-size: 1rem !important;
  line-height: 1.6;
}

body.company-readable-page .company-credentials-inner > div {
  max-width: none;
}

body.company-readable-page .company-credentials-carousel {
  display: grid;
  grid-template-columns: minmax(13rem, .28fr) minmax(0, 1fr);
  align-items: stretch;
  gap: clamp(1rem, 2vw, 2rem);
}

body.company-readable-page .company-credential-slide {
  display: grid;
  min-height: 24rem;
  grid-template-columns: minmax(12rem, .65fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.25rem, 3vw, 3rem);
  overflow: hidden;
  border: 1px solid #cbd9e5;
  border-radius: 1rem;
  padding: clamp(1.35rem, 3vw, 3rem);
  background: #fff !important;
  box-shadow: 0 16px 36px rgba(8, 37, 74, .1);
}

body.company-readable-page .company-credential-logo {
  display: grid;
  min-height: 12rem;
  place-items: center;
  border-radius: .8rem;
  padding: 1.5rem;
  background: #f3f7fa;
}

body.company-readable-page .company-credential-logo img {
  display: block;
  width: 100%;
  max-width: 20rem;
  max-height: 11rem;
  object-fit: contain;
}

body.company-readable-page .company-credential-mark > svg {
  width: 4.5rem;
  height: 4.5rem;
  color: #047857 !important;
}

body.company-readable-page .company-credential-label {
  margin: 0 0 .65rem;
  color: #047857 !important;
  font-size: .83rem !important;
  font-weight: 850;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  > .detail-shell .company-credential-slide h3 {
  margin: 0;
  color: #08284a !important;
  font-size: clamp(1.7rem, 3vw, 3rem);
  font-weight: 850;
  line-height: 1.12;
  text-wrap: balance;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  > .detail-shell .company-credential-slide > div > p:last-child {
  max-width: 60ch;
  margin: 1rem 0 0;
  color: #334e68 !important;
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  > .detail-shell .company-credentials-note {
  max-width: 100ch;
  color: #e2edf8 !important;
  font-size: .95rem !important;
  line-height: 1.65 !important;
}

body.company-readable-page.content-structure-page main > section.company-credentials-section
  > .detail-shell .company-credential-label {
  color: #047857 !important;
}

@media (max-width: 850px) {
  body.saints-page .hub-showcase,
  body.company-readable-page .company-credentials-carousel,
  body.shop-page .shop-catalog-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body.saints-page .hub-showcase-nav,
  body.company-readable-page .company-credentials-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.shop-page .shop-filter-panel {
    position: static;
    inset: auto;
    width: auto;
    max-height: none;
    overflow: visible;
    transform: none !important;
  }
}

@media (max-width: 600px) {
  body.saints-page .hub-showcase-nav,
  body.company-readable-page .company-credentials-nav {
    grid-template-columns: minmax(0, 1fr);
  }

  body.saints-page .hub-showcase-slide,
  body.company-readable-page .company-credential-slide {
    grid-template-columns: minmax(0, 1fr);
  }

  body.saints-page .hub-showcase-slide > img {
    height: 13rem;
    min-height: 13rem;
  }

  body.saints-page .hub-showcase-slide > div {
    padding: 1.25rem;
  }

  body.company-readable-page .company-credential-logo {
    min-height: 9rem;
  }

  body.company-readable-page .company-credential-logo img {
    max-height: 7.5rem;
  }

  body.shop-page .shop-filter-panel fieldset:first-of-type {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card,
  body.shop-page .shop-product-grid.home-card-carousel-track > .shop-card--feature {
    flex-basis: min(86vw, 27rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.shop-page .shop-product-grid.home-card-carousel-track {
    scroll-behavior: auto;
  }
}

.connectivity-page {
  --connectivity-ink: #09264a;
  --connectivity-blue: #0052cc;
  --connectivity-line: #c9d8e8;
  color: var(--connectivity-ink);
}

.connectivity-shell {
  width: min(calc(100% - clamp(2rem, 5vw, 7.5rem)), 160rem);
  margin-inline: auto;
}

.connectivity-hero {
  padding-block: clamp(3rem, 7vw, 6rem);
  color: #fff;
  background-color: #061b36;
  background-image:
    linear-gradient(110deg, rgba(3, 7, 18, .88), rgba(0, 38, 92, .68) 58%, rgba(3, 7, 18, .48)),
    url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2560&q=80");
  background-position: center, center 48%;
  background-size: cover;
}

.connectivity-hero .connectivity-shell {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: clamp(2rem, 6vw, 5.5rem);
  align-items: center;
}

.connectivity-hero-copy h1 {
  max-width: 12ch;
  color: #fff;
  font-size: clamp(2.6rem, 5.7vw, 5.1rem);
  font-weight: 850;
  letter-spacing: -.045em;
  line-height: 1.02;
}

.connectivity-hero-copy > p {
  max-width: 58ch;
  margin-top: 1.25rem;
  color: #dceeff;
  font-size: 1.05rem;
  line-height: 1.7;
}

.connectivity-hero-copy .connectivity-provider-note {
  display: grid;
  gap: .35rem;
  max-width: 31rem;
  margin-top: 1.4rem;
  padding: .8rem 0;
  border-block: 1px solid rgba(184, 214, 245, .3);
  color: #dceeff;
  font-size: .84rem;
  line-height: 1.55;
}

.connectivity-provider-note strong {
  color: #94e5e5;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.connectivity-form-heading {
  display: grid;
  gap: .4rem;
  padding-bottom: .85rem;
  border-bottom: 1px solid #dce6f1;
}

.connectivity-check-form {
  display: grid;
  gap: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid #d8e3ef;
  border-radius: .75rem;
  color: #102b4a;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 8, 24, .25);
}

.connectivity-check-form h2 {
  color: #09264a;
  font-size: clamp(1.3rem, 2.2vw, 1.75rem);
  font-weight: 820;
  letter-spacing: -.025em;
}

.connectivity-form-heading p {
  color: #405c79;
  font-size: .86rem;
  line-height: 1.5;
}

.connectivity-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem 1rem;
}

.connectivity-form-grid label[for="connectivity-locality"] {
  grid-column: 1 / -1;
}

.connectivity-form-grid label {
  display: grid;
  gap: .4rem;
  color: #17395d;
  font-size: .82rem;
  font-weight: 750;
}

.connectivity-form-grid label span {
  display: inline;
  color: #526b85;
  font-weight: 450;
}

.connectivity-form-grid input,
.connectivity-form-grid select {
  min-width: 0;
  min-height: 3rem;
  padding: .7rem .8rem;
  border: 1px solid #b6c7d9;
  border-radius: .5rem;
  color: #102b4a;
  background: #fff;
  font: inherit;
  font-size: .88rem;
}

.connectivity-form-grid input::placeholder {
  color: #526b85;
  opacity: 1;
}

.connectivity-form-grid :is(input, select):focus-visible {
  outline: 3px solid #74c8ff;
  outline-offset: 2px;
  border-color: #0052cc;
}

.connectivity-submit,
.connectivity-result-actions a,
.connectivity-sites-empty a,
.connectivity-vouchers-inner > a,
.connectivity-partners nav a {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  padding: .75rem 1rem;
  border-radius: .5rem;
  color: #fff;
  background: #0052cc;
  font-size: .9rem;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.connectivity-submit {
  justify-self: stretch;
  border: 0;
  cursor: pointer;
}

.connectivity-submit:hover,
.connectivity-result-actions a:hover,
.connectivity-sites-empty a:hover,
.connectivity-vouchers-inner > a:hover,
.connectivity-partners nav a:hover {
  background: #003d99;
}

.connectivity-form-hint {
  margin: -.45rem 0 0;
  color: #405c79;
  font-size: .76rem;
  line-height: 1.5;
}

.connectivity-result {
  display: grid;
  gap: .55rem;
  padding: 1rem;
  border: 1px solid #9bbfe5;
  border-radius: .65rem;
  background: #eef6ff;
}

.connectivity-result[hidden],
.connectivity-order-link[hidden] {
  display: none !important;
}

.connectivity-result h3 {
  color: #09264a;
  font-size: 1.05rem;
  font-weight: 800;
}

.connectivity-result p {
  max-width: 68ch;
  color: #274462;
  font-size: .85rem;
  line-height: 1.6;
}

.connectivity-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: .35rem;
}

.connectivity-result-actions .connectivity-result-contact {
  color: #0646a8;
  background: #fff;
  box-shadow: inset 0 0 0 1px #97b9dc;
}

.connectivity-result-actions .connectivity-result-contact:hover {
  color: #fff;
}

.connectivity-journey {
  padding-block: clamp(2.75rem, 5vw, 4.25rem);
  background: #fff;
}

.connectivity-journey-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--connectivity-line);
}

.connectivity-journey-heading h2 {
  max-width: 23ch;
  color: #09264a;
  font-size: clamp(1.45rem, 2.8vw, 2.25rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.1;
}

.connectivity-journey-heading p {
  max-width: 38ch;
  color: #38536e;
  font-size: .88rem;
  line-height: 1.6;
}

.connectivity-journey-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 2.5rem);
  margin: 0;
  padding: 1.5rem 0 0;
  list-style: none;
}

.connectivity-journey-track::before {
  position: absolute;
  top: 2.15rem;
  right: 16.5%;
  left: 1.15rem;
  height: 1px;
  background: #9db7d0;
  content: "";
}

.connectivity-journey-track li {
  position: relative;
  display: grid;
  grid-template-columns: 2.3rem minmax(0, 1fr);
  gap: .85rem;
  align-items: start;
}

.connectivity-journey-marker {
  z-index: 1;
  display: grid;
  width: 2.3rem;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid #0052cc;
  border-radius: 50%;
  color: #fff;
  background: #0052cc;
  font-size: .8rem;
  font-weight: 850;
}

.connectivity-journey-track h3 {
  margin-top: .2rem;
  color: #09264a;
  font-size: 1rem;
  font-weight: 820;
}

.connectivity-journey-track p {
  max-width: 34ch;
  margin-top: .4rem;
  color: #38536e;
  font-size: .84rem;
  line-height: 1.6;
}

.connectivity-reachability,
.connectivity-sites,
.connectivity-partners {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: #fff;
}

.connectivity-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr);
  gap: 2rem;
  align-items: end;
  margin-bottom: 2rem;
}

.connectivity-section-heading h2,
.connectivity-sites h2,
.connectivity-vouchers h2,
.connectivity-partners h2 {
  max-width: 18ch;
  color: #09264a;
  font-size: clamp(1.8rem, 3.7vw, 3.2rem);
  font-weight: 850;
  letter-spacing: -.04em;
  line-height: 1.05;
}

.connectivity-section-heading p,
.connectivity-sites-inner > div:first-child p,
.connectivity-vouchers p,
.connectivity-partners-inner > div:first-child p {
  max-width: 62ch;
  color: #38536e;
  font-size: .98rem;
  line-height: 1.7;
}

.connectivity-region-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--connectivity-line);
  border-bottom: 1px solid var(--connectivity-line);
}

.connectivity-region-grid button {
  display: grid;
  min-width: 0;
  min-height: 7.6rem;
  align-content: space-between;
  gap: .8rem;
  padding: 1.15rem 1.25rem 1.15rem 0;
  border: 0;
  color: #09264a;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: color .18s ease, background-color .18s ease;
}

.connectivity-region-grid button + button {
  padding-left: 1.25rem;
  border-left: 1px solid var(--connectivity-line);
}

.connectivity-region-grid button:hover,
.connectivity-region-grid button[aria-pressed="true"] {
  color: #0646a8;
  background: #edf5fc;
}

.connectivity-region-grid button:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid #0052cc;
  outline-offset: -3px;
}

.connectivity-region-name {
  font-size: 1.2rem;
  font-weight: 820;
}

.connectivity-region-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  color: #325574;
  font-size: .75rem;
  font-weight: 750;
}

.connectivity-region-action i {
  color: #0052cc;
  font-size: 1rem;
  font-style: normal;
  transition: transform .18s ease;
}

.connectivity-region-grid button:hover .connectivity-region-action i,
.connectivity-region-grid button[aria-pressed="true"] .connectivity-region-action i {
  transform: translateX(.2rem);
}

.connectivity-region-note {
  margin-top: 1rem;
  color: #435e79;
  font-size: .8rem;
  line-height: 1.55;
}

.connectivity-map-status {
  display: inline-flex;
  margin-bottom: .8rem;
  padding: .4rem .6rem;
  border: 1px solid #b8cbe0;
  color: #203f5f;
  background: #eaf1f8;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.connectivity-map-figure {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(19rem, .88fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  margin-top: clamp(2rem, 4vw, 3.25rem);
  padding: clamp(1rem, 2.5vw, 1.75rem);
  border: 1px solid #cbd8e6;
  border-radius: .85rem;
  background: #f6f9fc;
}

.connectivity-map-frame {
  min-width: 0;
  overflow: hidden;
  border-radius: .65rem;
  background: #f6f9fc;
}

.connectivity-map-frame img {
  display: block;
  width: 100%;
  height: auto;
}

.connectivity-map-caption h3 {
  color: #09264a;
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  font-weight: 830;
  letter-spacing: -.025em;
  line-height: 1.15;
}

.connectivity-map-caption p {
  margin-top: .8rem;
  color: #38536e;
  font-size: .9rem;
  line-height: 1.65;
}

.connectivity-map-key {
  display: grid;
  gap: .65rem;
  margin-top: 1.2rem;
}

.connectivity-map-key span {
  display: flex;
  align-items: center;
  gap: .65rem;
  color: #274462;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.4;
}

.connectivity-map-key i {
  display: inline-block;
  width: .9rem;
  height: .9rem;
  flex: 0 0 auto;
}

.connectivity-map-key-noc {
  border: 3px solid #075caa;
  border-radius: 50%;
  background: #fff;
}

.connectivity-map-key-link {
  height: 0 !important;
  border-top: 2px dashed #176a86;
}

.connectivity-map-key-region {
  border: 1px solid #7b98ad;
  background: #dcebf5;
}

.connectivity-map-caption small {
  display: block;
  margin-top: 1.25rem;
  color: #526b85;
  font-size: .72rem;
  line-height: 1.55;
}

.connectivity-map-caption small a {
  color: #0646a8;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: .15em;
}

.connectivity-sites {
  background: #f2f6fb;
}

.connectivity-sites-inner,
.connectivity-vouchers-inner,
.connectivity-partners-inner {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(22rem, 1.15fr);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: start;
}

.connectivity-sites-empty {
  padding: 1.5rem;
  border: 1px solid #b7cce1;
  border-radius: .8rem;
  background: #fff;
}

.connectivity-sites-empty strong {
  color: #09264a;
  font-size: 1.05rem;
}

.connectivity-sites-empty p {
  margin: .65rem 0 1rem;
  color: #38536e;
  font-size: .9rem;
  line-height: 1.65;
}

.connectivity-vouchers {
  padding-block: clamp(3.5rem, 7vw, 6rem);
  color: #fff;
  background: #09264a;
}

body.connectivity-page.content-structure-page main > section.connectivity-vouchers {
  color: #fff !important;
  background: #09264a !important;
  background-image: none !important;
}

.connectivity-vouchers h2 {
  color: #fff;
}

.connectivity-vouchers p {
  margin-top: .8rem;
  color: #d7e8f8;
}

.connectivity-vouchers-inner > a {
  justify-self: start;
  align-self: center;
  color: #09264a;
  background: #b8eef0;
}

.connectivity-vouchers-inner > a:hover {
  color: #fff;
}

.connectivity-partners-inner nav {
  display: grid;
  gap: .7rem;
}

.connectivity-partners nav a {
  justify-content: space-between;
}

.connectivity-promo-section {
  padding: clamp(2.5rem, 5vw, 4rem) 1.25rem;
  color: #fff;
  background: #09264a;
}

.connectivity-promo-inner {
  display: flex;
  width: min(100%, 160rem);
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-inline: auto;
}

.connectivity-promo-inner h2 {
  color: #fff;
  font-size: clamp(1.55rem, 3vw, 2.5rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.1;
}

.connectivity-promo-inner p {
  max-width: 65ch;
  margin-top: .65rem;
  color: #d7e8f8;
  font-size: .95rem;
  line-height: 1.65;
}

.connectivity-promo-inner > a {
  display: inline-flex;
  min-width: max-content;
  min-height: 3rem;
  align-items: center;
  gap: .65rem;
  padding: .75rem 1rem;
  border-radius: .5rem;
  color: #09264a;
  background: #b8eef0;
  font-weight: 800;
  text-decoration: none;
}

.connectivity-promo-inner > a:hover {
  color: #fff;
  background: #0052cc;
}

.company-services-carousel {
  display: grid;
  grid-template-columns: minmax(13.5rem, .36fr) minmax(0, 1fr);
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: start;
}

.company-services-nav {
  display: grid;
  gap: .35rem;
}

.company-services-nav button {
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  padding: .75rem .8rem;
  border: 0;
  border-bottom: 1px solid #c5d3e1;
  color: #254663;
  background: transparent;
  font: inherit;
  font-size: .9rem;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.company-services-nav button[aria-current="true"] {
  color: #0646a8;
  background: #e8f2fc;
}

.company-services-nav button i {
  color: #0052cc;
  font-size: 1.1rem;
  font-style: normal;
}

.company-services-content {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cbd8e6;
  border-radius: .8rem;
  background: #fff;
}

.company-services-track {
  min-height: 21rem;
  padding: clamp(1.35rem, 3vw, 2.5rem);
}

.company-service-slide {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(15rem, .8fr);
  gap: clamp(1.25rem, 4vw, 3.5rem);
  align-items: start;
}

.company-service-slide[hidden] {
  display: none !important;
}

.company-service-label {
  color: #1259a8;
  font-size: .75rem;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.company-service-slide h3 {
  margin-top: .55rem;
  color: #09264a;
  font-size: clamp(1.55rem, 3vw, 2.3rem);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.08;
}

.company-service-slide > div > p:last-child {
  max-width: 62ch;
  margin-top: .9rem;
  color: #38536e;
  font-size: .95rem;
  line-height: 1.75;
}

.company-service-slide ul {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: .2rem 0 0 1.2rem;
  color: #233f5d;
  font-size: .9rem;
  line-height: 1.55;
}

.company-service-slide li::marker {
  color: #00828a;
}

.company-services-controls {
  justify-content: flex-end;
  padding: .7rem 1rem;
  border-top: 1px solid #d8e3ef;
}

.company-credential-provider-logos {
  display: grid;
  gap: .8rem;
}

.company-credential-provider-logos .company-credential-logo {
  min-height: 7rem;
}

.company-credential-provider-logos figcaption {
  color: #38536e;
  font-size: .75rem;
  font-weight: 750;
  text-align: center;
}

body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events) {
  position: relative !important;
  isolation: isolate;
  background-color: #f7f9fc !important;
  background-image: none !important;
}

body.saints-page.content-structure-page main > section#hub-programmes,
body.saints-page.content-structure-page main > section#projects,
body.saints-page.content-structure-page main > section#training {
  background-color: #fff !important;
}

body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events)::before,
body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events)::after {
  display: none !important;
  content: none !important;
}

body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events) > .max-w-6xl {
  box-sizing: border-box;
  width: min(calc(100% - clamp(2rem, 6vw, 4rem)), 82rem);
  max-width: 82rem;
  margin-inline: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events) :is(h2, h3, strong) {
  color: #09264a !important;
  text-shadow: none !important;
}

body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events) :is(p, small, label) {
  color: #38536e !important;
  text-shadow: none !important;
}

body.saints-page.content-structure-page .hub-section-heading {
  max-width: 60rem;
}

body.saints-page.content-structure-page .home-card-carousel--hub {
  min-width: 0;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding: .35rem .2rem 1.1rem;
  scroll-padding-inline: .2rem;
  scroll-snap-type: x mandatory;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article {
  display: flex;
  flex: 0 0 clamp(17rem, 29vw, 23rem);
  flex-direction: column;
  min-width: 0;
  min-height: 18rem;
  padding: 1.35rem;
  border: 1px solid #cbd8e6 !important;
  border-radius: .75rem;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(9, 38, 74, .08);
  scroll-snap-align: start;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article :is(h3, p, small, a) {
  color: #183653 !important;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article p {
  margin-block: .6rem 1rem;
  font-size: .92rem;
  line-height: 1.65;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article > a {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-top: auto;
  color: #0646a8 !important;
  font-weight: 800;
  text-decoration: none;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article > a:hover {
  text-decoration: underline;
  text-underline-offset: .2em;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article > svg {
  width: 1.5rem;
  height: 1.5rem;
  color: #007d83;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-controls {
  display: flex;
  max-width: 22rem;
  align-items: center;
  gap: .8rem;
  margin: .35rem auto 0;
}

body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-controls[hidden] {
  display: none !important;
}

body.saints-page.content-structure-page main > section:last-of-type:not(#events):not(.saints-hero) {
  background-color: #f7f9fc !important;
  background-image: none !important;
}

body.saints-page.content-structure-page main > section:last-of-type:not(#events):not(.saints-hero) > [class*="max-w"] {
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
  color: #09264a !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

@media (max-width: 900px) {
  .connectivity-hero .connectivity-shell,
  .connectivity-sites-inner,
  .connectivity-vouchers-inner,
  .connectivity-partners-inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .connectivity-hero .connectivity-shell {
    gap: 2rem;
  }

  .connectivity-section-heading {
    grid-template-columns: minmax(0, 1fr);
    gap: .8rem;
  }

  .connectivity-journey-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: .6rem;
  }

  .connectivity-map-figure {
    grid-template-columns: minmax(0, 1fr);
  }

  .connectivity-region-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .connectivity-region-grid button:nth-child(3),
  .connectivity-region-grid button:nth-child(4) {
    border-top: 1px solid var(--connectivity-line);
  }

  .connectivity-region-grid button:nth-child(3) {
    padding-left: 0;
    border-left: 0;
  }

  .company-service-slide {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-services-track {
    min-height: 0;
  }
}

@media (max-width: 680px) {
  .connectivity-shell {
    width: min(calc(100% - 2rem), 160rem);
  }

  .connectivity-hero {
    background-image:
      linear-gradient(160deg, rgba(3, 7, 18, .9), rgba(0, 38, 92, .76) 62%, rgba(3, 7, 18, .68)),
      url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=1200&q=75");
    background-position: center, 58% center;
  }

  .connectivity-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .connectivity-journey-track {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    padding-top: 1.15rem;
  }

  .connectivity-journey-track::before {
    top: 1.1rem;
    bottom: 1.5rem;
    left: 1.1rem;
    width: 1px;
    height: auto;
  }

  .connectivity-journey-track li {
    min-height: 4.25rem;
  }

  .connectivity-region-grid button,
  .connectivity-region-grid button + button,
  .connectivity-region-grid button:nth-child(3),
  .connectivity-region-grid button:nth-child(4) {
    min-height: 6rem;
    padding: .9rem 0;
    border: 0;
  }

  .connectivity-region-grid button + button {
    border-top: 1px solid var(--connectivity-line);
  }

  .connectivity-map-figure {
    padding: .75rem;
  }

  .connectivity-promo-inner {
    align-items: flex-start;
    flex-direction: column;
    gap: 1.25rem;
  }

  .connectivity-promo-inner > a {
    min-width: 0;
  }

  .company-services-carousel {
    grid-template-columns: minmax(0, 1fr);
  }

  .company-services-nav {
    display: flex;
    gap: .35rem;
    overflow-x: auto;
    padding-bottom: .3rem;
    scroll-snap-type: x mandatory;
  }

  .company-services-nav button {
    flex: 0 0 auto;
    min-height: 2.75rem;
    border: 1px solid #c5d3e1;
    border-radius: .4rem;
    scroll-snap-align: start;
  }

  body.saints-page.content-structure-page main > section:not(.saints-hero):not(#events) > .max-w-6xl {
    width: calc(100% - 2rem);
  }

  body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track > article {
    flex-basis: min(84vw, 23rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.saints-page.content-structure-page .home-card-carousel--hub .home-card-carousel-track {
    scroll-behavior: auto;
  }
}

body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-track {
  gap: 0 !important;
  padding-inline: 0 !important;
  scroll-padding-inline: 0 !important;
}

body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-track > .client-sector-feature {
  box-sizing: border-box;
  flex: 0 0 100% !important;
  max-width: 100% !important;
  min-height: 24rem;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr);
  align-content: stretch;
  align-items: start;
  gap: .4rem 1rem;
  padding: clamp(1.35rem, 2.4vw, 2rem);
  border-color: #d8e3ed;
  border-radius: .85rem;
  background: #fff;
  box-shadow: 0 8px 20px rgba(0, 26, 77, .08);
  text-align: left;
}

body:has(main > section#home) #client-fit .client-sector-feature > svg {
  grid-row: 1 / span 2;
  align-self: center;
  width: 1.55rem;
  height: 1.55rem;
  margin-top: .2rem;
  color: #087b70;
}

body:has(main > section#home) #client-fit .client-sector-feature > strong {
  align-self: end;
  color: #123254 !important;
  font-size: clamp(1.2rem, 1.65vw, 1.55rem) !important;
  font-weight: 800;
  line-height: 1.25;
}

body:has(main > section#home) #client-fit .client-sector-feature > span {
  max-width: 58ch;
  color: #40566e !important;
  font-size: 1rem !important;
  line-height: 1.55;
}

body:has(main > section#home) #client-fit .client-sector-detail {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-content: start;
  align-items: start;
  gap: .9rem 1.5rem;
  width: 100%;
  margin-top: 1.15rem;
  padding-top: 1.1rem;
  border-top: 1px solid #dbe5ed;
}

body:has(main > section#home) #client-fit .client-sector-detail h3 {
  max-width: 22ch;
  margin: 0;
  color: #123254 !important;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1.4;
  text-wrap: balance;
}

body:has(main > section#home) #client-fit .client-sector-detail ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

body:has(main > section#home) #client-fit .client-sector-detail li {
  position: relative;
  min-width: 0;
  padding-left: 1.1rem;
  color: #40566e !important;
  font-size: .9rem;
  line-height: 1.45;
}

body:has(main > section#home) #client-fit .client-sector-detail li::before {
  position: absolute;
  top: .45em;
  left: 0;
  width: .4rem;
  height: .4rem;
  border-radius: 50%;
  background: #0b8174;
  content: "";
}

body:has(main > section#home) #client-fit .client-sector-grid > .home-card-carousel-controls {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
  min-height: 4rem;
  gap: clamp(.75rem, 2vw, 1.25rem);
  margin: .75rem 0 0;
  padding: .5rem .75rem !important;
  border-radius: .85rem;
  background: rgba(14, 48, 119, .82);
}

body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-button {
  flex: 0 0 3.25rem;
  width: 3.25rem;
  min-width: 3.25rem;
  min-height: 3.25rem;
  padding: 0;
  border-radius: 50%;
  border-color: #fff;
  background: #fff;
  color: #087b70;
}

body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-button:disabled {
  opacity: .58;
}

body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-progress {
  flex: 1 1 auto;
  width: auto;
  min-width: 2rem;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, .48);
}

@media (max-width: 1100px) {
  body:has(main > section#home) #client-fit .client-sector-detail {
    grid-template-columns: minmax(0, 1fr);
    gap: .65rem;
    margin-top: .9rem;
  }

  body:has(main > section#home) #client-fit .client-sector-detail ul {
    grid-template-columns: minmax(0, 1fr);
    gap: .55rem;
  }
}

@media (max-width: 639px) {
  body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-track > .client-sector-feature {
    min-height: 24rem;
    padding: 1.25rem;
  }

  body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-controls {
    min-height: 3.75rem;
    padding-inline: .5rem !important;
  }

  body:has(main > section#home) #client-fit .client-sector-grid .home-card-carousel-button {
    flex-basis: 3rem;
    width: 3rem;
    min-width: 3rem;
    min-height: 3rem;
  }
}