:root {
  --stg-ink: #101a2d;
  --stg-copy: #5f7089;
  --stg-red: #df3547;
  --stg-red-soft: #fff0f2;
  --stg-blue: #245a99;
  --stg-paper: #fffefd;
  --stg-wash: #f5f7fa;
  --stg-line: #d8e0ea;
  --stg-max: 1180px;
}

.stg-hero,
.stg-evidence,
.stg-artifact,
.stg-scenario,
.stg-delivery,
.stg-stack,
.stg-faq,
.stg-editorial {
  color: var(--stg-ink);
  font-family: "Plus Jakarta Sans", sans-serif;
}

.stg-shell { width: min(var(--stg-max), calc(100% - 3rem)); margin-inline: auto; }
.stg-two-col { display: grid; grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr); gap: clamp(2rem, 5vw, 5.5rem); }
.stg-kicker { margin: 0; color: var(--stg-red); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.stg-hero { padding: 6.8rem 0 2.4rem; border-bottom: 1px solid var(--stg-line); background: linear-gradient(135deg, #fff 0%, #fff 56%, #f4f7fa 100%); }
.stg-status { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 1rem; border-block: 1px solid var(--stg-line); color: #697991; font-size: .67rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.stg-status span { min-width: 0; overflow-wrap: anywhere; }
.stg-status span:last-child { color: var(--stg-red); }
.stg-hero__layout { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); align-items: center; gap: clamp(2.3rem, 5vw, 5rem); padding-top: 2.8rem; }
.stg-hero__layout > * { min-width: 0; }
.stg-hero__copy h1 { max-width: 12ch; margin: .75rem 0 1rem; font-size: clamp(2.85rem, 5.2vw, 4.9rem); font-weight: 800; line-height: .96; letter-spacing: -.065em; }
.stg-hero__copy h1 em { color: var(--stg-red); font-style: normal; }
.stg-hero__copy > p:last-of-type { max-width: 39rem; margin: 0; color: var(--stg-copy); font-size: clamp(1rem, 1.35vw, 1.16rem); line-height: 1.58; }
.stg-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.6rem; }
.stg-actions a { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: .75rem; padding: .75rem 1.15rem; border: 1px solid var(--stg-line); border-radius: 6px; color: var(--stg-ink); font-size: .82rem; font-weight: 800; text-decoration: none; }
.stg-actions a:first-child { border-color: var(--stg-ink); background: var(--stg-ink); color: #fff; }
.stg-actions a:hover { border-color: var(--stg-red); color: var(--stg-red); }
.stg-actions a:first-child:hover { background: var(--stg-red); color: #fff; }
.stg-hero__visual { margin: 0; overflow: hidden; border: 1px solid var(--stg-line); border-radius: 18px; background: var(--stg-paper); box-shadow: 0 24px 55px rgba(16, 26, 45, .1); }
.stg-hero__visual picture,
.stg-hero__visual img { display: block; width: 100%; }
.stg-hero__visual img { aspect-ratio: 41 / 28; object-fit: contain; background: #f6f8fa; }
.stg-hero__visual figcaption { display: grid; grid-template-columns: .85fr 1.15fr; gap: 1rem; padding: .85rem 1rem; border-top: 1px solid var(--stg-line); color: var(--stg-copy); font-size: .72rem; line-height: 1.45; }
.stg-hero__visual figcaption strong { color: var(--stg-ink); }

.stg-evidence { padding: 1.55rem 0; border-bottom: 1px solid var(--stg-line); background: var(--stg-paper); }
.stg-evidence__layout { display: grid; grid-template-columns: minmax(15rem, .82fr) repeat(2, minmax(0, 1fr)); border-block: 1px solid var(--stg-line); }
.stg-evidence__layout > * { min-width: 0; padding: 1.15rem 1.25rem; }
.stg-evidence__layout > * + * { border-left: 1px solid var(--stg-line); }
.stg-evidence header { padding-left: 0; }
.stg-evidence h2 { max-width: 22ch; margin: .55rem 0 0; font-size: 1.5rem; font-weight: 800; line-height: 1.12; letter-spacing: -.04em; }
.stg-evidence article span { color: var(--stg-red); font-size: .61rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.stg-evidence article strong { display: block; margin-top: .5rem; font-size: .9rem; line-height: 1.42; }
.stg-evidence article p { margin: .45rem 0 0; color: var(--stg-copy); font-size: .82rem; line-height: 1.5; }
.stg-evidence nav { display: flex; grid-column: 1 / -1; min-height: 54px; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 0 1.35rem; padding-block: .25rem; border-top: 1px solid var(--stg-line); border-left: 0 !important; }
.stg-evidence nav a { display: inline-flex; min-height: 44px; align-items: center; color: var(--stg-ink); font-size: .7rem; font-weight: 800; text-decoration: none; }

.stg-artifact { padding: clamp(3.5rem, 6vw, 6rem) 0; background: #fff; }
.stg-artifact header h2,
.stg-scenario h2,
.stg-delivery h2,
.stg-stack h2,
.stg-faq h2 { margin: .55rem 0 0; font-size: clamp(2rem, 3.7vw, 3.4rem); font-weight: 800; line-height: 1.03; letter-spacing: -.055em; }
.stg-artifact header > span { display: block; max-width: 38rem; margin-top: 1.1rem; color: var(--stg-copy); font-size: .95rem; line-height: 1.62; }
.stg-pockets { margin: 0; border-top: 1px solid var(--stg-line); }
.stg-pockets > div { display: grid; grid-template-columns: minmax(9rem, .65fr) minmax(0, 1.35fr); gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--stg-line); }
.stg-pockets dt { color: var(--stg-red); font-size: .76rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.stg-pockets dd { margin: 0; color: var(--stg-copy); font-size: .9rem; line-height: 1.5; }

.stg-scenario { padding: clamp(3.25rem, 5vw, 5.4rem) 0; border-block: 1px solid var(--stg-line); background: var(--stg-wash); }
.stg-scenario header { display: grid; grid-template-columns: .45fr 1.55fr; align-items: end; gap: 2rem; margin-bottom: 2rem; }
.stg-scenario header h2 { max-width: 22ch; }
.stg-scenario ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; border: 1px solid var(--stg-line); border-radius: 14px; background: #fff; list-style: none; }
.stg-scenario li { min-width: 0; padding: 1.35rem; }
.stg-scenario li + li { border-left: 1px solid var(--stg-line); }
.stg-scenario b { display: block; color: var(--stg-red); font-size: .72rem; }
.stg-scenario strong { display: block; margin-top: 1.65rem; font-size: 1.05rem; line-height: 1.3; }
.stg-scenario span { display: block; margin-top: .55rem; color: var(--stg-copy); font-size: .84rem; line-height: 1.55; }

.stg-delivery { padding: clamp(3.5rem, 6vw, 6rem) 0; background: #fff; }
.stg-delivery ol { margin: 0; padding: 0; border-top: 1px solid var(--stg-line); list-style: none; }
.stg-delivery li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) auto; align-items: center; gap: .85rem; padding: 1rem 0; border-bottom: 1px solid var(--stg-line); }
.stg-delivery b { color: var(--stg-red); font-size: .72rem; }
.stg-delivery span { font-size: .88rem; font-weight: 700; }
.stg-delivery em { color: var(--stg-copy); font-size: .7rem; font-style: normal; }

.stg-stack { padding: 2.75rem 0; border-block: 1px solid var(--stg-line); background: var(--stg-paper); }
.stg-stack__layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(2rem, 5vw, 5rem); }
.stg-stack h2 { max-width: 22ch; font-size: clamp(1.8rem, 3vw, 2.75rem); }
.stg-stack ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid var(--stg-line); list-style: none; }
.stg-stack li { padding: 1rem 0; border-bottom: 1px solid var(--stg-line); }
.stg-stack li:nth-child(odd) { padding-right: 1rem; }
.stg-stack li:nth-child(even) { padding-left: 1rem; border-left: 1px solid var(--stg-line); }
.stg-stack strong,
.stg-stack small { display: block; }
.stg-stack strong { font-size: .9rem; }
.stg-stack small { margin-top: .3rem; color: var(--stg-copy); font-size: .72rem; }

.stg-faq { padding: clamp(3.5rem, 6vw, 6rem) 0; background: var(--stg-wash); }
.stg-faq header a { display: inline-flex; min-height: 44px; align-items: center; margin-top: 1.25rem; color: var(--stg-ink); font-size: .8rem; font-weight: 800; text-decoration: none; }
.stg-faq__list { border-top: 1px solid var(--stg-line); }
.stg-faq details { border-bottom: 1px solid var(--stg-line); }
.stg-faq summary { display: grid; min-height: 68px; grid-template-columns: 2.5rem minmax(0, 1fr) 1rem; align-items: center; gap: .8rem; cursor: pointer; list-style: none; }
.stg-faq summary::-webkit-details-marker { display: none; }
.stg-faq summary span { color: var(--stg-red); font-size: .68rem; font-weight: 800; }
.stg-faq summary strong { font-size: .88rem; }
.stg-faq summary i { position: relative; width: 14px; height: 14px; }
.stg-faq summary i::before,
.stg-faq summary i::after { position: absolute; top: 6px; left: 1px; width: 12px; height: 2px; background: var(--stg-red); content: ""; }
.stg-faq summary i::after { transform: rotate(90deg); transition: transform .2s ease; }
.stg-faq details[open] summary i::after { transform: rotate(0); }
.stg-faq details > div { padding: 0 2rem 1rem 3.3rem; color: var(--stg-copy); font-size: .84rem; line-height: 1.55; }

.stg-editorial { display: flex; width: min(var(--stg-max), calc(100% - 3rem)); min-height: 74px; align-items: center; justify-content: space-between; gap: 1.5rem; margin-inline: auto; border-bottom: 1px solid var(--stg-line); background: #fff; }
.stg-editorial div { display: flex; flex-direction: column; gap: .25rem; }
.stg-editorial strong { font-size: .78rem; }
.stg-editorial span { color: var(--stg-copy); font-size: .7rem; }
.stg-editorial nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .85rem; }
.stg-editorial a { color: var(--stg-ink); font-size: .7rem; font-weight: 700; text-decoration: none; }
.stg-editorial a:hover,
.stg-evidence a:hover,
.stg-faq a:hover { color: var(--stg-red); }

@media (max-width: 900px) {
  .stg-hero__layout,
  .stg-two-col,
  .stg-stack__layout { grid-template-columns: 1fr; }
  .stg-hero__copy h1 { max-width: 13ch; }
  .stg-evidence__layout { grid-template-columns: 1fr 1fr; }
  .stg-evidence header { grid-column: 1 / -1; padding-left: 1.25rem; }
  .stg-evidence__layout > * + * { border-top: 1px solid var(--stg-line); border-left: 0; }
  .stg-evidence article + article { border-left: 1px solid var(--stg-line); }
  .stg-scenario header { grid-template-columns: 1fr; gap: .6rem; }
  .stg-delivery li { grid-template-columns: 2rem minmax(0, 1fr); }
  .stg-delivery em { grid-column: 2; }
  .stg-editorial { padding-block: 1rem; }
}

@media (max-width: 700px) {
  .stg-shell,
  .stg-editorial { width: min(100% - 2rem, var(--stg-max)); }
  .stg-hero { padding-top: 5.9rem; }
  .stg-status { align-items: flex-start; flex-direction: column; justify-content: center; gap: .15rem; padding-block: .45rem; }
  .stg-hero__layout { gap: 1.8rem; padding-top: 1.8rem; }
  .stg-hero__copy h1 { max-width: 100%; font-size: clamp(2.25rem, 11vw, 3rem); overflow-wrap: normal; word-break: normal; }
  .stg-hero__copy,
  .stg-hero__visual,
  .stg-evidence__layout,
  .stg-artifact,
  .stg-scenario,
  .stg-delivery,
  .stg-stack,
  .stg-faq { min-width: 0; }
  .stg-actions { flex-direction: column; }
  .stg-actions a { width: 100%; }
  .stg-hero__visual img { aspect-ratio: 17 / 24; }
  .stg-hero__visual figcaption { grid-template-columns: 1fr; }
  .stg-evidence__layout { grid-template-columns: 1fr; border-bottom: 0; }
  .stg-evidence__layout > * { padding: 1rem 0; }
  .stg-evidence header { grid-column: auto; padding-left: 0; }
  .stg-evidence article + article { border-left: 0; }
  .stg-evidence nav { justify-content: flex-start; padding-right: 0; }
  .stg-pockets > div { grid-template-columns: 1fr; gap: .45rem; }
  .stg-scenario ol { grid-template-columns: 1fr; }
  .stg-scenario li + li { border-top: 1px solid var(--stg-line); border-left: 0; }
  .stg-scenario strong { margin-top: .75rem; }
  .stg-stack ul { grid-template-columns: 1fr; }
  .stg-stack li:nth-child(odd),
  .stg-stack li:nth-child(even) { padding-inline: 0; border-left: 0; }
  .stg-editorial { align-items: flex-start; flex-direction: column; }
  .stg-editorial nav { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  .stg-hero *, .stg-evidence *, .stg-artifact *, .stg-scenario *, .stg-delivery *, .stg-stack *, .stg-faq * { scroll-behavior: auto !important; transition: none !important; }
}