/* ═══════════════════════════════════════════════════════════════
   ZUM PUNKT — RESPONSIVE CSS
   Breakpoints: tablet 1024px, mobile 768px, small 480px
   ═══════════════════════════════════════════════════════════════ */

/* ── HAMBURGER BUTTON (hidden on desktop) ──────────────────────── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 8px;
  background: none;
  border: none;
  z-index: 200;
}
.nav-hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform .3s, opacity .3s;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ═══════════════════════════════════════════════════════════════
   TABLET — 1024px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {

  /* NAV */
  nav { padding: 24px 32px; }

  /* HOMEPAGE HERO */
  .hero { padding: 0 32px 64px; grid-template-columns: 1fr; }
  .hero-right { display: none; }
  .shapes-trail { display: none; }
  .hero-h1 { font-size: clamp(48px, 7vw, 80px); }
  .hero-bottom { flex-direction: column; align-items: flex-start; gap: 32px; }
  .hero-actions { align-items: flex-start; }
  .hero-pills { justify-content: flex-start; }

  /* SERVICE HERO */
  .service-hero { grid-template-columns: 1fr; padding: 140px 32px 64px; gap: 48px; }
  .hero-visual, .seo-visual, .orm-visual, .aso-visual { display: none; }

  /* SECTIONS */
  .sct, .approach, .why, .work-section, .numbers-strip + div { padding: 80px 32px; }
  .approach { padding: 80px 32px; }
  .numbers-strip .ns-item { padding: 40px 32px; }
  .trust-strip { padding: 48px 32px; grid-template-columns: 1fr; gap: 32px; }
  .cta-section { padding: 80px 32px; }
  .cta-wrap { grid-template-columns: 1fr; gap: 48px; }
  .two-col, .work-inner, .uae-inner, .uae-grid, .phil-grid { grid-template-columns: 1fr; gap: 48px; }
  .phil-right { padding-top: 0; }

  /* HOMEPAGE SECTIONS */
  .belief { padding: 80px 32px; }
  .belief-bridge { grid-template-columns: 1fr; }
  .services { padding: 80px 32px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .numbers { padding: 80px 32px; }
  .numbers-grid { grid-template-columns: 1fr; }
  .number-item { padding: 36px 32px; border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); }
  .number-item:last-child { border-bottom: none; }
  .clients { padding: 80px 32px; }
  .clients-logos { grid-template-columns: repeat(2, 1fr); }
  .why { padding: 80px 32px; grid-template-columns: 1fr; gap: 48px; }

  /* CASES GRID */
  .cases-grid { grid-template-columns: repeat(2, 1fr); }

  /* CLIENTS CHIPS */
  .clients-grid { grid-template-columns: repeat(3, 1fr); }

  /* ABOUT */
  .hero-team { padding: 120px 32px 0; }
  .hero-content { padding-bottom: 48px; }
  .team-panel { margin: 0 -32px; padding: 36px 32px 40px; }
  .timeline { grid-template-columns: 1fr; }
  .tl-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); }
  .tl-item:last-child { border-bottom: none; }
  .timeline-section { padding: 80px 32px; }
  .philosophy { padding: 80px 32px; }
  .uae-section { padding: 80px 32px; }

  /* CONTACT */
  .contact-page { grid-template-columns: 1fr; }
  .contact-left { padding: 100px 32px 64px; }
  .contact-right { padding: 48px 32px 80px; }
  .global-note { padding-top: 24px; }

  /* CLIENTS PAGE */
  .clients-hero { padding: 120px 32px 56px; }
  .clients-section { padding: 64px 32px; }
  .cases-section { padding: 64px 32px; }
  .cta-section .cta-inner { max-width: 100%; }

  /* SERVICES PAGE SECTIONS */
  .sct { padding: 80px 32px; }
  .reasons-grid { grid-template-columns: 1fr; }
  .result-grid { grid-template-columns: repeat(2, 1fr); }
  .services-row { grid-template-columns: repeat(2, 1fr); }
  .other-services { padding: 64px 32px; }

  /* FOOTER */
  footer { padding: 40px 32px; }
  .footer-legal { padding: 0; justify-content: flex-start; flex-wrap: wrap; }

  /* NUMBERS STRIP */
  .numbers-strip { grid-template-columns: 1fr; }
  .ns-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); padding: 36px 32px; }
  .ns-item:last-child { border-bottom: none; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE — 768px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* NAV — hamburger */
  nav { padding: 20px 20px; }
  .nav-links { display: none; flex-direction: column; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.97); padding: 80px 24px 40px; gap: 0; justify-content: center; z-index: 150; }
  .nav-links.open { display: flex; }
  .nav-links li { width: 100%; }
  .nav-links a { font-size: 20px; padding: 14px 0; color: rgba(255,255,255,.7); border-bottom: 1px solid rgba(255,255,255,.07); letter-spacing: .04em; }
  .nav-links a.active, .nav-links a:hover { color: #fff; }
  .dropdown-menu { display: none !important; } /* hide dropdowns on mobile — flat menu */
  .nav-arrow { display: none; }
  .nav-cta { display: none; }
  .nav-hamburger { display: flex; }

  /* HOMEPAGE HERO */
  .hero { padding: 0 20px 56px; min-height: auto; padding-top: 100px; }
  .hero-h1 { font-size: clamp(38px, 10vw, 56px); }
  .hero-sub { font-size: 16px; }

  /* SERVICE HERO */
  .service-hero { padding: 100px 20px 56px; }
  .service-hero h1 { font-size: 11px; }
  .hero-display { font-size: clamp(36px, 9vw, 52px); }
  .hero-desc { font-size: 16px; }

  /* GLASS CARD hero */
  .hero-visual.glass { display: none; }
  .glass-card { display: none; }

  /* GENERAL SECTIONS */
  .sct, .approach, .why, .philosophy, .timeline-section, .uae-section { padding: 56px 20px; }
  .cta-section { padding: 56px 20px; }
  .services { padding: 56px 20px; }
  .numbers { padding: 56px 20px; }
  .clients { padding: 56px 20px; }
  .belief { padding: 56px 20px; }
  .other-services { padding: 48px 20px; }
  .cases-section { padding: 48px 20px; }
  .clients-section { padding: 48px 20px; }

  /* HOMEPAGE SERVICES GRID */
  .services-grid { grid-template-columns: 1fr; }
  .service-card { border-right: none; border-bottom: 2px solid #e8e8e8; }
  .service-card:last-child { border-bottom: none; }

  /* HOMEPAGE CLIENTS */
  .clients-logos { grid-template-columns: repeat(2, 1fr); }
  .clients-top { flex-direction: column; gap: 16px; }

  /* BELIEF BRIDGE */
  .belief-bridge { grid-template-columns: 1fr; }
  .bridge-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); padding: 28px 0; }
  .bridge-item:last-child { border-bottom: none; }

  /* NUMBERS */
  .numbers-grid { grid-template-columns: 1fr; }
  .number-item { padding: 28px 0; border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); }

  /* WHY LIST */
  .why-list, .phil-list, .uae-facts { font-size: 13px; }

  /* ABOUT HERO */
  .hero-team { padding: 100px 20px 0; }
  .team-panel { margin: 0 -20px; padding: 28px 20px 36px; flex-direction: column; }
  .team-bottom { grid-template-columns: 1fr; gap: 24px; }
  .avatar-stack { flex-wrap: wrap; gap: 4px; }
  .av { margin-left: 0; width: 52px; height: 52px; }
  .av-count { margin-left: 0; width: 52px; height: 52px; font-size: 12px; }

  /* TIMELINE */
  .timeline { grid-template-columns: 1fr; }
  .tl-num { font-size: clamp(44px, 12vw, 64px); }

  /* CONTACT */
  .contact-page { padding-top: 0; }
  .contact-left { padding: 80px 20px 48px; }
  .contact-right { padding: 40px 20px 60px; }
  .global-note { grid-template-columns: 1fr; gap: 20px; }
  .gn-val { font-size: clamp(32px, 8vw, 48px); }

  /* CASES GRID */
  .cases-grid { grid-template-columns: 1fr; }

  /* CLIENTS CHIPS */
  .clients-grid { grid-template-columns: repeat(2, 1fr); }
  .clients-hero { padding: 100px 20px 48px; }

  /* RESULT & REASONS */
  .result-grid { grid-template-columns: 1fr; }
  .reasons-grid { grid-template-columns: 1fr; }
  .services-row { grid-template-columns: 1fr; }

  /* NUMBERS STRIP */
  .numbers-strip { grid-template-columns: 1fr; }
  .ns-item { padding: 28px 20px; }

  /* TRUST STRIP */
  .trust-strip { padding: 40px 20px; grid-template-columns: 1fr; gap: 24px; }

  /* FOOTER */
  footer { padding: 32px 20px; flex-direction: column; align-items: flex-start; gap: 24px; }
  .footer-mid { flex-wrap: wrap; gap: 16px; }
  .footer-social { flex-wrap: wrap; }
  .footer-legal { padding: 0; justify-content: flex-start; }

  /* TYPOGRAPHY SCALE */
  .sh2 { font-size: clamp(28px, 7vw, 40px); }
  .reasons-h2 { font-size: clamp(28px, 7vw, 40px); margin-bottom: 40px; }
  .result-h2 { font-size: clamp(28px, 7vw, 40px); margin-bottom: 40px; }
  .cta-h2 { font-size: clamp(32px, 8vw, 48px); }
  .about-h1, .hero-h1, .hero-display { line-height: 1.05; }
  .manifesto p { font-size: 17px; }
  .why-quote p { font-size: 18px; }
}

