/* ============================================================
   Pharmadictia — Responsive (mobile-first optimisé desktop)
   Breakpoints : 1280 / 1024 / 768 / 600 / 430
   ============================================================ */

/* ---------- Desktop large : tout en place ---------- */

/* ---------- ≤ 1180px : réduction des grilles 4 colonnes ---------- */
@media (max-width: 1180px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .site-footer__top { grid-template-columns: 1.4fr 1fr 1fr; }
  .site-footer__brand { grid-column: 1 / -1; }
}

/* ---------- ≤ 1024px : tablette paysage ---------- */
@media (max-width: 1024px) {
  :root { --sidebar-w: 240px; }
  .dash-grid { grid-template-columns: 1fr; }
  .dash-grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .hero__grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .hero__visual { max-width: 560px; }
  .solution-row { grid-template-columns: 1fr; gap: var(--space-6); }
  .solution-row.rev > .solution-row__media { order: 0; }
  .search-box { width: 220px; }
}

/* ---------- ≤ 860px : sidebar en drawer ---------- */
@media (max-width: 860px) {
  .sidebar { transform: translateX(-100%); box-shadow: var(--shadow-lg); }
  .sidebar.open { transform: translateX(0); }
  .app-main { margin-left: 0; }
  .topbar__menu { display: flex; }
  .search-box { display: none; }
  .user-chip__meta { display: none; }
}

/* ---------- ≤ 768px : tablette portrait ---------- */
@media (max-width: 768px) {
  :root { --page-gutter: 20px; }
  h1 { font-size: var(--fs-3xl); }
  h2 { font-size: var(--fs-2xl); }
  .section { padding-block: var(--space-10); }
  .section-head .lead, .lead { font-size: var(--fs-md); }

  /* nav publique → menu mobile */
  .site-nav__links, .site-nav__actions .nav-hide { display: none; }
  .nav-toggle { display: flex; }
  .site-nav.menu-open .site-nav__links {
    display: flex; position: absolute; top: 74px; left: 0; right: 0; flex-direction: column;
    background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: var(--shadow-md);
    padding: 12px var(--page-gutter) 18px; gap: 2px;
  }
  .site-nav.menu-open .site-nav__links a { width: 100%; padding: 12px 14px; }

  .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .site-footer__top { grid-template-columns: 1fr 1fr; }
  .page-intro { flex-direction: column; align-items: flex-start; }
  .modal__foot { flex-direction: column-reverse; }
  .modal__foot .btn { width: 100%; }
}

/* ---------- ≤ 600px : grands smartphones ---------- */
@media (max-width: 600px) {
  .kpi-grid { grid-template-columns: 1fr; }
  .grid-auto { grid-template-columns: 1fr; }
  .hero__cta { flex-direction: column; }
  .hero__cta .btn { width: 100%; }
  .hero-float--ai { right: 0; top: -14px; }
  .hero-float--alert { left: 0; bottom: -14px; }
  .toast-wrap { left: 14px; right: 14px; max-width: none; }
  .segment { width: 100%; overflow-x: auto; }
  .stat-tile .sv { font-size: var(--fs-2xl); }
  .fb-fab { bottom: 16px; right: 16px; }
}

/* ---------- ≤ 430px : smartphones ---------- */
@media (max-width: 430px) {
  :root { --page-gutter: 14px; }
  .site-footer__top { grid-template-columns: 1fr; }
  .topbar__title h1 { font-size: var(--fs-lg); }
  .card-head, .card-body, .card-pad { padding: var(--space-4); }
  .app-content { padding-inline: var(--page-gutter); }
  h1 { font-size: var(--fs-2xl); }
  .hero h1 { font-size: 1.9rem; }
  .btn { padding: 11px 16px; }
  .modal__head, .modal__body { padding-inline: var(--space-4); }
}

/* print */
@media print {
  .site-nav, .sidebar, .topbar, .fb-fab, .site-footer, .page-intro__actions { display: none !important; }
  .app-main { margin-left: 0; }
  body { background: #fff; }
  .card { box-shadow: none; border-color: #ddd; }
}