/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

/* Common hero components */
.hero-copy {
  max-width: 760px;
}

.hero-eyebrow,
.hero-eyebrow-light,
.ztna-eyebrow,
.edge-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(0, 112, 255, 0.10);
  color: #006fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.hero-eyebrow::before,
.hero-eyebrow-light::before,
.ztna-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 6px rgba(0, 112, 255, 0.12);
}

.hero-eyebrow-light {
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.92);
}

.hero-eyebrow-light::before {
  box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.16);
}
/* end: Common hero components */


/* UniFi page custom styles */
/* UniFi cost comparison - CSS only
       TODO: move this block to custom.css when finalized. */
    .unifi-page #section2 {
      background:
        radial-gradient(circle at top left, rgba(0, 112, 255, 0.10), transparent 34%),
        linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
    }

    .unifi-cost-card {
      max-width: 1040px;
      margin: 56px auto 0;
      padding: 34px;
      border-radius: 26px;
      background: rgba(255, 255, 255, 0.92);
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 24px 70px rgba(10, 28, 54, 0.10);
    }

    .unifi-cost-row {
      display: grid;
      grid-template-columns: 180px 1fr;
      gap: 24px;
      align-items: center;
    }

    .unifi-cost-row + .unifi-cost-row {
      margin-top: 28px;
      padding-top: 28px;
      border-top: 1px solid rgba(20, 32, 50, 0.08);
    }

    .unifi-cost-label strong {
      display: block;
      color: #101828;
      font-size: 20px;
      font-weight: 700;
      letter-spacing: -0.02em;
    }

    .unifi-cost-label span {
      display: block;
      margin-top: 4px;
      color: #667085;
      font-size: 12px;
      line-height: 1.5;
    }

    .unifi-cost-bar {
      display: flex;
      height: 74px;
      overflow: hidden;
      border-radius: 18px;
      background: #e8edf5;
      box-shadow: inset 0 0 0 1px rgba(20, 32, 50, 0.06);
    }

    .unifi-cost-segment {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 54px;
      color: #fff;
      text-align: center;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.25;
    }

    .unifi-cost-segment span {
      position: relative;
      z-index: 1;
      padding: 0 6px;
    }

    .unifi-cost-segment.hardware { background: #334155; }
    .unifi-cost-segment.license { background: #64748b; }
    .unifi-cost-segment.resale { background: #475569; }
    .unifi-cost-segment.install { background: #0f766e; }
    .unifi-cost-segment.saved { background: linear-gradient(135deg, #006fff 0%, #38bdf8 100%); }

    .unifi-cost-note {
      margin: 26px 0 0;
      padding-top: 20px;
      border-top: 1px solid rgba(20, 32, 50, 0.08);
      color: #475467;
      font-size: 13px;
      text-align: center;
    }

    @media (max-width: 767.98px) {
      .unifi-cost-card {
        padding: 22px;
        border-radius: 20px;
      }

      .unifi-cost-row {
        grid-template-columns: 1fr;
        gap: 12px;
      }

      .unifi-cost-bar {
        height: auto;
        min-height: 64px;
      }

      .unifi-cost-segment {
        min-width: 42px;
        font-size: 10px;
      }
    }


    /* UniFi solution product cards
       TODO: move this block to custom.css when finalized. */
    .unifi-page #section1 {
      background:
        radial-gradient(circle at top right, rgba(0, 112, 255, 0.08), transparent 32%),
        #fff;
    }

    .unifi-page #section1 .row.m-t-100 {
      margin-top: 58px !important;
    }

    .unifi-page #section1 .col-lg-6 {
      margin-bottom: 30px;
    }

    .unifi-page #section1 .icon-box {
      height: 100%;
      min-height: 360px;
      padding: 42px 36px 38px;
      border-radius: 24px;
      background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 18px 45px rgba(10, 28, 54, 0.08);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }

    .unifi-page #section1 .icon-box:hover {
      transform: translateY(-6px);
      border-color: rgba(0, 112, 255, 0.22);
      box-shadow: 0 28px 70px rgba(10, 28, 54, 0.14);
    }

    .unifi-page #section1 .icon-box a {
      display: inline-block;
      width: auto;
      height: auto;
      margin-bottom: 24px;
      padding: 0;
      border-radius: 0;
      background: transparent;
      border: 0;
      box-shadow: none;
    }

    .unifi-page #section1 .icon-box img {
      max-width: 96px;
      max-height: 96px;
      width: auto;
      height: auto;
      filter: drop-shadow(0 10px 18px rgba(0, 64, 128, 0.14));
      transition: transform .25s ease;
    }

    .unifi-page #section1 .icon-box:hover img {
      transform: scale(1.06);
    }

    .unifi-page #section1 .icon-box h3 {
      margin-bottom: 14px;
      color: #101828;
      font-size: 22px;
      font-weight: 700;
      letter-spacing: -0.03em;
    }

    .unifi-page #section1 .icon-box p {
      margin-bottom: 0;
      color: #5d6673;
      line-height: 1.85;
      font-size: 14px;
    }

    @media (max-width: 991.98px) {
      .unifi-page #section1 .icon-box {
        min-height: auto;
      }
    }


    /* UniFi case studies - CSS only
       TODO: move this block to custom.css when finalized. */
    .unifi-page #section3 {
      background: #fff;
    }

    .unifi-case-grid {
      margin-top: 56px;
    }

    .unifi-case-col {
      margin-bottom: 30px;
    }

    .unifi-case-card {
      height: 100%;
      display: flex;
      flex-direction: column;
      border-radius: 26px;
      background: #fff;
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 18px 48px rgba(10, 28, 54, 0.10);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }

    .unifi-case-card:hover {
      transform: translateY(-4px);
      border-color: rgba(0, 112, 255, 0.20);
      box-shadow: 0 28px 70px rgba(10, 28, 54, 0.14);
    }

    .unifi-case-media {
      position: relative;
      overflow: hidden;
      border-radius: 26px 26px 0 0;
      background: #eef2f7;
    }

    .unifi-case-media img {
      display: block;
      width: 100%;
      height: 240px;
      object-fit: cover;
      transition: transform .35s ease;
    }

    .unifi-case-card:hover .unifi-case-media img {
      transform: scale(1.035);
    }

    .unifi-case-tag {
      position: absolute;
      right: 18px;
      bottom: 18px;
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      padding: 7px 14px;
      background: rgba(0, 112, 255, 0.94);
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .05em;
      line-height: 1;
      box-shadow: 0 10px 24px rgba(0, 112, 255, 0.22);
    }

    .unifi-case-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      padding: 30px 30px 32px;
    }

    .unifi-case-body h4 {
      font-size: 22px;
      font-weight: 700;
      line-height: 1.45;
      letter-spacing: -0.02em;
      margin-bottom: 16px;
      text-align: left !important;
    }

    .unifi-case-body > p {
      color: #5d6673;
      font-size: 14px;
      line-height: 1.9;
      margin-bottom: 0;
    }

    .unifi-case-detail {
      margin-top: 20px;
      border-top: 1px solid rgba(20, 32, 50, 0.08);
      padding-top: 16px;
    }

    .unifi-case-detail summary {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      cursor: pointer;
      color: #006fff;
      font-size: 14px;
      font-weight: 700;
      list-style: none;
      user-select: none;
    }

    .unifi-case-detail summary::-webkit-details-marker {
      display: none;
    }

    .unifi-case-detail summary::after {
      content: "+";
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      border-radius: 999px;
      background: rgba(0, 112, 255, 0.10);
      color: #006fff;
      font-size: 15px;
      line-height: 1;
    }

    .unifi-case-detail[open] summary::after {
      content: "−";
    }

    .unifi-case-detail-body {
      margin-top: 16px;
      padding: 18px 20px;
      border-radius: 18px;
      background: #f7f9fc;
      color: #475467;
      font-size: 13px;
      line-height: 1.85;
    }

    .unifi-case-detail-body p {
      color: #475467;
      font-size: 13px;
      line-height: 1.85;
      margin-bottom: 12px;
    }

    .unifi-case-detail-body p:last-child {
      margin-bottom: 0;
    }

    .unifi-case-detail-body ul {
      margin: 12px 0 12px 0;
      padding-left: 18px;
    }

    .unifi-case-detail-body li + li {
      margin-top: 8px;
    }

    .unifi-case-detail-images {
      margin-top: 16px;
    }

    .unifi-case-detail-images img {
      border-radius: 14px;
      box-shadow: 0 12px 28px rgba(10, 28, 54, 0.10);
    }

    .unifi-case-detail-images p {
      margin-top: 8px;
      font-size: 12px;
      color: #667085;
    }

    @media (max-width: 767.98px) {
      .unifi-case-grid {
        margin-top: 36px;
      }

      .unifi-case-card {
        border-radius: 22px;
      }

      .unifi-case-media {
        border-radius: 22px 22px 0 0;
      }

      .unifi-case-media img {
        height: 210px;
      }

      .unifi-case-body {
        padding: 24px 22px 26px;
      }

      .unifi-case-body h4 {
        font-size: 20px;
      }
    }


