/* ============================================
   ROTA BRASILIS — Responsive Styles
   Mobile-first breakpoints:
   480px  — Small phones → larger phones
   768px  — Tablets
   1024px — Small desktops / landscape tablets
   1280px — Full desktops
   ============================================ */

/* --- Max 1280px: Large desktops --- */
@media (max-width: 1280px) {
  .footer-grid {
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: var(--space-2xl);
  }
}

/* --- Max 1024px: Tablets landscape / small desktops --- */
@media (max-width: 1024px) {
  :root {
    --text-7xl: 3.5rem;
    --text-6xl: 3rem;
    --text-5xl: 2.5rem;
  }

  .section {
    padding: var(--space-4xl) 0;
  }

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

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

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-2xl);
  }

  /* Show mobile menu toggle */
  .menu-toggle {
    display: flex;
  }

  .nav-links {
    position: fixed;
    top: 0;
    right: -100%;
    width: 320px;
    height: 100vh;
    background: var(--primary-blue);
    flex-direction: column;
    align-items: flex-start;
    padding: var(--space-5xl) var(--space-2xl) var(--space-2xl);
    gap: var(--space-lg);
    transition: right var(--transition-base);
    z-index: var(--z-overlay);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.2);
  }

  .nav-links.open {
    right: 0;
  }

  .nav-links a {
    color: rgba(255, 255, 255, 0.9);
    font-size: var(--text-lg);
    padding: var(--space-sm) 0;
    width: 100%;
  }

  .header.scrolled .nav-links a {
    color: rgba(255, 255, 255, 0.9);
  }

  .nav-links .btn {
    margin-top: var(--space-md);
    width: 100%;
    text-align: center;
  }

  .lang-switcher {
    margin-left: 0;
    margin-top: var(--space-lg);
    padding-top: var(--space-lg);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    width: 100%;
  }

  .lang-switcher-btn {
    color: rgba(255, 255, 255, 0.9);
  }

  /* Mobile menu overlay */
  .nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: calc(var(--z-overlay) - 1);
  }

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

  /* Close button in mobile menu */
  .nav-close {
    position: absolute;
    top: var(--space-lg);
    right: var(--space-lg);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--pure-white);
    font-size: var(--text-2xl);
  }

  /* Carousel arrows */
  .carousel-arrow-prev { left: 0; }
  .carousel-arrow-next { right: 0; }
}

/* --- Max 768px: Tablets portrait --- */
@media (max-width: 768px) {
  :root {
    --text-7xl: 2.75rem;
    --text-6xl: 2.25rem;
    --text-5xl: 2rem;
    --text-4xl: 1.75rem;
  }

  .container,
  .container-narrow,
  .container-wide {
    padding: 0 var(--space-lg);
  }

  .section {
    padding: var(--space-3xl) 0;
  }

  .grid-2,
  .grid-3 {
    grid-template-columns: 1fr;
  }

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

  .stats-row {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md);
  }

  .stat-number {
    font-size: var(--text-4xl);
  }

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

  .hero-content {
    padding: var(--space-4xl) 0 var(--space-2xl);
  }

  .hero-content h1 {
    font-size: var(--text-5xl);
  }

  .hero-buttons {
    flex-direction: column;
  }

  .hero-buttons .btn {
    width: 100%;
    text-align: center;
  }

  /* Hero sub */
  .hero-sub {
    min-height: 40vh;
  }

  .hero-sub .hero-content h1 {
    font-size: var(--text-4xl);
  }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  .footer-bottom {
    flex-direction: column;
    gap: var(--space-md);
    text-align: center;
  }

  /* Trust bar */
  .trust-bar .container {
    gap: var(--space-xl);
  }

  /* Section headers */
  .section-header {
    margin-bottom: var(--space-2xl);
  }

  .section-header h2 {
    font-size: var(--text-3xl);
  }

  /* CTA banner */
  .cta-banner {
    padding: var(--space-3xl) 0;
  }

  /* Testimonials */
  .testimonial-card {
    padding: var(--space-xl);
  }

  .testimonial-text {
    font-size: var(--text-lg);
  }

  /* Forms */
  .form-steps {
    gap: var(--space-xs);
  }

  .form-step-line {
    width: 24px;
  }

  .form-step-indicator {
    width: 34px;
    height: 34px;
    font-size: var(--text-xs);
  }

  /* Split layout */
  .split-layout {
    flex-direction: column;
  }

  .split-layout > * {
    width: 100%;
  }

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

/* --- Max 480px: Small phones --- */
@media (max-width: 480px) {
  :root {
    --text-7xl: 2.25rem;
    --text-6xl: 2rem;
    --text-5xl: 1.75rem;
    --text-4xl: 1.5rem;
    --text-3xl: 1.375rem;
  }

  .container,
  .container-narrow,
  .container-wide {
    padding: 0 var(--space-md);
  }

  .section {
    padding: var(--space-2xl) 0;
  }

  .btn {
    padding: 0.75rem 1.5rem;
    font-size: var(--text-sm);
  }

  .btn-lg {
    padding: 0.875rem 1.75rem;
    font-size: var(--text-base);
  }

  .hero {
    min-height: 80vh;
  }

  .hero-content p {
    font-size: var(--text-base);
  }

  .stats-row {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-sm);
  }

  .stat-item {
    padding: var(--space-md);
  }

  .stat-number {
    font-size: var(--text-3xl);
  }

  .card {
    padding: var(--space-xl);
  }

  .trust-bar .container {
    flex-direction: column;
    gap: var(--space-md);
  }

  .accordion-header {
    padding: var(--space-md) var(--space-lg);
    font-size: var(--text-sm);
  }

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

  .blog-card-image {
    height: 180px;
  }

  blockquote {
    padding: var(--space-md) var(--space-lg);
    font-size: var(--text-base);
  }
}

/* --- Landscape phones --- */
@media (max-height: 500px) and (orientation: landscape) {
  .hero {
    min-height: 100vh;
    padding: var(--space-2xl) 0;
  }

  .hero-content {
    padding: var(--space-3xl) 0 var(--space-xl);
  }

  .hero-content h1 {
    font-size: var(--text-4xl);
  }
}