/* ==============================================================
   /legal/privacy/ · /legal/terms/ · /legal/disclaimer/
   Option B · cinematic SaaS · legal / policy pages
   ============================================================== */

/* HERO ------------------------------------------------------- */
.legal-hero-26 {
  position:relative; overflow:hidden;
  padding:var(--s-11) 0 var(--s-9);
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(239,41,41,.06), transparent 60%),
    linear-gradient(180deg, var(--c-ink-900) 0%, var(--c-ink-1000) 100%);
  color:var(--c-white);
}
.legal-hero-26::after {
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--c-ink-700), transparent);
}
.legal-hero-inner { max-width:900px; position:relative; z-index:1; }

.legal-breadcrumb {
  font-family:var(--font-mono); font-size:var(--t-xs); letter-spacing:.08em;
  color:var(--c-ink-400); margin-bottom:var(--s-5); text-transform:uppercase;
}
.legal-breadcrumb a { color:var(--c-ink-300); transition:color var(--d-fast) var(--ease-out); }
.legal-breadcrumb a:hover { color:var(--c-white); }
.legal-breadcrumb .sep { color:var(--c-red-500); margin:0 var(--s-2); }
.legal-breadcrumb .current { color:var(--c-white); }

.legal-eyebrow {
  font-family:var(--font-mono); font-size:var(--t-xs); letter-spacing:.14em;
  color:var(--c-red-400); margin-bottom:var(--s-4); font-weight:600;
  display:inline-flex; align-items:center; gap:var(--s-3);
}
.legal-eyebrow::before {
  content:""; width:24px; height:1px; background:var(--c-red-500);
}

.legal-title {
  font-family:var(--font-sans); font-size:var(--t-3xl); line-height:1.05;
  letter-spacing:-.035em; font-weight:800; color:var(--c-white);
  margin-bottom:var(--s-5);
}
.legal-title em {
  font-family:var(--font-serif); font-style:italic; font-weight:400;
  color:var(--c-red-400); letter-spacing:-.02em;
}
@media (min-width:768px) { .legal-title { font-size:var(--t-4xl); } }
@media (min-width:1024px) { .legal-title { font-size:var(--t-5xl); } }

.legal-meta {
  display:flex; flex-wrap:wrap; gap:var(--s-4) var(--s-6);
  font-family:var(--font-mono); font-size:var(--t-xs); letter-spacing:.06em;
  color:var(--c-ink-300); text-transform:uppercase; margin-top:var(--s-5);
}
.legal-meta span { display:inline-flex; align-items:center; gap:var(--s-2); }
.legal-meta .dot { width:6px; height:6px; border-radius:50%; background:var(--c-red-500); box-shadow:0 0 10px rgba(239,41,41,.5); }

/* BODY ------------------------------------------------------- */
.legal-body-26 {
  padding:var(--s-10) 0;
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(239,41,41,.025), transparent 70%),
    var(--bg-page);
  position:relative;
}

/* Body inner fills the full menu width (container-26). Two-column grid
   mirrors the services page convention: narrow meta column + wide body. */
.legal-body-inner { /* full menu width — no max-width */ }

/* Intro callout — full menu width at the top */
.legal-intro {
  font-size:var(--t-md); line-height:1.7; color:var(--text-secondary);
  padding:var(--s-5) var(--s-6); margin-bottom:var(--s-6);
  background:var(--c-white); border:1px solid var(--border-subtle); border-radius:var(--r-5);
  border-left:3px solid var(--c-red-600);
  box-shadow:var(--shadow-sm);
  max-width:900px;
}
.legal-intro strong { color:var(--text-primary); font-weight:600; }

/* Section block: mirrors .service-block-26 grid (180px meta + body).
   HTML stays flat (<div class="legal-section-num">01</div><h2>…</h2><p>…</p>):
   at desktop the number sits in row 1 / col 1, all other children use
   `grid-column: 2` so they stack naturally in col 2 without phantom rows. */
.legal-section {
  display:grid; grid-template-columns:1fr;
  padding:var(--s-5) 0;
  border-bottom:1px solid var(--border-subtle);
}
.legal-section:last-of-type { border-bottom:none; padding-bottom:0; }
.legal-section:first-of-type { padding-top:0; }

@media (min-width:900px) {
  .legal-section {
    grid-template-columns:180px minmax(0, 760px);
    column-gap:var(--s-10);
    padding:var(--s-6) 0;
    align-items:start;
  }
  .legal-section > *:not(.legal-section-num) { grid-column:2; }
}

