/* ==========================================================================
   ThorDrone DJI-Style Theme — Responsive Styles
   Breakpoints: 1024px (tablet), 768px (mobile), 480px (small mobile)
   All tokens are --td-* (see DJI-Style-Design-Spec.md).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Tablet Landscape (max-width: 1024px)
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    :root {
        --td-space-8: 96px;
        --td-space-7: 80px;
    }

    /* Header */
    .header__nav {
        display: none;
    }

    .header__toggle {
        display: flex;
    }

    .header__search {
        display: none;
    }

    /* Hero */
    .td-hero {
        height: 85vh;
    }

    .td-hero__title {
        font-size: 48px;
    }

    .td-hero__tagline {
        font-size: 18px;
    }

    /* Showcase cards */
    .td-showcase__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .td-showcase__card {
        min-height: 480px;
    }

    .td-showcase__card:nth-child(3) {
        grid-column: span 2;
    }

    /* Product Grid (home) */
    .td-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Product Grid (archive / related) */
    .product-grid--4col {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Brand value band */
    .td-values__stats {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--td-space-4);
    }

    /* Product Detail */
    .product-detail {
        grid-template-columns: 1fr;
    }

    .product-detail__image {
        position: static;
        max-width: 600px;
    }

    /* About */
    .about-mission {
        grid-template-columns: 1fr;
    }

    .about-mission__visual {
        min-height: 200px;
    }

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

    .about-stats__item:nth-child(2) {
        border-right: none;
    }

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

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

    /* Footer */
    .td-footer__inner {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--td-space-5);
    }

    .td-footer__col:first-child {
        grid-column: span 2;
    }
}

/* --------------------------------------------------------------------------
   Mobile (max-width: 768px)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    :root {
        --td-fs-hero: 40px;
        --td-fs-h1: 36px;
        --td-fs-h2: 30px;
        --td-fs-h3: 18px;
        --td-space-8: 64px;
        --td-space-7: 48px;
        --td-space-5: 32px;
    }

    /* Header */
    .site-header {
        height: 56px;
    }

    .header__inner {
        height: 56px;
    }

    .header__brand-text {
        display: none;
    }

    .header__language {
        display: none;
    }

    body:not(.front-page) .site-content {
        padding-top: 56px;
    }

    /* Mobile Menu */
    .mobile-menu {
        position: fixed;
        top: 56px;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--td-bg-primary);
        z-index: 999;
        padding: var(--td-space-4);
        overflow-y: auto;
    }

    .mobile-menu[hidden] {
        display: none;
    }

    .mobile-menu__nav {
        display: flex;
        flex-direction: column;
        gap: var(--td-space-1);
        margin-bottom: var(--td-space-5);
    }

    .mobile-menu__link {
        display: block;
        padding: var(--td-space-3);
        font-size: 18px;
        font-weight: var(--td-fw-medium);
        color: var(--td-text-primary);
        border-bottom: 1px solid var(--td-border);
        text-decoration: none;
    }

    .mobile-menu__link:hover {
        color: var(--td-accent);
    }

    /* Hero */
    .td-hero {
        height: 70vh;
    }

    .td-hero__content {
        bottom: 48px;
        left: var(--td-space-3);
        right: var(--td-space-3);
    }

    .td-hero__links {
        gap: var(--td-space-3);
    }

    /* Showcase cards stack */
    .td-showcase__grid {
        grid-template-columns: 1fr;
    }

    .td-showcase__card {
        min-height: 420px;
    }

    .td-showcase__card:nth-child(3) {
        grid-column: span 1;
    }

    .td-showcase__card-content {
        padding: var(--td-space-4);
    }

    /* Product Grid */
    .td-grid,
    .product-grid--4col,
    .product-grid--3col {
        grid-template-columns: 1fr;
    }

    /* Brand value band 2x2 */
    .td-values__stats {
        grid-template-columns: 1fr 1fr;
    }

    .td-grid-header h2 {
        font-size: 30px;
    }

    .td-cta h2 {
        font-size: 30px;
    }

    /* About */
    .capabilities-grid {
        grid-template-columns: 1fr;
    }

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

    /* Contact Form */
    .contact-form .form-row {
        grid-template-columns: 1fr;
    }

    /* Footer */
    .td-footer__inner {
        grid-template-columns: 1fr;
        gap: var(--td-space-4);
    }

    .td-footer__col:first-child {
        grid-column: span 1;
    }

    .td-footer__bottom {
        flex-direction: column;
        text-align: center;
    }
}

/* --------------------------------------------------------------------------
   Small Mobile (max-width: 480px)
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
    :root {
        --td-space-4: 16px;
        --td-space-3: 24px;
    }

    .container,
    .td-container {
        padding-inline: 16px;
    }

    .site-header {
        height: 52px;
    }

    .header__inner {
        height: 52px;
    }

    body:not(.front-page) .site-content {
        padding-top: 52px;
    }

    .mobile-menu {
        top: 52px;
    }

    .td-hero__title {
        font-size: 32px;
    }

    .td-hero__tagline {
        font-size: 15px;
    }

    .td-hero__dots {
        bottom: var(--td-space-2);
    }

    /* Buttons */
    .btn {
        padding: 10px 20px;
        font-size: 13px;
    }

    .btn--lg {
        padding: 12px 24px;
        font-size: 14px;
    }

    /* Product Card */
    .product-card__title {
        font-size: 16px;
    }

    .product-card__desc {
        font-size: 12px;
    }

    /* Product Grid */
    .product-grid--4col,
    .product-grid--3col,
    .product-grid--2col {
        grid-template-columns: 1fr;
    }

    /* Toolbar */
    .toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: var(--td-space-2);
    }

    .toolbar__right {
        justify-content: flex-start;
    }

    /* Taxonomy Header */
    .taxonomy-header {
        padding: var(--td-space-3);
    }

    .taxonomy-header__top {
        flex-direction: column;
        gap: var(--td-space-2);
    }

    .taxonomy-header__icon {
        width: 48px;
        height: 48px;
    }

    .taxonomy-header__title {
        font-size: 22px;
    }

    /* About */
    .about-stats {
        grid-template-columns: 1fr;
    }

    .about-stats__item {
        border-right: none;
        border-bottom: 1px solid var(--td-border);
    }

    .about-stats__item:last-child {
        border-bottom: none;
    }

    .about-stats__value {
        font-size: 32px;
    }

    /* Contact */
    .contact-form-wrap {
        padding: var(--td-space-3);
    }

    .contact-info__card {
        padding: var(--td-space-3);
    }

    /* Compliance */
    .compliance-list {
        grid-template-columns: 1fr;
    }

    /* CTA */
    .td-cta {
        padding: var(--td-space-6) var(--td-space-3);
    }

    /* Pagination */
    .pagination__btn,
    .pagination__page {
        min-width: 32px;
        height: 32px;
        font-size: 12px;
    }

    /* Breadcrumb */
    .breadcrumb__list {
        font-size: 12px;
    }

    /* 404 */
    .error-404__visual {
        height: 140px;
    }

    .error-404__code {
        font-size: 60px;
    }
}

/* --------------------------------------------------------------------------
   Print Styles
   -------------------------------------------------------------------------- */
@media print {
    .site-header,
    .td-footer,
    .header__actions,
    .mobile-menu,
    .td-hero__dots,
    .btn,
    .filter-chips,
    .toolbar,
    .pagination {
        display: none !important;
    }

    .product-detail {
        grid-template-columns: 1fr;
    }

    body {
        background: #fff;
        color: #000;
    }
}