/* LegalScapes site chrome: header, nav (desktop + mobile), footer, mobile CTA bar.
   Single source of truth for chrome styling — loaded by every page via
   <link rel="stylesheet" href="/css/site-chrome.css" />. Do not duplicate
   these rules in page <style> blocks; edit this file instead.
   Extracted from the canonical home page (index.html), 2026-08-31. */

/* Self-hosted global typefaces. Keep font-family names aligned with existing page tokens. */
@font-face {
  font-family: "Sora";
  src: url("/fonts/sora-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

.site-header {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 1000;
      background: var(--dark-900);
      border-bottom: 1px solid rgba(255,255,255,0.06);
      transition: background var(--transition), box-shadow var(--transition);
    }
.site-header.scrolled {
      background: rgba(15,23,42,0.97);
      box-shadow: 0 2px 20px rgba(0,0,0,0.35);
    }
.nav-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 76px;
    }
.nav-logo {
      display: flex;
      align-items: center;
      text-decoration: none;
      flex-shrink: 0;
    }
.nav-logo img {
      height: 42px;
      width: auto; aspect-ratio: 2048 / 468; flex-shrink: 0; }
.nav-links {
      display: flex;
      align-items: center;
      gap: 0.15rem;
    }
.nav-links a {
      padding: 0.45rem 0.9rem;
      font-family: var(--body-font);
      font-size: 0.88rem;
      font-weight: 600;
      color: rgba(241,245,249,0.72);
      border-radius: 6px;
      transition: color var(--transition), background var(--transition);
    }
.nav-links a:hover {
      color: var(--white);
      background: rgba(255,255,255,0.07);
    }
.nav-links a.nav-contact-btn,
    .nav-links a.nav-contact-btn:hover {
      background: var(--green);
      color: var(--white);
      border: 2px solid var(--green);
      border-radius: var(--radius);
      font-weight: 700;
      padding: 0.55rem 1.3rem;
      margin-left: 0.6rem;
      letter-spacing: 0.01em;
    }
.nav-links a.nav-contact-btn:hover {
      background: var(--green-dark);
      border-color: var(--green-dark);
      transform: translateY(-1px);
      box-shadow: 0 6px 20px rgba(118,162,64,0.35);
    }
.nav-hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 6px;
      background: none;
      border: none;
    }
.nav-hamburger span {
      display: block;
      width: 24px;
      height: 2px;
      background: var(--white);
      border-radius: 2px;
      transition: all var(--transition);
    }
.site-footer {
      background: var(--dark-900);
      padding: 4.5rem 0 0;
      border-top: 1px solid rgba(255,255,255,0.06);
    }
.footer-grid {
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 3rem;
      padding-bottom: 3rem;
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }
.footer-brand p {
      font-family: var(--body-font);
      font-size: 0.875rem;
      color: rgba(241,245,249,0.48);
      line-height: 1.78;
      margin-top: 1.1rem;
      max-width: 280px;
    }
.footer-logo img { height: 38px; width: auto; aspect-ratio: 2048 / 468; flex-shrink: 0; }
.footer-social {
      display: flex;
      gap: 0.65rem;
      margin-top: 1.5rem;
    }
.footer-social a {
      width: 36px; height: 36px;
      background: rgba(255,255,255,0.07);
      border: 1px solid rgba(255,255,255,0.10);
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(241,245,249,0.52);
      transition: all var(--transition);
    }
.footer-social a:hover {
      background: var(--green);
      border-color: var(--green);
      color: var(--white);
    }
.footer-social a svg { width: 16px; height: 16px; }
.footer-col h4 {
      font-family: var(--body-font);
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: rgba(241,245,249,0.38);
      margin-bottom: 1.25rem;
    }
.footer-col ul { display: flex; flex-direction: column; gap: 0.6rem; }
.footer-col ul a {
      font-family: var(--body-font);
      font-size: 0.875rem;
      color: rgba(241,245,249,0.58);
      transition: color var(--transition);
    }
.footer-col ul a:hover { color: var(--white); }
.footer-bottom {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 1.5rem 0;
      font-family: var(--body-font);
      font-size: 0.78rem;
      color: rgba(241,245,249,0.32);
      flex-wrap: wrap;
      gap: 0.75rem;
    }
.footer-bottom a {
      color: rgba(241,245,249,0.32);
      transition: color var(--transition);
    }
.footer-bottom a:hover { color: rgba(241,245,249,0.62); }
.footer-bottom-links { display: flex; gap: 1.5rem; }
.mobile-nav {
      display: none;
      position: fixed;
      top: 76px; left: 0; right: 0; bottom: 0;
      background: var(--dark-900);
      z-index: 999;
      padding: 2rem 1.5rem;
      overflow-y: auto;
      flex-direction: column;
      gap: 0.5rem;
    }
.mobile-nav.open { display: flex; }
.mobile-nav a {
      display: block;
      padding: 0.85rem 1rem;
      font-family: var(--body-font);
      font-size: 1.05rem;
      font-weight: 600;
      color: rgba(241,245,249,0.72);
      border-radius: 8px;
      transition: all var(--transition);
    }
.mobile-nav a:hover {
      color: var(--white);
      background: rgba(255,255,255,0.07);
    }
