/* Color trial — Glacier Silver / Midnight Navy
   Loaded after the atlas layout styles so this experiment is easy to keep or revert. */

:root {
  --atlas-paper: #e7edf1;
  --atlas-paper-deep: #d6dfe5;
  --atlas-ink: #0d1821;
  --atlas-muted: #5c6870;
  --atlas-blue: #2255db;
  --atlas-red: #e14d38;
  --atlas-line: rgba(13,24,33,.19);
  --trial-paper: #e7edf1;
  --trial-paper-deep: #d6dfe5;
  --trial-paper-light: #f5f7f7;
  --trial-ink: #0d1821;
  --trial-navy: #0b1721;
  --trial-blue: #2255db;
  --trial-red: #e14d38;
}

::selection {
  color: #fff;
  background: var(--trial-blue);
}

/* Homepage surfaces */
body[data-current-page="home"] {
  background: var(--trial-paper);
}

body[data-current-page="home"] .atlas-home {
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(13,24,33,.04) 50%, transparent calc(50% + .5px)),
    var(--trial-paper);
}

body[data-current-page="home"] #nav,
body[data-current-page]:not([data-current-page="home"]) #nav {
  border-bottom-color: rgba(255,255,255,.1);
  color: #edf3f6;
  background: rgba(11,23,33,.96);
}

body[data-current-page="home"] #nav .nav-link,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link {
  color: #aab6bd;
}

body[data-current-page="home"] #nav .nav-link:hover,
body[data-current-page="home"] #nav .nav-link.active,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link:hover,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link.active {
  color: #fff;
}

body[data-current-page="home"] #nav .nav-link.active::after,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link.active::after {
  background: #6e91ff;
}

body[data-current-page="home"] #nav .nav-brand-copy strong,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-brand-copy strong {
  color: #fff;
}

body[data-current-page="home"] #nav .nav-brand-copy small,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-brand-copy small {
  color: #83919a;
}

body[data-current-page="home"] #nav .logo-cat-ear,
body[data-current-page]:not([data-current-page="home"]) #nav .logo-cat-ear {
  border-bottom-color: #f2f6f8;
}

body[data-current-page="home"] #nav .logo-cat-face,
body[data-current-page]:not([data-current-page="home"]) #nav .logo-cat-face {
  background: #f2f6f8;
}

body[data-current-page="home"] #nav .logo-cat-eye,
body[data-current-page]:not([data-current-page="home"]) #nav .logo-cat-eye {
  background: var(--trial-navy);
}

body[data-current-page="home"] #nav .logo-cat-mouth,
body[data-current-page]:not([data-current-page="home"]) #nav .logo-cat-mouth {
  border-bottom-color: var(--trial-navy);
}

body[data-current-page="home"] #nav .nav-search,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search {
  border-color: rgba(255,255,255,.13);
  background: rgba(255,255,255,.08);
}

body[data-current-page="home"] #nav .nav-search-input,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search-input {
  color: #f5f8fa;
}

body[data-current-page="home"] #nav .nav-search-input::placeholder,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search-input::placeholder {
  color: #85939c;
}

body[data-current-page="home"] #nav .btn-ghost,
body[data-current-page]:not([data-current-page="home"]) #nav .btn-ghost {
  border-color: rgba(255,255,255,.22);
  color: #e9eff2;
}

body[data-current-page="home"] #nav .menu-toggle,
body[data-current-page]:not([data-current-page="home"]) #nav .menu-toggle {
  color: #fff;
}

.atlas-focus,
.atlas-car-list .home-car-card {
  background: rgba(245,247,247,.58);
}

.atlas-route-paper {
  background: var(--trial-paper-light);
}

.atlas-search > div,
.atlas-view-all {
  background: rgba(245,247,247,.65);
}

/* SPA pages */
body[data-current-page]:not([data-current-page="home"]) {
  --primary: #2255db;
  --primary-d: #1842b6;
  --primary-l: #4f76e8;
  --accent: #2255db;
  --accent-d: #1842b6;
  --accent-l: #6d8df0;
  --bg: #e7edf1;
  --bg-1: #d6dfe5;
  --bg-2: #f5f7f7;
  --bg-glass: rgba(255,255,255,.48);
  --bg-glass-d: rgba(13,24,33,.04);
  --border: rgba(13,24,33,.22);
  --border-l: rgba(13,24,33,.11);
  --border-a: rgba(34,85,219,.62);
  --text: #0d1821;
  --text-2: rgba(13,24,33,.75);
  --text-3: rgba(13,24,33,.58);
  --text-4: rgba(13,24,33,.39);
  color: var(--trial-ink);
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(13,24,33,.04) 50%, transparent calc(50% + .5px)),
    var(--trial-paper);
}

