/* ==========================================================================
   Responsive - Mobile First で書きつつ、PC側を上書き
   ブレークポイント：768（タブレット）/ 1024（PC）
   ========================================================================== */

/* ---------- タブレット以上 (>= 768px) ---------- */
@media (min-width: 768px) {
  .about__grid {
    gap: var(--space-9);
  }
  .hero__inner {
    padding: calc(var(--header-h) + var(--space-9)) var(--container-px) var(--space-9);
  }
}

/* ---------- PC (>= 1024px) ---------- */
@media (min-width: 1024px) {
  /* ヘッダー：ハンバーガー非表示 */
  .nav-toggle {
    display: none;
  }
}

/* ---------- タブレット以下 (< 1024px) ---------- */
@media (max-width: 1023.98px) {
  .site-nav {
    display: none;
  }
  .nav-toggle {
    display: block;
  }

  .value__item,
  .value__item--reverse {
    grid-template-columns: 1fr;
    direction: ltr;
    gap: var(--space-5);
  }
  .value__item .value__img,
  .value__item--reverse .value__img {
    order: 1; /* スマホは全て：テキスト→画像 */
  }
  .value__item .value__body,
  .value__item--reverse .value__body {
    order: 0;
  }
  .value__num {
    font-size: 2.5rem;
  }

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

/* ---------- モバイル (< 768px) ---------- */
@media (max-width: 767.98px) {
  :root {
    --header-h: var(--header-h-sp);
  }

  .hero__heading {
    font-size: clamp(1.4rem, 5.5vw, 1.8rem);
    line-height: 1.6;
  }
  .hero__body {
    font-size: var(--fs-base);
    line-height: 1.9;
  }
  .hero__sub-en {
    font-size: var(--fs-xs);
  }
  .hero__ctas {
    flex-direction: column;
    width: 100%;
  }
  .hero__ctas .btn {
    width: 100%;
    min-width: 0;
  }
  .hero__scroll {
    display: none;
  }

  /* NOTICE */
  .notice__quotes {
    padding: var(--space-5) var(--space-5);
    font-size: var(--fs-base);
  }
  .notice__body {
    text-align: left;
  }
  .notice__cta {
    text-align: left;
  }
  .notice__cta-text {
    text-align: left;
  }

  /* ABOUT 会社概要テーブル */
  .company-table dl {
    grid-template-columns: 1fr;
  }
  .company-table dt {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-border);
  }
  .company-table dd {
    padding: var(--space-3) var(--space-4);
  }

  /* FLOW */
  .flow-step {
    padding-left: 64px;
  }
  .flow-step__num {
    width: 44px;
    height: 44px;
    font-size: var(--fs-base);
  }
  .flow-step__desc {
    max-width: 100%;
  }

  /* CONTACT */
  .contact__form {
    padding: var(--space-6) var(--space-4);
  }
  .contact__intro {
    text-align: left;
  }

  /* FOOTER */
  .site-footer__grid {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .site-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .btn {
    width: 100%;
    min-width: 0;
  }

  /* セクション見出し：スマホでは区切り線を左揃えに */
  .section-header::after,
  .notice__lead::after {
    margin-left: 0;
  }
}

/* ---------- 超小型 (< 380px) ---------- */
@media (max-width: 379.98px) {
  .hero__mega {
    font-size: clamp(2.5rem, 14vw, 4rem);
  }
}
