/* ============================================================
   Amanorn Solutions — shared styles for the legal pages.

   Deliberately a separate file from index.html: these pages get
   edited on a different clock than the marketing page, and a
   policy change should never mean touching the homepage.

   Fonts are the same self-hosted files the homepage uses, so
   these pages also make zero third-party requests.
   ============================================================ */

@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('/assets/fonts/inter-var-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('/assets/fonts/inter-var-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Space Grotesk';
  font-style:normal;
  font-weight:500 700;
  font-display:swap;
  src:url('/assets/fonts/space-grotesk-var-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/assets/fonts/ibm-plex-mono-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  --ink:#0B1739;
  --royal:#1348E8;
  --deep:#060F2E;
  --steel:#7E93BC;
  --steel-ink:#596D95;     /* 4.79:1 on --mist, 5.19:1 on white */
  --steel-soft:#B8C4DE;
  --mist:#F3F6FC;
  --mist-2:#E7ECF7;
  --signal:#4C7CFF;
  --white:#FFFFFF;
  --line:rgba(11,23,57,0.10);
  --line-dark:rgba(255,255,255,0.12);

  --font-display:'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body:'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, monospace;

  --maxw:1180px;
  --pad:clamp(1.25rem, 4vw, 3.5rem);
  --nav-h:76px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ transition-duration:0.001ms !important; animation-duration:0.001ms !important; }
}

body{
  margin:0;
  background:var(--mist);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:var(--royal); }
a:hover{ color:var(--signal); }

:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:3px;
  border-radius:2px;
}

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

/* Available to assistive technology, absent from the visual layout. Used for
   table captions where the surrounding heading already says it visually. */
.lgl-visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* Reaches into the tab order first and reveals itself on focus, so a keyboard
   visitor is not made to walk the whole header on every page. */
.skip-link{
  position:absolute;
  left:0.75rem;
  top:-4rem;
  z-index:200;
  background:var(--royal);
  color:var(--white);
  font-weight:600;
  font-size:0.9rem;
  padding:0.7rem 1.1rem;
  border-radius:0 0 10px 10px;
  text-decoration:none;
  transition:top 0.18s ease;
}
.skip-link:focus{ top:0; }

