/* earthgrid.css  -  the look of aiassemblylanguage.com, taken from earthgrid.com: a night sky over standing stones,
   the Earthgrid network sphere, Earthgrid blue (#2770E3) running into cyan (#4CC6F7), and the orange of "grid" (#F7790A)
   for the small marks. Archivo for headlines and the italic quiet words, Nunito Sans for reading.
   A copy of the circuit look (itself a copy of ancient), so every section in the library works the same way.
   Fonts are served from grid/fonts (SIL Open Font License). Nothing loads from another site. */

@font-face{font-family:"Archivo";font-style:normal;font-weight:400;font-display:swap;src:url("../../../fonts/archivo-400.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:600;font-display:swap;src:url("../../../fonts/archivo-600.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:800;font-display:swap;src:url("../../../fonts/archivo-800.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:italic;font-weight:500;font-display:swap;src:url("../../../fonts/archivo-500-italic.woff2") format("woff2")}
@font-face{font-family:"Nunito Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../../../fonts/nunito-sans-400.woff2") format("woff2")}
@font-face{font-family:"Nunito Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../../../fonts/nunito-sans-600.woff2") format("woff2")}
@font-face{font-family:"Nunito Sans";font-style:normal;font-weight:700;font-display:swap;src:url("../../../fonts/nunito-sans-700.woff2") format("woff2")}
/* end fonts */

:root {
  --eg-bg:        #0a0f18;
  --eg-bg-alt:    #0f1624;
  --eg-surface:   #151e2d;
  --eg-text:      #dde6f2;
  --eg-muted:     #a8b6c9;
  --eg-heading:   #ffffff;
  --eg-accent:    #4CC6F7;
  --eg-accent-ink:#05080f;
  --eg-accent-2:  #2770E3;
  --eg-line:      rgba(76, 198, 247, .22);
  --eg-header-bg: rgba(5, 8, 15, .94);
  --eg-header-text:#eef3f9;
  --eg-inverse-bg:#05080f;
  --eg-inverse-text:#eef3f9;
  --eg-footer-bg: #05080f;
  --eg-footer-text:#b9cbe0;
  --eg-hero-overlay: rgba(5, 8, 15, .35);
  --eg-radius:    18px;
  --eg-shadow:    0 14px 40px rgba(0, 0, 0, .35);
  --eg-font-head: "Archivo", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --eg-font-display: "Archivo", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --eg-font-body: "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --eg-clay:      #2770E3;
  --eg-terra:     #2770E3;
  --eg-sand:      #f3e6d6;
  --eg-bone:      #eef3f9;
  --eg-gold-l:    #8fdcfb;
  --eg-river:     #1a3f86;
  --eg-measure:   34em;
}

/* base ------------------------------------------------------------------- */
body.eg { font-size: 1.125rem; line-height: 1.72; }
body.eg::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: url("../../../images/grain.png"); background-size: 160px; opacity: .55; mix-blend-mode: soft-light; }
body.eg > main, body.eg > footer { position: relative; z-index: 1; }
body.eg > .eg-header { position: sticky; z-index: 1000; }
h1, h2, h3, h4 { font-weight: 400; letter-spacing: .005em; }
.eg-title { font-size: clamp(1.9rem, 1.3rem + 2.6vw, 3rem); }
.eg-eyebrow { font-family: var(--eg-font-body); font-size: .78rem; letter-spacing: .22em; color: var(--eg-accent); }
.eg-lead { color: var(--eg-muted); font-size: 1.2rem; max-width: var(--eg-measure); margin-left: auto; margin-right: auto; }
.eg-left .eg-lead, .eg-lead.eg-left { margin-left: 0; }
.eg-body, .eg-text p { max-width: var(--eg-measure); margin-left: auto; margin-right: auto; }
.eg-text.eg-left p { margin-left: 0; }
a { color: var(--eg-gold-l); text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: #fff; }
.eg-sr, .eg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* buttons: gold primary, outlined secondary ---------------------------------- */
.eg-btn { border-radius: 999px; font-family: var(--eg-font-body); letter-spacing: .08em; text-decoration: none; }
.eg-btn-primary { background: var(--eg-accent); border-color: var(--eg-accent); color: var(--eg-accent-ink); }
.eg-btn-primary:hover, .eg-btn-primary:focus { background: var(--eg-gold-l); border-color: var(--eg-gold-l); color: var(--eg-accent-ink); filter: none; }
.eg-btn-ghost { color: var(--eg-bone); border-color: rgba(234, 243, 251, .55); }
.eg-btn-ghost:hover, .eg-btn-ghost:focus { background: rgba(234, 243, 251, .12); color: #fff; border-color: var(--eg-bone); }
.eg-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }

/* header ------------------------------------------------------------------ */
.eg-header { border-bottom: 1px solid var(--eg-line); box-shadow: none; }
.eg-header.is-scrolled { box-shadow: 0 8px 28px rgba(0, 0, 0, .45); }
.eg-brand { font-family: var(--eg-font-head); font-size: 1.5rem; letter-spacing: .03em; color: var(--eg-bone); }
.eg-brand-name::after { content: ""; display: inline-block; width: .5em; height: .5em; margin-left: .45em; border-radius: 50%; background: var(--eg-accent); vertical-align: .1em; }
.eg-nav a:not(.eg-btn) { color: var(--eg-header-text); text-decoration: none; }
.eg-nav a:not(.eg-btn):hover { color: var(--eg-gold-l); }
.eg-nav a.is-current { box-shadow: inset 0 -2px 0 var(--eg-accent); }
.eg-nav a.eg-btn { display: inline-block; width: auto; padding: .55rem 1.15rem; border: 2px solid transparent; border-radius: 999px; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; text-align: center; }
.eg-nav a.eg-btn-primary { background: var(--eg-accent); border-color: var(--eg-accent); color: var(--eg-accent-ink); }
.eg-nav a.eg-btn-primary:hover { background: var(--eg-gold-l); border-color: var(--eg-gold-l); color: var(--eg-accent-ink); }
.eg-nav a.eg-btn-ghost { background: transparent; border-color: rgba(234,243,251,.55); color: var(--eg-bone); }
.eg-nav a.eg-btn-ghost:hover { background: rgba(234,243,251,.12); color: #fff; }
.eg-nav .eg-nav-cta2 { margin-left: .6rem; }
.eg-nav .eg-nav-cta { margin-left: .5rem; }
@media (max-width: 960px) {
  .eg-nav a.eg-nav-cta2, .eg-nav a.eg-nav-cta { display: block; width: 100%; margin: .8rem 0 0; padding: .8rem 1rem; }
}

/* tones: default dark earth, alt deeper earth, dark night, bone, sand, accent clay */
.eg-section { padding: clamp(3.4rem, 2.2rem + 5vw, 6.5rem) 0; position: relative; }
.eg-tone-bone { --eg-text:#1d2c40; --eg-muted:#45576e; --eg-heading:#0a0f18; --eg-accent:#2770E3; --eg-line:rgba(10,15,24,.2); --eg-surface:#f5f9fd; background: var(--eg-bone); color: var(--eg-text); }
.eg-tone-bone a { color: #2770E3; }
.eg-tone-bone a:hover { color: #0b2a5c; }
.eg-tone-bone .eg-btn-primary { background: #2770E3; border-color: #2770E3; color: #fff; }
.eg-tone-bone .eg-btn-primary:hover { background: #1f5fc9; border-color: #1f5fc9; color: #fff; }
.eg-tone-bone .eg-btn-ghost { color: #0a0f18; border-color: rgba(10,15,24,.5); }
.eg-tone-bone .eg-btn-ghost:hover { background: rgba(10,15,24,.08); color: #000; }
.eg-tone-sand { --eg-text:#1d2c40; --eg-muted:#45576e; --eg-heading:#0a0f18; --eg-accent:#2770E3; --eg-line:rgba(10,15,24,.2); --eg-surface:#ece2d4; background: var(--eg-sand); color: var(--eg-text); }
.eg-tone-sand a { color: #2770E3; }
.eg-tone-alt { background: var(--eg-bg-alt); }
.eg-tone-dark { background: var(--eg-inverse-bg); }
.eg-tone-accent { background: var(--eg-clay); color: var(--eg-bone); }
.eg-tone-accent .eg-eyebrow { color: var(--eg-sand); }
.eg-tone-accent .eg-lead { color: #e6f1ff; }
.eg-tone-accent .eg-btn-primary { background: var(--eg-bone); border-color: var(--eg-bone); color: #0b2a5c; }
.eg-tone-accent .eg-btn-primary:hover { background: #fff; border-color: #fff; color: #0b2a5c; }
.eg-tone-accent .eg-btn-ghost { color: var(--eg-bone); border-color: rgba(234,243,251,.7); }
.eg-tone-accent a:not(.eg-btn) { color: #fff; }

/* band: a strip of circuit traces ----------------------------------------------- */
.eg-band { height: 64px; background-repeat: repeat-x; background-position: center; background-size: auto 100%; opacity: .9; background-color: transparent; border-top: 1px solid var(--eg-line); border-bottom: 1px solid var(--eg-line); background-color: #05080f; }

/* scene: layered circuit hero ------------------------------------------------------ */
.eg-scene { min-height: min(92vh, 880px); align-items: flex-end; padding: 0; background: #05080f; isolation: isolate; }
.eg-scene-layers { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.eg-scene-layer { position: absolute; left: 0; top: -4%; width: 100%; height: 108%; object-fit: cover; object-position: 50% 70%; will-change: transform; transform: scale(1.06); }
.eg-scene::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(5,8,15,.28) 0%, rgba(5,8,15,0) 30%, rgba(5,8,15,.12) 52%, rgba(5,8,15,.78) 100%); }
.eg-scene .eg-hero-in { z-index: 2; padding-top: 7rem; padding-bottom: clamp(3rem, 8vh, 6rem); }
.eg-scene .eg-hero-title { max-width: 14em; font-size: clamp(2.3rem, 1.2rem + 4.6vw, 4.6rem); line-height: 1.1; text-shadow: 0 2px 24px rgba(0,0,0,.5); }
.eg-scene .eg-hero-text { max-width: 30em; font-size: clamp(1.1rem, 1rem + .5vw, 1.35rem); text-shadow: 0 1px 14px rgba(0,0,0,.55); }
.eg-scene .eg-eyebrow { color: var(--eg-gold-l); }

/* pullquote ------------------------------------------------------------------------ */
.eg-pull { font-family: var(--eg-font-head); font-size: clamp(1.7rem, 1.1rem + 2.8vw, 3rem); line-height: 1.25; color: var(--eg-heading); max-width: 18em; margin: 0 auto 1.2rem; }
.eg-sec-pullquote .eg-body { color: var(--eg-muted); }

/* scroller: sideways scrolling region ----------------------------------------------- */
.eg-sec-scroller { overflow: hidden; }
.eg-sec-scroller .eg-head { margin-bottom: 1.6rem; }
.eg-scroller-view { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; padding: .6rem max(20px, calc((100vw - var(--eg-wrap)) / 2 + 20px)) 1.4rem; scroll-padding-left: max(20px, calc((100vw - var(--eg-wrap)) / 2 + 20px)); scrollbar-width: thin; scrollbar-color: var(--eg-accent) transparent; }
.eg-scroller-view:focus-visible { outline-offset: -3px; }
.eg-scroller-track { display: flex; gap: 20px; width: max-content; }
.eg-panel { flex: 0 0 min(78vw, 330px); scroll-snap-align: start; display: flex; flex-direction: column; padding: 1.7rem 1.6rem 1.8rem; background: var(--eg-surface); border: 1px solid var(--eg-line); border-radius: var(--eg-radius); box-shadow: var(--eg-shadow); min-height: 10rem; }
.eg-tone-bone .eg-panel { box-shadow: 0 10px 30px rgba(10,15,24,.12); }
.eg-panel-art { width: 120px; margin: 0 0 1rem; }
.eg-panel-art img { width: 100%; height: auto; }
.eg-panel-kicker { font-size: .78rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--eg-accent); margin-bottom: .5rem; }
.eg-panel-title { font-size: 1.45rem; margin-bottom: .6rem; }
.eg-panel p { color: var(--eg-muted); margin: 0 0 .7rem; font-size: 1.02rem; }
.eg-scroller-ui { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.eg-scroller-btns { display: flex; gap: .6rem; }
.eg-scroller-btn { width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid var(--eg-line); background: transparent; color: var(--eg-heading); font: 700 1.2rem/1 var(--eg-font-body); cursor: pointer; transition: background-color .2s, border-color .2s; }
.eg-scroller-btn:hover:not(:disabled) { background: var(--eg-accent); border-color: var(--eg-accent); color: var(--eg-accent-ink); }
.eg-scroller-btn:disabled { opacity: .35; cursor: default; }
.eg-scroller:not(.is-scrollable) .eg-scroller-btns { display: none; }
.eg-scroller-hint { margin: 0; font-size: .95rem; color: var(--eg-muted); }

/* story: sticky picture beside scrolling steps ----------------------------------------- */
.eg-story { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.eg-story-art { display: none; }
.eg-story-steps { list-style: none; margin: 0; padding: 0; }
.eg-story-step { padding: 1.8rem 0 2.2rem; border-top: 1px solid var(--eg-line); }
.eg-story-inline { max-width: 220px; margin-bottom: 1rem; }
.eg-story-inline img { width: 100%; height: auto; }
.eg-story-title { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); margin-bottom: .6rem; }
.eg-story-step p { color: var(--eg-muted); max-width: 28em; font-size: 1.12rem; }
@media (min-width: 900px) {
  .eg-story { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 4rem; align-items: start; }
  .eg-story-art { display: block; position: sticky; top: calc(var(--eg-header-h) + 28px); }
  .eg-story-frame { position: relative; width: 100%; aspect-ratio: 1 / 1; max-width: 480px; }
  .eg-story-pic { position: absolute; inset: 0; opacity: 0; transform: translateY(14px) scale(.97); transition: opacity .6s var(--eg-ease), transform .6s var(--eg-ease); }
  .eg-story-pic.is-active { opacity: 1; transform: none; }
  .eg-story-pic img { width: 100%; height: 100%; object-fit: contain; }
  .eg-story-inline { display: none; }
  .eg-story-step { min-height: 58vh; display: flex; flex-direction: column; justify-content: center; opacity: .66; transition: opacity .5s; }
  .eg-story-step.is-current, .eg-story-step:first-child { opacity: 1; }
  .js .eg-story-step.is-current ~ .eg-story-step:first-child { opacity: 1; }
}

/* split and cards: soft earth, round corners ---------------------------------------- */
.eg-split-pic img { box-shadow: var(--eg-shadow); border-radius: var(--eg-radius); }
.eg-split-pic.eg-cover img { box-shadow: 0 24px 60px rgba(0,0,0,.5); border-radius: 6px; max-width: 420px; margin: 0 auto; }
.eg-bullets li::before { background: var(--eg-accent); }
.eg-card, .eg-quote { border-radius: var(--eg-radius); }
.eg-stat-n { color: var(--eg-accent); }
.eg-blockquote { max-width: 34em; margin: 1.2rem auto; padding: 1.2rem 1.6rem; border-left: 3px solid var(--eg-accent); background: rgba(39,112,227,.07); border-radius: 0 var(--eg-radius) var(--eg-radius) 0; text-align: left; }
.eg-blockquote p { font-family: var(--eg-font-head); font-size: 1.25rem; line-height: 1.55; color: var(--eg-heading); margin: 0 0 .9rem; }
.eg-blockquote p:last-child { margin: 0; }
.eg-note { color: var(--eg-muted); }
.eg-aside { max-width: 34em; margin: 0 auto; padding: 1.4rem 1.6rem; border: 1px dashed var(--eg-line); border-radius: var(--eg-radius); }

/* forms ----------------------------------------------------------------------------- */
.eg-form { max-width: 560px; margin: 0 auto; text-align: left; }
.eg-field { display: block; margin-bottom: 1.1rem; }
.eg-field > span, .eg-fieldset legend { display: block; margin-bottom: .35rem; font-weight: 600; font-size: .98rem; color: var(--eg-heading); }
.eg-field em { font-weight: 400; font-style: normal; color: var(--eg-muted); }
.eg-field input, .eg-field textarea, .eg-quiz-ta, .eg-quiz-other { width: 100%; padding: .8rem 1rem; font: inherit; color: var(--eg-heading); background: #0b111c; border: 1.5px solid rgba(76,198,247,.35); border-radius: 12px; }
.eg-tone-bone .eg-field input, .eg-tone-bone .eg-field textarea { background: #ffffff; color: #0a0f18; border-color: rgba(10,15,24,.35); }
.eg-field input:focus, .eg-field textarea:focus, .eg-quiz-ta:focus, .eg-quiz-other:focus { outline: 3px solid var(--eg-accent); outline-offset: 1px; border-color: var(--eg-accent); }
.eg-field input[aria-invalid="true"] { border-color: #fcd34d; }
.eg-fieldset { border: 0; margin: 0 0 1.2rem; padding: 0; }
.eg-radio, .eg-check, .eg-quiz-opt { display: flex; align-items: flex-start; gap: .75rem; cursor: pointer; }
.eg-radio { margin-bottom: .5rem; }
.eg-check { margin: 1.2rem 0 1.2rem; font-size: 1rem; }
.eg-radio input, .eg-check input, .eg-quiz-opt input { flex: none; width: 1.3rem; height: 1.3rem; margin-top: .22rem; accent-color: var(--eg-accent); }
.eg-err { margin: .2rem 0 .9rem; color: #fcd34d; font-weight: 600; font-size: .95rem; }
.eg-tone-bone .eg-err { color: #2770E3; }
.eg-thanks { max-width: 560px; margin: 0 auto 1.4rem; padding: 1.2rem 1.4rem; border: 1px solid var(--eg-accent); border-radius: var(--eg-radius); background: rgba(39,112,227,.08); }
.eg-thanks p { margin: 0 0 .6rem; }
.eg-thanks p:last-child { margin: 0; }
.eg-connect .eg-head { max-width: 560px; margin-left: auto; margin-right: auto; }
.eg-connect .eg-note { text-align: center; }

/* quiz --------------------------------------------------------------------------------- */
.eg-quiz-head { margin-bottom: 2rem; }
.eg-fair { max-width: 34em; margin: 1.2rem auto 0; padding: 1rem 1.3rem; border: 1px solid var(--eg-line); border-radius: var(--eg-radius); color: var(--eg-text); font-size: 1.02rem; text-align: left; }
.eg-quiz { max-width: 680px; margin: 0 auto; }
.eg-quiz-card { background: var(--eg-surface); border: 1px solid var(--eg-line); border-radius: 22px; padding: clamp(1.4rem, 1rem + 2vw, 2.4rem); box-shadow: var(--eg-shadow); }
.eg-progress { height: 8px; border-radius: 99px; background: rgba(76,198,247,.18); overflow: hidden; }
.eg-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--eg-terra), var(--eg-accent)); border-radius: 99px; transition: width .4s var(--eg-ease); }
.eg-quiz-count { margin: .6rem 0 0; font-size: .85rem; color: var(--eg-muted); letter-spacing: .06em; }
.eg-quiz-stage-title { margin: .2rem 0 1rem; font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--eg-accent); }
.eg-quiz-thanks { margin: 0 0 1rem; padding: .7rem 1rem; border-radius: 12px; background: rgba(39,112,227,.12); color: var(--eg-heading); }
.eg-quiz-q { font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2rem); line-height: 1.3; margin: 0 0 .8rem; }
.eg-quiz-q:focus { outline: none; }
.eg-quiz-hint { margin: -.3rem 0 1rem; color: var(--eg-muted); font-size: .98rem; }
.eg-quiz-fs { border: 0; padding: 0; margin: 0 0 1rem; }
.eg-quiz-opt { padding: .85rem 1rem; margin-bottom: .6rem; min-height: 52px; align-items: center; border: 1.5px solid rgba(76,198,247,.3); border-radius: 14px; background: rgba(0,0,0,.12); transition: border-color .2s, background-color .2s; }
.eg-quiz-opt:hover { border-color: var(--eg-accent); }
.eg-quiz-opt:has(input:checked) { border-color: var(--eg-accent); background: rgba(39,112,227,.14); }
.eg-quiz-opt input { margin-top: 0; }
.eg-quiz-other { margin: 0 0 .8rem; }
.eg-quiz-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.4rem; }
.eg-quiz-result .eg-quiz-q { margin-bottom: 1rem; }
.eg-quiz-sending, .eg-quiz-nojs { text-align: center; color: var(--eg-muted); }
.eg-quiz-privacy { text-align: center; margin-top: 1.4rem; }

/* footer ------------------------------------------------------------------------------ */
.eg-footer { background: var(--eg-footer-bg); color: var(--eg-footer-text); border-top: 1px solid var(--eg-line); }
.eg-footer a { color: var(--eg-sand); }
.eg-footer .eg-brand { color: var(--eg-bone); }
.eg-foot-h { font-family: var(--eg-font-body); font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--eg-accent); }
.eg-foot-base { border-top: 1px solid var(--eg-line); }

/* sticky action bar on phones ---------------------------------------------------------- */
.eg-actionbar { display: none; }
@media (max-width: 960px) {
  .eg-actionbar { display: flex; gap: .6rem; position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; padding: .6rem 14px calc(.6rem + env(safe-area-inset-bottom, 0px)); background: rgba(5,8,15,.96); border-top: 1px solid var(--eg-line); }
  .eg-actionbar .eg-btn { flex: 1 1 0; padding: .7rem .4rem; font-size: .76rem; letter-spacing: .05em; }
  .eg-footer { padding-bottom: 4.6rem; }
}

/* motion: slow fades only; none when the visitor asks for less ------------------------ */
.eg-reveal { opacity: 0; transform: translateY(14px); transition: opacity .8s var(--eg-ease), transform .8s var(--eg-ease); }
.eg-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .eg-reveal, .eg-story-pic, .eg-progress span { transition: none; }
  .eg-scene-layer { transform: none !important; }
}

/* drawn art has no card around it */
.eg-split-pic img[src*=".svg"] { box-shadow: none; border-radius: 0; max-width: 420px; margin: 0 auto; }


/* what this look shares with circuit ------------------------------------------------- */
body.eg { background: var(--eg-bg); }
body.eg::before { background: linear-gradient(rgba(76,198,247,.045) 1px, transparent 1px) 0 0 / 44px 44px, linear-gradient(90deg, rgba(76,198,247,.045) 1px, transparent 1px) 0 0 / 44px 44px; opacity: 1; mix-blend-mode: normal; }
h1, h2, h3, h4 { font-weight: 800; letter-spacing: -.012em; }
.eg-title { line-height: 1.12; }
.eg-eyebrow { font-weight: 700; text-transform: uppercase; }
.eg-brand { font-family: var(--eg-font-head); font-weight: 800; font-size: 1.3rem; letter-spacing: -.01em; }
.eg-brand-name::after { box-shadow: 0 0 10px 2px rgba(39,112,227,.7); }
.eg-scene .eg-hero-title { font-family: var(--eg-font-display); font-weight: 400; text-transform: uppercase; letter-spacing: .01em; line-height: 1.02; max-width: 12em; text-shadow: 0 0 30px rgba(39,112,227,.25), 0 2px 18px rgba(0,0,0,.6); }
.eg-scene::after { background: linear-gradient(180deg, rgba(5,8,15,.2) 0%, rgba(5,8,15,0) 34%, rgba(5,8,15,.2) 55%, rgba(5,8,15,.86) 100%); }
.eg-pull { font-family: var(--eg-font-head); font-style: italic; font-weight: 500; }
.eg-blockquote p { font-style: italic; font-weight: 500; }
.eg-btn-primary { box-shadow: 0 0 0 0 rgba(39,112,227,0); transition: box-shadow .25s, background-color .2s; }
.eg-btn-primary:hover, .eg-btn-primary:focus { box-shadow: 0 0 22px rgba(39,112,227,.45); }
.eg-nav a.eg-btn-primary { color: var(--eg-accent-ink); }
:root { --eg-accent-ink: #ffffff; }
.eg-band { height: 56px; }
.eg-panel, .eg-quiz-card, .eg-card { border-color: rgba(76,198,247,.22); }
.eg-split-pic.eg-cover img { box-shadow: 0 0 0 1px rgba(76,198,247,.25), 0 24px 70px rgba(39,112,227,.18), 0 24px 60px rgba(0,0,0,.55); }
.eg-tone-dark { background: radial-gradient(ellipse at 50% 0%, rgba(39,112,227,.10), transparent 60%), var(--eg-inverse-bg); }

/* author portraits: a round photo with a thin glow ring (split sections with pic_class "eg-portrait") */
.eg-split-pic.eg-portrait img { display: block; width: 100%; max-width: 280px; aspect-ratio: 1; object-fit: cover; margin: 0 auto; border-radius: 50%; box-shadow: 0 0 0 1px rgba(76,198,247,.35), 0 0 0 10px rgba(39,112,227,.07), 0 24px 60px rgba(0,0,0,.5); }


/* earthgrid: what makes this look its own ------------------------------------------------ */
:root { --eg-orange: #F7790A; --eg-orange-l: #ffa04d; --eg-blue: #2770E3; --eg-cyan: #4CC6F7; --eg-accent-ink: #ffffff; }
body.eg::before { background: radial-gradient(ellipse at 50% -10%, rgba(39,112,227,.12), transparent 55%); opacity: 1; mix-blend-mode: normal; }
.eg-eyebrow { color: var(--eg-orange); }
.eg-scene .eg-eyebrow { color: var(--eg-orange-l); }
.eg-brand-name::after { background: var(--eg-orange); box-shadow: 0 0 10px 2px rgba(247,121,10,.6); }
.eg-btn-primary, .eg-nav a.eg-btn-primary { background: var(--eg-blue); border-color: var(--eg-blue); color: #fff; }
.eg-btn-primary:hover, .eg-btn-primary:focus, .eg-nav a.eg-btn-primary:hover { background: #3a86ee; border-color: #3a86ee; color: #fff; box-shadow: 0 0 22px rgba(76,198,247,.45); }
.eg-nav a.eg-btn-primary { color: #fff; }
.eg-scene .eg-hero-title { font-family: var(--eg-font-head); font-weight: 800; text-transform: none; letter-spacing: -.02em; line-height: 1.04; max-width: 13em; text-shadow: 0 0 30px rgba(39,112,227,.35), 0 2px 18px rgba(0,0,0,.7); }
.eg-scene .eg-scene-layer { object-position: 50% 78%; }
.eg-tone-accent { background: linear-gradient(120deg, #1d56b8, var(--eg-blue) 55%, #2f8fd8); }
.eg-tone-accent .eg-eyebrow { color: #ffd0a3; }
.eg-tone-accent .eg-btn-primary { background: #fff; border-color: #fff; color: #0b2a5c; }
.eg-tone-accent .eg-btn-primary:hover { background: #ffe9d6; border-color: #ffe9d6; color: #0b2a5c; }
.eg-tone-bone .eg-eyebrow, .eg-tone-sand .eg-eyebrow { color: #c25d00; }
.eg-tone-bone .eg-btn-primary, .eg-tone-sand .eg-btn-primary { background: var(--eg-blue); border-color: var(--eg-blue); color: #fff; }
.eg-panel, .eg-quiz-card, .eg-card { background: rgba(21,30,45,.82); backdrop-filter: blur(6px); }
.eg-pull em, .eg-title em { color: var(--eg-orange-l); font-style: italic; }
.eg-band { background-color: #05080f; border-color: rgba(247,121,10,.35); }
.eg-blockquote { border-left-color: var(--eg-orange); }
/* a photograph behind the scene headline: darken the side the words sit on */
.eg-scene::after { background: linear-gradient(90deg, rgba(5,8,15,.8) 0%, rgba(5,8,15,.5) 50%, rgba(5,8,15,.12) 100%), linear-gradient(180deg, rgba(5,8,15,.2) 0%, rgba(5,8,15,0) 40%, rgba(5,8,15,.82) 100%); }
.eg-scene .eg-eyebrow { color: #ffb066; text-shadow: 0 1px 10px rgba(0,0,0,.85); }