/* Responsive overrides for the Figma desktop layout (designed at 1440px) */

html,
body {
  margin: 0;
  padding: 0;
}

body {
  overflow-x: hidden;
}

.desktop-shell,
.audit-shell {
  display: none;
}

.mobile-view {
  display: none;
}

@media (min-width: 1440px) {
  .desktop-shell,
  .audit-shell {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: relative;
    left: 0;
    top: 0;
  }

  /* Homepage: full-bleed soft gradient so edges match other pages */
  .desktop-shell {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: linear-gradient(180deg, #f0faff 0%, #ffffff 40%, #f7fcff 70%, #eaf6ff 100%);
  }

  .desktop-veiw,
  .audit-shell > .website-audit-tool {
    width: 1440px;
    max-width: none;
    margin: 0 auto;
    transform-origin: top left;
  }

  .desktop-veiw {
    background: transparent;
  }

  .mobile-view {
    display: none !important;
  }
}

@media (max-width: 1439px) {
  .desktop-shell,
  .audit-shell {
    display: none !important;
  }

  .desktop-veiw,
  .audit-shell > .website-audit-tool {
    display: none !important;
  }

  .mobile-view {
    display: block !important;
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
}