/* =========================================================
   Responsive / media queries — Aqua Book Writers
   ========================================================= */

@media (max-width: 1399.98px) {
    .header-inner { column-gap: 14px; }
    .main-nav .nav-link { padding: 8px 7px; font-size: .74rem; }
    .header-actions .header-cta,
    .header-actions .btn-aqua { padding: 10px 14px; font-size: .78rem; }
}

@media (max-width: 1299.98px) {
    .main-nav { gap: 0; }
    .main-nav .nav-link { padding: 7px 6px; font-size: .7rem; }
    .header-inner { column-gap: 10px; }
    .brand-logo img { height: 42px; }
}

@media (max-width: 1199.98px) {
    /* Nav hidden below xl — keep logo left, actions right */
    .header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 12px;
    }
    .brand-logo { justify-self: start; }
    .header-actions { justify-self: end; }

    /* Hamburger shows below xl — keep menu scrollable on tablet too */
    .mobile-nav {
        max-height: calc(100dvh - var(--topbar-h) - var(--header-h));
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding: 10px 16px 24px;
    }
    .mobile-nav a {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    .mobile-nav .btn {
        display: inline-flex;
        width: 100%;
        min-height: 48px;
        color: #fff !important;
    }

    .services-flow { grid-template-columns: 1fr 1fr; }
    .slab-a, .slab-b, .slab-c, .slab-d, .slab-e, .slab-f { grid-column: auto; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
    .hero-title { max-width: none; }
    .book-fan { width: 380px; height: 430px; }
    .fan-book { width: 150px; }
    .fan-book img { height: 230px; }
    .fan-book.b3 { width: 172px; }
    .fan-book.b3 img { height: 262px; }
}

@media (max-width: 991.98px) {
    :root { --header-h: 68px; }

    /* Header scrolls away with the page on phones — no sticky bar */
    .site-header {
        position: relative;
        top: auto;
    }

    .footer-top {
        flex-direction: column;
        text-align: center;
        padding: 24px 20px;
    }
    .footer-top-actions { justify-content: center; }
    .footer-col h4::after { left: 50%; transform: translateX(-50%); }
    .footer-col { text-align: center; }
    .footer-brand { text-align: center; }
    .footer-brand p { margin-left: auto; margin-right: auto; }
    .footer-social { justify-content: center; }
    .footer-contact a { text-align: left; }
    .footer-trust { justify-content: center; }
    .footer-bottom { justify-content: center; text-align: center; }

    .quote-popup-layout { grid-template-columns: 1fr; }
    .quote-popup-visual { max-height: 200px; }
    .quote-popup-visual img { min-height: 200px; }
    .quote-popup-visual-card { left: 12px; right: 12px; bottom: 12px; padding: 12px 14px; }
    .quote-popup-panel { padding: 28px 22px 24px; }
    .quote-popup-close { top: 10px; right: 10px; width: 36px; height: 36px; }

    .why-shell { grid-template-columns: 1fr; gap: 28px; }
    .why-intro { text-align: center; }
    .why-intro > p { margin-left: auto; margin-right: auto; }
    .why-intro-actions { justify-content: center; }

    .section { padding: 64px 0; }
    .section.services-section,
    .section.why-section,
    .section.process-section,
    .section.portfolio-section,
    .section.faq-section,
    .section.about-values,
    .section.about-approach,
    .section.about-trust,
    .section.service-intro,
    .section.service-includes,
    .section.service-process,
    .section.service-why,
    .section.contact-ways,
    .section.contact-main {
        padding-top: 56px;
        padding-bottom: 56px;
    }
    .about-story,
    .about-stats { padding-top: 56px; padding-bottom: 56px; }

    .stats-band { padding: 56px 0; }
    .mid-cta { padding: 56px 0; }
    .bridge-frame { padding: 48px 0 28px; }
    .section.testimonials-section { padding-top: 40px; padding-bottom: 56px; }
    .final-cta { padding: 56px 0; }

    .about-values-grid { grid-template-columns: 1fr; }
    .about-trust-grid { grid-template-columns: 1fr 1fr; }
    .about-approach-cta { justify-content: center; }
    .about-approach .col-lg-5 { text-align: center; }

    .contact-ways-grid { grid-template-columns: 1fr; }
    .contact-shell { grid-template-columns: 1fr; gap: 24px; padding: 18px; }
    .contact-copy { text-align: center; }
    .contact-copy-kicker { justify-content: center; }
    .contact-copy > p { margin-left: auto; margin-right: auto; }
    .contact-mini-trust { justify-content: center; }
    .contact-points { text-align: left; max-width: 420px; margin-left: auto; margin-right: auto; }
    .contact-points li:hover { transform: translateY(-3px); }

    .service-includes-grid { grid-template-columns: 1fr 1fr; }
    .service-why-grid { grid-template-columns: 1fr 1fr; }
    .service-intro-visual img { height: 300px; }
    .service-intro .col-lg-6:last-child { text-align: center; }
    .service-intro .about-check-list { text-align: left; max-width: 420px; margin-left: auto; margin-right: auto; }
    .service-process .col-lg-5 { text-align: center; }
    .service-process .about-approach-cta { justify-content: center; }

    .about-story-visual img { height: 320px; }
    .about-story .col-lg-6:last-child { text-align: center; }
    .about-story .about-check-list { text-align: left; max-width: 420px; margin-left: auto; margin-right: auto; }

    .inner-banner { padding: 64px 0 80px; text-align: center; }
    .inner-banner-copy { margin: 0 auto; }
    .inner-banner-copy > p { margin-left: auto; margin-right: auto; }
    .inner-banner-cta { justify-content: center; }
    .inner-banner-visual { max-width: 480px; margin: 10px auto 0; padding: 10px; }
    .inner-banner-media { transform: none; }
    .inner-banner-visual:hover .inner-banner-media { transform: translateY(-3px); }
    .inner-banner-media img { height: 260px; }
    .inner-banner-chip.chip-b { display: none; }

    .hero {
        min-height: auto;
        padding: 48px 0 100px;
        text-align: center;
    }
    .brand-lockup { justify-content: center; }
    .brand-lockup-text { align-items: center; }
    .hero-lead { margin-left: auto; margin-right: auto; }
    .hero-cta,
    .hero-assure { justify-content: center; }
    .book-stage { min-height: 440px; margin-top: 20px; }
    .book-fan { width: 340px; height: 400px; }
    .fan-book.b1 { transform: translate(-50%, -58%) rotate(-24deg) translateX(-100px) translateZ(-40px); }
    .fan-book.b2 { transform: translate(-50%, -58%) rotate(-12deg) translateX(-52px) translateZ(-10px); }
    .fan-book.b4 { transform: translate(-50%, -58%) rotate(12deg) translateX(52px) translateZ(-10px); }
    .fan-book.b5 { transform: translate(-50%, -58%) rotate(24deg) translateX(100px) translateZ(-40px); }
    .book-stage:hover .fan-book.b1 { transform: translate(-50%, -58%) rotate(-28deg) translateX(-118px) translateZ(-20px); }
    .book-stage:hover .fan-book.b5 { transform: translate(-50%, -58%) rotate(28deg) translateX(118px) translateZ(-20px); }

    .process-steps { grid-template-columns: 1fr 1fr; }
    .quote-panel { margin-top: 10px; }
    .audience-section { margin-top: -24px; }
    .audience-shell { padding: 14px; border-radius: 28px; }
    .audience-copy { padding: 18px 12px 8px; }
    .audience-section h2 { max-width: none; }
    .aud-feature:hover { transform: translateY(-4px); }
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .bridge-visual img { max-width: 280px; }
    .bridge-section .col-lg-7 { text-align: center; }
    .bridge-cta, .bridge-points { justify-content: center; }
    .bridge-points li { justify-content: center; text-align: left; }
    .mid-cta-inner {
        flex-direction: column;
        text-align: center;
        padding: 28px 22px;
    }
    .mid-cta-actions { justify-content: center; }
    .final-cta-panel { padding: 28px 22px; }
    .final-cta .col-lg-5 { text-align: center; }
    .final-cta .btn-chat-light { margin-left: auto; margin-right: auto; }
    .faq-intro { text-align: center; margin-bottom: 10px; }
    .faq-intro h2,
    .faq-intro p { max-width: none; margin-left: auto; margin-right: auto; }
    .orbit-spark { display: none; }
}

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

    .aqua-wave-line,
    .aqua-flow-3 { display: none; }
    .sec-ripple { opacity: .5; }
    .stats-beam,
    .stats-ring.r3,
    .stats-spark { display: none; }

    .trust-logos { padding: 22px 0 28px; }
    .trust-logos-track { gap: 12px; animation-duration: 22s; }
    .trust-logo-card {
        min-width: 148px;
        height: 58px;
        padding: 10px 16px;
    }

    .section { padding: 52px 0; }
    .section-head { margin-bottom: 32px; }
    .section-head h2 { font-size: clamp(1.75rem, 6vw, 2.2rem); }
    .section.services-section,
    .section.why-section,
    .section.process-section,
    .section.portfolio-section,
    .section.faq-section {
        padding-top: 48px;
        padding-bottom: 48px;
    }
    .stats-band { padding: 48px 0; }
    .mid-cta { padding: 48px 0; }
    .final-cta { padding: 48px 0; }

    .topbar-inner { min-height: 38px; gap: 8px; }
    .topbar-msg {
        font-size: .82rem;
        line-height: 1.35;
        padding: 4px 0;
    }
    .topbar { padding: 0 4px; }

    .brand-logo img { height: 40px; }
    .header-inner { column-gap: 8px; min-height: var(--header-h); }
    .header-actions { gap: 8px; }
    /* Avoid logo + CTA + hamburger crush on phones */
    .header-actions .header-cta { display: none; }
    .header-actions .btn-aqua { padding: 10px 14px; font-size: .8rem; }
    .nav-toggle { width: 42px; height: 42px; flex-shrink: 0; }

    .hero { padding: 36px 0 88px; }
    .hero-scroll { display: none; }
    .hero-title { font-size: clamp(1.95rem, 8vw, 2.35rem); }
    .hero-lead { font-size: .98rem; }
    .hero-cta { flex-wrap: wrap; gap: 10px; }
    .brand-lockup-logo { height: 48px; }

    .audience-shell { padding: 12px; border-radius: 24px; }
    .audience-copy { padding: 14px 8px 6px; }
    .aud-quote-chip {
        flex-direction: column;
        text-align: center;
        padding: 12px 14px;
    }
    .aud-quote-chip p { font-size: 1.05rem; }
    .aud-feature {
        grid-template-columns: auto 1fr;
        gap: 12px;
        padding: 14px 16px;
    }
    .aud-feature .aud-num { display: none; }
    .aud-feature:hover { transform: translateY(-3px); }

    .quote-panel::before { display: none; }
    .quote-panel-head { padding: 24px 20px 20px; }
    .quote-mini-stats { gap: 8px; }
    .quote-mini-stats b { font-size: 1.1rem; }
    .quote-mini-stats span { font-size: .62rem; }
    .lead-form { padding: 20px 18px 22px; }

    .services-flow { grid-template-columns: 1fr; }
    .service-slab {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 10px;
        padding: 22px 18px;
        min-height: 0;
    }
    .service-slab .slab-icon { justify-self: center; order: -1; }
    .service-slab .slab-index { font-size: 1.55rem; }
    .service-slab .slab-link { display: inline-block; }

    .process-steps { grid-template-columns: 1fr; }
    .process-step { padding: 22px 20px; }

    .stats-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .stat-item { padding: 20px 12px; }
    .stat-item p { font-size: .68rem; letter-spacing: .06em; }

    .folio-book { width: 140px; }
    .folio-book img { height: 210px; }
    .portfolio-track { gap: 18px; }

    .testimonial-slider { min-height: 0; }
    .t-card { padding: 24px 20px; }
    .t-card p { font-size: 1.15rem; }
    .t-card-top { margin-bottom: 10px; }

    .faq-q { padding: 16px 18px; font-size: .95rem; gap: 10px; }
    .faq-a { padding: 0 18px 18px; }

    .footer-grid { grid-template-columns: 1fr; }
    .site-footer { padding-top: 72px; }
    .footer-wave-wrap { top: -48px; height: 50px; }
    .footer-top { padding: 20px 18px; margin-bottom: 36px; }
    .footer-top-actions { width: 100%; }

    .bridge-frame { padding: 40px 0 24px; }
    .bridge-visual img { max-width: min(280px, 88vw); }
    .section.testimonials-section { padding-top: 36px; padding-bottom: 48px; }

    .book-stage { min-height: 360px; }
    .book-fan { width: 300px; height: 340px; }
    .fan-book { width: 118px; }
    .fan-book img { height: 180px; }
    .fan-book.b3 { width: 140px; }
    .fan-book.b3 img { height: 214px; }
    .fan-book.b1,
    .fan-book.b5 { display: none; }
    .hero-beam,
    .hero-ink { display: none; }
    .assure-item { font-size: .76rem; padding: 7px 10px; }

    .why-grid { grid-template-columns: 1fr; }
    .why-intro-actions { width: 100%; }
    .about-trust-grid { grid-template-columns: 1fr; }
    .about-approach-cta { width: 100%; }

    .service-includes-grid,
    .service-why-grid { grid-template-columns: 1fr; }
    .service-intro-visual img { height: 260px; }
    .about-story-visual img { height: 260px; }

    .inner-banner { padding: 52px 0 72px; }
    .legal-banner { padding: 52px 0 72px; }
    .content-page { padding: 32px 0 56px; }
    .content-page-inner > p,
    .content-page-inner ul li { font-size: .98rem; }
    .inner-banner-copy h1 { font-size: clamp(1.7rem, 6.5vw, 2.25rem); word-break: break-word; }
    .inner-banner-copy > p { font-size: .98rem; }
    .blog-banner .inner-banner-copy h1 { font-size: clamp(1.85rem, 7vw, 2.35rem); }
    .inner-banner-media img { height: 220px; }
    .inner-banner-visual { max-width: 100%; padding: 8px; }
    .inner-banner-float {
        left: 12px;
        bottom: 12px;
        font-size: .74rem;
        padding: 8px 12px;
    }
    .inner-banner-chip.chip-a {
        top: 12px;
        right: 12px;
        font-size: .68rem;
        padding: 6px 10px;
    }

    .contact-shell { padding: 14px; border-radius: 24px; gap: 20px; }
    .contact-copy h2 { font-size: clamp(1.75rem, 6vw, 2.2rem); }
    .contact-form-panel { padding: 22px 18px 20px; }
    .contact-form-head h3 { font-size: 1.25rem; }
    .contact-points li:hover { transform: none; }

    .final-cta-panel { padding: 24px 18px; }
    .final-cta h2 { font-size: clamp(1.75rem, 6vw, 2.2rem); }

    .mid-cta-inner { padding: 24px 18px; }
    .mid-cta-actions { width: 100%; }

    .quote-popup { padding: 14px; }
    .quote-popup-dialog {
        width: 100%;
        max-height: calc(100dvh - 28px);
        border-radius: 18px;
    }
    .quote-popup-panel { padding: 24px 18px 20px; }
    .quote-popup-head { padding-left: 14px; margin-bottom: 20px; }
    .quote-popup-head h2 { font-size: 1.55rem; }
    .quote-popup-head p { font-size: .88rem; }
}