/* UniFi section sizing adjustments */
.unifi-page #section1,
.unifi-page #section2,
.unifi-page #section3 {
  min-height: auto;
  padding-top: 86px;
  padding-bottom: 86px;
}

.unifi-page #section1 .icon-box {
  min-height: auto;
  padding-bottom: 34px;
}

.unifi-page #section1 .row.m-t-100 {
  margin-top: 52px !important;
}

@media (max-width: 767.98px) {
  .unifi-page #section1,
  .unifi-page #section2,
  .unifi-page #section3 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
}
/* end: UniFi section sizing adjustments */


/* ZTNA page custom styles */
/* ZTNA page styles */
    body.ztna-page {
      background: #f6f8fb;
    }

    .ztna-page #header .header-inner,
    .ztna-page #header #header-wrap {
      background: rgba(255, 255, 255, 0.86);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      box-shadow: 0 10px 30px rgba(10, 28, 54, 0.06);
    }

    .ztna-page #header[data-transparent="true"] .header-inner,
    .ztna-page #header[data-transparent="true"] #header-wrap {
      background: rgba(255, 255, 255, 0.86);
    }

    .ztna-page #header .btn-light {
      color: #0b5ed7;
      border-color: rgba(11, 94, 215, 0.32);
      background: rgba(255, 255, 255, 0.7);
    }

    .ztna-page section {
      overflow: hidden;
    }

    .ztna-section {
      min-height: auto;
      padding: 110px 0;
      background: #fff;
    }

    .ztna-section.background-grey {
      background:
        radial-gradient(circle at 96% 16%, rgba(0, 112, 255, 0.06), transparent 22%),
        linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
    }

    .ztna-hero {
      min-height: 100vh;
      padding: 130px 0 90px;
      background:
        radial-gradient(circle at 92% 78%, rgba(0, 112, 255, 0.14), transparent 22%),
        radial-gradient(circle at 18% 92%, rgba(13, 148, 136, 0.08), transparent 26%),
        linear-gradient(135deg, #f8fbff 0%, #f2f6fb 50%, #ffffff 100%);
      display: flex;
      align-items: center;
    }

    .ztna-hero .row {
      min-height: auto;
    }

    .ztna-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 18px;
      padding: 7px 14px;
      border-radius: 999px;
      background: rgba(0, 112, 255, 0.10);
      color: #006fff;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    .ztna-eyebrow::before {
      content: "";
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #006fff;
      box-shadow: 0 0 0 6px rgba(0, 112, 255, 0.12);
    }

    .ztna-page .lead {
      color: #596579;
      font-size: 1.06rem;
      line-height: 1.95;
      font-weight: 400;
    }

    .ztna-visual-card {
      position: relative;
      padding: 22px;
      border-radius: 30px;
      background: rgba(255, 255, 255, 0.84);
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 26px 72px rgba(10, 28, 54, 0.13);
    }

    .ztna-visual-card::before {
      content: "";
      position: absolute;
      inset: 14px;
      border-radius: 24px;
      background: linear-gradient(135deg, rgba(0, 112, 255, 0.08), transparent 46%);
      pointer-events: none;
    }

    .ztna-visual-card img {
      position: relative;
      z-index: 1;
      width: 100%;
      border-radius: 22px;
    }

    .ztna-image-panel {
      padding: 22px;
      border-radius: 28px;
      background: #fff;
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 22px 64px rgba(10, 28, 54, 0.10);
    }

    .ztna-image-panel img {
      width: 100%;
      border-radius: 20px;
    }

    .ztna-compare-wrap {
      margin-top: 48px;
      padding: 28px;
      border-radius: 26px;
      background: rgba(255, 255, 255, 0.92);
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 24px 70px rgba(10, 28, 54, 0.10);
    }

    .ztna-compare-table {
      margin: 0;
      border-collapse: separate;
      border-spacing: 0 12px;
    }

    .ztna-compare-table thead th {
      border: 0;
      color: #667085;
      font-size: 12px;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-weight: 700;
      padding: 0 18px 8px;
    }

    .ztna-compare-table tbody tr {
      box-shadow: 0 10px 28px rgba(10, 28, 54, 0.06);
    }

    .ztna-compare-table tbody td {
      border: 0;
      background: #fff;
      padding: 22px 18px;
      color: #344054;
      vertical-align: middle;
      font-weight: 500;
    }

    .ztna-compare-table tbody td:first-child {
      border-radius: 18px 0 0 18px;
      color: #101828;
      font-weight: 700;
    }

    .ztna-compare-table tbody td:last-child {
      border-radius: 0 18px 18px 0;
      color: #006fff;
      font-weight: 700;
      background: linear-gradient(135deg, rgba(0, 112, 255, 0.10), rgba(56, 189, 248, 0.08));
    }

    .ztna-compare-table .icon-arrow-right {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: #eef6ff;
      color: #006fff;
    }

    .ztna-tabs-card {
      margin-top: 40px;
      padding: 28px;
      border-radius: 26px;
      background: #fff;
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 24px 70px rgba(10, 28, 54, 0.10);
    }

    .ztna-page .tabs.tabs-clean .nav-tabs {
      border-bottom: 1px solid rgba(20, 32, 50, 0.08);
      gap: 8px;
    }

    .ztna-page .tabs.tabs-clean .nav-tabs .nav-link {
      border: 0;
      border-radius: 999px;
      color: #667085;
      font-weight: 700;
      padding: 10px 18px;
    }

    .ztna-page .tabs.tabs-clean .nav-tabs .nav-link.active {
      background: #006fff;
      color: #fff;
    }

    .ztna-page .tab-content {
      padding-top: 24px;
    }

    .ztna-principles {
      margin-top: 22px;
      display: grid;
      gap: 12px;
      counter-reset: ztna-principle;
    }

    .ztna-principles .list-group-item {
      counter-increment: ztna-principle;
      display: flex;
      gap: 16px;
      align-items: flex-start;
      padding: 18px 20px;
      border: 1px solid rgba(20, 32, 50, 0.08);
      border-radius: 18px !important;
      background: #fff;
      color: #344054;
      box-shadow: 0 10px 28px rgba(10, 28, 54, 0.06);
      line-height: 1.75;
    }

    .ztna-principles .list-group-item::before {
      content: counter(ztna-principle, decimal-leading-zero);
      flex: 0 0 auto;
      min-width: 38px;
      height: 38px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: #eef6ff;
      color: #006fff;
      font-size: 12px;
      font-weight: 800;
    }

    @media (max-width: 991.98px) {
      .ztna-hero,
      .ztna-section {
        padding: 90px 0 60px;
      }

      .ztna-hero {
        min-height: auto;
      }

      .ztna-visual-card,
      .ztna-image-panel,
      .ztna-compare-wrap,
      .ztna-tabs-card {
        padding: 18px;
        border-radius: 22px;
      }

      .ztna-compare-table {
        min-width: 720px;
      }

      .ztna-compare-wrap {
        overflow-x: auto;
      }
    }

    @media (max-width: 767.98px) {
      .ztna-page .lead {
        font-size: 1rem;
      }
    }
  
  /* ZTNA compare table: disable hover expression */
  .ztna-compare-table.table-hover tbody tr:hover,
  .ztna-compare-table.table-hover tbody tr:hover td {
    background-color: inherit !important;
    box-shadow: none !important;
    transform: none !important;
  }
