:root{
  --techpsc-bg:#f7f2ea;
  --techpsc-bg-soft:#f2eadf;
  --techpsc-surface:#fffefa;
  --techpsc-ink:#18120d;
  --techpsc-muted:#64594d;
  --techpsc-line:rgba(24,18,13,.14);
  --techpsc-brand:#c9642f;
  --techpsc-brand-dark:#18120d;
  --techpsc-radius:16px;
  --techpsc-shadow:0 8px 18px rgba(26,24,20,.06);
}

html[data-theme="dark"]{
  --techpsc-bg:#070b14;
  --techpsc-bg-soft:#0b1220;
  --techpsc-surface:#10182a;
  --techpsc-ink:#f5f7fc;
  --techpsc-muted:#b8c3d8;
  --techpsc-line:#273149;
  --techpsc-brand:#f08a4b;
  --techpsc-brand-dark:#0a1020;
  --techpsc-shadow:0 16px 34px rgba(0,0,0,.30);
}

.masthead,
.site-header{
  position:sticky;
  top:0;
  z-index:30;
  width:100%;
  border-bottom:1px solid var(--techpsc-line);
  background:color-mix(in srgb,var(--techpsc-bg) 92%,transparent);
  backdrop-filter:blur(16px);
}

.masthead-inner,
.header-inner,
.footer-inner{
  width:min(1120px,calc(100% - 32px));
  margin-inline:auto;
}

.masthead-inner,
.header-inner{
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:var(--techpsc-ink);
}

.brand .mark,
.mark{
  width:38px;
  height:38px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:var(--techpsc-brand-dark);
  color:#fff3e7;
  font-weight:850;
  overflow:hidden;
}

.brand .mark img,
.site-footer .brand .mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.brand strong{
  display:block;
  font-size:16px;
  font-weight:850;
  letter-spacing:-.02em;
}

.brand small,
.brand .tag{
  display:block;
  color:var(--techpsc-muted);
  font-size:11px;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1.1;
}

.nav,
.nav-links{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.nav a,
.nav-links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid transparent;
  color:var(--techpsc-muted);
  font-size:14px;
  font-weight:750;
  white-space:nowrap;
}

.nav a:hover,
.nav-links a:hover,
.nav a.active,
.nav-links a.active{
  color:var(--techpsc-ink);
  background:var(--techpsc-surface);
  border-color:var(--techpsc-line);
}

.masthead-actions,
.nav-actions{
  display:flex;
  align-items:center;
  gap:9px;
}

.btn,
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 16px;
  border-radius:10px;
  border:1px solid var(--techpsc-line);
  background:var(--techpsc-surface);
  color:var(--techpsc-ink);
  font-weight:850;
  font-size:14px;
}

.btn.primary,
.button.primary{
  background:var(--techpsc-brand-dark);
  border-color:var(--techpsc-brand-dark);
  color:#fff6ec;
}

.btn.orange,
.button.orange{
  background:var(--techpsc-brand);
  border-color:var(--techpsc-brand);
  color:#fff;
}

.site-footer,
.footer{
  margin-top:auto;
  border-top:1px solid var(--techpsc-line);
  background:var(--techpsc-bg-soft);
  color:var(--techpsc-muted);
}

.footer-inner{
  padding:24px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.footer-links,
.footer-icons{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:13px;
  font-weight:750;
}

.footer-links a:hover,
.footer-icons a:hover{
  color:var(--techpsc-brand);
}

@media (max-width:900px){
  .masthead-inner,
  .header-inner{
    flex-wrap:wrap;
    align-items:flex-start;
    padding:12px 0;
  }

  .nav,
  .nav-links{
    order:3;
    width:100%;
    overflow-x:auto;
    flex-wrap:nowrap;
    scrollbar-width:none;
  }

  .nav::-webkit-scrollbar,
  .nav-links::-webkit-scrollbar{
    display:none;
  }

  .masthead-actions,
  .nav-actions{
    margin-left:auto;
  }

  .footer-inner{
    align-items:flex-start;
    flex-direction:column;
  }
}