/* ============================================
   HFG CAPITAL — Responsive (ICONIQ Design)
   ============================================ */

/* ---- TABLET ---- */
@media (max-width: 992px) {
  .navbar { padding: 0 30px; }
  .nav-links { display: none; }
  .hamburger { display: flex; }
  .market-dots { gap: 9px; }
  .nav-left { gap: 16px; }

  .hero { padding: 120px 30px 80px; }
  .hero-scroll-hint { left: 30px; }

  .section-block { padding: 80px 30px; }
  .section-block .container { grid-template-columns: 1fr; gap: 40px; }
  .section-block .container.reverse { direction: ltr; }
  .section-visual { height: 200px; }
  .section-numeral { font-size: 5rem; }

  .info-section { padding: 80px 30px; }
  .stats-row { gap: 40px; flex-wrap: wrap; }

  .values-section { padding: 80px 30px; }
  .values-grid { grid-template-columns: 1fr; }

  .footer { padding: 40px 30px; }
  .footer-container { flex-direction: column; gap: 40px; }
  .footer-links { gap: 30px; }

  .page-header { padding: 120px 30px 40px; }
  .pillars-section, .principles-section, .manifesto-section, .manifesto-intro-section, .contact-section, .admin-section { padding: 0 30px 80px; }
  .manifesto-intro { padding: 0 20px; }
  .pillars-grid { grid-template-columns: 1fr; }
  .principles-grid { grid-template-columns: 1fr; }
  .manifesto-values-grid { grid-template-columns: 1fr; }
  .admin-grid { grid-template-columns: 1fr; }
}

/* ---- MOBILE ---- */
@media (max-width: 600px) {
  .hero-title { font-size: 2.2rem; }
  .hero-motto { font-size: 0.75rem; letter-spacing: 0.15em; }
  .section-numeral { font-size: 4rem; }
  .section-visual { height: 120px; }

  .stats-row { flex-direction: column; gap: 30px; }
  .footer-links { flex-direction: column; gap: 25px; }
  .footer-bottom { flex-direction: column; gap: 10px; text-align: center; }

  .page-header { padding: 110px 20px 30px; }
  .page-title { font-size: 1.8rem; }
  .pillars-section, .principles-section, .manifesto-section, .manifesto-intro-section, .contact-section, .admin-section { padding: 0 20px 60px; }

  .pillar-card { padding: 40px 25px; }
  .principle-card { padding: 30px 25px; }

  .modal-box { padding: 35px 25px; }
  .modal-title { font-size: 1.3rem; }
  #loginForm input { font-size: 16px; padding: 12px; }

  .contact-form input, .contact-form textarea { padding: 14px; font-size: 16px; }

  .main-menu a { font-size: 1.2rem; }

  .market-dots { display: none; }
  .nav-left { gap: 12px; }
}

/* ---- MOBILE LANDSCAPE — restore market dots ---- */
@media (max-width: 600px) and (orientation: landscape) {
  .market-dots {
    display: flex;
    gap: 8px;
    border-left: none;
    padding-left: 0;
  }
  .market-dot .dot { width: 4px; height: 4px; }
  .market-tooltip { left: 50%; right: auto; transform: translateX(-50%); }
  .market-tooltip::before { left: 50%; right: auto; transform: translateX(-50%) rotate(45deg); }
}