/* Inovamail Legal — shared stylesheet
   Brand: privacy-first green, serif display headings, readable sans body.
   Light + dark aware. All pages link this file. */

:root {
  --bg:        #f6f8f3;
  --surface:   #ffffff;
  --ink:       #1c2a16;
  --text:      #2c3327;
  --muted:     #5f6b57;
  --brand:     #3f6b2e;
  --brand-strong: #2c4d1f;
  --border:    #e3e7db;
  --border-strong:#d3d9c8;
  --link:      #37642a;
  --link-hover:#244716;

  --info-bg:   #eef4e8;  --info-bd:  #cfe0bf;  --info-ac:  #3f6b2e;
  --warn-bg:   #fdf4e4;  --warn-bd:  #efd9ac;  --warn-ac:  #a9761b;  --warn-tx:#6f4c11;
  --imp-bg:    #fbeeee;  --imp-bd:   #ecc9c9;  --imp-ac:   #9b2c2c;  --imp-tx:#6d2020;
  --ph-bg:     #fff2b8;  --ph-bd:    #d7a83e;  --ph-tx:    #6b4e07;

  --serif: Georgia, 'Iowan Old Style', 'Times New Roman', Times, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, 'Noto Sans', sans-serif;
  --wrap: 800px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg:#0f120c; --surface:#161a10; --ink:#eef2e5; --text:#ccd4c1; --muted:#93a082;
    --brand:#8ec469; --brand-strong:#a9d78a; --border:#2a3120; --border-strong:#374126;
    --link:#9ccf78; --link-hover:#bde3a0;
    --info-bg:#18220f; --info-bd:#2f4620; --info-ac:#8ec469;
    --warn-bg:#241d0e; --warn-bd:#4a3c1c; --warn-ac:#d8ab55; --warn-tx:#e6c98a;
    --imp-bg:#241110; --imp-bd:#4d2523; --imp-ac:#d98484; --imp-tx:#eab3b1;
    --ph-bg:#3a3410; --ph-bd:#8a7420; --ph-tx:#f0dd93;
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.66;
  -webkit-font-smoothing: antialiased;
}

/* Header */
.legal-header {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  padding: 14px clamp(16px, 5vw, 40px);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--border);
}
.legal-header__brand {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--serif); font-weight: 700; font-size: 1.28rem;
  color: var(--brand-strong); text-decoration: none; letter-spacing: -0.01em;
}
.legal-header__logo {
  display: inline-grid; place-items: center;
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--brand); color: #fff; font-size: 15px;
}
.legal-header__nav a { color: var(--muted); text-decoration: none; font-size: .93rem; font-weight: 600; }
.legal-header__nav a:hover { color: var(--brand); }

/* Layout */
.legal-container { max-width: var(--wrap); margin: 0 auto; padding: clamp(28px,5vw,56px) clamp(18px,5vw,40px) 40px; }
.legal-doc { background: transparent; }

.doc-eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; font-weight: 700; color: var(--brand); margin: 0 0 10px; }
.doc-title { font-family: var(--serif); color: var(--ink); font-size: clamp(2rem, 5vw, 2.9rem); line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 14px; }
.doc-meta { color: var(--muted); font-size: .9rem; margin: 0 0 22px; }

/* Callouts */
.callout { border: 1px solid var(--border-strong); border-left-width: 4px; border-radius: 10px; padding: 14px 18px; margin: 22px 0; background: var(--surface); }
.callout p { margin: 0; }
.callout p + p { margin-top: 8px; }
.callout--info { background: var(--info-bg); border-color: var(--info-bd); border-left-color: var(--info-ac); }
.callout--warning { background: var(--warn-bg); border-color: var(--warn-bd); border-left-color: var(--warn-ac); color: var(--warn-tx); }
.callout--warning strong { color: var(--warn-tx); }
.callout--important { background: var(--imp-bg); border-color: var(--imp-bd); border-left-color: var(--imp-ac); color: var(--imp-tx); }
.callout--important strong { color: var(--imp-tx); }