body[data-current-page]:not([data-current-page="home"]) #nav .nav-search-results {
  color: var(--trial-ink);
  background: #f5f7f7;
}

body[data-current-page]:not([data-current-page="home"]) .filter-count,
body[data-current-page]:not([data-current-page="home"]) .btn-ghost,
body[data-current-page]:not([data-current-page="home"]) .car-card,
body[data-current-page]:not([data-current-page="home"]) .compare-slot .cs-label {
  color: var(--trial-ink);
}

body[data-current-page]:not([data-current-page="home"]) .btn-primary,
body[data-current-page]:not([data-current-page="home"]) .tag.active,
body[data-current-page]:not([data-current-page="home"]) .rank-tab.active {
  border-color: var(--trial-blue);
  background: var(--trial-blue);
}

body[data-current-page]:not([data-current-page="home"]) .page-header::before,
body[data-current-page]:not([data-current-page="home"]) .car-card::before,
body[data-current-page]:not([data-current-page="home"]) .car-brand-tag,
#page-ranking .rank-num,
#page-detail .page-content::before {
  color: var(--trial-blue);
}

#page-garage #garageSearchInput,
body[data-current-page]:not([data-current-page="home"]) .filter-select,
body[data-current-page]:not([data-current-page="home"]) .input {
  color: var(--trial-ink) !important;
  background: rgba(245,247,247,.74) !important;
}

body[data-current-page]:not([data-current-page="home"]) .car-card {
  background: rgba(255,255,255,.24);
}

body[data-current-page]:not([data-current-page="home"]) .car-card:hover,
#page-ranking .rank-item:hover {
  color: #fff;
  background: var(--trial-navy);
}

body[data-current-page]:not([data-current-page="home"]) .car-price-tag,
#page-ranking .rank-val,
#page-detail .detail-price {
  color: var(--trial-red);
}

#page-ranking .rank-bar-fill {
  background: var(--trial-blue);
}

#page-compare .ct-header,
#page-detail .detail-layout > .reveal:first-child > div {
  background-color: var(--trial-paper-deep) !important;
}

#page-detail [style*="linear-gradient(135deg,rgba(10,132,255"] {
  border-color: rgba(34,85,219,.3) !important;
  background: rgba(34,85,219,.07) !important;
}

.modal-box {
  color: var(--trial-ink);
  background: var(--trial-paper-light);
  box-shadow: 14px 14px 0 var(--trial-blue);
}

/* Mobile navigation */
body[data-current-page="home"] .bottom-nav,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav {
  border-top-color: rgba(255,255,255,.1);
  background: rgba(11,23,33,.97);
}

body[data-current-page="home"] .bottom-nav .bn-item,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav .bn-item {
  color: #99a6ae;
}

body[data-current-page="home"] .bottom-nav .bn-item.active,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav .bn-item.active {
  color: #86a2ff;
}

/* Standalone pages */
body[data-atlas-static] {
  color: var(--trial-ink);
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(13,24,33,.04) 50%, transparent calc(50% + .5px)),
    var(--trial-paper);
}

body[data-atlas-static] .wrap,
body[data-atlas-static] h1,
body[data-atlas-static] h2,
body[data-atlas-static] .contact-item,
body[data-atlas-static] .contact-item .info {
  color: var(--trial-ink);
}

body[data-atlas-static] .wrap::before,
body[data-atlas-static] .s-card .n,
body[data-atlas-static] a {
  color: var(--trial-blue);
}

body[data-atlas-static] .s-card {
  background: rgba(255,255,255,.25);
}

body[data-atlas-vote] {
  --bg: #e7edf1;
  --bg1: #d6dfe5;
  --bg2: #f5f7f7;
  --primary: #2255db;
  --accent: #2255db;
  --gold: #e14d38;
  --text: #0d1821;
  --muted: rgba(13,24,33,.58);
  --dim: rgba(13,24,33,.16);
  --card: rgba(255,255,255,.3);
  --border: rgba(13,24,33,.22);
  color: var(--trial-ink);
  background: var(--trial-paper);
}