/* end: ZTNA page custom styles */

/* Edge page custom styles */
/* Edge page custom styles */
    #section0.edge-hero,
    #section1.edge-products {
      position: relative;
      overflow: hidden;
    }

    #section0.edge-hero {
      background-position: center;
      background-size: cover;
    }

    #section0.edge-hero .bg-overlay {
      background:
        radial-gradient(circle at 82% 68%, rgba(37, 99, 235, 0.26), transparent 28%),
        linear-gradient(120deg, rgba(3, 7, 18, 0.82) 0%, rgba(15, 23, 42, 0.64) 48%, rgba(15, 23, 42, 0.22) 100%);
    }

    #section0.edge-hero .container {
      position: relative;
      z-index: 2;
      display: grid;
      grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
      gap: 56px;
      align-items: center;
    }

    .edge-hero-copy {
      max-width: 760px;
    }

    .edge-eyebrow {
      display: inline-flex;
      align-items: center;
      margin-bottom: 18px;
      padding: 6px 14px;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.14);
      border: 1px solid rgba(255, 255, 255, 0.18);
      color: rgba(255, 255, 255, 0.90);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    #section0.edge-hero h1 {
      color: #fff;
      font-size: clamp(38px, 5.5vw, 72px);
      line-height: 1.08;
      font-weight: 700;
      letter-spacing: -0.045em;
      text-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
    }

    .edge-hero-device {
      justify-self: center;
      width: min(420px, 100%);
      padding: 22px;
      border-radius: 34px;
      background: rgba(255, 255, 255, 0.10);
      border: 1px solid rgba(255, 255, 255, 0.18);
      box-shadow: 0 28px 90px rgba(0, 0, 0, 0.28);
      backdrop-filter: blur(10px);
    }

    .edge-hero-device img {
      display: block;
      width: 100%;
      height: auto;
      filter: drop-shadow(0 28px 45px rgba(0, 0, 0, 0.30));
    }

    #section1.edge-products {
      background:
        radial-gradient(circle at top right, rgba(0, 112, 255, 0.08), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%);
      padding-top: 34px;
      padding-bottom: 86px;
    }

    #section1.edge-products.fullscreen {
      min-height: auto;
    }

    .edge-intro-card {
      position: relative;
      display: grid;
      grid-template-columns: 76px 1fr;
      gap: 24px;
      align-items: flex-start;
      width: 100%;
      margin: 0;
      padding: 34px 38px;
      border-radius: 28px;
      background: rgba(255,255,255,.92);
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 24px 70px rgba(10, 28, 54, 0.10);
    }

    .edge-intro-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 76px;
      height: 76px;
      border-radius: 24px;
      background: linear-gradient(135deg, rgba(0,112,255,.12), rgba(56,189,248,.10));
      border: 1px solid rgba(0,112,255,.14);
      color: #006fff;
      font-size: 32px;
      box-shadow: 0 16px 36px rgba(0,112,255,.10);
    }

    .edge-intro-body {
      min-width: 0;
    }

    .edge-intro-card .lead {
      margin-bottom: 12px;
      color: #475467;
      font-size: 17px;
      line-height: 1.9;
    }

    .edge-intro-card .lead:last-child {
      margin-bottom: 0;
    }


    #section1.edge-products .row.m-t-50 {
      margin-top: 74px !important;
    }

    .edge-product-table-card {
      padding: 26px;
      border-radius: 28px;
      background: #fff;
      border: 1px solid rgba(20, 32, 50, 0.08);
      box-shadow: 0 24px 70px rgba(10, 28, 54, 0.10);
    }

    .edge-product-table {
      margin-bottom: 0;
      border-collapse: separate;
      border-spacing: 0;
      overflow: hidden;
      border: 0 !important;
    }

    .edge-product-table th,
    .edge-product-table td {
      vertical-align: middle !important;
      border-color: rgba(20, 32, 50, 0.08) !important;
    }



    .edge-product-table thead th {
      vertical-align: bottom !important;
    }

    .edge-product-table thead .grid-item {
      display: flex;
      align-items: flex-end;
      justify-content: center;
      min-height: 160px;
    }

    .edge-product-table thead .grid-item,

    .edge-product-table thead th {
      background: #fff !important;
    }

    .edge-product-table thead th:first-child {
      background: #f8fafc !important;
    }

    .edge-product-table thead .grid-item-wrap {
      cursor: default;
      padding: 0;
    }

    .edge-product-table thead img {
      width: 120px !important;
      max-width: 100%;
      height: auto;
      filter: none;
    }



    .edge-product-table thead th {
      background: #fff !important;
    }

    .edge-product-table thead th:first-child {
      background: #f8fafc !important;
    }

    .edge-product-table thead .grid-item-wrap {
      margin-bottom: 18px;
    }

    .edge-product-table thead th {
      padding-bottom: 28px !important;
    }

    .edge-product-table thead th {
      color: #101828;
      font-weight: 700;
      border-top: 0 !important;
    }

    .edge-product-table thead th:first-child {
      border-top-left-radius: 20px;
    }

    .edge-product-table thead th:last-child {
      border-top-right-radius: 20px;
    }

    .edge-product-table tbody td:first-child {
      width: 18%;
      color: #334155;
      font-weight: 700;
      background: #f8fafc;
    }

    .edge-product-table tbody td {
      color: #475467;
      font-size: 13px;
      line-height: 1.65;
      background: #fff;
    }

    .edge-product-table.table-hover tbody tr:hover,
    .edge-product-table.table-hover tbody tr:hover td {
      background-color: inherit !important;
    }
