:root {
  --mint: #eafff8;
  --mint-2: #f5ffdc;
  --aqua: #dff8f8;
  --teal: #2fa8a5;
  --teal-dark: #075d61;
  --lime: #efffb0;
  --pink: #ffe8ef;
  --lav: #eee4ff;
  --ink: #050505;
  --muted: #556669;
  --line: rgba(47, 168, 165, .42);
  --shadow: 0 24px 70px rgba(10, 92, 91, .12);
  --radius: 24px;
  --max: 1360px;
}

/* Services overview and richer detail pages. */
.services-index-hero .company-copy h1 {
  animation: heroLineZigzag 6.4s ease-in-out infinite;
}

.services-index-hero .company-stage {
  min-height: 620px;
  transform-style: preserve-3d;
}

.services-index-hero .company-stage::after {
  content: "";
  position: absolute;
  inset: 10%;
  border-radius: 44px;
  border: 1px solid rgba(42, 173, 171, .24);
  transform: translateZ(-26px) rotate(-2deg);
  pointer-events: none;
}

.services-index-hero .company-glass-card {
  animation: floatingCard 5.8s ease-in-out infinite;
}

.service-proof-split .video-card,
.detail-media-stack {
  transform-style: preserve-3d;
}

.detail-media-stack {
  display: grid;
  gap: 20px;
}

.detail-extra-image {
  min-height: 330px;
  animation: softZigzag 7s ease-in-out infinite;
}

.detail-extra-image img {
  width: 100%;
  height: 100%;
  min-height: 330px;
  object-fit: cover;
  border-radius: 26px;
}

.service-child-card {
  position: relative;
  overflow: hidden;
}

.service-child-card::before {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  right: -50px;
  top: -60px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(217,255,114,.55), rgba(42,173,171,.12) 62%, transparent 70%);
  pointer-events: none;
}

.service-menu-gallery .info-card:nth-child(2n),
.detail-grid .info-card:nth-child(3n) {
  animation: cardFloatA 6.8s ease-in-out infinite;
}

.service-menu-gallery .info-card:nth-child(2n+1),
.detail-grid .info-card:nth-child(3n+1) {
  animation: cardFloatB 7.4s ease-in-out infinite;
}

@keyframes softZigzag {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(.2deg); }
  35% { transform: translate3d(8px, -10px, 18px) rotate(-.8deg); }
  70% { transform: translate3d(-6px, 8px, 12px) rotate(.7deg); }
}

@keyframes cardFloatA {
  0%, 100% { transform: translateY(0) rotateX(0) rotateY(0); }
  50% { transform: translateY(-8px) rotateX(1.2deg) rotateY(-1.2deg); }
}

@keyframes cardFloatB {
  0%, 100% { transform: translateY(0) rotateX(0) rotateY(0); }
  50% { transform: translateY(7px) rotateX(-1deg) rotateY(1deg); }
}

@media (max-width: 980px) {
  .services-index-hero .company-stage {
    min-height: 460px;
  }
  .detail-extra-image,
  .detail-extra-image img {
    min-height: 260px;
  }
}

/* Homepage testimonial rebuild and stronger motion pass. */
.roots-testimonial {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 16%, rgba(222, 255, 249, .95), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(239, 255, 176, .78), transparent 28%),
    linear-gradient(135deg, #fbfffb 0%, #f1fff9 52%, #fffdf2 100%);
}

.roots-testimonial::before {
  content: "";
  position: absolute;
  width: 560px;
  height: 560px;
  border: 1px solid rgba(47, 168, 165, .24);
  border-radius: 999px;
  left: -180px;
  bottom: -250px;
  animation: slowOrbit 18s linear infinite;
}

.testimonial-showcase {
  position: relative;
  display: grid;
  grid-template-columns: .82fr .9fr 1fr;
  gap: 28px;
  align-items: center;
  perspective: 1200px;
}

.testimonial-copy h2 {
  font-size: clamp(44px, 5.2vw, 86px);
  line-height: .98;
  margin: 12px 0 22px;
  animation: heroLineZigzag 7s ease-in-out infinite;
}

.testimonial-score {
  width: min(100%, 340px);
  margin-top: 34px;
  padding: 26px;
  border-radius: 30px;
  background: #050505;
  color: #fff;
  box-shadow: 0 28px 80px rgba(5, 5, 5, .16);
  animation: floatSoft 5.6s ease-in-out infinite;
}

.testimonial-score strong {
  display: block;
  font-size: 58px;
  line-height: 1;
}

.testimonial-score span {
  display: block;
  color: #d6ff27;
  margin: 6px 0 8px;
  letter-spacing: .12em;
}

.testimonial-score small {
  color: rgba(255,255,255,.72);
  font-weight: 700;
}

.testimonial-video-card {
  position: relative;
  min-height: 560px;
  border-radius: 42px;
  overflow: hidden;
  border: 16px solid rgba(255,255,255,.78);
  box-shadow: 0 42px 110px rgba(10, 92, 91, .2);
  transform-style: preserve-3d;
  animation: testimonialTilt 7.5s ease-in-out infinite;
}

.testimonial-video-card video {
  width: 100%;
  height: 100%;
  min-height: 560px;
  object-fit: cover;
  filter: saturate(1.08) contrast(1.05);
}

.testimonial-video-label {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 24px;
  padding: 22px 24px;
  border-radius: 26px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(16px);
  box-shadow: 0 20px 55px rgba(10,92,91,.14);
}

.testimonial-video-label strong,
.testimonial-video-label span {
  display: block;
}

.testimonial-video-label strong {
  font-size: 24px;
}

.testimonial-stack {
  display: grid;
  gap: 18px;
}

.testimonial-stack .testimonial-card {
  min-height: auto;
  padding: 28px;
}

.clean-review {
  animation: cardFloatA 7s ease-in-out infinite;
}

.clean-review:nth-child(2) {
  animation-name: cardFloatB;
  animation-delay: .4s;
}

.clean-review:nth-child(3) {
  animation-delay: .8s;
}

.hero-title > span {
  text-shadow: 0 26px 70px rgba(10, 92, 91, .15);
}

.hero-title > span::after {
  content: "";
  display: block;
  width: 38%;
  height: 7px;
  border-radius: 999px;
  margin-top: 10px;
  background: linear-gradient(90deg, rgba(47,168,165,.0), rgba(47,168,165,.55), rgba(214,255,39,.7));
  transform-origin: left center;
  animation: textUnderlineSweep 4.8s ease-in-out infinite;
}

.hero-title > span:nth-child(2)::after,
.hero-title > span:nth-child(3)::after {
  width: 24%;
  animation-delay: .7s;
}

.hero-person::after {
  animation: slowOrbit 12s linear infinite;
}

@keyframes testimonialTilt {
  0%, 100% { transform: translate3d(0, 0, 0) rotateX(0) rotateY(0); }
  40% { transform: translate3d(10px, -14px, 24px) rotateX(2deg) rotateY(-2.5deg); }
  72% { transform: translate3d(-8px, 10px, 18px) rotateX(-1.5deg) rotateY(2deg); }
}

@keyframes textUnderlineSweep {
  0%, 100% { transform: scaleX(.25); opacity: .28; }
  45% { transform: scaleX(1); opacity: .9; }
}

@media (max-width: 1120px) {
  .testimonial-showcase {
    grid-template-columns: 1fr;
  }
  .testimonial-video-card,
  .testimonial-video-card video {
    min-height: 430px;
  }
}

@media (max-width: 680px) {
  .testimonial-video-card,
  .testimonial-video-card video {
    min-height: 320px;
    border-radius: 30px;
  }
  .testimonial-video-card {
    border-width: 9px;
  }
  .testimonial-copy h2 {
    font-size: clamp(38px, 12vw, 56px);
  }
}

/* FINAL NO-MOTION + CLICK-ONLY NAVIGATION OVERRIDES */
.hero-card, .hero-inner, .hero-content, .hero-copy,
.hero-content h1, .hero-content h1 *, .hero-content p,
.hero-person, .hero-slideshow, .company-hero, .company-copy,
.company-copy h1, .company-copy h1 *, .company-copy p,
.company-stage, .page-hero, .page-card, .page-hero-media,
.industry-hero-copy, .industry-hero-copy *, .slide-caption,
.slide-caption *, .company-glass-card, .company-glass-card *,
.group-zigzag, .zigzag-copy, .zigzag-copy *, .zigzag-media {
  animation: none !important;
  transform: none !important;
  transform-style: flat !important;
}

.hero-person:hover, .company-stage:hover, .zigzag-media:hover {
  transform: none !important;
}

.hero-slide, .hero-slide.active,
video.hero-slide, video.hero-slide.active,
.company-stage .hero-slide, .company-stage .hero-slide.active {
  animation: none !important;
  transform: none !important;
}
.hero-slide { transition: opacity .75s ease !important; }

.menu-group:not(.open) > .nav-dropdown,
.menu-group:not(.open):hover > .nav-dropdown,
.menu-group:not(.open):focus-within > .nav-dropdown {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -8px) !important;
}
.menu-group.open > .nav-dropdown,
.menu-group.open:hover > .nav-dropdown,
.menu-group.open:focus-within > .nav-dropdown {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(-50%, 0) !important;
}

@media (max-width: 1120px) {
  .menu-group:not(.open) > .nav-dropdown,
  .menu-group:not(.open):hover > .nav-dropdown,
  .menu-group:not(.open):focus-within > .nav-dropdown {
    display: none !important;
    transform: none !important;
  }
  .menu-group.open > .nav-dropdown,
  .menu-group.open:hover > .nav-dropdown,
  .menu-group.open:focus-within > .nav-dropdown {
    display: grid !important;
    transform: none !important;
  }
}

/* FINAL stable hero and navigation overrides. Keep this block last. */
.hero-card, .hero-inner, .hero-content, .hero-copy,
.hero-content h1, .hero-content p, .hero-person, .hero-slideshow,
.company-hero, .company-copy, .company-copy h1, .company-copy p,
.company-stage, .page-hero, .page-card, .page-hero-media,
.industry-hero-copy, .slide-caption, .company-glass-card,
.group-zigzag, .zigzag-copy, .zigzag-copy h2, .zigzag-copy p, .zigzag-media {
  animation: none !important;
  transform: none !important;
  transform-style: flat !important;
}

.hero-person:hover, .company-stage:hover, .zigzag-media:hover {
  transform: none !important;
}

.hero-slide, .hero-slide.active,
video.hero-slide, video.hero-slide.active,
.company-stage .hero-slide, .company-stage .hero-slide.active {
  animation: none !important;
  transform: none !important;
}

.hero-slide { transition: opacity .75s ease !important; }

.menu-group:not(.open) > .nav-dropdown,
.menu-group:not(.open):hover > .nav-dropdown,
.menu-group:not(.open):focus-within > .nav-dropdown {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -8px) !important;
}

.menu-group.open > .nav-dropdown,
.menu-group.open:hover > .nav-dropdown,
.menu-group.open:focus-within > .nav-dropdown {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(-50%, 0) !important;
}

@media (max-width: 1120px) {
  .menu-group:not(.open) > .nav-dropdown,
  .menu-group:not(.open):hover > .nav-dropdown,
  .menu-group:not(.open):focus-within > .nav-dropdown {
    display: none !important;
    transform: none !important;
  }
  .menu-group.open > .nav-dropdown,
  .menu-group.open:hover > .nav-dropdown,
  .menu-group.open:focus-within > .nav-dropdown {
    display: grid !important;
    transform: none !important;
  }
}

/* Stable hero/slideshow presentation: no zig-zag, floating or 3D motion. */
.hero-card,
.hero-inner,
.hero-content,
.hero-copy,
.hero-content h1,
.hero-content p,
.hero-person,
.hero-slideshow,
.company-hero,
.company-copy,
.company-copy h1,
.company-copy p,
.company-stage,
.page-hero,
.page-card,
.page-hero-media,
.industry-hero-copy,
.slide-caption,
.company-glass-card,
.group-zigzag,
.zigzag-copy,
.zigzag-copy h2,
.zigzag-copy p,
.zigzag-media {
  animation: none !important;
  transform: none !important;
  transform-style: flat !important;
}

.hero-person:hover,
.company-stage:hover,
.zigzag-media:hover {
  transform: none !important;
}

.hero-slide,
.hero-slide.active,
video.hero-slide,
video.hero-slide.active,
.company-stage .hero-slide,
.company-stage .hero-slide.active {
  animation: none !important;
  transform: none !important;
}

.hero-slide {
  transition: opacity .75s ease !important;
}

/* Services and sectors open only by click and stay open until outside click/Escape. */
.menu-group:not(.open) > .nav-dropdown,
.menu-group:not(.open):hover > .nav-dropdown,
.menu-group:not(.open):focus-within > .nav-dropdown {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -8px) !important;
}

.menu-group.open > .nav-dropdown,
.menu-group.open:hover > .nav-dropdown,
.menu-group.open:focus-within > .nav-dropdown {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(-50%, 0) !important;
}

@media (max-width: 1120px) {
  .menu-group:not(.open) > .nav-dropdown,
  .menu-group:not(.open):hover > .nav-dropdown,
  .menu-group:not(.open):focus-within > .nav-dropdown {
    display: none !important;
    transform: none !important;
  }

  .menu-group.open > .nav-dropdown,
  .menu-group.open:hover > .nav-dropdown,
  .menu-group.open:focus-within > .nav-dropdown {
    display: grid !important;
    transform: none !important;
  }
}

