/**
 * SeoTiGR — Responsive Styles
 * Mobile-first: 320-767px (mobile), 768-1023px (tablet), 1024px+ (desktop)
 * Всі touch-friendly елементи мають мінімум 44px
 */

/* ============================================================
   BASE: Mobile-first (320px+)
   Ці стилі вже включені в основні CSS.
   Тут лише те, що специфічне для малих екранів.
   ============================================================ */

/* Хедер на мобільних */
@media (max-width: 767px) {
    :root {
        --header-height: 64px;
        --container: 100%;
    }

    /* --- Хедер --- */
    .seotigr-header__inner {
        padding-inline: 1rem;
    }

    .seotigr-nav,
    .seotigr-header__cta {
        display: none;
    }

    .seotigr-header__burger {
        display: flex;
    }

    .seotigr-mobile-menu {
        display: block;
    }

    /* --- Герой --- */
    .seotigr-hero {
        min-height: 85vh;
    }

    .seotigr-hero__content {
        padding: 5rem 1rem 3rem;
    }

    .seotigr-hero__actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .seotigr-hero__actions .seotigr-btn {
        width: 100%;
        justify-content: center;
    }

    /* --- Секції --- */
    .seotigr-section {
        padding-block: 3rem;
    }

    .seotigr-container {
        padding-inline: 1rem;
    }

    .seotigr-section__header {
        margin-bottom: 2rem;
    }

    .seotigr-section__desc {
        font-size: 1rem;
    }

    /* --- Картки послуг --- */
    .seotigr-services-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .seotigr-card {
        padding: 1.5rem;
    }

    /* --- Лічильники --- */
    .seotigr-counters__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0;
    }

    .seotigr-counter {
        padding: 1.5rem 0.75rem;
        border-right: 1px solid rgba(255, 255, 255, 0.1);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .seotigr-counter + .seotigr-counter::before {
        display: none;
    }

    .seotigr-counter:nth-child(2n) {
        border-right: none;
    }

    .seotigr-counter:nth-last-child(-n+2) {
        border-bottom: none;
    }

    /* --- FAQ --- */
    .seotigr-faq__question {
        padding: 1rem 1.25rem;
        font-size: 0.9375rem;
    }

    /* --- Відгуки --- */
    .seotigr-reviews__grid {
        grid-template-columns: 1fr;
    }

    /* --- Підвал --- */
    .seotigr-footer__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding-inline: 1rem;
    }

    .seotigr-footer__main {
        padding-block: 3rem 2rem;
    }

    .seotigr-footer__bottom-inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding-inline: 1rem;
    }

    .seotigr-footer__legal-links {
        justify-content: center;
    }

    /* --- Блог --- */
    .seotigr-blog__grid {
        grid-template-columns: 1fr;
        padding-inline: 1rem;
    }

    .seotigr-blog__posts {
        grid-template-columns: 1fr;
    }

    .seotigr-blog__posts .seotigr-post-card:first-child {
        grid-column: 1;
        display: block;
    }

    .seotigr-blog__posts .seotigr-post-card:first-child .seotigr-post-card__image {
        border-radius: var(--radius-md) var(--radius-md) 0 0;
    }

    .seotigr-sidebar {
        display: none; /* Сайдбар ховаємо на мобільних */
    }

    /* --- Портфоліо --- */
    .seotigr-portfolio__grid {
        grid-template-columns: 1fr;
    }

    .seotigr-portfolio__grid .seotigr-portfolio-card--featured {
        grid-column: 1;
    }

    /* --- Послуги --- */
    .seotigr-service-hero__inner {
        grid-template-columns: 1fr;
    }

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

    .seotigr-service-includes__grid {
        grid-template-columns: 1fr;
    }

    .seotigr-pricing__grid {
        grid-template-columns: 1fr;
    }

    .seotigr-pricing-card--featured {
        transform: none;
    }

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

    .seotigr-why-us__layout {
        grid-template-columns: 1fr;
        gap: 2rem;
        padding-inline: 1rem;
    }

    .seotigr-why-us__decoration {
        display: none;
    }

    .seotigr-service-steps {
        grid-template-columns: 1fr;
        padding-inline: 1rem;
    }

    .seotigr-service-steps::before {
        display: none;
    }

    /* --- Кейси --- */
    .seotigr-case__hero-inner {
        grid-template-columns: 1fr;
    }

    .seotigr-case__mockup {
        display: none;
    }

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

    .seotigr-case__result {
        border-right: 1px solid rgba(47, 69, 56, 0.1);
        border-bottom: 1px solid rgba(47, 69, 56, 0.1);
    }

    .seotigr-case__result:nth-child(2n) { border-right: none; }
    .seotigr-case__result:nth-last-child(-n+2) { border-bottom: none; }

    .seotigr-case__nav {
        grid-template-columns: 1fr;
    }

    .seotigr-case__nav-item:last-child {
        text-align: left;
    }

    .seotigr-case__nav-item:last-child .seotigr-case__nav-dir {
        justify-content: flex-start;
    }

    /* --- Кроки процесу --- */
    .seotigr-steps {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .seotigr-step:not(:last-child)::after {
        display: none;
    }

    /* --- Плаваюча CTA --- */
    .seotigr-floating-cta {
        right: 16px;
        bottom: 16px;
    }

    .seotigr-floating-cta__button {
        padding: 0.75rem 1.25rem;
        font-size: 0.875rem;
    }

    /* --- Одинарна стаття --- */
    .seotigr-single-post__layout {
        grid-template-columns: 1fr;
    }

    .seotigr-post-footer {
        flex-direction: column;
    }

    /* --- Мега-меню --- */
    .seotigr-mega-menu {
        display: none !important;
    }

    /* --- Герой послуги --- */
    .seotigr-service-hero {
        padding: 5rem 1rem 3rem;
    }

    /* --- Touch-friendly кнопки мінімум 44px --- */
    .seotigr-btn,
    .seotigr-faq__question,
    .seotigr-nav__link,
    .seotigr-mobile-menu__list a,
    .seotigr-pagination a,
    .seotigr-pagination span,
    .seotigr-share-btn,
    .seotigr-footer__social-link,
    .seotigr-header__burger {
        min-height: 44px;
    }
}

