/* =============================================================
   AETHERIUM ATLAS — RESPONSIVE STYLESHEET
   Breakpoints: 1200 / 992 / 768 / 480
============================================================= */


/* =============================================================
   TABLET LANDSCAPE  — max 1200px
============================================================= */
@media (max-width: 1200px) {
  :root { --section-pad: 80px; }
  .container { padding: 0 32px; }

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

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

  /* Footer */
  .footer-content { grid-template-columns: 1.5fr 1fr 1fr; gap: 40px; }
  .footer-brand { grid-column: 1 / -1; }
}


/* =============================================================
   TABLET PORTRAIT  — max 992px
============================================================= */
@media (max-width: 992px) {
  :root { --section-pad: 70px; }
  .container { padding: 0 24px; }

  /* Show mobile menu, hide desktop nav */
  .main-nav { display: none; }
  .mobile-menu { display: block; }
  .mobile-menu-toggle { display: flex; }

  /* About */
  .about-content { grid-template-columns: 1fr; gap: 48px; }

  /* Technology */
  .tech-feature { grid-template-columns: 1fr; gap: 36px; }
  .tech-feature--reverse { direction: ltr; }

  /* Global stats */
  .global-stats { grid-template-columns: repeat(2, 1fr); }

  /* Contact */
  .contact-content { grid-template-columns: 1fr; gap: 48px; }

  /* Footer */
  .footer-content { grid-template-columns: 1fr 1fr; gap: 36px; }
  .footer-brand { grid-column: 1 / -1; }

  /* Section header sizes */
  .section-header { margin-bottom: 48px; }
}


/* =============================================================
   MOBILE  — max 768px
============================================================= */
@media (max-width: 768px) {
  :root {
    --section-pad: 60px;
    --header-h: 64px;
  }
  .container { padding: 0 20px; }

  /* ---- Header ---- */
  .site-header { height: var(--header-h); }

  /* ---- Hero ---- */
  .hero-content { padding: 100px 20px 140px; }

  .hero-logotype .brand-name { letter-spacing: 4px; }
  .hero-logotype .brand-sub  { letter-spacing: 8px; }

  .hero-slogan   { letter-spacing: 3px; }
  .hero-subline  { font-size: 15px; }

  .hero-cta { flex-direction: column; align-items: center; }
  .btn-forge { width: 100%; max-width: 320px; justify-content: center; }

  .hero-stats {
    flex-wrap: wrap;
  }
  .hero-stat {
    flex: 0 0 50%;
    max-width: 50%;
    border-right: none;
    border-bottom: 1px solid rgba(30,136,229,.15);
    padding: 14px 16px;
  }
  .hero-stat:nth-child(odd)  { border-right: 1px solid rgba(30,136,229,.15); }
  .hero-stat:nth-last-child(-n+2) { border-bottom: none; }
  .hero-stat-num { font-size: 26px; }

  .scroll-cue { bottom: 150px; }

  .smoke-col-3 { display: none; }

  /* ---- About ---- */
  .highlight-card { flex-direction: column; gap: 14px; }

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

  /* ---- Technology ---- */
  .tech-features { gap: 52px; }
  .tech-feature { gap: 28px; }

  /* ---- Global ---- */
  .global-stats   { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .stat-number    { font-size: 44px; }
  .offices-grid   { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .map-placeholder { height: 240px; }

  /* ---- Contact ---- */
  .form-row { grid-template-columns: 1fr; gap: 16px; }
  .btn-submit { width: 100%; justify-content: center; }

  /* ---- Footer ---- */
  .footer-content { grid-template-columns: 1fr; gap: 32px; }
  .footer-main    { padding: 56px 0 40px; }

  .footer-bottom-content {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }

  /* ---- Sections ---- */
  .section-header h2   { font-size: clamp(24px,6vw,34px); }
  .section-subtitle    { font-size: 16px; }
}


/* =============================================================
   SMALL MOBILE  — max 480px
============================================================= */
@media (max-width: 480px) {
  :root { --section-pad: 48px; }

  .hero-content { padding: 90px 16px 130px; }
  .hero-badge   { padding: 6px 14px; }
  .hero-badge-text { font-size: 11px; letter-spacing: 1.5px; }

  .hero-logotype .brand-name { font-size: clamp(44px, 12vw, 64px); letter-spacing: 3px; }
  .hero-logotype .brand-sub  { font-size: clamp(22px, 6vw, 36px);  letter-spacing: 5px; }

  .hero-stat { padding: 12px; }
  .hero-stat-num { font-size: 22px; }
  .hero-stat-label { font-size: 9px; }

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

  .footer-legal { flex-wrap: wrap; justify-content: center; }
}


/* =============================================================
   LANDSCAPE ORIENTATION ON MOBILE
============================================================= */
@media (max-height: 500px) and (orientation: landscape) {
  .hero-section { min-height: 100svh; }
  .hero-content { padding-top: 80px; padding-bottom: 100px; }
  .hero-logotype .brand-name { font-size: clamp(36px, 8vh, 64px); }
  .hero-logotype .brand-sub  { font-size: clamp(20px, 4vh, 36px); }
  .scroll-cue { display: none; }
}


/* =============================================================
   PRINT STYLES
============================================================= */
@media print {
  .site-header,
  .hero-section,
  .hero-stats,
  .sparks-canvas,
  .layer-base,
  .layer-furnace,
  .layer-pour,
  .layer-structure,
  .layer-smoke,
  .layer-heat,
  .layer-brand-overlay,
  .layer-vignette,
  .scroll-cue,
  .mobile-menu,
  .mobile-overlay,
  .social-links,
  .site-footer { display: none !important; }

  body { color: #000; font-size: 12pt; }
  a::after { content: " (" attr(href) ")"; font-size: 10pt; }
  h2 { page-break-after: avoid; }
  section { page-break-inside: avoid; padding: 20pt 0; }
}