/* ============================================================
   TRANSPARTNER — RESPONSIVE CSS
   Desktop ← 1280px → Laptop ← 1024px → Tablet ← 768px → Mobile ← 480px
   ============================================================ */

/* ============================================================
   LAPTOP (max-width: 1024px)
   ============================================================ */
@media (max-width: 1024px) {

  /* Header */
  .hamburger { display: flex; }
  .primary-nav { display: none; }

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

  .hero-title { font-size: clamp(2rem, 4vw, 3rem); }

  .hero-float-card--1 { left: -4%; }
  .hero-float-card--2 { right: -4%; }

  /* Features */
  .features-grid { grid-template-columns: repeat(2, 1fr); }

  /* Process */
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .process-step__connector { display: none; }

  /* Services */
  .home-services-header { flex-direction: column; align-items: flex-start; }

  /* Doc types */
  .doc-types-grid { grid-template-columns: repeat(2, 1fr); }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
  }
  .footer-col--brand { grid-column: 1 / -1; }

  /* About */
  .mission-layout { grid-template-columns: 1fr; gap: var(--space-10); }
  .mission-image { max-width: 500px; }

  /* Contact */
  .contact-layout { grid-template-columns: 1fr; gap: var(--space-10); }

  /* Blog */
  .blog-featured-card { grid-template-columns: 1fr; }
  .blog-featured-card__image { aspect-ratio: 16/7; }

}

/* ============================================================
   TABLET (max-width: 768px)
   ============================================================ */
@media (max-width: 768px) {

  /* Typography scale down */
  :root {
    --section-py: clamp(2.5rem, 6vw, 4rem);
  }

  /* Header */
  .header-cta { display: none; }

  /* Hero */
  .hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-description,
  .hero-subtitle { max-width: 100%; }

  .hero-actions {
    justify-content: center;
  }

  .hero-stats {
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-4);
  }

  .hero-stat-divider { display: none; }
  .hero-visual { display: none; }

  /* Page Hero */
  .page-hero__inner {
    grid-template-columns: 1fr;
  }
  .page-hero__image { display: none; }
  .about-hero-stats { flex-wrap: wrap; gap: var(--space-6); }

  /* Section headers */
  .section-header--center .section-subtitle {
    font-size: var(--text-base);
  }

  /* Features */
  .features-grid { grid-template-columns: 1fr; }

  /* Process */
  .process-grid { grid-template-columns: 1fr 1fr; }

  /* Services */
  .services-main-grid,
  .services-preview-grid { grid-template-columns: 1fr; }

  /* Doc types */
  .doc-types-grid { grid-template-columns: 1fr 1fr; }

  /* Languages */
  .languages-grid { gap: var(--space-2); }

  /* Calculator */
  .calc-form-row { grid-template-columns: 1fr; }

  /* Mission */
  .mission-layout { grid-template-columns: 1fr; }

  /* Values */
  .values-grid { grid-template-columns: repeat(2,1fr); }

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

  /* Blog */
  .blog-featured-card { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }

  /* Single */
  .related-posts__grid { grid-template-columns: 1fr; }
  .single-post__share { flex-direction: column; align-items: flex-start; }
  .newsletter-cta { margin-left: 0; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .footer-col--brand { grid-column: auto; }
  .footer-bottom-inner { flex-direction: column; align-items: center; text-align: center; }
  .footer-badges { flex-wrap: wrap; justify-content: center; }

  /* CTA Block */
  .cta-block {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-6);
  }
  .cta-block__actions { align-items: flex-start; width: 100%; }
  .cta-block__actions .btn { width: 100%; justify-content: center; }

  /* Map overlay card */
  .map-overlay-card {
    position: relative;
    bottom: auto;
    left: auto;
    max-width: 100%;
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
  }

  /* Testimonials */
  .testimonials-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   MOBILE (max-width: 480px)
   ============================================================ */
@media (max-width: 480px) {

  /* Hero */
  .hero-title { font-size: 2rem; }
  .hero-actions { flex-direction: column; width: 100%; }
  .hero-actions .btn { width: 100%; justify-content: center; }

  /* Stats */
  .hero-stats {
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
  }

  /* Page Hero title */
  .page-hero__title { font-size: var(--text-3xl); }

  /* Section titles */
  .section-title { font-size: var(--text-2xl); }

  /* Process */
  .process-grid { grid-template-columns: 1fr; }

  /* Doc types */
  .doc-types-grid { grid-template-columns: 1fr; }

  /* Values */
  .values-grid { grid-template-columns: 1fr; }

  /* Blog featured */
  .blog-featured-card__content { padding: var(--space-6); }

  /* Track form */
  .track-doc-form { flex-direction: column; }
  .track-doc-form .form-input { width: 100%; }

  /* Quick form */
  .quick-inquiry-form { padding: var(--space-6); }

  /* Error 404 */
  .error-404__actions { flex-direction: column; }
  .error-404__actions .btn { width: 100%; justify-content: center; }

  /* Footer badges */
  .footer-badges { flex-direction: column; }

  /* Hamburger visible */
  .hamburger { display: flex; }
}

/* ============================================================
   PRINT
   ============================================================ */
@media print {
  .site-header,
  .site-footer,
  .back-to-top,
  .whatsapp-float,
  .mobile-nav,
  .mobile-nav-backdrop,
  .hero-float-card,
  .cta-section,
  .clients-section {
    display: none !important;
  }
  body { color: #000; background: #fff; }
  a { color: #000; text-decoration: underline; }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .hero-float-card { animation: none; }
  [data-animate] { opacity: 1 !important; transform: none !important; }
}

/* ============================================================
   ENHANCED RESPONSIVE — v1.1.0 additions
   ============================================================ */

/* Clients grid already has built-in breakpoints in components.css */

/* Navigation improvements */
@media (max-width: 1024px) {
  /* Show hamburger, hide desktop nav */
  .hamburger { display: flex; }
  .primary-nav { display: none; }

  /* Clients heading responsive */
  .clients-heading__title {
    font-size: clamp(var(--text-2xl), 4vw, var(--text-4xl));
  }
}

/* Stronger heading at medium screens */
@media (min-width: 769px) and (max-width: 1200px) {
  .hero-title { font-size: clamp(2.25rem, 4.5vw, 3.5rem); }
}

/* Mobile heading scale */
@media (max-width: 480px) {
  .clients-heading__title { font-size: var(--text-2xl); }
  .hero-title { font-size: 1.875rem; }
  .section-title { font-size: var(--text-2xl); }

  /* Stack hero actions vertically on small phones */
  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .hero-actions .btn {
    width: 100%;
    justify-content: center;
  }
}

/* Ensure images don't flash invisible on mobile */
@media (prefers-reduced-data: reduce) {
  img[loading="lazy"] {
    opacity: 1;
  }
}
