/* ==========================================================================
   Drawn AI — pages.css
   Page-specific composition: hero collages, section layouts
   ========================================================================== */

/* ==========================================================================
   Hero collage — Home (free-floating, parallaxed)
   ========================================================================== */
.collage-home {
  aspect-ratio: 1.27;
  /* let the collage bleed slightly past the container, as in the mockup */
  margin-right: clamp(-40px, -2.4vw, 0px);
}
.collage-home .panel-float { position: absolute; }
.collage-home .c1 { left: 1%;  top: 2%;  width: 37%; z-index: 3; }
.collage-home .c2 { left: 40%; top: 0;   width: 48%; z-index: 2; }
.collage-home .c3 { left: 16%; top: 35%; width: 40%; z-index: 5; }
.collage-home .c4 { left: -1%; top: 58%; width: 34%; z-index: 4; }
.collage-home .c5 { left: 50%; top: 53%; width: 32%; z-index: 4; }
.collage-home .c6 { left: 75%; top: 32%; width: 24%; z-index: 3; }
.collage-home .c7 { left: 83%; top: 55%; width: 17%; z-index: 6; }

/* ==========================================================================
   Hero collage — tidy grid variants (Services / Industries / Solutions)
   ========================================================================== */
.collage-grid {
  container-type: inline-size;
  font-size: clamp(8px, 1.35cqw, 11.5px);
  display: grid;
  gap: 1.2em;
  aspect-ratio: auto;
}
.collage-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.collage-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.collage-grid .panel { height: 100%; }
.collage-grid .span-2 { grid-column: span 2; }
@media (max-width: 640px) {
  .collage-grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collage-grid .hide-xs { display: none; }
}

/* Solutions hero: 2 dashboard columns + phone */
.collage-solutions {
  container-type: inline-size;
  font-size: clamp(7.5px, 1.14cqw, 10.5px);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .82fr) minmax(0, .5fr);
  gap: 1.1em;
  align-items: start;
}
.collage-solutions .stackcol { display: grid; gap: 1.1em; }
@media (max-width: 780px) {
  .collage-solutions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collage-solutions .phonecol { display: none; }
}

/* ==========================================================================
   Home — partner logo band
   ========================================================================== */
.logo-band {
  display: flex; align-items: center; justify-content: center;
  gap: clamp(28px, 5vw, 72px);
  flex-wrap: wrap;
  margin-top: 26px;
}
.logo-band img {
  height: 46px; width: auto;
  opacity: .95;
  transition: filter .4s, opacity .4s, transform .4s var(--ease-out);
  mix-blend-mode: multiply;
}
.logo-band img:hover { opacity: 1; transform: translateY(-2px); }
.logo-band .sep { width: 1px; height: 42px; background: var(--line); }
@media (max-width: 620px) { .logo-band .sep { display: none; } }

/* ==========================================================================
   Services — capability detail rows
   ========================================================================== */