.edge-cta {
      position: relative;
      overflow: hidden;
    }

    .edge-cta::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(120deg, rgba(3, 7, 18, 0.76), rgba(15, 23, 42, 0.38));
      pointer-events: none;
    }

    .edge-cta .container {
      position: relative;
      z-index: 1;
    }

    .edge-cta h3,
    .edge-cta p {
      color: #fff;
    }

    .edge-cta p {
      color: rgba(255,255,255,.86);
      line-height: 1.8;
    }

    .edge-cta .btn {
      border-radius: 999px;
      border-color: rgba(255,255,255,.80);
      color: #fff;
      font-weight: 700;
    }

    @media (max-width: 991.98px) {

      #section1.edge-products {
        padding-top: 28px;
      }

      #section1.edge-products .row.m-t-50 {
        margin-top: 44px !important;
      }

      #section0.edge-hero .container {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
      }

      .edge-hero-device {
        max-width: 320px;
      }


      .edge-intro-card {
        grid-template-columns: 1fr;
        gap: 18px;
      }

      .edge-intro-icon {
        width: 64px;
        height: 64px;
        border-radius: 20px;
        font-size: 28px;
      }

      .edge-intro-card,
  
    #section1.edge-products .row.m-t-50 {
      margin-top: 74px !important;
    }

    .edge-product-table-card {
        padding: 24px;
        border-radius: 22px;
      }

  
    #section1.edge-products .row.m-t-50 {
      margin-top: 74px !important;
    }

    .edge-product-table-card {
        overflow-x: auto;
      }

      .edge-product-table {
        min-width: 880px;
      }
    }

    @media (max-width: 767.98px) {
      #section0.edge-hero h1 {
        font-size: 36px;
      }

      .edge-intro-card .lead {
        font-size: 15px;
      }
    }
