/* Mobile content layouts. Shared navigation and footer remain in brand-system.css. */
/* An automatic width combined with the map's minimum height otherwise makes
   its aspect ratio widen narrow country pages beyond the viewport. */
@media(max-width:767px){.cinematic-inner .ay-route-globe.ay-country-art{width:100%;max-width:100%;min-width:0}}
@media (max-width: 767px) {
  .cinematic-inner :is(.ay-shell, .wrap) { width: calc(100% - 40px); }
  .cinematic-inner :is(.section, .ay-section) { padding-block: 44px; }
  .cinematic-inner :is(.ay-breadcrumb, .cp-crumbs, .resource-breadcrumb) {
    font-size: 12px;
    line-height: 1.6;
    gap: 6px 10px;
    margin-bottom: 24px;
  }
  .cinematic-inner :is(.ay-breadcrumb, .cp-crumbs, .resource-breadcrumb) a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
  }
  .cinematic-inner :is(.eyebrow, .ay-eyebrow, .new-eyebrow) { font-size: 11px; }
  .cinematic-inner :is(.ay-site main h2, .h2) { font-size: 30px; line-height: 1.15; letter-spacing: -.035em; }
  .cinematic-inner :is(.btn, .ay-button) { min-height: 48px; font: 600 14px/1.4 var(--av-body); text-transform: none; letter-spacing: 0; padding: 14px 18px; }
  .cinematic-inner :is(.ay-text-link, .ay-origin-links a, .resource-text-button, .bp-back) {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-size: 14px;
    line-height: 1.5;
  }
  .cinematic-inner :is(.ay-section-description, .ay-section-heading > p, .ay-option > p,
    .ay-scope-list p, .ay-guide-links p, .ay-guide-feature p, .ay-country-prose,
    .ay-process-intro > p:not(.ay-eyebrow), .ay-route-intro > p:not(.ay-eyebrow),
    .ay-principles p, .ay-timeline p, .ay-faq-list details > p,
    .service-card p, .cp-intro-narrow .lead, .process-step p, .faq-a-inner p) {
    font-size: 16px;
    line-height: 1.75;
  }

  /* A complete opening fits the screen without a giant heading or clipped truck. */
  .cinematic-inner :is(.ay-truck-hero, .cp-hero) { padding-block: 18px 30px; }
  .cinematic-inner .ay-truck-heading,
  html[lang=de] .cinematic-inner .ay-truck-heading { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  html .cinematic-inner .ay-site .ay-truck-hero h1,
  .cinematic-inner .cp-hero-copy .display,
  .cinematic-inner .bp-title,
  .cinematic-inner .resource-hero h1 {
    font-size: clamp(32px, 9vw, 40px);
    line-height: 1.1;
    letter-spacing: -.04em;
    overflow-wrap: anywhere;
  }
  .cinematic-inner .ay-site .ay-truck-subtitle {
    font: 400 15px/1.65 var(--av-body);
    letter-spacing: 0;
    margin-top: 16px;
  }
  .cinematic-inner .ay-truck-intro { display: block; }
  .cinematic-inner .ay-truck-intro > p { max-width: none; font-size: 16px; line-height: 1.75; }
  .cinematic-inner .ay-truck-intro .ay-button { background: var(--av-orange); border-color: var(--av-orange); color: white; width: 100%; margin-top: 20px; justify-content: space-between; }
  .cinematic-inner .ay-truck-product {
    width: calc(100% - 40px);
    max-width: none;
    left: auto;
    padding: 0;
    margin: 24px auto 0 !important;
  }
  .cinematic-inner .ay-truck-product > img { width: 100%; max-width: 100%; height: auto; max-height: 190px; object-fit: contain; }
  .cinematic-inner .ay-truck-product > figcaption { position: static; margin: 8px 0 0; font-size: 11px; line-height: 1.5; }
  .cinematic-inner .ay-truck-bottom { display: block; margin-top: 20px; }
  .cinematic-inner .ay-truck-discover { min-height: 44px; font-size: 12px; margin-bottom: 18px; }
  .cinematic-inner .ay-truck-discover > span { width: 36px; height: 36px; }
  .cinematic-inner .ay-truck-hero .ay-hero-route { min-width: 0; grid-template-columns: minmax(0, 1fr) 44px; }
  .cinematic-inner .ay-hero-route > .ay-route-label { font-size: 11px; line-height: 1.5; }
  .cinematic-inner .ay-hero-route > span:not(.ay-route-label) { font-size: 16px; }
  .cinematic-inner .ay-hero-route > a { width: 44px; height: 44px; }
  .cinematic-inner .cp-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-bottom: 0; }
  .cinematic-inner .cp-hero .lead { font-size: 16px; line-height: 1.75; margin-bottom: 22px; }
  .cinematic-inner .cp-service-mark.has-photo { aspect-ratio: 1.8; max-height: 230px; }
  .cinematic-inner .hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .cinematic-inner .hero-actions .btn { width: 100%; justify-content: space-between; }
  .cinematic-inner .ay-photo-note { font-size: 12px; line-height: 1.6; }

  /* Phone journeys are three readable steps, never overlapping pinned panels. */
  .cinematic-inner .ay-transport-story { height: auto; scroll-margin-top: 80px; }
  .cinematic-inner .ay-transport-story .ay-transport-sticky {
    position: relative;
    top: auto;
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding-block: 32px;
    overflow: visible;
  }
  .cinematic-inner .ay-story-top { order: 0; }
  .cinematic-inner .ay-story-top .ay-eyebrow { max-width: none; font-size: 11px; }
  .cinematic-inner .ay-transport-story .ay-transport-viewport {
    order: 1;
    flex: none;
    width: calc(100% - 40px);
    height: clamp(130px, 42vw, 210px);
    min-height: 0;
    margin: 18px auto 12px;
  }
  .cinematic-inner .ay-scene-transport .ay-scene-render { display: none; }
  .cinematic-inner .ay-scene-transport > .ay-scene-fallback { opacity: 1; padding: 0; }
  .cinematic-inner .ay-transport-story .ay-story-copy {
    order: 2;
    display: grid;
    min-height: 0;
    gap: 24px;
    margin-top: 12px;
  }
  .cinematic-inner .ay-transport-story .ay-story-panel {
    position: relative;
    inset: auto;
    display: block;
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: none;
    border-bottom: 1px solid var(--line);
    padding-bottom: 24px;
    scroll-margin-top: 88px;
  }
  .cinematic-inner .ay-story-index { font-size: 12px; line-height: 1.5; margin-bottom: 12px; }
  html .cinematic-inner .ay-site .ay-story-panel h2 { max-width: none; font-size: 28px; line-height: 1.15; letter-spacing: -.035em; }
  .cinematic-inner .ay-story-panel > p { max-width: none; margin-top: 14px; font-size: 16px; line-height: 1.75; }
  .cinematic-inner .ay-transport-story .ay-story-bottom { order: 3; display: block; margin-top: 24px; }
  .cinematic-inner .ay-stage-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .cinematic-inner .ay-stage-nav > button { min-width: 0; min-height: 48px; font-size: 13px; line-height: 1.4; gap: 8px; padding-block: 10px; }
  .cinematic-inner .ay-stage-nav > button > span { font-size: 11px; }
  .cinematic-inner .ay-story-bottom > .ay-text-link { font-size: 14px; margin-top: 18px; }
  .cinematic-inner .ay-story-bottom > small { position: static; display: block; margin-top: 14px; font-size: 11px; line-height: 1.5; }

  .cinematic-inner :is(.ay-scope-list, .ay-country-prose, .services-grid, .cp-services-row) { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cinematic-inner .ay-scope-list h3 { font-size: 22px; }
  .cinematic-inner .ay-scope-list p { max-width: none; }
  .cinematic-inner :is(.ay-scope-list span, .ay-guide-links small, .ay-guide-kicker) { font-size: 12px; }
  .cinematic-inner .ay-timeline li { gap: 16px; padding-block: 24px; }
  .cinematic-inner .ay-timeline h3 { font-size: 23px; line-height: 1.25; }
  .cinematic-inner .ay-city-list { grid-template-columns: minmax(0, 1fr); }
  .cinematic-inner .ay-city-list :is(a, button) { min-height: 52px; padding-block: 15px; font-size: 18px; }
  .cinematic-inner .ay-city-status { font-size: 13px; line-height: 1.6; }
  .cinematic-inner .ay-guide-feature { min-height: 0; padding: 24px; }
  .cinematic-inner .ay-guide-feature h3 { font-size: 32px; line-height: 1.12; }
  .cinematic-inner .ay-guide-links h3 { font-size: 25px; line-height: 1.2; }
  .cinematic-inner .ay-guide-links p { max-width: none; }
  .cinematic-inner :is(.ay-faq-list summary, .faq-q) { font-size: 16px; line-height: 1.5; padding-block: 20px; }
  .cinematic-inner .ay-route-form { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .cinematic-inner .ay-route-form > label { font-size: 14px; }
  .cinematic-inner .ay-route-form > label > span { font-size: 12px; }
  .cinematic-inner .ay-route-form :is(input, select) { min-height: 48px; font-size: 16px; }
  .cinematic-inner :is(.ay-route-bottom, .ay-form-helper) { font-size: 13px; line-height: 1.6; }

  /* Guides use a compact list and the same comfortable article measure. */
  .cinematic-inner .bl-search { margin-top: 24px; font-size: 14px; }
  .cinematic-inner .bl-results { font-size: 14px; line-height: 1.6; margin-block: 12px; }
  .cinematic-inner .bl-cats { gap: 8px 20px; }
  .cinematic-inner .bl-cat { min-height: 48px; font-size: 14px; }
  .cinematic-inner .bl-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .cinematic-inner .bl-card { padding-block: 24px; }
  .cinematic-inner .ay-article-number { font-size: 12px; margin-bottom: 14px; }
  .cinematic-inner .bl-card h3 { font-size: 25px; line-height: 1.2; }
  .cinematic-inner .bl-card p { font-size: 16px; line-height: 1.7; }
  .cinematic-inner :is(.bl-meta, .bl-date, .bp-meta, .bp-byline) { font-size: 12px; line-height: 1.6; }
  .cinematic-inner .bl-pagination { border-top: 1px solid var(--line); padding-block: 24px; }
  .cinematic-inner .bl-pagination .btn { width: 100%; justify-content: center; }
  .cinematic-inner .bp-article { padding-top: 20px; }
  .cinematic-inner .bp-title { margin-block: 18px; }
  .cinematic-inner .bp-excerpt { font-size: 17px; line-height: 1.7; }
  .cinematic-inner .bp-content { font-size: 17px; line-height: 1.8; }
  .cinematic-inner .bp-h { font-size: 27px; line-height: 1.2; margin-block: 34px 16px; }
  .cinematic-inner .bp-toc { padding: 20px; margin-block: 24px 32px; }
  .cinematic-inner .bp-toc a { display: flex; align-items: center; min-height: 44px; font-size: 14px; padding-block: 9px; }
  .cinematic-inner .bp-conversion { padding: 24px 20px; margin-block: 32px; }
  .cinematic-inner .bp-conversion h2 { font-size: 27px; }
  .cinematic-inner :is(.bp-conversion p, .bp-faq-a) { font-size: 16px; line-height: 1.75; }
  .cinematic-inner .bp-source { font-size: 14px; overflow-wrap: anywhere; }

  /* Forms stay single-column, including the inventory's nested fieldsets. */
  .cinematic-inner .resource-main { padding-top: 20px; }
  .cinematic-inner .resource-hero { margin-bottom: 30px; }
  .cinematic-inner .resource-hero > p:not(.new-eyebrow) { font-size: 17px; line-height: 1.7; }
  .cinematic-inner .resource-tool { padding: 24px 18px; }
  .cinematic-inner :is(.resource-form-grid, .inventory-row .resource-form-grid, .resource-checks, .new-form-grid) {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .cinematic-inner .inventory-row { padding: 18px 14px; }
  .cinematic-inner :is(.resource-field, .new-form-grid > label, .new-modal .new-form-grid label) { font-size: 14px; line-height: 1.5; }
  .cinematic-inner :is(.resource-field input, .resource-field select, .resource-field textarea,
    .new-form-grid input, .new-form-grid select, .new-form-grid textarea) { min-height: 50px; font-size: 16px; padding: 12px; }
  .cinematic-inner :is(.resource-choice label, .resource-checks label, .quote-direction label) { min-height: 44px; font-size: 15px; line-height: 1.5; align-items: center; }
  .cinematic-inner .resource-checks { padding: 20px 14px; }
  .cinematic-inner .resource-actions { display: flex; flex-direction: column; align-items: stretch; }
  .cinematic-inner .resource-actions .btn { width: 100%; justify-content: center; }
  .cinematic-inner :is(.resource-editorial p, .resource-card p, .resource-draft p, .resource-transcript p) { font-size: 16px; line-height: 1.75; }
  .cinematic-inner .resource-help { font-size: 14px !important; line-height: 1.65; }
  .cinematic-inner :is(.resource-cards, .resource-video-layout) { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .cinematic-inner .resource-card h2 { font-size: 26px; }
  .cinematic-inner .resource-stat-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; font-size: 14px; }
  .cinematic-inner .resource-sources { padding-inline: 16px; overflow-wrap: anywhere; }
  .cinematic-inner .new-modal-overlay { padding: 12px; }
  .cinematic-inner .new-modal { padding: 30px 20px; max-height: calc(100dvh - 24px); overflow-y: auto; }
  .cinematic-inner .new-modal h2 { font-size: 28px; line-height: 1.15; max-width: none; padding-right: 28px; }
  .cinematic-inner .new-modal-close { width: 44px; height: 44px; top: 10px; right: 10px; }
  .cinematic-inner .new-modal > p:not(.new-eyebrow) { font-size: 15px; line-height: 1.65; }
  .cinematic-inner .new-modal :is(.quote-privacy, .quote-optional summary) { font-size: 13px; line-height: 1.65; }
  .cinematic-inner .quote-direction { display: grid; gap: 4px; }
  .cinematic-inner .new-form-actions { align-items: stretch; flex-direction: column; gap: 12px; }
  .cinematic-inner .new-form-actions > a { display: flex; align-items: center; justify-content: center; min-height: 44px; font-size: 14px; }
  .cinematic-inner .ct-cards { grid-template-columns: minmax(0, 1fr); }
  .cinematic-inner .ct-form { padding: 24px 20px; }
  .cinematic-inner :is(.ct-card-l, .ct-or) { font-size: 14px; }
  .cinematic-inner :is(.ct-card strong, .ct-addr strong) { font-size: 16px; }
}