/* Authority + ecosystem experience.
   Motion has a job: make relationships, flow, focus and changing context visible.
   Static content remains complete when reduced motion is requested. */

.authority-research-nav .nav-sub { min-width: min(24rem, 80vw); }
.authority-page, .services-v4 { overflow: clip; }

/* --------------------------------------------------------------------------
   Services v4: living ecosystem, not stacked cards pretending to be a system
   -------------------------------------------------------------------------- */
.services-v4-hero {
  padding: clamp(4.5rem, 9vw, 9rem) 0 clamp(4rem, 8vw, 8rem);
}
.services-v4-hero-grid {
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(32rem,1.12fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center;
}
.services-v4-hero h1 {
  max-width: 11.5ch;
  margin: var(--s-4) 0 var(--s-5);
  font-size: clamp(3.2rem, 6.8vw, 7rem);
  line-height: .94;
  letter-spacing: -.058em;
}
.services-v4-hero .lead { max-width: 59ch; }
.services-v4-hero .cluster { margin-top: var(--s-6); }

.ecosystem-stage {
  --phase: 0;
  position: relative;
  min-height: 36rem;
  padding: clamp(1rem, 2vw, 1.6rem);
  border: 1px solid color-mix(in srgb, var(--line-strong) 72%, transparent);
  background:
    radial-gradient(circle at 54% 56%, color-mix(in srgb, var(--meridian) 12%, transparent), transparent 24%),
    radial-gradient(circle at 19% 30%, color-mix(in srgb, var(--electric) 7%, transparent), transparent 22%),
    linear-gradient(180deg, color-mix(in srgb, var(--paper) 94%, transparent), color-mix(in srgb, var(--paper-2) 84%, transparent));
  box-shadow: 0 28px 90px color-mix(in srgb, var(--ink) 8%, transparent);
  isolation: isolate;
}
.ecosystem-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    linear-gradient(color-mix(in srgb, var(--line) 62%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--line) 62%, transparent) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: radial-gradient(circle at 52% 54%, #000 0 48%, transparent 82%);
}
.ecosystem-stage-labels {
  position: absolute;
  z-index: 3;
  top: 1rem;
  left: 1rem;
  right: 1rem;
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  pointer-events: none;
}
.ecosystem-stage-labels span {
  padding: .42rem .6rem;
  font: 500 .66rem/1 var(--font-mono);
  letter-spacing: .11em;
  color: var(--ink-3);
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--paper) 72%, transparent);
  backdrop-filter: blur(12px);
  transition: opacity .35s ease, color .35s ease, border-color .35s ease, transform .35s ease;
}
.ecosystem-stage[data-phase="1"] [data-phase-label="1"],
.ecosystem-stage[data-phase="2"] [data-phase-label="2"],
.ecosystem-stage[data-phase="3"] [data-phase-label="3"] {
  color: var(--ink);
  border-color: var(--line-strong);
  transform: translateY(-2px);
}
.ecosystem-svg {
  position: relative;
  z-index: 2;
  width: 100%;
  height: auto;
  overflow: visible;
}
.eco-group-label {
  fill: var(--ink-3);
  font: 500 12px var(--font-mono);
  letter-spacing: .12em;
}
.eco-edge {
  fill: none;
  stroke: color-mix(in srgb, var(--line-strong) 78%, transparent);
  stroke-width: 1.15;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  opacity: .46;
  transition: opacity .45s ease, stroke-width .45s ease, stroke .45s ease;
}
.eco-edge.e1 { stroke-dasharray: 3 9; }
.eco-edge.e2 { stroke-dasharray: 1 7; }
.eco-edge.e3 { opacity: .28; }
.eco-node > circle:first-child {
  fill: var(--paper);
  stroke: var(--line-strong);
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
  transition: fill .35s ease, stroke .35s ease, opacity .35s ease;
}
.eco-node .halo {
  fill: none;
  stroke: var(--line);
  stroke-width: 1;
  opacity: .25;
  transition: opacity .35s ease, transform .35s ease;
  transform-box: fill-box;
  transform-origin: center;
}
.eco-node text {
  fill: var(--ink-2);
  font: 500 12px var(--font-mono);
  transition: opacity .35s ease, fill .35s ease;
}
.eco-focus > circle:first-child {
  fill: color-mix(in srgb, var(--paper) 84%, var(--ink) 16%);
  stroke: color-mix(in srgb, var(--electric) 56%, var(--line-strong));
  stroke-width: 1.5;
}
.eco-focus text { fill: var(--ink); font: 650 22px var(--font-sans); }
.eco-focus text.small { fill: var(--ink-3); font: 500 9px var(--font-mono); letter-spacing: .12em; }
.focus-ring {
  fill: none;
  stroke: color-mix(in srgb, var(--electric) 25%, var(--line));
  stroke-width: 1;
  stroke-dasharray: 4 9;
  transform-box: fill-box;
  transform-origin: center;
  opacity: .38;
}
.eco-particles circle { fill: var(--electric); }
.eco-lens ellipse {
  fill: none;
  stroke: color-mix(in srgb, var(--royal) 52%, transparent);
  stroke-width: 1.2;
  stroke-dasharray: 7 12;
  opacity: 0;
  transform-origin: center;
  transition: opacity .5s ease;
}
.ecosystem-caption {
  position: absolute;
  z-index: 3;
  left: clamp(1rem,3vw,2rem);
  right: clamp(1rem,3vw,2rem);
  bottom: 1rem;
  max-width: 64ch;
  margin: 0;
  padding-top: .75rem;
  border-top: 1px solid var(--line);
  color: var(--ink-3);
  font-size: .86rem;
}

