/* Orca Clean V19 — offline-only full-height video hero + lightweight service highlights. */
.hero--v17 {
  position:relative;
  isolation:isolate;
  min-height:max(880px, 100svh);
  padding:136px 0 45px;
  overflow:hidden;
  background:linear-gradient(118deg,#061b32 0%,#0e3354 52%,#2c5b75 100%);
}
.hero--v17 .hero-film {
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  overflow:hidden;
  background:radial-gradient(ellipse at 87% 35%,rgba(72,132,165,.47),transparent 57%),linear-gradient(118deg,#061b32,#0d2f4c 65%,#245171);
}
.hero--v17 .hero-film-video {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center 46%;
  opacity:0;
  filter:saturate(.8) contrast(1.02);
  transition:opacity .75s ease;
}
.hero--v17.v17-video-active .hero-film-video {opacity:1;}
/* Keep the navy overlay from the approved V16 concept. */
.hero--v17 .hero-film::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(5,22,42,.85) 0%,rgba(7,30,54,.73) 37%,rgba(7,30,54,.43) 66%,rgba(7,30,54,.27) 100%);
}
.hero--v17 .hero-film::before {
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  background:linear-gradient(0deg,rgba(4,21,40,.28),transparent 31%,transparent 80%,rgba(4,21,40,.17));
}
.v17-hero-layout {
  min-height:calc(max(880px, 100svh) - 181px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:68px;
  position:relative;
  z-index:2;
}
.hero--v17 .hero-copy {padding:36px 0 0;max-width:805px;}
.hero--v17 .eyebrow {color:#b6d9f2;font-size:.75rem;letter-spacing:.16em;margin-bottom:27px;}
.hero--v17 h1 {
  color:#fff;
  font-size:clamp(4rem,7.1vw,7.5rem);
  max-width:800px;
  line-height:.99;
  font-weight:550;
  letter-spacing:-.063em;
  text-shadow:0 4px 23px rgba(0,10,25,.16);
}
.hero--v17 h1 span {color:#cde7f7;}
.hero--v17 .hero-lead {margin:28px 0 0;color:#e0ebf6;max-width:600px;font-size:clamp(1.08rem,1.7vw,1.33rem);line-height:1.56;}
.hero--v17 .hero-actions {margin-top:35px;gap:27px;flex-wrap:wrap;}
.hero--v17 .button-primary {min-height:55px;background:#eaf6ff;color:#072949;box-shadow:0 14px 35px rgba(0,16,34,.22);}
.hero--v17 .button-primary:hover {background:#fff;box-shadow:0 17px 37px rgba(0,16,34,.3);}
.hero--v17 .text-link {color:#f2f8fc;border-bottom-color:rgba(238,248,255,.57);}
.hero--v17 .text-link span {color:#b8def6;}
/* No boxes, no carousels and no forced interaction; all nine service details stay visible. */
.v17-highlights {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(32px,5vw,78px);
  padding:28px 6px 24px;
  border-top:1px solid rgba(196,226,247,.38);
}
.v17-highlight-group {min-width:0;}
.v17-highlight-group h2 {
  margin:0 0 16px;
  color:#f4f9ff;
  font-size:clamp(.91rem,1.11vw,1rem);
  line-height:1.35;
  font-weight:725;
  letter-spacing:.01em;
}
.v17-highlight-items {list-style:none;margin:0;padding:0;display:grid;gap:11px;}
.v17-highlight-items li {display:flex;align-items:center;gap:12px;color:#e0ebf5;font-size:clamp(.82rem,1.03vw,.94rem);font-weight:470;line-height:1.34;}
.v17-symbol {flex:0 0 20px;width:20px;height:20px;color:#a3cce8;opacity:.96;}
/* Brand/navigation and unobtrusive accessible motion controls. */
body:has(.hero--v17) .site-header {background:rgba(252,254,255,.94);border-bottom:1px solid rgba(10,55,94,.09);backdrop-filter:blur(17px);}
body:has(.hero--v17) .site-header.is-scrolled {background:rgba(255,255,255,.97);}
.hero--v17 + .intro.section {padding-top:85px;}
@media (max-width:980px) {
  .hero--v17 {min-height:max(830px, 100svh);padding:124px 0 37px;}
  .v17-hero-layout {min-height:calc(max(830px, 100svh) - 161px);gap:60px;}
  .hero--v17 .hero-copy {padding:24px 0 0;}
  .v17-highlights {column-gap:24px;}
  .v17-highlight-items li {font-size:.85rem;}
}
@media (max-width:760px) {
  .hero--v17 {min-height:auto;padding:112px 0 64px;}
  .v17-hero-layout {min-height:0;gap:67px;}
  .hero--v17 .hero-film-video {object-position:58% center;}
  .hero--v17 .hero-film::after {background:linear-gradient(120deg,rgba(5,24,47,.87),rgba(8,43,77,.67));}
  .hero--v17 .hero-copy {padding:26px 0 0;max-width:100%;}
  .hero--v17 .eyebrow {font-size:.66rem;letter-spacing:.13em;margin-bottom:23px;}
  .hero--v17 h1 {font-size:clamp(3.25rem,12vw,5rem);line-height:1.01;letter-spacing:-.058em;}
  .hero--v17 .hero-lead {max-width:480px;margin-top:25px;font-size:1.04rem;}
  .hero--v17 .hero-actions {margin-top:33px;gap:21px;align-items:flex-start;}
  .v17-highlights {grid-template-columns:1fr;gap:28px;padding:24px 0 0;}
  .v17-highlight-group h2 {font-size:.96rem;margin-bottom:12px;}
  .v17-highlight-items {grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:14px;}
  .v17-highlight-items li {font-size:.86rem;gap:8px;}
  .v17-symbol {width:18px;height:18px;flex-basis:18px;}
  .hero--v17 + .intro.section {padding-top:62px;}
}
@media (max-width:390px) {
  .hero--v17 h1 {font-size:clamp(3rem,11.8vw,3.65rem);}
  .v17-highlight-items {column-gap:9px;}
  .v17-highlight-items li {font-size:.8rem;gap:7px;}
}
@media (prefers-reduced-motion:reduce) {
  .hero--v17 .hero-film-video {display:none!important;}
}

/* The original wildlife carousel now supports moving footage, including mobile. */
.purpose-source-fallback {display:none;margin:0 24px 20px;color:#b9def5;font-size:.78rem;text-decoration:underline;text-underline-offset:3px;}
.purpose-carousel.is-media-unavailable .purpose-source-fallback {display:inline-block;}
@media (prefers-reduced-motion:reduce) {.purpose-carousel-video{display:none!important;}}


/* V19: NAVIGATION - transparent over the video, solid midnight navy after scrolling. */
body:has(.hero--v17) .site-header,
body:has(.hero--v17) .site-header:not(.is-scrolled) {
  background: transparent;
  border-bottom: 1px solid transparent;
  box-shadow: none;
  backdrop-filter: none;
}
body:has(.hero--v17) .site-header.is-scrolled {
  background: rgba(5, 30, 56, .97);
  border-bottom: 1px solid rgba(198,230,251,.18);
  box-shadow: 0 12px 35px rgba(0,17,34,.20);
  backdrop-filter: blur(16px);
}
body:has(.hero--v17) .site-header .brand-orca {color:#c9dcec;}
body:has(.hero--v17) .site-header .brand-clean {color:#fff;}
body:has(.hero--v17) .site-header .site-nav a:not(.nav-cta) {color:#f6fbff;}
body:has(.hero--v17) .site-header .site-nav a:not(.nav-cta)::after {background:#bce0fb;}
body:has(.hero--v17) .site-header .nav-cta {background:#f5faff;color:#062542;}
body:has(.hero--v17) .site-header .nav-cta:hover,
body:has(.hero--v17) .site-header .nav-cta:focus-visible {background:#d7edff;}
body:has(.hero--v17) .site-header .header-brand-icon {width:43px;height:43px;border-radius:9px;}
/* The header is part of the opening frame: navy footprint allows the footage to continue behind it. */
body:has(.hero--v17) .hero--v17 .hero-film::before {
  background:linear-gradient(180deg, rgba(4,21,40,.36) 0%, transparent 27%),
             linear-gradient(0deg,rgba(4,21,40,.28),transparent 30%);
}

/* V19: CONSERVATION - video spans the whole section instead of sitting in a card. */
.purpose.section {
  min-height:clamp(700px,90svh,1050px);
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  background:#062647;
  padding:clamp(105px,12vh,160px) 0 clamp(225px,25vh,265px);
}
.purpose::before {display:none;}
.purpose-art {display:none;}
.purpose-grid {position:static;z-index:auto;display:block;}
.purpose-copy-block {
  position:relative;
  z-index:3;
  max-width:520px;
  padding:0;
  text-shadow:0 2px 24px rgba(0,12,27,.28);
}
.purpose-copy-block p {font-size:clamp(1.01rem,1.25vw,1.17rem);line-height:1.72;color:#e1edf7;}
.purpose-copy-block .purpose-note {color:#bed0df;font-size:.95rem;}
.purpose .section-kicker {color:#9bcff4;}
.purpose-media {position:static;min-height:0;}
.purpose-carousel {
  position:absolute;
  z-index:0;
  inset:0;
  display:block;
  min-height:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:linear-gradient(135deg,#052447,#0c476d 75%,#113a59);
}
.purpose-carousel-stage {position:absolute;inset:0;min-height:0;overflow:hidden;}
.purpose-carousel-video {width:100%;height:100%;object-fit:cover;object-position:center center;filter:saturate(.85) contrast(1.03);}
.purpose-carousel-gradient {
  background: linear-gradient(90deg,rgba(2,20,42,.91) 0%,rgba(2,25,47,.73) 27%,rgba(3,28,50,.45) 57%,rgba(2,21,38,.28) 100%),
              linear-gradient(0deg,rgba(2,17,35,.88) 0%,transparent 31%,transparent 73%,rgba(2,20,40,.34) 100%);
}
/* The previous image poster remains a static fallback if video cannot be played. */
.purpose-video-poster {opacity:.85;}
.purpose-video-poster img {opacity:.30;}
.purpose-video-poster span,.purpose-video-poster small {opacity:.60;}
/* Unboxed educational outcome in the lower-right, text unchanged. */
.purpose-carousel-panel {
  position:absolute;
  z-index:4;
  right:max(24px,calc((100vw - 1180px) / 2));
  bottom:105px;
  width:min(430px,calc(100vw - 48px));
  padding:10px 0 8px 18px;
  border-top:0;
  border-left:2px solid rgba(164,211,243,.68);
  background:transparent;
  text-shadow:0 2px 20px rgba(0,15,28,.50);
}
.purpose-carousel-panel small {font-size:.70rem;color:#a4d6fb;letter-spacing:.12em;margin-bottom:7px;}
.purpose-carousel-panel strong {font-size:1.08rem;line-height:1.36;color:#fff;}
.purpose-carousel-panel p {font-size:.85rem;line-height:1.55;color:#d6e4ef;}
.purpose-carousel-nav {
  position:absolute;
  z-index:4;
  left:max(24px,calc((100vw - 1180px) / 2));
  bottom:57px;
  width:min(560px,calc(100vw - 48px));
  padding:0;
  gap:9px;
  background:transparent;
}
.purpose-chip {background:rgba(7,31,56,.64);border-color:rgba(209,230,249,.32);backdrop-filter:blur(6px);}
.purpose-chip.is-active {background:#f1f8ff;color:#0c2a47;}
.purpose-source-fallback {position:absolute;bottom:18px;left:max(24px,calc((100vw - 1180px) / 2));z-index:5;margin:0;}

@media (max-width:760px) {
  body:has(.hero--v17) .site-header .menu-button span:not(.sr-only) {background:#f3f9ff;}
  body:has(.hero--v17) .site-header .site-nav {
    background:#092b4b;
    border:1px solid rgba(188,220,246,.27);
    box-shadow:0 16px 45px rgba(1,18,36,.3);
  }
  body:has(.hero--v17) .site-header .site-nav a:not(.nav-cta) {color:#f4f9ff;}
  .purpose.section {min-height:max(820px,100svh);display:block;padding:112px 0 44px;}
  .purpose-grid {display:block;}
  .purpose-copy-block {max-width:620px;margin-bottom:clamp(125px,23vh,200px);}
  .purpose-copy-block p {font-size:1rem;line-height:1.62;}
  .purpose-copy-block .purpose-note {margin-top:16px;font-size:.89rem;}
  .purpose-carousel-panel {
    position:relative;
    bottom:auto;right:auto;
    width:auto;
    margin:0 24px 0;
    padding:0 0 0 14px;
    border-left-color:rgba(164,211,243,.7);
  }
  .purpose-carousel-nav {
    position:relative;
    left:auto;bottom:auto;
    padding:0;
    margin:0 24px 24px;
    width:calc(100% - 48px);
  }
  .purpose-carousel-stage {inset:0;}
  .purpose-carousel {display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:38px;}
  .purpose-carousel-panel {order:1;margin-bottom:26px;}
  .purpose-carousel-nav {order:2;}
  .purpose-source-fallback {bottom:10px;left:24px;}
  .purpose-carousel-gradient {
    background:linear-gradient(180deg,rgba(3,21,40,.85),rgba(3,26,48,.55) 25%,rgba(3,25,48,.63) 54%,rgba(2,17,34,.93) 100%);
  }
}
@media (max-width:460px) {
  .purpose.section {padding-top:108px;}
  .purpose-copy-block {margin-bottom:clamp(155px,22vh,205px);}
  .purpose-carousel-panel {margin:0 24px 22px;}
  .purpose-carousel-nav {gap:7px;margin-bottom:20px;}
  .purpose-chip {min-height:36px;padding:8px 12px;font-size:.78rem;}
  .purpose-carousel-panel p {font-size:.80rem;}
}
@media (prefers-reduced-motion:reduce) {
  .purpose-carousel-video {display:none !important;}
}
