/* ACP Nexus Garage professional presentation and document polish. */
.logo {
  width: 76px !important;
  height: 56px !important;
  padding: 3px;
  object-fit: contain !important;
  background: #020817 !important;
}

.hero {
  background-image:
    linear-gradient(90deg, rgba(3, 13, 30, .98) 0%, rgba(4, 30, 68, .92) 52%, rgba(4, 25, 55, .64) 100%),
    url('/assets/acp-nexus-garage-logo.jpeg') !important;
  background-position: center, right 18px center !important;
  background-size: cover, 470px auto !important;
  background-repeat: no-repeat !important;
}

.garage-welcome-card {
  grid-template-columns: minmax(340px, .95fr) minmax(390px, 1.05fr) !important;
  width: min(1180px, calc(100vw - 40px)) !important;
  min-height: 0 !important;
  max-height: calc(100vh - 40px);
}

.garage-welcome-visual {
  min-height: 0 !important;
  aspect-ratio: 1.42 / 1;
  background-image: url('/assets/acp-nexus-garage-logo.jpeg') !important;
  background-position: center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-color: #020817 !important;
  border-right: 1px solid rgba(99, 168, 255, .2);
}

.garage-welcome-copy {
  overflow: auto;
  padding: clamp(30px, 4.5vw, 54px) !important;
}

.garage-about-logo {
  height: auto;
  max-height: 240px !important;
  padding: 8px;
  object-fit: contain !important;
}

.doc-sheet {
  width: 100%;
  color: #10223b;
  background: #fff;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.doc-header {
  display: grid;
  grid-template-columns: 112px 1fr auto;
  gap: 18px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 3px solid #0868d9;
}

.doc-logo {
  width: 108px;
  height: 74px;
  padding: 4px;
  border-radius: 10px;
  object-fit: contain;
  background: #020817;
}

.doc-company h2,
.doc-title h1,
.doc-section h3 {
  margin: 0;
}

.doc-company h2 {
  color: #072b58;
  font-size: 22px;
}

.doc-company p,
.doc-title p,
.doc-note,
.doc-footer {
  color: #5d6d82;
  font-size: 11px;
  line-height: 1.55;
}

.doc-company p,
.doc-title p {
  margin: 4px 0 0;
}

.doc-title {
  min-width: 210px;
  text-align: right;
}

.doc-title h1 {
  color: #0868d9;
  font-size: 24px;
  letter-spacing: .035em;
}

.doc-demo-label {
  display: inline-block;
  margin-bottom: 7px;
  padding: 5px 9px;
  border: 1px solid #e0a323;
  border-radius: 999px;
  color: #815500;
  background: #fff6d8;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.doc-meta,
.doc-info-grid,
.doc-signatures {
  display: grid;
  gap: 12px;
}

.doc-meta {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 16px 0;
}

.doc-info-grid,
.doc-signatures {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 14px 0;
}

.doc-meta div,
.doc-info,
.doc-signature {
  padding: 11px 12px;
  border: 1px solid #d8e2ee;
  border-radius: 8px;
  background: #f8fbff;
}

.doc-meta span,
.doc-info span {
  display: block;
  margin-bottom: 4px;
  color: #66758a;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.doc-meta b,
.doc-info b {
  font-size: 12px;
}

.doc-section {
  margin-top: 17px;
}

.doc-section h3 {
  margin-bottom: 8px;
  color: #073b77;
  font-size: 12px;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.doc-table {
  width: 100%;
  min-width: 0 !important;
  border: 1px solid #cfdbe8;
  border-collapse: collapse;
}

.doc-table th,
.doc-table td {
  padding: 9px 10px;
  border: 1px solid #dbe4ee;
  color: #172b44;
  font-size: 10px;
  vertical-align: top;
}

.doc-table th {
  color: #fff;
  background: #073b77;
  letter-spacing: .04em;
}

.doc-totals {
  width: min(360px, 100%);
  margin: 14px 0 0 auto;
  border: 1px solid #ccd8e5;
  border-radius: 8px;
  overflow: hidden;
}

.doc-total-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 11px;
  border-bottom: 1px solid #dbe4ee;
  font-size: 11px;
}

.doc-total-row:last-child {
  border-bottom: 0;
}

.doc-total-row.grand {
  color: #fff;
  background: #0868d9;
  font-size: 14px;
  font-weight: 900;
}

.doc-signatures {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 28px;
}

.doc-signature {
  min-height: 82px;
  background: #fff;
}

.doc-signature b {
  color: #073b77;
  font-size: 10px;
  text-transform: uppercase;
}

.doc-footer {
  margin-top: 18px;
  padding-top: 10px;
  border-top: 2px solid #0868d9;
  text-align: center;
}

@media (max-width: 900px) {
  .garage-welcome-card {
    grid-template-columns: 1fr !important;
    width: min(720px, calc(100vw - 20px)) !important;
    max-height: calc(100vh - 20px);
  }

  .garage-welcome-visual {
    width: 100%;
    height: clamp(210px, 34vh, 310px);
    aspect-ratio: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(99, 168, 255, .2);
  }

  .garage-welcome-copy {
    padding: 28px !important;
  }
}

@media (max-width: 600px) {
  .garage-welcome-visual {
    height: 185px;
  }

  .garage-welcome-copy {
    padding: 22px 18px !important;
  }

  .garage-welcome-copy h1 {
    font-size: 34px !important;
  }

  .hero {
    background-size: cover, 300px auto !important;
    background-position: center, right -70px center !important;
  }

  .doc-header {
    grid-template-columns: 76px 1fr;
  }

  .doc-logo {
    width: 72px;
    height: 54px;
  }

  .doc-title {
    grid-column: 1 / -1;
    text-align: left;
  }

  .doc-meta,
  .doc-info-grid,
  .doc-signatures {
    grid-template-columns: 1fr;
  }
}

@media print {
  @page {
    size: A4;
    margin: 11mm;
  }

  html,
  body {
    width: 210mm;
    min-height: 297mm;
    background: #fff !important;
  }

  .garage-welcome,
  .garage-demo-banner,
  .no-print,
  .print-toolbar {
    display: none !important;
  }

  .doc-sheet {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .doc-table tr,
  .doc-info,
  .doc-signature,
  .doc-totals {
    break-inside: avoid;
  }
}