/* Supplied website palette. The official HiPos logo retains its original colors. */
:root {
  --primary: #003fb3;
  --primary-deep: #002c5f;
  --primary-soft: #edf2ff;
  --accent: #ff6a00;
  --violet: #6d4cff;
  --brand-orange: #fe8302;
  --accent-soft: #fff0df;
  --navy: var(--primary-deep);
  --ink: #002c5f;
  --muted: #6b7280;
  --line: #e1e7f2;
  --surface: #f3f6fb;
}

/* Preserve the proportions and original colors of the complete logo. */
.brand-official { display:inline-flex; flex-shrink:0; }
.brand.brand-official img { width:155px; height:auto; aspect-ratio:2683 / 1058; object-fit:contain; }
.brand.brand-footer { display:inline-flex; padding:0; background:transparent; border-radius:0; }
.brand.brand-footer img { width:190px; height:auto; filter:brightness(0) invert(1); }
.dash-logo { width:78px; height:auto; aspect-ratio:2683 / 1058; object-fit:contain; flex-shrink:0; }

.announcement { background:var(--primary); color:#fff; }
.eyebrow, .breadcrumb a:hover, .solution-nav a:hover { color:var(--primary); }
.eyebrow-line { background:var(--accent); }
.nav-link:hover, .nav-link.active { color:var(--primary); }
.nav-new { background:var(--accent-soft); color:#874000; }
.button-dark { background:var(--primary); color:#fff; }
.button-dark:hover { background:var(--primary-deep); }
.button-accent { background:var(--accent); color:var(--primary-deep); }
.button-accent:hover { background:#ff9b33; }
.button-outline { border-color:#b8c8ec; color:var(--primary); }
.button-outline:hover { background:var(--primary-soft); border-color:var(--primary); }
.text-link:hover, .card-link:hover, .product-card-bottom>a:hover { color:var(--primary); }
.hero { background:radial-gradient(ellipse at 84% 35%,#e2eaff 0,transparent 51%),#fafbff; }
.highlight { background:linear-gradient(transparent 60%,#ffd7ae 60%,#ffd7ae 94%,transparent 94%); box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.hero-asterisk { color:var(--accent); }
.hero-actions>.button-dark { background:var(--accent); color:var(--primary-deep); }
.hero-actions>.button-dark:hover { background:#ff9b33; }
.hero-assurances .icon { color:var(--primary); }
.hero-assurances, .hero-bottom a { color:#556889; }
.hero-bottom { border-color:var(--line); color:#657596; }
.feature-icon, .float-icon { color:var(--primary); background:var(--primary-soft); }
.feature-card:hover { border-color:#adc1f0; background:#f5f8ff; }
.process-step>span { background:var(--accent-soft); border-color:#ffd4a6; color:#914600; }
.page-hero { background:radial-gradient(ellipse at 83% 12%,#e7edff,transparent 55%),#f7f9ff; }
.contact-section { background:radial-gradient(ellipse at 0 0,#e7edff,transparent 53%),#fafbff; }
.restaurant-banner { border-color:#dae4ff; background:var(--primary-soft); }
.plans-section { background:linear-gradient(#f7f9ff 70px,#fff 70px); }
.plan-name { color:var(--primary); }
.featured-plan .plan-name { color:#ffad59; }
.featured-plan { background:var(--primary-deep); }
.featured-plan .button-accent { color:var(--primary-deep); }
.check-list .icon, .equipment-benefits .icon { color:var(--primary); }
.featured-plan .check-list .icon, .flow-steps .icon { color:#ffad59; }
.flow-heading .feature-icon { background:#1b3b86; color:#ffad59; }
.flow-steps>div { background:#143277; border-color:#325199; }
.flow-steps>div>span { color:#ffad59; }
.flow-heading>span:last-child, .solution-flow>p { color:#c3d0ec; }
.light-eyebrow { color:#ffad59; }
.equipment-copy p, .equipment-page-hero p { color:#c4d0e9; }
.equipment-page-hero .breadcrumb, .equipment-page-hero .breadcrumb a { color:#bdcdec; }
.equipment-page-hero .breadcrumb a:hover { color:#ffad59; }
.equipment-tags>span { color:#d8e1f2; border-color:#36508a; }
.product-label { color:var(--primary); }
.product-tags span { color:#3053a4; background:var(--primary-soft); }
.product-details summary:hover { color:var(--primary); }
.filter-button.active { background:var(--primary); border-color:var(--primary); }
.filter-button:hover:not(.active) { background:var(--primary-soft); border-color:#a3b9e9; }
.comparison-table td:nth-child(3) { background:var(--primary-soft); }

/* Orange accents and blue data graphics tie the interface to the logo. */
.dash-sidebar .selected { background:var(--primary); color:#fff; }
.dash-avatar { background:var(--primary-soft); color:var(--primary); }
.dash-title h3 span, .receipt-float>.icon { color:var(--accent); }
.chart-column>span { background:#a6bcf1; }
.chart-column:nth-last-child(2)>span { background:var(--accent); }
.chart-column:nth-last-child(1)>span { background:var(--primary); }
.dash-chart-title i { background:var(--primary); }
.transaction-icon, .pill-success { background:var(--primary-soft); color:var(--primary); }
.dash-stat small { color:var(--primary); }

/* Deep blue callout with orange action, so long text stays easy to read. */
.cta-panel { background:linear-gradient(115deg,var(--primary-deep),var(--primary)); color:#fff; }
.cta-panel h2 { color:#fff; }
.cta-panel .eyebrow { color:#ffb56c; }
.cta-panel p { color:#dce5ff; }
.cta-panel .button-dark { background:var(--accent); color:var(--primary-deep); }
.cta-panel .button-dark:hover { background:#ff9b33; }
.cta-decoration { color:#ffffff0d; }
.site-footer { background:#061c53; color:#c4d0e9; }
.footer-brand p, .footer-grid .footer-contact p { color:#c4d0e9; }
.footer-country, .footer-bottom { color:#abbcde; }
.footer-bottom { border-color:#2a4276; }
.footer-grid .footer-contact-link, .footer-grid a:hover { color:#ffad59; }
.floating-contact { background:var(--accent); color:var(--primary-deep); box-shadow:0 5px 20px #08236c33; }
.floating-contact:hover { background:#ff9b33; }

/* Forms and the scheduling modal use the same selection/focus language. */
:focus-visible { outline-color:var(--primary); }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px #163eaf20; }
.consent input, .demo-options input { accent-color:var(--primary); }
.consent a, .privacy-content p a, .contact-direct:hover { color:var(--primary); }
.form-field label>span, .field-hint, .form-footnote, .demo-timezone { color:#657596; }
.consent { color:#63718a; }
.success-icon { background:var(--primary-soft); color:var(--primary); }
.request-reference { background:var(--primary-soft); }
.request-reference strong { color:var(--primary); }
.demo-close { color:var(--primary); background:var(--primary-soft); }
.demo-close:hover { background:var(--accent-soft); color:#914600; }
.demo-dialog::backdrop { background:#061c53b0; }
.demo-options>label { background:#fafbff; border-color:#d5dff2; }
.demo-options>label:has(input:checked) { background:var(--primary-soft); border-color:var(--primary); box-shadow:0 0 0 1px var(--primary); }
.demo-options>label:has(input:focus-visible) { outline-color:var(--primary); }
.demo-options .icon, .demo-delivery-note strong { color:var(--primary); }
.demo-options small { color:#63718a; }
.demo-page { background:#f5f8ff; }

@media(max-width:1000px) and (min-width:701px) {
  .brand.brand-official img { width:126px; }
  .main-nav { gap:15px; }
  .nav-link { font-size:12px; }
  .nav-cta { padding:11px 13px; gap:10px; margin-left:0; font-size:12px; }
  .nav-new { display:none; }
}
@media(max-width:790px) and (min-width:701px) {
  .container.nav-wrap { width:calc(100% - 40px); }
  .main-nav { gap:11px; }
  .brand.brand-official img { width:116px; }
}
@media(max-width:700px) {
  .brand.brand-official img { width:132px; }
  .brand.brand-footer img { width:180px; }
  .dash-logo { width:66px; }
}