/* ============ Limb mobile refinements ============ */

/* Touch-friendly defaults */
@media (max-width: 768px) {
  .container { padding: 0 20px; }
  .section { padding: 72px 0; }

  /* Nav: tighter, hide "Log in" so logo + Book a Demo always fit */
  .nav-inner { height: 56px; }
  .nav-right { gap: 10px; }
  .nav-right .login { display: none; }
  .nav-right .btn { padding: 11px 16px; font-size: 14px; }
  .nav .logo-word { height: 19px; }

  /* Buttons: full width when stacked, larger hit area */
  .btn { padding: 14px 20px; min-height: 40px; }
  .hero-cta .btn,
  .final-cta .ctas .btn,
  .close-card .ctas .btn { width: 100%; justify-content: center; }
  .hero-cta { flex-direction: column; width: 100%; }
  .final-cta .ctas { flex-direction: column; width: 100%; }

  /* Hero (landing) */
  .hero { min-height: auto; }
  .hero-inner { padding: 48px 0 56px; gap: 32px; }
  .hero-meta {
    flex-wrap: wrap; row-gap: 8px; margin-top: 36px;
    font-size: 11px; gap: 14px;
  }
  .hero-meta .dot { display: none; }
  .hero-visual { max-height: 320px; aspect-ratio: 4/3; }

  /* Page hero (About/Pricing) */
  .page-hero { padding: 100px 0 64px; }  /* 56px fixed nav + breathing room */

  /* Headlines: keep readable, not crushed */
  .h-hero, .page-hero h1 { font-size: clamp(36px, 8vw, 44px); line-height: 1.06; }
  .h-section { font-size: clamp(28px, 6.5vw, 34px); line-height: 1.12; }

  /* Section anchor labels — flush to content edge on mobile */
  .sect-anchor { padding: 0 20px; margin-bottom: 8px; }

  /* Problem */
  .problem { padding: 80px 0; }
  .problem p { font-size: 16px; }

  /* Perspectives */
  .pers-tabs { gap: 12px 20px; margin-bottom: 32px; flex-wrap: wrap; }
  .pers-tab { font-size: 13px; }
  .pers-card { gap: 28px; }
  .pers-card .visual { aspect-ratio: 4/3; }
  .pers-list li { grid-template-columns: 100px 1fr; font-size: 14px; }

  /* Features */
  .feat-card { padding: 24px; min-height: auto; }

  /* Editorial */
  .editorial { padding: 96px 0; }
  .editorial h2 { font-size: clamp(32px, 8.5vw, 44px); margin: 32px auto; }
  .editorial .sub { font-size: 16px; padding: 0 8px; }

  /* Numbers */
  .nums-grid { padding: 32px 0; gap: 28px 20px; }
  .num-cell .n { font-size: 40px; }
  .quote { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; }
  .quote .av { width: 44px; height: 44px; }
  .quote q { font-size: 18px; }

  /* Final cards */
  .final-card { padding: 28px; min-height: auto; }
  .final-card h3 { font-size: 22px; }

  /* ROI */
  .roi { padding: 24px; gap: 24px; margin-top: 16px; }
  .roi-line .v { font-size: 18px; }
  .roi-line .k { font-size: 11.5px; }

  /* Footer */
  footer.foot { padding: 64px 0 32px; }
  .foot-top { padding-bottom: 40px; }
  .foot-bot { font-size: 11.5px; }
}

/* Phones <540px: collapse footer columns */
@media (max-width: 540px) {
  .foot-top { grid-template-columns: 1fr; gap: 28px; }
  .foot-top h5 { margin-bottom: 12px; }
}

/* ===== About-specific ===== */
@media (max-width: 768px) {
  .manifesto { padding: 80px 0; }
  .manifesto-body p { font-size: 18px; line-height: 1.45; }
  .manifesto-body p + p { margin-top: 22px; }
  .manifesto-body ul.manifesto-groups li { font-size: 18px; }
  .manifesto-body ul.manifesto-groups { margin: 22px 0; }
  .story-row { padding: 28px 0; }
  .story-row h3 { font-size: 18px; }
  .story-row p { font-size: 14px; }
  .values-head { margin-bottom: 32px; }
  .value-cell { padding: 28px; min-height: auto; }
  .value-cell h3 { font-size: 19px; }
  .team-card .info { padding: 16px; }
  .uae { padding: 88px 0; }
  .uae h2 { font-size: clamp(28px, 7vw, 36px); }
  .uae-stat { padding: 24px; }
  .uae-stat .n { font-size: 32px; }
  .partners-row { gap: 24px; row-gap: 14px; }
  .partners-row .pl { font-size: 11px; }
  .close { padding: 80px 0; }
  .close-card { padding: 32px 24px; gap: 24px; }
}

/* ===== Pricing-specific ===== */
@media (max-width: 980px) {
  .price-grid { margin-top: 16px; }
}
@media (max-width: 768px) {
  .price-section { padding: 0 0 64px; }
  .price-card { padding: 28px; }
  .price-card h3 { font-size: 22px; }
  .price-card .amount .num { font-size: 44px; }
  .billing { margin-top: 28px; flex-direction: column; align-items: flex-start; gap: 12px; }
  .billing .switch { width: 100%; max-width: 280px; }

  /* Compare: horizontal scroll wrapper */
  .compare { padding: 80px 0; }
  .compare .container {
    padding: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .compare > .container > .compare-head { padding: 0 20px; margin-bottom: 32px; }
  .compare-table {
    min-width: 720px;
    margin: 0 20px;
    width: calc(100% - 40px);
  }
  .compare-table thead th, .compare-table tbody td { padding: 14px 14px; font-size: 13px; }
  .compare-table .row-label { max-width: 240px; }

  /* FAQ */
  .faq { padding: 80px 0; }
  .faq-head { grid-template-columns: 1fr; gap: 20px; margin-bottom: 32px; }
  .faq-item button { padding: 22px 0; }
  .faq-item h4 { font-size: 16px; }

  /* Add-ons */
  .addons { padding: 0 0 80px; }
  .addons-grid { grid-template-columns: 1fr; gap: 12px; }
  .addon-card { padding: 24px; min-height: auto; }

  /* Final */
  .final-cta { padding: 96px 0; }
  .final-cta h2 { font-size: clamp(28px, 7vw, 38px); margin: 28px auto; }
}

/* Prevent horizontal scroll — only on body, never on html, so position:fixed works in all browsers */
body { overflow-x: clip; }