/* =============================================
   Family Partners - Responsive Styles
   ============================================= */

@media (min-width: 769px) {
    .worry-header .section-subtitle {
        white-space: nowrap;
    }
}

/* ---------- Tablet (768px以下) ---------- */
@media (max-width: 768px) {
    html {
        font-size: 16px;
    }

    /* Header */
    .hamburger {
        display: block;
    }

    .header-inner {
        height: 64px;
    }

    .logo-img {
        height: 50px;
    }

    .nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 75%;
        max-width: 320px;
        height: 100vh;
        background: var(--color-white);
        padding: 5rem 2rem 2rem;
        box-shadow: var(--shadow-lg);
        transition: var(--transition);
        z-index: 1000;
    }

    .nav.active {
        right: 0;
    }

    .nav-list {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
    }

    .nav-list a {
        font-size: 1rem;
    }

    .nav-cta {
        width: 100%;
        text-align: center;
    }

    /* Hero - Mobile：縦長動画（人物入り）＋ テキストの縦積み */
    .hero {
        min-height: auto;
        padding-top: 64px;
        background: var(--color-bg);
    }

    .hero-video-pc,
    .hero-veil {
        display: none;
    }

    .hero-inner {
        flex-direction: column;
        align-items: center;
        gap: 0;
        padding: 0;
    }

    .hero-video-sp {
        display: block;
        order: 1;
        width: 100%;
        height: auto;
        max-height: 78vh;
        object-fit: cover;
        object-position: center top;
    }

    .hero-content {
        order: 2;
        width: 100%;
        padding: 1.25rem 1.5rem 3rem;
        text-align: center;
    }

    .hero-eyebrow {
        margin-top: -1.4rem;
        position: relative;
        z-index: 2;
        background: var(--color-white);
        box-shadow: var(--shadow-sm);
    }

    .hero-title {
        font-size: 2.3rem;
        white-space: normal;
    }

    .sp-only {
        display: inline;
    }

    .pc-only {
        display: none;
    }

    .hero-handnote {
        font-size: 1.15rem;
    }

    .hero-handnote::after {
        margin-left: auto;
        margin-right: auto;
    }

    .big-bg {
        font-size: clamp(3.4rem, 16vw, 6rem);
        top: 1rem;
    }

    .hero-title::before {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-scroll {
        display: none;
    }

    .hero-description {
        font-size: 0.95rem;
    }

    .hero-expert-name {
        font-size: 0.85rem;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: center;
        gap: 1.1rem;
    }

    .trust-band-inner {
        flex-wrap: wrap;
        gap: 1.25rem 0;
    }

    .trust-item {
        flex: 1 1 50%;
    }

    .trust-num {
        font-size: 1.7rem;
    }

    .trust-label {
        font-size: 0.72rem;
    }

    .hero-stats {
        justify-content: center;
        gap: 1.25rem;
        margin: 1.5rem 0 1.75rem;
    }

    .hero-stat {
        text-align: left;
    }

    .hero-stat-num {
        font-size: 1.35rem;
    }

    .hero-title::before {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-buttons .btn,
    .hero-buttons .btn-gold {
        width: 100%;
        max-width: 300px;
        white-space: nowrap;
        font-size: 1rem;
    }

    /* Fixed CTA bar - more padding on mobile */
    .fixed-cta-bar {
        padding: 0.75rem 1.5rem;
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    }

    .fixed-cta-btn {
        width: 100%;
        max-width: 350px;
    }

    /* Sections */
    .section {
        padding: 4rem 0;
    }

    .section-title {
        font-size: 1.75rem;
    }

    .container {
        padding: 0 1.25rem;
    }

    /* Profile */
    .profile-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .profile-image,
    .profile-photo {
        min-height: 0;
    }

    .profile-image {
        width: min(100%, 480px);
        margin: 0 auto;
        aspect-ratio: 4 / 5;
    }

    .profile-photo {
        height: 100%;
    }

    .profile-image-placeholder {
        max-width: 250px;
        margin: 0 auto;
    }

    /* Worry */
    .worry-grid {
        grid-template-columns: 1fr;
    }

    .worry-list {
        gap: 0;
    }

    .worry-list .worry-item:nth-child(2) {
        border-top: 0;
    }

    .worry-layout {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .worry-copy .section-header {
        text-align: center;
    }

    .worry-copy .section-title::after {
        margin-right: auto;
        margin-left: auto;
    }

    .worry-copy .section-subtitle {
        margin: 0 auto;
    }

    .worry-visual {
        min-height: 640px;
    }

    .worry-reassurance {
        grid-template-columns: 1fr;
    }

    .worry-reassurance > img {
        aspect-ratio: 16 / 10;
    }

    .worry-reassurance-copy {
        padding: 2.25rem 2rem;
    }

    .profile-name-ja {
        font-size: 1.5rem;
    }

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

    .credentials {
        padding: 2rem 1.5rem;
    }

    /* Services */
    .services-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    /* Flow */
    .flow-steps {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .flow-step:not(:last-child)::after {
        top: auto;
        bottom: -1rem;
        right: 50%;
        transform: translateX(50%) rotate(135deg);
    }

    /* FAQ */
    .faq-item summary {
        padding: 1.15rem 2.8rem 1.15rem 1.25rem;
        font-size: 0.9rem;
    }

    .faq-item p {
        padding: 0 1.25rem 1.25rem 1.25rem;
    }

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

    .pricing-cards {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .pricing-card-featured {
        transform: none;
        order: -1;
    }

    .pricing-card-featured:hover {
        transform: translateY(-4px);
    }

    /* Voices */
    .voices-grid {
        grid-template-columns: 1fr;
    }

    /* Quote band / YouTube */
    .quote-band {
        padding: 5rem 1.5rem;
    }

    .youtube-videos {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .analysis-detail {
        padding: 2.5rem 1.5rem;
    }

    /* Contact */
    .contact-content {
        grid-template-columns: 1fr;
    }

    .contact-person {
        min-height: 0;
        aspect-ratio: 5 / 6;
    }

    .contact-person img {
        min-height: 0;
    }

    .quote-band {
        padding: 6rem 2rem;
    }

    /* Footer */
    .footer-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

/* ---------- Small Mobile (480px以下) ---------- */
@media (max-width: 480px) {
    html {
        font-size: 16px;
    }

    .header-inner {
        height: 64px;
        padding: 0 1rem;
    }

    .logo-img {
        height: 48px;
    }

    .hero {
        min-height: 90vh;
    }

    .hero-title {
        font-size: 1.85rem;
    }

    .hero-description br {
        display: none;
    }

    .section {
        padding: 3rem 0;
    }

    .section-header {
        margin-bottom: 2.5rem;
    }

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

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

    .profile-message br {
        display: none;
    }

    .contact-card {
        padding: 2rem 1.5rem;
    }

    .worry-reassurance-copy {
        padding: 2rem 1.35rem;
    }

    .worry-copy .section-title {
        font-size: 1.9rem;
    }

    .worry-header .section-title {
        font-size: 1.65rem;
    }

    .worry-list .worry-item {
        grid-template-columns: 2.1rem 1fr;
        padding: 1rem 0;
    }

    .worry-conclusion {
        padding: 1.75rem 0.5rem;
    }

    .worry-conclusion p {
        font-size: 1.25rem;
    }

    .worry-copy .worry-item {
        grid-template-columns: 2.1rem 1fr;
        padding: 0.9rem 0;
    }

    .worry-visual {
        min-height: 0;
        background: var(--color-primary-dark);
    }

    .worry-visual > img {
        height: auto;
        aspect-ratio: 4 / 3;
        object-position: 62% center;
    }

    .worry-visual figcaption {
        position: static;
        max-width: none;
        padding: 1.75rem 1.35rem;
        background: var(--color-primary-dark);
    }

    .worry-reassurance-copy h3 {
        font-size: 1.45rem;
    }

    .quote-band {
        min-height: 500px;
        padding: 4rem 1.25rem;
        display: flex;
        align-items: flex-end;
    }

    .quote-band-img {
        object-position: 64% center;
    }

    .quote-band::after {
        background: linear-gradient(180deg, rgba(15, 36, 64, 0.05) 0%, rgba(15, 36, 64, 0.18) 42%, rgba(15, 36, 64, 0.95) 100%);
    }

    .quote-band-txt {
        font-size: 1.35rem;
        line-height: 1.8;
    }

    .contact-actions {
        padding: 0;
    }

    .contact-card p br {
        display: none;
    }
}

/* ---------- Nav Overlay ---------- */
.nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 999;
}

.nav-overlay.active {
    display: block;
}

/* --- LINE Tokuten LP --- */
@media (max-width: 768px) {
    .lp-hero {
        padding: 7.5rem 0 3.5rem;
    }

    .lp-hero-title {
        font-size: 2.1rem;
    }

    .lp-hero-num {
        font-size: 3.2rem;
    }

    .lp-pdf-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.8rem 1.2rem;
    }

    .lp-shindan-box,
    .lp-video-box {
        padding: 2.4rem 1.6rem;
    }

    .lp-video-items {
        grid-template-columns: 1fr;
        max-width: 320px;
    }

    .lp-howto-steps {
        grid-template-columns: 1fr;
    }
}

/* --- LP v2 / 特典バナー --- */
@media (max-width: 768px) {
    .lp-hero-grid,
    .lp-shindan-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }

    .lp-hero-grid .lp-hero-badges {
        justify-content: center;
    }

    .lp-hero-visual {
        order: -1;
    }

    .lp-final-banner,
    .tokuten-banner-inner {
        grid-template-columns: 1fr;
    }

    .lp-final-visual img,
    .tokuten-banner-visual img {
        aspect-ratio: 16 / 10;
    }

    .tokuten-banner-copy {
        padding: 2rem 1.5rem 2.4rem;
        text-align: center;
    }

    .tokuten-banner-title {
        font-size: 1.6rem;
    }

    .lp-final-copy {
        padding: 2.2rem 1.5rem 2.6rem;
    }
}