/* Stable desktop dropdown: click controls state, scrolling never closes it. */
@media (min-width: 1121px) {
  .menu-group:hover:not(.open) .nav-dropdown,
  .menu-group:focus-within:not(.open) .nav-dropdown {
    opacity: 0;
    transform: translate(-50%, -8px);
    pointer-events: none;
  }
  .menu-group.open .nav-dropdown {
    display: grid;
    opacity: 1;
    transform: translate(-50%, 0);
    pointer-events: auto;
  }
}

.nav-dropdown {
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable;
}

/* Transparent PNG brand mark on slideshow media. */
.hero-person .uniform-logo {
  right: 16px !important;
  top: 16px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  filter: drop-shadow(0 4px 7px rgba(255,255,255,.62)) drop-shadow(0 8px 12px rgba(0,0,0,.24)) !important;
}

/* Final brand, CEO crop and official Roots Group integration. */
.hero-person .uniform-logo {
  right: 16px !important;
  top: 16px !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
}

.team-page-hero .mursaleen-hero-photo { object-position: center 42% !important; }
.premium-team-grid .team-card:first-child img { object-position: center 68% !important; }
body[data-member="mursaleen"] #memberPhoto { object-position: center 55% !important; }

.team-card:first-child {
  border-color: rgba(47,168,165,.42);
  box-shadow: 0 28px 72px rgba(10,92,91,.16);
}

.roots-group-official-section {
  background: radial-gradient(circle at 12% 15%, rgba(196,255,224,.65), transparent 28%), linear-gradient(135deg, #f5fffb, #ffffed);
}

.roots-group-official-card {
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  align-items: center;
  gap: clamp(38px, 7vw, 100px);
  padding: clamp(34px, 5vw, 74px);
  border: 1px solid rgba(47,168,165,.28);
  border-radius: 38px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 34px 90px rgba(10,92,91,.13);
}

.roots-group-official-logo {
  display: grid;
  place-items: center;
  min-height: 300px;
  padding: 34px;
  border-radius: 30px;
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(47,168,165,.16), 0 24px 60px rgba(10,92,91,.1);
}

.roots-group-official-logo img { width: min(100%, 520px); height: auto; object-fit: contain; }

.company-item:first-child .company-mini {
  padding: 5px;
  object-fit: contain;
  background: #fff;
}

.roots-group-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 26px 0;
}

.roots-group-facts span {
  display: grid;
  gap: 3px;
  min-width: 130px;
  padding: 15px 18px;
  border-radius: 18px;
  background: #effff8;
  border: 1px solid rgba(47,168,165,.2);
}

.roots-group-facts strong { font-size: 20px; }
.roots-group-facts small { color: var(--muted); font-weight: 700; }

@media (max-width: 760px) {
  .roots-group-official-card { grid-template-columns: 1fr; padding: 24px; border-radius: 28px; }
  .roots-group-official-logo { min-height: 220px; padding: 24px; }
  .roots-group-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .roots-group-facts span { min-width: 0; padding: 12px 8px; text-align: center; }
  .roots-group-facts strong { font-size: 16px; }
  .roots-group-facts small { font-size: 9px; }
}

/* Final slideshow brand position: transparent mark in the media corner. */
.hero-person .uniform-logo {
  left: auto !important;
  right: 18px !important;
  top: 18px !important;
  width: 112px !important;
  height: 72px !important;
  transform: none !important;
  opacity: 1 !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  pointer-events: none !important;
  z-index: 8 !important;
  filter: drop-shadow(0 3px 4px rgba(255,255,255,.88)) drop-shadow(0 7px 12px rgba(0,0,0,.38)) !important;
}

.hero-person .uniform-logo img {
  width: 108px !important;
  height: 68px !important;
  object-fit: contain !important;
}

@media (max-width: 680px) {
  .hero-person .uniform-logo {
    right: 12px !important;
    top: 12px !important;
    width: 86px !important;
    height: 56px !important;
  }
  .hero-person .uniform-logo img { width: 82px !important; height: 52px !important; }
}

/* Mobile navigation uses one scroll surface so the services list cannot trap touch scrolling. */
@media (max-width: 1120px) {
  .menu.open {
    max-height: calc(100dvh - 122px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .menu .nav-dropdown,
  .menu .service-menu {
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    scrollbar-gutter: auto;
    touch-action: pan-y;
  }
  .menu .nav-dropdown::before { display: none; }
}

@media (max-width: 680px) {
  .menu {
    left: 8px;
    right: 8px;
    padding: 10px;
  }
  .menu.open { max-height: calc(100dvh - 105px); }
  .service-menu { padding: 10px; }
  .nav-service-block { padding: 7px; }
}

/* Team directory and profile finishing. */
.premium-team-grid {
  align-items: stretch;
}
.premium-team-grid .team-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.premium-team-grid .team-card > div {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.premium-team-grid .team-card .btn {
  align-self: flex-start;
  margin-top: auto;
}
body[data-member] #memberSummary {
  color: var(--muted);
  font-size: 17px;
  line-height: 1.75;
}

@media (max-width: 680px) {
  .team-page-hero .premium-page-card {
    gap: 22px;
  }
  .team-page-hero h1 {
    font-size: clamp(36px, 11vw, 52px);
    line-height: .98;
  }
  .premium-team-grid .team-card img {
    height: 390px !important;
    object-position: center top !important;
  }
  .premium-team-grid .team-card:first-child img {
    object-position: center 64% !important;
  }
  body[data-member] .split {
    gap: 24px;
  }
  body[data-member] #memberSummary {
    font-size: 16px;
    line-height: 1.65;
  }
}

/* Cleaning personnel supply detail page. */
.staffing-detail-hero .premium-page-card {
  overflow: hidden;
}

.staffing-detail-hero .page-hero-media img {
  object-position: center;
}

.staffing-visual-section {
  background: linear-gradient(180deg, #fff, #f4fffb);
}

.staffing-gallery {
  display: grid;
  grid-template-columns: 1.35fr .85fr;
  grid-template-rows: repeat(2, minmax(220px, 1fr));
  gap: 20px;
}

.staffing-gallery figure {
  position: relative;
  min-height: 260px;
  margin: 0;
  overflow: hidden;
  border-radius: 28px;
  box-shadow: 0 24px 60px rgba(10,92,91,.13);
}

.staffing-gallery-main {
  grid-row: 1 / 3;
}

.staffing-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.8,.2,1);
}

.staffing-gallery figure:hover img {
  transform: scale(1.04);
}

.staffing-gallery figcaption {
  position: absolute;
  left: 18px;
  bottom: 18px;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  color: #fff;
  background: rgba(3,24,22,.72);
  backdrop-filter: blur(12px);
  font-weight: 800;
}

@media (max-width: 760px) {
  .staffing-gallery {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }
  .staffing-gallery-main { grid-row: auto; }
  .staffing-gallery figure { min-height: 300px; }
}

/* Keep the premium proof overrides after the legacy component rules. */
.proof-section .proof-split {
  gap: clamp(48px, 7vw, 108px);
}

.proof-section .stat-orbs {
  gap: 14px;
}

.proof-section .stat-orbs span {
  width: 132px;
  height: 132px;
  gap: 5px;
  padding: 22px 14px 18px;
  border-color: rgba(47,168,165,.28);
  box-shadow: inset 0 0 0 8px rgba(255,255,255,.52), 0 22px 50px rgba(10,92,91,.13);
}

.proof-section .proof-slideshow {
  min-height: clamp(460px, 39vw, 610px);
  border: 12px solid rgba(255,255,255,.82);
  border-radius: 34px;
  background: #0a2928;
  box-shadow: 0 34px 90px rgba(10,92,91,.18), 0 8px 24px rgba(0,0,0,.08);
}

@media (max-width: 680px) {
  .proof-section .proof-split { gap: 34px; }
  .proof-section .stat-orbs { gap: 9px; }
  .proof-section .stat-orbs span { width: 102px; height: 102px; padding: 14px 8px; }
  .proof-section .proof-slideshow { min-height: 430px; border-width: 8px; border-radius: 26px; }
}

/* Final site-wide responsive safeguards for every route. */
img,
video {
  max-width: 100%;
}

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

@media (max-width: 900px) {
  .split,
  .reverse-split,
  .company-hero-grid,
  .premium-page-card,
  .industry-detail-hero-card,
  .testimonial-showcase {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .reverse-split > :first-child {
    order: 2;
  }

  .page-card,
  .premium-page-card,
  .company-copy {
    padding: clamp(30px, 7vw, 52px) !important;
  }

  .page-hero-media,
  .company-stage,
  .hero-person,
  .page-hero-media img,
  .company-stage img,
  .company-stage video {
    width: 100% !important;
    min-width: 0 !important;
  }

  .service-grid,
  .industry-overview-grid,
  .company-service-grid,
  .process-grid,
  .detail-grid,
  .why-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .cta-panel {
    align-items: flex-start;
    gap: 26px;
  }
}

@media (max-width: 600px) {
  .container {
    width: min(100% - 28px, var(--container));
  }

  .section,
  .page-hero {
    padding-top: 58px;
    padding-bottom: 58px;
  }

  .service-grid,
  .industry-overview-grid,
  .company-service-grid,
  .process-grid,
  .detail-grid,
  .why-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .page-card,
  .premium-page-card,
  .company-copy {
    padding: 28px 20px !important;
    border-radius: 26px !important;
  }

  .company-actions,
  .cta-panel,
  .hero-mini-menu {
    flex-direction: column;
    align-items: stretch;
  }

  .company-actions .btn,
  .cta-panel .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .image-card img,
  .page-hero-media img {
    min-height: 280px !important;
  }

  .group-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  .group-metrics span {
    min-width: 0;
    padding: 14px 8px;
  }

  .group-metrics strong {
    font-size: clamp(17px, 5vw, 23px);
  }

  .group-metrics small {
    font-size: 9px;
  }
}

/* Premium proof story: animated typography, orbit stats and an infinite 3-image reel. */
.proof-section {
  isolation: isolate;
}

.proof-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .28;
  background-image: radial-gradient(rgba(10,92,91,.22) .7px, transparent .7px);
  background-size: 22px 22px;
  mask-image: linear-gradient(90deg, #000, transparent 72%);
}

.proof-split {
  position: relative;
  z-index: 1;
  align-items: center;
  gap: clamp(48px, 7vw, 108px);
}

.proof-copy h2 span {
  position: relative;
  display: inline;
  color: transparent;
  background: linear-gradient(100deg, #050505 10%, #0a5c5b 46%, #2fa8a5 58%, #050505 88%);
  background-size: 230% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  animation: proofShimmer 6s ease-in-out infinite;
}

.proof-copy p {
  max-width: 780px;
}

@keyframes proofShimmer {
  0%, 25% { background-position: 100% 50%; }
  70%, 100% { background-position: 0 50%; }
}

.stat-orbs {
  gap: 14px;
  align-items: center;
}

.stat-orbs span {
  position: relative;
  isolation: isolate;
  width: 132px;
  height: 132px;
  gap: 5px;
  overflow: visible;
  border: 1px solid rgba(47,168,165,.28);
  box-shadow: inset 0 0 0 8px rgba(255,255,255,.52), 0 22px 50px rgba(10,92,91,.13);
}

.stat-orbs span::before,
.stat-orbs span::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
}

.stat-orbs span::before {
  inset: -7px;
  border: 1px dashed rgba(10,92,91,.32);
  animation: statRing 14s linear infinite;
}

.stat-orbs span::after {
  width: 11px;
  height: 11px;
  top: -8px;
  left: 50%;
  background: #2fa8a5;
  box-shadow: 0 0 0 5px rgba(47,168,165,.13), 0 0 22px rgba(47,168,165,.72);
}

.stat-orbs strong {
  font-size: 22px;
  line-height: 1;
  letter-spacing: -.04em;
}

.stat-orbs small {
  font-size: 12px;
  line-height: 1.2;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

@keyframes statRing { to { transform: rotate(360deg); } }

.proof-slideshow {
  position: relative;
  min-height: clamp(460px, 39vw, 610px);
  overflow: hidden;
  border: 12px solid rgba(255,255,255,.82);
  border-radius: 34px;
  background: #0a2928;
  box-shadow: 0 34px 90px rgba(10,92,91,.18), 0 8px 24px rgba(0,0,0,.08);
}

.proof-slideshow::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 48%, rgba(3,24,22,.72) 100%);
}

.proof-slides,
.proof-slide {
  position: absolute;
  inset: 0;
  margin: 0;
}

.proof-slide {
  opacity: 0;
  transform: scale(1.08);
  animation: proofReel 18s cubic-bezier(.45,0,.2,1) infinite;
}

.proof-slide:nth-child(2) { animation-delay: 6s; }
.proof-slide:nth-child(3) { animation-delay: 12s; }

.proof-slideshow .proof-slide img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.06) contrast(1.04);
}

@keyframes proofReel {
  0% { opacity: 0; transform: scale(1.08); }
  5%, 29% { opacity: 1; transform: scale(1); }
  34%, 100% { opacity: 0; transform: scale(.98); }
}

.proof-caption {
  position: absolute;
  z-index: 4;
  left: 22px;
  right: 22px;
  bottom: 22px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 10px;
  color: #fff;
}

.proof-caption strong { font-size: 19px; }
.proof-caption small { grid-column: 2; color: rgba(255,255,255,.74); }

