/* PentesterSpace mobile layout
   Loaded only at 920px and below, after the shared desktop/base stylesheet. */

.nav-solutions {
  display:block;
  width:100%;
  align-self:auto;
  border:0;
}

.nav-solutions-trigger,
.nav-solutions:hover .nav-solutions-trigger,
.nav-solutions:focus-within .nav-solutions-trigger,
.nav-solutions.is-open .nav-solutions-trigger {
  width:100%;
  min-height:50px;
  padding:11px 13px !important;
  border:0 !important;
  border-radius:14px;
}

.nav-solutions.is-open .nav-solutions-trigger {
  color:var(--green);
  background:color-mix(in srgb,var(--green-pale) 68%,transparent);
}

.nav-solutions .solutions-menu,
.nav-solutions:hover .solutions-menu,
.nav-solutions:focus-within .solutions-menu {
  display:none;
  position:static;
  width:100%;
  padding:6px 6px 10px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  opacity:0;
  visibility:hidden;
  transform:none;
  pointer-events:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

.nav-solutions.is-open .solutions-menu,
.nav-solutions.is-open:hover .solutions-menu,
.nav-solutions.is-open:focus-within .solutions-menu {
  display:grid;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.solutions-menu::before {
  display:none;
}

.solutions-menu-heading {
  padding:5px 10px 8px;
}

.nav-links .solutions-menu a,
.nav-links .solutions-menu a:hover,
.nav-links .solutions-menu a:focus-visible,
.nav-links .solutions-menu a[aria-current="page"] {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  width:100%;
  min-height:62px;
  gap:12px;
  padding:8px 10px;
  border:0;
  border-radius:12px;
  touch-action:manipulation;
}

.nav-links .solutions-menu a + a {
  border-top:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}

.nav-links .solutions-menu a:not(.mobile-nav-cta)::before {
  content:none;
  display:none;
}

.nav-solutions-trigger::before {
  content:"03" !important;
  display:block !important;
}

.nav-links > a:nth-of-type(3)::before { content:"04"; }
.nav-links > a:nth-of-type(4)::before { content:"05"; }
.nav-links > a:nth-of-type(5)::before { content:"06"; }
.nav-links > a:nth-of-type(6)::before { content:"07"; }

.solutions-menu-code,
.solutions-menu-code.has-product-logo {
  width:42px;
  height:42px;
  padding:4px;
}

.solutions-menu b {
  font-size:.86rem;
}

.solutions-menu small {
  margin-top:2px;
  font-size:.65rem;
  line-height:1.35;
}

.nav-links .solutions-menu a.solutions-menu-all {
  display:flex;
  min-height:46px;
  margin-top:5px;
  padding:11px 10px;
  border-top:1px solid var(--line);
  border-radius:0;
}

/* A late desktop grid rule used to squeeze these canvases beside their copy. */
.solution-product-page .product-hero-grid,
.oqtrix-page .product-hero-grid,
.solution-product-page .oqtrix-hero-grid,
.solution-product-page .adversyn-hero .product-hero-grid,
.solution-product-page .tracefold-hero-grid {
  grid-template-columns:minmax(0,1fr);
  gap:22px;
}

.solution-product-page .product-hero-copy,
.oqtrix-page .product-hero-copy,
.tracefold-hero-copy {
  width:100%;
  max-width:none;
}

.oqtrix-product-visual,
.adversyn-product-visual,
.tracefold-product-visual {
  order:2;
  width:min(900px,100%);
  margin-inline:auto;
}

.page-solutions .page-hero,
.page-bounty .page-hero {
  overflow:hidden;
}

@media (max-width: 680px) {
  .container {
    width:min(100% - 24px,var(--max));
  }

  .nav-shell {
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:8px;
    width:calc(100% - 20px);
    min-height:58px;
    padding:7px 8px 7px 10px;
    overflow:visible;
  }

  .brand {
    min-width:0;
    gap:7px;
    font-size:.83rem;
  }

  .brand img {
    width:27px;
    height:27px;
  }

  .nav-actions {
    flex:0 0 auto;
    gap:7px;
  }

  .theme-toggle {
    flex:0 0 52px;
    width:52px;
    height:38px;
  }

  .theme-toggle::before {
    top:5px;
    left:5px;
    width:26px;
    height:26px;
  }

  [data-theme="dark"] .theme-toggle::before {
    transform:translateX(15px);
  }

  .theme-toggle .moon {
    left:9px;
  }

  .theme-toggle .sun {
    right:8px;
  }

  .menu-toggle {
    flex:0 0 39px;
    width:39px;
    height:39px;
  }

  .nav-links {
    inset:74px 10px auto;
    max-height:calc(100svh - 86px);
    padding:10px;
    border-radius:22px;
    overscroll-behavior:contain;
  }

  .nav-links.open {
    max-height:calc(100svh - 86px);
    padding:10px;
  }

  .nav-links::before {
    padding:6px 11px 8px;
  }

  .nav-links a,
  .nav-links a:hover,
  .nav-links a[aria-current="page"] {
    min-height:48px;
    padding:10px 12px;
  }

  .nav-links .solutions-menu a,
  .nav-links .solutions-menu a:hover,
  .nav-links .solutions-menu a:focus-visible,
  .nav-links .solutions-menu a[aria-current="page"] {
    min-height:60px;
  }

  .solution-product-page .product-hero,
  .oqtrix-page .product-hero {
    padding:100px 0 38px;
  }

  .solution-product-page .product-hero-grid,
  .oqtrix-page .product-hero-grid,
  .solution-product-page .oqtrix-hero-grid,
  .solution-product-page .adversyn-hero .product-hero-grid,
  .solution-product-page .tracefold-hero-grid {
    gap:18px;
  }

  .product-identity {
    gap:11px;
    margin-bottom:17px;
  }

  .product-identity > img {
    width:50px;
    height:50px;
    flex-basis:50px;
  }

  .solution-product-page .product-hero h1,
  .oqtrix-page .product-hero h1 {
    max-width:100%;
    font-size:clamp(2.65rem,12.4vw,3.55rem);
    line-height:.99;
    text-wrap:balance;
  }

  .solution-product-page .product-hero-line,
  .oqtrix-page .product-hero-line {
    max-width:100%;
    margin:18px 0 0;
  }

  .solution-product-page .product-hero .lead,
  .oqtrix-page .product-hero .lead {
    max-width:100%;
    margin:18px 0 22px;
    font-size:.92rem;
    line-height:1.65;
  }

  .solution-product-page .product-hero .hero-actions,
  .oqtrix-page .product-hero .hero-actions {
    gap:10px;
  }

  .solution-product-page .product-hero .hero-meta,
  .oqtrix-page .product-hero .hero-meta {
    gap:12px 18px;
    margin-top:22px;
  }

  .oqtrix-product-visual,
  .adversyn-product-visual,
  .tracefold-product-visual {
    width:calc(100% + 24px);
    height:clamp(330px,91vw,390px);
    margin:0 -12px -4px;
  }

  .ptaas-product-visual {
    width:calc(100% + 24px);
    margin:0 -12px -4px;
  }
}