/* Temporal Intelligence media page: one shared stylesheet, six copy variants.
   Brand: TI bible v2.2. Floors: 14px absolute, 16px running copy. No gradients, shadows, or rounded corners. */

@font-face{font-family:'Lora';font-style:normal;font-weight:400;src:url('fonts/Lora-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;src:url('fonts/Lora-Italic.ttf') format('truetype');font-display:swap}
@font-face{font-family:'Lora';font-style:normal;font-weight:600 700;src:url('fonts/Lora-Bold.ttf') format('truetype');font-display:swap}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;src:url('fonts/JetBrainsMono-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;src:url('fonts/JetBrainsMono-Bold.ttf') format('truetype');font-display:swap}

:root{
  --ink:#1A1814;        /* Carbon Ink */
  --bone:#F4F0E8;       /* Warm Bone */
  --oxide:#7A2E1F;      /* Iron Oxide: signal only */
  --slate:#3D372F;      /* Slate Iron */
  --stone:#635C53;      /* Stone: secondary TEXT */
  --rule:#C4BDB0;       /* Bone Mid: hairlines */
  --bone-lt:#E8E3D8;    /* Bone Light */
  --display:'EB Garamond','Lyon Text',Garamond,Georgia,'Times New Roman',serif;
  --body:'Lora','Tiempos Text',Georgia,'Times New Roman',serif;
  --mono:'JetBrains Mono','IBM Plex Mono','SF Mono',Menlo,Consolas,monospace;
  --s-body:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --s-lead:clamp(1.1875rem,1rem + .625vw,1.375rem);
  --s-label:.875rem; /* 14px floor */
}
*,*::before,*::after{box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--body);font-size:var(--s-body);line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--ink);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--oxide)}
:focus-visible{outline:2px solid var(--oxide);outline-offset:3px}
strong{font-weight:600}
em{font-style:italic}

.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.col{max-width:40rem;margin:0 auto}

/* Masthead */
.mast{border-bottom:1px solid var(--rule)}
.mast .wrap{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:18px;padding-bottom:16px}
.mast svg,.foot svg{width:26px;height:26px;flex:none}
.wm{font-family:var(--display);font-weight:600;font-size:1.125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}

/* Hero */
.hero{padding:44px 0 40px;text-align:center}
.hero .ov{font-family:var(--mono);font-size:var(--s-label);letter-spacing:.1em;text-transform:uppercase;color:var(--oxide);margin:0 auto 18px}
.hero h1{font-family:var(--display);font-weight:400;font-size:clamp(2.25rem,1.5rem + 3.2vw,3.5rem);line-height:1.1;letter-spacing:-.015em;margin:0 auto 22px;max-width:18em;text-wrap:balance}
.hero .deck{font-family:var(--body);font-size:var(--s-lead);line-height:1.5;color:var(--slate);max-width:36rem;margin:0 auto 16px}
.hero h2.deck{font-family:var(--display);font-weight:400;font-size:clamp(1.375rem,1.1rem + 1.2vw,1.875rem);line-height:1.25}
.hero p{max-width:36rem;margin:0 auto 14px}
.hero .lead{font-size:var(--s-lead);line-height:1.5}
.cta{margin:28px auto 6px}
.cta-note{margin:8px auto 0;max-width:34rem}

/* Buttons: primary is Carbon with Bone text, Iron Oxide on hover. Dominant by size, never by effect. */
.btn{display:block;width:100%;max-width:26rem;margin:0 auto;padding:20px 28px;background:var(--ink);color:var(--bone);font-family:var(--body);font-weight:600;font-size:1.25rem;line-height:1.2;text-align:center;text-decoration:none;border:0;transition:background-color .15s ease-out}
.btn:hover,.btn:focus-visible{background:var(--oxide);color:var(--bone)}
.btn.sm{display:inline-block;width:auto;max-width:none;margin:0;padding:12px 22px;font-size:1.0625rem;background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn.sm:hover{background:var(--ink);color:var(--bone)}
.ph{display:inline-block;margin:0 .2em;padding:0 .4em;font-family:var(--mono);font-size:var(--s-label);font-weight:400;line-height:1.5;letter-spacing:0;color:var(--stone);background:var(--bone-lt);border:1px dashed var(--rule);vertical-align:baseline;white-space:normal}
.cta-ph{display:block;width:max-content;max-width:100%;margin:12px auto 0}

/* Sections */
.sec{padding:44px 0;border-top:1px solid var(--rule)}
.sec .no{display:block;font-family:var(--mono);font-size:var(--s-label);letter-spacing:.1em;text-transform:uppercase;color:var(--oxide);margin:0 0 10px}
.sec h2{font-family:var(--display);font-weight:400;font-size:clamp(1.75rem,1.2rem + 2.2vw,2.5rem);line-height:1.15;letter-spacing:-.012em;margin:0 0 22px;text-wrap:balance}
.sec h3{font-family:var(--display);font-weight:500;font-size:clamp(1.375rem,1.1rem + 1vw,1.75rem);line-height:1.25;margin:30px 0 12px}
.sec p{margin:0 0 1.1em}
.sec p:last-child{margin-bottom:0}
.sec .lead{font-size:var(--s-lead)}
.label{font-family:var(--mono);font-size:var(--s-label);font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--slate);margin:30px 0 10px!important}
.label:first-child{margin-top:0!important}