/* ============================================================
   TABLET: 768px – 1023px
   ============================================================ */

@media (min-width: 768px) and (max-width: 1023px) {
    :root {
        --header-height: 72px;
    }

    /* --- Хедер --- */
    .seotigr-nav {
        display: none;
    }

    .seotigr-header__burger {
        display: flex;
    }

    .seotigr-mobile-menu {
        display: block;
    }

    .seotigr-header__cta {
        display: block;
    }

    /* --- Сітки --- */
    .seotigr-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .seotigr-counter {
        padding: 1.5rem 1rem;
    }

    .seotigr-counter:nth-child(odd)::before {
        display: none;
    }

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

    /* --- Блог --- */
    .seotigr-blog__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

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

    .seotigr-blog__posts .seotigr-post-card:first-child {
        grid-column: 1 / -1;
    }

    .seotigr-sidebar {
        display: none;
    }

    /* --- Портфоліо --- */
    .seotigr-portfolio__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .seotigr-portfolio__grid .seotigr-portfolio-card--featured {
        grid-column: 1 / -1;
    }

    /* --- Послуги --- */
    .seotigr-service-hero__inner {
        grid-template-columns: 1fr;
    }

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

    .seotigr-pricing__grid {
        grid-template-columns: 1fr;
    }

    .seotigr-pricing-card--featured {
        transform: none;
    }

    .seotigr-why-us__layout {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

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

    /* --- Кроки --- */
    .seotigr-steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .seotigr-step:nth-child(2n):not(:last-child)::after {
        display: none;
    }

    /* --- Підвал --- */
    .seotigr-footer__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem;
    }

    /* --- Кейси --- */
    .seotigr-case__results {
        grid-template-columns: repeat(2, 1fr);
    }

    .seotigr-case__result:nth-child(2n) { border-right: none; }

    /* --- Мега-меню --- */
    .seotigr-mega-menu {
        display: none !important;
    }

    /* --- Одинарна стаття --- */
    .seotigr-single-post__layout {
        grid-template-columns: 1fr;
    }

    .seotigr-sidebar {
        display: none;
    }
}

/* ============================================================
   SMALL DESKTOP: 1024px – 1199px
   ============================================================ */

@media (min-width: 1024px) and (max-width: 1199px) {
    /* --- Хедер --- */
    .seotigr-header__burger,
    .seotigr-mobile-menu {
        display: none;
    }

    .seotigr-nav {
        display: flex;
    }

    .seotigr-nav__link {
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
    }

    /* --- Сітки --- */
    .seotigr-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .seotigr-service-steps::before {
        display: none;
    }

    /* --- Підвал --- */
    .seotigr-footer__grid {
        grid-template-columns: 1.2fr 1fr 1fr;
        gap: 2rem;
    }

    /* Останню колонку переносимо */
    .seotigr-footer__col:last-child {
        grid-column: 1 / -1;
    }
}

/* ============================================================
   DESKTOP: 1200px+
   Повний функціонал, вже описаний в основних CSS
   ============================================================ */

@media (min-width: 1200px) {
    .seotigr-header__burger,
    .seotigr-mobile-menu {
        display: none !important;
    }

    .seotigr-nav {
        display: flex !important;
    }
}

/* ============================================================
   WIDE: 1400px+
   ============================================================ */

@media (min-width: 1400px) {
    .seotigr-hero__content {
        padding-block: 8rem 5rem;
    }

    .seotigr-section {
        padding-block: 6rem;
    }
}

/* ============================================================
   Print стилі
   ============================================================ */

@media print {
    .seotigr-header,
    .seotigr-footer,
    .seotigr-floating-cta,
    .seotigr-breadcrumbs,
    .seotigr-pagination {
        display: none !important;
    }

    body {
        font-size: 12pt;
        color: #000;
    }

    a {
        color: #000;
        text-decoration: underline;
    }

    .seotigr-post-content a::after {
        content: ' (' attr(href) ')';
        font-size: 0.8em;
        opacity: 0.6;
    }
}

/* ============================================================
   Accessibility — зменшення руху
   ============================================================ */

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

    .seotigr-floating-cta__button {
        animation: none;
    }

    html {
        scroll-behavior: auto;
    }
}