.live-dot {
  grid-row: 1 / 3;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #eaff8f;
  box-shadow: 0 0 0 7px rgba(234,255,143,.14), 0 0 24px #eaff8f;
  animation: livePulse 1.7s ease-out infinite;
}

@keyframes livePulse { 50% { transform: scale(.72); opacity: .72; } }

.proof-progress {
  position: absolute;
  z-index: 4;
  right: 22px;
  top: 22px;
  display: flex;
  gap: 6px;
}

.proof-progress i {
  width: 28px;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.34);
}

.proof-progress i::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #eaff8f;
  transform: scaleX(0);
  transform-origin: left;
  animation: proofBar 18s linear infinite;
}

.proof-progress i:nth-child(2)::after { animation-delay: 6s; }
.proof-progress i:nth-child(3)::after { animation-delay: 12s; }

@keyframes proofBar {
  0% { transform: scaleX(0); }
  33.2% { transform: scaleX(1); }
  33.3%, 100% { transform: scaleX(0); }
}

@media (max-width: 680px) {
  .proof-split { gap: 34px; }
  .proof-copy h2 { font-size: clamp(42px, 13vw, 62px); }
  .stat-orbs { justify-content: center; gap: 9px; }
  .stat-orbs span { width: 102px; height: 102px; padding: 14px 8px; }
  .stat-orbs strong { font-size: 18px; }
  .stat-orbs small { font-size: 10px; }
  .proof-slideshow { min-height: 430px; border-width: 8px; border-radius: 26px; }
  .proof-caption { left: 16px; right: 16px; bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .proof-copy h2,
  .proof-copy h2 span,
  .proof-copy p,
  .stat-orbs span,
  .stat-orbs span::before,
  .proof-visual,
  .live-dot,
  .proof-progress i::after { animation: none !important; }
  .proof-slide { animation: none; opacity: 0; transform: none; }
  .proof-slide:first-child { opacity: 1; }
}

/* Sector overview and sector detail experience. */
.industries-page-hero .premium-page-card,
.industry-detail-hero-card {
  overflow: hidden;
}

.industries-page-hero .page-hero-media img,
.industry-detail-hero-card .industry-hero-media img {
  object-position: center;
}

.industry-overview-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
}

.industry-overview-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 560px;
  border: 1px solid rgba(47,168,165,.2);
  border-radius: 34px;
  background: linear-gradient(145deg, #fff, #f1fffa);
  box-shadow: 0 26px 72px rgba(10,92,91,.1);
  transition: transform .3s ease, box-shadow .3s ease;
}

.industry-overview-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 36px 90px rgba(10,92,91,.17);
}

.industry-overview-card img {
  display: block;
  width: 100%;
  height: 285px;
  object-fit: cover;
}

.industry-overview-card > div {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 30px;
}

.industry-overview-card small {
  font-weight: 900;
  color: var(--teal);
}

.industry-overview-card h3 {
  margin: 14px 0 12px;
  font-size: clamp(27px, 2.2vw, 38px);
}

.industry-overview-card p {
  margin: 0 0 26px;
  color: var(--muted);
  line-height: 1.6;
}

.industry-overview-card .btn {
  margin-top: auto;
}

.industry-service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.industry-service-grid .info-card {
  min-height: 285px;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(232,255,247,.9));
}

.industry-media-stack {
  display: grid;
  gap: 20px;
}

.industry-media-stack .image-card,
.industry-media-stack .image-card img {
  min-height: 350px;
}

.industry-media-stack .video-card {
  min-height: 330px;
}

.industry-experience {
  position: relative;
  overflow: hidden;
}

.industry-experience::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -180px;
  top: -160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(205,255,127,.4), transparent 70%);
  pointer-events: none;
}

@media (max-width: 1120px) {
  .industry-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .industry-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .industry-overview-grid,
  .industry-service-grid {
    grid-template-columns: 1fr !important;
  }
  .industry-overview-card {
    min-height: 520px;
  }
  .industry-overview-card img {
    height: 260px;
  }
  .industry-overview-card > div {
    padding: 24px;
  }
  .industry-detail-hero-card {
    grid-template-columns: 1fr !important;
  }
  .industry-detail-hero-card .industry-hero-media,
  .industry-detail-hero-card .industry-hero-media img {
    min-height: 300px !important;
    height: 300px !important;
  }
  .industry-service-grid .info-card {
    min-height: 230px;
  }
}

