/* Shared mobile rhythm and type. Loaded after page-specific styles. */
.external-link-icon { display: inline-block; width: 15px; height: 15px; flex: none; vertical-align: middle; }
.tools-ribbon__track li::after { content: ""; width: 12px; height: 12px; flex: none; background: var(--color-accent); clip-path: polygon(50% 0%, 61% 36%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 36%); }

@media (max-width: 767px) {
  :root { --section-space: 64px; }
  body { font-size: 15px; }
  main h1 { font-size: clamp(32px, 8.5vw, 38px) !important; line-height: 1.09 !important; overflow-wrap: anywhere; }
  main h2 { font-size: clamp(25px, 6.8vw, 31px) !important; line-height: 1.12 !important; overflow-wrap: anywhere; }
  main h3 { font-size: clamp(18px, 5vw, 22px) !important; line-height: 1.2 !important; }
  .hero__lead p:first-child, .project-page__intro { font-size: 16px; }

  .hero__grid, .work-index__hero-grid { padding-block: 64px 48px; }
  .work-index__hero h1, .hero h1 { margin-block: 24px 20px; }
  .work-index__hero-art { width: min(100%, 250px); margin-top: 22px; }
  .hero-art { margin-top: 32px; }
  .work-index__studies { padding-block: 40px 72px; }
  .work-index__study-intro { margin-bottom: 36px; }
  .work-index__study-list { gap: 64px; }
  .work-index__study { gap: 22px; }
  .work-index__archive { padding-block: 64px 72px; }
  .work-index__study-media, .work-index__study:nth-child(even) .work-index__study-media { width: calc(100% + 2 * var(--gutter)); max-width: none; margin-inline: calc(-1 * var(--gutter)); aspect-ratio: 1 / 1; border-radius: 0; }

  .value-section, .work-section, .services-section, .process-section, .about-section, .testimonial-section, .final-cta, .faq-section { padding-block: 64px; }
  .work-section { padding-bottom: 48px; }
  .services-section { padding-top: 48px; }
  .value-section__intro > div:last-child { padding-bottom: 36px; }
  .value-section__points article, .value-section__points article + article { padding-top: 32px; }
  .value-section__points article:not(:last-child) { padding-bottom: 32px; }
  .value-section__points h3 { margin-top: 22px; }
  .section-heading { margin-bottom: 32px; }
  .project-card { min-height: 0; }
  .project-card__media { height: auto; aspect-ratio: 4 / 3; }
  .project-card__image { width: 100%; height: 100%; object-fit: cover; }
  .project-card__content { min-height: 0; padding: 24px; }
  .process-flow { margin-top: 32px; }
  .process-track { left: 32px; }
  .process-list li { padding-left: 54px; }
  .about-section h2 { margin-top: 20px; }
  .about-section__body { margin-block: 22px; }
  .about-section__visual { width: calc(100% + 2 * var(--gutter)); min-height: 0; margin: 36px calc(-1 * var(--gutter)) 0; display: block; }
  .about-section__photo { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 0; }
  .about-section__visual .about-art { display: none; }
  .testimonial-carousel__page { margin-top: 32px; }
  .final-cta { padding-block: 56px; }
  .final-cta h2 { margin-bottom: 20px; }
  .final-cta .button-row { margin-top: 24px; }
  .cta-art { width: min(100%, 240px); margin-top: 28px; }
  .site-footer { padding-top: 52px; }
  .site-footer__grid > * + * { margin-top: 32px; }
  .site-footer__bottom { margin-top: 40px; }

  .case-study-hero { padding-block: 40px 48px; }
  .case-study-breadcrumb { margin-bottom: 28px; }
  .case-study-hero__lead { margin-top: 24px; }
  .case-study-meta { margin-top: 32px; }
  .case-study-hero__media { width: calc(100% + 2 * var(--gutter)); margin: 32px calc(-1 * var(--gutter)) 0; aspect-ratio: 1 / 1; }
  .case-study-hero__media img { width: 100%; height: 100%; object-fit: cover; }
  .case-study-section, .case-block { padding-block: 64px; }
  .case-study-challenge, .case-study .case-block--solution { padding-top: 40px; }
  .case-study-split > :last-child, .case-study-outcome__grid > :last-child, .case-study-approach__copy { margin-top: 26px; }
  .case-study-share { padding-bottom: 48px; }
  .case-study-share__panel { padding-block: 24px; }
  .case-study-share__actions { flex-wrap: nowrap; justify-content: flex-start; gap: 6px; margin-top: 18px; padding-bottom: 22px; }
  .case-study-share__icon { width: 38px; min-height: 38px; flex: none; }
  .case-study-share__icon svg, .case-study-share__copy svg { width: 17px; height: 17px; }
  .case-study-share__copy { min-height: 38px; flex: none; gap: 5px; padding-inline: 8px; font-size: 10px; white-space: nowrap; }
  .case-study-share__status { right: auto; left: 0; }
  .case-study-next { padding-block: 56px; }
  .case-study-next__copy { margin-top: 26px; }
  .case-study-cta { padding-block: 64px; }

  .wp-service__section, .ux-service__section, .research-service__section, .frontend-service__section, .brand-service__section, .maintenance-service__section, .audit-service__section, .contact-page__section { padding-block: 64px; }
  .wp-service__hero-grid, .ux-service__hero-grid, .research-service__hero-grid, .frontend-service__hero-grid, .brand-service__hero-grid, .maintenance-service__hero-grid, .audit-service__hero-grid, .contact-page__hero-grid { padding-block: 64px 48px; }
  .wp-service__cta, .ux-service__cta, .research-service__cta, .frontend-service__cta, .brand-service__cta, .maintenance-service__cta, .audit-service__cta { padding-block: 64px; }
  .about-page__spectrum, .about-page__career, .about-page__studies, .about-page__teaching, .about-page__toolbox, .about-page__beliefs, .about-page__cta { padding-block: 64px; }
  .about-page__hero { padding-block: 48px; }
  .about-page__portrait { width: calc(100% + 2 * var(--gutter)); max-width: none; margin: 32px calc(-1 * var(--gutter)) 0; }
  .about-page__portrait img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
  .project-page, .project-archive { padding-block: 64px; }
  .project-page__section { margin-block: 40px; }
  .project-page__image { width: calc(100% + 2 * var(--gutter)); max-width: none; height: auto; aspect-ratio: 1 / 1; object-fit: cover; margin: 32px calc(-1 * var(--gutter)); }
  .faq-section { padding-block: 64px; }
}

@media (max-width: 360px) {
  .case-study-share__actions { gap: 4px; }
  .case-study-share__icon { width: 34px; min-height: 34px; }
  .case-study-share__copy { min-height: 34px; padding-inline: 6px; font-size: 9px; }
}