/* Personal Computer, 2001 */
.brand-pc2001 {
  --ground: #d9d9d3;
  --section: #cbdde2;
  --paper: #eef2ef;
  --text: #242a2e;
  --secondary: #596368;
  --accent: #1748c7;
  --signal: #b5dc37;
  --line: #9ba3a4;
  --chrome: #c6ccca;
  --variant-bg: #d4d8d6;
  --active-bg: #d8e9ed;
  --button-bg: #1748c7;
  --button-text: #f6f8f5;
  --display: "Trebuchet MS", "Lucida Grande", "Segoe UI", sans-serif;
  --sans: "Trebuchet MS", "Lucida Grande", "Segoe UI", sans-serif;
  --mono: "Lucida Console", Monaco, ui-monospace, monospace;
  --display-weight: 680;
  --button-radius: 5px;
  --small-radius: 3px;
  --card-radius: 8px;
  --media-radius: 14px;
  --shadow: 0 2px 0 #7c8586;
  --media-shadow: 0 18px 38px rgb(36 42 46 / .16);
  --focus: #1748c7;
  letter-spacing: -.005em;
}

.brand-pc2001::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  background-image: repeating-linear-gradient(0deg, transparent 0 5px, rgb(36 42 46 / .025) 5px 6px);
  content: "";
  pointer-events: none;
}