/* Bulleted and numbered lists */
.sec ul,.sec ol{margin:0 0 1.1em;padding:0;list-style:none}
.sec ul li{position:relative;padding:0 0 .6em 1.5em}
.sec ul li::before{content:"";position:absolute;left:.1em;top:.7em;width:.45em;height:.45em;background:var(--oxide)}
.sec ol{counter-reset:n}
.sec ol li{counter-increment:n;position:relative;padding:0 0 .7em 2.6em}
.sec ol li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.2em;font-family:var(--mono);font-size:var(--s-label);color:var(--oxide)}
.sec .qlist li{padding:.75em 0 .75em 2.6em;border-top:1px solid var(--rule)}
.sec .qlist li:last-child{border-bottom:1px solid var(--rule)}
.sec .qlist li::before{top:1.05em}

/* Topic items: numeral gutter + display title + body */
.item{display:grid;grid-template-columns:2.4rem 1fr;gap:0 4px;padding:22px 0;border-top:1px solid var(--rule)}
.item:first-of-type{border-top:0;padding-top:6px}
.item .n{font-family:var(--mono);font-size:var(--s-label);color:var(--oxide);padding-top:.5em}
.item h3{margin:0 0 8px;font-weight:500}
.item .body p{margin:0 0 .7em}
.item .body p:last-child{margin-bottom:0}
.item.plain{display:block}
.oq{margin:.9em 0 0!important;padding:.1em 0 .1em 14px;border-left:3px solid var(--rule);color:var(--slate);font-style:normal}

/* Evidence / field-citation treatments */
.evidence .box,.panel .box{background:var(--bone-lt);padding:26px 24px;border-left:3px solid var(--oxide)}
.panel .box{border-left-color:var(--rule)}
.evidence .box .item{display:block;padding:0;border:0}
.evidence .box h3{margin-top:0}
.evidence .box p:last-child{margin-bottom:0}
.panel{background:transparent}
.dl{margin:1em 0 0;padding:0}
.dl div{display:flex;flex-wrap:wrap;gap:4px 14px;padding:8px 0;border-top:1px solid var(--rule)}
.dl dt{font-family:var(--mono);font-size:var(--s-label);letter-spacing:.06em;text-transform:uppercase;color:var(--slate);min-width:6rem}
.dl dd{margin:0}
.code{font-family:var(--mono);font-size:.9375rem;line-height:1.5;overflow-wrap:anywhere;background:var(--bone-lt);padding:12px 14px;margin:0 0 1.1em;color:var(--ink)}
code{font-family:var(--mono);font-size:.9375rem;overflow-wrap:anywhere}

/* Bio with the headshot */
.bio .bio-grid{display:block}
.bio figure{margin:0 0 26px}
.bio figure img{width:180px;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 28%;background:var(--bone-lt)}
.bio-text .label:first-child{margin-top:0!important}

/* Inverted booking band */
.band{background:var(--ink);color:var(--bone);padding:52px 0 40px;border-top:0}
.band .no,.band h2,.band h3{color:var(--bone)}
.band .no{color:var(--rule)}
.band a{color:var(--bone)}
.band a:hover{color:var(--bone)}
.band .btn{background:var(--bone);color:var(--ink)}
.band .btn:hover,.band .btn:focus-visible{background:var(--oxide);color:var(--bone)}
.band .ph{color:var(--rule);background:transparent;border-color:var(--stone)}
.band ul li::before{background:var(--bone)}
.band ol li::before{color:var(--rule)}
.band .label{color:var(--rule)}
.band .oq{color:var(--bone);border-left-color:var(--stone)}
.band .ask{font-family:var(--display);font-size:clamp(1.375rem,1.1rem + 1.2vw,1.875rem);line-height:1.3}
.band p,.band li{color:var(--bone)}
.band .cta{margin-top:26px}
.foot{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:44px;padding-top:24px;border-top:1px solid var(--slate)}
.foot .wm{color:var(--bone)}

/* Index page */
.idx{padding:48px 0}
.idx h1{font-family:var(--display);font-weight:400;font-size:clamp(2rem,1.4rem + 2.4vw,2.75rem);line-height:1.15;margin:0 0 14px}
.idx .note{font-family:var(--mono);font-size:var(--s-label);letter-spacing:.06em;text-transform:uppercase;color:var(--stone);margin:0 0 28px}
.idx ol{counter-reset:n;list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.idx li{counter-increment:n;border-bottom:1px solid var(--rule)}
.idx li a{display:flex;gap:18px;align-items:baseline;padding:16px 0;text-decoration:none;font-size:1.25rem}
.idx li a::before{content:counter(n,decimal-leading-zero);font-family:var(--mono);font-size:var(--s-label);color:var(--oxide)}
.idx li a:hover{color:var(--oxide)}
.idx li small{font-family:var(--mono);font-size:var(--s-label);color:var(--stone);margin-left:auto}

/* Larger screens */
@media (min-width:760px){
  .wrap{padding:0 32px}
  .hero{padding:72px 0 64px}
  .sec{padding:60px 0}
  .band{padding:72px 0 44px}
  .btn{padding:22px 36px;font-size:1.375rem}
  .btn.sm{padding:12px 24px;font-size:1.0625rem}
  .evidence .box,.panel .box{padding:32px 36px}
  .item{grid-template-columns:3rem 1fr}
  .bio .wrap-bio{max-width:52rem;margin:0 auto}
  .bio .bio-grid{display:grid;grid-template-columns:220px 1fr;gap:0 40px;align-items:start}
  .bio figure{margin:6px 0 0;position:sticky;top:24px}
  .bio figure img{width:220px}
}

@media (prefers-reduced-motion:no-preference){
  .rv{animation:rv .45s ease-out both}
  @keyframes rv{from{opacity:.001;transform:translateY(8px)}to{opacity:1;transform:none}}
}
.meta{font-family:var(--mono);font-size:var(--s-label);color:var(--stone);margin-left:8px;overflow-wrap:anywhere}
