@media (min-width: 1440px) {
  .styleguide-layout {
    grid-template-columns: 19rem minmax(0, 1fr);
  }
}

@media (max-width: 1024px) {
  .shell-inner {
    grid-template-columns: 1fr auto;
  }

  .main-nav {
    grid-column: 1 / -1;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0.2rem;
    padding: 0.55rem 0 0.2rem;
  }

  .main-nav.is-open {
    display: flex;
  }

  .main-nav a {
    padding: 0.75rem;
  }

  .shell-actions {
    grid-column: 1 / -1;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .shell-toggle {
    display: inline-grid;
    place-items: center;
  }

  .resource-toolbar,
  .state-grid,
  .card-grid,
  .swatch-grid,
  .component-row,
  .feature-grid,
  .journey-grid,
  .account-grid,
  .dashboard-stats,
  .workspace-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-inner,
  .route-grid,
  .showcase-grid,
  .home-hero,
  .journey-panel,
  .comparison-grid,
  .styleguide-hero-grid,
  .styleguide-layout {
    grid-template-columns: 1fr;
  }

  .problem-grid,
  .commercial-feature-grid,
  .profile-grid,
  .profile-grid--compact,
  .trust-grid,
  .pricing-grid,
  .offer-grid,
  .audience-lane-grid,
  .mockup-gallery,
  .hero-device__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hero-device {
    position: relative;
    width: 100%;
    max-width: none;
  }

  .home-hero__visual {
    min-height: auto;
  }

  .hero-floating--one,
  .hero-floating--two,
  .hero-floating--three,
  .hero-floating--four {
    position: relative;
    inset: auto;
  }

  .home-hero__visual {
    display: grid;
    gap: 0.85rem;
  }

  .styleguide-sidebar {
    position: static;
  }
}

@media (max-width: 768px) {
  .form-row,
  .resource-grid,
  .bullet-grid,
  .state-grid,
  .card-grid,
  .swatch-grid,
  .component-row,
  .feature-grid,
  .journey-grid,
  .showcase-metrics,
  .showcase-panels,
  .account-grid,
  .dashboard-stats,
  .workspace-columns {
    grid-template-columns: 1fr;
  }

  .problem-grid,
  .commercial-feature-grid,
  .profile-grid,
  .profile-grid--compact,
  .trust-grid,
  .pricing-grid,
  .offer-grid,
  .audience-lane-grid,
  .mockup-gallery,
  .hero-device__stats,
  .hero-device__panels,
  .journey-panel,
  .comparison-grid {
    grid-template-columns: 1fr;
  }

  .page-hero,
  .section-card,
  .status-card,
  .info-card,
  .form-card,
  .table-card,
  .styleguide-section {
    padding: 1.15rem;
  }

  .data-table {
    min-width: 34rem;
  }

  .demo-banner,
  .final-cta {
    flex-direction: column;
    align-items: flex-start;
  }

  .hero-device__layout {
    grid-template-columns: 1fr;
  }

  .hero-device__sidebar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
  }

  .mockup-card__body {
    grid-template-columns: 1fr;
  }

  .journey-switcher__tabs {
    overflow-x: auto;
    padding-bottom: 0.15rem;
  }

  .hero-device__tabs {
    overflow-x: auto;
    padding-bottom: 0.15rem;
    flex-wrap: nowrap;
  }
}

@media (max-width: 375px) {
  .page-shell,
  .styleguide-header__inner,
  .styleguide-layout {
    width: min(100% - 1.1rem, var(--page-max));
  }

  .shell-inner {
    width: min(100% - 1.1rem, var(--page-max));
  }

  .brand-copy span {
    display: none;
  }

  .page-hero__actions,
  .shell-actions,
  .form-actions,
  .inline-actions {
    align-items: stretch;
  }

  .page-hero__actions a,
  .shell-actions a,
  .shell-actions button,
  .shell-actions .lang-switch,
  .form-actions > *,
  .inline-actions > * {
    width: 100%;
  }

  .footer-inner,
  .styleguide-sidebar,
  .styleguide-section {
    padding: 1rem;
  }

  .hero-device__sidebar {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 320px) {
  .page-shell {
    padding-top: 0.9rem;
  }

  .brand-mark {
    gap: 0.65rem;
  }

  .brand-badge {
    width: 2.6rem;
    height: 2.6rem;
  }

  .page-hero h1 {
    font-size: 1.9rem;
  }

  .home-hero {
    padding: 1.1rem;
  }

  .journey-switcher__tab,
  .solution-orbit__node,
  .hero-floating {
    min-width: 0;
    width: 100%;
  }
}

@media (max-width:1100px){
  .shell-inner{grid-template-columns:auto auto 1fr!important}.main-nav{position:absolute;left:1rem;right:1rem;top:calc(100% + .4rem);display:none;flex-direction:column;align-items:stretch;padding:.75rem;background:#fff;border:1px solid rgba(57,133,69,.15);border-radius:20px;box-shadow:0 18px 45px rgba(20,57,70,.16);z-index:80}.main-nav.is-open{display:flex}.shell-toggle{display:inline-flex!important;order:2}.shell-actions{margin-left:auto;order:3}.nav-link,.nav-dropdown__trigger{width:100%;justify-content:space-between;text-align:left;border-radius:12px}.nav-dropdown__panel{position:static;transform:none!important;min-width:0;box-shadow:none;border:0;background:#f7faf8;margin:.25rem 0 0 .5rem;padding:.25rem;display:none;opacity:1;visibility:visible;pointer-events:auto}.nav-dropdown:hover .nav-dropdown__panel,.nav-dropdown:focus-within .nav-dropdown__panel{display:none}.nav-dropdown.is-open .nav-dropdown__panel{display:block}.download-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grid-pro,.activation-layout{grid-template-columns:1fr}.architecture-flow{grid-template-columns:1fr}.architecture-arrow{transform:rotate(90deg);text-align:center}}
@media (max-width:720px){.brand-copy{display:none}.shell-primary-cta{display:none}.download-catalog,.guide-downloads{grid-template-columns:1fr}.shell-actions .lang-switch{display:flex}.footer-inner{grid-template-columns:1fr!important}.contact-form-card,.activation-card,.guide-card{padding:1rem}}
