/* ── Hide Tabs on Landing Page ─────────────────────────── */
    .fern-header-tabs {
      display: none !important;
    }

    /* ── Reset ALL Fern content wrappers ──────────────────── */
    .fern-layout-docs-page,
    .fern-layout-docs-page > *,
    .fern-layout-content,
    .fern-layout-docs-content,
    .fern-page-wrapper {
      max-width: 100% !important;
      width: 100% !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
      margin-left: 0 !important;
      margin-right: 0 !important;
    }


    /* ── Inner wrapper (constrains content width) ─────────── */
    .plex-inner {
      max-width: 1140px;
      margin: 0 auto;
      padding: 0 48px;
      width: 100%;
      box-sizing: border-box;
    }
    @media (max-width: 768px) {
      .plex-inner {
        padding: 0 24px;
      }
    }

    /* ── Hero (full-bleed gradient) ───────────────────────── */
    .plex-hero-wrap {
      width: 100%;
      position: relative;
      padding: 80px 0 0;
      margin-bottom: 40px;
    }
    .plex-hero-wrap::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 87%;
      background:
        repeating-linear-gradient(0deg, rgba(255,255,255,0.03) 0px, rgba(255,255,255,0.03) 1px, transparent 1px, transparent 48px),
        repeating-linear-gradient(90deg, rgba(255,255,255,0.03) 0px, rgba(255,255,255,0.03) 1px, transparent 1px, transparent 48px),
        radial-gradient(ellipse 70% 80% at 85% 30%, rgba(228,0,43,0.18) 0%, transparent 55%),
        radial-gradient(ellipse 50% 60% at 70% 0%, rgba(228,0,43,0.10) 0%, transparent 50%),
        radial-gradient(ellipse 60% 60% at 10% 90%, rgba(228,0,43,0.12) 0%, transparent 50%),
        radial-gradient(ellipse 80% 50% at 50% 100%, rgba(200,16,46,0.06) 0%, transparent 40%),
        #111113;
      z-index: 0;
    }
    :is(.light) .plex-hero-wrap::before {
      background:
        repeating-linear-gradient(0deg, rgba(0,0,0,0.04) 0px, rgba(0,0,0,0.04) 1px, transparent 1px, transparent 48px),
        repeating-linear-gradient(90deg, rgba(0,0,0,0.04) 0px, rgba(0,0,0,0.04) 1px, transparent 1px, transparent 48px),
        radial-gradient(ellipse 70% 80% at 85% 30%, rgba(228,0,43,0.10) 0%, transparent 55%),
        radial-gradient(ellipse 50% 60% at 70% 0%, rgba(228,0,43,0.06) 0%, transparent 50%),
        radial-gradient(ellipse 60% 60% at 10% 90%, rgba(228,0,43,0.07) 0%, transparent 50%),
        radial-gradient(ellipse 80% 50% at 50% 100%, rgba(200,16,46,0.03) 0%, transparent 40%),
        #fff;
    }
    .plex-hero-wrap > * {
      position: relative;
      z-index: 1;
    }
    @media (max-width: 960px) {
      .plex-hero-wrap {
        padding: 48px 0 0;
      }
    }
    .plex-hero__actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }
    .plex-hero__actions--left {
      justify-content: flex-start;
    }
    .plex-hero__actions a {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 28px;
      border-radius: 8px;
      font-size: 14px;
      font-weight: 600;
      text-decoration: none;
      transition: all 0.15s ease;
    }
    .plex-hero__actions a.primary {
      background: #E4002B;
      color: #fff;
    }
    .plex-hero__actions a.primary:hover {
      background: #c7002a;
    }
    :is(.light) .plex-hero__actions a.primary {
      background: #C8102E;
    }
    :is(.light) .plex-hero__actions a.primary:hover {
      background: #a80d26;
    }
    .plex-hero__actions a.secondary {
      background: rgba(255,255,255,0.06);
      color: #ccc;
      border: 1px solid rgba(255,255,255,0.1);
    }
    .plex-hero__actions a.secondary:hover {
      background: rgba(255,255,255,0.1);
      border-color: rgba(255,255,255,0.18);
    }
    :is(.light) .plex-hero__actions a.secondary {
      background: #fff;
      color: #333;
      border: 1px solid #d4d4d4;
    }
    :is(.light) .plex-hero__actions a.secondary:hover {
      background: #f9f9f9;
      border-color: #bbb;
    }

    /* ── Featured Section (side-by-side layout) ──────────── */
    .plex-featured-section {
      display: grid;
      grid-template-columns: 1fr 1.4fr;
      gap: 48px;
      align-items: start;
    }
    @media (max-width: 860px) {
      .plex-featured-section {
        grid-template-columns: 1fr;
        gap: 32px;
      }
    }
    .plex-featured-left {
      align-self: start;
      padding-top: 16px;
    }
    .plex-featured-eyebrow {
      text-transform: uppercase;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.1em;
      color: #E4002B;
      margin-bottom: 14px;
    }
    :is(.light) .plex-featured-eyebrow {
      color: #C8102E;
    }
    .plex-featured-heading {
      font-size: 2rem;
      font-weight: 800;
      letter-spacing: -0.02em;
      line-height: 1.15;
      margin: 0 0 16px;
      background: linear-gradient(204deg, #fff -20.65%, #f7f8ff 47.15%, #E4002B 132.52%);
      -webkit-background-clip: text;
      -webkit-font-smoothing: antialiased;
      -webkit-text-fill-color: transparent;
    }
    :is(.light) .plex-featured-heading {
      background: linear-gradient(257.01deg, #000000 0%, #000000 47.15%, #C8102E 100%);
      -webkit-background-clip: text;
      -webkit-font-smoothing: antialiased;
      -webkit-text-fill-color: transparent;
    }
    @media (max-width: 960px) {
      .plex-featured-heading {
        font-size: 1.5rem;
      }
    }
    .plex-featured-desc {
      font-size: 0.95rem;
      line-height: 1.6;
      color: #8B8B8B;
      margin: 0 0 24px;
    }
    :is(.light) .plex-featured-desc {
      color: #5A5A5A;
    }
.plex-featured-cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
    }
    @media (max-width: 640px) {
      .plex-featured-cards {
        grid-template-columns: 1fr;
      }
    }
    .plex-feat-card {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 28px;
      border-radius: 14px;
      min-height: 180px;
      text-decoration: none;
      overflow: hidden;
      border: 1px solid #1e1e24;
      background: #15161a;
      transition: transform 0.2s ease, border-color 0.2s ease;
    }
    .plex-feat-card:hover {
      transform: translateY(-3px);
      border-color: rgba(228,0,43,0.25);
    }
    :is(.light) .plex-feat-card {
      background: #fafafa;
      border-color: #e8e8e8;
    }
    :is(.light) .plex-feat-card:hover {
      border-color: rgba(200,16,46,0.2);
    }
    .plex-feat-card .card-ico {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
      font-size: 20px;
      background: rgba(228,0,43,0.1);
      color: #E4002B;
      transition: background 0.2s;
    }
    :is(.light) .plex-feat-card .card-ico {
      background: rgba(200,16,46,0.08);
      color: #C8102E;
    }
    .plex-feat-card:hover .card-ico {
      background: rgba(228,0,43,0.16);
    }
    :is(.light) .plex-feat-card:hover .card-ico {
      background: rgba(200,16,46,0.12);
    }
    .plex-feat-card .card-label {
      font-size: 16px;
      font-weight: 700;
      color: #EDEDED;
    }
    :is(.light) .plex-feat-card .card-label {
      color: #111;
    }
    .plex-feat-card .card-desc {
      font-size: 13px;
      color: #777;
      margin-top: 6px;
      line-height: 1.45;
    }
    :is(.light) .plex-feat-card .card-desc {
      color: #666;
    }
    .plex-feat-card .card-arrow {
      position: absolute;
      top: 24px;
      right: 24px;
      font-size: 14px;
      color: #444;
      transition: transform 0.2s, color 0.2s;
    }
    .plex-feat-card:hover .card-arrow {
      transform: translate(2px, -2px);
      color: #E4002B;
    }

    /* ── Divider ──────────────────────────────────────────── */
    .plex-divider {
      height: 1px;
      background: #1e1e24;
      margin: 0 0 48px;
    }
    :is(.light) .plex-divider {
      background: #e8e8e8;
    }

    /* ── Section Title ────────────────────────────────────── */
    .plex-section-title {
      margin: 0 0 28px;
    }
    .plex-section-title h2 {
      font-size: 1.65rem;
      font-weight: 700;
      margin: 0 0 6px;
      letter-spacing: -0.02em;
    }
    .plex-section-title p {
      color: #8B8B8B;
      font-size: 0.95rem;
      margin: 0;
      line-height: 1.5;
    }
    :is(.light) .plex-section-title p {
      color: #5A5A5A;
    }

    /* ── API List ─────────────────────────────────────────── */
    .plex-api-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      margin-bottom: 56px;
    }
    @media (max-width: 860px) {
      .plex-api-list {
        grid-template-columns: repeat(2, 1fr);
      }
    }
    @media (max-width: 540px) {
      .plex-api-list {
        grid-template-columns: 1fr;
      }
    }
    .plex-api-link {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 13px 16px;
      border-radius: 10px;
      border: 1px solid #1e1e24;
      text-decoration: none;
      color: #ccc;
      font-size: 14px;
      font-weight: 500;
      transition: border-color 0.15s, background 0.15s;
    }
    .plex-api-link:hover {
      border-color: #444;
      background: rgba(255,255,255,0.04);
    }
    :is(.light) .plex-api-link {
      border-color: #e8e8e8;
      color: #333;
    }
    :is(.light) .plex-api-link:hover {
      border-color: #ccc;
      background: rgba(0,0,0,0.015);
    }
    .plex-api-link .ico {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      font-size: 14px;
    }
    .plex-api-link .ico.red,
    .plex-api-link .ico.blue,
    .plex-api-link .ico.green,
    .plex-api-link .ico.purple,
    .plex-api-link .ico.orange,
    .plex-api-link .ico.teal,
    .plex-api-link .ico.pink   { background: rgba(228,0,43,0.25); color: #ff6680; }
    .plex-api-link .arrow {
      margin-left: auto;
      color: #444;
      font-size: 13px;
      transition: transform 0.15s, color 0.15s;
    }
    .plex-api-link:hover .arrow {
      transform: translateX(2px);
      color: #E4002B;
    }

    /* ── Start Here (Fern Cards) ──────────────────────────── */
    div.plex-cards {
      margin-bottom: 56px;
    }
    div.plex-cards .fern-card {
      background-color: #15161a;
      border: 1px solid #1e1e24;
    }
    div.plex-cards .fern-card:hover {
      border-color: #444;
    }
    :is(.light) div.plex-cards .fern-card {
      background-color: #fafafa;
      border: 1px solid #e8e8e8;
    }
    :is(.light) div.plex-cards .fern-card:hover {
      border-color: #ccc;
    }

    .card-icon {
      background: linear-gradient(135deg, #E4002B, #ff4d6a);
      padding: 8px;
      border-radius: 8px;
      width: 44px;
      height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .card-icon > .fern-mdx-icon {
      color: white;
    }

    /* ── Value Props ──────────────────────────────────────── */
    .plex-value-cards {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-bottom: 56px;
    }
    @media (max-width: 768px) {
      .plex-value-cards {
        grid-template-columns: 1fr;
      }
    }
    .plex-value-card {
      padding: 28px;
      border-radius: 12px;
      border: 1px solid #1e1e24;
      background: #15161a;
      text-align: center;
    }
    :is(.light) .plex-value-card {
      background: #fafafa;
      border-color: #e8e8e8;
    }
    .plex-value-card .v-icon {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 16px;
      font-size: 20px;
      background: rgba(228,0,43,0.25);
      color: #ff6680;
    }
    :is(.light) .plex-value-card .v-icon {
      background: rgba(200,16,46,0.08);
      color: #C8102E;
    }
    .plex-value-card .v-title {
      font-size: 15px;
      font-weight: 700;
      margin: 0 0 8px;
    }
    .plex-value-card p {
      font-size: 13px;
      color: #777;
      margin: 0;
      line-height: 1.5;
    }
    :is(.light) .plex-value-card p {
      color: #666;
    }

    /* ── Resources ────────────────────────────────────────── */
    .plex-resources {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      margin-bottom: 80px;
    }
    @media (max-width: 640px) {
      .plex-resources {
        grid-template-columns: 1fr;
      }
    }
    .plex-resource {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      padding: 20px;
      border-radius: 10px;
      border: 1px solid #1e1e24;
      text-decoration: none;
      color: inherit;
      transition: transform 0.2s ease, border-color 0.2s ease;
    }
    .plex-resource:hover {
      transform: translateY(-3px);
      border-color: rgba(228,0,43,0.35);
    }
    :is(.light) .plex-resource {
      border-color: #e8e8e8;
    }
    :is(.light) .plex-resource:hover {
      transform: translateY(-3px);
      border-color: rgba(200,16,46,0.2);
    }
    .plex-resource .r-icon {
      width: 40px;
      height: 40px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 17px;
      flex-shrink: 0;
      background: rgba(228,0,43,0.25);
      color: #ff6680;
      transition: background 0.2s;
    }
    :is(.light) .plex-resource .r-icon {
      background: rgba(200,16,46,0.06);
      color: #C8102E;
    }
    .plex-resource:hover .r-icon {
      background: rgba(228,0,43,0.32);
    }
    :is(.light) .plex-resource:hover .r-icon {
      background: rgba(200,16,46,0.12);
    }
    .plex-resource .r-body .r-title {
      font-size: 14px;
      font-weight: 600;
      margin: 0 0 4px;
    }
    .plex-resource .r-body p {
      font-size: 13px;
      color: #777;
      margin: 0;
      line-height: 1.45;
    }
    :is(.light) .plex-resource .r-body p {
      color: #666;
    }
    .plex-resource .r-arrow {
      margin-left: auto;
      color: #444;
      font-size: 13px;
      flex-shrink: 0;
      margin-top: 2px;
    }
    .plex-resource:hover .r-arrow {
      color: #E4002B;
    }
astro-island,astro-slot,astro-static-slot{display:contents}
#fern-toc,#fern-sidebar[data-state="sticky"],#fern-sidebar[data-state="fixed"],#fern-sidebar-spacer{visibility:hidden;width:0;overflow:hidden;display:none;}.fern-main:has(>#fern-sidebar[data-viewport="desktop"][data-state="sticky"]){min-height:0!important;}