@media (max-width: 820px) {
  body .about-section:not(#hero-section),
  body .service-section:not(#hero-section),
  body .course-detail,
  body .why-choose-section {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  body #hero-section { padding-top: 120px; padding-bottom: 32px; }
  body .courses-intro { padding-top: 120px; padding-bottom: 32px; }
  body #courses-section { padding-bottom: 32px !important; }
  body .services-section, body .barista-section { padding-top: 36px; padding-bottom: 36px; }
  body .services-header { margin-bottom: 24px; }
  body .partners-header { margin-bottom: 32px; }
  body .cta-row, body .cta-row-top { padding-top: 16px; padding-bottom: 32px; }
  body #arcWrap + .cta-row-top { display: none; }
  body .catalog, body .detail-wrap { padding-top: 120px; padding-bottom: 40px; }
  body .catalog-header { margin-bottom: 24px; }
  body .catalog-toolbar { margin-bottom: 28px; }
  body .contact-container { margin-top: 100px; margin-bottom: 40px; }
  body .form-container { margin-bottom: 32px; }
  body .form-section { padding-top: 24px; padding-bottom: 24px; margin-bottom: 16px; }
  body .flow-main { padding-bottom: 32px; }
  body .site-footer { padding-top: 36px; padding-bottom: 20px; }
  body .footer-top { row-gap: 24px; padding-bottom: 24px; }
  body .footer-bottom { padding-top: 18px; }

  body #arcWrap { padding: 16px 5%; overflow: hidden; }
  body #arc.mobile-pair-carousel {
    position: static;
    display: grid;
    grid-template-columns: minmax(0, 280px);
    justify-content: center;
    gap: 12px;
    align-items: stretch;
    touch-action: pan-y pinch-zoom;
    user-select: none;
    -webkit-user-select: none;
  }
  body #arc.mobile-pair-carousel .card {
    width: 100%;
    max-width: none;
    min-width: 0;
    transform: none;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.24);
  }
  body #arc.mobile-pair-carousel .card:hover {
    transform: none;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.24);
  }
  body #arc.mobile-pair-carousel .card[hidden] { display: none; }
  body #arc.mobile-pair-carousel:focus-visible { outline: 2px solid var(--crema); outline-offset: 6px; }
  body .arc-swipe-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 14px;
    color: var(--ink-soft);
    font: 600 10px var(--font-body);
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  body .arc-swipe-hint button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid rgba(247, 244, 238, 0.2);
    border-radius: 50%;
    background: rgba(247, 244, 238, 0.07);
    color: var(--cream);
    font-size: 17px;
    cursor: pointer;
    animation: arcSwipeHint 1.7s ease-in-out infinite;
  }
  body .arc-swipe-hint button:first-child { animation-direction: reverse; }
  body .arc-swipe-hint button:active { background: rgba(192, 138, 62, 0.25); transform: scale(0.92); }
  body .arc-swipe-hint button:focus-visible { outline: 2px solid var(--crema); outline-offset: 2px; }
  @keyframes arcSwipeHint {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(3px); }
  }
  @media (prefers-reduced-motion: reduce) {
    body .arc-swipe-hint button { animation: none; }
  }
}

.arc-swipe-hint, .card-swipe-hint { display: none; }

@media (max-width: 820px) {
  body .mobile-card-carousel {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    margin-top: 24px;
    margin-bottom: 14px;
    padding: 0;
    touch-action: pan-y pinch-zoom;
    user-select: none;
    -webkit-user-select: none;
  }
  body .mobile-card-carousel > .service-card,
  body .mobile-card-carousel > .course-card {
    min-width: 0;
    padding: 22px 16px;
    transform: none;
  }
  body .mobile-card-carousel > .service-card:hover,
  body .mobile-card-carousel > .course-card:hover {
    transform: none;
    box-shadow: none;
  }
  body .mobile-card-carousel > [hidden] { display: none; }
  body .mobile-card-carousel:focus-visible { outline: 2px solid var(--crema); outline-offset: 5px; }
  body .card-swipe-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0 0 24px;
    color: var(--ink-soft);
    font: 600 10px var(--font-body);
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  body .card-swipe-hint button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid rgba(247, 244, 238, 0.2);
    border-radius: 50%;
    background: rgba(247, 244, 238, 0.07);
    color: var(--cream);
    font-size: 17px;
    cursor: pointer;
    animation: arcSwipeHint 1.7s ease-in-out infinite;
  }
  body .card-swipe-hint button:first-child { animation-direction: reverse; }
  body .card-swipe-hint button:active { background: rgba(192, 138, 62, 0.25); transform: scale(0.92); }
  body .card-swipe-hint button:focus-visible { outline: 2px solid var(--crema); outline-offset: 2px; }
  @media (prefers-reduced-motion: reduce) {
    body .card-swipe-hint button { animation: none; }
  }
}