/* ==========================================================================
   IT Niche — responsive layer
   Breakpoints: 1280 · 1080 (nav → drawer) · 1024 · 768 · 480 · 360
   ========================================================================== */

/* Base hover/lift transitions for cards that aren't scroll-revealed */
.prod, .post, .quote { transition: transform var(--t-med) var(--ease), border-color var(--t-med), box-shadow var(--t-med); }

/* ---------- ≤1280 ---------- */
@media (max-width: 1280px) {
  .mega__body { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: 28px; }
  .mega__aside { padding-left: 24px; }
  .nav__link { padding: 0 11px; }
  .nav__link::after { left: 11px; right: 11px; }
  .nav { gap: 12px; }
}

/* ---------- ≤1080: drawer navigation ---------- */
@media (max-width: 1080px) {
  :root { --hh: 68px; }
  .site-header.is-scrolled { --hh: 62px; }
  .logo img { height: 40px; }
  .is-scrolled .logo img { height: 36px; }

  .header__inner { gap: 12px; }
  .header__call, .nav-toggle { position: relative; z-index: 2; display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; color: var(--black); transition: background-color var(--t-fast), color var(--t-fast); }
  .header__call { margin-left: auto; background: var(--orange); color: var(--on-orange); }
  .header__call svg, .nav-toggle svg { width: 22px; height: 22px; }
  .nav-toggle { border: 1.5px solid var(--line-strong); background: #fff; }
  .nav-toggle .ic-close { display: none; }
  .nav-toggle[aria-expanded="true"] .ic-open { display: none; }
  .nav-toggle[aria-expanded="true"] .ic-close { display: block; }

  .nav {
    position: fixed; inset: 0; z-index: 0; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; height: auto;
    padding: calc(var(--hh) + 6px) var(--gutter) 0; background: #fff;
    visibility: hidden; opacity: 0; transform: translateY(-14px);
    transition: opacity .28s var(--ease), transform .35s var(--ease), visibility 0s .35s;
  }
  .nav.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .nav__list { display: block; flex: 1; height: auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 16px; -webkit-overflow-scrolling: touch; }
  .nav__item, .nav__cta { animation: none; }
  .nav__item { display: block; height: auto; border-bottom: 1px solid var(--line); }
  .nav__link { display: flex; width: 100%; height: auto; min-height: 58px; padding: 0 4px; justify-content: space-between; border-radius: 0; font-size: 1.1875rem; }
  .nav__link::after { display: none; }
  .nav__link.is-active { color: var(--orange-ink); }
  .nav__cta { flex: none; width: 100%; margin: 12px 0 max(20px, env(safe-area-inset-bottom)); min-height: 54px; }

  /* mega → accordion */
  .has-mega--compact { position: static; }
  .mega, .mega--compact {
    position: static; width: auto; margin: 0; left: auto; top: auto; display: grid; grid-template-rows: 0fr; visibility: visible; opacity: 1; transform: none; pointer-events: auto;
    background: transparent; border: 0; border-radius: 0; box-shadow: none; transition: grid-template-rows .35s var(--ease);
  }
  .nav__item.is-open > .mega, .nav__item.is-open > .mega--compact { grid-template-rows: 1fr; transform: none; }
  .mega__inner, .mega--compact .mega__inner { display: block; width: auto; min-height: 0; overflow: hidden; padding: 0; visibility: hidden; transition: visibility 0s .35s; }
  .nav__item.is-open .mega__inner { visibility: visible; transition-delay: 0s; }
  .mega__body { display: block; }
  .mega__panel { display: block; }
  .mega__col { padding: 6px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .mega__col:first-child { padding-left: 0; }
  .mega__col:last-child { border-bottom: 0; padding-right: 0; }
  .mega__row { padding: 10px 8px; margin: 0 -8px; }
  .mega__promo { margin: 12px 0 16px; }
  .mega__aside { padding: 20px 0 24px; margin: 0; border-left: 0; border-top: 1px solid var(--line); }
}

/* ---------- ≤1024 ---------- */
@media (max-width: 1024px) {
  .hero__grid, .ai__grid, .xp-sec__grid, .intro__grid, .services__grid { grid-template-columns: 1fr; }
  .hero__art { max-width: 620px; margin-inline: auto; width: 100%; }
  .ai__viz { max-width: 420px; }
  .services__art { max-width: 460px; margin-inline: auto; width: 100%; order: 2; }
  .services__body { order: 1; }
  .promo-card { grid-template-columns: 1fr; }
  .promo-card__notifs { max-width: 480px; }
  .section-head--split { grid-template-columns: 1fr; align-items: start; }
  .link-arrow--lg, .slider-ctrl { justify-self: start; }
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .xp-sec__copy { order: 2; justify-self: stretch; }
  .xp { order: 1; }
  .xp-sec__grid { justify-items: center; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__brand { grid-column: 1 / -1; }
}

/* ---------- ≤768 ---------- */
@media (max-width: 768px) {
  body { font-size: 1rem; }
  .grid--3 { grid-template-columns: 1fr; }
  .report__fields, .fgrid { grid-template-columns: 1fr; }
  .tabs__list { grid-template-columns: repeat(2, 1fr); }
  .tab { flex-direction: row; justify-content: flex-start; gap: 10px; text-align: left; min-height: 52px; padding: 8px 12px; }
  .tab[aria-selected="true"]::after { left: 12px; right: 12px; }
  .follow__inner { flex-direction: column; align-items: flex-start; }
  .hero__promo-box { padding: 30px 20px 18px; }
  .promo-card { padding: 28px 22px; border-radius: var(--r-lg); }
  .notif:nth-child(2), .notif:nth-child(3) { margin-left: 0; }
  .xp__ic { width: 52px; height: 52px; }
  .xp__nodes li { width: 52px; height: 52px; margin: -26px 0 0 -26px; }
  .xp__ic svg { width: 22px; height: 22px; }
  .xp__nodes strong { font-size: .6875rem; letter-spacing: .03em; }
  .quote blockquote p { font-size: 1.0625rem; }
  .footer__top { gap: 32px 24px; }
}

/* ---------- ≤480 ---------- */
@media (max-width: 480px) {
  .hero { padding-top: calc(var(--hh) + 28px); }
  .hero__lines, .hero__mark { display: none; }
  .hero__dots { width: 90vw; top: 0; opacity: .7; }
  .hero__blob { width: 80vw; right: -20vw; top: 30%; margin-top: 0; }
  .pills li { font-size: .875rem; }
  .btn { white-space: normal; text-align: left; }
  .footer__top { grid-template-columns: 1fr; }
  .footer__two { grid-template-columns: 1fr 1fr; }
  .tabs__list { padding: 6px; gap: 4px; }
  .tab { font-size: .78rem; padding: 8px; gap: 8px; }
  .tab svg { width: 18px; height: 18px; }
  .step-actions .btn { flex: 1; }
  .steps-ind li { font-size: .75rem; flex-direction: column; align-items: flex-start; gap: 4px; }
  .quote { flex-basis: 88vw; }
  .flow-chips li { font-size: .75rem; padding: 5px 9px; }
  .xp { margin-bottom: 56px; }
  .promo-card__notifs .notif small { display: none; }
}

/* ---------- ≤360 ---------- */
@media (max-width: 360px) {
  :root { --gutter: 14px; }
  h1 { font-size: 2.1rem; }
  .logo img { height: 34px; }
  .header__call, .nav-toggle { width: 42px; height: 42px; }
  .report { padding: 16px; }
  .tabs__list { grid-template-columns: 1fr; }
  .footer__two { grid-template-columns: 1fr; }
}

/* ---------- ≥1440: give the grid a little more air ---------- */
@media (min-width: 1440px) {
  :root { --container: 1320px !important; }
  .hero__grid { gap: 96px; }
}