.mobile-nav .btn { margin-top: 1rem; width: 100%; justify-content: center; }
@media (max-width: 900px) {
.footer-grid { grid-template-columns: 1fr 1fr; }}
@media (max-width: 960px) {
.nav-links { display: none; }
.nav-hamburger { display: flex; }}
@media (max-width: 768px) {
.footer-grid { grid-template-columns: 1fr; }}
.nav-dropdown{position:relative}
.nav-dropdown-toggle{display:flex;align-items:center;gap:0.3rem;padding:0.45rem 0.9rem;font-family:var(--body-font);font-size:0.88rem;font-weight:600;color:rgba(241,245,249,0.72);border-radius:6px;cursor:pointer;transition:color var(--transition),background var(--transition);background:none;border:none;white-space:nowrap}
.nav-dropdown-toggle:hover,.nav-dropdown.open .nav-dropdown-toggle{color:var(--white);background:rgba(255,255,255,0.07)}
.nav-dropdown-toggle svg{width:14px;height:14px;transition:transform var(--transition);flex-shrink:0}
.nav-dropdown.open .nav-dropdown-toggle svg{transform:rotate(180deg)}
.nav-dropdown-menu{display:none;position:absolute;top:calc(100% + 2px);left:50%;transform:translateX(-50%);background:var(--dark-800);border:1px solid rgba(255,255,255,0.09);border-radius:var(--radius-lg);padding:0.65rem;min-width:260px;box-shadow:0 16px 40px rgba(0,0,0,0.45);z-index:200}
.nav-dropdown-menu::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px;background:transparent}
.nav-dropdown.open .nav-dropdown-menu{display:block}
.nav-dropdown-menu a{display:flex;align-items:center;gap:0.65rem;padding:0.65rem 0.85rem;border-radius:8px;font-family:var(--body-font);font-size:0.85rem;font-weight:600;color:rgba(241,245,249,0.65);transition:all var(--transition);white-space:nowrap}
.nav-dropdown-menu a:hover{color:var(--white);background:rgba(255,255,255,0.07)}
.nav-dropdown-menu a .dd-icon{width:28px;height:28px;background:rgba(118,162,64,0.12);border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nav-dropdown-menu a .dd-icon svg{width:14px;height:14px;color:var(--green)}
.nav-dropdown-divider{height:1px;background:rgba(255,255,255,0.07);margin:0.4rem 0}
.nav-dropdown-menu .dd-all{font-weight:700;color:var(--green-light) !important;border-top:1px solid rgba(255,255,255,0.07);margin-top:0.4rem;padding-top:0.85rem}
.mobile-nav-section-label{font-family:var(--body-font);font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.12em;color:rgba(241,245,249,0.28);padding:1rem 1rem 0.35rem}
.nav-dropdown { position: relative; }
.nav-dropdown-toggle { display: flex; align-items: center; gap: 0.3rem; padding: 0.45rem 0.9rem; font-family: var(--body-font); font-size: 0.88rem; font-weight: 600; color: rgba(241,245,249,0.72); border-radius: 6px; cursor: pointer; transition: color var(--transition), background var(--transition); background: none; border: none; white-space: nowrap; }
.nav-dropdown:hover .nav-dropdown-toggle, .nav-dropdown-toggle:focus { color: var(--white); background: rgba(255,255,255,0.07); outline: none; }
.nav-dropdown-toggle svg { width: 14px; height: 14px; transition: transform var(--transition); flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-toggle svg { transform: rotate(180deg); }
.nav-dropdown-menu { display: none; position: absolute; top: calc(100% + 2px); left: 50%; transform: translateX(-50%); background: var(--dark-800); border: 1px solid rgba(255,255,255,0.09); border-radius: var(--radius-lg); padding: 0.65rem; min-width: 260px; box-shadow: 0 16px 40px rgba(0,0,0,0.45); z-index: 200; }
.nav-dropdown:hover .nav-dropdown-menu { display: block; }
.nav-dropdown-menu::before { content: ""; position: absolute; top: -10px; left: 0; right: 0; height: 10px; }
.nav-dropdown-menu a { display: flex; align-items: center; gap: 0.65rem; padding: 0.65rem 0.85rem; border-radius: 8px; font-family: var(--body-font); font-size: 0.85rem; font-weight: 600; color: rgba(241,245,249,0.65); transition: all var(--transition); white-space: nowrap; }
.nav-dropdown-menu a:hover { color: var(--white); background: rgba(255,255,255,0.07); }
.nav-dropdown-menu a .dd-icon { width: 28px; height: 28px; background: rgba(118,162,64,0.12); border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nav-dropdown-menu a .dd-icon svg { width: 14px; height: 14px; color: var(--green); }
.nav-dropdown-divider { height: 1px; background: rgba(255,255,255,0.07); margin: 0.4rem 0; }
.nav-dropdown-menu .dd-all { font-weight: 700; color: var(--green-light) !important; border-top: 1px solid rgba(255,255,255,0.07); margin-top: 0.4rem; padding-top: 0.85rem; }
.mobile-cta-bar {
      display: none;
    }
@media (max-width: 767px) {
.mobile-cta-bar {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background: #fff;
        border-top: 1px solid rgba(0,0,0,0.10);
        padding: 0.85rem 1.25rem;
        box-shadow: 0 -4px 24px rgba(0,0,0,0.10);
        transform: translateY(110%);
        transition: transform 0.35s ease;
      }
.mobile-cta-bar.visible {
        transform: translateY(0);
      }
.mobile-cta-bar a {
        display: block;
        width: 100%;
        text-align: center;
        background: #76a240;
        color: #fff;
        font-family: "Sora", sans-serif;
        font-weight: 700;
        font-size: 1rem;
        padding: 0.9rem 1.5rem;
        border-radius: 10px;
        text-decoration: none;
        letter-spacing: 0.01em;
      }}