.legal-section-num {
  display:flex; align-items:baseline; gap:var(--s-3);
  font-family:var(--font-mono); font-size:var(--t-lg); font-weight:700;
  color:var(--c-red-600); letter-spacing:-.02em; line-height:1;
  margin-bottom:var(--s-3);
}
.legal-section-num::after {
  content:""; flex:1; height:1px; background:var(--border-default);
  max-width:60px;
}
@media (min-width:900px) {
  .legal-section-num {
    grid-column:1; grid-row:1;
    padding-top:6px; font-size:var(--t-xl); margin-bottom:0;
  }
  .legal-section-num::after { display:none; }
}

.legal-section h2 {
  font-family:var(--font-sans); font-size:var(--t-lg); font-weight:700;
  letter-spacing:-.02em; color:var(--text-primary); line-height:1.25;
  margin:0 0 var(--s-3) 0;
}
@media (min-width:768px) { .legal-section h2 { font-size:var(--t-xl); } }

.legal-section p {
  font-size:var(--t-base); line-height:1.7; color:var(--text-secondary);
  margin:0 0 var(--s-3) 0;
}
.legal-section p:last-child { margin-bottom:0; }
.legal-section strong { color:var(--text-primary); font-weight:600; }

.legal-section ul {
  list-style:none; padding:0; margin:0 0 var(--s-3) 0;
  display:flex; flex-direction:column; gap:var(--s-1);
}
.legal-section ul li {
  font-size:var(--t-base); line-height:1.6; color:var(--text-secondary);
  padding-left:var(--s-5); position:relative;
}
.legal-section ul li::before {
  content:""; position:absolute; left:0; top:11px;
  width:8px; height:1px; background:var(--c-red-600);
}

.legal-section a {
  color:var(--c-red-600); text-decoration:none;
  border-bottom:1px solid rgba(220,31,31,.25);
  transition:border-color var(--d-fast) var(--ease-out), color var(--d-fast) var(--ease-out);
  font-family:var(--font-mono); font-size:.94em;
}
.legal-section a:hover { color:var(--c-red-500); border-bottom-color:var(--c-red-500); }

/* Contact footer block — full menu width, but inner content stays narrow */
.legal-contact-block {
  margin-top:var(--s-11); padding:var(--s-8) var(--s-9);
  background:var(--c-ink-900); color:var(--c-white);
  border-radius:var(--r-5); position:relative; overflow:hidden;
}
@media (min-width:900px) {
  .legal-contact-block { padding:var(--s-10) var(--s-11); }
}
.legal-contact-block > :not(::before) { max-width:760px; }
.legal-contact-block::before {
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 80% at 100% 0%, rgba(239,41,41,.1), transparent 60%);
  pointer-events:none;
}
.legal-contact-block > * { position:relative; z-index:1; }
.legal-contact-block .eyebrow { font-family:var(--font-mono); font-size:var(--t-xs); letter-spacing:.14em; color:var(--c-red-400); font-weight:600; margin-bottom:var(--s-3); }
.legal-contact-block h3 { font-family:var(--font-sans); font-size:var(--t-xl); font-weight:700; letter-spacing:-.02em; color:var(--c-white); margin:0 0 var(--s-3) 0; }
.legal-contact-block h3 em { font-family:var(--font-serif); font-style:italic; font-weight:400; color:var(--c-red-400); }
.legal-contact-block p { font-size:var(--t-md); line-height:1.65; color:var(--c-ink-200); margin:0 0 var(--s-5) 0; }
.legal-contact-block .legal-contact-links { display:flex; flex-wrap:wrap; gap:var(--s-4); font-family:var(--font-mono); font-size:var(--t-sm); }
.legal-contact-block .legal-contact-links a {
  color:var(--c-white); border-bottom:1px solid rgba(255,255,255,.3);
  padding-bottom:2px; transition:border-color var(--d-fast) var(--ease-out);
}
.legal-contact-block .legal-contact-links a:hover { border-bottom-color:var(--c-red-400); color:var(--c-red-300); }

/* Siblings navigation */
.legal-siblings {
  margin-top:var(--s-9); padding-top:var(--s-7);
  border-top:1px dashed var(--border-default);
  display:flex; gap:var(--s-3); flex-wrap:wrap; justify-content:flex-start;
}
.legal-siblings a {
  font-family:var(--font-mono); font-size:var(--t-sm); color:var(--text-secondary);
  padding:var(--s-2) var(--s-5); border:1px solid var(--border-default); border-radius:var(--r-full);
  transition:all var(--d-fast) var(--ease-out);
}
.legal-siblings a:hover { color:var(--c-red-600); border-color:var(--c-red-600); background:var(--c-white); }
.legal-siblings a.current { color:var(--c-white); background:var(--c-ink-900); border-color:var(--c-ink-900); }