/* AutoNews Calm Editorial Edition
   Derived from the supplied blue-grey display draft: fewer competing accents,
   editorial scale, clear priority, and all business routes kept intact. */

:root,
html:not([data-theme="dark"]) {
  --paper: #eef2f5;
  --paper-2: #e7edf2;
  --card: #f9fbfc;
  --ink: #10283c;
  --ink2: #3d5a70;
  --ink3: #718496;
  --ink4: #8192a0;
  --line: #cedae4;
  --gold: #396e93;
  --gold-text: #2c6389;
  --gold-wash: #e0ebf3;
  --green: #396e93;
  --portal-nav: #173a53;
  --portal-nav-2: #254f6b;
  --portal-accent: #396e93;
  --portal-blue: #396e93;
  --lux-graphite: #0d2232;
  --lux-forest: #17384f;
  --lux-forest-2: #254f69;
  --lux-ivory: #f5f8fa;
  --lux-champagne: #8eacbf;
  --lux-brass: #527b96;
  --lux-chrome: #c8d6df;
  --lux-border: rgb(38 75 101 / 15%);
  --lux-glass: rgb(249 251 252 / 91%);
  --lux-shadow: 0 24px 64px rgb(24 51 70 / 10%);
  --lux-shadow-soft: 0 10px 30px rgb(24 51 70 / 7%);
}

html[data-theme="dark"] {
  --paper: #0d1720;
  --paper-2: #142331;
  --card: #142432;
  --ink: #eef5f8;
  --ink2: #c7d5de;
  --ink3: #91a5b2;
  --ink4: #8095a3;
  --line: #2b4252;
  --gold: #78a5c0;
  --gold-text: #a8c7da;
  --gold-wash: #1e3545;
  --green: #78a5c0;
  --portal-nav: #0e2738;
  --portal-nav-2: #183a50;
  --lux-glass: rgb(20 36 50 / 91%);
  --lux-shadow: 0 24px 70px rgb(0 0 0 / 34%);
  --lux-shadow-soft: 0 12px 34px rgb(0 0 0 / 22%);
}

body.editorial-ui {
  color: var(--ink);
  background:
    linear-gradient(180deg, rgb(255 255 255 / 38%), transparent 23rem),
    var(--paper);
}

body.editorial-ui .header {
  min-height: 80px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 94%, transparent) !important;
  box-shadow: none;
  backdrop-filter: blur(16px);
}