/* Team page mobile lock: file:// previews must not collapse or hide content. */
@media (max-width: 780px) {
  body:has(.team-page-hero) main,
  .team-page-hero,
  .team-directory-section,
  .team-feature-section,
  .team-page-hero .premium-page-card,
  .team-page-hero .premium-page-card > div,
  .team-directory-section .section-head,
  .premium-team-grid,
  .premium-team-grid .team-card {
    height: auto !important;
    max-height: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body:has(.team-page-hero) main {
    display: block !important;
    overflow: visible !important;
  }

  .team-page-hero {
    display: block !important;
    padding: 28px 0 46px !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .team-page-hero .premium-page-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    min-height: 0 !important;
    padding: 28px 22px !important;
    transform: none !important;
    animation: none !important;
  }

  .team-page-hero .premium-page-card > div:first-child,
  .team-page-hero .crumb,
  .team-page-hero .eyebrow,
  .team-page-hero h1,
  .team-page-hero p {
    display: block !important;
    transform: none !important;
    animation: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .team-page-hero h1 {
    font-size: clamp(34px, 10vw, 48px) !important;
    line-height: 1.04 !important;
  }

  .team-page-hero .page-hero-media,
  .team-page-hero .page-hero-media.reveal,
  .team-page-hero .page-hero-media.reveal.in-view {
    display: block !important;
    min-height: 300px !important;
    height: 300px !important;
    overflow: hidden !important;
    transform: none !important;
    animation: none !important;
  }

  .team-page-hero .page-hero-media img {
    display: block !important;
    width: 100% !important;
    height: 300px !important;
    min-height: 300px !important;
    object-fit: cover !important;
    object-position: center top !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .team-directory-section {
    display: block !important;
    min-height: 0 !important;
    padding: 54px 0 !important;
    overflow: visible !important;
  }

  .team-directory-section .section-head,
  .premium-team-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .premium-team-grid .team-card,
  .premium-team-grid .team-card.reveal,
  .premium-team-grid .team-card.reveal.in-view {
    display: block !important;
    min-height: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    animation: none !important;
  }

  .premium-team-grid .team-card img {
    display: block !important;
    width: 100% !important;
    height: 360px !important;
    min-height: 360px !important;
    object-fit: cover !important;
    object-position: center top !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body:has(.team-page-hero) .section,
  body:has(.team-page-hero) .section.reveal,
  body:has(.team-page-hero) .section.reveal.in-view {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Mobile media reliability: team photos must never stay hidden behind reveal motion. */
@media (max-width: 780px) {
  .team-card,
  .team-card.reveal,
  .team-card.reveal.in-view,
  .team-page-hero .page-hero-media,
  .team-page-hero .page-hero-media.reveal {
    opacity: 1 !important;
    transform: none !important;
  }

  .premium-team-grid .team-card img,
  .team-page-hero .page-hero-media img {
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
  }
}

/* Premium inner pages: team, about and contact. */
.soft-section {
  background:
    radial-gradient(circle at 12% 14%, rgba(207, 255, 239, .85), transparent 30%),
    radial-gradient(circle at 88% 18%, rgba(239, 255, 176, .7), transparent 30%),
    linear-gradient(135deg, #fbfffb, #f3fff9);
}

.premium-page-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  background:
    radial-gradient(circle at 18% 18%, rgba(198, 255, 235, .72), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(246,255,250,.9)) !important;
}

.premium-page-card h1 {
  animation: heroLineZigzag 7s ease-in-out infinite;
}

.page-hero-media {
  position: relative;
  border: 14px solid rgba(255,255,255,.78);
  border-radius: 42px;
  overflow: hidden;
  box-shadow: 0 34px 90px rgba(0, 92, 88, .16);
  min-height: 430px;
  transform-style: preserve-3d;
  animation: testimonialTilt 8s ease-in-out infinite;
}

.page-hero-media img {
  width: 100%;
  height: 100%;
  min-height: 430px;
  object-fit: cover;
  object-position: center;
  display: block;
}

.team-directory-section {
  padding-top: 70px;
}

.premium-team-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.premium-team-grid .team-card {
  border-radius: 32px;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,255,251,.92));
  border: 1px solid rgba(0, 139, 132, .18);
  box-shadow: 0 24px 70px rgba(0, 92, 88, .12);
  transform-style: preserve-3d;
}

.premium-team-grid .team-card:hover {
  transform: translateY(-8px) rotateX(2deg) rotateY(-2deg);
  box-shadow: 0 34px 90px rgba(0, 92, 88, .18);
}

.premium-team-grid .team-card img {
  height: 380px;
  object-fit: cover;
  object-position: center top;
  background: #eef8f5;
}

.premium-team-grid .team-card div {
  padding: 28px;
}

.premium-team-grid .team-card h3 {
  font-size: clamp(24px, 2vw, 32px);
}

.premium-team-grid .team-card p {
  color: #506769;
  line-height: 1.55;
}

.process-grid,
.support-grid,
.mini-service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.support-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.process-list {
  display: grid;
  gap: 16px;
  margin-top: 26px;
}

.process-list div {
  padding: 22px;
  border: 1px solid rgba(0, 139, 132, .16);
  border-radius: 24px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 16px 44px rgba(0, 92, 88, .08);
}

.process-list strong,
.process-list span {
  display: block;
}

.process-list span {
  margin-top: 6px;
  color: var(--muted);
}

.about-stat-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.about-stat-board div {
  min-height: 180px;
  padding: 28px;
  border-radius: 36px;
  background: linear-gradient(145deg, #fff, #effff8);
  border: 1px solid rgba(0, 139, 132, .16);
  box-shadow: 0 24px 70px rgba(0, 92, 88, .1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  animation: cardFloatA 7s ease-in-out infinite;
}

.about-stat-board div:nth-child(2n) {
  background: linear-gradient(145deg, #050807, #173b38);
  color: #fff;
  animation-name: cardFloatB;
}

.about-stat-board strong {
  font-size: clamp(38px, 4vw, 70px);
  line-height: .95;
}

.about-stat-board span {
  color: inherit;
  opacity: .76;
}

.sector-pill-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}

.sector-pill-grid a {
  padding: 22px 30px;
  border: 1px solid rgba(0, 139, 132, .18);
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  color: #041615;
  font-weight: 900;
  box-shadow: 0 18px 52px rgba(0, 92, 88, .08);
  transition: transform .35s ease, background .35s ease;
}

.sector-pill-grid a:hover {
  transform: translateY(-6px);
  background: #eaffab;
}

.reverse-split {
  align-items: center;
}

.cta-panel-section {
  padding-top: 40px;
}

.cta-panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
  padding: clamp(34px, 5vw, 72px);
  border: 1px solid rgba(0, 139, 132, .22);
  border-radius: 42px;
  background:
    radial-gradient(circle at 16% 20%, rgba(201,255,235,.82), transparent 32%),
    radial-gradient(circle at 82% 75%, rgba(239,255,176,.8), transparent 32%),
    #fff;
  box-shadow: 0 30px 90px rgba(0, 92, 88, .1);
}

.cta-panel h2 {
  margin: 8px 0 12px;
  font-size: clamp(36px, 5vw, 78px);
  line-height: .98;
}

.contact-map-hero {
  padding: clamp(34px, 5vw, 72px) 0 70px;
  background:
    radial-gradient(circle at 12% 18%, rgba(205,255,238,.9), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(239,255,176,.76), transparent 34%),
    linear-gradient(135deg, #fbfffb, #f4fff9);
}

.contact-map-layout {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(360px, .9fr);
  gap: clamp(28px, 5vw, 82px);
  align-items: center;
}

.map-card {
  position: relative;
  min-height: 650px;
  border-radius: 42px;
  overflow: hidden;
  border: 14px solid rgba(255,255,255,.8);
  box-shadow: 0 34px 100px rgba(0, 92, 88, .15);
  background: #eaf8f4;
}

.map-card iframe {
  width: 100%;
  height: 650px;
  border: 0;
  display: block;
}

.map-badge {
  position: absolute;
  left: 26px;
  bottom: 26px;
  max-width: 290px;
  padding: 22px 24px;
  border-radius: 22px;
  background: #061d38;
  color: #fff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .22);
}

.map-badge strong,
.map-badge span {
  display: block;
}

.map-badge span {
  margin-top: 8px;
  color: rgba(255,255,255,.86);
}

.contact-copy h1 {
  font-size: clamp(48px, 6vw, 96px);
  line-height: .95;
  margin: 14px 0 24px;
  animation: heroLineZigzag 7s ease-in-out infinite;
}

.contact-copy p {
  color: var(--muted);
  font-size: 22px;
  line-height: 1.55;
}

.contact-lines {
  margin-top: 44px;
  display: grid;
  gap: 24px;
}

.contact-lines div {
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(0, 92, 88, .16);
}

.contact-lines small {
  display: block;
  color: #987313;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.contact-lines strong,
.contact-lines a {
  color: #041615;
  font-size: 22px;
}

.premium-contact-panel {
  grid-template-columns: 1.05fr .85fr;
  align-items: stretch;
}

.quote-form,
.contact-side-card {
  padding: clamp(24px, 4vw, 46px);
  border: 1px solid rgba(0, 139, 132, .18);
  border-radius: 34px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 24px 80px rgba(0, 92, 88, .1);
}

.quote-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quote-form textarea,
.quote-form button {
  grid-column: 1 / -1;
}

.contact-side-card h3 {
  margin: 12px 0 18px;
  font-size: clamp(30px, 3vw, 48px);
  line-height: 1;
}

@media (max-width: 1180px) {
  .premium-team-grid,
  .process-grid,
  .mini-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .premium-page-card,
  .contact-map-layout,
  .premium-contact-panel {
    grid-template-columns: 1fr;
  }

  .map-card,
  .map-card iframe {
    min-height: 520px;
    height: 520px;
  }
}

@media (max-width: 720px) {
  .premium-page-card {
    gap: 22px;
  }

  .page-hero-media,
  .page-hero-media img {
    min-height: 320px;
    border-radius: 30px;
  }

  .premium-team-grid,
  .process-grid,
  .support-grid,
  .mini-service-grid,
  .about-stat-board,
  .quote-form {
    grid-template-columns: 1fr;
  }

  .premium-team-grid .team-card img {
    height: 420px;
  }

  .cta-panel {
    grid-template-columns: 1fr;
  }

  .contact-map-hero {
    padding-top: 24px;
  }

  .map-card,
  .map-card iframe {
    min-height: 420px;
    height: 420px;
    border-radius: 30px;
  }

  .map-badge {
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .premium-team-grid .team-card img {
    height: 360px;
  }

  .premium-team-grid .team-card div {
    padding: 22px;
  }
}

/* Final testimonial marquee lock: keep this after older testimonial styles. */
.roots-testimonial {
  padding: 110px 0 130px !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(190, 255, 237, .9), transparent 35%),
    radial-gradient(circle at 82% 18%, rgba(238, 255, 164, .75), transparent 34%),
    linear-gradient(115deg, #f5fffb, #f2fff7 52%, #fffdf0) !important;
  overflow: hidden !important;
}

.roots-testimonial .testimonial-showcase {
  display: block !important;
  max-width: 1600px !important;
  perspective: none !important;
}

.roots-testimonial .testimonial-head {
  max-width: 900px !important;
  margin: 0 auto 58px !important;
  text-align: center !important;
}

.roots-testimonial .testimonial-head h2 {
  font-size: clamp(42px, 5vw, 86px) !important;
  line-height: .98 !important;
  margin: 12px 0 20px !important;
  animation: heroLineZigzag 7s ease-in-out infinite !important;
}

.roots-testimonial .review-marquee {
  width: 100% !important;
  overflow: hidden !important;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent) !important;
}

.roots-testimonial .review-track {
  display: flex !important;
  align-items: stretch !important;
  gap: 34px !important;
  width: max-content !important;
  animation: reviewScroll 38s linear infinite !important;
}

.roots-testimonial .review-marquee:hover .review-track {
  animation-play-state: paused !important;
}

.roots-testimonial .scroll-review-card {
  position: relative !important;
  flex: 0 0 430px !important;
  width: 430px !important;
  min-height: 390px !important;
  padding: 48px 42px 38px !important;
  border: 1px solid rgba(0, 139, 132, .16) !important;
  border-radius: 42px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(241,255,250,.9)) !important;
  box-shadow: 0 30px 80px rgba(0, 92, 88, .12) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  overflow: hidden !important;
  transform: translateZ(0) !important;
  animation: testimonialFloat 6s ease-in-out infinite !important;
}

.roots-testimonial .scroll-review-card:nth-child(2n) {
  background: linear-gradient(145deg, #fff, #f3fffb) !important;
  animation-delay: .5s !important;
}

.roots-testimonial .scroll-review-card:nth-child(3n) {
  background: linear-gradient(145deg, #fff, #fff7fb) !important;
  animation-delay: 1s !important;
}

.roots-testimonial .scroll-review-card:nth-child(4n) {
  background: linear-gradient(145deg, #fff, #f4eeff) !important;
  animation-delay: 1.4s !important;
}

.roots-testimonial .scroll-review-card .stars {
  color: #c9ff12 !important;
  font-size: 30px !important;
  letter-spacing: 5px !important;
  margin-bottom: 24px !important;
  text-shadow: 0 8px 24px rgba(142, 201, 0, .2) !important;
}

.roots-testimonial .scroll-review-card p {
  margin: 0 0 34px !important;
  color: #334f50 !important;
  font-size: 23px !important;
  line-height: 1.55 !important;
}

.roots-testimonial .review-author {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.roots-testimonial .review-author img {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  max-width: 58px !important;
  max-height: 58px !important;
  aspect-ratio: 1 / 1 !important;
  border: 3px solid #fff !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  box-shadow: 0 10px 30px rgba(0, 92, 88, .18) !important;
}

.roots-testimonial .review-author span,
.roots-testimonial .review-author strong,
.roots-testimonial .review-author small {
  display: block !important;
}

.roots-testimonial .review-author strong {
  color: #041615 !important;
  font-size: 18px !important;
}

.roots-testimonial .review-author small {
  color: #5d7071 !important;
  font-size: 16px !important;
}

@media (max-width: 780px) {
  .roots-testimonial {
    padding: 74px 0 86px !important;
  }

  .roots-testimonial .review-track {
    gap: 18px !important;
    animation: reviewScroll 28s linear infinite !important;
  }

  .roots-testimonial .scroll-review-card {
    flex: 0 0 min(82vw, 390px) !important;
    width: min(82vw, 390px) !important;
    min-height: 350px !important;
    padding: 34px 28px !important;
  }

  .roots-testimonial .scroll-review-card p {
    font-size: 20px !important;
  }
}

/* Testimonial section rebuilt to match the supplied scrolling-card reference. */
.roots-testimonial {
  padding: 110px 0 130px;
  background:
    radial-gradient(circle at 18% 8%, rgba(234,255,248,.92), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(239,255,176,.62), transparent 28%),
    linear-gradient(180deg, #f6fffd 0%, #eef9f8 100%) !important;
}

.roots-testimonial::before {
  display: none !important;
}

.roots-testimonial .testimonial-showcase {
  display: block !important;
  perspective: none;
}

.testimonial-head {
  max-width: 900px;
  margin: 0 auto 58px;
  text-align: center;
}

.testimonial-head h2 {
  margin: 12px 0 18px;
  font-size: clamp(42px, 5.6vw, 92px);
  line-height: .96;
  letter-spacing: 0;
  animation: heroLineZigzag 7.2s ease-in-out infinite;
}

.testimonial-head p {
  max-width: 740px;
  margin: 0 auto;
  color: var(--muted);
  font-size: clamp(18px, 1.7vw, 24px);
}

.review-marquee {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 16px 0 26px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 9%, #000 91%, transparent 100%);
}

.review-track {
  display: flex;
  gap: 34px;
  width: max-content;
  animation: reviewScroll 38s linear infinite;
}

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

.scroll-review-card {
  position: relative;
  flex: 0 0 430px;
  min-height: 390px;
  padding: 48px 42px 38px;
  border-radius: 42px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(47,168,165,.18);
  box-shadow: 0 28px 80px rgba(10,92,91,.1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transform-style: preserve-3d;
  animation: reviewFloat 7s ease-in-out infinite;
}

.scroll-review-card:nth-child(2n) {
  background: linear-gradient(145deg, #fff, #f3fffb);
  animation-delay: .5s;
}

.scroll-review-card:nth-child(3n) {
  background: linear-gradient(145deg, #fff, #fff7fb);
  animation-delay: 1s;
}

.scroll-review-card:nth-child(4n) {
  background: linear-gradient(145deg, #fff, #f4eeff);
  animation-delay: 1.4s;
}

.scroll-review-card::before,
.scroll-review-card::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  height: 20px;
  background: radial-gradient(circle at 10px 10px, transparent 10px, rgba(255,255,255,.95) 11px) 0 0 / 38px 20px repeat-x;
  pointer-events: none;
}

.scroll-review-card::before {
  top: -1px;
}

.scroll-review-card::after {
  bottom: -1px;
  transform: rotate(180deg);
}

.scroll-review-card .stars {
  color: #f7c600;
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: 26px;
  text-shadow: 0 8px 20px rgba(247,198,0,.18);
}

.scroll-review-card p {
  margin: 0 0 34px;
  font-size: 23px;
  line-height: 1.45;
  color: #0b1717;
}

.review-author {
  display: flex;
  align-items: center;
  gap: 16px;
}

.review-author img {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  object-fit: cover;
  border: 4px solid #f0faf8;
}

.review-author strong,
.review-author small {
  display: block;
}

.review-author strong {
  font-size: 18px;
}

.review-author small {
  color: var(--muted);
  font-size: 16px;
}

@keyframes reviewScroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 17px)); }
}

@keyframes reviewFloat {
  0%, 100% { transform: translateY(0) rotateX(0) rotateY(0); }
  50% { transform: translateY(-10px) rotateX(1deg) rotateY(-1.2deg); }
}

@media (max-width: 780px) {
  .roots-testimonial {
    padding: 74px 0 86px;
  }
  .review-marquee {
    overflow-x: auto;
    mask-image: none;
    scroll-snap-type: x mandatory;
  }
  .review-track {
    animation: none;
    width: auto;
    padding: 0 18px;
  }
  .scroll-review-card {
    flex-basis: min(82vw, 390px);
    min-height: 350px;
    padding: 38px 30px 32px;
    scroll-snap-align: center;
  }
  .scroll-review-card p {
    font-size: 20px;
  }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  background:
    radial-gradient(circle at 8% 8%, rgba(166, 255, 218, .7), transparent 24%),
    radial-gradient(circle at 92% 4%, rgba(249, 255, 188, .82), transparent 24%),
    linear-gradient(135deg, #eafff7 0%, #f8fff0 58%, #e5fbff 100%);
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
.container { width: min(var(--max), calc(100% - 56px)); margin: 0 auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  padding: 18px 0 10px;
  background: linear-gradient(180deg, rgba(238, 255, 249, .96), rgba(238, 255, 249, .78));
  backdrop-filter: blur(18px);
}

.nav-shell {
  min-height: 86px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px 20px;
  background: rgba(255, 255, 255, .42);
  box-shadow: 0 20px 55px rgba(18, 119, 118, .08);
  position: relative;
}

.nav-left, .nav-right, .menu {
  display: flex;
  align-items: center;
  gap: 16px;
}
.nav-right { justify-content: flex-end; }
.menu { justify-content: center; gap: 8px; }
.menu a, .menu button, .pill-link {
  border: 0;
  background: transparent;
  padding: 13px 18px;
  border-radius: 999px;
  color: #101010;
  font-weight: 700;
  cursor: pointer;
}
.menu a:hover, .menu button:hover, .menu .active {
  background: #fff;
  box-shadow: 0 16px 34px rgba(20, 120, 118, .12);
}
.menu-group {
  position: relative;
}
.menu-trigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.menu-trigger span {
  font-size: 13px;
  transform: translateY(1px);
}
.nav-dropdown {
  position: absolute;
  top: calc(100% + 16px);
  left: 50%;
  width: min(760px, 84vw);
  max-height: min(72vh, 760px);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.96);
  box-shadow: 0 34px 90px rgba(10, 92, 91, .18);
  opacity: 0;
  transform: translate(-50%, -8px);
  pointer-events: none;
  transition: opacity .24s ease, transform .24s ease;
}
.nav-dropdown::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -16px;
  height: 16px;
}
.menu-group:hover .nav-dropdown,
.menu-group:focus-within .nav-dropdown,
.menu-group.open .nav-dropdown {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}
.service-menu {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.compact-menu {
  width: min(560px, 84vw);
  display: grid;
  gap: 12px;
}
.nav-feature,
.nav-sub-links a {
  border-radius: 16px !important;
  padding: 14px 16px !important;
  background: linear-gradient(135deg, rgba(238,255,249,.96), rgba(255,255,236,.9)) !important;
  border: 1px solid rgba(47,168,165,.18) !important;
  box-shadow: none !important;
}
.nav-feature {
  display: block;
}
.nav-feature strong,
.nav-feature span {
  display: block;
}
.nav-feature strong {
  font-size: 17px;
  color: var(--ink);
}
.nav-feature span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}
.nav-service-block {
  border-radius: 18px;
  border: 1px solid rgba(47,168,165,.18);
  background: rgba(255,255,255,.7);
  padding: 8px;
}
.nav-sub-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}
.nav-sub-links a {
  font-size: 12px;
  font-weight: 750;
  color: var(--teal-dark);
  background: #fff !important;
}

.brand-wrap { position: relative; display: flex; align-items: center; gap: 12px; }
.brand-logo {
  width: 154px;
  height: 72px;
  display: grid;
  place-items: center;
  overflow: hidden;
  flex: 0 0 auto;
}
.brand-logo img {
  width: 142px;
  height: 64px;
  object-fit: contain;
  filter: drop-shadow(0 14px 20px rgba(0,0,0,.12));
}
.company-brand-lockup {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 12px 0 22px;
}
.company-brand-lockup img {
  width: min(220px, 48%);
  max-height: 92px;
  object-fit: contain;
  object-position: left center;
}
.company-brand-lockup.hmg img { max-height: 104px; }
.roots-services-lockup {
  width: min(100%, 250px);
  padding: 10px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(47,168,165,.16);
}
.roots-services-lockup img {
  width: 100%;
  max-height: 220px;
  object-fit: contain;
  filter: none;
}

.company-item:nth-child(2) .company-mini {
  padding: 3px;
  object-fit: contain;
  background: #fff;
}
#memberSummary p { margin: 0 0 16px; }
.company-toggle {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(7, 93, 97, .22);
  background: rgba(255,255,255,.56);
  cursor: pointer;
  font-weight: 900;
}
.company-panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 390px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow);
  overflow: hidden;
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition: .22s ease;
}
.brand-wrap.open .company-panel {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.brand-wrap.open .company-toggle {
  background: #fff;
  box-shadow: 0 12px 28px rgba(10,92,91,.14);
}
.company-item {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border-bottom: 1px solid rgba(47,168,165,.16);
}
.company-item:last-child { border-bottom: 0; }
.company-item:hover { background: linear-gradient(90deg, #f0fffb, #fbffe4); }
.company-mini {
  width: 92px;
  height: 58px;
  border-radius: 12px;
  object-fit: contain;
  padding: 8px;
  background: #fff;
  border: 1px solid rgba(47,168,165,.2);
}
.company-item strong { display: block; font-size: 17px; }
.company-item span { display: block; margin-top: 5px; color: var(--muted); font-size: 14px; }

.brand-title {
  text-align: center;
  line-height: .9;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 26px;
  letter-spacing: -.02em;
}
.brand-title span {
  display: block;
  font-style: italic;
  color: var(--teal);
  transform: translateY(-4px);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 999px;
  font-weight: 800;
  border: 1px solid transparent;
  cursor: pointer;
}
.btn-dark { background: #050505; color: #fff; box-shadow: 0 20px 38px rgba(0,0,0,.14); }
.btn-light { background: #fff; color: #050505; box-shadow: 0 18px 40px rgba(14, 120, 118, .1); }
.btn-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: #050505;
}

.hero-wrap { padding: 18px 0 72px; }
.hero-card {
  min-height: 750px;
  border: 1.5px solid var(--teal);
  border-radius: var(--radius);
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 50% 95%, rgba(47,168,165,.94) 0 19%, rgba(47,168,165,.26) 19.2% 36%, transparent 36.5%),
    radial-gradient(circle at 6% 18%, rgba(196,255,224,.82), transparent 28%),
    radial-gradient(circle at 88% 16%, rgba(250,255,194,.88), transparent 28%),
    linear-gradient(180deg, rgba(239,255,253,.96), rgba(224,249,251,.84));
}
.hero-inner {
  position: relative;
  min-height: 750px;
  padding: 34px 64px 0;
  display: grid;
  grid-template-rows: auto 1fr;
}
.hero-top { display: none; }
.hero-mini-menu { display: flex; gap: 10px; }
.hero-mini-menu a {
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 700;
}
.hero-mini-menu a:first-child { background: #fff; box-shadow: 0 14px 34px rgba(28, 130, 130, .1); }
.hero-content {
  position: relative;
  text-align: center;
  padding-top: 52px;
}
.hero h1 {
  max-width: 880px;
  margin: 0 auto;
  font-size: clamp(50px, 6.3vw, 92px);
  line-height: 1.02;
  letter-spacing: -.045em;
  font-weight: 800;
}
.hero-title {
  overflow: hidden;
}
.hero-title > span {
  display: block;
  animation: titleRise .8s cubic-bezier(.16, 1, .3, 1) both;
}
.hero-title > span:nth-child(2) { animation-delay: .12s; }
.hero-title > span:nth-child(3) { animation-delay: .24s; }
.hero-title em {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  color: var(--teal);
  font-weight: 500;
  position: relative;
}
.hero-title em::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: .04em;
  height: .16em;
  border-radius: 999px;
  background: rgba(47,168,165,.22);
  z-index: -1;
  transform-origin: left;
  animation: underlineSweep .95s .5s cubic-bezier(.16,1,.3,1) both;
}
@keyframes titleRise {
  from { opacity: 0; transform: translateY(38px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes underlineSweep {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}
.script-word {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  color: var(--teal);
  font-weight: 500;
}
.hero-sub {
  max-width: 780px;
  margin: 28px auto 0;
  font-size: 18px;
  line-height: 1.55;
}
.hero-person {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(760px, 58vw);
  height: min(560px, 42vw);
  border-radius: 999px 999px 34px 34px;
  overflow: hidden;
  border: 12px solid rgba(255,255,255,.58);
  background: rgba(47,168,165,.18);
  box-shadow: 0 34px 80px rgba(10, 92, 91, .18);
}
.hero-person img,
.hero-person video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.hero-slideshow {
  isolation: isolate;
}
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: scale(1.04);
  transition: opacity 1s ease, transform 5.2s ease;
}
.hero-slide.active {
  opacity: 1;
  transform: scale(1);
}
.slide-caption {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  z-index: 4;
  padding: 18px 22px;
  border-radius: 22px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.68);
  box-shadow: 0 18px 44px rgba(0,0,0,.12);
}
.slide-caption strong,
.slide-caption span {
  display: block;
}
.slide-caption strong {
  font-size: 22px;
}
.slide-caption span {
  color: var(--muted);
  margin-top: 5px;
}
.slide-dots {
  position: absolute;
  right: 28px;
  top: 28px;
  z-index: 5;
  display: flex;
  gap: 8px;
}
.slide-dots span {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(255,255,255,.7);
  transition: .25s ease;
}
.slide-dots span.active {
  width: 36px;
  background: var(--lime);
}
.uniform-logo {
  position: absolute;
  left: auto;
  right: 18px;
  top: 18px;
  width: 96px;
  height: 60px;
  border-radius: 16px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(47,168,165,.22);
  display: grid;
  place-items: center;
  box-shadow: 0 14px 30px rgba(0,0,0,.14);
  backdrop-filter: blur(10px);
  filter: none;
  z-index: 6;
  pointer-events: none;
}
.uniform-logo img {
  width: 84px;
  height: auto;
  object-fit: contain;
}
.float-card {
  position: absolute;
  z-index: 4;
  padding: 18px 22px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.8);
  font-weight: 800;
}
.float-card small { display: block; color: var(--muted); font-weight: 600; margin-top: 4px; }
.fc-left { left: 72px; bottom: 320px; text-align: left; }
.fc-right-1 { right: 80px; bottom: 390px; }
.fc-right-2 { right: 132px; bottom: 300px; }
.fc-right-3 { right: 104px; bottom: 214px; }
.book-chip {
  position: absolute;
  left: 50%;
  bottom: 44px;
  transform: translateX(-50%);
  z-index: 5;
}

.client-strip {
  background: #fff;
  padding: 34px 0;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.client-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(28px, 5vw, 76px);
  flex-wrap: wrap;
  color: #9a9a9a;
  font-family: Georgia, serif;
  font-size: 28px;
  font-weight: 700;
}
.client-row span:first-child {
  width: 100%;
  text-align: center;
  color: #111;
  font-family: inherit;
  font-size: 16px;
}

.section { padding: 88px 0; background: #fff; }
.section.tint { background: linear-gradient(135deg, #f2fffa, #ffffec); }
.section-head {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 520px);
  gap: 28px;
  align-items: end;
  margin-bottom: 42px;
}
.eyebrow {
  display: inline-flex;
  margin-bottom: 14px;
  color: var(--teal-dark);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}
h2 {
  margin: 0;
  font-size: clamp(36px, 4.6vw, 62px);
  line-height: 1.06;
  letter-spacing: -.035em;
}
p { color: var(--muted); line-height: 1.65; }

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.service-card {
  min-height: 420px;
  border-radius: 22px;
  overflow: hidden;
  background: var(--pink);
  border: 1px solid rgba(0,0,0,.05);
  box-shadow: 0 18px 45px rgba(0,0,0,.08);
  display: flex;
  flex-direction: column;
}
.service-card:nth-child(2) { background: #e5fbff; }
.service-card:nth-child(3) { background: var(--lav); }
.service-card:nth-child(4) { background: var(--lime); }
.service-card:nth-child(5) { background: #e6fff1; }
.service-card:nth-child(6) { background: #fff0d9; }
.service-card img { height: 210px; width: 100%; object-fit: cover; }
.service-card div { padding: 22px; }
.service-card small { font-style: italic; font-weight: 800; }
.service-card h3 { margin: 18px 0 10px; font-size: 25px; letter-spacing: -.02em; }
.round-link {
  margin-top: auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #050505;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 22px;
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr);
  gap: 64px;
  align-items: center;
}
.image-card {
  border-radius: 26px;
  overflow: hidden;
  border: 12px solid #fff;
  box-shadow: var(--shadow);
  background: #fff;
}
.image-card,
.service-card {
  position: relative;
}
.image-card::after,
.service-card::after {
  content: "";
  position: absolute;
  width: 86px;
  height: 54px;
  right: 18px;
  top: 18px;
  border-radius: 16px;
  background: rgba(255,255,255,.86) url("../images/roots-logo-transparent.webp") center / 68px auto no-repeat;
  border: 1px solid rgba(47,168,165,.2);
  box-shadow: 0 14px 30px rgba(0,0,0,.1);
}
.image-card img { width: 100%; min-height: 420px; object-fit: cover; }
.bubble-stats { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 28px; }
.bubble-stats span {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  width: 126px;
  height: 126px;
  border-radius: 50%;
  padding: 22px 14px 18px;
  background: linear-gradient(145deg, #eee4ff, #f8f0ff);
  text-align: center;
  font-weight: 900;
  box-shadow: inset 0 -10px 22px rgba(0,0,0,.04), 0 18px 44px rgba(10,92,91,.08);
  border: 1px solid rgba(255,255,255,.78);
}
.bubble-stats span:nth-child(2) { background: linear-gradient(145deg, #050505, #26302d); color: #fff; }
.bubble-stats span:nth-child(3) { background: linear-gradient(145deg, #efffb0, #dffb86); }

.page-hero {
  padding: 58px 0 90px;
  background: linear-gradient(135deg, #eafff7, #ffffe8);
}
.page-card {
  border: 1.5px solid var(--teal);
  border-radius: var(--radius);
  padding: 72px;
  background: rgba(255,255,255,.46);
}
.crumb { color: var(--teal-dark); font-weight: 900; margin-bottom: 18px; }
.page-card h1 {
  margin: 0;
  font-size: clamp(50px, 7vw, 96px);
  line-height: .98;
  letter-spacing: -.05em;
}
.page-card p { max-width: 760px; font-size: 19px; }

.detail-grid, .card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.info-card {
  border-radius: 22px;
  padding: 28px;
  background: #fff;
  border: 1px solid rgba(47,168,165,.18);
  box-shadow: 0 16px 42px rgba(10, 92, 91, .08);
}
.card-grid .info-card {
  min-height: 260px;
  background:
    radial-gradient(circle at 90% 8%, rgba(255,255,255,.9), transparent 24%),
    linear-gradient(145deg, #f3fffb, #e8fbff);
  overflow: hidden;
}
.card-grid .info-card:nth-child(2) { background: linear-gradient(145deg, #fff6db, #e6fbff); }
.card-grid .info-card:nth-child(3) { background: linear-gradient(145deg, #ffe8ef, #f6f1ff); }
.card-grid .info-card:nth-child(4) { background: linear-gradient(145deg, #eafff1, #ffffd9); }
.card-grid .info-card:nth-child(5) { background: linear-gradient(145deg, #eee4ff, #e6fbff); }
.card-grid .info-card:nth-child(6) { background: linear-gradient(145deg, #f5ffdc, #eafff8); }
.card-grid .info-card:nth-child(7) { background: linear-gradient(145deg, #fff0d9, #eafff8); }
.info-card h3 { margin: 0 0 12px; font-size: 25px; }
.info-card small {
  display: inline-flex;
  margin-bottom: 16px;
  font-weight: 900;
  color: var(--teal-dark);
}
.check-list { padding: 0; margin: 22px 0 0; list-style: none; }
.check-list li {
  padding: 12px 0 12px 30px;
  border-bottom: 1px solid rgba(0,0,0,.07);
  position: relative;
  color: var(--muted);
}
.check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 17px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--teal);
}
.service-child-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.service-child-list li {
  border: 1px solid rgba(47,168,165,.18);
  border-radius: 18px;
  background: rgba(255,255,255,.8);
  padding: 16px 18px 16px 42px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.service-child-list li:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(10,92,91,.1);
}
.service-child-list li::before {
  top: 22px;
  left: 18px;
}
.service-child-list a {
  display: block;
  color: var(--ink);
  font-weight: 800;
}
.service-child-card {
  min-height: 245px;
  display: flex;
  flex-direction: column;
}
.service-child-card .round-link {
  margin-top: auto;
}
.cta-card {
  text-align: center;
}
.cta-card p {
  margin-left: auto;
  margin-right: auto;
}

.reveal {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .75s cubic-bezier(.16,1,.3,1), transform .75s cubic-bezier(.16,1,.3,1);
}
.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}
.service-card.reveal,
.info-card.reveal,
.team-card.reveal {
  transition-delay: .05s;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.team-card {
  border-radius: 22px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(47,168,165,.18);
  box-shadow: 0 16px 40px rgba(10, 92, 91, .08);
}
.team-card img { width: 100%; height: 290px; object-fit: cover; object-position: top; }
.team-card div { padding: 22px; }
.team-card h3 { margin: 0 0 6px; font-size: 22px; }

.contact-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form {
  display: grid;
  gap: 14px;
}
.form input, .form textarea, .form select {
  width: 100%;
  border: 1px solid rgba(47,168,165,.28);
  border-radius: 16px;
  padding: 16px 18px;
  background: rgba(255,255,255,.8);
}
.form textarea { min-height: 150px; resize: vertical; }

.footer {
  padding: 70px 0 30px;
  background: #050505;
  color: #fff;
}
.footer p, .footer a { color: rgba(255,255,255,.72); }
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 32px;
}
.footer h3, .footer h4 { color: #fff; margin-top: 0; }
.footer a { display: block; margin: 10px 0; }
.copyright {
  margin-top: 44px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.14);
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: rgba(255,255,255,.58);
}

.mobile-toggle { display: none; }

@media (max-width: 1120px) {
  .nav-shell { grid-template-columns: auto 1fr auto; }
  .brand-title { display: none; }
  .menu {
    display: none;
    position: absolute;
    left: 18px;
    right: 18px;
    top: calc(100% + 12px);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 12px;
    box-shadow: var(--shadow);
    flex-direction: column;
    align-items: stretch;
  }
  .menu-group,
  .menu-trigger {
    width: 100%;
  }
  .nav-dropdown {
    position: static;
    width: 100%;
    max-height: none;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    display: none;
    margin: 6px 0 12px;
    box-shadow: none;
  }
  .menu-group:hover .nav-dropdown,
  .menu-group:focus-within .nav-dropdown,
  .menu-group.open .nav-dropdown {
    display: grid;
    transform: none;
  }
  .service-menu,
  .nav-sub-links {
    grid-template-columns: 1fr;
  }
  .menu.open { display: flex; }
  .mobile-toggle { display: inline-flex; }
  .nav-right .btn:not(.mobile-toggle) { display: none; }
  .mobile-toggle { display: inline-flex !important; }
  .hero-inner { padding: 24px 26px 0; }
  .hero-top { grid-template-columns: 1fr auto; }
  .hero-top .brand-title { display: block; text-align: right; }
  .hero-content { padding-top: 54px; }
  .hero-person { width: min(680px, 74vw); }
  .fc-left, .fc-right-1, .fc-right-2, .fc-right-3 { display: none; }
  .service-grid, .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split, .section-head, .contact-panel, .footer-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  .container { width: min(100% - 28px, var(--max)); }
  .site-header { padding-top: 10px; }
  .nav-shell { padding: 10px 12px; border-radius: 16px; }
  .brand-logo { width: 120px; height: 62px; }
  .brand-logo img { width: 112px; height: 56px; }
  .company-panel { width: min(90vw, 360px); }
  .hero-wrap { padding-top: 8px; }
  .hero-card, .hero-inner { min-height: 690px; }
  .hero-mini-menu { display: none; }
  .hero h1 { font-size: 46px; }
  .hero-sub { font-size: 16px; }
  .hero-person { width: 94vw; }
  .book-chip { bottom: 24px; }
  .service-grid, .detail-grid, .card-grid, .team-grid { grid-template-columns: 1fr; }
  .page-card { padding: 38px 24px; }
  .copyright { flex-direction: column; }
}

/* Hero repair: real image banner, no empty abstract hero, no corner image logos. */
.hero-card {
  min-height: 690px;
  background:
    radial-gradient(circle at 88% 18%, rgba(250,255,194,.9), transparent 30%),
    radial-gradient(circle at 10% 18%, rgba(196,255,224,.82), transparent 28%),
    linear-gradient(135deg, #ecfffa 0%, #f9fff0 60%, #e3fafa 100%);
}

.hero-inner {
  min-height: 690px;
  padding: 0;
  display: block;
}

.hero-content {
  min-height: 690px;
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr);
  grid-template-rows: auto auto auto 1fr;
  align-items: center;
  gap: 18px 60px;
  text-align: left;
  padding: 74px 72px 62px;
}

.hero h1 {
  margin: 0;
  max-width: 720px;
  font-size: clamp(54px, 5.6vw, 88px);
}

.hero-sub {
  margin: 12px 0 0;
  max-width: 650px;
  font-size: 19px;
}

.hero-person {
  position: relative;
  left: auto;
  bottom: auto;
  transform: none;
  grid-column: 2;
  grid-row: 1 / span 4;
  width: 100%;
  height: 540px;
  border-radius: 42px;
  border: 14px solid rgba(255,255,255,.62);
  box-shadow: 0 34px 90px rgba(10, 92, 91, .2);
}

.hero-person img {
  object-position: center;
}

.uniform-logo {
  left: auto;
  right: 18px;
  top: 18px;
  width: 96px;
  height: 60px;
  border-radius: 16px;
  transform: none;
  opacity: 1;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(47,168,165,.22);
  box-shadow: 0 14px 30px rgba(0,0,0,.14);
  filter: none;
}

.uniform-logo img {
  width: 84px;
}

.fc-left,
.fc-right-1,
.fc-right-2,
.fc-right-3,
.book-chip {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  top: auto;
  transform: none;
}

.fc-left {
  width: max-content;
  margin-top: 28px;
}

.fc-right-1,
.fc-right-2,
.fc-right-3 {
  display: inline-flex;
  width: max-content;
  margin-right: 12px;
  margin-top: 8px;
}

.book-chip {
  width: max-content;
  margin-top: 22px;
  z-index: 8;
}

.image-card::after,
.service-card::after {
  display: none !important;
}

.company-panel {
  z-index: 1000;
}

@media (max-width: 1120px) {
  .hero-content {
    grid-template-columns: 1fr;
    padding: 52px 28px 34px;
    text-align: center;
  }

  .hero-person {
    grid-column: auto;
    grid-row: auto;
    height: 440px;
  }

  .hero-sub,
  .hero h1,
  .fc-left,
  .book-chip {
    margin-left: auto;
    margin-right: auto;
  }

  .fc-right-1,
  .fc-right-2,
  .fc-right-3 {
    display: none;
  }
}

/* Premium motion pass: stronger hero stage, cleaner slideshow, testimonials, and 3D depth. */
.hero-card {
  background:
    radial-gradient(circle at 18% 20%, rgba(196,255,224,.82), transparent 28%),
    radial-gradient(circle at 82% 12%, rgba(239,255,176,.72), transparent 26%),
    linear-gradient(135deg, #edfff9 0%, #fbfff0 58%, #e8fbff 100%) !important;
}

.hero-content {
  isolation: isolate;
}

.hero-title {
  text-shadow: 0 20px 60px rgba(10,92,91,.08);
}

.hero-person {
  border-radius: 48px !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  box-shadow:
    0 44px 100px rgba(10, 92, 91, .24),
    inset 0 0 0 14px rgba(255,255,255,.45) !important;
  transform-style: preserve-3d;
  perspective: 1100px;
}

.hero-person::before {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(90deg, rgba(7,93,97,.1), transparent 24%, transparent 72%, rgba(7,93,97,.18)),
    linear-gradient(180deg, rgba(255,255,255,.16), transparent 52%, rgba(0,0,0,.12));
}

.hero-person::after {
  content: "";
  position: absolute;
  inset: 16px;
  z-index: 3;
  pointer-events: none;
  border-radius: 36px;
  border: 1px solid rgba(255,255,255,.36);
}

.hero-slide {
  object-position: center center !important;
  transform: scale(1.08) translateX(18px) !important;
  transition: opacity 1.05s ease, transform 6s cubic-bezier(.16,1,.3,1) !important;
  filter: saturate(1.05) contrast(1.02);
}

.hero-person video.hero-slide {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-slide.active {
  transform: scale(1.01) translateX(0) !important;
}

.slide-caption {
  z-index: 6 !important;
  transform: translateZ(50px);
  backdrop-filter: blur(12px);
  background: rgba(255,255,255,.9) !important;
}

.uniform-logo {
  right: 42% !important;
  top: 40% !important;
  width: 92px !important;
  height: 54px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 5px 8px rgba(255,255,255,.55)) drop-shadow(0 7px 12px rgba(0,0,0,.22));
  pointer-events: none;
}

.uniform-logo img {
  width: 88px !important;
}

.float-card {
  animation: floatSoft 5.5s ease-in-out infinite;
}
.fc-right-1 { animation-delay: .6s; }
.fc-right-2 { animation-delay: 1.2s; }
.fc-right-3 { animation-delay: 1.8s; }
@keyframes floatSoft {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -10px; }
}

.info-card,
.service-card,
.team-card,
.testimonial-card,
.page-card,
.image-card {
  transform-style: preserve-3d;
}

.info-card,
.service-card,
.team-card,
.testimonial-card {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.info-card:hover,
.service-card:hover,
.team-card:hover,
.testimonial-card:hover {
  transform: translateY(-8px) rotateX(1.5deg) rotateY(-1.5deg);
  box-shadow: 0 30px 80px rgba(10, 92, 91, .16);
  border-color: rgba(47,168,165,.36);
}

.testimonial-section {
  background:
    radial-gradient(circle at 10% 20%, rgba(234,255,248,.92), transparent 28%),
    radial-gradient(circle at 86% 14%, rgba(239,255,176,.82), transparent 25%),
    linear-gradient(135deg, #ffffff, #f4fffb);
}

.testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  perspective: 1200px;
}

.testimonial-card {
  min-height: 310px;
  padding: 34px;
  border-radius: 30px;
  border: 1px solid rgba(47,168,165,.2);
  background:
    linear-gradient(145deg, rgba(255,255,255,.88), rgba(234,255,248,.76)),
    radial-gradient(circle at 85% 14%, rgba(239,255,176,.65), transparent 32%);
  box-shadow: 0 24px 70px rgba(10, 92, 91, .1);
}

.testimonial-card.featured {
  background: linear-gradient(145deg, rgba(5,5,5,.96), rgba(7,93,97,.92));
  color: #fff;
  transform: translateY(-18px) rotateX(2deg);
}

.testimonial-card.featured p,
.testimonial-card.featured span {
  color: rgba(255,255,255,.76);
}

.stars {
  color: #d6ff27;
  letter-spacing: .08em;
  font-size: 22px;
  margin-bottom: 22px;
}

.testimonial-card p {
  margin: 0 0 28px;
  font-size: 20px;
  line-height: 1.55;
  color: #2b4144;
}

.testimonial-card strong,
.testimonial-card span {
  display: block;
}

.testimonial-card span {
  margin-top: 5px;
  color: var(--muted);
}

.video-showcase {
  background:
    radial-gradient(circle at 12% 18%, rgba(234,255,248,.88), transparent 26%),
    radial-gradient(circle at 84% 12%, rgba(255,232,239,.62), transparent 24%),
    linear-gradient(135deg, #ffffff, #f5fffb);
}

.video-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: 22px;
  align-items: stretch;
  perspective: 1200px;
}

.video-card {
  min-height: 360px;
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  border: 12px solid rgba(255,255,255,.72);
  background: #0b2d2d;
  box-shadow: 0 28px 80px rgba(10,92,91,.16);
  transform-style: preserve-3d;
  transition: transform .32s ease, box-shadow .32s ease;
}

.video-card.tall {
  min-height: 440px;
  transform: translateY(-28px);
}

.video-card video {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  display: block;
  filter: saturate(1.05) contrast(1.04);
}

.video-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 40%, rgba(0,0,0,.58)),
    linear-gradient(90deg, rgba(7,93,97,.14), transparent 55%);
  pointer-events: none;
}

.video-card > div {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  z-index: 2;
  padding: 18px 20px;
  border-radius: 20px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(14px);
  box-shadow: 0 16px 40px rgba(0,0,0,.14);
}

.video-card strong,
.video-card span {
  display: block;
}

.video-card strong {
  font-size: 22px;
}

.video-card span {
  margin-top: 5px;
  color: var(--muted);
}

.page-video {
  min-height: 460px;
}

.video-card:hover {
  transform: translateY(-8px) rotateX(1.5deg) rotateY(-1.5deg);
  box-shadow: 0 38px 100px rgba(10,92,91,.2);
}

.video-card.tall:hover {
  transform: translateY(-36px) rotateX(1.5deg) rotateY(-1.5deg);
}

.company-service-list {
  margin-bottom: 24px;
}

.company-service-list li {
  background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(234,255,248,.74));
}

@media (max-width: 1120px) {
  .testimonial-grid {
    grid-template-columns: 1fr;
  }
  .video-grid {
    grid-template-columns: 1fr;
  }
  .video-card.tall,
  .video-card.tall:hover {
    transform: none;
  }
  .testimonial-card.featured {
    transform: none;
  }
}

@media (max-width: 680px) {
  .uniform-logo {
    right: 36% !important;
    top: 39% !important;
    width: 70px !important;
  }
  .uniform-logo img {
    width: 66px !important;
  }
  .slide-caption {
    left: 14px;
    right: 14px;
    bottom: 14px;
  }
  .video-card,
  .page-video {
    min-height: 300px;
    border-width: 8px;
    border-radius: 22px;
  }
  .video-card > div {
    left: 12px;
    right: 12px;
    bottom: 12px;
    padding: 14px;
  }
  .video-card strong {
    font-size: 18px;
  }
}

@media (max-width: 680px) {
  .hero-card,
  .hero-inner,
  .hero-content {
    min-height: auto;
  }

  .hero-content {
    padding: 38px 18px 24px;
  }

  .hero-person {
    width: 100%;
    height: 340px;
    border-radius: 28px;
  }

  .uniform-logo {
    left: auto;
    right: 17%;
    top: 34%;
    width: 74px;
    height: 44px;
  }
}

/* Section motion polish requested for focus strip, why cards, and proof/stat block. */
.focus-motion {
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 50%, rgba(234,255,248,.95), transparent 24%),
    radial-gradient(circle at 88% 50%, rgba(239,255,176,.72), transparent 22%),
    #fff;
}

.focus-motion .client-row strong {
  display: inline-block;
  position: relative;
  animation: zigzagFloat 4.8s ease-in-out infinite;
  text-shadow: 0 12px 30px rgba(10,92,91,.08);
}

.focus-motion .client-row strong:nth-child(2) { animation-delay: 0s; }
.focus-motion .client-row strong:nth-child(3) { animation-delay: .25s; }
.focus-motion .client-row strong:nth-child(4) { animation-delay: .5s; }
.focus-motion .client-row strong:nth-child(5) { animation-delay: .75s; }
.focus-motion .client-row strong:nth-child(6) { animation-delay: 1s; }
.focus-motion .client-row strong:nth-child(7) { animation-delay: 1.25s; }

.focus-motion .client-row strong::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -12px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--teal);
  opacity: .55;
  transform: translateX(-50%) scale(.7);
  animation: dotPulse 4.8s ease-in-out infinite;
}

@keyframes zigzagFloat {
  0%, 100% { transform: translate3d(0, 0, 0) rotateX(0deg); color: #9a9a9a; }
  25% { transform: translate3d(12px, -10px, 0) rotateX(6deg); color: #075d61; }
  50% { transform: translate3d(-8px, 7px, 0) rotateX(-4deg); color: #2fa8a5; }
  75% { transform: translate3d(8px, -5px, 0) rotateX(4deg); color: #4f5f5f; }
}

@keyframes dotPulse {
  0%, 100% { opacity: .2; transform: translateX(-50%) scale(.6); }
  50% { opacity: .85; transform: translateX(-50%) scale(1.15); }
}

.why-section {
  position: relative;
  overflow: hidden;
}

.why-section::before {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -160px;
  top: 90px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47,168,165,.16), transparent 68%);
  animation: slowDrift 10s ease-in-out infinite;
  pointer-events: none;
}

.why-section .section-head h2 {
  transform-style: preserve-3d;
  animation: textLift 6s ease-in-out infinite;
}

.why-grid .info-card {
  position: relative;
  overflow: hidden;
  animation: cardFloat 5.6s ease-in-out infinite;
}

.why-grid .info-card:nth-child(2) { animation-delay: .7s; }
.why-grid .info-card:nth-child(3) { animation-delay: 1.4s; }

.why-grid .info-card::before {
  content: "";
  position: absolute;
  inset: -40% auto auto -30%;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: rgba(239,255,176,.75);
  filter: blur(4px);
  opacity: .58;
  transform: translateZ(-1px);
}

@keyframes cardFloat {
  0%, 100% { transform: translateY(0) rotateX(0deg) rotateY(0deg); }
  50% { transform: translateY(-12px) rotateX(2deg) rotateY(-2deg); }
}

@keyframes slowDrift {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-34px, 18px, 0) scale(1.08); }
}

@keyframes textLift {
  0%, 100% { transform: translateY(0); text-shadow: none; }
  50% { transform: translateY(-6px); text-shadow: 0 24px 50px rgba(10,92,91,.12); }
}

.proof-section {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 82%, rgba(196,255,224,.76), transparent 28%),
    radial-gradient(circle at 86% 20%, rgba(239,255,176,.72), transparent 27%),
    linear-gradient(135deg, #f4fffb, #fffff0) !important;
}

.proof-section::after {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  left: 42%;
  bottom: -220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47,168,165,.24), transparent 70%);
  animation: slowDrift 11s ease-in-out infinite reverse;
}

.proof-copy h2 {
  animation: proofTitle 5.8s ease-in-out infinite;
}

.proof-copy p {
  animation: proofText 6.4s ease-in-out infinite;
}

@keyframes proofTitle {
  0%, 100% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(0,-8px,30px); }
}

@keyframes proofText {
  0%, 100% { transform: translateX(0); opacity: 1; }
  50% { transform: translateX(8px); opacity: .86; }
}

.stat-orbs {
  perspective: 900px;
}

.stat-orbs span {
  animation: orbFloat 5s ease-in-out infinite;
}

.stat-orbs span:nth-child(2) {
  animation-delay: .55s;
}

.stat-orbs span:nth-child(3) {
  animation-delay: 1.1s;
}

@keyframes orbFloat {
  0%, 100% {
    transform: translateY(0) rotateX(0deg) rotateY(0deg) scale(1);
  }
  50% {
    transform: translateY(-14px) rotateX(8deg) rotateY(-8deg) scale(1.04);
  }
}

.proof-visual {
  animation: visualFloat 6s ease-in-out infinite;
  transform-origin: center;
}

.proof-visual img {
  object-position: center;
  filter: saturate(1.04) contrast(1.03);
}

@keyframes visualFloat {
  0%, 100% { transform: translateY(0) rotateZ(0deg); }
  50% { transform: translateY(-12px) rotateZ(.7deg); }
}

@media (max-width: 680px) {
  .focus-motion .client-row {
    gap: 18px;
  }
  .focus-motion .client-row strong {
    font-size: 22px;
  }
  .why-grid .info-card,
  .stat-orbs span,
  .proof-visual {
    animation-duration: 7s;
  }
}

/* Hero 3D motion upgrade: floating text, zigzag slideshow, and softer transitions. */
.hero-wrap {
  padding-top: 34px;
}

.hero-card,
.hero-inner,
.hero-content {
  overflow: visible;
}

.hero-content {
  padding-top: clamp(74px, 8vw, 116px) !important;
  perspective: 1200px;
}

.hero-title {
  overflow: visible !important;
  transform-style: preserve-3d;
}

.hero-title > span {
  display: block;
  width: fit-content;
  transform-origin: left center;
  will-change: transform, filter;
  animation:
    heroTextEnter .9s cubic-bezier(.2,.9,.2,1) both,
    heroLineZigzag 6.8s ease-in-out infinite;
}

.hero-title > span:nth-child(1) {
  animation-delay: .02s, .35s;
}

.hero-title > span:nth-child(2) {
  animation-delay: .16s, .85s;
}

.hero-title > span:nth-child(3) {
  animation-delay: .3s, 1.35s;
}

.hero-title em {
  background: linear-gradient(90deg, #1d9997, #0b5d61, #b9ff39, #1d9997);
  background-size: 240% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  filter: drop-shadow(0 12px 22px rgba(47,168,165,.2));
  animation: heroWordShine 4.2s ease-in-out infinite;
}

.hero-sub {
  animation: heroSubFloat 6s ease-in-out infinite;
  transform-style: preserve-3d;
}

.hero-person {
  translate: 0 0;
  will-change: translate, filter;
  animation: heroStageFloat 8s ease-in-out infinite !important;
  box-shadow: 0 34px 90px rgba(10,92,91,.16), 0 0 0 16px rgba(255,255,255,.78);
}

.hero-person::before {
  content: "";
  position: absolute;
  inset: -18px;
  z-index: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 20% 20%, rgba(185,255,57,.32), transparent 24%),
    radial-gradient(circle at 80% 80%, rgba(47,168,165,.28), transparent 30%);
  filter: blur(18px);
  opacity: .62;
  animation: heroAura 7s ease-in-out infinite;
  pointer-events: none;
}

.hero-slide {
  transition: opacity .9s ease, filter .9s ease, scale .9s ease;
}

.hero-slide.active {
  animation: slideZigzagZoom 6.6s ease-in-out infinite alternate !important;
  filter: saturate(1.06) contrast(1.04);
}

video.hero-slide.active {
  animation: videoZigzagDrift 6.2s ease-in-out infinite alternate !important;
}

.slide-caption {
  animation: captionFloat3d 5.4s ease-in-out infinite;
  transform-style: preserve-3d;
  backdrop-filter: blur(18px);
}

.slide-caption strong {
  display: inline-block;
  animation: captionTextPulse 3.7s ease-in-out infinite;
}

.slide-dots span {
  transition: width .35s ease, transform .35s ease, background .35s ease;
}

.slide-dots span.active {
  animation: activeDotPulse 1.35s ease-in-out infinite;
}

.book-chip,
.float-card {
  will-change: transform, translate;
}

.book-chip {
  animation: ctaHoverFloat 4.6s ease-in-out infinite !important;
}

.float-card {
  animation: heroChipFloat 5.5s ease-in-out infinite;
}

.fc-right-1 { animation-delay: .35s; }
.fc-right-2 { animation-delay: .75s; }
.fc-right-3 { animation-delay: 1.15s; }

@keyframes heroTextEnter {
  0% {
    opacity: 0;
    transform: translate3d(-42px, 30px, -80px) rotateX(14deg) rotateZ(-2deg);
    filter: blur(10px);
  }
  100% {
    opacity: 1;
    transform: translate3d(0,0,0) rotateX(0) rotateZ(0);
    filter: blur(0);
  }
}

@keyframes heroLineZigzag {
  0%, 100% {
    transform: translate3d(0,0,0) rotateX(0deg) rotateY(0deg);
    filter: drop-shadow(0 0 0 rgba(10,92,91,0));
  }
  28% {
    transform: translate3d(14px,-10px,34px) rotateX(3deg) rotateY(-3deg);
    filter: drop-shadow(0 18px 28px rgba(10,92,91,.13));
  }
  58% {
    transform: translate3d(-9px,8px,18px) rotateX(-2deg) rotateY(2deg);
  }
  78% {
    transform: translate3d(8px,-5px,28px) rotateX(2deg) rotateY(-1deg);
  }
}

@keyframes heroWordShine {
  0%, 100% { background-position: 0% 50%; transform: translateY(0); }
  50% { background-position: 100% 50%; transform: translateY(-4px); }
}

@keyframes heroSubFloat {
  0%, 100% { transform: translate3d(0,0,0); opacity: 1; }
  50% { transform: translate3d(10px,-7px,24px); opacity: .9; }
}

@keyframes heroStageFloat {
  0%, 100% { translate: 0 0; filter: drop-shadow(0 22px 36px rgba(10,92,91,.14)); }
  25% { translate: 12px -14px; }
  50% { translate: -8px 8px; filter: drop-shadow(0 34px 48px rgba(10,92,91,.2)); }
  75% { translate: 10px -6px; }
}

@keyframes heroAura {
  0%, 100% { transform: scale(1) rotate(0deg); opacity: .42; }
  50% { transform: scale(1.05) rotate(4deg); opacity: .82; }
}

@keyframes slideZigzagZoom {
  0% { transform: scale(1.02) translate3d(0,0,0); }
  35% { transform: scale(1.08) translate3d(-14px,-8px,0); }
  70% { transform: scale(1.05) translate3d(10px,8px,0); }
  100% { transform: scale(1.1) translate3d(-6px,0,0); }
}

@keyframes videoZigzagDrift {
  0% { transform: scale(1.03) translate3d(0,0,0); }
  50% { transform: scale(1.09) translate3d(12px,-10px,0); }
  100% { transform: scale(1.06) translate3d(-12px,8px,0); }
}

@keyframes captionFloat3d {
  0%, 100% { transform: translate3d(0,0,0) rotateX(0deg); }
  50% { transform: translate3d(10px,-10px,34px) rotateX(3deg); }
}

@keyframes captionTextPulse {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@keyframes activeDotPulse {
  0%, 100% { transform: scaleX(1); box-shadow: 0 0 0 rgba(185,255,57,0); }
  50% { transform: scaleX(1.18); box-shadow: 0 0 22px rgba(185,255,57,.72); }
}

@keyframes ctaHoverFloat {
  0%, 100% { transform: translate3d(0,0,0) rotateX(0deg); }
  50% { transform: translate3d(8px,-8px,28px) rotateX(4deg); }
}

@keyframes heroChipFloat {
  0%, 100% { transform: translate3d(0,0,0) rotateX(0deg); }
  50% { transform: translate3d(8px,-12px,32px) rotateX(5deg); }
}

@media (max-width: 920px) {
  .hero-content {
    padding-top: 58px !important;
  }
  .hero-title > span {
    animation-duration: .85s, 8s;
  }
  .hero-person {
    animation-duration: 9s !important;
  }
}

@media (max-width: 680px) {
  .hero-wrap {
    padding-top: 18px;
  }
  .hero-content {
    padding-top: 42px !important;
  }
  .hero-title > span {
    width: auto;
  }
  .hero-person {
    box-shadow: 0 20px 54px rgba(10,92,91,.12), 0 0 0 10px rgba(255,255,255,.82);
  }
}

/* Roots Group page premium sections. */
.company-hero {
  padding: 56px 0 70px;
  background:
    radial-gradient(circle at 8% 20%, rgba(196,255,224,.82), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(239,255,176,.65), transparent 25%),
    linear-gradient(135deg, #f4fffb 0%, #ffffee 100%);
}

.company-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(420px, 1fr);
  gap: 54px;
  align-items: center;
}

.company-copy {
  padding: clamp(28px, 4vw, 50px);
  background: rgba(255,255,255,.62);
  backdrop-filter: blur(16px);
}

.company-copy h1 {
  max-width: 760px;
  font-size: clamp(48px, 6.2vw, 96px);
  line-height: .95;
  letter-spacing: 0;
  margin: 18px 0 24px;
  animation: heroLineZigzag 7s ease-in-out infinite;
}

.company-copy p {
  font-size: clamp(18px, 1.5vw, 24px);
  line-height: 1.55;
  color: var(--muted);
  max-width: 720px;
}

.company-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 28px;
}

.group-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 34px;
}

.group-metrics span {
  min-height: 118px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  text-align: center;
  background: #fff;
  box-shadow: 0 24px 58px rgba(10,92,91,.08);
  animation: orbFloat 5.8s ease-in-out infinite;
}

.group-metrics span:nth-child(2) {
  background: #060807;
  color: #fff;
  animation-delay: .5s;
}

.group-metrics span:nth-child(3) {
  background: #efffb0;
  animation-delay: 1s;
}

.group-metrics strong,
.group-metrics small {
  display: block;
}

.group-metrics strong {
  font-size: 27px;
}

.company-stage {
  min-height: 620px;
  border-radius: 42px;
  overflow: hidden;
  position: relative;
  background: #dff7f0;
}

.company-stage .hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.company-glass-card {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 34px;
  z-index: 3;
  border-radius: 26px;
  padding: 24px;
  background: rgba(255,255,255,.84);
  box-shadow: 0 24px 70px rgba(0,0,0,.12);
  backdrop-filter: blur(18px);
  animation: captionFloat3d 5.4s ease-in-out infinite;
}

.company-glass-card strong,
.company-glass-card span {
  display: block;
}

.company-glass-card strong {
  font-size: clamp(24px, 2vw, 34px);
  line-height: 1;
}

.company-glass-card span {
  margin-top: 10px;
  color: var(--muted);
  font-size: 18px;
}

.company-unit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.company-unit-card {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 24px;
  align-items: center;
  min-height: 245px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 34px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 24px 70px rgba(10,92,91,.08);
  transform-style: preserve-3d;
  animation: cardFloat 6s ease-in-out infinite;
}

.company-unit-card:nth-child(2) { animation-delay: .35s; }
.company-unit-card:nth-child(3) { animation-delay: .7s; }
.company-unit-card:nth-child(4) { animation-delay: 1.05s; }

.company-unit-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 24px;
  background: #fff;
}

.company-unit-card:first-child img {
  object-fit: cover;
  padding: 0;
}

.company-unit-card h3 {
  margin: 0 0 10px;
  font-size: 28px;
}

.company-unit-card p {
  color: var(--muted);
  font-size: 18px;
  line-height: 1.5;
}

.company-unit-card a {
  display: inline-block;
  margin-top: 14px;
  font-weight: 900;
  color: var(--deep);
}

.group-zigzag {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(420px, 1fr);
  gap: 54px;
  align-items: center;
}

.zigzag-copy h2 {
  font-size: clamp(42px, 5vw, 78px);
  line-height: .98;
  margin: 12px 0 24px;
  animation: textLift 6s ease-in-out infinite;
}

.zigzag-copy p,
.check-list li {
  font-size: 20px;
  color: var(--muted);
  line-height: 1.55;
}

.check-list {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.check-list li {
  position: relative;
  padding: 18px 0 18px 34px;
  border-bottom: 1px solid var(--line);
}

.check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 26px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--teal);
  box-shadow: 0 0 0 8px rgba(47,168,165,.12);
}

.zigzag-media {
  min-height: 520px;
  border-radius: 42px;
  animation: visualFloat 6.4s ease-in-out infinite;
}

.group-sector-cards .info-card {
  min-height: 220px;
}

.process-lane {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.process-lane article {
  min-height: 260px;
  padding: 28px;
  border-radius: 32px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 24px 70px rgba(10,92,91,.07);
  animation: cardFloat 6.2s ease-in-out infinite;
}

.process-lane article:nth-child(2) { animation-delay: .35s; }
.process-lane article:nth-child(3) { animation-delay: .7s; }
.process-lane article:nth-child(4) { animation-delay: 1.05s; }

.process-lane span {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: #060807;
  color: #fff;
  font-weight: 900;
  margin-bottom: 22px;
}

.process-lane h3 {
  font-size: 27px;
}

.process-lane p {
  color: var(--muted);
  font-size: 18px;
  line-height: 1.5;
}

.group-cta {
  text-align: center;
  padding: clamp(36px, 6vw, 78px);
  background:
    radial-gradient(circle at 20% 20%, rgba(196,255,224,.8), transparent 28%),
    radial-gradient(circle at 82% 70%, rgba(239,255,176,.8), transparent 30%),
    #fff;
}

.group-cta h2 {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp(38px, 5.4vw, 82px);
  line-height: .98;
}

.group-cta p {
  max-width: 760px;
  margin: 18px auto 28px;
  color: var(--muted);
  font-size: 21px;
}

.clean-company-hero .company-copy h1 {
  animation: heroLineZigzag 6.4s ease-in-out infinite;
}

.clean-services-overview .company-unit-card {
  min-height: 300px;
}

.clean-service-card img {
  filter: saturate(1.04) contrast(1.03);
}

.clean-service-card h3 {
  max-width: 420px;
}

.hotel-company-hero .company-copy h1 {
  animation: heroLineZigzag 6.6s ease-in-out infinite;
}

.hotel-services-showcase .company-unit-card {
  min-height: 315px;
}

.hotel-service-card img {
  filter: saturate(1.03) contrast(1.03);
}

.facility-company-hero .company-copy h1 {
  animation: heroLineZigzag 6.7s ease-in-out infinite;
}

.facility-services-showcase .company-unit-card {
  min-height: 315px;
}

.facility-service-card img {
  filter: saturate(1.05) contrast(1.03);
}

@media (max-width: 980px) {
  .company-hero-grid,
  .group-zigzag {
    grid-template-columns: 1fr;
  }
  .company-stage {
    min-height: 520px;
  }
  .company-unit-grid,
  .process-lane {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .company-hero {
    padding: 24px 0 42px;
  }
  .company-copy {
    padding: 24px;
  }
  .company-stage,
  .zigzag-media {
    min-height: 360px;
    border-radius: 28px;
  }
  .group-metrics {
    grid-template-columns: 1fr;
  }
  .group-metrics span {
    min-height: 92px;
  }
  .company-unit-card {
    grid-template-columns: 1fr;
  }
  .company-unit-card img {
    height: 220px;
  }
  .company-glass-card {
    left: 16px;
    right: 16px;
    bottom: 18px;
    padding: 18px;
  }
}

/* Final override layer for the new homepage testimonial and motion styling. */
.roots-testimonial {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 16%, rgba(222, 255, 249, .95), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(239, 255, 176, .78), transparent 28%),
    linear-gradient(135deg, #fbfffb 0%, #f1fff9 52%, #fffdf2 100%) !important;
}

.testimonial-showcase {
  display: grid;
  grid-template-columns: .82fr .9fr 1fr;
  gap: 28px;
  align-items: center;
  perspective: 1200px;
}

.testimonial-copy h2 {
  font-size: clamp(44px, 5.2vw, 86px);
  line-height: .98;
  margin: 12px 0 22px;
  animation: heroLineZigzag 7s ease-in-out infinite;
}

.testimonial-video-card {
  position: relative;
  min-height: 560px;
  border-radius: 42px;
  overflow: hidden;
  border: 16px solid rgba(255,255,255,.78);
  box-shadow: 0 42px 110px rgba(10, 92, 91, .2);
  transform-style: preserve-3d;
  animation: testimonialTilt 7.5s ease-in-out infinite;
}

.testimonial-video-card video {
  width: 100%;
  height: 100%;
  min-height: 560px;
  object-fit: cover;
}

.testimonial-stack {
  display: grid;
  gap: 18px;
}

.testimonial-stack .testimonial-card {
  min-height: auto;
  padding: 28px;
  transform: none;
}

.testimonial-stack .testimonial-card.featured {
  transform: none;
}

.team-card img,
#memberPhoto {
  object-position: center top;
}

@keyframes slowOrbit {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@media (max-width: 1120px) {
  .testimonial-showcase {
    grid-template-columns: 1fr;
  }
  .testimonial-video-card,
  .testimonial-video-card video {
    min-height: 430px;
  }
}

@media (max-width: 680px) {
  .testimonial-video-card,
  .testimonial-video-card video {
    min-height: 320px;
    border-radius: 30px;
  }
  .testimonial-video-card {
    border-width: 9px;
  }
  .testimonial-copy h2 {
    font-size: clamp(38px, 12vw, 56px);
  }
}

/* TRUE FINAL NO-MOTION + CLICK-ONLY NAV OVERRIDES */
.hero-card,.hero-inner,.hero-content,.hero-copy,.hero-content h1,.hero-content h1 *,.hero-content p,.hero-person,.hero-slideshow,.company-hero,.company-copy,.company-copy h1,.company-copy h1 *,.company-copy p,.company-stage,.page-hero,.page-card,.page-hero-media,.industry-hero-copy,.industry-hero-copy *,.slide-caption,.slide-caption *,.company-glass-card,.company-glass-card *,.group-zigzag,.zigzag-copy,.zigzag-copy *,.zigzag-media{animation:none!important;transform:none!important;transform-style:flat!important}
.hero-person:hover,.company-stage:hover,.zigzag-media:hover{transform:none!important}
.hero-slide,.hero-slide.active,video.hero-slide,video.hero-slide.active,.company-stage .hero-slide,.company-stage .hero-slide.active{animation:none!important;transform:none!important}
.hero-slide{transition:opacity .75s ease!important}
.menu-group:not(.open)>.nav-dropdown,.menu-group:not(.open):hover>.nav-dropdown,.menu-group:not(.open):focus-within>.nav-dropdown{opacity:0!important;pointer-events:none!important;transform:translate(-50%,-8px)!important}
.menu-group.open>.nav-dropdown,.menu-group.open:hover>.nav-dropdown,.menu-group.open:focus-within>.nav-dropdown{opacity:1!important;pointer-events:auto!important;transform:translate(-50%,0)!important}
@media(max-width:1120px){.menu-group:not(.open)>.nav-dropdown,.menu-group:not(.open):hover>.nav-dropdown,.menu-group:not(.open):focus-within>.nav-dropdown{display:none!important;transform:none!important}.menu-group.open>.nav-dropdown,.menu-group.open:hover>.nav-dropdown,.menu-group.open:focus-within>.nav-dropdown{display:grid!important;transform:none!important}}

/* Mobile menu: always starts at the first item and owns the complete touch scroll. */
@media (max-width: 1120px) {
  #menu.menu.open {
    display: flex !important;
    max-height: calc(100dvh - 118px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
    scroll-behavior: auto !important;
    scroll-padding-top: 12px;
    overflow-anchor: none;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch;
  }
  #menu,
  #menu * {
    overflow-anchor: none !important;
    scroll-snap-type: none !important;
  }
  #menu .nav-dropdown,
  #menu .service-menu,
  #menu .compact-menu {
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    scroll-behavior: auto !important;
    touch-action: pan-y !important;
  }
  #menu .menu-group.open > .nav-dropdown {
    position: fixed !important;
    top: var(--mobile-dropdown-top, 108px) !important;
    right: 12px !important;
    bottom: 12px !important;
    left: 12px !important;
    z-index: 120 !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 14px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .985) !important;
    box-shadow: 0 24px 70px rgba(10, 92, 91, .2) !important;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 680px) {
  #menu.menu.open {
    max-height: calc(100dvh - 104px) !important;
  }
  #menu .menu-group.open > .nav-dropdown {
    right: 8px !important;
    bottom: 8px !important;
    left: 8px !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }
}

/* Keep every hero image/video clean: remove the orbiting white-line decoration. */
.hero-person::after,
.hero-slideshow::after,
.company-stage::after,
.page-hero-media::after,
.industry-hero-media::after {
  content: none !important;
  display: none !important;
  animation: none !important;
  transform: none !important;
}

.hero-person::before,
.hero-slideshow::before,
.company-stage::before,
.page-hero-media::before,
.industry-hero-media::before {
  animation: none !important;
  transform: none !important;
}

/* Reliable body-level mobile Services/Sectoren panel (no nested scroll container). */
.mobile-nav-panel {
  display: none;
}

@media (max-width: 1120px) {
  body.mobile-nav-panel-open {
    overflow: hidden !important;
  }
  .mobile-nav-panel.open {
    position: fixed;
    top: var(--mobile-dropdown-top, 108px);
    right: 10px;
    bottom: 10px;
    left: 10px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(10, 92, 91, .28);
  }
  .mobile-nav-panel-head {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(47, 168, 165, .22);
    background: linear-gradient(135deg, #effff9, #fbffe8);
  }
  .mobile-nav-panel-title {
    font-size: 20px;
  }
  .mobile-nav-panel-close {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 999px;
    background: #050505;
    color: #fff;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
  }
  .mobile-nav-panel-content {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scroll-behavior: auto;
    overflow-anchor: none;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }
  .mobile-nav-panel-content .nav-service-block,
  .mobile-nav-panel-content .nav-sub-links {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .mobile-nav-panel-content .nav-feature,
  .mobile-nav-panel-content .nav-sub-links a {
    display: block;
  }
}

@media (max-width: 680px) {
  .mobile-nav-panel.open {
    right: 6px;
    bottom: 6px;
    left: 6px;
    border-radius: 18px;
  }
  .mobile-nav-panel-content {
    padding: 10px;
  }
}