/* Table of contents */
.doc-toc { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 18px 22px; margin: 26px 0 34px; }
.doc-toc__title { font-family: var(--serif); font-size: 1.05rem; color: var(--ink); margin: 0 0 10px; font-weight: 700; }
.doc-toc__list { margin: 0; padding-left: 0; list-style: none; columns: 2; column-gap: 32px; }
.doc-toc__list li { margin: 4px 0; break-inside: avoid; }
.doc-toc__list a { color: var(--link); text-decoration: none; }
.doc-toc__list a:hover { text-decoration: underline; }
@media (max-width: 560px){ .doc-toc__list { columns: 1; } }

/* Sections */
.doc-section { margin: 34px 0; }
.doc-section h2 { font-family: var(--serif); color: var(--ink); font-size: 1.5rem; line-height: 1.2; margin: 0 0 12px; scroll-margin-top: 84px; letter-spacing: -0.01em; }
.doc-section h3 { color: var(--ink); font-size: 1.08rem; margin: 22px 0 8px; }
.doc-section p, .doc-section li { color: var(--text); }
.doc-section ul, .doc-section ol { padding-left: 1.35em; }
.doc-section li { margin: 6px 0; }
.doc-section a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
.doc-section a:hover { color: var(--link-hover); }
.doc-section strong { color: var(--ink); }

/* Tables */
.doc-table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: .95rem; display: block; overflow-x: auto; }
.doc-table th, .doc-table td { border: 1px solid var(--border-strong); padding: 9px 12px; text-align: left; vertical-align: top; }
.doc-table th { background: var(--info-bg); color: var(--ink); font-weight: 700; }

/* Placeholder highlight — makes fill-in fields obvious in the draft */
.placeholder {
  background: var(--ph-bg); color: var(--ph-tx);
  border-bottom: 2px dashed var(--ph-bd);
  padding: 0 3px; border-radius: 3px; font-weight: 600;
  white-space: nowrap; font-size: .95em;
}

/* Footer */
.legal-footer { border-top: 1px solid var(--border); background: var(--surface); margin-top: 48px; }
.legal-footer__inner { max-width: var(--wrap); margin: 0 auto; padding: 28px clamp(18px,5vw,40px) 40px; color: var(--muted); font-size: .86rem; }
.legal-footer__co { margin: 0 0 14px; }
.legal-footer__links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 0 16px; }
.legal-footer__links a { color: var(--link); text-decoration: none; }
.legal-footer__links a:hover { text-decoration: underline; }
.legal-footer__fine { margin: 0; font-size: .8rem; }

/* Legal Center hub (index) */
.hub-hero { max-width: var(--wrap); margin: 0 auto; padding: clamp(30px,6vw,64px) clamp(18px,5vw,40px) 8px; }
.hub-hero h1 { font-family: var(--serif); color: var(--ink); font-size: clamp(2.2rem,6vw,3.3rem); line-height: 1.05; margin: 8px 0 12px; letter-spacing: -0.02em; }
.hub-hero p { color: var(--muted); font-size: 1.06rem; max-width: 60ch; margin: 0; }
.hub-grid { max-width: var(--wrap); margin: 0 auto; padding: 24px clamp(18px,5vw,40px) 8px; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.hub-card { display: block; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; text-decoration: none; transition: border-color .15s, transform .15s; }
.hub-card:hover { border-color: var(--brand); transform: translateY(-2px); }
.hub-card h3 { font-family: var(--serif); color: var(--ink); margin: 0 0 6px; font-size: 1.16rem; }
.hub-card p { color: var(--muted); margin: 0; font-size: .9rem; line-height: 1.5; }
.hub-group-title { max-width: var(--wrap); margin: 28px auto 0; padding: 0 clamp(18px,5vw,40px); font-family: var(--serif); color: var(--brand-strong); font-size: 1.05rem; text-transform: uppercase; letter-spacing: .08em; }

/* Print */
@media print {
  .legal-header, .doc-toc { display: none; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .placeholder { background: none; border-bottom: 1px solid #999; }
  a { color: #000; text-decoration: none; }
}