/* end: Edge page custom styles */

/* UniFi case study wide card layout
   When a case item uses col-md-12, place image on the left and text on the right. */
@media (min-width: 768px) {
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-card {
    display: grid;
    grid-template-columns: minmax(280px, 42%) 1fr;
    align-items: stretch;
  }

  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media {
    height: 100%;
    border-radius: 26px 0 0 26px;
  }

  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media img,
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media .carousel,
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media .carousel .owl-stage-outer,
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media .carousel .owl-stage,
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media .carousel .owl-item,
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media .carousel a {
    height: 100%;
  }

  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media img {
    min-height: 320px;
    object-fit: cover;
  }

  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-body {
    justify-content: center;
    padding: 38px 42px;
  }
}

@media (max-width: 767.98px) {
  .unifi-case-grid > .col-md-12.unifi-case-col .unifi-case-media {
    border-radius: 22px 22px 0 0;
  }
}
/* end: UniFi case study wide card layout */


/* About page custom styles */
.about-page {
  background: #f6f8fb;
}

.about-page #header .header-inner,
.about-page #header #header-wrap {
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(10, 28, 54, 0.06);
}

.about-hero {
  position: relative;
  overflow: hidden;
  min-height: 520px;
  display: flex;
  align-items: center;
}

.about-hero .bg-overlay {
  background:
    radial-gradient(circle at 84% 64%, rgba(0, 112, 255, 0.22), transparent 28%),
    linear-gradient(120deg, rgba(3, 7, 18, 0.80) 0%, rgba(15, 23, 42, 0.58) 48%, rgba(15, 23, 42, 0.24) 100%);
}

