/* Final reference layer. Loaded after legacy prototype styles. */

/* Match the full-width background of CriaHub's internal service-page hero. */
.v6-hero-band {
  position: relative;
  overflow: hidden;
  margin-top: -104px;
  padding-top: 104px;
  background:
    radial-gradient(circle at top, rgba(45,127,249,0.24), transparent 38%),
    linear-gradient(180deg, rgba(3,5,7,0.15) 0%, rgba(8,9,13,0.94) 100%);
}
.v6-hero-band::before,
.v6-hero-band::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  filter: blur(120px);
  opacity: .7;
}
.v6-hero-band::before {
  width: 34rem;
  height: 34rem;
  left: -8rem;
  top: -10rem;
  background: rgba(45,127,249,0.24);
}
.v6-hero-band::after {
  width: 28rem;
  height: 28rem;
  right: -6rem;
  top: 4rem;
  background: rgba(91,160,255,0.12);
}
.v6-hero { position: relative; z-index: 1; overflow: visible; isolation: auto; border-bottom: 0; background: transparent; }
.v6-hero::before,
.v6-hero::after { content: none; }
.v6-hero-copy,
.v6-hero .v6-scene { position: relative; z-index: 2; }
@media (max-width:767px) {
  .v6-hero-band { margin-top: -78px; padding-top: 78px; }
}