/* Phase semantics: 1 = structure, 2 = continuous sensing/inquiry, 3 = strategic focus. */
.ecosystem-stage[data-phase="1"] .eco-brazil .halo,
.ecosystem-stage[data-phase="1"] .eco-external .halo { opacity: .55; transform: scale(1.12); }
.ecosystem-stage[data-phase="1"] .eco-brazil > .eco-node > circle:first-child { stroke: var(--meridian); }
.ecosystem-stage[data-phase="1"] .eco-edge { opacity: .58; }
.ecosystem-stage[data-phase="2"] .eco-focus .focus-ring { opacity: .75; }
.ecosystem-stage[data-phase="2"] .eco-edge { opacity: .72; stroke: color-mix(in srgb, var(--electric) 38%, var(--line-strong)); }
.ecosystem-stage[data-phase="2"] .eco-org .halo { opacity: .55; }
.ecosystem-stage[data-phase="3"] .eco-lens ellipse { opacity: .84; }
.ecosystem-stage[data-phase="3"] .eco-node .halo { opacity: .46; }
.ecosystem-stage[data-phase="3"] .eco-edge { opacity: .34; }
.ecosystem-stage[data-phase="3"] .eco-focus > circle:first-child { stroke: var(--royal); }

.services-v4-thesis {
  background: color-mix(in srgb, var(--paper-2) 72%, transparent);
}
.services-v4-thesis h2 {
  max-width: 14ch;
  font-size: clamp(2.6rem,5.3vw,5.2rem);
  line-height: .96;
  letter-spacing: -.05em;
}
.services-v4-thesis .lead { align-self: end; }
.services-v4-list { padding-top: 0; }
.service-v4 {
  display: grid;
  grid-template-columns: minmax(8rem,.22fr) minmax(0,1fr);
  gap: clamp(1.5rem,4vw,4rem);
  min-height: 72vh;
  padding: clamp(5rem,10vw,9rem) 0;
  border-top: 1px solid var(--line-strong);
  opacity: .48;
  transform: translateY(2rem);
  transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}