.about-hero .container {
  position: relative;
  z-index: 2;
}

.about-hero-copy {
  max-width: 840px;
}

.about-hero h1 {
  color: #fff;
  font-size: clamp(40px, 5vw, 68px);
  line-height: 1.08;
  font-weight: 750;
  letter-spacing: -0.05em;
  text-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
}

.about-hero .hero-eyebrow-light,
.about-section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(0, 112, 255, 0.10);
  color: #006fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.about-hero .hero-eyebrow-light {
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.92);
}

.about-hero .hero-eyebrow-light::before,
.about-section-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 6px rgba(0, 112, 255, 0.12);
}

.about-values-section,
.about-section,
.about-contact-section {
  min-height: auto;
  padding: 92px 0;
}

.about-values-section {
  background:
    radial-gradient(circle at 12% 18%, rgba(0, 112, 255, 0.08), transparent 24%),
    #fff;
}

.about-section.background-grey,
.about-contact-section.background-grey {
  background:
    radial-gradient(circle at 92% 16%, rgba(0, 112, 255, 0.06), transparent 24%),
    linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
}

.about-value-card,
.about-info-card,
.about-team-card,
.about-policy-card,
.about-contact-card,
.about-security-item {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(20, 32, 50, 0.08);
  box-shadow: 0 20px 56px rgba(10, 28, 54, 0.09);
}

