/* =========================================================================
   Eastbound Link — inner pages, "Blackout" skin (V5.1)
   Paired with css/blackout.css (base + header + footer); css/styles.css is
   no longer loaded on these pages. Structure and copy are untouched — this
   file only re-grounds the existing components on black.
   ========================================================================= */

/* ---------------- skip link ---------------- */
.skip-link{position:absolute;left:-999px;top:-999px;background:#fff;color:#000;
  padding:10px 16px;font-size:14px;z-index:100}
.skip-link:focus{left:16px;top:16px}
.nav__links{color:#fff}

/* ---------------- page hero ---------------- */
.page-hero{padding:110px 0 76px;border-bottom:1px solid var(--line)}
.page-hero .eyebrow{margin:0 0 26px}
.page-hero h1{font-size:clamp(2.05rem,3.9vw,3.3rem);font-weight:600;line-height:1.03;
  letter-spacing:-.03em;max-width:22ch;margin:0 0 26px}
.page-hero p{font-size:1.06rem;line-height:1.6;color:var(--dim);max-width:62ch;margin:0}

/* the brand-gradient tick that precedes every label, as on the homepage */
.eyebrow::before{content:"";width:34px;height:2px;background:var(--grad);flex:none}

/* ---------------- section jump nav ---------------- */
.jump{position:sticky;top:0;z-index:30;background:rgba(0,0,0,.93);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.jump__inner{display:flex;gap:0;overflow-x:auto;scrollbar-width:none}
.jump__inner::-webkit-scrollbar{display:none}
.jump a{flex:0 0 auto;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--faint);padding:15px 18px 13px;white-space:nowrap;
  border-bottom:2px solid transparent;transition:color .16s,border-color .16s}
.jump a:hover{color:#fff}
.jump a.is-active{color:#fff;border-bottom-color:#fff}
.jump a:first-child{padding-left:0}

/* ---------------- sections ---------------- */
.section{padding:88px 0 0}
/* anchor arrivals must clear the sticky section nav */
/* Anchors land the section's own top at the viewport top. Every section opens with
   88px of padding, so the sticky jump nav floats over that padding rather than over
   the heading — no offset needed, and no sliver of the previous section shows. */
.section[id]{scroll-margin-top:0}
.section--tint{background:var(--bg)}
.section--dark{background:var(--bg);color:var(--ink);padding-bottom:88px}

.sol-head{max-width:64ch;margin:0 0 46px;border-top:1px solid var(--line);padding-top:24px}
.sol-head .eyebrow{margin:0 0 20px}
.sol-head h2{font-size:clamp(1.55rem,2.6vw,2.15rem);font-weight:500;line-height:1.07;
  letter-spacing:-.027em;margin:0 0 16px;max-width:26ch}
.sol-lede{font-size:15.5px;line-height:1.62;color:var(--dim);margin:0;max-width:60ch}

/* section heads in the closing "How we scope" band */
.section__head{max-width:64ch;margin:0 0 52px;border-top:1px solid var(--line);padding-top:24px}
.section__head .eyebrow{margin:0 0 20px}
.section__head h2{font-size:clamp(1.55rem,2.6vw,2.15rem);font-weight:500;line-height:1.07;
  letter-spacing:-.027em;margin:0 0 16px;max-width:26ch}
.section__head p{font-size:15.5px;line-height:1.62;color:var(--dim);margin:0;max-width:58ch}

/* ---------------- roadmap: stages ---------------- */
.roadmap{position:relative;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(6,auto);
  align-items:start;padding-top:30px;margin:0 0 22px}
.roadmap::before{content:"";position:absolute;top:0;left:0;right:26px;height:1px;background:var(--line)}
.stage{position:relative;padding:0 26px 0 0;display:grid;grid-row:span 6;
  grid-template-rows:subgrid;align-items:start}
.stage + .stage{border-left:1px solid var(--line);padding-left:26px}
.stage::before{content:"";position:absolute;top:-34px;left:0;width:7px;height:7px;
  border-radius:50%;background:var(--accent)}
.stage + .stage::before{left:26px}
.stage__no{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--accent)}
.stage h3{font-size:1.04rem;font-weight:500;letter-spacing:-.015em;margin:8px 0 16px;line-height:1.2}
.stage__cap{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);margin:0 0 8px}
.stage ul{list-style:none;margin:0 0 18px;padding:0}
.stage li{position:relative;font-size:13px;line-height:1.45;color:var(--dim);padding:3px 0 3px 12px}
.stage li::before{content:"";position:absolute;left:0;top:11px;width:5px;height:1px;background:#3a3a3a}
.stage__doing li{color:var(--dim)}
.stage__we{border-top:1px solid var(--line);padding-top:12px;margin-bottom:0}
.stage__we li{font-size:12.5px;color:#fff;padding-left:13px}
.stage__we li::before{width:6px;height:6px;border-radius:50%;background:var(--accent);top:9px}
.roadmap--4{grid-template-columns:repeat(4,1fr)}
.roadmap--3{grid-template-columns:repeat(3,1fr)}
.roadmap__note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;
  border-top:1px solid var(--line);padding-top:18px;margin:0 0 64px}
.roadmap__note p{margin:0;font-size:15px;color:#fff}
.roadmap__note span{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);align-self:center}

/* ---------------- what the support looks like ---------------- */
.sol-body{display:grid;grid-template-columns:1.35fr .65fr;gap:64px;align-items:start}
.sol-body h3{font-size:1.24rem;font-weight:500;letter-spacing:-.02em;margin:0 0 14px}
.sol-body p{font-size:15.5px;line-height:1.62;color:var(--dim);margin:0 0 22px;max-width:62ch}
.sol-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.sol-list li{padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px;color:#fff;
  display:grid;grid-template-columns:22px 1fr;gap:12px}
.sol-list li::before{content:"→";color:var(--accent);font-size:13px;line-height:1.5}
.sol-side{border-top:1px solid var(--line);padding-top:20px}
.sol-side p{font-size:14.5px;color:var(--dim);margin:0 0 18px}
.sol-side a{display:block;font-size:14.5px;padding:11px 0;border-top:1px solid var(--line);
  color:#fff;transition:color .16s}
.sol-side a:first-of-type{border-top:0}
.sol-side a:hover{color:var(--accent)}
.sol-side .sol-side__label{font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint);margin:0 0 6px}

/* ---------------- how we scope: five steps ---------------- */
.steps{counter-reset:step;display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.step{position:relative;padding:22px 26px 0 0;border-top:1px solid var(--line);counter-increment:step}
.step::before{content:"0" counter(step);font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  color:var(--accent)}
.step h3{margin:12px 0 8px;font-size:.98rem;font-weight:500;letter-spacing:-.01em}
.step p{margin:0;font-size:14.5px;line-height:1.55;color:var(--dim)}

/* ---------------- about, FAQ and contact components ---------------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.split h2{font-size:clamp(1.55rem,2.6vw,2.15rem);font-weight:500;line-height:1.07;
  letter-spacing:-.027em;margin:0 0 20px;max-width:26ch}
.split p{font-size:15.5px;line-height:1.62;color:var(--dim);margin:0 0 16px}
.split p:last-child{margin-bottom:0}
.split__img{border-top:1px solid var(--line);padding-top:16px}
.split__img img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(.18) contrast(1.04)}

.section__head{text-align:left}
.partners{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.partner{min-width:0;padding:28px 32px 0 0;border:0;background:transparent}
.partner+.partner{border-left:1px solid var(--line);padding:28px 0 0 32px}
.partner__head{display:flex;align-items:center;gap:18px;margin:0 0 22px}
.partner__avatar{width:58px;height:58px;flex:none;display:grid;place-items:center;
  border:1px solid var(--line-2);font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:#fff}
.partner__name{font-size:1.2rem;font-weight:500;letter-spacing:-.02em;margin:0}
.partner__role{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent);margin:4px 0}
.partner__base{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.partner p{font-size:14.5px;line-height:1.62;color:var(--dim);margin:0 0 18px}
.partner__results{display:flex;flex-wrap:wrap;list-style:none;padding:12px 0;margin:0 0 16px;
  border-block:1px solid var(--line);gap:8px 0}
.partner__results li{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.partner__results li+li::before{content:"·";color:var(--faint);margin:0 9px}
.partner__tags{display:flex;flex-wrap:wrap;gap:8px 14px}
.partner__tags span{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}

.pull{max-width:70ch;text-align:left}
.pull blockquote{font-size:clamp(1.55rem,2.6vw,2.15rem);font-weight:500;line-height:1.15;
  letter-spacing:-.027em;margin:0 0 14px}
.pull cite{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);font-style:normal}
.grid{display:grid;gap:32px}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{border:0;border-top:1px solid var(--line);padding:20px 0 0;background:transparent}
.card h3{font-size:1rem;font-weight:500;letter-spacing:-.01em;margin:0 0 12px}
.card p{font-size:14.5px;line-height:1.6;color:var(--dim)}

.faq{max-width:860px;border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__q{width:100%;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:18px 0;background:transparent;border:0;text-align:left;color:#fff;font:500 16px/1.45 var(--sans);cursor:pointer}
.faq__q::after{content:"+";flex:none;color:var(--accent);font:400 22px/1 var(--sans);transition:transform .16s}
.faq__item.is-open .faq__q::after{transform:rotate(45deg)}
.faq__a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq__a p{max-width:72ch;padding:0 32px 20px 0;color:var(--dim);font-size:14.5px;line-height:1.65}
.faq__q:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.contact-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start}
.contact-form,.contact-info{border-top:1px solid var(--line);padding-top:22px}
.contact-form h2,.contact-info h2{font-size:1.24rem;font-weight:500;letter-spacing:-.02em;margin:0 0 22px}
.contact-info h3{font-size:1rem;font-weight:500;margin:28px 0 10px}
.contact-info>p{font-size:14.5px;line-height:1.6;color:var(--dim);margin:0 0 22px}
.field{margin:0 0 18px}
.field label{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dim);margin:0 0 8px}
.field input,.field textarea,.field select{width:100%;padding:12px 14px;border:1px solid var(--line-2);
  border-radius:0;background:#080808;color:#fff;font:14.5px/1.5 var(--sans);transition:border-color .16s}
.field input::placeholder,.field textarea::placeholder{color:var(--faint)}
.field textarea{min-height:140px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}
.contact-info__row{display:flex;align-items:flex-start;gap:14px;padding:15px 0;border-top:1px solid var(--line)}
.contact-info__row svg{flex:none;color:var(--accent);margin-top:2px}
.contact-info__row b{display:block;font-size:13.5px;font-weight:500;color:#fff}
.contact-info__row span{font-size:13.5px;line-height:1.55;color:var(--dim)}
.contact-info .link,.contact-form .link{color:#fff;border-bottom:1px solid var(--line-2)}
.contact-info .link:hover,.contact-form .link:hover{border-color:#fff}
.form-status{margin:14px 0 0;font-size:14px}
.form-status.is-ok{color:#9bd7a6}
.form-status.is-err{color:#ff9b9b}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
[hidden]{display:none!important}

/* ---------------- misc ---------------- */
.center{text-align:center}
.btn--lg{padding:16px 28px;font-size:14.5px}

/* ---------------- responsive ---------------- */
@media (max-width:1100px){
  .page-hero{padding:88px 0 64px}
  .section{padding:72px 0 0}
  .section--dark{padding-bottom:72px}
  .steps{grid-template-columns:repeat(3,1fr);row-gap:32px}
}
@media (max-width:1080px){
  .roadmap,.roadmap--4{grid-template-columns:1fr;grid-template-rows:none;padding-top:0}
  .roadmap::before{display:none}
  .stage{display:block;grid-row:auto;padding:0 0 26px 24px;border-left:1px solid var(--line)}
  .stage + .stage{border-left:1px solid var(--line);padding-left:24px}
  .stage::before,.stage + .stage::before{top:4px;left:-4px}
  .sol-body{grid-template-columns:1fr;gap:36px}
  .split,.contact-wrap{grid-template-columns:1fr;gap:36px}
}
@media (max-width:900px){
  .jump{position:static}
  .jump a{padding:12px 14px 10px}
  .jump a:first-child{padding-left:0}
}
@media (max-width:860px){
  .page-hero h1{max-width:none}
  .steps{grid-template-columns:repeat(2,1fr)}
  .sol-head,.section__head{margin-bottom:36px}
}
@media (max-width:560px){
  .steps{grid-template-columns:1fr;row-gap:0}
  .step{padding:18px 0}
  .partners,.grid--3{grid-template-columns:1fr}
  .partner{padding-right:0}
  .partner+.partner{border-left:0;border-top:1px solid var(--line);padding:26px 0 0}
  .faq__q{font-size:15px}
}