@media (min-width:1024px){.v6-hero{grid-template-columns:minmax(0,.82fr) minmax(560px,1.18fr);gap:clamp(24px,3vw,48px)}}
.v6-capabilities{grid-template-columns:minmax(0,.92fr) minmax(560px,1.08fr);gap:48px;align-items:start}.v6-capability-grid{gap:18px}.v6-card,.v6-card:nth-child(n+3){grid-template-columns:52px 1fr;min-height:250px;padding:26px;border:1px solid rgb(91 160 255/.16);border-radius:17px;background:linear-gradient(145deg,rgb(18 31 50/.82),rgb(10 16 27/.72));box-shadow:inset 0 1px rgb(244 244 247/.035),0 18px 50px rgb(6 7 11/.12)}.v6-card-icon{width:46px;height:46px}.v6-card h3{font-size:1.05rem}.v6-service-detail summary{justify-content:flex-start;gap:10px;font-weight:700}.v6-service-detail summary>span{display:inline;transition:transform .25s ease}.v6-service-detail[open] summary>span{transform:rotate(90deg)}
.v6-process .v6-section-head{max-width:860px}.v6-step-list{gap:34px}.v6-step{grid-template-columns:86px minmax(0,1fr);align-items:start;min-height:265px;padding:30px 26px;border:1px solid rgb(91 160 255/.16);border-radius:18px;background:linear-gradient(145deg,rgb(18 31 50/.86),rgb(10 16 27/.76));box-shadow:inset 0 1px rgb(244 244 247/.04),0 20px 55px rgb(6 7 11/.14)}.v6-step-icon{display:grid;place-items:center;width:72px;height:72px;border:1px solid rgb(91 160 255/.34);border-radius:50%;color:var(--brand-primary-2);background:radial-gradient(circle at 50% 25%,rgb(45 127 249/.44),rgb(45 127 249/.13) 70%);box-shadow:0 0 28px rgb(45 127 249/.14)}.v6-step-icon svg{width:44px;height:44px;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}.v6-step-copy{min-width:0}.v6-step-number{display:block;width:auto;height:auto;border:0;border-radius:0;background:none;color:var(--brand-primary-2);font-size:1.1rem;font-weight:750;line-height:1.2}.v6-step-copy h3{margin-top:6px}.v6-step-copy p{grid-column:auto;margin-top:16px;font-size:.9rem;line-height:1.62}.v6-step:not(:last-child)::after{content:'→';top:50%;right:-29px;width:24px;height:auto;color:var(--brand-primary-2);background:none;font-size:1.7rem;line-height:1;opacity:.9;transform:translateY(-50%)}
.v6-scope-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.v6-scope-block{display:grid;grid-template-columns:58px minmax(0,1fr);align-content:start;column-gap:24px}.v6-scope-block:first-child{padding-right:clamp(34px,5vw,72px)}.v6-scope-block+.v6-scope-block{padding-left:clamp(34px,5vw,72px);border-left:1px solid var(--border-strong)}.v6-scope-icon{grid-column:1;grid-row:1/8;color:var(--brand-primary-2)}.v6-scope-icon svg{width:48px;height:48px;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.v6-scope-block>:not(.v6-scope-icon){grid-column:2}.v6-scope-block h3{font-size:1.25rem}.v6-scope-cta a{font-weight:700}
.v6-responsibilities{padding-top:clamp(48px,6vw,90px)}.v6-editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.v6-editorial-grid>div{display:grid;grid-template-columns:58px minmax(0,1fr);align-content:start;column-gap:24px;padding:34px;border:1px solid rgb(91 160 255/.17);border-radius:18px;background:linear-gradient(145deg,rgb(18 31 50/.84),rgb(10 16 27/.72));box-shadow:inset 0 1px rgb(244 244 247/.04),0 22px 60px rgb(6 7 11/.12)}.v6-editorial-icon{grid-column:1;grid-row:1/5;color:var(--brand-primary-2)}.v6-editorial-icon svg{width:48px;height:48px;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.v6-editorial-grid>div>:not(.v6-editorial-icon){grid-column:2}.v6-editorial-grid h3{font-size:1.18rem}.v6-editorial-grid p{font-size:.93rem;line-height:1.68}
.v6-proof .v6-section-head{max-width:980px}.v6-proof-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;max-width:none}.v6-proof-links article,.v6-proof-links article:nth-child(2){display:flex;flex-direction:column;align-items:stretch;padding:0;overflow:hidden;border:1px solid rgb(91 160 255/.16);border-radius:18px;background:linear-gradient(145deg,rgb(18 31 50/.76),rgb(10 16 27/.82))}.v6-proof-visual{width:100%;border-radius:0}.v6-proof-visual img{width:100%;aspect-ratio:16/9;object-fit:cover}.v6-proof-links article h3{align-self:stretch;padding:24px 24px 0}.ch-v6 .v6-proof-links article>p{max-width:none;padding:0 24px 26px;margin-top:10px}.v6-proof-note{max-width:none}
.v6-faq{border-bottom:0}.ch-v6 .v6-cta-band{padding-block:0;border-top:1px solid var(--border-strong);background:#07101f}.v6-cta-band::before{content:none}.v6-cta-layout{min-height:500px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:1fr auto;gap:28px 40px;align-items:center;overflow:hidden}.v6-cta-copy{grid-column:1;grid-row:1;padding-block:72px 26px}.v6-cta-visual{position:absolute;z-index:0;inset:0 -80px 0 0;display:block;pointer-events:none}.v6-cta-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#07101f 0%,rgb(7 16 31/.94) 28%,transparent 58%)}.v6-cta-visual img{width:100%;height:100%;object-fit:cover;object-position:center}.v6-cta-benefits{position:relative;z-index:2;grid-column:1/-1;grid-row:2;padding-bottom:42px;margin:0!important}
@media(max-width:1023px){.v6-hero{grid-template-columns:1fr;gap:42px}.v6-capabilities{grid-template-columns:1fr;gap:32px}.v6-capabilities .v6-section-head{max-width:780px}.v6-step-list{grid-template-columns:1fr;gap:24px}.v6-step{min-height:0}.v6-step:not(:last-child)::after{content:'↓';display:block;top:auto;right:50%;bottom:-24px;transform:translateX(50%)}}
@media(max-width:767px){.v6-capability-grid{grid-template-columns:1fr;gap:16px}.v6-card,.v6-card:nth-child(n+3){min-height:0;padding:22px;border:1px solid rgb(91 160 255/.16)}.v6-scope-grid,.v6-editorial-grid{grid-template-columns:1fr}.v6-scope-block:first-child{padding-right:0}.v6-scope-block+.v6-scope-block{margin-top:36px;padding:36px 0 0;border-left:0;border-top:1px solid var(--border-strong)}.v6-editorial-grid>div{padding:24px}.v6-proof-links{grid-template-columns:1fr;gap:22px}.v6-proof-links article,.v6-proof-links article:nth-child(2){display:flex;padding:0}.v6-proof-links article :is(.v6-proof-visual,h3,p),.v6-proof-links article:nth-child(2) :is(.v6-proof-visual,h3,p){width:100%}.v6-proof-links article h3{padding:20px 20px 0}.ch-v6 .v6-proof-links article>p{padding:0 20px 22px}.v6-cta-layout{display:grid;min-height:0;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:24px;overflow:visible}.v6-cta-copy{grid-column:1;grid-row:1;padding:62px 0 0}.v6-cta-visual{position:relative;grid-column:1;grid-row:2;inset:auto;height:310px;overflow:hidden;border:1px solid rgb(91 160 255/.18);border-radius:18px;background:#07101f}.v6-cta-visual::after{background:linear-gradient(180deg,#07101f 0%,transparent 22%)}.v6-cta-visual img{object-fit:cover;object-position:center}.v6-cta-benefits{grid-column:1;grid-row:3;padding-bottom:56px}}
@media(max-width:479px){.v6-step{grid-template-columns:70px minmax(0,1fr);padding:22px 18px}.v6-step-icon{width:60px;height:60px}.v6-step-icon svg{width:36px;height:36px}.v6-scope-block,.v6-editorial-grid>div{grid-template-columns:46px minmax(0,1fr);column-gap:16px}.v6-scope-icon svg,.v6-editorial-icon svg{width:38px;height:38px}.v6-cta-visual{height:280px}}

/* Final reusable CTA: a self-contained transparent asset, never a full-bleed crop. */
.ch-v6 .v6-cta-band {
  padding-block: 0;
  border-top: 1px solid var(--border-strong);
  background: radial-gradient(circle at 72% 46%, rgb(45 127 249 / .08), transparent 32%), #07101f;
}
.v6-cta-layout {
  min-height: 520px;
  grid-template-columns: minmax(0,.82fr) minmax(480px,1.18fr);
  grid-template-rows: 1fr auto;
  gap: 20px 42px;
  align-items: center;
  overflow: visible;
}
.v6-cta-copy { grid-column: 1; grid-row: 1; padding-block: 76px 34px; }
.v6-cta-visual {
  position: relative;
  z-index: 1;
  inset: auto;
  grid-column: 2;
  grid-row: 1;
  display: block;
  width: 100%;
  max-width: 760px;
  justify-self: end;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  pointer-events: none;
}
.v6-cta-visual::after { content: none; }
.v6-cta-visual img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  filter: drop-shadow(0 28px 44px rgb(0 0 0 / .26));
}
.v6-cta-benefits { grid-column: 1 / -1; grid-row: 2; padding-bottom: 46px; }

@media(max-width:1023px) {
  .v6-cta-layout { grid-template-columns: minmax(0,.9fr) minmax(390px,1.1fr); gap: 16px 20px; }
  .v6-cta-copy { padding-top: 66px; }
}
@media(max-width:767px) {
  .v6-cta-layout { min-height: 0; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 22px; overflow: visible; }
  .v6-cta-copy { grid-column: 1; grid-row: 1; padding: 58px 0 0; }
  .v6-cta-visual { grid-column: 1; grid-row: 2; width: min(100%,620px); height: auto; justify-self: center; overflow: visible; border: 0; background: transparent; }
  .v6-cta-benefits { grid-column: 1; grid-row: 3; padding-bottom: 54px; }
}

/* Final CTA: use the exact supplied transparent channel-convergence artwork.
   The floor reflection remains a CSS layer so the artwork keeps its alpha. */
.ch-v6 .v6-cta-band {
  position: relative;
  overflow: clip;
  min-height: 560px;
  background-color: #07101f;
  background-image:
    linear-gradient(90deg, #07101f 0%, rgb(7 16 31 / .98) 30%, rgb(7 16 31 / .74) 46%, transparent 68%),
    radial-gradient(ellipse at 78% 98%, rgb(45 127 249 / .24), transparent 42%),
    url("images/cta-channel-convergence-1536.webp");
  background-repeat: no-repeat;
  background-position: center, 82% 100%, right 1% center;
  background-size: cover, 52% 30%, min(55vw, 780px) auto;
}
.ch-v6 .v6-cta-band::after {
  content: '';
  position: absolute;
  z-index: 0;
  right: 4%;
  bottom: 0;
  width: min(56vw, 820px);
  height: 24%;
  pointer-events: none;
  background: radial-gradient(ellipse at 56% 12%, rgb(91 160 255 / .34), transparent 64%);
  filter: blur(18px);
}
.v6-cta-layout {
  position: relative;
  z-index: 1;
  min-height: 560px;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr auto;
  gap: 22px;
}
.v6-cta-copy {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: min(47%, 590px);
  padding-block: 72px 22px;
}
.v6-cta-benefits { grid-column: 1; grid-row: 2; padding-bottom: 44px; }

/* Cross-width and density refinement. */
.ch-v6 .v6-hero-title { font-size: clamp(2.35rem, calc(3.3vw + 1.55rem), 4.5rem); }
.v6-card,
.v6-card:nth-child(n+3) { min-height: 220px; }
.v6-step { min-height: 230px; padding: 24px; }
.v6-proof-note { margin-top: 22px !important; color: var(--text-secondary); font-size: .875rem !important; line-height: 1.6; }

@media(min-width:1180px) {
  .v6-hero { grid-template-columns: minmax(0,.82fr) minmax(560px,1.18fr); gap: clamp(24px,3vw,48px); }
}
@media(max-width:1179px) {
  .v6-hero { grid-template-columns: 1fr; gap: 34px; }
  .v6-hero-copy { max-width: 760px; }
  .v6-hero .v6-scene { justify-self: center; }
}
@media(max-width:767px) {
  .v6-hero { gap: 26px; }
  .v6-hero .v6-scene-stage { aspect-ratio: 1.1; }
  .v6-step { min-height: 0; }
  .ch-v6 .v6-cta-band {
    min-height: 880px;
    background-image:
      linear-gradient(180deg, #07101f 0%, #07101f 36%, rgb(7 16 31 / .9) 49%, transparent 70%),
      radial-gradient(ellipse at 50% 98%, rgb(45 127 249 / .3), transparent 48%),
      url("images/cta-channel-convergence-768.webp");
    background-position: center top, center bottom, center bottom;
    background-size: 100% 100%, 100% 30%, 100% auto;
  }
  .ch-v6 .v6-cta-band::after { right: 0; width: 100%; height: 20%; bottom: 3%; filter: blur(16px); }
  .v6-cta-layout { min-height: 880px; grid-template-columns: 1fr; grid-template-rows: auto 1fr auto; gap: 18px; }
  .v6-cta-copy { grid-column: 1; grid-row: 1; width: 100%; padding: 56px 0 0; }
  .v6-cta-benefits { grid-column: 1; grid-row: 3; padding-bottom: 46px; }
}
@media(max-width:599px) {
  .v6-scope-block,
  .v6-editorial-grid > div { grid-template-columns: 42px minmax(0,1fr); column-gap: 14px; }
  .v6-scope-icon,
  .v6-editorial-icon { grid-column: 1; grid-row: 1; align-self: start; }
  .v6-scope-block h3,
  .v6-editorial-grid h3 { grid-column: 2; grid-row: 1; align-self: center; margin: 0; }
  .v6-scope-block > :not(.v6-scope-icon):not(h3),
  .v6-editorial-grid > div > :not(.v6-editorial-icon):not(h3) { grid-column: 1 / -1; }
  .v6-scope-block p,
  .v6-editorial-grid p { margin-top: 16px; }
}

/* Restored hero artwork and its original panoramic proportion. */
.v6-scene-convergence {
  width: 100%;
  max-width: 720px;
  justify-self: end;
}
.v6-scene-convergence-art,
.v6-scene-convergence-art img { display: block; width: 100%; height: auto; }
.v6-scene-convergence-art img {
  aspect-ratio: 3 / 2;
  object-fit: contain;
  filter: drop-shadow(0 30px 56px rgb(0 0 0 / .26));
}
@media(min-width:1024px) {
  .v6-hero { grid-template-columns: minmax(0,.92fr) minmax(440px,1.08fr); gap: clamp(28px,3vw,46px); align-items: center; }
}
@media(max-width:1023px) {
  .v6-hero { grid-template-columns: 1fr; gap: 32px; }
  .v6-scene-convergence { max-width: 680px; justify-self: center; }
}
@media(max-width:767px) {
  .v6-hero { gap: 22px; }
  .v6-scene-convergence { max-width: 460px; }
}

/* The channel-convergence attachment belongs to the CTA. The hero keeps the
   approved Google/Meta interface composition with the opportunity artwork. */
.v6-hero .v6-scene {
  width: 100%;
  max-width: 650px;
  justify-self: end;
  transform: none;
}
.v6-hero .v6-scene-stage { aspect-ratio: 1.16; }
.v6-hero .v6-scene-search-group { width: 57%; left: 0; top: 4%; }
.v6-hero .v6-scene-search,
.v6-hero .v6-scene-platform-search { transform: rotate(-3deg); }
.v6-hero .v6-scene-meta-group { width: 42%; right: 0; top: 8%; }
.v6-hero .v6-scene-meta,
.v6-hero .v6-scene-platform-meta { transform: rotate(4deg); }
.v6-hero .v6-scene-creative-copy { width: 64%; padding-top: 4.3cqw; }
.v6-hero .v6-scene-creative-copy > strong { max-width: 25cqw; font-size: 2.8cqw; }
.v6-hero .v6-scene-landing { width: 74%; left: 20%; top: 53%; transform: rotate(2deg); }

@media (max-width: 1023px) {
  .v6-hero .v6-scene {
    width: min(100%, 680px);
    max-width: 680px;
    justify-self: center;
  }
}
@media (max-width: 767px) {
  .v6-hero { gap: 26px; }
  .v6-hero .v6-scene {
    width: 100%;
    max-width: 460px;
    margin-inline: auto;
  }
  .v6-hero .v6-scene-stage { aspect-ratio: .97; }
  .v6-hero .v6-scene-search,
  .v6-hero .v6-scene-platform-search { transform: rotate(-2deg); }
  .v6-hero .v6-scene-meta,
  .v6-hero .v6-scene-platform-meta { transform: rotate(3deg); }
  .v6-hero .v6-scene-landing { left: 15%; width: 76%; top: 55%; transform: rotate(1deg); }
}

/* The approved CTA artwork is an exact image inside the content wrap. */
.ch-v6 .v6-cta-band {
  overflow: visible;
  min-height: 0;
  background: radial-gradient(ellipse 70% 80% at 76% 62%, rgb(45 127 249 / .09), transparent 62%), #07101f;
}
.v6-cta-layout {
  min-height: 560px;
  grid-template-columns: minmax(0,1.08fr) minmax(500px,.92fr);
  grid-template-rows: 1fr auto;
  gap: 20px 32px;
  align-items: center;
  overflow: visible;
}
.v6-cta-copy {
  position: relative;
  z-index: 2;
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  max-width: 650px;
  padding-block: 72px 26px;
}
.v6-cta-visual {
  position: relative;
  z-index: 1;
  grid-column: 2;
  grid-row: 1;
  width: min(100%, 700px);
  max-width: 700px;
  justify-self: end;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  pointer-events: none;
  isolation: isolate;
}
.v6-cta-visual::after {
  content: '';
  position: absolute;
  z-index: 0;
  left: 8%;
  right: 8%;
  bottom: 1%;
  height: 22%;
  background: radial-gradient(ellipse at 50% 8%, rgb(91 160 255 / .42), transparent 68%);
  filter: blur(18px);
  transform: translateY(20%) scaleY(.52);
}
.v6-cta-visual img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 28px 44px rgb(0 0 0 / .26));
}
.v6-cta-benefits { grid-column: 1 / -1; grid-row: 2; padding-bottom: 44px; }

@media (max-width: 1023px) {
  .v6-cta-layout { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 16px 20px; }
  .v6-cta-visual { width: min(100%, 620px); }
}
@media (max-width: 1099px) and (min-width: 768px) {
  .v6-cta-layout { min-height: 0; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 18px; }
  .v6-cta-copy { grid-column: 1; grid-row: 1; max-width: 700px; padding: 66px 0 0; }
  .v6-cta-visual { grid-column: 1; grid-row: 2; width: min(100%, 700px); justify-self: end; }
  .v6-cta-benefits { grid-column: 1; grid-row: 3; padding-bottom: 46px; }
}
@media (max-width: 767px) {
  .ch-v6 .v6-cta-band { min-height: 0; }
  .v6-cta-layout { min-height: 0; grid-template-columns: 1fr; grid-template-rows: auto auto auto; gap: 18px; }
  .v6-cta-copy { grid-column: 1; grid-row: 1; padding: 58px 0 0; }
  .v6-cta-visual { grid-column: 1; grid-row: 2; width: min(100%, 620px); justify-self: center; }
  .v6-cta-benefits { grid-column: 1; grid-row: 3; padding-bottom: 54px; }
}

/* The institutional footer reserves top space for its overlap on generic pages.
   This pilot's CTA occupies that space, so keep the footer after the CTA. */
body.paid-pilot .site-footer {
  margin-top: 0;
  padding-top: clamp(56px, 6vw, 88px);
}
