/* ------------------------------------------------------------------
   Shared shell for the standalone legal pages (terms.html, privacy.html).

   These pages are plain documents — no DCLogic runtime, no demo windows —
   so they load design-system.css for the tokens and this file for layout,
   instead of styles.css (whose brand remap is scoped to [data-wafi-root]).
------------------------------------------------------------------ */
@font-face{
  font-family:'Inter Fallback';
  src:local('Arial');
  ascent-override:90.00%;
  descent-override:22.43%;
  line-gap-override:0.00%;
  size-adjust:107.12%;
}

:root{
  --font-sans:'Inter','Inter Fallback',system-ui,-apple-system,sans-serif;
  /* Same remap as the marketing site: orange is primary, navy stays the
     dark-surface colour used by the header band and footer. */
  --brand-blue-600:#F97316;
  --brand-blue-500:#EA6A0E;
  --brand-blue-50:#FFF4EA;
  --brand-blue-100:#FFE4CC;
  --link:#F97316;
  --link-hover:#EA6A0E;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font-sans);
  color:var(--ink-900);
  background:var(--bg-app);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:var(--brand-blue-600);text-decoration:none;}
a:hover{color:var(--brand-blue-500);}
[data-lucide]{width:1em;height:1em;stroke-width:1.75;display:block;}
::selection{background:rgba(249,115,22,0.22);}

/* ---- top bar ---- */
.lg-head{
  position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,0.88);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border-soft);
}
.lg-head-in{
  max-width:920px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
}
.lg-head-in img{height:28px;width:auto;display:block;}
.lg-head-links{display:flex;align-items:center;gap:20px;font-size:14px;font-weight:600;}
.lg-head-links a{color:var(--ink-700);}
.lg-head-links a:hover{color:var(--brand-blue-600);}
.lg-cta{
  font-size:14px;font-weight:600;color:#fff!important;
  background:var(--brand-blue-600);padding:9px 18px;border-radius:var(--radius-md);
  box-shadow:var(--shadow-sm);transition:background var(--dur-micro) var(--ease-out);
}
.lg-cta:hover{background:var(--brand-blue-500);color:#fff!important;}

/* ---- hero band ---- */
.lg-hero{
  background:
    radial-gradient(760px 380px at 82% -20%, var(--brand-blue-50), rgba(255,255,255,0) 60%),
    var(--bg-soft);
  border-bottom:1px solid var(--border-soft);
  padding:52px 24px 44px;
}
.lg-hero-in{max-width:920px;margin:0 auto;}
.lg-kicker{
  display:inline-flex;align-items:center;gap:7px;
  font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--brand-orange-600);background:var(--brand-orange-50);
  border:1px solid var(--brand-orange-100);
  padding:5px 12px;border-radius:999px;margin-bottom:16px;
}
.lg-hero h1{
  font-size:clamp(30px,3.6vw,44px);line-height:1.1;letter-spacing:-0.03em;
  font-weight:700;color:var(--ink-900);margin:0 0 14px;
}
.lg-hero p{font-size:17px;line-height:1.6;color:var(--ink-600);margin:0;max-width:640px;}
.lg-meta{
  display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:20px;
  font-size:13.5px;font-weight:500;color:var(--ink-500);
}
.lg-meta span{display:inline-flex;align-items:center;gap:7px;}
.lg-meta span i{color:var(--brand-orange-500);}

/* ---- promise strip (the four commercial guarantees) ---- */
.lg-promise{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  max-width:920px;margin:-22px auto 0;padding:0 24px;
}
.lg-promise div{
  display:flex;align-items:center;gap:9px;
  background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-md);
  padding:12px 14px;box-shadow:var(--shadow-sm);
  font-size:12.5px;font-weight:600;line-height:1.35;color:var(--ink-800);
}
.lg-promise div i{color:var(--brand-orange-500);flex-shrink:0;font-size:15px;}

/* ---- document body ---- */
.lg-doc{max-width:920px;margin:0 auto;padding:44px 24px 72px;}
.lg-toc{
  background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-lg);
  padding:20px 24px;box-shadow:var(--shadow-sm);margin-bottom:38px;
}
.lg-toc-t{
  font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-400);margin-bottom:12px;
}
.lg-toc ol{
  margin:0;padding-left:20px;
  columns:2;column-gap:32px;
  font-size:14px;line-height:2;color:var(--ink-600);
}
.lg-doc h2{
  font-size:20px;line-height:1.3;letter-spacing:-0.015em;font-weight:700;
  color:var(--ink-900);margin:38px 0 10px;scroll-margin-top:84px;
}
.lg-doc h2:first-of-type{margin-top:0;}
.lg-doc h3{
  font-size:15.5px;font-weight:600;color:var(--ink-800);margin:22px 0 8px;
}
.lg-doc p,.lg-doc li{font-size:15px;line-height:1.7;color:var(--ink-600);}
.lg-doc p{margin:0 0 12px;}
.lg-doc ul{margin:0 0 12px;padding-left:22px;}
.lg-doc li{margin-bottom:7px;}
.lg-doc strong{color:var(--ink-800);font-weight:600;}
.lg-doc a{font-weight:500;}

/* callout used for the commercial terms people actually care about */
.lg-note{
  background:var(--brand-orange-50);border:1px solid var(--brand-orange-100);
  border-radius:var(--radius-lg);padding:18px 22px;margin:0 0 16px;
}
.lg-note p{margin:0;color:var(--ink-700);}
.lg-note p+p{margin-top:9px;}

.lg-table{
  width:100%;border-collapse:collapse;margin:0 0 16px;
  border:1px solid var(--border-card);border-radius:var(--radius-md);overflow:hidden;
}
.lg-table th,.lg-table td{
  text-align:left;font-size:14px;line-height:1.6;padding:11px 14px;
  border-bottom:1px solid var(--border-soft);vertical-align:top;
}
.lg-table th{
  font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-500);background:var(--bg-soft);
}
.lg-table td{color:var(--ink-600);}
.lg-table tr:last-child td{border-bottom:0;}

/* ---- footer ---- */
.lg-foot{background:var(--brand-blue-700);color:rgba(255,255,255,0.72);padding:44px 24px 30px;}
.lg-foot-in{
  max-width:920px;margin:0 auto;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:26px;
}
.lg-foot-in p{font-size:14px;line-height:1.65;margin:0;max-width:320px;color:rgba(255,255,255,0.62);}
.lg-foot a{color:rgba(255,255,255,0.78);}
.lg-foot a:hover{color:#fff;}
.lg-foot-links{display:flex;flex-direction:column;gap:9px;font-size:14px;}
.lg-foot-bottom{
  max-width:920px;margin:30px auto 0;padding-top:20px;
  border-top:1px solid rgba(255,255,255,0.12);
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;
  font-size:13px;color:rgba(255,255,255,0.5);
}

@media (max-width:820px){
  .lg-head-links{display:none;}
  .lg-promise{grid-template-columns:1fr 1fr;}
  .lg-toc ol{columns:1;}
}
@media (max-width:520px){
  .lg-promise{grid-template-columns:1fr;margin-top:-16px;}
  .lg-hero{padding:38px 16px 34px;}
  .lg-doc{padding:34px 16px 56px;}
  .lg-head-in,.lg-promise{padding-left:16px;padding-right:16px;}
}