/* ═══════════════════════════════════════════════════════════════
   SMALL MOBILE — 480px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {

  /* NAV */
  .nav-logo svg, .nav-logo img { height: 20px; }

  /* HERO */
  .hero { padding-top: 80px; }
  .service-hero { padding: 80px 16px 48px; }
  .hero-display { font-size: clamp(32px, 9vw, 44px); }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .btn-primary, .btn-hero, .btn-p { padding: 16px 32px; font-size: 14px; }

  /* SECTIONS */
  .sct, .approach, .philosophy, .uae-section, .cta-section,
  .services, .numbers, .clients, .belief, .other-services,
  .cases-section, .clients-section, .hero-team, .timeline-section { padding: 48px 16px; }

  /* GRIDS */
  .clients-logos { grid-template-columns: 1fr; }
  .clients-grid { grid-template-columns: 1fr; }

  /* CONTACT */
  .contact-left { padding: 80px 16px 40px; }
  .contact-right { padding: 36px 16px 48px; }
  .mikhail-card { padding: 20px; }

  /* FOOTER */
  footer { padding: 28px 16px; }
  .footer-mid { flex-direction: column; gap: 12px; }

  /* ABOUT PANEL */
  .team-panel { padding: 24px 16px 32px; margin: 0 -16px; }
  .hero-team { padding: 80px 16px 0; }
  .hero-content { padding-bottom: 40px; }
}