/* Responsive overrides
   ========================================================================== */

@media (max-width: 1023px) {
  .strengths__grid,
  .biz-summary__grid,
  .values__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .clients__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .greeting,
  .contact-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .greeting__visual {
    position: static;
    aspect-ratio: 16 / 9;
  }

  .biz-block {
    grid-template-columns: 1fr;
    gap: var(--space-6);
    padding-block: var(--space-8);
  }

  .biz-block--reverse .biz-block__media {
    order: 0;
  }

  .process__list {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-5);
  }

  .process__list::before {
    display: none;
  }

  .gallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .site-footer__top {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 767px) {
  :root {
    --header-h: 64px;
  }

  .container {
    padding-inline: var(--space-4);
  }

  .menu-toggle {
    display: block;
  }

  .site-nav {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    /* 명시적 height — inset shorthand가 fixed+flex 조합에서 stretch 보장 못 함 */
    height: calc(100vh - var(--header-h));
    height: calc(100dvh - var(--header-h));
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    background: var(--navy-900);
    padding: var(--space-6) var(--space-5) var(--space-8);
    gap: var(--space-1);
    transform: translateY(-100%);
    transition: transform var(--transition), visibility var(--transition);
    border-block-start: 1px solid rgba(255,255,255,0.08);
    overflow-y: auto;
    /* 닫혀있을 때 paint 자체 skip — 헤더 안의 logo/toggle을 가리지 않게 */
    visibility: hidden;
    z-index: 1;
  }

  .site-nav.is-open {
    transform: translateY(0);
    visibility: visible;
  }

  .site-nav__link {
    padding: var(--space-4);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    font-size: 1.0625rem;
  }

  .site-nav__link.is-active::after {
    display: none;
  }

  .site-nav__cta {
    margin: var(--space-5) 0 0;
    text-align: center;
  }

  /* Hero 콘텐츠가 헤더 뒤로 spill되지 않게: 위에서부터 정렬 + 헤더 자리 확보 */
  .hero {
    align-items: flex-start;
    padding-top: calc(var(--header-h) + var(--space-4));
  }
  .hero__content {
    padding-block: var(--space-6) var(--space-10);
  }

  .hero__sub {
    font-size: 1rem;
  }

  .hero__actions {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-2);
  }

  .hero__actions .btn {
    justify-content: center;
  }

  .hero__particles { display: none; }

  .hero__scroll { display: none; }

  .strengths__grid,
  .biz-summary__grid,
  .values__grid,
  .clients__grid {
    grid-template-columns: 1fr;
  }

  .process__list {
    grid-template-columns: repeat(2, 1fr);
  }

  .gallery {
    grid-template-columns: 1fr;
  }

  .form__row {
    grid-template-columns: 1fr;
    gap: 0;
    margin-bottom: 0;
  }

  .form,
  .info-block {
    padding: var(--space-6);
  }

  .equipment-table th,
  .equipment-table td {
    padding: var(--space-3);
    font-size: 0.85rem;
  }

  .site-footer__top {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .site-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
  }

  .facility-banner {
    height: 220px;
  }

  .cta-strip__buttons {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .cta-strip__buttons .btn {
    justify-content: center;
  }

  /* Section padding 축소 — 첫 화면 카피와 컨텐츠 간 거리 단축 */
  .section { padding-block: var(--space-10); }

  /* 카드 내부 패딩 축소 */
  .strength-card,
  .value-card {
    padding: var(--space-6) var(--space-5);
  }

  /* Page hero 상하 패딩 축소 */
  .page-hero {
    padding-top: calc(var(--header-h) + var(--space-8));
    padding-bottom: var(--space-8);
  }

  /* Hero 보조 텍스트/CTA 간격 압축 */
  .hero__sub    { margin-top: var(--space-4); font-size: 1rem; }
  .hero__actions { margin-top: var(--space-6); }

  /* Hero 배경 모바일 포지션 — 핵심 피사체 잘림 방지 */
  .hero__bg { background-position: center 35%; }

  /* Process step 원 사이즈 축소 */
  .process-step__circle {
    width: 60px;
    height: 60px;
  }
  .process-step__title { font-size: 0.875rem; }

  /* 지도 비율 모바일 정사각형에 가깝게 */
  .map-wrap { aspect-ratio: 16 / 12; }

  /* 모바일 tap highlight 시안톤으로 통일 */
  a, button {
    -webkit-tap-highlight-color: rgba(0, 188, 212, 0.18);
  }

  /* 폼 라벨/체크박스 텍스트 살짝 키우기 */
  .form__check { font-size: 0.95rem; }
}

/* 호버 불가 디바이스(터치) — 갤러리 캡션을 항상 노출
   hover로만 보이는 캡션은 모바일에서 사라지므로 조건부로 강제 표시
   ========================================================================== */
@media (hover: none) {
  .gallery__item::after {
    opacity: 1;
    background: linear-gradient(180deg, transparent 40%, rgba(10, 25, 41, 0.65));
  }
  .gallery__caption {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Reduced motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .hero__particles { display: none; }
}