/**
 * ============================================================
 * PLATON SOLUTIONS - Responsive Styles
 * ============================================================
 */

/* ═══════════════════════════════════════════════════════════
   TABLET & BELOW (< 1024px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .header {
    height: var(--header-height-mobile);
  }
  
  .mobile-menu-toggle {
    display: flex;
  }
  
  .nav-links, .header-phone, .nav .btn {
    display: none;
  }
  
  /* Hero */
  .hero .container {
    grid-template-columns: 1fr;
    text-align: center;
  }
  
  .hero-content {
    order: 1;
  }
  
  .hero-visual {
    order: 0;
    margin-bottom: var(--space-xl);
  }
  
  .hero-stats {
    justify-content: center;
  }
  
  .hero-buttons {
    justify-content: center;
  }
  
  .hero-subtitle {
    margin-left: auto;
    margin-right: auto;
  }
  
  .hero-float-card {
    display: none;
  }
  
  /* Services */
  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  /* Timeline */
  .timeline {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .timeline::before, .timeline::after {
    display: none;
  }
  
  /* Zone */
  .zone-content {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }
  
  .zone-map {
    order: -1;
  }
  
  /* About */
  .about-content {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }
  
  .about-image {
    max-width: 500px;
    margin: 0 auto;
  }
  
  /* Contact */
  .contact-content {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }
  
  .contact-info {
    order: -1;
  }
  
  /* Footer */
  .footer-content {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .footer-brand {
    grid-column: 1 / -1;
    max-width: none;
    text-align: center;
  }
  
  .footer-brand .logo {
    justify-content: center;
  }
  
  .footer-social {
    justify-content: center;
  }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE (< 768px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  h1 { font-size: var(--fs-3xl); }
  h2 { font-size: var(--fs-2xl); }
  h3 { font-size: var(--fs-xl); }
  
  /* Logo mobile */
  .logo-img {
    height: 47px;
  }
  
  .footer-logo {
    height: 45px;
  }
  
  .loader-logo img {
    max-height: 70px;
  }
  
  .container {
    padding: 0 var(--space-md);
  }
  
  section {
    padding: var(--space-3xl) 0;
  }
  
  /* Hero */
  .hero {
    min-height: auto;
    padding-top: calc(var(--header-height-mobile) + var(--space-xl));
    padding-bottom: var(--space-3xl);
  }
  
  .hero h1 {
    font-size: var(--fs-2xl);
  }
  
  .hero-buttons {
    flex-direction: column;
    width: 100%;
  }
  
  .hero-buttons .btn {
    width: 100%;
  }
  
  .hero-stats {
    flex-direction: column;
    gap: var(--space-lg);
    align-items: center;
  }
  
  .hero-stat {
    text-align: center;
  }
  
  /* Trust Banner */
  .trust-banner .container {
    flex-direction: column;
    gap: var(--space-md);
  }
  
  /* Services */
  .services-grid {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }
  
  /* Timeline */
  .timeline {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-md);
  }
  
  .timeline-item:last-child {
    grid-column: 1 / -1;
    max-width: 200px;
    margin: 0 auto;
  }
  
  .timeline-number {
    width: 40px;
    height: 40px;
    min-width: 40px;
    font-size: var(--fs-sm);
  }
  
  /* Zone */
  .zone-map-container {
    min-height: 280px;
    padding: var(--space-md);
  }
  
  .zone-departments {
    justify-content: center;
  }
  
  .zone-highlight {
    flex-direction: column;
    text-align: center;
  }
  
  /* About */
  .about-features {
    grid-template-columns: 1fr;
  }
  
  /* Testimonials */
  .testimonial-inner {
    padding: var(--space-lg);
  }
  
  .testimonial-text {
    font-size: var(--fs-base);
  }
  
  /* FAQ */
  .faq-question {
    padding: var(--space-md);
    font-size: var(--fs-sm);
  }
  
  /* Contact */
  .contact-form {
    padding: var(--space-lg);
  }
  
  .form-grid {
    grid-template-columns: 1fr;
  }
  
  /* Footer */
  .footer-content {
    grid-template-columns: 1fr;
    text-align: center;
  }
  
  .footer-bottom {
    flex-direction: column;
    text-align: center;
  }
  
  .footer-legal {
    flex-wrap: wrap;
    justify-content: center;
  }
  
  /* WhatsApp Float - Always visible */
  .whatsapp-float {
    bottom: 90px;
    right: 16px;
    left: auto;
  }
  
  .whatsapp-float-btn {
    width: 54px;
    height: 54px;
    font-size: 26px;
  }
  
  .whatsapp-tooltip {
    display: none;
  }
  
  .scroll-top {
    bottom: 150px;
    right: 16px;
  }
  
  .scroll-top {
    bottom: 100px;
    right: 20px;
    width: 44px;
    height: 44px;
  }
  
  /* Mobile Bottom Bar */
  .mobile-bottom-bar {
    display: block;
  }
  
  /* Cookie */
  .cookie-consent .container {
    flex-direction: column;
    text-align: center;
  }
  
  .cookie-buttons {
    width: 100%;
    flex-direction: column;
  }
  
  .cookie-buttons .btn {
    width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════
   SMALL MOBILE (< 480px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  :root {
    --fs-base: 0.9375rem;
  }
  
  h1 { font-size: var(--fs-2xl); }
  h2 { font-size: var(--fs-xl); }
  
  .container {
    padding: 0 var(--space-sm);
  }
  
  .btn {
    padding: 12px 24px;
    font-size: var(--fs-sm);
  }
  
  .timeline {
    grid-template-columns: 1fr 1fr;
  }
  
  .timeline-content h4 {
    font-size: var(--fs-xs);
  }
  
  .timeline-content p {
    display: none;
  }
  
  .service-card {
    padding: var(--space-lg);
  }
  
  .service-icon {
    width: 48px;
    height: 48px;
  }
  
  .service-icon i {
    font-size: 1.25rem;
  }
}

/* ═══════════════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════════════ */
@media print {
  .header, .whatsapp-float, .scroll-top, .mobile-bottom-bar,
  .cookie-consent, .page-loader, .reading-progress {
    display: none !important;
  }
  
  body {
    background: white !important;
  }
  
  section {
    break-inside: avoid;
  }
}

/* ═══════════════════════════════════════════════════════════
   REDUCED MOTION
   ═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  .hero-float-card {
    animation: none;
  }
}