/* 016media mobile layout: loaded after the main stylesheet on narrow screens. */
@media (max-width: 760px) {
  html, body { background: #070706 !important; }
  .container { width: min(100% - 32px, 560px) !important; }

  /* Editorial black and yellow hero. */
  main > .hero--clean {
    display: block !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    background:
      radial-gradient(ellipse 82% 47% at 95% 7%, rgba(241,198,26,.27), transparent 74%),
      linear-gradient(155deg, #080807 0%, #16130a 58%, #060606 100%) !important;
    border-bottom: 1px solid rgba(241,198,26,.45);
  }
  .hero--clean .hero-inner {
    padding: 43px 0 48px !important;
    text-align: left !important;
  }
  .hero--clean .section-chip { margin-bottom: 20px; font-size: .79rem; }
  .hero--clean .hero-title {
    max-width: 12ch;
    margin: 0;
    font-size: clamp(2.5rem, 10.1vw, 3.55rem);
    line-height: .99;
    letter-spacing: -.055em;
    text-align: left;
  }
  .hero--clean .hero-script {
    margin: 12px 0 0;
    font-size: clamp(2rem, 8.2vw, 2.85rem);
    line-height: .94;
    color: #F1C61A;
    text-align: left;
  }
  .hero--clean .hero-copy {
    max-width: 39ch;
    margin: 20px 0 0;
    color: #e4dfd3;
    font-size: .96rem;
    line-height: 1.55;
    text-align: left;
  }
  .hero--clean .hero-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
    margin-top: 25px;
  }
  .hero--clean .hero-actions .pill-button {
    width: 100%; min-width: 0; min-height: 50px;
    padding: 0 8px;
    font-size: .85rem;
  }
  .hero--clean .pill-button--dark { border-color: rgba(241,198,26,.56); }
  /* Five images are visible together, without the former vertical stack. */
  body .mission-section .arc-gallery.small-arc {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    grid-template-rows: repeat(3,clamp(98px,29vw,145px)) !important;
    gap: 9px !important;
    align-items: stretch !important;
    margin: 0 0 36px !important;
  }
  body .mission-section .small-arc .arc-card {
    display: block !important;
    width: 100% !important; height: 100% !important;
    min-width: 0 !important; aspect-ratio: auto !important;
    border: 2px solid rgba(241,198,26,.6) !important;
    border-radius: 15px !important;
    transform: none !important;
    overflow: hidden !important;
  }
  body .mission-section .small-arc .arc-card:nth-child(1) { grid-area: 1 / 1 / 3 / 3 !important; }
  body .mission-section .small-arc .arc-card:nth-child(2) { grid-area: 1 / 3 / 2 / 4 !important; }
  body .mission-section .small-arc .arc-card:nth-child(3) { grid-area: 2 / 3 / 3 / 4 !important; }
  body .mission-section .small-arc .arc-card:nth-child(4) { grid-area: 3 / 1 / 4 / 2 !important; }
  body .mission-section .small-arc .arc-card:nth-child(5) { grid-area: 3 / 2 / 4 / 4 !important; }
  body .mission-section .small-arc .arc-card img { width: 100%; height: 100%; object-fit: cover; }
  body .mission-section .small-arc .arc-card::after { display: none !important; }

  /* Solid panels stand apart from the site background before any hover. */
  body :is(.logo-card, .service-card, .process-card, .compare-card,
    .proof-card, .case-card, .next-card, .faq-item, .contact-panel,
    .faq-aside, .results-strip) {
    background: #25221a !important;
    border: 1.5px solid rgba(241,198,26,.72) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.07) !important;
  }
  body :is(.logo-card, .service-card, .process-card, .compare-card,
    .proof-card, .case-card, .next-card, .faq-item):is(:hover,:focus-within) {
    background: #F1C61A !important;
    border-color: #F1C61A !important;
  }
  body :is(.logo-card, .service-card, .process-card, .compare-card,
    .proof-card, .case-card, .next-card, .faq-item) :is(p,small,li) {
    color: #e7e1d4;
  }
  body :is(.logo-card, .service-card, .process-card, .compare-card,
    .proof-card, .case-card, .next-card, .faq-item):is(:hover,:focus-within) * {
    color: #080808 !important;
  }
  .section-title .script-line, .case-studies-section .case-highlight { color: #F1C61A; }
  .motion-card { opacity: 1 !important; filter: none !important; transform: none !important; }

  /* Logo, two short link groups, and one compact legal row. */
  body .site-footer { padding: 34px 0 21px !important; background: #090909 !important; }
  body .site-footer .footer-grid {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    column-gap: 26px !important;
    row-gap: 25px !important;
  }
  body .site-footer .footer-grid > :first-child {
    grid-column: 1 / -1 !important;
    display: block !important;
  }
  body .site-footer .footer-brand img { width: 143px !important; }
  body .site-footer .footer-grid > :nth-child(2),
  body .site-footer .footer-grid > :nth-child(3) { grid-column: auto !important; }
  body .site-footer .footer-grid h2 { margin: 0 0 12px; font-size: .96rem; }
  body .site-footer .footer-grid ul { gap: 8px !important; }
  body .site-footer .footer-grid li a { font-size: .86rem; line-height: 1.3; }
  body .site-footer .footer-bottom {
    display: flex; flex-wrap: wrap; flex-direction: row;
    align-items: center; justify-content: space-between;
    gap: 10px 18px; margin-top: 26px; padding-top: 16px;
    font-size: .77rem;
  }
  body .site-footer .footer-bottom a { color: #F1C61A; }
}
@media (max-width: 380px) {
  .hero--clean .hero-title { font-size: 2.35rem; }
  body .site-footer .footer-grid { column-gap: 14px !important; }
}