.service-v4:last-child { border-bottom: 1px solid var(--line-strong); }
.service-v4.is-active { opacity: 1; transform: translateY(0); }
.service-v4-rail {
  position: sticky;
  top: 7rem;
  align-self: start;
  display: grid;
  gap: 1rem;
}
.service-v4-rail > span {
  font: 500 clamp(3rem,5.5vw,6rem)/.88 var(--font-mono);
  letter-spacing: -.08em;
  color: var(--line-strong);
}
.service-v4[data-service-phase="2"] .service-v4-rail > span { color: var(--meridian); }
.service-v4[data-service-phase="3"] .service-v4-rail > span { color: var(--royal); }
.service-v4-rail small {
  max-width: 16ch;
  font: 500 .7rem/1.45 var(--font-mono);
  letter-spacing: .12em;
  color: var(--ink-3);
}
.service-v4-main h2 {
  max-width: 16ch;
  font-size: clamp(2.5rem,5vw,5.2rem);
  line-height: .96;
  letter-spacing: -.05em;
}
.service-v4-lead {
  max-width: 63ch;
  margin-top: var(--s-5);
  color: var(--ink-2);
  font-size: clamp(1.12rem,1.9vw,1.48rem);
}
.service-v4-grid {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(2rem,6vw,6rem);
  margin: clamp(3rem,7vw,6rem) 0;
}
.service-v4-grid ul { margin: 1rem 0 0; padding-left: 1.15rem; columns: 2; column-gap: 2.4rem; }
.service-v4-grid li { break-inside: avoid; margin-bottom: .72rem; color: var(--ink-2); }
.service-evidence {
  margin: 0 0 var(--s-6);
  padding: 1.4rem 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.service-evidence > div {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .65rem;
  margin-top: 1rem;
}
.service-evidence a {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .9rem 1rem;
  text-decoration: none;
  color: var(--ink);
  background: color-mix(in srgb, var(--paper-2) 72%, transparent);
  border: 1px solid transparent;
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.service-evidence a:hover,
.service-evidence a:focus-visible { transform: translateY(-2px); border-color: var(--line-strong); background: var(--paper-2); }
.service-evidence small { color: var(--ink-3); text-align: right; }
.services-v4-research h2 { max-width: 16ch; font-size: clamp(2.6rem,5vw,5rem); line-height: .98; letter-spacing: -.045em; }
.services-v4-research > .container > .btn { margin-top: var(--s-6); }

/* --------------------------------------------------------------------------
   Citation surface
   -------------------------------------------------------------------------- */
.authority-hero { padding: clamp(5rem,10vw,10rem) 0 clamp(3rem,7vw,7rem); }
.authority-hero h1 { max-width: 13ch; font-size: clamp(3.2rem,7vw,7rem); line-height: .94; letter-spacing: -.055em; }
.authority-hero .lead { max-width: 68ch; }
.authority-chain {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: clamp(2.5rem,5vw,4.5rem);
  font: 500 .72rem/1 var(--font-mono);
  letter-spacing: .1em;
  color: var(--ink-3);
}
.authority-chain span { padding: .65rem .8rem; border: 1px solid var(--line); background: var(--paper-2); }
.authority-chain i { font-style: normal; opacity: .46; }
.artifact-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.artifact-grid.compact { margin-top: var(--s-6); }
.artifact-card {
  display: flex;
  flex-direction: column;
  min-height: 25rem;
  padding: 1.4rem;
  color: var(--ink);
  text-decoration: none;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--paper) 94%, transparent);
  transition: transform .3s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .3s ease;
}
.artifact-card:hover,
.artifact-card:focus-visible { transform: translateY(-5px); border-color: var(--line-strong); box-shadow: 0 20px 55px color-mix(in srgb, var(--ink) 7%, transparent); }
.artifact-card-top { display: flex; justify-content: space-between; gap: 1rem; font: 500 .66rem/1.25 var(--font-mono); letter-spacing: .08em; color: var(--ink-3); }
.artifact-status { color: var(--meridian); }
.artifact-card h3 { margin: auto 0 1rem; max-width: 15ch; font-size: clamp(1.6rem,2.5vw,2.5rem); line-height: 1; letter-spacing: -.035em; }
.artifact-card p { color: var(--ink-2); }
.artifact-evidence { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.2rem; }
.artifact-evidence span { padding: .34rem .5rem; border: 1px solid var(--line); color: var(--ink-3); font: 500 .64rem/1.2 var(--font-mono); }
.artifact-evidence.large { gap: .55rem; }
.artifact-evidence.large span { padding: .6rem .7rem; }
.artifact-arrow { margin-top: 1.4rem; font-size: .86rem; }
.authority-model { background: color-mix(in srgb, var(--paper-2) 72%, transparent); }
.authority-model h2 { max-width: 14ch; font-size: clamp(2.3rem,4vw,4.5rem); line-height: .98; letter-spacing: -.045em; }
.artifact-proof { display: grid; grid-template-columns: 1fr .72fr; gap: clamp(2rem,6vw,6rem); align-items: center; }
.artifact-proof h2 { max-width: 18ch; font-size: clamp(2.3rem,4.7vw,4.8rem); line-height: .98; letter-spacing: -.045em; }
.artifact-flow { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 12rem; }
.artifact-flow::before { content:""; position:absolute; left:4%; right:4%; top:50%; height:1px; background:linear-gradient(90deg,transparent,var(--line-strong),transparent); }
.artifact-flow span { position:relative; width:.7rem; height:.7rem; border-radius:50%; background:var(--paper); border:1px solid var(--line-strong); box-shadow:0 0 0 .65rem color-mix(in srgb,var(--electric) 5%,transparent); }
.artifact-two { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,7vw,7rem); margin-top:clamp(4rem,8vw,8rem); }
.artifact-two ol { margin:1.3rem 0 0; padding-left:1.4rem; }
.artifact-two li { margin-bottom:1rem; color:var(--ink-2); }
.guide-links { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1rem; }
.guide-pill { padding:.65rem .8rem; border:1px solid var(--line); background:var(--paper-2); }
.citation-box { display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; padding:1.4rem; border:1px solid var(--line-strong); }
.citation-box p { margin:.55rem 0 0; font-family:var(--font-mono); color:var(--ink-2); }
.authority-note { margin-top:1rem; padding:1rem 1.2rem; background:var(--paper-2); }
.authority-note p { margin:.35rem 0 0; color:var(--ink-2); }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.guide-card { padding:1.6rem; border:1px solid var(--line); }
.guide-card > span { font:500 .7rem/1 var(--font-mono); color:var(--meridian); }
.guide-card h2 { max-width:20ch; margin:2rem 0 1rem; font-size:clamp(1.8rem,3vw,3rem); line-height:1; letter-spacing:-.035em; }
.guide-card p { color:var(--ink-2); }
.authority-entry { border-top:1px solid var(--line-strong); }
.authority-entry-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.authority-entry-grid a { display:block; padding:clamp(2rem,5vw,4rem); color:var(--ink); text-decoration:none; border:1px solid var(--line); background:var(--paper-2); transition:transform .25s ease,border-color .25s ease; }
.authority-entry-grid a:hover { transform:translateY(-3px); border-color:var(--line-strong); }
.authority-entry-grid h2 { max-width:12ch; margin-top:2rem; font-size:clamp(2rem,4vw,4rem); line-height:.98; letter-spacing:-.04em; }