.about-value-card {
  height: 100%;
  padding: 34px 36px;
  border-radius: 26px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.about-value-card:hover {
  transform: translateY(-5px);
  border-color: rgba(0, 112, 255, 0.20);
  box-shadow: 0 28px 72px rgba(10, 28, 54, 0.13);
}

.about-value-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 22px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(0,112,255,.12), rgba(56,189,248,.10));
  border: 1px solid rgba(0,112,255,.14);
  color: #006fff;
  font-size: 28px;
}

.about-value-card h3 {
  color: #101828;
  font-size: 24px;
  font-weight: 750;
  letter-spacing: -0.03em;
  margin-bottom: 14px;
}

.about-value-card p,
.about-policy-card p,
.about-security-item p {
  color: #596579;
  line-height: 1.9;
  margin-bottom: 0;
}

.about-value-card p + p,
.about-policy-card p + p {
  margin-top: 16px;
}


.about-lead {
  color: #596579;
  font-size: 1.04rem;
  line-height: 1.95;
}

.about-info-card {
  padding: 26px;
  border-radius: 28px;
}

.about-info-table {
  margin-bottom: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.about-info-table th {
  padding: 18px 20px;
  border: 0 !important;
  border-radius: 18px 18px 0 0;
  background: #101828;
  color: #fff;
  font-size: 18px;
  font-weight: 750;
}

.about-info-table td {
  padding: 18px 20px;
  border-color: rgba(20, 32, 50, 0.08) !important;
  color: #475467;
  line-height: 1.75;
}

.about-info-table tbody td:first-child {
  width: 26%;
  color: #101828;
  font-weight: 750;
  background: #f8fafc;
}

.about-team-block {
  margin-top: 82px;
}

.about-team-grid {
  margin-top: 32px;
}

.about-team-grid > [class*="col-"] {
  margin-bottom: 28px;
}

.about-team-card {
  height: 100%;
  padding: 26px 22px;
  border-radius: 24px;
  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.about-team-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 112, 255, 0.18);
  box-shadow: 0 28px 72px rgba(10, 28, 54, 0.13);
}

