/* Agency theme: semantic aliases, reading controls, photography, and motion.
 * Keep the HTML stylesheet order: specificity and module order define the cascade.
 */

/* Theme aliases */

.agency-ledger {
  --agency-ground: var(--color-opening-ground);
  --agency-ink: var(--color-opening-ink);
  --agency-accent: var(--color-opening-accent);
  --agency-paper: var(--color-reading-ground);
  --agency-paper-ink: var(--color-reading-ink);
  --agency-display: var(--font-editorial-display);
  --agency-body: var(--font-editorial-body);
}

.redesign.agency {
  --new-ground: var(--agency-ground);
  --new-ink: var(--agency-ink);
  --new-accent: var(--agency-accent);
  --new-paper: var(--agency-paper);
  --new-paper-ink: var(--agency-paper-ink);
  --new-display: var(--agency-display);
  --new-body: var(--agency-body);
  --line: color-mix(in srgb,var(--color-reading-ink) 24%,var(--color-reading-ground));
}

.redesign.agency :is(.nav-contact,.button--top,.button-primary,.button--primary,.toc-cta) {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: var(--color-white);
}

.redesign.agency :is(.nav-contact,.button--top,.button-primary,.button--primary,.toc-cta):hover {
  background: var(--color-brand-hover);
  border-color: var(--color-brand-hover);
  color: var(--color-white);
}

.redesign.agency .site-header :is(.site-logo,.wordmark) {
  font-family: var(--agency-display);
}

.redesign.agency .craft-scene::before {
  background: var(--color-signal);
}

.redesign.agency .article-toc nav a.active {
  border-color: var(--color-brand);
  color: var(--color-brand);
}

@media (min-width: 1000px) {
  .redesign.agency .agency-ledger h1 {
    max-width: 25ch;
  }
}

.redesign.agency .inner-runway .inner-grid {
  min-height: 0;
  padding-block: 0;
}

.redesign.agency :is(.article-section--case,.article-section--tool,.case-inline-callout) {
  background: color-mix(in srgb,var(--color-illustration) 15%,var(--color-reading-ground));
  color: var(--color-reading-ink);
  border-color: var(--line);
}

.redesign.agency :is(.article-section--case,.article-section--tool,.case-inline-callout) :is(h2,h3,p,li) {
  color: inherit;
}

@media (max-width:760px) {
  .redesign.agency .inner-runway .inner-stage {
    min-height: 0;
  }
}

body:has([data-spatial-hero]) .site-header {
  background: color-mix(in srgb,var(--new-ground) 84%,transparent);
  backdrop-filter: blur(16px) saturate(140%);
}

/* Reading surfaces and chapter feedback */

body.agency-ledger {
  --ledger-action: var(--color-action);
  --ledger-ink: var(--color-ledger-ink);
  --ledger-paper: var(--color-reading-ground);
}

.redesign.agency-ledger :is(.nav-contact,.button-primary,.button--primary,.toc-cta) {
  background: var(--ledger-action);
  border-color: var(--ledger-action);
  color: var(--color-white);
  box-shadow: none;
}

.redesign.agency-ledger :is(.nav-contact,.button-primary,.button--primary,.toc-cta):hover {
  background: var(--color-action-hover);
  border-color: var(--color-action-hover);
  color: var(--color-white);
  transform: none;
  box-shadow: none;
}

body.agency-ledger main .resource-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: .35rem;
  background: transparent;
}

body.agency-ledger main .resource-grid > .resource-card {
  min-height: 0;
  border: 0;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  background: var(--ledger-paper);
  color: var(--ledger-ink);
  box-shadow: none;
  transform: none;
}

body.agency-ledger main .resource-grid .resource-card :is(h3,a,p,.card-type,.card-arrow) {
  color: inherit;
}

body.agency-ledger main .resource-grid .resource-card .card-arrow {
  transform: none;
  translate: none;
  pointer-events: none;
}

body.agency-ledger main .resource-grid .resource-card h3 a:is(:hover,:focus-visible),
.redesign.agency-ledger .article-toc nav a[data-toc]:is(.active,:hover,:focus-visible) {
  text-decoration: underline;
  text-underline-offset: .18em;
}