body.editorial-ui .header-search {
  border-color: transparent;
  border-bottom-color: var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.editorial-ui .header-search:focus-within {
  border-bottom-color: var(--gold-text);
  box-shadow: 0 1px var(--gold-text);
}

body.editorial-ui .content,
body.editorial-ui .site-footer {
  width: min(1360px, calc(100% - 52px));
}

body.editorial-ui .an-head-meter,
body.editorial-ui .an-ambient-telemetry { display: none; }
body.editorial-ui .an-instrument-head::after { display: none !important; }

body.editorial-ui :is(.btn-primary,.cjl-btn--primary,.auth-links .btn-primary,button[type="submit"]) {
  border-color: #245a7f;
  background: #245a7f;
  color: #fff;
  box-shadow: none;
}
body.editorial-ui :is(.btn-primary,.cjl-btn--primary,.auth-links .btn-primary,button[type="submit"]):hover {
  border-color: #173f5a;
  background: #173f5a;
  color: #fff;
}

@media (min-width: 901px) {
  body.editorial-ui .sidebar {
    width: 230px;
    padding: 28px 18px 20px;
    border-right: 1px solid #cad8e2;
    background: rgb(244 248 251 / 96%) !important;
    box-shadow: none;
  }

  body.editorial-ui .sidebar::before {
    background:
      linear-gradient(180deg, transparent 0 45%, rgb(244 248 251 / 89%) 88%),
      url("../images/luxury-road-ambient-v1.4ab4c1a47df0.webp") 63% 58% / auto 64% no-repeat;
    opacity: .05;
    filter: grayscale(1) sepia(.08) hue-rotate(158deg) saturate(.52);
  }

  body.editorial-ui .sidebar::after {
    height: 1px;
    background: linear-gradient(90deg, #b7cad7, #5f8aa6, transparent);
    box-shadow: none;
  }

  body.editorial-ui .logo-area { padding: 0 9px 30px; }
  body.editorial-ui .an-brand-mark {
    background: #dce9f1;
    color: #2f607f;
    box-shadow: inset 0 0 0 1px #c1d6e3;
  }
  body.editorial-ui .logo-text { color: #14324a; }
  body.editorial-ui .logo-text small { color: #73899a; letter-spacing: 4px; }

  body.editorial-ui :is(.nav-item,.cjl-showcase-nav a) {
    min-height: 48px;
    padding: 12px 13px;
    border: 0;
    border-radius: 4px;
    color: #526b7d;
    font-size: 14px;
  }
  body.editorial-ui :is(.nav-item,.cjl-showcase-nav a):hover {
    background: #e8f0f5;
    color: #173f5a;
  }
  body.editorial-ui :is(.nav-item,.cjl-showcase-nav a).active {
    background: #e1ebf2;
    color: #173f5a;
    box-shadow: inset 3px 0 #3f789f;
  }
  body.editorial-ui :is(.nav-item,.cjl-showcase-nav a).active::after {
    width: 3px;
    height: 22px;
    right: 0;
    margin-top: -11px;
    border-radius: 0;
    background: #3f789f;
    box-shadow: none;
  }
  body.editorial-ui .cjl-showcase-sidebar-note,
  body.editorial-ui .designer-info {
    border-color: #d5e0e7;
    border-radius: 6px;
    background: #e9f0f5;
    color: #587084;
  }
}

html[data-theme="dark"] body.editorial-ui .sidebar {
  border-right-color: #263c4c;
  background: rgb(13 25 35 / 97%) !important;
}

html[data-theme="dark"] body.editorial-ui :is(.nav-item,.cjl-showcase-nav a).active {
  background: #18354a;
  color: #edf6fa;
  box-shadow: inset 3px 0 #78a5c0;
}

/* Home: calm editorial hierarchy. */
body.page-home .content > .cjl-home-intro { order: 0; }
body.page-home .content > .cjl-shortcuts { order: 1; }
body.page-home .content > .cjl-home-priority { order: 2; }
body.page-home .content > .cjl-showcase-forward { order: 3; }
body.page-home .content > .cjl-editorial-layout { order: 4; }
body.page-home .content > .cjl-directory { order: 5; }
body.page-home .content > .cjl-legacy-home { order: 6; }

body.page-home .cjl-showcase-header-title {
  color: #788d9c;
  letter-spacing: 4px;
}
body.page-home .cjl-showcase-header-title b {
  color: #7b8f9e;
  font: 500 13px/1.2 Georgia, "Times New Roman", serif;
  letter-spacing: 4px;
}

body.page-home .cjl-home-intro {
  display: block;
  min-height: 0;
  margin: 48px 0 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
body.page-home .cjl-home-intro__copy {
  display: block;
  padding: 0;
  background: transparent;
}
body.page-home .cjl-home-intro.an-instrument-head::after,
body.page-home .cjl-home-intro::after,
body.page-home .cjl-home-intro h1::after { display: none !important; }
body.page-home .cjl-home-intro .an-head-meter { display: none; }
body.page-home .cjl-home-intro .cjl-eyebrow {
  margin: 0 0 17px;
  color: #516f85;
  font: 600 12px/1.4 var(--sans);
  letter-spacing: 4px;
}
body.page-home .cjl-home-intro h1 {
  margin: 0;
  color: var(--ink);
  font: 500 clamp(38px, 3.6vw, 54px)/1.28 "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
  letter-spacing: .02em;
}
body.page-home .cjl-home-intro h1 em {
  color: inherit;
  font-style: normal;
  background: none;
}
body.page-home .cjl-home-intro p {
  margin: 15px 0 0;
  color: var(--ink3);
  font-size: 16px;
  line-height: 1.8;
}

body.page-home .cjl-shortcuts {
  margin: 0 0 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: color-mix(in srgb, var(--card) 93%, transparent);
  overflow: hidden;
}
body.page-home .cjl-shortcuts__head {
  min-height: 62px;
  margin: 0;
  padding: 0 24px;
  border-bottom: 1px solid var(--line);
}
body.page-home .cjl-shortcuts__head h2 {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
  font-weight: 680;
}
body.page-home .cjl-shortcuts__head a {
  color: var(--ink3);
  font-size: 13px;
  text-decoration: none;
}
body.page-home .cjl-shortcuts__head a::after { content: "  →"; }
body.page-home .cjl-shortcuts__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
}
body.page-home .cjl-shortcuts__grid a {
  min-height: 116px;
  padding: 25px 22px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: color 180ms ease, background 220ms ease, transform 240ms ease;
}
body.page-home .cjl-shortcuts__grid a:last-child { border-right: 0; }
body.page-home .cjl-shortcuts__grid a:hover {
  border-color: var(--line);
  background: #e8f0f5;
  box-shadow: inset 0 -2px #3f789f;
  transform: translateY(-2px);
}
body.page-home .cjl-shortcuts__grid i {
  width: 29px;
  color: #3f6f8f;
  font-size: 24px;
  text-align: center;
}
body.page-home .cjl-shortcuts__grid b {
  color: var(--ink);
  font-size: 16px;
  font-weight: 680;
}
body.page-home .cjl-shortcuts__grid small {
  margin-top: 7px;
  color: var(--ink3);
  font-size: 12px;
  line-height: 1.5;
}

body.page-home .cjl-home-priority {
  display: grid;
  grid-template-columns: minmax(0, 2.15fr) minmax(310px, .92fr);
  gap: 26px;
  margin: 0 0 34px;
}
body.page-home .cjl-home-focus,
body.page-home .cjl-home-check {
  min-height: 500px;
  height: 500px;
  border-radius: 6px;
}
body.page-home .cjl-home-focus {
  border: 1px solid #9eb2c0;
  background: #122b3d;
  box-shadow: 0 18px 42px rgb(21 48 68 / 13%);
}
body.page-home .cjl-home-focus > img {
  height: 100%;
  object-position: center;
  filter: saturate(.72) contrast(.96) brightness(.9);
}
body.page-home .cjl-home-focus::after {
  background:
    linear-gradient(90deg, rgb(10 27 40 / 84%) 0%, rgb(10 27 40 / 42%) 48%, transparent 78%),
    linear-gradient(180deg, transparent 40%, rgb(9 25 37 / 76%) 100%);
}
body.page-home .cjl-home-focus__overlay {
  min-height: 500px;
  padding: 40px 46px;
}
body.page-home .cjl-home-focus__kicker {
  width: auto;
  margin: 0 0 auto;
  color: #d5e0e7;
  font-size: 12px;
  letter-spacing: .05em;
}
.an-focus-label {
  min-height: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #d9e5eb;
  font-weight: 650;
  letter-spacing: .12em;
}
.an-focus-label::before {
  content: "";
  width: 24px;
  height: 1px;
  margin-right: 4px;
  background: #a7bdcb;
}
body.page-home .cjl-home-focus__kicker > span:not(.an-focus-label) {
  padding: 0;
  background: transparent;
  color: #c4d2db;
}
body.page-home .cjl-home-focus__verify {
  border-color: rgb(255 255 255 / 34%);
  border-radius: 3px;
  background: rgb(11 29 42 / 44%);
}
body.page-home .cjl-home-focus h2 {
  max-width: 720px;
  margin: 44px 0 16px;
  color: #fff;
  font: 500 clamp(32px, 3.3vw, 50px)/1.3 "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
  letter-spacing: .02em;
}
body.page-home .cjl-home-focus__summary {
  max-width: 630px;
  margin: 0 0 20px;
  color: #dbe5ea;
  font-size: 14px;
  line-height: 1.8;
}
body.page-home .cjl-home-focus__overlay > a {
  gap: 16px;
  color: #f3f7f9;
  font-size: 14px;
}
body.page-home .cjl-home-focus__overlay > a i {
  width: 32px;
  height: 32px;
  border-color: #b9cad5;
}

body.page-home .cjl-home-check {
  padding: 36px 32px 28px;
  border: 1px solid #c4d4df;
  background: color-mix(in srgb, #edf4f8 88%, transparent);
  box-shadow: none;
}
.an-check-icon {
  width: 38px;
  height: 38px;
  border: 1px solid #c2d5e1;
  border-radius: 50%;
  background: #e4eef4;
  color: #3b6f91;
}
.an-check-top > span {
  border: 0;
  color: #7890a0;
  letter-spacing: 1.8px;
}
body.page-home .cjl-home-check h2 {
  margin: 10px 0 12px;
  color: var(--ink);
  font: 650 25px/1.45 var(--sans);
  letter-spacing: -.02em;
}
body.page-home .cjl-home-check__intro {
  margin-bottom: 24px;
  color: var(--ink3);
  font-size: 14px;
  line-height: 1.75;
}
body.page-home .cjl-home-check label {
  color: var(--ink2);
  font-size: 13px;
  font-weight: 650;
}
body.page-home .cjl-home-check textarea {
  min-height: 120px;
  border-color: #b9ccd9;
  border-radius: 4px;
  background: rgb(255 255 255 / 72%);
  font-size: 14px;
}
body.page-home .cjl-home-check textarea:focus {
  border-color: #497c9c;
  outline: 3px solid rgb(73 124 156 / 12%);
  background: #fff;
}
body.page-home .cjl-home-check__criteria {
  justify-content: flex-start;
  gap: 13px;
  margin: 14px 0 20px;
  color: #668095;
}
body.page-home .cjl-home-check__criteria i { color: #4c7b9a; }
body.page-home .cjl-home-check__actions {
  flex-direction: row;
  gap: 14px;
}
body.page-home .cjl-home-check .lane-go {
  width: auto;
  min-width: 148px;
  margin-left: auto;
  border-radius: 4px;
  background: #245a7f;
  color: #fff;
  box-shadow: none;
}
body.page-home .cjl-home-check .lane-go:hover {
  background: #173f5a;
  transform: translateY(-1px);
}
body.page-home .cjl-home-check__note {
  margin-top: 13px;
  text-align: left;
}

body.page-home .cjl-showcase-forward {
  margin-bottom: 46px;
  padding: 18px 20px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--card) 91%, transparent);
}
.an-calendar-icon {
  border-radius: 4px;
  background: #e3edf3;
  color: #416f8c;
}

body.page-home .cjl-editorial-layout {
  grid-template-columns: minmax(0, 2fr) minmax(290px, .8fr);
  gap: 48px;
}
body.page-home .cjl-editorial-head h2 {
  font: 650 24px/1.45 var(--sans);
}
body.page-home .cjl-editorial-head h2::before {
  width: 28px;
  height: 1px;
  border-radius: 0;
  background: #5a819a;
}
body.page-home .cjl-editorial-tabs a { border-radius: 3px; }
body.page-home .cjl-editorial-tabs a.active { background: #183f5a; }
body.page-home .cjl-editorial-card {
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 24px;
  padding: 24px 0;
}
body.page-home .cjl-editorial-card__cover { border-radius: 4px; }
body.page-home .cjl-editorial-card__type { color: #47728e; }
body.page-home .cjl-editorial-card h3 {
  font-size: 20px;
  line-height: 1.5;
}
body.page-home .cjl-editorial-brief {
  border-radius: 6px;
  background: #17384f;
}
body.page-home .cjl-editorial-brief > span,
body.page-home .cjl-editorial-brief a { color: #b9ceda; }
body.page-home .cjl-home-recommendations { display: none; }
body.page-home .cjl-editorial-follow {
  border-radius: 6px;
  background: color-mix(in srgb, var(--card) 92%, transparent);
}
body.page-home .cjl-editorial-follow em { color: #47728e; }

/* Keep every route on the home page without displaying a wall of cards. */
body.page-home .cjl-directory {
  margin: 0 0 24px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: color-mix(in srgb, var(--card) 92%, transparent);
  overflow: hidden;
}
body.page-home .cjl-directory-drawer > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 82px;
  margin: 0;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
}
body.page-home .cjl-directory-drawer > summary::-webkit-details-marker { display: none; }
body.page-home .cjl-directory__head .cjl-eyebrow { color: #6d8596; }
body.page-home .cjl-directory__head h2 {
  margin: 3px 0 0;
  font-size: 18px;
  font-weight: 650;
}
body.page-home .cjl-directory__head p {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: var(--ink3);
  font-size: 13px;
}
body.page-home .cjl-directory__head p i { transition: transform 240ms ease; }
body.page-home .cjl-directory-drawer[open] > summary p i { transform: rotate(180deg); }
body.page-home .cjl-directory__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px 34px;
  padding: 28px 24px 10px;
  border-top: 1px solid var(--line);
}
body.page-home .cjl-directory-group h3 > i {
  border-radius: 3px;
  background: #e1ebf2;
  color: #3c6f90;
}
body.page-home .cjl-directory__foot { margin: 18px 24px 0; padding: 18px 0 22px; }

body.page-home .cjl-legacy-home {
  border-radius: 5px;
  background: color-mix(in srgb, var(--card) 90%, transparent);
}

/* News and utility pages inherit the same cool editorial palette. */
body.cjl-newsroom .cjl-tabs a.active,
body.cjl-newsroom .cjl-filter-panel .cjl-btn--primary { background: #245a7f; color: #fff; }
body.cjl-newsroom .cjl-news-card__media,
body.cjl-newsroom .an-news-ranking,
body.cjl-newsroom .an-news-services { border-radius: 5px; }
body.cjl-newsroom .cjl-kicker,
body.cjl-newsroom .an-news-topics span { color: #3e708f; }

@media (max-width: 1250px) {
  body.page-home .cjl-shortcuts__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.page-home .cjl-shortcuts__grid a:nth-child(3) { border-right: 0; }
  body.page-home .cjl-shortcuts__grid a:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  body.page-home .cjl-home-priority { grid-template-columns: minmax(0, 1.7fr) minmax(300px, .9fr); }
}

@media (max-width: 900px) {
  body.editorial-ui .content,
  body.editorial-ui .site-footer { width: calc(100% - 36px); }
  body.page-home .cjl-home-intro { margin-top: 32px; }
}

@media (max-width: 760px) {
  body.page-home .cjl-home-priority,
  body.page-home .cjl-editorial-layout { grid-template-columns: 1fr; }
  body.page-home .cjl-home-focus,
  body.page-home .cjl-home-focus__overlay { min-height: 410px; height: 410px; }
  body.page-home .cjl-home-check { min-height: 0; height: auto; }
  body.page-home .cjl-directory__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  body.page-home .cjl-home-intro { margin: 26px 0 22px; }
  body.page-home .cjl-home-intro .cjl-eyebrow { font-size: 10px; letter-spacing: 2.3px; }
  body.page-home .cjl-home-intro h1 { font-size: 33px; line-height: 1.35; }
  body.page-home .cjl-home-intro p { max-width: 330px; font-size: 14px; }
  body.page-home .cjl-shortcuts__head { min-height: 54px; padding-inline: 16px; }
  body.page-home .cjl-shortcuts__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-home .cjl-shortcuts__grid a {
    min-height: 104px;
    padding: 18px 15px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  body.page-home .cjl-shortcuts__grid a:nth-child(2n) { border-right: 0; }
  body.page-home .cjl-shortcuts__grid a:last-child {
    grid-column: 1 / -1;
    border-right: 0;
    border-bottom: 0;
  }
  body.page-home .cjl-shortcuts__grid b { font-size: 15px; }
  body.page-home .cjl-home-focus,
  body.page-home .cjl-home-focus__overlay { min-height: 380px; height: 380px; }
  body.page-home .cjl-home-focus__overlay { padding: 25px 22px; }
  body.page-home .cjl-home-focus h2 { font-size: 31px; }
  body.page-home .cjl-home-check { padding: 26px 20px 22px; }
  body.page-home .cjl-home-check__actions { align-items: center; }
  body.page-home .cjl-home-check .lane-go { min-width: 136px; }
  body.page-home .cjl-editorial-card { grid-template-columns: 112px minmax(0, 1fr); gap: 14px; }
  body.page-home .cjl-editorial-card h3 { font-size: 16px; }
  body.page-home .cjl-directory-drawer > summary { min-height: 72px; padding: 16px; }
  body.page-home .cjl-directory__grid { grid-template-columns: 1fr; padding-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  body.page-home .cjl-shortcuts__grid a,
  body.page-home .cjl-directory__head p i { transition: none; }
}
