/* Static CRAFT identity. The paint animation is reserved for actual loading states. */
header nav > a:first-child > svg[viewBox="0 0 22 22"],
footer svg[viewBox="0 0 22 22"] {
  width: 30px; height: 30px; flex-shrink: 0;
  background: url('/brand/releases/logo-20260917/craft-mark-ink.svg') center / contain no-repeat;
}
header nav > a:first-child > svg[viewBox="0 0 22 22"] > *,
footer svg[viewBox="0 0 22 22"] > * { visibility: hidden; }

@media (max-width: 1050px) {
  header nav > a:first-child > span { display: none; }
  header nav > ul { gap: 0; }
  header nav > ul a { padding-inline: 8px; }
}
@media (max-width: 767px) {
  header { padding: 12px 14px 0 !important; }
  header nav { padding: 7px 7px 7px 12px; gap: 10px; background: rgba(249,250,251,.96); border: 1px solid #e4e4e7; }
  header nav > a:first-child { gap: 7px; flex-shrink: 0; }
  header nav > a:first-child > div { gap: 3px; }
  header nav > a:first-child > div > span:first-child { font-size: 13px; }
  header nav > a:first-child > div > span:last-child { font-size: 9px; letter-spacing: .05em; }
  header nav > a:first-child > svg[viewBox="0 0 22 22"] { width: 27px; height: 27px; }
  header nav > div { min-width: 0; }
  header nav > div > a:is([href="#brief"], [data-craft-meeting="true"]) { padding: 11px 13px; font-size: 12px; white-space: nowrap; }
  header nav > div > a:is([href="#brief"], [data-craft-meeting="true"]) svg { width: 12px; }

  section:has(video[src="/hero2.mp4"]) { min-height: auto; }
  section:has(video[src="/hero2.mp4"]) div:has(> h1) {
    padding: 108px 23px 30px; align-items: flex-start; text-align: left;
  }
  section:has(video[src="/hero2.mp4"]) div:has(> h1) > div:first-child { margin-bottom: 25px; }
  section:has(video[src="/hero2.mp4"]) div:has(> h1) > div:first-child > span:last-child { font-size: 9px; letter-spacing: .13em; }
  section:has(video[src="/hero2.mp4"]) h1 { font-size: clamp(34px, 9.5vw, 46px); line-height: 1.04; letter-spacing: -.045em; }
  section:has(video[src="/hero2.mp4"]) h1 + p { font-size: 14px; line-height: 1.65; margin-top: 22px; }
  /* The methodology is already present in the phase strip immediately below. */
  section:has(video[src="/hero2.mp4"]) h1 + p + div { display: none; }
  section:has(video[src="/hero2.mp4"]) div:has(> a:is([href="#brief"], [data-craft-meeting="true"])):has(> a:is([href="#pillars"], [data-craft-film="true"])) {
    margin-top: 25px; width: 100%; gap: 8px; align-items: stretch;
  }
  section:has(video[src="/hero2.mp4"]) div:has(> a:is([href="#brief"], [data-craft-meeting="true"])):has(> a:is([href="#pillars"], [data-craft-film="true"])) > a { justify-content: center; min-height: 46px; }
  section:has(video[src="/hero2.mp4"]) div:has(> h1) > div:last-child {
    grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px;
    margin-top: 27px; padding-top: 23px; text-align: left;
  }
  section:has(video[src="/hero2.mp4"]) div:has(> h1) > div:last-child > div > div:last-child { font-size: 10.5px; margin-inline: 0; }
  section:has(video[src="/hero2.mp4"]) > div:last-child { padding-inline: 23px; }
  section:has(video[src="/hero2.mp4"]) > div:last-child > div > div > div:last-child { grid-column: 1 / -1; border-top: 1px solid #e4e4e7; }
}
@media (max-width: 359px) {
  header nav > div > a:is([href="#brief"], [data-craft-meeting="true"]) { padding-inline: 10px; font-size: 11px; }
  header nav > div > a:is([href="#brief"], [data-craft-meeting="true"]) svg { display: none; }
  header nav > a:first-child > div > span:first-child { font-size: 12px; }
}