/*
 * DCME POS BLUE / WHITE — 8 September 2026
 * Shared brand layer for the homepage, product pages and resource libraries.
 * Bright blue: DCME POS header. Teal: collection. Red: drop-off. Grey: loading.
 * Darker shades are used behind small white type to keep controls readable.
 * Existing page content, commercial terms, routes and contact handlers are retained.
 */
:root {
  color-scheme: light;
  --pos-blue: #007bff;
  --pos-teal: #17a2b8;
  --pos-red: #dc3545;
  --pos-grey: #6c757d;
  --ink: #132b43;
  --ink-2: #263f58;
  --ink2: #263f58;
  --navy: #12385f;
  --navy-2: #164f82;
  --navy2: #164f82;
  --blue: #0064d9;
  --blue-2: #004eae;
  --blue2: #004eae;
  --aqua: #087e93;
  --aqua-2: #086678;
  --cyan: #17a2b8;
  --green: #17824b;
  --green2: #12633b;
  --lime: #0064d9;
  --success: #12633b;
  --warning: #936000;
  --amber: #936000;
  --danger: #be263b;
  --red: #be263b;
  --burnt: #0064d9; /* Backwards-compatible names for the older landing pages. */
  --burnt2: #004eae;
  --white: #fff;
  --cloud: #f3f8fe;
  --cloud-2: #eaf3ff;
  --cream: #f3f8fe;
  --soft: #f3f8fe;
  --soft2: #eaf3ff;
  --line: #dce8f5;
  --line2: #b7d2ee;
  --line-dark: rgba(255,255,255,.18);
  --muted: #50657d;
  --muted-dark: #c9dff4;
  --shadow-sm: 0 8px 28px rgba(18,56,95,.065);
  --shadow: 0 24px 64px rgba(18,56,95,.13);
}
body[data-dcme-theme="pos-blue"] { background: #fff; color: var(--ink); }
[hidden] { display: none !important; }
:where(a,button,summary,input,select,textarea):focus-visible {
  outline: 3px solid #007bff;
  outline-offset: 4px;
}
::selection { background: #cfe5ff; color: #12385f; }
section[id] { scroll-margin-top: 105px; }

/* Identity and navigation */
.dcme-pos-topbar, .utility, .factbar, .top {
  background: #0064d9;
  color: #fff;
  border-bottom-color: rgba(255,255,255,.16);
}
.dcme-pos-topbar-inner {
  min-height: 34px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .015em;
}
.dcme-pos-topbar-inner b { font-weight: 800; }
.dcme-pos-topbar-divider { margin-inline: 6px; opacity: .65; }
.factbar b, .utility a, .top a { color: #fff; }
.utility-points span::before { background: #a8f0e6; box-shadow: 0 0 0 4px rgba(255,255,255,.13); }
.header, .site-header, .professional-header, body[data-dcme-layout] > header {
  background: rgba(255,255,255,.97);
  border-bottom-color: var(--line);
}
.header.scrolled, .site-header.scrolled, .professional-header.scrolled {
  box-shadow: 0 8px 28px rgba(18,56,95,.09);
}
.professional-header-inner { min-height: 82px; }
.professional-brand { gap: 6px; }
.professional-brand-name { color: var(--blue); font-size: 30px; letter-spacing: -.065em; }
.professional-brand-name span { color: var(--ink); }
.professional-brand-tag { color: var(--muted); font-size: 9px; letter-spacing: .13em; }
.professional-nav a, .desktop-nav-simple > a { color: #263f58; }
.professional-nav a:hover, .professional-nav a:focus-visible,
.desktop-nav-simple > a:hover { background: #eaf3ff; color: var(--blue); }
.brand-mark { background: var(--blue); color: #fff; }
.brand-mark span { color: #fff; }
.brand-mark span:first-child { background: #0064d9; }
.brand-mark span:last-child { background: #087e93; }
.brand-copy strong, .brand-text strong { color: #12385f; }
body[data-dcme-layout="standalone"] header .brand strong,
body[data-dcme-layout="pos-system"] header .brand { color: var(--blue); }
body[data-dcme-layout="pos-system"] header .brand span { color: var(--ink); }
.nav-pop > summary:hover, .nav-pop[open] > summary { color: var(--blue); background: #edf5ff; }

/* Common actions: consistent contrast, spacing and focus states. */
.button-primary, .button-lime, .btn-primary,
body[data-dcme-layout="pos-system"] .button:not(.alt),
body[data-dcme-layout="pos-system"] header .cta {
  color: #fff;
  background: #0064d9;
  border-color: #0064d9;
  box-shadow: 0 8px 20px rgba(0,100,217,.18);
}
.button-primary:hover, .button-lime:hover, .btn-primary:hover,
body[data-dcme-layout="pos-system"] .button:not(.alt):hover,
body[data-dcme-layout="pos-system"] header .cta:hover {
  color: #fff;
  background: #004eae;
  border-color: #004eae;
}
.button-aqua, .button-green {
  background: #087e93;
  color: #fff;
  border-color: #087e93;
  box-shadow: 0 8px 20px rgba(8,126,147,.16);
}
.button-aqua:hover, .button-green:hover { background: #086678; color: #fff; }
.button-secondary, .btn-secondary {
  background: #fff;
  color: var(--blue);
  border-color: #b7d2ee;
}
.button-secondary:hover, .btn-secondary:hover { background: #edf5ff; border-color: var(--blue); }
.eyebrow, .kicker { color: var(--blue); }
.eyebrow { background: #eaf3ff; border-color: #c8def8; }
.eyebrow::before { background: var(--pos-blue); box-shadow: 0 0 0 4px rgba(0,123,255,.10); }
.eyebrow-light { background: rgba(255,255,255,.12); color: #ddecff; border-color: rgba(255,255,255,.25); }

/* White-and-blue hero, matching the supplied DCME POS reference. */
.hero, .home-hero, .page-hero, .pricing-hero, .buyer-hero,
.contact-hero, .hub-hero, .article-hero, body[data-page="home"] .home-hero {
  color: var(--ink);
  background: radial-gradient(ellipse at 94% 26%,rgba(0,123,255,.09),transparent 46%),
              radial-gradient(ellipse at 2% 100%,rgba(23,162,184,.05),transparent 40%),
              linear-gradient(115deg,#fff 0%,#f6faff 70%,#eef6ff 100%);
  border-bottom: 1px solid var(--line);
}
.hero::before, .hero::after,
body[data-page="home"] .home-hero::after { display: none; }
.home-hero::before, .page-hero::before, .pricing-hero::before,
.buyer-hero::before, .contact-hero::before, .hub-hero::before, .article-hero::before {
  border-color: rgba(0,123,255,.035);
}
.hero h1, body[data-page="home"] .home-copy h1 { color: #132b43; }
.hero h1 span { color: var(--blue); }
.hero-lead, .hero p, .home-lead, .page-lead,
.contact-hero > .wrap > div:not(.contact-card) > p, .pricing-hero p, .buyer-hero p,
.hub-hero p, .article-hero p, body[data-page="home"] .home-lead {
  color: var(--muted);
}
.hero-lead strong, .hero p strong, body[data-page="home"] .home-lead strong { color: #213c57; }
.hero .eyebrow { color: var(--blue); }
.hero-points, .hero-points li, .hero-billing, .billing-note { color: #405d79; }
.hero-points li::before { color: var(--blue); background: #e1eeff; }
.hero-billing b, .billing-note b { color: var(--ink); }
.hero .button-ghost { background: #fff; color: var(--blue); border-color: #b7d2ee; }
.hero .button-ghost:hover { background: #eaf3ff; border-color: var(--blue); }
.hero-price-card {
  background: #fff;
  border-color: #cfdef0;
  box-shadow: 0 7px 22px rgba(18,56,95,.055);
  backdrop-filter: none;
}
.hero-price-card:hover { background: #fff; border-color: #78b4ef; box-shadow: 0 12px 28px rgba(18,56,95,.09); }
.hero-price-card > span { color: var(--blue); }
.hero-price-card > strong { color: var(--blue); }
.hero-price-card > small { color: #50657d; }
.hero-price-card > b { color: #294c70; }
.hero-price-card-featured { background: #f1f9fc; border-color: #9acfd9; }
.hero-price-card-featured > span, .hero-price-card-featured > strong { color: #087487; }
body[data-dcme-layout="home"] .hero-actions .button-aqua {
  background: var(--blue); border-color: var(--blue); box-shadow: 0 8px 22px rgba(0,100,217,.18);
}
body[data-dcme-layout="home"] .hero-actions .button-aqua:hover { background: #004eae; }
.home-proof span { color: var(--muted); background: #fff; border-color: var(--line); }
.home-proof b { color: var(--blue); }
body[data-dcme-layout="home"] .hero-grid { padding-block: 54px 62px; }

/* POS demonstration: same blue header and distinct task colours as the software. */
.product-wrap { position: relative; }
.product-shell, body[data-page="home"] .product-visual {
  background: #fff;
  border: 1px solid #c7d9ee;
  box-shadow: 0 26px 64px rgba(18,56,95,.16),0 4px 12px rgba(18,56,95,.06);
  backdrop-filter: none;
}
.product-shell::before { display: none; }
.product-bar { background: #0064d9; color: #fff; border-bottom-color: #0064d9; min-height: 56px; }
.product-title strong { font-size: 13px; color: #fff; }
.product-title small { color: #dfedff; }
.product-badge { background: rgba(255,255,255,.18); color: #fff; }
.live-status { color: #d4ffed; }
.live-status::before { background: #79efc2; box-shadow: 0 0 0 4px rgba(121,239,194,.15); }
.product-body { background: #f8fbff; }
.product-nav span { color: #375879; border-color: #d7e5f6; background: #fff; }
.product-nav span.active { background: #0064d9; color: #fff; border-color: #0064d9; }
.dcme-pos-action-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-bottom: 12px; }
.dcme-pos-action {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 7px; min-height: 78px; padding: 10px 5px; border: 1px solid transparent;
  border-radius: 10px; color: #fff; font-size: 10px; font-weight: 800; line-height: 1.2;
  text-align: center; transition: transform .15s,box-shadow .15s;
}
.dcme-pos-action svg { display: block; flex: 0 0 auto; width: 25px; height: 25px; }
.dcme-pos-action:hover { transform: translateY(-2px); box-shadow: 0 5px 12px rgba(18,56,95,.15); }
.dcme-pos-action.drop { background: #c52e40; }
.dcme-pos-action.account { background: #0064d9; }
.dcme-pos-action.pickup { background: #087e93; }
.dcme-pos-action.load { background: #5e6b78; }
.kpi strong { color: #213c57; }
.kpi:nth-child(1) strong { color: var(--blue); }
.kpi:nth-child(2) strong { color: #17824b; }
.kpi:nth-child(3) strong { color: #087e93; }
.kpi:nth-child(4) strong { color: #536a80; }
.kpi small { color: #12633b; }
.status.ready { background: #e1f5e9; color: #12633b; }
.status.progress { background: #e7f1ff; color: #0058bd; }
.status.due { background: #fff0f2; color: #b6253b; }
.quick { border-color: #d9e6f3; background: #f6f9fd; }
.quick:nth-child(1) { background: #fff2f3; border-color: #f4d3d8; }
.quick:nth-child(1) i { background: #dc3545; }
.quick:nth-child(2) { background: #eaf8fa; border-color: #cceaf0; }
.quick:nth-child(2) i { background: #17a2b8; }
.quick:nth-child(3) { background: #edf4ff; border-color: #d2e4fb; }
.quick:nth-child(3) i { background: #007bff; }
.quick:nth-child(4) i { background: #6c757d; }
.product-foot { color: #50657d; }
.price-float { border-color: #cddff4; box-shadow: 0 12px 32px rgba(18,56,95,.14); }
.price-float strong { color: var(--blue); }

/* Content cards and coordinated navy sections. */
.proof, .trust-line { background: #fff; }
.proof-item b { color: #12385f; }
.proof-item { border-top-color: var(--line); }
.section-soft, .soft, .price-section { background: #f3f8fe; }
.price-choice-featured { border-color: #8cb9ee; box-shadow: 0 16px 44px rgba(0,100,217,.09); }
.price-ribbon, .price-card.featured::before { color: #fff; background: #0064d9; }
.price-terms-row { background: #fff; }
.capability-code, .card .code { background: #eaf3ff; color: var(--blue); }
.capability:nth-child(2) .capability-code, .capability:nth-child(5) .capability-code {
  background: #e3f5f8; color: #086678;
}
.capability:nth-child(3) .capability-code, .capability:nth-child(6) .capability-code {
  background: #e6f5ec; color: #12633b;
}
.section-dark, .dark {
  background: radial-gradient(ellipse at 100% 0,rgba(0,123,255,.16),transparent 55%),
              linear-gradient(120deg,#12385f,#174a73);
  color: #fff;
}
.section-dark .kicker, .section-dark .eyebrow,
.section-dark .service-card > span, .section-dark .control-card > span { color: #b7dbff; }
.section-dark .section-head p, .section-dark .section-heading > p,
.section-dark .service-card p, .section-dark .control-card p, .dark p { color: #d3e4f5; }
.intelligence-section {
  background: radial-gradient(ellipse at 100% 0,rgba(23,162,184,.15),transparent 54%),
              linear-gradient(120deg,#103451,#114768);
  color: #fff;
}
.intelligence-head p, .intel-card p, .intelligence-foot p { color: #d3e4f5; }
.intel-card > span, .intelligence-kicker { color: #a8efdf; }
.cta-band, .contact-band {
  background: linear-gradient(115deg,#0757bc,#087e93);
  color: #fff;
}
.cta-band p, .contact-band p { color: #e2f0ff; }
.cta-band .button-aqua, .cta-band .button-primary, .cta-band .button-lime,
.contact-band .btn-primary { background: #fff; color: #0055b9; border-color: #fff; }
.cta-band .button-aqua:hover, .cta-band .button-primary:hover,
.cta-band .button-lime:hover, .contact-band .btn-primary:hover { background: #eaf3ff; }
.contact-card { background: #12385f; border-color: #1f507d; }
.contact-card > span, .contact-card dt { color: #bedcff; }
.contact-card p { color: #d3e4f5; }
.footer, .site-footer, body[data-dcme-layout="standalone"] > footer,
body[data-dcme-layout="pos-system"] > footer { background: #102d4b; color: #c9dff4; }
.footer-col a, .footer-brand p, .footer-contact a { color: #c9dff4; }
.footer a:hover, .site-footer a:hover { color: #fff; }
.footer-brand .brand-mark { color: #fff; }
.pos-compare-head div:last-child { background: #0064d9; }
.tech-core { background: #0064d9; }
.tech-core span { color: #dfedff; }

/* Re-skin the existing contact display; its server-side behaviour is not changed. */
.contact-details-btn, .phone-reveal-btn { color: var(--blue); background: #fff; border-color: #b7d2ee; }
.contact-details-btn:hover, .phone-reveal-btn:hover { color: #004eae; background: #edf5ff; }
.private-contact-card, .dcme-private-contact__card { color: var(--ink); border-color: var(--line); }
.private-contact-actions a, .dcme-private-contact__actions a { background: #0064d9; color: #fff; }
.private-contact-actions a:nth-child(2), .dcme-private-contact__actions a:nth-child(2) { background: #087e93; color: #fff; }
.private-contact-actions a:nth-child(3), .dcme-private-contact__actions a:nth-child(3) { background: #12385f; color: #fff; }

/* Older landing-page headers gain a keyboard-accessible compact menu. */
.dcme-pos-menu-button { display: none; }
.professional-menu { display: none; }
@media (max-width:1080px) {
  .professional-menu { display: block; }
  .professional-header-inner { min-height: 72px; }
}
@media (max-width:920px) {
  .dcme-pos-menu-button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-width: 70px; min-height: 44px; margin-left: auto; padding: 0 13px;
    border: 1px solid #b7d2ee; border-radius: 11px; background: #fff; color: #0055b9;
    font-size: 12px; font-weight: 800; cursor: pointer;
  }
  #dcmePosLandingNav { display: none; }
  #dcmePosLandingNav.dcme-pos-nav-open {
    display: flex; position: absolute; top: 100%; left: 0; right: 0; z-index: 110;
    flex-direction: column; align-items: stretch; gap: 4px; margin: 0; padding: 14px;
    max-height: calc(100svh - 100px); overflow-y: auto;
    border-bottom: 1px solid #cbdff6; background: #fff;
    box-shadow: 0 12px 24px rgba(18,56,95,.12);
  }
  #dcmePosLandingNav a { display: block; min-height: 44px; padding: 12px; color: #294c70; border-radius: 9px; }
  #dcmePosLandingNav a:hover { background: #eaf3ff; color: var(--blue); }
  body[data-dcme-layout="pos-system"] .head { gap: 14px; }
  body[data-dcme-layout="pos-system"] .head > .cta { display: none; }
}
@media (max-width:640px) {
  .dcme-pos-topbar-inner { min-height: 30px; font-size: 9px; gap: 8px; }
  .dcme-pos-topbar-inner > span:last-child { text-align: right; }
  .dcme-pos-topbar-divider { margin-inline: 2px; }
  .professional-brand-name { font-size: 27px; }
  .professional-brand-tag { font-size: 8px; }
  body[data-dcme-layout="home"] .hero-grid { padding-block: 34px 40px; }
  .hero-price-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .hero-price-card { min-height: 160px; padding: 13px; }
  .hero-price-card > span { font-size: 8px; line-height: 1.4; }
  .hero-price-card > strong { font-size: 30px; }
  .hero-price-card > small, .hero-price-card > b { font-size: 9px; }
  .product-bar { min-height: 52px; }
  .product-title strong { font-size: 12px; }
  .dcme-pos-action-grid { gap: 5px; }
  .dcme-pos-action { min-height: 72px; font-size: 9px; }
  .dcme-pos-action svg { width: 23px; height: 23px; }
  .product-foot { flex-wrap: wrap; }
  .contact-card dl > div { grid-template-columns: 80px minmax(0,1fr); }
}
@media (max-width:359px) {
  .dcme-pos-topbar-inner > span:last-child { display: none; }
  .hero-price-grid { grid-template-columns: 1fr; }
  .hero-price-card { min-height: 135px; }
  .dcme-pos-action-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .dcme-pos-action, .hero-price-card { transition: none; }
  .dcme-pos-action:hover { transform: none; }
}
@media print {
  .dcme-pos-topbar, .dcme-pos-menu-button { display: none !important; }
  .hero, .home-hero, .page-hero, .pricing-hero, .contact-hero,
  .section-dark, .intelligence-section { background: #fff !important; color: #000 !important; }
}

/* Final layout and contrast checks. */
.contact-hero .contact-card p { color: #d3e4f5; font-size: 13px; line-height: 1.6; }
.price-card.featured > em, .price-card > em { background: #0064d9; color: #fff; }
body[data-dcme-layout="home"] .price-float {
  position: static; width: 100%; margin-top: 12px; padding: 14px 18px;
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 14px;
  border-radius: 16px; box-shadow: 0 8px 24px rgba(18,56,95,.08);
}
body[data-dcme-layout="home"] .price-float strong { grid-row: 1 / span 2; grid-column: 2; margin: 0; }
body[data-dcme-layout="home"] .price-float small { grid-column: 1; margin: 0; }
body[data-dcme-layout="home"] .price-float span { grid-column: 1; }
.answer-copy { color: var(--muted); }
.section-dark .answer-copy { color: #d3e4f5; }
.check-panel, .check-panel h3 { color: var(--ink); }
.check-panel p, .section-dark .check-panel p { color: var(--muted); }
.dark .card, .dark .card h3 { color: var(--ink); }
.dark .card p { color: var(--muted); }
.footer-bottom, .footer-bottom p,
.footer .footer-bottom, .site-footer .footer-bottom,
.footer-ecosystem > span { color: #bdd5ed; }
.product-badge { background: #0055b9; color: #fff; }
.visual-top { background: #0064d9; color: #fff; border-radius: 15px 15px 0 0; }
.visual-top b { color: #fff; }
body[data-dcme-layout="pos-system"] .row.head > div { color: #fff; }
.footer-family > span { color: #bdd5ed; }
