/* =========================================
   LEGALHUB REGISTRY LAYOUT (v3, accessible)
   Single source for desktop + mobile
   ========================================= */

   *,
   *::before,
   *::after {
       box-sizing: border-box;
   }
   
   html,
   body {
       margin: 0;
       padding: 0;
       background: #ffffff;
   }
   
   /* Wrapper so footer can sit at the bottom */
   .lh-shell {
       min-height: 100vh;
       display: flex;
       flex-direction: column;
   }
   
   /* Main content area (header/footer use their own CSS) */
   .lh-main {
       flex: 1;
       max-width: 1200px;
       margin: 0 auto;
       padding: 18px 24px 36px;
       color: #111827;
       background: #ffffff; /* no grey blanket */
   }
   
   /* -----------------------------------------
      HERO / PAGE TITLE
      ----------------------------------------- */
   
   .lh-hero {
       margin-top: 6px;
       margin-bottom: 14px;
   }
   
   .lh-page-title {
       margin: 0 0 4px;
       font-size: 28px;
       font-weight: 600;
       letter-spacing: 0.01em;
       color: #111827;
   }
   
   .lh-page-lead {
       margin: 0;
       max-width: 720px;
       font-size: 14px;
       line-height: 1.7;
       color: #4b5563;
   }
   
   /* -----------------------------------------
      GRID LAYOUT (DESKTOP)
      Left: intro + policies
      Right: most recent updates
      ----------------------------------------- */
   
   .lh-main-layout {
       display: grid;
       grid-template-columns: minmax(0, 2.25fr) minmax(260px, 0.95fr);
       column-gap: 26px;
       align-items: flex-start;
   }
   
   /* Left column stack */
   .lh-main-col {
       display: flex;
       flex-direction: column;
       gap: 14px;
   }
   
   /* Right column: sticky on large screens */
   .lh-updates-col {
       align-self: flex-start;
       position: sticky;
       top: 84px;
   }
   
   /* -----------------------------------------
      GENERIC CARDS
      ----------------------------------------- */
   
   .lh-card {
       background: #ffffff;
       border-radius: 14px;
       padding: 12px 14px;
       border: 1px solid #e5e7eb;
       box-shadow: 0 10px 26px rgba(15, 23, 42, 0.03);
   }
   
   .lh-card--highlight {
       background: #fff7e6;
       border-color: #fed7aa;
   }
   
   .lh-section-title {
       margin: 0 0 4px;
       font-size: 16px;
       font-weight: 600;
       color: #111827;
   }
   
   .lh-section-body {
       margin: 0;
       font-size: 13px;
       line-height: 1.7;
       color: #4b5563;
   }
   
   /* -----------------------------------------
      REGISTERED POLICIES LIST
      ----------------------------------------- */
   
   .lh-policies-wrap {
       margin-top: 2px;
   }
   
   .lh-policies-heading {
       margin: 0 0 8px;
       font-size: 18px;
       font-weight: 600;
       color: #111827;
   }
   
   .lh-policy-list {
       list-style: none;
       margin: 0;
       padding: 0;
       display: flex;
       flex-direction: column;
       gap: 8px;
   }
   
   .lh-policy-card {
       background: #ffffff;
       border-radius: 14px;
       padding: 9px 11px;
       border: 1px solid #e5e7eb;
       box-shadow: 0 8px 20px rgba(15, 23, 42, 0.03);
       display: grid;
       grid-template-columns: auto 1fr auto;
       gap: 4px 10px;
       align-items: center;
   }
   
   .lh-policy-code {
       font-size: 10px;
       font-weight: 600;
       padding: 3px 7px;
       border-radius: 999px;
       background: #eff6ff;
       color: #1d4ed8;
   }
   
   .lh-policy-title {
       margin: 0;
       font-size: 14px;
       font-weight: 500;
       color: #111827;
   }
   
   .lh-policy-summary {
       margin: 0;
       font-size: 11px;
       color: #6b7280;
   }
   
   .lh-policy-meta {
       display: flex;
       flex-direction: column;
       align-items: flex-end;
       gap: 2px;
   }
   
   .lh-status-pill {
       font-size: 9px;
       font-weight: 600;
       padding: 3px 7px;
       border-radius: 999px;
       background: #ecfdf5;
       color: #166534;
       border: 1px solid rgba(22, 163, 74, 0.18);
   }
   
   .lh-policy-version {
       font-size: 9px;
       color: #9ca3af;
   }
   
   .lh-policy-chevron {
       width: 16px;
       height: 16px;
       border-radius: 999px;
       border: 1px solid #d1d5db;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 10px;
       color: #6b7280;
       margin-top: 2px;
   }
   
   /* Details row when expanded (JS controls visibility) */
   .lh-policy-details {
       grid-column: 1 / -1;
       margin-top: 5px;
       padding-top: 6px;
       border-top: 1px solid #eef2f7;
       font-size: 11px;
       color: #4b5563;
   }
   
   /* -----------------------------------------
      MOST RECENT UPDATES PANEL
      ----------------------------------------- */
   
   .lh-updates-panel {
       background: #ffffff;
       border-radius: 16px;
       padding: 12px 14px 8px;
       border: 1px solid #e5e7eb;
       box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
   }
   
   .lh-updates-heading-row {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 10px;
       margin-bottom: 4px;
   }
   
   .lh-updates-heading {
       margin: 0;
       font-size: 15px;
       font-weight: 600;
       color: #111827;
   }
   
   .lh-updates-badge {
       font-size: 9px;
       padding: 3px 7px;
       border-radius: 999px;
       background: #ecfdf5;
       color: #16a34a;
       border: 1px solid rgba(22, 163, 74, 0.25);
       white-space: nowrap;
   }
   
   .lh-updates-sub {
       margin: 0 0 5px;
       font-size: 10px;
       color: #9ca3af;
   }
   
   .lh-updates-list {
       list-style: none;
       margin: 0 0 2px;
       padding: 0;
       display: flex;
       flex-direction: column;
       gap: 6px;
   }
   
   .lh-updates-item {
       display: grid;
       grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.1fr);
       gap: 2px 8px;
       font-size: 11px;
       align-items: baseline;
   }
   
   .lh-updates-label {
       font-weight: 500;
       color: #111827;
   }
   
   .lh-updates-meta {
       text-align: right;
       color: #6b7280;
       font-size: 10px;
       white-space: nowrap;
   }
   
   .lh-updates-note {
       margin: 3px 0 0;
       font-size: 9px;
       color: #9ca3af;
   }
   
   /* =========================================
      RESPONSIVE
      ========================================= */
   
   /* ---------- TABLET ---------- */
   @media (max-width: 1024px) {
       .lh-main {
           padding: 14px 16px 26px;
           max-width: 100%;
       }
   
       .lh-main-layout {
           grid-template-columns: 1fr;
           row-gap: 14px;
       }
   
       /* On tablet & below:
          show updates immediately after hero (before the rest)
       */
       .lh-updates-col {
           position: static;
           order: -1;
           width: 100%;
           margin: 2px 0 2px;
       }
   
       .lh-policy-card {
           grid-template-columns: auto 1fr auto;
       }
   }
   
   /* ---------- MOBILE ---------- */
   @media (max-width: 640px) {
       .lh-main {
           padding: 10px 10px 20px;
       }
   
       .lh-hero {
           margin-top: 4px;
           margin-bottom: 8px;
       }
   
       .lh-page-title {
           font-size: 22px;
       }
   
       .lh-page-lead {
           font-size: 12px;
           line-height: 1.6;
       }
   
       .lh-main-layout {
           row-gap: 10px;
       }
   
       .lh-updates-col {
           order: -1;          /* HERO → UPDATES → REST */
           margin-bottom: 4px;
       }
   
       .lh-updates-panel {
           padding: 9px 10px 7px;
           border-radius: 12px;
           box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
       }
   
       .lh-updates-heading {
           font-size: 14px;
       }
   
       .lh-updates-item {
           grid-template-columns: 1fr;
           align-items: flex-start;
       }
   
       .lh-updates-meta {
           text-align: left;
           margin-top: -1px;
           font-size: 9px;
       }
   
       .lh-policies-heading {
           font-size: 16px;
           margin-top: 4px;
       }
   
       .lh-policy-card {
           grid-template-columns: 1fr;
           align-items: flex-start;
           padding: 8px 9px;
           gap: 3px;
           border-radius: 12px;
       }
   
       .lh-policy-meta {
           flex-direction: row;
           align-items: center;
           gap: 6px;
           margin-top: 1px;
       }
   
       .lh-policy-chevron {
           margin-top: 0;
       }
   
       .lh-policy-details {
           font-size: 10px;
       }
   }