.mobile-consent-copy { display: none; }
/* Descenders and italic overhang need space inside the line box. */
.hero .hero-title-line:last-child { line-height: 1.16; }
.hero .hero-title, .hero .hero-title-line, .hero .hero-word { overflow: visible; }
.hero .hero-title-line:last-child .hero-word { padding-bottom: .16em; margin-bottom: -.16em; }
@media (max-width: 767px) {
  .hero {
    --mobile-hero-media-height: clamp(25rem, 66svh, 39rem);
    min-height: 100svh;
    background: var(--brand-ivory-light);
  }
  .hero::before, .hero .header-motion-film {
    top: 0; bottom: auto;
    height: var(--mobile-hero-media-height);
    object-position: var(--hero-media-position);
  }
  .hero::before { background-size: cover; background-position: var(--hero-media-position); }
  .hero .hero-overlay {
    background: linear-gradient(180deg, transparent 0%,
      transparent calc(var(--mobile-hero-media-height) * .54),
      color-mix(in srgb, var(--brand-ivory-light) 34%, transparent) calc(var(--mobile-hero-media-height) * .72),
      var(--brand-ivory-light) var(--mobile-hero-media-height));
  }
  .hero .hero-content {
    min-height: 100svh; align-items: flex-start;
    padding-top: calc(var(--mobile-hero-media-height) - 6rem);
    padding-bottom: 3rem;
  }
  .hero .hero-title-line:last-child { padding-left: .55em; }
  html[data-mobile-hero-copy="pending"] .hero :is(.hero-byline,.hero-word,.hero-summary,.hero-actions) {
    animation: none !important; opacity: 0; visibility: hidden; pointer-events: none;
  }
  html[data-mobile-hero-copy="visible"] .hero.is-live .hero-word {
    animation: mobile-hero-copy-in .85s cubic-bezier(.16,1,.3,1) both;
    animation-delay: calc(var(--line-index) * 110ms);
  }
  html[data-mobile-hero-copy="visible"] .hero.is-live .hero-byline { animation: mobile-hero-copy-in .7s ease both; }
  html[data-mobile-hero-copy="visible"] .hero.is-live .hero-summary { animation: mobile-hero-copy-in .85s ease both; }
  html[data-mobile-hero-copy="visible"] .hero.is-live .hero-actions { animation: mobile-hero-copy-in .85s .15s ease both; }
  html[data-mobile-consent-hold] :is(.consent-card,.consent-preview-trigger) { display: none !important; }
  .consent-card {
    left: .65rem; right: .65rem;
    bottom: max(.65rem,env(safe-area-inset-bottom));
    width: auto; max-height: min(52svh,24rem);
    padding: 1rem; gap: .65rem;
    grid-template-columns: minmax(0,1fr);
    border-radius: 22px;
  }
  .consent-card > :is(.consent-card-mark,.consent-card-copy) { display: none; }
  .consent-card > .mobile-consent-copy { display: block; grid-row: 1; position: relative; z-index: 1; }
  .consent-card .mobile-consent-copy h2 { margin: 0 0 .4rem; font-size: 1.18rem; line-height: 1.22; letter-spacing: -.035em; }
  .consent-card .mobile-consent-copy p { margin: 0; font-size: .78rem; line-height: 1.5; color: var(--brand-text); }
  .consent-card .consent-card-actions { grid-row: 2; grid-column: 1; gap: .4rem; margin: 0; }
  .consent-card .consent-choice { min-height: 44px; padding: .5rem .55rem; font-size: .74rem; white-space: normal; }
  .consent-card .consent-settings-link { min-height: 36px; font-size: .72rem; padding: .2rem; }
  html[data-mobile-consent-compact] .consent-card { padding: .7rem .8rem; gap: .35rem; border-radius: 18px; }
  html[data-mobile-consent-compact] .consent-card .mobile-consent-copy h2 { display: none; }
  html[data-mobile-consent-compact] .consent-card .mobile-consent-copy p { font-size: .73rem; line-height: 1.4; }
  html[data-mobile-consent-compact] .consent-card .consent-card-actions { column-gap: .35rem; row-gap: 0; }
  .consent-card .consent-glass {
    -webkit-backdrop-filter: blur(12px) saturate(1.55);
    backdrop-filter: blur(12px) saturate(1.55);
    background: linear-gradient(155deg, rgba(var(--glass-highlight),.29),rgba(var(--glass-tint),.76) 25%,rgba(var(--glass-tint),.69) 80%,rgba(var(--glass-highlight),.24));
    box-shadow: inset 0 1px 1px rgba(var(--glass-highlight),.9),inset 1px 0 2px rgba(var(--glass-highlight),.4),inset 0 -1px 1px rgba(var(--glass-highlight),.6),0 8px 30px rgba(2,15,30,.14);
  }
  @media (prefers-reduced-motion: reduce) {
    html[data-mobile-hero-copy] .hero.is-live :is(.hero-word,.hero-byline,.hero-summary,.hero-actions) { animation: none; opacity: 1; visibility: visible; }
  }
  @media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
    .consent-card .consent-glass,.consent-card .consent-glass.has-refraction { background:var(--brand-ivory);-webkit-backdrop-filter:none;backdrop-filter:none; }
  }
}
@keyframes mobile-hero-copy-in {
  from { opacity: 0; transform: translate3d(0,1.2rem,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}

/* Mobile editorial rhythm. Loaded after the frozen site's section styles.
   Colour endpoints match the neighbouring section in both themes. */
@media (max-width: 767px) {
  html { --page-gutter: clamp(1.25rem, 5.6vw, 2.5rem); --section-space: clamp(4.5rem, 15vw, 6.5rem); }
  main > section { scroll-margin-top: 1.5rem; }
  main > section .container { min-width: 0; }

  main > section .display-title {
    font-size: clamp(2rem, 8.9vw, 3.65rem);
    line-height: 1.1;
    letter-spacing: -.04em;
    text-wrap: balance;
    word-break: normal;
    overflow-wrap: break-word;
    -webkit-hyphens: auto;
    hyphens: auto;
    padding-bottom: .1em;
  }
  main .collaboration-section .display-title.collaboration-title,
  main .pricing-section .display-title {
    font-size: clamp(1.9rem, 8.3vw, 3.4rem);
    line-height: 1.13;
    letter-spacing: -.038em;
  }
  main > section .display-title > span {
    max-width: 100%; white-space: normal; overflow-wrap: break-word; hyphens: auto;
  }
  main > section :is(.eyebrow, .about-byline, .hero-byline, .collaboration-overline) {
    font-size: .72rem; letter-spacing: .15em; line-height: 1.65;
    margin-bottom: 1.2rem;
  }
  main > section :is(.lead, .about-intro, .about-profile, .hero-body) {
    font-size: 1rem; line-height: 1.75; text-wrap: pretty;
  }
  main > section .gold-rule { width: 3.25rem; margin-block: 1.6rem 1.75rem; height: 1px; }
  main > section :is(.section-heading, .expertise-heading, .mandates-heading, .case-studies-heading, .pricing-heading) {
    gap: 1.75rem;
  }
  main .hero .hero-title, main .about-section .about-title {
    font-size: clamp(2.15rem, 10.1vw, 4.35rem);
    line-height: 1.14; letter-spacing: -.06em;
  }
  main .hero .hero-title-line:last-child,
  main .about-section .about-title-line:last-child {
    font-size: 1.26em; line-height: 1.16; padding-left: .42em;
  }
  main .about-section .about-title-word { padding-bottom: .1em; margin-bottom: -.1em; }
  main .hero .hero-summary { margin-top: 1.85rem; }
  main .hero .hero-content { padding-bottom: 4rem; }
  main .about-section .about-narrative { margin-top: 1.6rem; gap: 2rem; }
  main .about-section .about-quote { margin-top: 3rem; }
  main .about-section .about-quote blockquote {
    font-size: clamp(1.55rem, 6.5vw, 2.35rem); line-height: 1.35;
    letter-spacing: -.035em; text-wrap: balance;
  }
  main > section :is(.mandate-card, .case-study-card, .about-card) h3 {
    font-size: clamp(1.4rem, 6vw, 2rem); line-height: 1.22;
    letter-spacing: -.025em; hyphens: auto; text-wrap: balance;
  }
  main .principle h3 { font-size: .88rem; letter-spacing: .1em; line-height: 1.5; }
  main .principle p { font-size: .95rem; line-height: 1.7; }

  /* Keep the particle titles separate from the readable headings. */
  main > section:has(> .section-word):not(.about-section) {
    --particle-word-top: clamp(3.75rem, 14vw, 5.5rem);
    --particle-type-size: clamp(2.4rem, 11vw, 5rem);
  }
  main > .section:has(> .section-word):not(.about-section) {
    padding-top: calc(var(--particle-word-top) + var(--particle-type-size) * 1.1 + 3rem);
  }
  /* The contact portrait needs its own space, like the other portrait sections. */
  main .contact-section:has(> .section-word) > .contact-inner {
    padding-top: clamp(29rem, 65svh, 37rem);
    padding-bottom: var(--section-space);
  }
  main .collaboration-section { margin-top: 0; }

  /* Fixed-length fades stay gradual even when the mobile content is very tall. */
  html main .expertise-section .expertise-wash {
    background:
      linear-gradient(180deg, var(--brand-cream), color-mix(in srgb, var(--brand-cream) 82%, transparent) 3rem, transparent 15rem),
      linear-gradient(0deg, var(--brand-ivory-light), transparent 14rem),
      linear-gradient(90deg, color-mix(in srgb, var(--brand-ivory) 97%, transparent), color-mix(in srgb, var(--brand-ivory) 78%, transparent));
  }
  html main .mandates-section {
    background:
      radial-gradient(ellipse at 85% 45%, color-mix(in srgb, var(--brand-champagne) 7%, transparent), transparent 65%),
      linear-gradient(180deg, var(--brand-ivory-light), var(--brand-cream));
  }
  html main .case-studies-section {
    border-block: 0;
    background: linear-gradient(180deg, var(--brand-cream), var(--brand-ivory-light) 14rem, var(--brand-ivory-light));
  }
  main .focus-section :is(.focus-background, .focus-overlay) {
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 14rem);
    mask-image: linear-gradient(180deg, transparent, #000 14rem);
  }
  main .focus-section::before {
    height: clamp(15rem, 40vw, 20rem);
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--brand-cream) 20%, transparent) 22%, color-mix(in srgb, var(--brand-cream) 76%, transparent) 68%, var(--brand-cream) 100%);
  }
  main .perspective-section { border-top: 0; }
  main .perspective-section .perspective-visual {
    -webkit-mask-image: linear-gradient(180deg, transparent, rgba(0,0,0,.25) 7%, #000 22%, #000 52%, rgba(0,0,0,.7) 73%, transparent);
    mask-image: linear-gradient(180deg, transparent, rgba(0,0,0,.25) 7%, #000 22%, #000 52%, rgba(0,0,0,.7) 73%, transparent);
  }
  main .collaboration-section .collaboration-background {
    -webkit-mask-image: linear-gradient(180deg, transparent, rgba(0,0,0,.3) 8%, #000 21%, #000 54%, rgba(0,0,0,.7) 74%, transparent);
    mask-image: linear-gradient(180deg, transparent, rgba(0,0,0,.3) 8%, #000 21%, #000 54%, rgba(0,0,0,.7) 74%, transparent);
  }
  html main .pricing-section { background: var(--brand-cream); }
  main .pricing-section :is(.pricing-background, .pricing-overlay) {
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 13rem, #000 calc(100% - 13rem), transparent);
    mask-image: linear-gradient(180deg, transparent, #000 13rem, #000 calc(100% - 13rem), transparent);
  }
  main .contact-section .contact-overlay {
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 7rem);
    mask-image: linear-gradient(180deg, transparent, #000 7rem);
  }
  main .future-outlook-section::before {
    height: clamp(10rem, 35vw, 15rem);
    background: linear-gradient(180deg, var(--brand-cream), color-mix(in srgb, var(--brand-cream) 85%, transparent) 22%, color-mix(in srgb, var(--brand-cream) 30%, transparent) 65%, transparent);
  }
  main .future-outlook-title {
    font-size: clamp(2.25rem, 10.3vw, 3.8rem);
    line-height: 1.1; letter-spacing: -.04em; text-wrap: balance;
    hyphens: auto; padding-bottom: .14em;
  }
}