/* Heifereum mobile polish — shared across all pages (header to footer). */
/* === Heifereum mobile rendering polish ===
   Scoped to small viewports. Targets specific Tokenix template
   pain points without overriding desktop behavior. */
@media (max-width: 991px) {
  /* Nav + footer logo caps */
  .global-logo, .mobile-logo {
    max-height: 32px !important;
    width: auto !important;
    height: auto !important;
  }
  .footer-logo-img {
    max-width: 140px !important;
    max-height: 36px !important;
    height: auto !important;
    width: auto !important;
  }
  /* Hero typography */
  .hero-title { font-size: clamp(32px, 7.5vw, 48px) !important; line-height: 1.1 !important; }
  .about-hero-title { font-size: clamp(28px, 7vw, 40px) !important; line-height: 1.12 !important; }
  /* Container side padding */
  .container { padding-left: 20px !important; padding-right: 20px !important; }
  /* Section padding compression */
  .solutions-section,
  .about-vition-section,
  .about-counter-section,
  .faq-section,
  .cta-section,
  .marquee-section,
  .cryptocurrency-section,
  .about-team-section { padding-top: 56px !important; padding-bottom: 56px !important; }
  /* Hero fills exactly the screen on every device — no outer padding;
     nav clearance lives inside the hero container */
  .hero-area-section,
  .about-hero-area-section { padding-top: 0 !important; padding-bottom: 0 !important; }
}

@media (max-width: 767px) {
  .global-logo, .mobile-logo { max-height: 30px !important; }
  .footer-logo-img { max-width: 130px !important; max-height: 34px !important; }

  /* Solutions rows: force stack with image first, generous gap */
  .solution-countent-box,
  .solution-countent-box.right-to-left {
    flex-direction: column !important;
    gap: 24px !important;
  }
  .solution-left-item-box,
  .solution-right-item-box {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
  }
  .solutions-section .solution-img { aspect-ratio: 16 / 10 !important; }
  .solutions-section .solutions-text { font-size: 11px !important; letter-spacing: .18em !important; padding: 5px 11px !important; }
  .solution-title { font-size: clamp(24px, 6.5vw, 32px) !important; line-height: 1.18 !important; }
  .sulotions-para { font-size: 15px !important; line-height: 1.55 !important; }

  /* Counter */
  .about-counter-number { font-size: clamp(28px, 8vw, 40px) !important; line-height: 1.05 !important; }
  .about-counter-text { font-size: 13px !important; }

  /* FAQ */
  .question { font-size: 16px !important; line-height: 1.35 !important; }
  .answer { font-size: 14px !important; line-height: 1.55 !important; }

  /* CTA */
  .cta-title { font-size: clamp(24px, 7vw, 36px) !important; line-height: 1.15 !important; }
  .cta-para { font-size: 14px !important; line-height: 1.55 !important; }

  /* Section titles globally */
  .all-headingtitle { font-size: clamp(26px, 7vw, 38px) !important; line-height: 1.12 !important; }
}

@media (max-width: 480px) {
  .global-logo, .mobile-logo { max-height: 28px !important; }
  .footer-logo-img { max-width: 120px !important; max-height: 30px !important; }
  .hero-title { font-size: clamp(28px, 8.5vw, 36px) !important; }
  .about-hero-title { font-size: clamp(24px, 7.5vw, 32px) !important; }
  .container { padding-left: 16px !important; padding-right: 16px !important; }

  /* Big numbers don't overflow */
  .about-counter-single-box { min-width: 0 !important; }

  /* Buttons */
  .button-title, .button-title-two { font-size: 14px !important; }
  .button.cta-button, .button.cryptocurrency-button { padding: 12px 22px !important; }
}

/* Mobile menu button — make sure it stays small and tappable */
@media (max-width: 991px) {
  .lm_mobail_menu { width: 28px !important; height: 28px !important; }
  .lm_mobail_menu_button { padding: 6px !important; }
}
@media (max-width: 991px) {
  /* hf-cards: force single column even when inline style sets 1fr 1fr */
  .about-wrap.hf-cards { grid-template-columns: 1fr !important; grid-column-gap: 16px !important; grid-row-gap: 16px !important; }
  /* Pill labels: shrink + allow wrap to prevent overflow on narrow cards */
  .hf-card__pill {
    font-size: 10px !important;
    letter-spacing: .14em !important;
    padding: 5px 9px !important;
    white-space: nowrap;
    max-width: 60%;
  }
  .hf-card__index { font-size: 11px !important; letter-spacing: .18em !important; }
  /* Card padding */
  .about-single-box.hf-card { padding: 22px !important; }
  /* Card heading + body */
  .about-single-box.hf-card .about-title-three { font-size: clamp(20px, 5.5vw, 26px) !important; line-height: 1.2 !important; }
  .about-single-box.hf-card .about-short-text { font-size: 14px !important; line-height: 1.55 !important; }
  /* Tags and caps shrink */
  .hf-card__tag { font-size: 11px !important; padding: 5px 10px !important; }
  .hf-card__caps { font-size: 10px !important; }
  /* Meta stacks vertically */
  .hf-card__meta { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; }
}

@media (max-width: 480px) {
  .hf-card__pill { font-size: 9.5px !important; letter-spacing: .10em !important; padding: 4px 8px !important; }
  .hf-card__icon-wrap { width: 52px !important; height: 52px !important; }
  .about-single-box.hf-card .hf-card__icon { width: 24px !important; height: 24px !important; }
}


/* === v2 additions: footer, program pages, auth pages === */
@media (max-width: 767px) {
  /* Footer: stack brand block, 2x2 link grid */
  .footer-top { flex-direction: column !important; gap: 36px; }
  .footer-logo-wrapper { width: 100% !important; max-width: 100% !important; flex-direction: column !important; gap: 26px; }
  .footer-countent {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 30px 18px;
    width: 100% !important;
  }
  .footer-single-item { width: auto !important; max-width: none !important; }
  .footer-heading-four { font-size: 15px !important; margin-bottom: 12px !important; }
  .unoder-link-text { font-size: 14px !important; }
  .copy-right-text { font-size: 12.5px !important; text-align: center; }

  /* Program-page hero backdrops: quieter on small screens */
  .pp-matrix { opacity: 0.45 !important; }
  .w3b-grid { opacity: 0.55 !important; }
  .ins-cosmic { opacity: 0.7 !important; }
  .pp-title::before { inset: -12px -18px !important; }
  .pp-hero .hero-button { flex-wrap: wrap; }

  /* Terminal card readable */
  .w3b-terminal { margin-top: 34px !important; }

  /* Enroll modal comfortable on phones */
  .hfp-card { max-width: 100%; }
  .hfp-actions .hfp-btn { flex: 1 1 auto; text-align: center; }
}

@media (max-width: 479px) {
  /* Buttons: keep pairs on one line where possible, wrap gracefully */
  .hero-button { grid-column-gap: 10px !important; grid-row-gap: 10px !important; }
  .button, .button-two { padding-left: 22px !important; padding-right: 22px !important; }
  /* Section pills */
  .pp-eyebrow, .gc-pill { padding: 8px 20px !important; font-size: 14px !important; }
  /* Big numbers scale down */
  .ins-role-num { font-size: 34px !important; }
  .ins-gain-row > span:last-child { font-size: 17px !important; }
  .ins-ticket-price, .pp-price { font-size: 38px !important; }
  .w3b-outcome-title { font-size: 20px !important; }
}

@media (max-width: 640px) {
  /* Contact info cards: stack full-width */
  .contact-address { flex-direction: column !important; }
  .contact-locatiob { width: 100% !important; }
}