/* ---------- HEADER ---------- */
.lgl-nav{
  position:sticky;
  top:0;
  z-index:50;
  background:var(--deep);
  border-bottom:1px solid var(--line-dark);
}
.lgl-nav .wrap{
  min-height:var(--nav-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.lgl-nav img{ height:30px; width:auto; }
.lgl-nav__back{
  color:var(--steel-soft);
  font-size:0.9rem;
  text-decoration:none;
}
.lgl-nav__back:hover{ color:var(--white); }

/* ---------- PAGE HEAD ---------- */
.lgl-head{
  background:var(--deep);
  color:var(--white);
  padding:clamp(2.75rem,6vw,4.5rem) 0 clamp(2.25rem,5vw,3.5rem);
}
.lgl-head .eyebrow{
  margin:0 0 0.9rem;
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--steel-soft);
}
.lgl-head h1{
  font-family:var(--font-display);
  font-size:clamp(2rem,3.4vw + 1rem,3.1rem);
  line-height:1.1;
  margin:0;
  max-width:20ch;
}
.lgl-head__dates{
  margin:1.5rem 0 0;
  font-size:0.88rem;
  color:var(--steel-soft);
}
.lgl-head__dates strong{ color:var(--white); font-weight:600; }

/* ---------- BODY ---------- */
.lgl-body{ padding:clamp(2.5rem,5vw,4rem) 0 clamp(3rem,6vw,5rem); }
.lgl-body .wrap{
  display:grid;
  grid-template-columns:minmax(0,15rem) minmax(0,1fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:start;
}

.lgl-toc{ position:sticky; top:calc(var(--nav-h) + 1.5rem); }
.lgl-toc h2{
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--steel-ink);
  margin:0 0 0.9rem;
  font-weight:500;
}
.lgl-toc ol{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.5rem; counter-reset:toc; }
.lgl-toc li{ counter-increment:toc; }
.lgl-toc a{
  display:flex;
  gap:0.6rem;
  font-size:0.88rem;
  line-height:1.4;
  color:var(--steel-ink);
  text-decoration:none;
}
.lgl-toc a::before{ content:counter(toc,decimal-leading-zero); font-family:var(--font-mono); font-size:0.72rem; padding-top:0.15rem; }
.lgl-toc a:hover{ color:var(--royal); }

/* A grid item's automatic minimum is its min-content width, so one unbreakable
   token -- our own email address -- was widening the whole track past the
   wrap's padding and putting a 2px horizontal scrollbar on the page at 375px.
   Both halves are needed: min-width:0 lets the track shrink, and anywhere gives
   the long tokens a break opportunity so they wrap instead of overflowing. */
.lgl-body .wrap > *{ min-width:0; }
.lgl-doc a,
.lgl-doc code,
.lgl-contact a,
.lgl-foot a{ overflow-wrap:anywhere; }

.lgl-doc{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:clamp(1.5rem,3.5vw,3rem);
  max-width:74ch;
}
.lgl-doc code{
  font-family:var(--font-mono);
  font-size:0.86em;
  background:var(--mist-2);
  border-radius:5px;
  padding:0.12em 0.36em;
}
/* In prose a long identifier may break rather than overflow. In a table cell it
   must not -- a storage key split across two lines reads as two keys. The table
   sits in its own scroll container, so letting it widen costs nothing. */
.lgl-doc td code,
.lgl-doc th code{ overflow-wrap:normal; white-space:nowrap; }
.lgl-doc > *:first-child{ margin-top:0; }
.lgl-doc > *:last-child{ margin-bottom:0; }
.lgl-doc h2{
  font-family:var(--font-display);
  font-size:1.4rem;
  line-height:1.25;
  margin:2.75rem 0 0.9rem;
  scroll-margin-top:calc(var(--nav-h) + 1.5rem);
}
.lgl-doc h3{
  font-family:var(--font-display);
  font-size:1.08rem;
  margin:1.9rem 0 0.6rem;
  scroll-margin-top:calc(var(--nav-h) + 1.5rem);
}
.lgl-doc p{ margin:0 0 1.05rem; }
.lgl-doc ul,.lgl-doc ol{ margin:0 0 1.15rem; padding-left:1.35rem; }
.lgl-doc li{ margin-bottom:0.55rem; }
.lgl-doc li > ul,.lgl-doc li > ol{ margin-top:0.55rem; }
.lgl-doc strong{ font-weight:600; }
.lgl-doc dt{ font-weight:600; margin-top:1rem; }
.lgl-doc dd{ margin:0.3rem 0 0; }

/* A plain-language summary sitting above the operative text. It restates the
   section; it never replaces it, and the pages say so. */
.lgl-note{
  margin:0 0 2rem;
  padding:1.1rem 1.25rem;
  background:var(--mist);
  border-left:3px solid var(--royal);
  border-radius:0 10px 10px 0;
  font-size:0.95rem;
}
.lgl-note p{ margin:0 0 0.65rem; }
.lgl-note p:last-child{ margin-bottom:0; }

.lgl-callout{
  margin:1.5rem 0;
  padding:1.1rem 1.25rem;
  background:var(--mist-2);
  border-radius:10px;
  font-size:0.95rem;
}
.lgl-callout p:last-child{ margin-bottom:0; }

/* Wide tables must scroll inside their own box rather than pushing the page
   sideways on a phone. */
.lgl-table-wrap{ overflow-x:auto; margin:0 0 1.4rem; }
.lgl-doc table{
  border-collapse:collapse;
  width:100%;
  min-width:34rem;
  font-size:0.92rem;
}
.lgl-doc th,.lgl-doc td{
  text-align:left;
  vertical-align:top;
  padding:0.7rem 0.85rem;
  border-bottom:1px solid var(--line);
}
.lgl-doc thead th{
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--steel-ink);
  font-weight:500;
  border-bottom:1px solid var(--ink);
}
.lgl-doc tbody tr:last-child td{ border-bottom:0; }

.lgl-contact{
  margin-top:2.5rem;
  padding-top:1.75rem;
  border-top:1px solid var(--line);
  font-size:0.95rem;
}

/* ---------- FOOTER ---------- */
.lgl-foot{
  background:var(--deep);
  color:var(--steel-soft);
  padding:clamp(2.5rem,5vw,3.5rem) 0 2rem;
  font-size:0.9rem;
}
.lgl-foot nav ul{
  list-style:none;
  margin:0 0 1.75rem;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:0.75rem 1.75rem;
}
.lgl-foot a{ color:var(--steel-soft); text-decoration:none; }
.lgl-foot a:hover{ color:var(--white); }
.lgl-foot__bottom{
  padding-top:1.5rem;
  border-top:1px solid var(--line-dark);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:0.75rem;
  font-size:0.82rem;
  color:var(--steel);
}
.lgl-foot__bottom span{ max-width:56ch; }

@media (max-width:900px){
  .lgl-body .wrap{ grid-template-columns:1fr; }
  .lgl-toc{
    position:static;
    background:var(--white);
    border:1px solid var(--line);
    border-radius:14px;
    padding:1.25rem 1.4rem;
  }
}

@media print{
  .lgl-nav,.lgl-toc,.skip-link{ display:none; }
  body{ background:var(--white); font-size:11pt; }
  .lgl-head{ background:none; color:var(--ink); padding:0 0 1.5rem; }
  .lgl-head .eyebrow,.lgl-head__dates{ color:var(--ink); }
  .lgl-head__dates strong{ color:var(--ink); }
  .lgl-doc{ border:0; padding:0; max-width:none; }
  .lgl-foot{ background:none; color:var(--ink); }
  .lgl-foot a{ color:var(--ink); }
}