body[data-atlas-vote] .site-header {
  border-bottom-color: rgba(255,255,255,.1);
  background: rgba(11,23,33,.97);
}

body[data-atlas-vote] .logo,
body[data-atlas-vote] .header-back {
  color: #f4f7f9;
}

body[data-atlas-vote] .vote-hero {
  background: linear-gradient(90deg,rgba(34,85,219,.09),transparent 62%);
}

body[data-atlas-vote] .vote-hero h1 .grad {
  color: var(--trial-blue);
}

body[data-atlas-vote] .vote-hero-badge {
  color: var(--trial-red);
}

@media (max-width: 760px) {
  body[data-current-page="home"] #nav .nav-links,
  body[data-current-page]:not([data-current-page="home"]) #nav .nav-links {
    border-bottom-color: rgba(255,255,255,.1);
    background: rgba(11,23,33,.99);
  }

  body[data-current-page="home"] #nav .nav-links:not(.open) {
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
  }

  body[data-current-page="home"] #nav .nav-links.open {
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
  }

  .modal-box {
    box-shadow: 8px 8px 0 var(--trial-blue);
  }
}

/* Warm Ledger palette — paper, ink and oxblood */
:root {
  --atlas-paper: #f2eadf;
  --atlas-paper-deep: #e3d5c4;
  --atlas-ink: #221b18;
  --atlas-muted: #71665e;
  --atlas-blue: #8b3034;
  --atlas-red: #b26b36;
  --atlas-line: rgba(34, 27, 24, .2);
  --trial-paper: #f2eadf;
  --trial-paper-deep: #e3d5c4;
  --trial-paper-light: #fbf7f0;
  --trial-ink: #221b18;
  --trial-navy: #26231f;
  --trial-blue: #8b3034;
  --trial-red: #b26b36;
}

::selection {
  color: #fffaf4;
  background: #8b3034;
}

body[data-current-page="home"],
body[data-current-page]:not([data-current-page="home"]),
body[data-atlas-static],
body[data-atlas-vote] {
  color: #221b18;
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(75, 49, 35, .045) 50%, transparent calc(50% + .5px)),
    #f2eadf;
}

body[data-current-page="home"] .atlas-home {
  color: #221b18;
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(75, 49, 35, .045) 50%, transparent calc(50% + .5px)),
    #f2eadf;
}

body[data-current-page="home"] #nav,
body[data-current-page]:not([data-current-page="home"]) #nav,
body[data-atlas-vote] .site-header {
  border-bottom-color: rgba(255, 250, 244, .12);
  color: #fffaf4;
  background: rgba(38, 35, 31, .97);
}

body[data-current-page="home"] #nav .nav-link,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link {
  color: #c9beb1;
}

body[data-current-page="home"] #nav .nav-link:hover,
body[data-current-page="home"] #nav .nav-link.active,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link:hover,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link.active,
body[data-current-page="home"] #nav .nav-brand-copy strong,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-brand-copy strong {
  color: #fffaf4;
}

body[data-current-page="home"] #nav .nav-link.active::after,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-link.active::after {
  background: #c17a54;
}

body[data-current-page="home"] #nav .nav-search,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search {
  border-color: rgba(255, 250, 244, .14);
  background: rgba(255, 250, 244, .08);
}

body[data-current-page="home"] #nav .nav-search-input,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search-input {
  color: #fffaf4;
}

body[data-current-page="home"] #nav .nav-search-input::placeholder,
body[data-current-page]:not([data-current-page="home"]) #nav .nav-search-input::placeholder {
  color: #9f9285;
}

body[data-current-page="home"] #nav .btn-ghost,
body[data-current-page]:not([data-current-page="home"]) #nav .btn-ghost {
  border-color: rgba(255, 250, 244, .24);
  color: #f5ede4;
}

body[data-current-page]:not([data-current-page="home"]) {
  --primary: #8b3034;
  --primary-d: #652125;
  --primary-l: #ab5558;
  --accent: #8b3034;
  --accent-d: #652125;
  --accent-l: #b76568;
  --bg: #f2eadf;
  --bg-1: #e3d5c4;
  --bg-2: #fbf7f0;
  --bg-glass: rgba(255, 250, 244, .55);
  --bg-glass-d: rgba(34, 27, 24, .04);
  --border: rgba(34, 27, 24, .22);
  --border-l: rgba(34, 27, 24, .11);
  --border-a: rgba(139, 48, 52, .62);
  --text: #221b18;
  --text-1: #221b18;
  --text-2: rgba(34, 27, 24, .76);
  --text-3: rgba(34, 27, 24, .59);
  --text-4: rgba(34, 27, 24, .4);
}

