/* Task #831422: Mobile — Increase size of site name, motto, and animated logo
   Increases prominence of branding on mobile viewports (<900px)
   to make the header more bold and impactful */

/* ── Mobile: Increase logo size (26-28px → 32px) ── */
@media(max-width:600px) {
  .radar-icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    border-radius: 8px !important;
  }
}

/* ── Mobile small: Increase slightly more (28px → 30px) ── */
@media(max-width:375px) {
  .radar-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    border-radius: 7px !important;
  }
}

/* ── Mobile: Increase site name font size (0.95rem → 1.05rem) ── */
@media(max-width:600px) {
  .nav-logo-text {
    font-size: 1.05rem !important;
  }
}

/* ── Mobile small: Increase to 0.98rem (was 0.88rem) ── */
@media(max-width:375px) {
  .nav-logo-text {
    font-size: 0.98rem !important;
  }
}

/* ── Mobile: Increase tagline/motto font size (1.05rem → 1.15rem) ── */
@media(max-width:600px) {
  .nav-logo-tagline {
    font-size: 1.15rem !important;
  }
}

/* ── Mobile small: Keep tagline prominent (1.05rem → 1.08rem) ── */
@media(max-width:375px) {
  .nav-logo-tagline {
    font-size: 1.08rem !important;
  }
}

/* ── Tablet adjustments: Slightly increase logo on tablet too ── */
@media(max-width:900px) and (min-width:601px) {
  .radar-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
  }

  .nav-logo-text {
    font-size: 1rem !important;
  }

  .nav-logo-tagline {
    font-size: 1.1rem !important;
  }
}