/* Shared contact and Telegram treatment for the approved static site. */
:root {
  --muted:#aaaab0!important;
  --dim:#7b7b82!important;
}

body {
  text-rendering:optimizeLegibility;
}

.btn-header {
  height:40px!important;
  min-height:40px!important;
  padding-left:16px!important;
  padding-right:16px!important;
  border-radius:9px!important;
  font-size:13px!important;
}

.nav-cta,
.j-header-cta,
.top-cta {
  height:40px!important;
  min-height:40px!important;
  padding-left:16px!important;
  padding-right:16px!important;
  font-size:13px!important;
}

.pps-mobile-links .pps-tg-button {
  margin-top:18px;
  border-bottom:1px solid rgba(42,171,238,.48)!important;
}

small {
  font-size:10px!important;
  line-height:1.35!important;
}

input::placeholder,
textarea::placeholder {
  color:#808087!important;
  opacity:1!important;
}

.section-marker,
.case-square__top,
.case-detail__meta,
.case-detail__label,
.process-kanban__head,
.process-kanban__foot,
.process-column__head,
.process-card__tags span,
.scope-sheet__label,
.scope-sheet__top,
.scope-sheet__footer,
.model-head,
.model-foot,
.hero-meta,
.section-id,
.role-label,
.map-head,
.map-foot,
.case-no,
.index-label,
.node-kicker,
.node-foot,
.arch-code,
.cta-kicker,
.cta-number {
  color:#83838a!important;
  font-size:9.5px!important;
  line-height:1.35!important;
}

.process-card small,
.process-card__tags span {
  color:#797980!important;
}

.process-card strong {
  color:#d0d0d4!important;
  font-size:13px!important;
  line-height:1.42!important;
}

footer,
.footer,
.footer-links,
.form-note,
.hero-microcopy {
  color:#76767d!important;
  line-height:1.5!important;
}

.scope-sheet,
.process-kanban,
.work-items,
.cta-panel,
.contact-form,
.model,
.welcome,
.roles,
.scope-grid,
.contact-panel,
.hero-map,
.fit-card,
.flow-stage,
.visual-scene,
.impact-stage,
.cta-protocol,
.architecture,
.before-scene {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 0 48px rgba(255,255,255,.018),
    0 0 44px rgba(255,255,255,.028),
    0 28px 84px rgba(0,0,0,.34)!important;
}

.case-detail {
  isolation:isolate;
}

.case-detail::before {
  inset:-38px -48px!important;
  border-radius:24px;
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.065),transparent 42%),
    radial-gradient(ellipse at 50% 52%,rgba(255,255,255,.022),rgba(5,5,5,.48) 62%,transparent 78%)!important;
  box-shadow:0 0 56px rgba(255,255,255,.025);
}

.pps-logo,
.brand {
  display:inline-flex!important;
  align-items:center!important;
  gap:13px!important;
  height:46px!important;
  color:#f5f5f5!important;
  font-size:18px!important;
  font-weight:670!important;
  letter-spacing:-.025em!important;
  line-height:1!important;
}

.pps-logo-mark,
.brand-mark {
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.pps-logo-mark canvas,
.brand-mark canvas {
  display:block!important;
  width:100%!important;
  height:100%!important;
}

.pps-tg-button,
.pps-tg-action,
.pps-tg-footer,
.pps-tg-mobile,
.pps-social-link--telegram {
  --tg:#229ed9;
  --tg-hover:#2aabee;
}

.pps-tg-icon {
  position:relative;
  flex:0 0 auto;
  width:18px;
  height:16px;
  display:inline-block;
}

.pps-tg-icon::before {
  content:"";
  position:absolute;
  inset:0;
  background:currentColor;
  clip-path:polygon(0 42%,100% 0,72% 100%,49% 66%,31% 83%,34% 60%);
}

.pps-tg-button {
  width:40px!important;
  min-width:40px!important;
  height:40px;
  min-height:40px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(42,171,238,.48)!important;
  border-radius:12px!important;
  background:rgba(34,158,217,.12)!important;
  color:var(--tg)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 28px rgba(34,158,217,.11)!important;
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease!important;
}

.pps-tg-button:hover,
.pps-tg-button:focus-visible {
  color:#fff!important;
  background:var(--tg)!important;
  border-color:var(--tg-hover)!important;
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(34,158,217,.25)!important;
  outline:none;
}

.form-actions {
  align-items:center;
}

.form-actions .pps-tg-button {
  flex:0 0 40px;
}

.pps-tg-action {
  display:inline-flex!important;
  align-items:center;
  gap:12px!important;
  border-color:rgba(42,171,238,.34)!important;
  color:#d9f3ff!important;
  background:rgba(34,158,217,.07)!important;
}

.pps-tg-action .pps-tg-icon {color:var(--tg)}
.pps-tg-action:hover,.pps-tg-action:focus-visible {background:rgba(34,158,217,.14)!important;border-color:rgba(42,171,238,.68)!important}

.pps-tg-footer,.pps-tg-mobile,.pps-social-link--telegram {display:inline-flex!important;align-items:center;gap:9px}
.pps-tg-footer .pps-tg-icon,.pps-tg-mobile .pps-tg-icon,.pps-social-link--telegram .pps-tg-icon {width:15px;height:13px;color:var(--tg)}

.contact-form {
  position:relative;
  padding:clamp(22px,2.6vw,34px)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 100% 0,rgba(255,255,255,.055),transparent 34%),
    linear-gradient(145deg,rgba(255,255,255,.026),rgba(255,255,255,.008)),
    rgba(9,9,10,.86)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 24px 70px rgba(0,0,0,.22);
  transition:border-color .2s ease,box-shadow .2s ease;
}

.contact-form::before {
  content:"REQUEST / OPEN";
  justify-self:start;
  margin-bottom:2px;
  color:#626268;
  font:8px/1 "SFMono-Regular",Consolas,"Liberation Mono",monospace;
  letter-spacing:.15em;
}

.contact-form:focus-within {
  border-color:rgba(255,255,255,.3)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 28px 80px rgba(0,0,0,.32);
}

.contact-form .field input,
.contact-form .field textarea {
  border-color:rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.027)!important;
}

.contact-form .field input:focus,
.contact-form .field textarea:focus {
  border-color:rgba(255,255,255,.38)!important;
  box-shadow:0 0 0 3px rgba(255,255,255,.035)!important;
}

@media(max-width:700px){
  .pps-logo,.brand{height:40px!important;gap:11px!important;font-size:16px!important}
  .pps-logo-mark,.brand-mark{width:32px!important;height:32px!important;flex-basis:32px!important}
  .contact-form{padding:22px 18px!important;border-radius:16px!important}
  .pps-home .contact-form .form-actions{display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px}
  .pps-home .contact-form .form-actions .btn-primary{grid-column:1/-1;width:100%}
  .pps-home .contact-form .form-actions .pps-tg-button{grid-column:1}
  .pps-home .contact-form .form-actions .btn-secondary{grid-column:2;width:100%}
}