.redesign.agency-ledger .article-toc nav a[data-toc]:is(.active,:hover,:focus-visible) {
  color: var(--ledger-ink);
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

@media (prefers-reduced-motion: no-preference) {
  .ledger-arriving {
    animation: ledger-arrival 680ms cubic-bezier(.2,.65,.25,1);
  }

  @keyframes ledger-arrival {
    from {
      opacity: .38;
      translate: 0 28px;
    }

    to {
      opacity: 1;
      translate: 0 0;
    }
  }
}

@media (min-width: 761px) and (max-width: 979px) {
  .redesign.agency .inner-runway .inner-stage {
    align-content: center;
  }
}

/* Photographic subpage openings */

.redesign.agency .inner-runway .editorial-photo-hero {
  position: relative;
  isolation: isolate;
  align-content: start;
  min-height: clamp(37rem, 88svh, 65rem);
  padding-block: clamp(3rem, 12svh, 8rem) 4rem;
  background: #08131f;
  color: var(--color-white);
}

.editorial-photo-hero__image,
.editorial-photo-hero::before {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.editorial-photo-hero__image {
  object-fit: cover;
  object-position: 60% center;
  z-index: -2;
}

.editorial-photo-hero::before {
  content: "";
  z-index: -1;
  background: linear-gradient(90deg, #06101de8, #06101dba 34%, transparent 76%);
}

.redesign.agency .inner-runway .editorial-photo-hero > .inner-grid {
  display: block;
}

.redesign.agency .editorial-photo-hero .inner-grid > :first-child {
  max-width: min(42rem, 56%);
  grid-column: auto;
}

.redesign.agency .editorial-photo-hero .inner-grid h1 {
  font-size: clamp(2.25rem, 4.8vw, 5.2rem);
  overflow-wrap: break-word;
}

.redesign.agency .editorial-photo-hero .inner-grid .inner-next {
  text-decoration: none;
  border-bottom: 0;
}

/* Publication ledger: a calm transition from the cover into the reading tools. */
.publication-record {
  background: var(--ledger-paper);
  color: var(--ledger-ink);
}

.publication-meta {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) repeat(2, minmax(0, 1fr));
  gap: 1.5rem 2rem;
  margin: 0;
  padding-block: 1.75rem;
  border-bottom: 1px solid currentColor;
}

.publication-meta > div {
  min-width: 0;
}

.publication-meta dt {
  margin: 0 0 .5rem;
  font-size: .75rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.publication-meta dd {
  margin: 0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

@media (max-width: 600px) {
  .publication-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
    padding-block: 1.5rem;
  }

  .publication-meta > div:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .redesign.agency .inner-runway .editorial-photo-hero {
    min-height: 82svh;
    padding-block: 2.5rem clamp(12rem, 42svh, 24rem);
    text-align: center;
  }

  .editorial-photo-hero::before {
    background: linear-gradient(#06101df5, #06101dd9 36%, transparent 72%);
  }

  .redesign.agency .editorial-photo-hero .inner-grid > :first-child {
    max-width: none;
  }

  .redesign.agency .editorial-photo-hero .inner-grid h1 {
    font-size: clamp(2rem, 8vw, 3.4rem);
  }

  .redesign.agency .editorial-photo-hero .inner-grid :is(.hero-deck,.route-hero__copy > p) {
    margin-inline: auto;
  }

  .redesign.agency .editorial-photo-hero .inner-grid :is(.hero-actions,.hero-buttons) {
    justify-content: center;
  }
}

.redesign.agency main :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

@media (prefers-reduced-motion: no-preference) {
  .editorial-photo-hero__image,
  .buyer-brief .brief-film video {
    --hero-travel: 5%;
    transform: translateY(calc(var(--hero-scroll, 0) * var(--hero-travel)))
      scale(calc(1 + var(--hero-scroll, 0) * .12));
    transform-origin: center;
  }

  .ledger-support.ledger-arriving {
    animation-delay: 70ms;
    animation-fill-mode: backwards;
  }
}

@media (max-width: 760px) and (prefers-reduced-motion: no-preference) {
  .editorial-photo-hero__image,
  .buyer-brief .brief-film video {
    --hero-travel: 2.5%;
  }
}

.case-chapter-cue {
  font-weight: 700;
  color: var(--ledger-ink, #172636);
  margin: .35rem 0 var(--space-4);
}

/* Reading progress is added through dataset.readingProgress in site.js.
 * Attribute suffix selectors preserve mobile photographic framing. */

.article-toc nav[data-reading-progress] {
  position: relative;
  isolation: isolate;
  border-inline-start: 0;
}

.article-toc nav[data-reading-progress]::before,
.article-toc nav[data-reading-progress]::after {
  content: "";
  position: absolute;
  inset: var(--rail-start, 0px) auto auto 0;
  width: 2px;
  height: max(0px, calc(var(--rail-end, 0px) - var(--rail-start, 0px)));
  pointer-events: none;
}

.article-toc nav[data-reading-progress]::before {
  background: var(--ledger-action);
  transform: scaleY(var(--reading-progress, 0));
  transform-origin: top;
}

.article-toc nav[data-reading-progress]::after {
  background: var(--color-progress-track);
  z-index: -1;
}

@media (prefers-reduced-motion: reduce) {
  .article-toc nav[data-reading-progress]::before {
    transform: none;
  }
}

@media (max-width: 760px) {
  .editorial-photo-hero__image[src$="-leads.png"] {
    object-position: 78% center;
  }

  .editorial-photo-hero__image[src$="-services.png"] {
    object-position: 72% center;
  }

  .editorial-photo-hero__image[src$="-contact.png"] {
    object-position: 66% center;
  }
}