/* meagancrawford.com — v2 — 23 August 2026
   Built on the Magic Space Sprinkles visual identity:
   moody violet nebula, starfield, one hot gold accent. */
:root{
  --space:#06040f; --space-2:#070512; --panel:#0C0820;
  --violet:#5a3fc8; --violet-2:#6a5ac4; --violet-3:#4a37b0; --violet-lt:#B9A2F2;
  --lilac:#C6BEE6; --gold:#E9C08A; --gold-dk:#B8862B;
  --pink:#C77BB0; --blue:#6FA8D9; --amber:#E8A24A;
  --text:#ECEAF6; --cream:#F4F1E9;
  --rule:rgba(185,162,242,.22); --rule-gold:rgba(233,192,138,.34);
  --measure:34rem; --pad:clamp(1.25rem,5vw,3.5rem);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{margin:0;background:var(--space);color:var(--text);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:1.0625rem;line-height:1.62;-webkit-font-smoothing:antialiased;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(38rem 30rem at 76% 8%, rgba(90,63,200,.42), transparent 68%),
    radial-gradient(30rem 26rem at 12% 34%, rgba(74,55,176,.34), transparent 70%),
    radial-gradient(34rem 24rem at 62% 78%, rgba(199,123,176,.16), transparent 72%),
    linear-gradient(180deg,#06040f 0%,#070512 55%,#06040f 100%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.62;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%, #fff, transparent),
    radial-gradient(1px 1px at 28% 62%, #E9C08A, transparent),
    radial-gradient(1.2px 1.2px at 44% 12%, #fff, transparent),
    radial-gradient(1px 1px at 58% 44%, #C6BEE6, transparent),
    radial-gradient(1.5px 1.5px at 71% 26%, #fff, transparent),
    radial-gradient(1px 1px at 83% 66%, #B9A2F2, transparent),
    radial-gradient(1.2px 1.2px at 91% 14%, #fff, transparent),
    radial-gradient(1px 1px at 8% 82%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 36% 88%, #E9C08A, transparent),
    radial-gradient(1px 1px at 66% 92%, #fff, transparent),
    radial-gradient(1px 1px at 22% 40%, #fff, transparent),
    radial-gradient(1.1px 1.1px at 52% 70%, #fff, transparent)}
a{color:inherit} img{max-width:100%;display:block}
.eyebrow{font-family:"Michroma",sans-serif;font-size:.6875rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold);margin:0 0 1.1rem;line-height:1.7}
h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;letter-spacing:-.01em;margin:0}
h1{font-size:clamp(2.6rem,7vw,4.5rem);line-height:1.02}
h2{font-size:clamp(1.85rem,4vw,2.75rem);line-height:1.1;margin:0 0 1.1rem}
h3{font-size:1.3rem;line-height:1.25;margin:0 0 .5rem}
p{margin:0 0 1.15rem}
.lede{font-size:1.3rem;line-height:1.55;color:#F2EFFA}
.star{color:var(--gold);font-style:normal}
.titles{margin:1.6rem 0 0;padding:0;list-style:none;font-size:.9375rem;line-height:1.85}
.titles li:nth-child(1){color:var(--gold)}
.titles li:nth-child(2){color:var(--lilac)}
.titles li:nth-child(3){color:var(--violet-lt)}
.wrap{max-width:none;margin:0;padding:0 var(--pad)}
header.site{position:sticky;top:0;z-index:50;background:#06040f;
  border-bottom:1px solid var(--rule)}
.bar{display:flex;align-items:baseline;justify-content:space-between;gap:1.25rem;
  max-width:none;margin:0;padding:.85rem var(--pad)}
.mark{font-family:"Cormorant Garamond",serif;font-size:1.2rem;letter-spacing:.02em;
  text-decoration:none;white-space:nowrap}
nav.site ul{display:flex;flex-wrap:wrap;gap:1.05rem;list-style:none;margin:0;padding:0;justify-content:flex-end}
nav.site a{font-size:.7813rem;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;
  color:var(--lilac);padding-bottom:2px;border-bottom:1px solid transparent}
nav.site a:hover,nav.site a:focus-visible{color:var(--text);border-bottom-color:var(--gold)}
nav.site a[aria-current="page"]{color:var(--gold);border-bottom-color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.rail{display:none}
@media (min-width:1400px){
  .wrap{padding-left:17rem}
  .rail{display:block;position:fixed;left:1.5rem;top:50%;transform:translateY(-50%);
    width:13rem;z-index:30;padding:1rem .9rem;background:rgba(6,4,15,.9);
    border:1px solid var(--rule)}
  .rail ol{list-style:none;margin:0;padding:0} .rail li{margin:0 0 .95rem}
  .rail a{display:grid;grid-template-columns:1.9rem 1fr;gap:.5rem;align-items:baseline;
    font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.16em;text-transform:uppercase;
    text-decoration:none;color:rgba(236,234,246,.4);transition:color .25s ease}
  .rail a:hover,.rail a:focus-visible,.rail a.on{color:var(--text)}
  .rail .n{color:var(--gold);opacity:.5} .rail a.on .n{opacity:1}}
section{padding:clamp(3.5rem,8vw,6rem) 0;border-top:1px solid var(--rule);scroll-margin-top:5rem;position:relative}
section:first-of-type{border-top:0}
section.panel{background:rgba(12,8,32,.72)}
.hero{padding:clamp(4rem,12vw,8.5rem) 0 clamp(3rem,7vw,5rem);border-top:0}
.hero h1{max-width:none}
.hero .rule{width:4.5rem;height:1px;background:var(--gold);margin:2rem 0}
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule);margin-top:2.5rem}
.door{background:rgba(6,4,15,.86);padding:1.6rem 1.4rem 1.4rem;text-decoration:none;display:block;
  transition:background .25s ease}
.door:hover,.door:focus-visible{background:rgba(90,63,200,.22)}
.door .k{font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:.9rem}
.door h3{font-size:1.5rem;margin-bottom:.35rem}
.door p{font-size:.9375rem;color:var(--lilac);margin:0;max-width:none}
.lines{margin:0;padding:0;list-style:none}
.lines li{font-family:"Cormorant Garamond",serif;font-size:clamp(1.4rem,3vw,2rem);line-height:1.3;
  padding:1.05rem 0 1.05rem 1.4rem;border-left:2px solid var(--gold);margin-bottom:1rem}
.record{list-style:none;margin:0;padding:0}
.record li{display:grid;grid-template-columns:13rem 1fr;gap:2rem;padding:1.1rem 0;border-top:1px solid var(--rule)}
.record li:first-child{border-top:0}
.record .role{font-family:"Michroma",sans-serif;font-size:.625rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold);padding-top:.28rem}
.record p{margin:0;font-size:.9688rem}
@media (max-width:640px){.record li{grid-template-columns:1fr;gap:.35rem}}
.rocket-wrap{display:grid;grid-template-columns:19rem 1fr;gap:clamp(2rem,5vw,5rem);
  align-items:start;margin-top:2rem}
@media (max-width:820px){.rocket-wrap{grid-template-columns:1fr}}
.rocket{width:100%;max-width:19rem;height:auto}
.rocket-cap{font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);margin:.9rem 0 0;text-align:center;max-width:19rem}
.layer{padding:1.6rem 0;border-top:1px solid var(--rule)}
.layer:first-of-type{border-top:0}
.layer .k{font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.18em;
  text-transform:uppercase;display:block;margin-bottom:.7rem}
.layer h3{font-family:"Cormorant Garamond",serif;font-size:1.65rem}
.layer .who{font-size:.875rem;opacity:.8;margin:0}
.k-venture{color:var(--amber)} .k-credit{color:var(--pink)} .k-infra{color:var(--blue)}
.k-ins{color:var(--violet-lt)} .k-data{color:var(--lilac)} .k-exit{color:var(--gold)}
.cal{list-style:none;margin:0;padding:0}
.cal li{display:grid;grid-template-columns:11rem 1fr;gap:2rem;padding:1rem 0;border-top:1px solid var(--rule)}
.cal .when{font-family:"Michroma",sans-serif;font-size:.5938rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold);padding-top:.3rem}
.cal .what{margin:0} .cal .where{display:block;font-size:.875rem;color:var(--lilac)}
@media (max-width:640px){.cal li{grid-template-columns:1fr;gap:.3rem}}
.cite{padding:1.7rem 0;border-top:1px solid var(--rule)}
.cite:first-of-type{border-top:0}
.cite .yr{font-family:"Michroma",sans-serif;font-size:.625rem;letter-spacing:.16em;
  color:var(--gold);display:block;margin-bottom:.6rem}
.cite h3{font-family:"Cormorant Garamond",serif;font-size:1.45rem;line-height:1.2}
.cite .meta{font-size:.9063rem;color:var(--lilac);margin:.4rem 0 0}
.featured{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:1.8rem}
@media (min-width:1100px){.featured{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1440px){.featured{grid-template-columns:repeat(6,1fr)}}
.featured a{display:block;background:rgba(6,4,15,.86);padding:1.35rem 1.2rem;
  text-decoration:none;transition:background .25s ease}
.featured a:hover,.featured a:focus-visible{background:rgba(90,63,200,.22)}
.featured .out{display:block;font-family:"Cormorant Garamond",serif;font-size:1.4rem;
  line-height:1.1;color:var(--text);margin-bottom:.5rem}
.featured a:hover .out,.featured a:focus-visible .out{color:var(--gold)}
.featured .what{display:block;font-size:.8438rem;line-height:1.42;color:var(--lilac)}
.btn{display:inline-block;font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;padding:.8rem 1.5rem;border:1px solid var(--gold);color:var(--gold);
  transition:background .22s ease,color .22s ease}
.btn:hover,.btn:focus-visible{background:var(--gold);color:var(--space)}
.soon{display:inline-block;font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--space);background:var(--gold);padding:.3rem .6rem;
  vertical-align:middle;margin-left:.6rem}
footer.site{border-top:1px solid var(--rule);padding:3rem 0 3.5rem;font-size:.9063rem;background:rgba(6,4,15,.8)}
footer.site .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:2rem}
footer.site h4{font-family:"Michroma",sans-serif;font-size:.5625rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);margin:0 0 .9rem;font-weight:400}
footer.site ul{list-style:none;margin:0;padding:0} footer.site li{margin-bottom:.45rem}
footer.site a{color:var(--lilac);text-decoration:none}
footer.site a:hover,footer.site a:focus-visible{color:var(--text);text-decoration:underline}
footer.site .fine{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--rule);
  font-size:.8125rem;color:rgba(236,234,246,.5)}
@media (max-width:860px){
  .bar{flex-direction:column;align-items:stretch;gap:.5rem;padding-bottom:.6rem}
  nav.site{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  nav.site::-webkit-scrollbar{display:none}
  nav.site ul{flex-wrap:nowrap;justify-content:flex-start;gap:1.05rem;padding-bottom:.15rem}
  nav.site a,nav.site button{font-size:.7188rem;letter-spacing:.06em;white-space:nowrap}
  section{scroll-margin-top:6.5rem} .lines li{font-size:1.3rem}}

/* ---------- figures ---------- */
.figwrap{margin:2.6rem 0 0;padding:0}
.fig{width:100%;height:auto;display:block}
.figwrap figcaption{margin-top:1.1rem;font-size:.9375rem;line-height:1.55;color:var(--lilac);
  padding-left:1rem;border-left:2px solid var(--rule-gold)}

/* ---------- photographs ---------- */
.heroflex{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
@media (max-width:980px){.heroflex{grid-template-columns:1fr}}
.heroshot{margin:0}
.heroshot img,.portrait img,.presskit img,.gallery img{
  width:100%;height:auto;display:block;border:1px solid var(--rule)}
.heroshot figcaption,.portrait figcaption,.presskit figcaption,.gallery figcaption{
  margin-top:.85rem;font-size:.875rem;line-height:1.5;color:var(--lilac)}
.portrait{margin:0}
.presskit{margin:2rem 0 0;max-width:22rem}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));
  gap:1.6rem;margin-top:2.6rem}
.gallery figure{margin:0}

/* ---------- full-width headline above a two-column block ---------- */
h1.wide{max-width:none}
.hero .wrap + .wrap.heroflex{padding-top:0}
.heroflex{align-items:start}
/* the rocket is an equal partner to the prose, not a sidebar */
.rocket-wrap{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);align-items:start}
.rocket{max-width:100%;max-height:74rem;width:auto;margin:0}
.rocket-cap{max-width:30rem;text-align:left}
@media (max-width:900px){.rocket-wrap{grid-template-columns:1fr}
  .rocket{max-height:34rem;margin:0 auto}.rocket-cap{text-align:center}}

/* ---------- white paper gate ---------- */
.gate{margin-top:2.2rem;border:1px solid var(--rule-gold);padding:1.6rem 1.5rem;
  background:rgba(12,8,32,.55);max-width:46rem}
.gatelede{margin:0 0 1.1rem;font-size:1rem}
.gaterow{display:flex;flex-wrap:wrap;gap:.75rem}
.gate input{flex:1 1 12rem;min-width:0;background:rgba(6,4,15,.7);border:1px solid var(--rule);
  color:var(--text);font:inherit;font-size:1rem;padding:.75rem .9rem}
.gate input::placeholder{color:rgba(198,190,230,.62)}
.gate input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.gate button{flex:0 0 auto;cursor:pointer;font-family:inherit;background:none}
.gatefine{margin:1rem 0 0;font-size:.8438rem;color:var(--lilac)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* contact portrait, smaller and top-aligned with the copy */
.portrait-sm{max-width:24rem;align-self:start}
.gate.notify .gaterow input{flex:1 1 18rem}
.stageshot{margin:0 0 2.4rem;max-width:52rem}
.stageshot img{width:100%;height:auto;display:block;border:1px solid var(--rule)}
.stageshot figcaption{margin-top:.85rem;font-size:.875rem;color:var(--lilac)}

/* ---------- squat rocket for the home page ---------- */
.rocket-short{max-height:26rem}
/* ---------- speaking: photograph left, talks right ---------- */
.talkflex{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(1.6rem,4vw,3.5rem);align-items:start}
@media (max-width:900px){.talkflex{grid-template-columns:1fr}}
.talkflex .stageshot{margin:0;max-width:none;position:sticky;top:6rem}
/* ---------- speaking hero photograph, smaller ---------- */


/* ---------- speaking page photographs ---------- */
.speakhero .heroshot{max-width:23rem}
.talkflex .stageshot img{max-width:100%}