.atlas-focus,
.atlas-car-list .home-car-card,
.atlas-search > div,
.atlas-view-all {
  background-color: rgba(251, 247, 240, .7);
}

.atlas-focus-dossier {
  border-color: rgba(255, 250, 244, .18);
  color: #fffaf4;
  background-color: #322c27;
  background-image:
    linear-gradient(145deg, rgba(255, 250, 244, .08), transparent 55%),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(255, 250, 244, .04) 31px 32px);
}

.atlas-focus-kicker,
.atlas-focus-brief {
  color: rgba(255, 250, 244, .76);
}

.atlas-route-paper {
  background: #e7dacb;
}

.atlas-route-blue {
  background: #8b3034;
}

.atlas-route-red {
  background: #b26b36;
}

.atlas-route-ink {
  background: #26231f;
}

.atlas-closing {
  background: #8b3034;
}

.atlas-closing button:hover {
  color: #8b3034;
}

body[data-current-page]:not([data-current-page="home"]) .btn-primary,
body[data-current-page]:not([data-current-page="home"]) .tag.active,
body[data-current-page]:not([data-current-page="home"]) .rank-tab.active,
#page-ranking .rank-bar-fill {
  border-color: #8b3034;
  background: #8b3034;
}

body[data-current-page]:not([data-current-page="home"]) .car-card:hover,
#page-ranking .rank-item:hover {
  color: #fffaf4;
  background: #26231f;
}

body[data-current-page]:not([data-current-page="home"]) .car-price-tag,
#page-ranking .rank-val,
#page-detail .detail-price {
  color: #a3542f;
}

#page-compare .ct-header,
#page-detail .detail-layout > .reveal:first-child > div {
  background-color: #e3d5c4 !important;
}

.modal-box {
  color: #221b18;
  background: #fbf7f0;
  box-shadow: 14px 14px 0 #8b3034;
}

body[data-current-page="home"] .bottom-nav,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav {
  border-top-color: rgba(255, 250, 244, .12);
  background: rgba(38, 35, 31, .98);
}

body[data-current-page="home"] .bottom-nav .bn-item,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav .bn-item {
  color: #b8aa9c;
}

body[data-current-page="home"] .bottom-nav .bn-item.active,
body[data-current-page]:not([data-current-page="home"]) .bottom-nav .bn-item.active {
  color: #d7a477;
}

body[data-atlas-static] .wrap {
  border-color: rgba(34, 27, 24, .18);
  color: #221b18;
  background: rgba(251, 247, 240, .74);
  box-shadow: none;
}

body[data-atlas-static] .wrap::before,
body[data-atlas-static] .s-card .n,
body[data-atlas-static] a {
  color: #8b3034;
}

body[data-atlas-static] .s-card,
body[data-atlas-static] .contact-item {
  border-color: rgba(34, 27, 24, .18);
  background: rgba(255, 250, 244, .42);
}

body[data-atlas-vote] {
  --bg: #f2eadf;
  --bg1: #e3d5c4;
  --bg2: #fbf7f0;
  --primary: #8b3034;
  --accent: #8b3034;
  --gold: #b26b36;
  --text: #221b18;
  --muted: rgba(34, 27, 24, .59);
  --dim: rgba(34, 27, 24, .16);
  --card: rgba(255, 250, 244, .42);
  --border: rgba(34, 27, 24, .22);
}

body[data-atlas-vote] .vote-hero {
  background: linear-gradient(90deg, rgba(139, 48, 52, .1), transparent 62%);
}

body[data-atlas-vote] .vote-hero h1 .grad {
  color: #8b3034;
}

body[data-atlas-vote] .vote-hero-badge {
  color: #a3542f;
}

@media (max-width: 760px) {
  body[data-current-page="home"] #nav .nav-links,
  body[data-current-page]:not([data-current-page="home"]) #nav .nav-links {
    border-bottom-color: rgba(255, 250, 244, .12);
    background: rgba(38, 35, 31, .995);
  }

  .modal-box {
    box-shadow: 8px 8px 0 #8b3034;
  }
}
