/* Repairs to the existing design, shared by every page. */
.card, .project, .portfolio-copy, .service-detail-copy,
.contact-copy, .contact form, .contact label { min-width: 0; }
.card h2, .project h3, .portfolio-copy h2, .service-detail-copy h2 {
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.project-tag { right: 24px; }
.work-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1024px) { .work-grid { grid-template-columns: 1fr; } }
.portfolio-row { grid-template-columns: minmax(0, 1fr) minmax(0, 40%); }
.portfolio-row:nth-child(even) { grid-template-columns: minmax(0, 40%) minmax(0, 1fr); }
.portfolio-row:nth-child(even) .portfolio-video { justify-self: start; }
.services-split .portfolio-row { min-width: 0; }
.services-split .portfolio-video { width: 100%; max-width: 540px; }
.banner-content { min-width: 0; max-width: 100%; }
.module-banner { container-type: inline-size; }
.module-banner h1 { font-size: clamp(1.25rem, 8cqi, 5.4rem); }
.contact textarea { resize: vertical; min-height: 8rem; }
.legal-updated { color: var(--text-main); }
.footer-meta a { overflow-wrap: anywhere; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
@media (min-width: 769px) and (max-width: 1200px) {
  .portfolio-row { padding: 24px; gap: 24px; }
  .service-detail-block:not(:nth-child(even)) .service-detail-copy { padding-left: 0; }
  .service-detail-block:nth-child(even) { column-gap: 24px; }
}
@media (max-width: 1024px) {
  .site-header { flex-wrap: wrap; gap: 0 1rem; transition: gap 420ms ease; }
  .site-header.menu-open { gap: 1rem; }
  .menu-toggle { display: inline-flex; margin-left: auto; flex-shrink: 0; padding: 0; }
  .site-header > .button { display: none; }
  .site-header nav {
    display: flex;
    order: 3;
    flex: 0 0 100%;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    border-top: 1px solid transparent;
    padding-top: 0;
    max-height: 0;
    overflow-y: auto;
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    visibility: hidden;
    transition: max-height 550ms cubic-bezier(0.22, 1, 0.36, 1), opacity 420ms ease, transform 420ms ease, visibility 0ms 550ms, border-color 420ms ease, padding-top 420ms ease;
  }
  .site-header.menu-open nav {
    max-height: calc(100dvh - 120px);
    padding-top: .75rem;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    visibility: visible;
    border-top-color: rgba(56,97,112,.18);
    transition: max-height 550ms cubic-bezier(0.22, 1, 0.36, 1), opacity 420ms ease, transform 420ms ease, border-color 420ms ease, padding-top 420ms ease;
  }
  .site-header nav a { display: block; padding: .55rem 0; text-align: center; }
  .site-header nav .nav-dropdown { width: 100%; text-align: center; }
  .site-header nav .nav-dropdown-trigger { justify-content: center; }
  .site-header nav .nav-dropdown-trigger::after { display: none; }
  .site-header nav .nav-dropdown-menu { position: static; display: grid; justify-items: center; min-width: 0; padding: .1rem 0 .35rem 0; box-shadow: none; background: transparent; }
  .site-header nav .nav-dropdown-menu::before { display: none; }
  .site-header nav .nav-dropdown-menu a { text-align: center; }
  .site-header nav .button { color: #fff; text-align: center; padding: .85rem 1rem; margin-top: .5rem; width: 100%; }
  .portfolio-video { align-self: stretch; height: 100%; min-height: 220px; }
}
@media (max-width: 768px) {
  .portfolio-row, .portfolio-row:nth-child(even), .services-split .portfolio-row { grid-template-columns: minmax(0, 1fr); padding: 20px; }
  .portfolio-video { height: auto; min-height: 0; aspect-ratio: 16 / 9; }
  .contact form { padding: 24px; border-radius: 20px; }
  .contact h2, .section-head h2 { font-size: clamp(1.25rem, 5.5vw, 2rem); letter-spacing: .12em; overflow-wrap: anywhere; }
  .contact form select, .contact form input, .contact form textarea { min-width: 0; font-size: 16px; }
  .contact form .consent-field { align-items: flex-start; }
  .module-banner { padding: 24px; }
  .module-banner h1 { font-size: min(36px, 12.8cqi); line-height: 1.2; letter-spacing: -0.01em; }
  .service-detail-block, .service-detail-block:nth-child(even) { column-gap: 0; }
  .about-story { overflow: hidden; }
  .legal-card { padding: 24px; overflow-wrap: anywhere; }
}