.brand-pc2001 .container { --max: 1210px; }
.brand-pc2001 h1,
.brand-pc2001 h2 { letter-spacing: -.045em; }
.brand-pc2001 h1 {
  max-width: 10ch;
  font-size: clamp(3.2rem, 5.9vw, 6.25rem);
  line-height: .96;
}
.brand-pc2001 h2 {
  max-width: 15ch;
  font-size: clamp(2.15rem, 3.7vw, 3.9rem);
  line-height: 1;
}
.brand-pc2001 h3 { font-family: var(--display); }
.brand-pc2001 .eyebrow,
.brand-pc2001 .card-kicker,
.brand-pc2001 .preview-label,
.brand-pc2001 .window-title,
.brand-pc2001 .availability,
.brand-pc2001 .small {
  font-family: var(--mono);
  letter-spacing: .055em;
}
.brand-pc2001 .eyebrow { color: #103ba8; }
.brand-pc2001 .lede { color: #465258; }

/* Instrument header */
.brand-pc2001 .site-header {
  border-top: 7px solid #1748c7;
  border-bottom: 1px solid #7d8688;
  background: #c9cdca;
  box-shadow: inset 0 -3px 0 #e7e9e5;
}
.brand-pc2001 .primary-nav { min-height: 69px; }
.brand-pc2001 .wordmark {
  display: inline-flex;
  align-items: center;
  font-size: 1.45rem;
  letter-spacing: -.055em;
}
.brand-pc2001 .wordmark::before {
  width: 20px;
  height: 20px;
  margin-right: .65rem;
  border: 2px solid #242a2e;
  border-radius: 4px 4px 7px 4px;
  background: #d9e8eb;
  box-shadow: inset 0 -4px 0 #9db9c1;
  content: "";
}
.brand-pc2001 .wordmark::after {
  width: 7px;
  height: 7px;
  margin-left: .65rem;
  border: 1px solid #546118;
  border-radius: 50%;
  background: #b5dc37;
  content: "";
  animation: pc-status 2.8s steps(2, end) infinite;
}
@keyframes pc-status { 0%, 88% { opacity: 1; } 89%, 100% { opacity: .35; } }
.brand-pc2001 .primary-nav a:not(.wordmark) {
  border-bottom: 2px solid transparent;
  color: #414a4f;
  font-family: var(--mono);
  font-size: .69rem;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.brand-pc2001 .primary-nav a:not(.wordmark):hover { border-bottom-color: #1748c7; }

/* Tactile controls */
.brand-pc2001 .button {
  min-height: 47px;
  border: 1px solid #0d318d;
  border-bottom-color: #071f5b;
  padding: .72rem 1.25rem;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .35), 0 4px 0 #0b2c80, 0 7px 12px rgb(36 42 46 / .16);
  letter-spacing: .01em;
  transition: transform 90ms ease, box-shadow 90ms ease, background-color 130ms ease;
}
.brand-pc2001 .button:hover {
  background: #103db3;
  transform: translateY(-1px);
}
.brand-pc2001 .button:active {
  box-shadow: inset 0 2px 4px rgb(9 27 78 / .45), 0 1px 0 #0b2c80;
  transform: translateY(3px);
}
.brand-pc2001 .button.secondary {
  border-color: #788082;
  border-bottom-color: #565f61;
  background: #dfe2df;
  color: #242a2e;
  box-shadow: inset 0 1px 0 #fff, 0 4px 0 #747d7f, 0 7px 12px rgb(36 42 46 / .12);
}
.brand-pc2001 .button.secondary:hover { background: #eef2ef; }
.brand-pc2001 .button.secondary:active { box-shadow: inset 0 2px 4px rgb(36 42 46 / .25), 0 1px 0 #747d7f; }

/* The hero is one personal context instrument, not a stack of cards. */
.brand-pc2001 .hero { padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.brand-pc2001 .hero-grid {
  grid-template-columns: minmax(0, 5fr) minmax(520px, 7fr);
  align-items: center;
  gap: clamp(3rem, 6vw, 6.5rem);
}
.brand-pc2001 .hero-copy {
  position: relative;
  padding: 1.2rem 0 1.2rem 1.45rem;
  border-left: 8px solid #1748c7;
}
.brand-pc2001 .hero-copy::before {
  position: absolute;
  top: 0;
  left: -8px;
  width: 8px;
  height: 46px;
  background: #b5dc37;
  content: "";
}
.brand-pc2001 .hero-note {
  max-width: 44ch;
  border: 0;
  border-top: 1px solid #8d9698;
  padding: 1rem 0 0;
  font-size: .84rem;
}
.brand-pc2001 .hero-mark {
  min-height: 500px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-content: stretch;
  overflow: hidden;
  border: 22px solid #bec3c0;
  border-top-width: 82px;
  border-bottom-width: 46px;
  border-radius: 31px 31px 16px 16px;
  background: #dcebee;
  box-shadow:
    inset 0 0 0 2px #697477,
    inset 0 0 0 7px #aec8ce,
    0 3px 0 #7d8688,
    0 24px 48px rgb(36 42 46 / .2);
}
.brand-pc2001 .hero-mark::before {
  position: absolute;
  top: -58px;
  left: 0;
  color: #3d464a;
  content: "SITUATE / 01";
  font-family: var(--mono);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .08em;
}
.brand-pc2001 .hero-mark::after {
  position: absolute;
  top: -58px;
  right: 3px;
  width: 9px;
  height: 9px;
  border: 1px solid #596619;
  border-radius: 50%;
  background: #b5dc37;
  box-shadow: 17px 0 0 #5b6467;
  content: "";
  animation: pc-status 2.8s steps(2, end) infinite;
}
.brand-pc2001 .context-card,
.brand-pc2001 .context-card:nth-child(1),
.brand-pc2001 .context-card:nth-child(2),
.brand-pc2001 .context-card:nth-child(3) {
  position: relative;
  inset: auto;
  width: auto;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-end;
  border: 0;
  border-right: 1px solid #8da5aa;
  border-radius: 0;
  padding: 2rem 1.25rem 2.2rem;
  background: transparent;
  box-shadow: none;
}
.brand-pc2001 .context-card:last-child { border-right: 0; }
.brand-pc2001 .context-card::before {
  position: absolute;
  top: 23%;
  right: -5px;
  z-index: 2;
  width: 9px;
  height: 9px;
  border: 1px solid #123da9;
  border-radius: 50%;
  background: #1748c7;
  content: "";
}
.brand-pc2001 .context-card:last-child::before {
  right: 1.25rem;
  border-color: #596619;
  background: #b5dc37;
}
.brand-pc2001 .context-card::after {
  position: absolute;
  top: calc(23% + 4px);
  right: 0;
  left: 0;
  height: 1px;
  background: #688a93;
  content: "";
}
.brand-pc2001 .card-kicker {
  margin-bottom: 1rem;
  color: #103ba8;
  font-size: .62rem;
}
.brand-pc2001 .context-card strong { font-size: 1.02rem; }
.brand-pc2001 .context-card p { color: #53666b; }

/* Manual chapters and specification rails */
.brand-pc2001 .section-shell {
  position: relative;
  border-top: 2px solid #727b7d;
  box-shadow: inset 0 4px 0 rgb(255 255 255 / .42);
}
.brand-pc2001 .section-shell.tinted { background: #cbdde2; }
.brand-pc2001 .section-shell[data-section]::before {
  position: absolute;
  top: 1.1rem;
  left: max(20px, calc((100vw - 1210px) / 2));
  border: 1px solid #737d80;
  border-radius: 2px;
  padding: .26rem .48rem;
  background: #dfe3df;
  color: #353e42;
  content: attr(data-section);
  font-family: var(--mono);
  font-size: .6rem;
  letter-spacing: .04em;
  box-shadow: inset 0 1px 0 #fff;
}
.brand-pc2001 .section-heading {
  grid-template-columns: minmax(0, 7fr) minmax(320px, 5fr);
  align-items: start;
  margin: 1.5rem 0 3.5rem;
  padding-top: 2rem;
}
.brand-pc2001 .section-heading .section-intro {
  border-top: 4px solid #1748c7;
  padding-top: 1.1rem;
}

/* Product display */
.brand-pc2001 .media-frame {
  border: 18px solid #b9bfbc;
  border-top-width: 46px;
  border-bottom-width: 32px;
  background: #283033;
  box-shadow: inset 0 0 0 2px #5f686a, 0 20px 45px rgb(36 42 46 / .18);
}
.brand-pc2001 .window-chrome {
  position: absolute;
  z-index: 2;
  top: -34px;
  right: 0;
  left: 0;
  height: 28px;
  border: 0;
  background: transparent;
}
.brand-pc2001 .window-chrome i {
  width: 28px;
  height: 13px;
  border: 1px solid #747d7f;
  border-radius: 2px;
  background: #dce0dd;
  box-shadow: inset 0 1px 0 #fff;
}
.brand-pc2001 .window-chrome i:first-child { border-bottom: 3px solid #1748c7; }
.brand-pc2001 .window-title {
  margin-left: auto;
  color: #3d464a;
  font-size: .58rem;
  font-style: normal;
  text-transform: uppercase;
}
.brand-pc2001 .preview-ui {
  height: 100%;
  grid-template-columns: 29% 1fr;
  border: 2px solid #4d595d;
  background: #e1edef;
}
.brand-pc2001 .preview-sidebar {
  border-right: 1px solid #789198;
  background: #bed5da;
}
.brand-pc2001 .source-row {
  border: 1px solid #788b90;
  border-left: 5px solid #1748c7;
  background: #dbe8e9;
  box-shadow: inset 0 1px 0 #f8ffff;
}
.brand-pc2001 .preview-main { background: #e8f1f1; }
.brand-pc2001 .preview-lines i { border-radius: 0; background: #a6bbbf; }
.brand-pc2001 .proposed {
  border: 1px solid #7d9297;
  border-left: 8px solid #b5dc37;
  border-radius: 2px;
  background: #d3e4e6;
  box-shadow: inset 0 1px 0 #f6ffff;
}
.brand-pc2001 .media-slot figcaption {
  font-family: var(--mono);
  font-size: .65rem;
  letter-spacing: .03em;
  text-transform: uppercase;
}

/* Operating sequence */
.brand-pc2001 .steps {
  gap: 0;
  overflow: hidden;
  border: 13px solid #b7bcba;
  border-radius: 13px;
  background: #657174;
  box-shadow: inset 0 0 0 1px #616a6c, 0 5px 0 #7e8788;
}
.brand-pc2001 .steps li {
  position: relative;
  border-right: 1px solid #899da1;
  padding: 3.2rem 1.65rem 2rem;
  background: #d9e8ea;
}
.brand-pc2001 .steps li:last-child { border-right: 0; }
.brand-pc2001 .steps li::before {
  position: absolute;
  top: 1.2rem;
  right: 1.4rem;
  left: 1.4rem;
  height: 4px;
  background: #1748c7;
  content: "";
}
.brand-pc2001 .steps li:last-child::before { background: #b5dc37; }
.brand-pc2001 .step-number { margin-bottom: 1.1rem; color: #103ba8; }
.brand-pc2001 .steps p { color: #526167; }

/* Modular capability console */
.brand-pc2001 .features {
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
  align-items: stretch;
}
.brand-pc2001 .feature {
  position: relative;
  border: 1px solid #747e80;
  border-top: 9px solid #1748c7;
  border-radius: 6px;
  padding: 1.5rem;
  background: #e3e7e4;
  box-shadow: inset 0 1px 0 #fff, 0 4px 0 #929a99;
}
.brand-pc2001 .feature:nth-child(1) { grid-column: 1 / span 5; }
.brand-pc2001 .feature:nth-child(2) { grid-column: 6 / -1; }
.brand-pc2001 .feature:nth-child(3) { grid-column: 3 / span 8; border-top-color: #8eaf2c; }
.brand-pc2001 .feature-tag { margin-bottom: 2.8rem; color: #485358; }
.brand-pc2001 .feature-tag::before { border: 1px solid #596619; border-radius: 50%; }
.brand-pc2001 .feature p { color: #546065; }

/* Dark service bay with an inset specification plate */
.brand-pc2001 #open-source {
  border-top-color: #151a1c;
  background: #2a3033;
  color: #eef2ef;
  box-shadow: inset 0 7px 0 #1748c7;
}
.brand-pc2001 #open-source .eyebrow { color: #c5e762; }
.brand-pc2001 #open-source h2 { color: #f2f5f2; }
.brand-pc2001 #open-source .lede,
.brand-pc2001 #open-source .small { color: #c3ccce; }
.brand-pc2001 .commitment {
  border: 12px solid #afb5b2;
  border-radius: 9px;
  background: #dce9eb;
  color: #242a2e;
  box-shadow: inset 0 0 0 1px #707b7d, 0 5px 0 #171b1d;
}
.brand-pc2001 .commitment dt,
.brand-pc2001 .commitment dd { border-color: #8fa1a5; }
.brand-pc2001 .commitment dt { color: #526166; }
.brand-pc2001 .commitment dd { font-family: var(--mono); font-size: .78rem; }

/* Walkthrough device surface */
.brand-pc2001 .video-frame {
  border: 20px solid #b7bcb9;
  border-top-width: 48px;
  background: #273033;
  color: #eef2ef;
  box-shadow: inset 0 0 0 2px #73868a, 0 16px 34px rgb(36 42 46 / .2);
}
.brand-pc2001 .video-frame::before {
  position: absolute;
  top: -32px;
  left: 0;
  color: #3d464a;
  content: "I/O  05";
  font-family: var(--mono);
  font-size: .6rem;
  letter-spacing: .08em;
}
.brand-pc2001 .video-glyph {
  border: 1px solid #789197;
  border-radius: 7px;
  background: #cbdde2;
  color: #1748c7;
  box-shadow: inset 0 2px 0 #effafa, 0 4px 0 #637174;
}
.brand-pc2001 .video-message p { color: #b9c8ca; }

/* Manual-style FAQ */
.brand-pc2001 .faq-list {
  max-width: none;
  border: 1px solid #747e80;
  border-top: 8px solid #1748c7;
  border-radius: 5px;
  background: #e7e9e6;
  box-shadow: inset 0 1px 0 #fff, 0 4px 0 #929a99;
}
.brand-pc2001 details { border-bottom-color: #a3aaa9; }
.brand-pc2001 details:last-child { border-bottom: 0; }
.brand-pc2001 summary { padding-left: 1.2rem; }
.brand-pc2001 summary::after {
  right: 1rem;
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border: 1px solid #7e8788;
  border-radius: 3px;
  background: #d5d9d6;
  color: #1748c7;
  font-family: var(--mono);
  font-size: 1rem;
  box-shadow: inset 0 1px 0 #fff, 0 2px 0 #8e9695;
}
.brand-pc2001 details p { padding-left: 1.2rem; }

/* Cobalt command area keeps the download unmistakable. */
.brand-pc2001 .final-cta {
  border-top: 10px solid #b5dc37;
  background: #1748c7;
  color: #f5f7f4;
  text-align: left;
}
.brand-pc2001 .final-cta .container {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(250px, 4fr);
  column-gap: 3rem;
}
.brand-pc2001 .final-cta .eyebrow,
.brand-pc2001 .final-cta h2,
.brand-pc2001 .final-cta .lede { grid-column: 1; }
.brand-pc2001 .final-cta .eyebrow { color: #d8ed94; }
.brand-pc2001 .final-cta h2 { color: #fff; }
.brand-pc2001 .final-cta .lede { color: #dbe3f7; }
.brand-pc2001 .final-cta .actions {
  grid-column: 2;
  grid-row: 1 / span 4;
  align-self: center;
  justify-self: end;
  margin: 0;
}
.brand-pc2001 .final-cta .button {
  border-color: #d6dde7;
  background: #eef2ef;
  color: #17306c;
  box-shadow: inset 0 1px 0 #fff, 0 5px 0 #aab3bd, 0 9px 16px rgb(9 24 59 / .25);
}
.brand-pc2001 .final-cta .button:hover { background: #fff; }
.brand-pc2001 .final-cta .button:active { box-shadow: inset 0 2px 4px rgb(36 42 46 / .22), 0 1px 0 #aab3bd; }
.brand-pc2001 .final-cta .availability { grid-column: 1; color: #c4d0ef; }
.brand-pc2001 .site-footer { border-color: #7e8788; background: #c4c9c6; }

@media (max-width: 850px) {
  .brand-pc2001 .hero-grid,
  .brand-pc2001 .section-heading,
  .brand-pc2001 .open-source-grid { grid-template-columns: minmax(0, 1fr); }
  .brand-pc2001 .hero-mark { width: min(100%, 680px); }
  .brand-pc2001 .hero-copy { max-width: 650px; }
  .brand-pc2001 .section-heading { gap: 1.4rem; }
  .brand-pc2001 .feature:nth-child(1),
  .brand-pc2001 .feature:nth-child(2),
  .brand-pc2001 .feature:nth-child(3) { grid-column: auto; }
  .brand-pc2001 .features { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 560px) {
  .brand-pc2001 h1 { font-size: clamp(2.85rem, 14vw, 4rem); }
  .brand-pc2001 h2 { font-size: clamp(2.05rem, 10vw, 3rem); }
  .brand-pc2001 .hero { padding-block: 3.5rem 4.5rem; }
  .brand-pc2001 .hero-grid { gap: 3.25rem; }
  .brand-pc2001 .hero-copy { padding-left: 1rem; border-left-width: 6px; }
  .brand-pc2001 .hero-copy::before { left: -6px; width: 6px; }
  .brand-pc2001 .hero-mark {
    min-height: 535px;
    grid-template-columns: 1fr;
    border-width: 14px;
    border-top-width: 66px;
    border-bottom-width: 35px;
    border-radius: 23px 23px 12px 12px;
  }
  .brand-pc2001 .hero-mark::before { top: -47px; }
  .brand-pc2001 .hero-mark::after { top: -47px; }
  .brand-pc2001 .context-card,
  .brand-pc2001 .context-card:nth-child(1),
  .brand-pc2001 .context-card:nth-child(2),
  .brand-pc2001 .context-card:nth-child(3) {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid #8da5aa;
    padding: 2.4rem 1rem 1rem;
  }
  .brand-pc2001 .context-card:last-child { border-bottom: 0; }
  .brand-pc2001 .context-card::before { top: 1.15rem; right: 1rem; }
  .brand-pc2001 .context-card:last-child::before { right: 1rem; }
  .brand-pc2001 .context-card::after { top: calc(1.15rem + 4px); right: 1rem; left: 1rem; }
  .brand-pc2001 .card-kicker { margin-bottom: .45rem; }
  .brand-pc2001 .context-card strong { margin-bottom: .2rem; }
  .brand-pc2001 .section-shell[data-section]::before { left: 14px; }
  .brand-pc2001 .section-heading { margin-top: 1.8rem; padding-top: 1.8rem; }
  .brand-pc2001 .media-frame { border-width: 10px; border-top-width: 40px; border-bottom-width: 22px; }
  .brand-pc2001 .window-chrome { top: -34px; }
  .brand-pc2001 .window-chrome i { width: 18px; }
  .brand-pc2001 .preview-ui { grid-template-columns: 34% 1fr; }
  .brand-pc2001 .steps { border-width: 9px; }
  .brand-pc2001 .steps li { border-right: 0; border-bottom: 1px solid #899da1; }
  .brand-pc2001 .steps li:last-child { border-bottom: 0; }
  .brand-pc2001 .features { grid-template-columns: 1fr; }
  .brand-pc2001 .feature-tag { margin-bottom: 1.5rem; }
  .brand-pc2001 .commitment { border-width: 8px; }
  .brand-pc2001 .video-frame { border-width: 11px; border-top-width: 43px; }
  .brand-pc2001 .video-frame::before { top: -29px; }
  .brand-pc2001 .final-cta .container { grid-template-columns: 1fr; }
  .brand-pc2001 .final-cta .eyebrow,
  .brand-pc2001 .final-cta h2,
  .brand-pc2001 .final-cta .lede,
  .brand-pc2001 .final-cta .actions,
  .brand-pc2001 .final-cta .availability { grid-column: 1; }
  .brand-pc2001 .final-cta .actions { grid-row: auto; justify-self: stretch; margin-top: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  .brand-pc2001 .wordmark::after,
  .brand-pc2001 .hero-mark::after { animation: none; }
}