@media (max-width: 575.98px) {
    :root { --topbar-h: 44px; }

    .container { padding-left: 16px; padding-right: 16px; }

    .hero-cta { flex-direction: column; width: 100%; }
    .hero-cta .btn { width: 100%; justify-content: center; }
    .hero-assure { flex-direction: column; align-items: center; width: 100%; }
    .assure-item { width: 100%; justify-content: center; }
    .book-fan { width: min(260px, 78vw); height: 300px; }
    .book-stage {
        min-height: 320px;
        max-width: 100%;
        overflow: hidden;
    }
    .stage-ripple.r3 { display: none; }

    .aud-feature { padding: 12px 14px; }

    .quote-mini-stats { grid-template-columns: 1fr; }
    .quote-mini-stats div {
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-align: left;
        padding: 10px 12px;
    }
    .quote-mini-stats span { letter-spacing: .04em; }

    .inner-banner-cta {
        flex-direction: column;
        width: 100%;
    }
    .inner-banner-cta .btn { width: 100%; justify-content: center; }

    .why-intro-actions .btn,
    .about-approach-cta .btn,
    .service-process .about-approach-cta .btn,
    .mid-cta-actions .btn,
    .footer-top-actions .btn { width: 100%; justify-content: center; }

    .final-cta .btn-chat-light { width: 100%; justify-content: center; }

    .stats-grid { grid-template-columns: 1fr; }
    .stat-item strong { font-size: 2.2rem; }
    .stat-item span { font-size: 1.6rem; }

    .t-card p { font-size: 1.05rem; }
    .slider-controls { gap: 12px; margin-top: 22px; }
    .slider-btn { width: 40px; height: 40px; }

    .contact-mini-trust { flex-direction: column; align-items: center; }
    .contact-mini-trust span { width: 100%; justify-content: center; }
    .contact-form .btn { width: 100%; }

    .quote-popup { padding: 10px; align-items: flex-start; }
    .quote-popup-dialog {
        max-height: calc(100dvh - 20px);
        border-radius: 16px;
    }
    .quote-popup-visual { max-height: 160px; }
    .quote-popup-visual img { min-height: 160px; }
    .quote-popup-panel { padding: 22px 16px 18px; }
    .quote-popup-head h2 { font-size: 1.35rem; }
    .quote-popup-form input,
    .quote-popup-form textarea { font-size: .9rem; padding: 13px 14px 13px 40px; }

    .footer-top-copy h3 { font-size: 1.35rem; }
    .footer-bottom { flex-direction: column; gap: 8px; }

    .service-slab h3 { font-size: 1.3rem; }
    .about-story-badge strong { font-size: 1.35rem; }
    .service-intro-badge strong { font-size: 1.3rem; }
}

@media (max-width: 399.98px) {
    .topbar-msg { font-size: .76rem; }
    .hero-title { font-size: 1.85rem; }
    .inner-banner-chip.chip-a { display: none; }
    .trust-logo-card { min-width: 132px; }
}
