/* ============================================================
   RESPONSIVE CSS
   ============================================================ */

/* ============================================================
   タブレット（〜1024px）
   ============================================================ */
@media (max-width: 1024px) {

    .hero-inner {
        grid-template-columns: 1fr;
        gap: var(--space-12);
    }

    .hero-strengths {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .strength-card {
        flex: 1 1 calc(50% - var(--space-2));
    }

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

    .services-grid .service-card:nth-child(4),
    .services-grid .service-card:nth-child(5) {
        grid-column: auto;
    }

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

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

    .flow-steps {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-6);
    }

    .flow-step__arrow {
        display: none;
    }

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

    .footer-brand {
        grid-column: 1 / -1;
    }
}


/* ============================================================
   スマートフォン（〜768px）
   ============================================================ */
@media (max-width: 768px) {

    body { padding-top: 60px; }

    .header-inner { height: 60px; }

    /* KV */
    .kv-section {
        height: 100svh;
        min-height: 500px;
    }

    .kv-catchcopy__main {
        font-size: clamp(1.75rem, 7vw, 2.5rem);
    }

    .kv-catchcopy__sub {
        font-size: var(--fs-base);
    }

    .kv-catchcopy__actions {
        flex-direction: column;
    }

    .kv-catchcopy__actions .btn {
        width: 100%;
        justify-content: center;
    }

    .kv-scroll-indicator { display: none; }

    /* ヒーロー */
    .hero-inner {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .hero-text__main {
        font-size: clamp(1.5rem, 6vw, 2rem);
    }

    .hero-strengths { flex-direction: column; }

    .strength-card { flex: 1 1 100%; }

    /* サービス */
    .services-grid {
        grid-template-columns: 1fr;
    }

    /* インフォグラフィック */
    .infographic-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-4);
    }

    .stat-card {
        padding: var(--space-6) var(--space-4);
    }

    .industry-bar-row {
        grid-template-columns: 100px 1fr 40px;
        gap: var(--space-2);
    }

    /* お客様の声 */
    .voices-grid {
        grid-template-columns: 1fr;
    }

    /* 導入フロー */
    .flow-steps {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .flow-step {
        margin-inline: 0;
        text-align: left;
        display: flex;
        gap: var(--space-4);
        align-items: flex-start;
        padding: var(--space-5) var(--space-5);
    }

    .flow-step__icon {
        font-size: 2rem;
        margin-bottom: 0;
        flex-shrink: 0;
    }

    .flow-step__body { margin-bottom: 0; }

    /* フッター CTA */
    .footer-cta__title {
        font-size: var(--fs-2xl);
    }

    .footer-cta__actions {
        flex-direction: column;
        align-items: center;
    }

    .footer-cta__actions .btn {
        width: 100%;
        max-width: 360px;
        justify-content: center;
    }

    /* フッター */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: var(--space-8);
    }

    .footer-brand { grid-column: auto; }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-3);
    }

    .footer-bottom__links { flex-direction: column; gap: var(--space-2); }

    /* セクションタイトル */
    .section-title { font-size: var(--fs-2xl); }
}


/* ============================================================
   超小型デバイス（〜375px）
   ============================================================ */
@media (max-width: 375px) {

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

    .stat-card__number {
        font-size: 1.75rem;
    }
}


/* ============================================================
   大画面（1440px〜）
   ============================================================ */
@media (min-width: 1440px) {

    .services-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .voices-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