@media (prefers-reduced-motion: no-preference) {
  .ecosystem-stage.is-live .eco-edge { animation: eco-flow 11s linear infinite; }
  .ecosystem-stage.is-live .eco-edge.e1 { animation-duration: 14s; }
  .ecosystem-stage.is-live .eco-edge.e2 { animation-duration: 8s; }
  .ecosystem-stage.is-live .focus-ring.r1 { animation: eco-spin 18s linear infinite; }
  .ecosystem-stage.is-live .focus-ring.r2 { animation: eco-spin-rev 27s linear infinite; }
  .ecosystem-stage.is-live .eco-node .halo { animation: eco-breathe 5.8s ease-in-out infinite; }
  .ecosystem-stage.is-live .eco-node.n1 .halo { animation-delay:-1.2s; }
  .ecosystem-stage.is-live .eco-node.n2 .halo { animation-delay:-2.4s; }
  .ecosystem-stage.is-live .eco-node.n3 .halo { animation-delay:-3.6s; }
  .ecosystem-stage.is-live .eco-lens ellipse { animation: eco-lens 9s ease-in-out infinite; }
  .artifact-flow span { animation: artifact-pulse 4.8s ease-in-out infinite; }
  .artifact-flow span:nth-child(2) { animation-delay:-.9s; }
  .artifact-flow span:nth-child(3) { animation-delay:-1.8s; }
  .artifact-flow span:nth-child(4) { animation-delay:-2.7s; }
  .artifact-flow span:nth-child(5) { animation-delay:-3.6s; }
  @keyframes eco-flow { to { stroke-dashoffset:-72; } }
  @keyframes eco-spin { to { transform:rotate(360deg); } }
  @keyframes eco-spin-rev { to { transform:rotate(-360deg); } }
  @keyframes eco-breathe { 0%,100%{transform:scale(.88);opacity:.18} 50%{transform:scale(1.16);opacity:.56} }
  @keyframes eco-lens { 0%,100%{transform:scale(.98);stroke-dashoffset:0} 50%{transform:scale(1.025);stroke-dashoffset:-45} }
  @keyframes artifact-pulse { 0%,100%{transform:scale(.78);opacity:.45} 45%{transform:scale(1.12);opacity:1} }
}

@media (max-width: 1040px) {
  .services-v4-hero-grid { grid-template-columns:1fr; }
  .ecosystem-stage { min-height:auto; }
  .artifact-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .services-v4-hero h1,.authority-hero h1 { font-size:clamp(2.7rem,13vw,4.5rem); }
  .ecosystem-stage { margin-inline:-.5rem; padding:.5rem; }
  .ecosystem-stage-labels { position:static; margin:.4rem .4rem 0; }
  .ecosystem-stage-labels span { font-size:.58rem; }
  .ecosystem-caption { position:static; margin:0 .6rem .6rem; }
  .service-v4 { grid-template-columns:1fr; min-height:auto; }
  .service-v4-rail { position:static; display:flex; align-items:baseline; justify-content:space-between; }
  .service-v4-grid,.artifact-proof,.artifact-two,.authority-entry-grid,.citation-box { grid-template-columns:1fr; }
  .service-v4-grid ul { columns:1; }
  .service-evidence > div { grid-template-columns:1fr; }
  .artifact-grid,.guide-grid { grid-template-columns:1fr; }
  .artifact-card { min-height:21rem; }
  .artifact-proof h2 { font-size:clamp(2rem,9vw,3.5rem); }
}

@media (prefers-reduced-motion: reduce) {
  .eco-particles { display:none; }
  .ecosystem-stage *, .service-v4, .artifact-card, .artifact-flow span { animation:none !important; transition-duration:.01ms !important; }
  .service-v4 { opacity:1; transform:none; }
}