.about-team-card img {
  width: 112px;
  height: 112px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 18px;
  box-shadow: 0 14px 32px rgba(10, 28, 54, 0.14);
}

.about-team-card h4 {
  color: #101828;
  font-size: 18px;
  font-weight: 750;
  margin-bottom: 6px;
}

.about-team-card span {
  display: block;
  color: #667085;
  font-size: 13px;
  line-height: 1.55;
}

.about-team-card sup {
  color: #98a2b3;
  font-size: 10px;
  margin-left: 3px;
}

.about-team-card-wide img {
  border-radius: 26px;
  width: 132px;
}

.about-policy-card {
  padding: 30px 34px;
  border-radius: 26px;
}

.about-security-list {
  display: grid;
  gap: 14px;
}

.about-security-item {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 20px 22px;
  border-radius: 20px;
}

.about-security-item span {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #eef6ff;
  color: #006fff;
  font-size: 12px;
  font-weight: 800;
}

.about-contact-card {
  max-width: 1040px;
  margin: 0 auto;
  padding: 42px;
  border-radius: 30px;
}

.about-contact-card .form-control {
  border-radius: 12px;
}

.about-contact-card .btn {
  border-radius: 999px;
  padding-left: 26px;
  padding-right: 26px;
  font-weight: 700;
}

@media (max-width: 991.98px) {
  .about-hero {
    min-height: 430px;
  }

  .about-values-section,
  .about-section,
  .about-contact-section {
    padding: 68px 0;
  }

  .about-value-card {
    margin-bottom: 24px;
  }

  .about-info-card,
  .about-contact-card {
    margin-top: 28px;
    padding: 26px;
    border-radius: 24px;
  }
}

@media (max-width: 767.98px) {
  .about-hero h1 {
    font-size: 36px;
  }

  .about-info-table td,
  .about-info-table th {
    display: block;
    width: 100% !important;
  }

  .about-info-table tbody td:first-child {
    padding-bottom: 6px;
  }

  .about-info-table tbody td + td {
    padding-top: 6px;
  }

  .about-security-item {
    gap: 14px;
    padding: 18px;
  }
}
/* end: About page custom styles */