.cap-row {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1fr);
  gap: clamp(20px, 2.4vw, 40px);
  align-items: center;
  padding: clamp(18px, 2vw, 26px);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--paper);
  transition: border-color .35s, box-shadow .35s, transform .45s var(--ease-out);
}
.cap-row:hover { border-color: rgba(74,108,250,.35); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.cap-row h3 { font-size: 1.1rem; }
.cap-row .check-list { margin-top: 14px; }
.cap-row .cap-visual { border-radius: var(--r-md); overflow: hidden; }
.cap-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 900px) { .cap-grid { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 560px) { .cap-row { grid-template-columns: minmax(0,1fr); } }

/* light-surface diagram box */
.diagram-box {
  background: linear-gradient(160deg, #F6F8FF, #FFFFFF);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 18px;
}

/* ==========================================================================
   Services / Industries — outcome tiles
   ========================================================================== */
.outcome-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; }
.outcome {
  padding: 22px 18px;
  border-left: 1px solid var(--line);
}
.outcome:first-child { border-left: 0; }
.outcome .card-icon { width: 38px; height: 38px; margin-bottom: 14px; }
.outcome .card-icon svg { width: 18px; height: 18px; }
.outcome h4 { font-size: .875rem; line-height: 1.3; }
.outcome p { font-size: .78rem; color: var(--text-muted); margin-top: 8px; line-height: 1.5; }
@media (max-width: 1080px) {
  .outcome-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .outcome { border-left: 0; border-top: 1px solid var(--line); }
  .outcome:nth-child(-n+3) { border-top: 0; }
}
@media (max-width: 620px) { .outcome-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* ==========================================================================
   Solutions — hub & spoke integration diagram
   ========================================================================== */
.hub {
  position: relative;
  display: grid;
  gap: 26px;
  padding: clamp(20px, 3vw, 40px) 0;
}
.hub-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; position: relative; z-index: 1; }
.hub-core {
  justify-self: center;
  position: relative; z-index: 2;
  width: 108px; height: 108px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: radial-gradient(circle at 35% 30%, #4A6CFA, #1E40D8 70%);
  box-shadow: 0 0 0 10px rgba(74,108,250,.10), 0 0 0 22px rgba(74,108,250,.05), 0 22px 50px -18px rgba(46,86,240,.75);
  color: #fff;
  font-family: var(--font-display); font-weight: 800; font-size: .82rem;
  letter-spacing: .01em; white-space: nowrap;
}
.hub-core .mark-ai { color: #BFD0FF; }
.hub-lines { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.hub-lines path { fill: none; stroke: var(--blue-300); stroke-width: 1.5; stroke-dasharray: 5 6; opacity: .8; }

/* ==========================================================================
   Industries — industry blocks
   ========================================================================== */
.ind-block {
  display: grid;
  grid-template-columns: minmax(0, .30fr) minmax(0, .32fr) minmax(0, 1fr);
  gap: 0;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--paper);
}
.ind-block + .ind-block { margin-top: 22px; }
.ind-head {
  background: linear-gradient(160deg, #071634 0%, #01060F 100%);
  color: var(--text-on-dark-muted);
  padding: 26px 24px;
  position: relative;
}
.ind-head::after {
  content: "";
  position: absolute; inset: auto -30% -40% auto;
  width: 70%; aspect-ratio: 1;
  background: radial-gradient(circle, rgba(74,108,250,.28), transparent 68%);
  pointer-events: none;
}
.ind-head .card-icon { background: rgba(74,108,250,.16); border-color: rgba(74,108,250,.32); color: var(--blue-400); }
.ind-head h3 { color: #fff; font-size: 1.4rem; }
.ind-head p { font-size: .82rem; color: var(--text-on-dark-faint); margin-top: 12px; line-height: 1.6; }
.ind-subs { padding: 26px 24px; border-right: 1px solid var(--line); background: var(--paper-50); }
.ind-subs h5 { font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; color: var(--text-faint); }
.ind-subs ol { counter-reset: s; margin-top: 12px; display: grid; gap: 7px; }
.ind-subs li {
  counter-increment: s;
  display: grid; grid-template-columns: 16px 1fr; gap: 9px;
  font-size: .8rem; color: var(--text-muted); line-height: 1.4;
}
.ind-subs li::before { content: counter(s); color: var(--blue-500); font-weight: 700; font-size: .72rem; }
.ind-sols { padding: 26px 24px; }
.ind-sols h5 { font-size: .95rem; font-family: var(--font-display); font-weight: 700; color: var(--text-strong); margin-bottom: 14px; }
.sol-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.sol-tile {
  display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--paper);
  font-size: .78rem; line-height: 1.3; color: var(--text);
  transition: border-color .3s, transform .35s var(--ease-out), box-shadow .35s;
}
.sol-tile svg { width: 16px; height: 16px; color: var(--blue-500); }
.sol-tile:hover { border-color: var(--blue-400); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
@media (max-width: 1180px) { .sol-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 1080px) {
  .ind-block { grid-template-columns: minmax(0, .38fr) minmax(0, 1fr); }
  .ind-sols { grid-column: 1 / -1; border-top: 1px solid var(--line); }
}
@media (max-width: 720px) {
  .ind-block { grid-template-columns: minmax(0, 1fr); }
  .ind-subs { border-right: 0; border-top: 1px solid var(--line); }
  .sol-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 460px) { .sol-grid { grid-template-columns: minmax(0,1fr); } }

/* industry selector row */
.ind-tabs { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 16px; }
.ind-tab {
  display: grid; justify-items: center; gap: 12px;
  padding: 24px 16px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--paper);
  text-align: center;
  transition: border-color .3s, transform .4s var(--ease-out), box-shadow .4s;
}
.ind-tab svg { width: 30px; height: 30px; color: var(--blue-500); }
.ind-tab h4 { font-size: .95rem; }
.ind-tab:hover { border-color: var(--blue-400); transform: translateY(-4px); box-shadow: var(--shadow-md); }
@media (max-width: 900px) { .ind-tabs { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 560px) { .ind-tabs { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* about: dark inset panel */
.panel-inset {
  background: linear-gradient(160deg, #050F2A 0%, #01060F 100%);
  border: 1px solid rgba(120,155,255,.16);
  border-radius: var(--r-xl);
  padding: clamp(24px, 3vw, 40px);
  color: var(--text-on-dark-muted);
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: clamp(24px, 3vw, 44px);
  position: relative;
  overflow: hidden;
}
.panel-inset::after {
  content: "";
  position: absolute; inset: -40% -20% auto auto;
  width: 55%; aspect-ratio: 1;
  background: radial-gradient(circle, rgba(74,108,250,.25), transparent 66%);
  pointer-events: none;
}
.panel-inset > div { position: relative; z-index: 1; }
.panel-inset > div + div { border-left: 1px solid var(--line-dark); padding-left: clamp(24px, 3vw, 44px); }
.panel-inset h3 { color: #fff; font-size: 1.25rem; margin-top: 18px; }
.panel-inset .card-icon { background: rgba(74,108,250,.14); border-color: rgba(74,108,250,.3); color: var(--blue-400); margin: 0; }
.panel-inset .tick-list { margin-top: 20px; }
.panel-inset .tick-list li { color: #D5DDEF; }
@media (max-width: 780px) {
  .panel-inset { grid-template-columns: minmax(0,1fr); }
  .panel-inset > div + div { border-left: 0; padding-left: 0; border-top: 1px solid var(--line-dark); padding-top: 28px; }
}

/* values row */
.values { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); }
.value { text-align: center; padding: 8px 22px; border-left: 1px solid var(--line); }
.value:first-child { border-left: 0; }
.value svg { width: 34px; height: 34px; color: var(--blue-500); margin: 0 auto 16px; }
.value h4 { font-size: 1rem; }
.value p { font-size: .82rem; color: var(--text-muted); margin-top: 10px; line-height: 1.55; }
@media (max-width: 900px) {
  .values { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 30px 0; }
  .value { border-left: 0; }
}
@media (max-width: 520px) { .values { grid-template-columns: minmax(0,1fr); } }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-hero-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
}
.glass-card {
  border-radius: var(--r-lg);
  border: 1px solid rgba(120,155,255,.18);
  background: linear-gradient(158deg, rgba(9,22,52,.92), rgba(3,10,28,.92));
  backdrop-filter: blur(14px);
  padding: 20px;
  box-shadow: var(--shadow-dark);
  color: var(--text-on-dark-muted);
}
.glass-card .gc-head {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-display); font-weight: 700; font-size: .95rem; color: #fff;
  margin-bottom: 16px;
}
.glass-card .gc-head svg { width: 18px; height: 18px; color: var(--blue-400); }
@media (max-width: 620px) { .contact-hero-cards { grid-template-columns: minmax(0,1fr); } }

/* mini calendar */
.cal { font-size: .78rem; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; color: #fff; font-weight: 600; }
.cal-head button { color: #7E9BFF; display: grid; place-items: center; padding: 4px; border-radius: 4px; }
.cal-head button svg { width: 14px; height: 14px; }
.cal-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; text-align: center; }
.cal-grid .dow { font-size: .62rem; color: #5F6C88; letter-spacing: .06em; padding-bottom: 4px; }
.cal-grid button {
  padding: 6px 0; border-radius: 6px; color: #B6C1DA; font-size: .78rem;
  transition: background-color .2s, color .2s;
}
.cal-grid button:hover { background: rgba(255,255,255,.07); color: #fff; }
.cal-grid button.dim { color: #47536E; }
.cal-grid button.on { background: var(--blue-500); color: #fff; font-weight: 700; }

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, .85fr);
  gap: clamp(24px, 3vw, 44px);
  align-items: start;
}
@media (min-width: 981px) {
  .contact-layout > aside { position: sticky; top: calc(var(--nav-h) + 20px); }
}
@media (max-width: 980px) { .contact-layout { grid-template-columns: minmax(0,1fr); } }

.contact-detail {
  display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: start;
}
.contact-detail + .contact-detail { margin-top: 22px; }
.contact-detail .ci {
  width: 40px; height: 40px; border-radius: var(--r-sm);
  display: grid; place-items: center;
  background: rgba(74,108,250,.10); color: var(--blue-500);
  border: 1px solid rgba(74,108,250,.18);
}
.contact-detail .ci svg { width: 18px; height: 18px; }
.contact-detail h5 { font-size: .875rem; }
.contact-detail p, .contact-detail a { font-size: .875rem; color: var(--text-muted); margin-top: 3px; display: block; }
.contact-detail a:hover { color: var(--blue-600); }

.note-box {
  margin-top: 26px; padding: 18px;
  border-radius: var(--r-md);
  background: rgba(74,108,250,.06);
  border: 1px solid rgba(74,108,250,.18);
  display: grid; grid-template-columns: 22px 1fr; gap: 12px;
}
.note-box svg { width: 20px; height: 20px; color: var(--blue-500); }
.note-box h5 { font-size: .875rem; }
.note-box p { font-size: .82rem; color: var(--text-muted); margin-top: 6px; line-height: 1.55; }

.quote-card {
  margin-top: 22px;
  border-radius: var(--r-lg);
  overflow: hidden;
  background: linear-gradient(160deg, #071634 0%, #01060F 100%);
  border: 1px solid rgba(120,155,255,.18);
  color: var(--text-on-dark-muted);
}
.quote-card .qc-body { padding: 26px; }
.quote-card .qmark { font-family: var(--font-display); font-size: 2.2rem; line-height: 1; color: var(--blue-400); }
.quote-card p { font-size: 1rem; color: #E5EAF7; line-height: 1.55; margin-top: 8px; letter-spacing: -.01em; }
.quote-card .who { margin-top: 16px; font-size: .82rem; }
.quote-card .who b { color: var(--blue-400); display: block; font-size: .9rem; }

/* process steps (contact) */
.proc-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; position: relative; }
.proc {
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--paper); padding: 22px; position: relative;
  transition: border-color .3s, transform .4s var(--ease-out), box-shadow .4s;
}
.proc:hover { border-color: var(--blue-400); transform: translateY(-4px); box-shadow: var(--shadow-md); }
.proc .n {
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--blue-500); color: #fff;
  display: grid; place-items: center;
  font-size: .78rem; font-weight: 700; font-family: var(--font-display);
  margin-bottom: 14px;
}
.proc svg.pic { width: 26px; height: 26px; color: var(--blue-500); margin-bottom: 12px; }
.proc h4 { font-size: .95rem; }
.proc p { font-size: .82rem; color: var(--text-muted); margin-top: 8px; line-height: 1.55; }
@media (max-width: 900px) { .proc-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px) { .proc-grid { grid-template-columns: minmax(0,1fr); } }

.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; align-items: start; }
.faq-grid .acc-item + .acc-item { margin-top: 0; }
@media (max-width: 780px) { .faq-grid { grid-template-columns: minmax(0,1fr); } }

/* Australia map card */
.au-map { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; }
.au-map svg { width: 100%; height: auto; color: var(--blue-500); }
.au-map .locs { font-size: .82rem; color: #C4CEE4; }
.au-map .locs b { display: block; color: #fff; }

/* Home — six feature cards across on wide screens (as per the mockup) */
.cards-6 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.cards-6 .card-dark { padding: 22px 18px; }
.cards-6 .card-dark h4 { font-size: .9rem; }
.cards-6 .card-dark p { font-size: .78rem; }
@media (max-width: 1180px) { .cards-6 { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px)  { .cards-6 { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 480px)  { .cards-6 { grid-template-columns: minmax(0,1fr); } }

/* ==========================================================================
   Legal / long-form document pages
   ========================================================================== */
.legal-hero {
  padding-top: calc(var(--nav-h) + clamp(34px, 4vw, 60px));
  padding-bottom: clamp(30px, 3.5vw, 52px);
}
.legal-hero .h1 { margin-top: 16px; }
.legal-hero .lede { margin-top: 18px; max-width: 720px; }
.legal-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px;
  margin-top: 22px; font-size: .82rem; color: var(--text-on-dark-faint);
}
.legal-meta .dot-sep { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: .5; }

.legal-layout {
  display: grid;
  grid-template-columns: minmax(0, 250px) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 68px);
  align-items: start;
}

/* --- sticky table of contents --- */
.legal-toc { position: sticky; top: calc(var(--nav-h) + 24px); }
.legal-toc .toc-title {
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--text-faint); margin-bottom: 14px;
}
.legal-toc ol { display: grid; gap: 1px; counter-reset: none; }
.legal-toc a {
  display: block;
  padding: 7px 12px;
  border-left: 2px solid var(--line);
  font-size: .82rem;
  line-height: 1.35;
  color: var(--text-muted);
  transition: color .2s, border-color .2s, background-color .2s;
}
.legal-toc a:hover { color: var(--text-strong); border-left-color: var(--blue-400); background: var(--paper-100); }
.legal-toc a.is-current {
  color: var(--blue-600);
  border-left-color: var(--blue-500);
  background: rgba(74, 108, 250, .06);
  font-weight: 600;
}
@media (max-width: 940px) {
  .legal-layout { grid-template-columns: minmax(0, 1fr); }
  .legal-toc { position: static; }
  .legal-toc ol {
    display: flex; flex-wrap: wrap; gap: 8px;
    padding: 16px; border: 1px solid var(--line); border-radius: var(--r-md);
    background: var(--paper-50);
  }
  .legal-toc a {
    border-left: 0; border: 1px solid var(--line); border-radius: var(--r-pill);
    padding: 6px 12px; font-size: .78rem; background: var(--paper);
  }
  .legal-toc a.is-current { background: rgba(74, 108, 250, .08); }
}

/* --- document body --- */
.legal-body { max-width: 74ch; font-size: 1rem; line-height: 1.72; color: var(--text); }
.legal-body > * + * { margin-top: 1.1em; }

.legal-body .lg-h2 {
  font-size: clamp(1.2rem, 1.05rem + .6vw, 1.5rem);
  letter-spacing: -.022em;
  margin-top: 2.4em;
  padding-top: 1.6em;
  border-top: 1px solid var(--line);
  scroll-margin-top: calc(var(--nav-h) + 24px);
}
.legal-body > .lg-h2:first-child,
.legal-intro + .lg-h2 { margin-top: 0; padding-top: 0; border-top: 0; }
.legal-body .lg-h3 {
  font-size: 1.02rem;
  letter-spacing: -.012em;
  margin-top: 1.9em;
  color: var(--text-strong);
}
.legal-body p { color: var(--text-muted); }
.legal-body strong { color: var(--text-strong); font-weight: 600; }
.legal-body a { color: var(--blue-600); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.legal-body a:hover { color: var(--blue-700); }
.legal-body code {
  font-family: var(--font-mono);
  font-size: .86em;
  padding: .12em .4em;
  border-radius: 4px;
  background: var(--paper-100);
  border: 1px solid var(--line);
}

.legal-body .lg-list { display: grid; gap: .55em; padding-left: 1.35em; }
.legal-body ul.lg-list { list-style: disc; }
.legal-body ol.lg-list { list-style: decimal; }
.legal-body .lg-list li { color: var(--text-muted); padding-left: .2em; }
.legal-body .lg-list li::marker { color: var(--blue-400); }
.legal-body .lg-list .lg-list { margin-top: .5em; }

.legal-body .lg-quote {
  margin-inline: 0;
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--blue-400);
}
.legal-body .lg-quote p { color: var(--text); }

.legal-body .lg-rule { border: 0; border-top: 1px solid var(--line); margin-block: 2em; }

.legal-body .lg-table-wrap { overflow-x: auto; border-radius: var(--r-md); border: 1px solid var(--line); }
.legal-body .lg-table { width: 100%; border-collapse: collapse; font-size: .875rem; min-width: 460px; }
.legal-body .lg-table th {
  text-align: left;
  padding: 12px 14px;
  background: var(--paper-100);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: .78rem;
  letter-spacing: .01em;
  color: var(--text-strong);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.legal-body .lg-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  color: var(--text-muted);
  vertical-align: top;
  line-height: 1.55;
}
.legal-body .lg-table tr:last-child td { border-bottom: 0; }
.legal-body .lg-table tbody tr:nth-child(even) { background: var(--paper-50); }

/* --- unfilled client placeholders --- */
.legal-body mark.todo {
  background: rgba(245, 158, 11, .16);
  color: #92400E;
  border-bottom: 1px dashed rgba(245, 158, 11, .7);
  padding: .06em .3em;
  border-radius: 3px;
  font-size: .94em;
  font-weight: 500;
}

/* --- intro callout --- */
.legal-intro {
  padding: clamp(20px, 2.4vw, 28px);
  border-radius: var(--r-lg);
  background: linear-gradient(160deg, #F4F7FF, #FBFCFF);
  border: 1px solid #DDE4FB;
  margin-bottom: 40px;
}
.legal-intro p {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.65;
  color: var(--text);
}
.legal-intro p + p { margin-top: .8em; }

/* --- sibling document links --- */
.legal-siblings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.legal-sibling {
  display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: center;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--paper);
  transition: border-color .3s, transform .35s var(--ease-out), box-shadow .35s;
}
.legal-sibling svg { width: 18px; height: 18px; color: var(--blue-500); }
.legal-sibling .ci {
  width: 36px; height: 36px; border-radius: var(--r-xs);
  display: grid; place-items: center;
  background: rgba(74, 108, 250, .09);
  border: 1px solid rgba(74, 108, 250, .16);
}
.legal-sibling h4 { font-size: .9rem; }
.legal-sibling p { font-size: .76rem; color: var(--text-faint); margin-top: 3px; }
.legal-sibling:hover { border-color: var(--blue-400); transform: translateY(-3px); box-shadow: var(--shadow-md); }
@media (max-width: 780px) { .legal-siblings { grid-template-columns: minmax(0, 1fr); } }


/* APP 5 collection notice — sits directly above the submit button */
.collection-notice {
  padding: 18px 20px;
  border-radius: var(--r-md);
  background: var(--paper-100);
  border: 1px solid var(--line);
}
.collection-notice h5 { font-size: .82rem; color: var(--text-strong); }
.collection-notice p {
  font-size: .78rem;
  line-height: 1.6;
  color: var(--text-muted);
  margin-top: 8px;
}
.collection-notice a { color: var(--blue-600); text-decoration: underline; text-underline-offset: 2px; }
.form-success span { line-height: 1.55; }
.form-success a { color: inherit; text-decoration: underline; font-weight: 600; }

/* ==========================================================================
   Legal TOC — must not outgrow a laptop viewport
   ========================================================================== */
@media (min-width: 941px) {
  .legal-toc ol {
    max-height: calc(100vh - var(--nav-h) - 90px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
    scrollbar-width: thin;
  }
}

/* Wide tables inside a document need a visible edge so it is obvious they scroll */
.legal-body .lg-table-wrap {
  position: relative;
  background:
    linear-gradient(to right, var(--paper) 30%, rgba(255,255,255,0)) left / 34px 100% no-repeat,
    linear-gradient(to left, var(--paper) 30%, rgba(255,255,255,0)) right / 34px 100% no-repeat,
    radial-gradient(farthest-side at 0 50%, rgba(10,16,32,.14), rgba(0,0,0,0)) left / 14px 100% no-repeat,
    radial-gradient(farthest-side at 100% 50%, rgba(10,16,32,.14), rgba(0,0,0,0)) right / 14px 100% no-repeat;
  background-attachment: local, local, scroll, scroll;
}

/* ==========================================================================
   Print — the legal pages in particular get printed and filed
   ========================================================================== */
@media print {
  .site-header, .site-footer, .page-loader, .hero-canvas,
  .legal-toc, .legal-siblings, .cta-band, .nav-toggle { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .hero, .legal-hero {
    background: none !important;
    color: #000;
    padding: 0 0 12pt;
    border-bottom: 1pt solid #999;
  }
  .hero h1, .legal-hero h1, .hero .lede, .legal-meta { color: #000 !important; }
  .pill { border-color: #999; color: #000; }
  .section { padding-block: 12pt; }
  .legal-layout { display: block; }
  .legal-body { max-width: none; }
  .legal-body .lg-h2 { page-break-after: avoid; break-after: avoid; }
  .legal-body .lg-table-wrap { background: none; border: 1pt solid #999; }
  .legal-body .lg-table { min-width: 0; }
  .legal-body a { color: #000; text-decoration: underline; }
  .legal-body a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
  .legal-intro { border: 1pt solid #999; background: none; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/* Cross-page pointer to the canonical delivery process */
.process-pointer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(20px, 3vw, 44px);
  align-items: center;
  padding: clamp(24px, 3vw, 36px);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: linear-gradient(150deg, #F6F8FF, #FFFFFF);
}
.process-pointer .lede { color: var(--text-muted); }
@media (max-width: 780px) {
  .process-pointer { grid-template-columns: minmax(0, 1fr); }
  .process-pointer .btn { justify-self: start; }
}