/* Cross-platform journey alignment.
   Keep web semantics and touch patterns in step with the Android foundation. */

.platform-mobile-nav {
  display: none;
}

.platform-mobile-nav__toggle {
  display: none;
}

/* Let the lead image carry context instead of hiding it behind a heavy wash. */
.v2-hero-carousel__image {
  filter: saturate(1.08) contrast(1.02) brightness(1.06);
}

.v2-hero-carousel__shade {
  background:
    linear-gradient(90deg, rgba(8, 18, 35, .64) 0%, rgba(8, 18, 35, .24) 50%, rgba(8, 18, 35, .03) 100%),
    linear-gradient(0deg, rgba(8, 18, 35, .62), transparent 46%);
}

/* Topic discovery is one decision surface: introduction, search, then results. */
.journey-category-finder--embedded {
  margin: var(--ic-space-4) 0 0;
  padding: var(--ic-space-4) 0 0;
  border: 0;
  border-top: 1px solid var(--ic-rule);
  border-radius: 0;
  background: transparent;
}

html[data-theme="dark"] .journey-category-finder--embedded {
  border-color: #34455e;
  background: transparent;
}

/* Secondary list facets stay available without competing with the main filter. */
.list-page__topics-disclosure {
  margin-top: var(--ic-space-3);
}

.list-page__topics-disclosure summary {
  width: fit-content;
  color: var(--ic-action);
  font-size: .84rem;
  font-weight: 760;
  cursor: pointer;
}

.list-page__topics-disclosure[open] summary {
  margin-bottom: var(--ic-space-2);
}

.list-page__topics-disclosure .list-page__chips {
  margin-top: 0;
}

/* Search is a focused task. Flatten the results and keep every theme readable. */
.page-search-modern .search-serp {
  width: min(100%, 960px);
  margin-inline: auto;
}

.search-serp__list > li::before {
  display: none !important;
  content: none !important;
}

.search-serp__item {
  border-color: var(--ic-rule);
  border-radius: var(--ic-radius-card);
  color: var(--ic-ink);
  background: var(--ic-surface);
  box-shadow: none;
}

.search-serp__item-title,
.search-serp__item-title a,
.search-serp__snippet,
.search-serp__item-meta {
  color: inherit;
}

.search-serp__snippet,
.search-serp__item-meta {
  color: var(--ic-muted);
}

.search-serp__input,
.search-serp__pagebtn {
  border-color: var(--ic-rule);
  border-radius: var(--ic-radius-control);
  color: var(--ic-ink);
  background: var(--ic-surface);
}

html[data-theme="dark"] .search-serp__item,
html[data-theme="dark"] .search-serp__input,
html[data-theme="dark"] .search-serp__pagebtn {
  border-color: #34455e;
  color: #edf3fc;
  background: #172235;
}

html[data-theme="dark"] .search-serp__snippet,
html[data-theme="dark"] .search-serp__item-meta,
html[data-theme="dark"] .search-serp__meta {
  color: #aebbd0;
}

/* Admin actions remain present, but no longer interrupt the reading hierarchy. */
.v2-article-admin-shortcuts {
  flex-wrap: nowrap;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

.v2-article-admin-shortcuts__label,
.v2-article-admin-shortcuts form,
.v2-article-admin-shortcuts__action {
  flex: 0 0 auto;
}

/* Keep the global controls physically anchored to the phone header. The full-height
   language wrapper also makes its menu open directly below the bar on touch browsers. */
@media (max-width: 820px) {
  .top-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    height: auto !important;
    min-height: calc(58px + env(safe-area-inset-top)) !important;
    padding: env(safe-area-inset-top) max(10px, env(safe-area-inset-right)) 0 max(10px, env(safe-area-inset-left)) !important;
  }

  .top-bar .logo,
  .top-bar .page-title,
  .top-actions,
  .language-dropdown {
    height: 58px;
    min-height: 58px;
  }

  .top-bar .logo,
  .top-bar .page-title {
    min-width: 0;
    overflow: hidden;
  }

  .top-actions {
    display: flex;
    align-self: center;
    align-items: center;
    gap: 5px !important;
    margin: 0;
    padding: 0;
  }

  .language-dropdown {
    display: flex;
    flex: 0 0 auto;
    align-self: center;
    align-items: center;
    margin: 0;
  }

  .theme-toggle,
  .language-dropdown-toggle {
    align-self: center;
    margin: 0;
    transform: none;
  }

  .language-dropdown-menu {
    top: 100%;
  }
}

@media (max-width: 720px) {
  body {
    padding-bottom: calc(62px + env(safe-area-inset-bottom));
  }

  .platform-mobile-nav {
    position: fixed;
    z-index: 80;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    min-height: calc(58px + env(safe-area-inset-bottom));
    padding: 4px max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px, env(safe-area-inset-left));
    border-top: 1px solid var(--ic-rule);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -8px 24px rgba(7, 17, 38, .10);
    backdrop-filter: blur(16px);
    overflow: visible;
  }

  .platform-mobile-nav__toggle {
    position: absolute;
    top: -28px;
    right: max(10px, env(safe-area-inset-right));
    display: inline-flex;
    min-width: 58px;
    height: 28px;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0 9px;
    border: 1px solid var(--ic-rule);
    border-bottom: 0;
    border-radius: 12px 12px 0 0;
    color: var(--ic-muted);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -5px 16px rgba(7, 17, 38, .09);
    font: inherit;
    font-size: .7rem;
    font-weight: 760;
    line-height: 1;
    cursor: pointer;
  }

  .platform-mobile-nav__toggle:hover,
  .platform-mobile-nav__toggle:focus-visible {
    color: var(--ic-action);
    outline: 2px solid rgba(26, 85, 230, .24);
    outline-offset: 1px;
  }

  .platform-mobile-nav__toggle-icon {
    font-size: .9rem;
    line-height: 1;
  }

  .platform-mobile-nav a {
    display: grid;
    min-width: 0;
    min-height: 50px;
    align-content: center;
    justify-items: center;
    gap: 2px;
    border-radius: var(--ic-radius-control);
    color: var(--ic-muted);
    font-size: .66rem;
    font-weight: 760;
    line-height: 1;
    text-decoration: none;
  }

  .platform-mobile-nav a:hover,
  .platform-mobile-nav a:focus-visible,
  .platform-mobile-nav a.is-active {
    color: var(--ic-action);
    background: var(--ic-info);
  }

  .platform-mobile-nav img {
    width: 20px;
    height: 20px;
  }

  html[data-theme="dark"] .platform-mobile-nav {
    border-color: #34455e;
    background: rgba(11, 20, 35, .97);
    box-shadow: 0 -8px 24px rgba(0, 0, 0, .32);
  }

  html[data-theme="dark"] .platform-mobile-nav__toggle {
    border-color: #34455e;
    color: #aebbd0;
    background: rgba(11, 20, 35, .97);
    box-shadow: 0 -5px 16px rgba(0, 0, 0, .28);
  }

  html[data-theme="dark"] .platform-mobile-nav__toggle:hover,
  html[data-theme="dark"] .platform-mobile-nav__toggle:focus-visible {
    color: #edf3fc;
  }

  html[data-theme="dark"] .platform-mobile-nav a {
    color: #aebbd0;
  }

  html[data-theme="dark"] .platform-mobile-nav a:hover,
  html[data-theme="dark"] .platform-mobile-nav a:focus-visible,
  html[data-theme="dark"] .platform-mobile-nav a.is-active {
    color: #edf3fc;
    background: #18304e;
  }

  html[data-theme="dark"] .platform-mobile-nav img {
    filter: invert(88%) sepia(10%) saturate(512%) hue-rotate(180deg) brightness(107%);
  }

  /* Personal is already a primary destination in the bottom navigation. */
  .journey-account-link {
    display: none !important;
  }

  .theme-toggle,
  .language-dropdown-toggle {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    justify-content: center;
    padding: 0 !important;
    border-radius: 10px;
  }

  .v2-hero-carousel__image {
    filter: saturate(1.08) contrast(1.02) brightness(1.12);
  }

  .catx__hero {
    padding: 14px;
  }

  .catx__title {
    font-size: clamp(1.55rem, 8vw, 2.1rem);
  }

  .catx__subtitle {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .journey-category-finder--embedded {
    margin-top: 12px;
    padding-top: 12px;
  }

  .journey-category-finder--embedded .journey-category-finder__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 6px;
  }

  .journey-category-finder--embedded [data-category-result-count] {
    white-space: normal;
  }

  .list-page__hero {
    padding: 14px;
  }

  .list-page__subtitle {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .journey-list-filter {
    align-items: center;
    margin-top: 12px;
    padding-top: 10px;
  }

  .journey-list-filter__label,
  .journey-list-filter__count {
    flex: 0 1 auto;
  }

  .journey-list-filter__count {
    margin-left: auto;
  }

  .journey-segments {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    padding: 0;
    overflow: visible;
  }

  .journey-segments button {
    min-width: 0;
    min-height: 38px;
    padding: 4px 6px;
    white-space: normal;
  }

  .list-page__topics-disclosure {
    margin-top: 9px;
  }

  .search-serp {
    padding: 14px;
  }

  .search-serp__form {
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 8px;
    margin-top: 10px;
  }

  .search-serp__submit {
    width: auto;
    padding-inline: 10px;
    border-radius: var(--ic-radius-control);
  }

  .search-serp__item {
    padding: 9px;
  }

  .search-serp__row {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px;
  }

  .search-serp__thumb {
    width: 88px;
    height: 72px;
  }

  .search-serp__item-title {
    display: -webkit-box;
    margin-bottom: 4px;
    overflow: hidden;
    font-size: .98rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .search-serp__snippet {
    display: -webkit-box;
    margin-bottom: 5px;
    overflow: hidden;
    font-size: .84rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .search-serp__item-meta {
    gap: 5px;
    font-size: .72rem;
  }

  .v2-article-promos {
    gap: 5px;
  }

  .v2-article-promos .pragor-beta-banner,
  .v2-article-promos .v2-android-app,
  .v2-article-promos .pragor-beta-banner__inner {
    min-height: 38px;
  }

  .v2-article-promos .pragor-beta-banner__inner,
  .v2-article-promos .v2-android-app {
    padding-top: 4px;
    padding-bottom: 4px;
  }

  .v2-article-promos .pragor-beta-banner__cta,
  .v2-article-promos .v2-android-app__download {
    min-height: 28px;
    font-size: .8rem;
  }

  .v2-article-promos .pragor-beta-banner__close,
  .v2-article-promos .v2-android-app__close {
    top: 6px;
    width: 24px;
    height: 24px;
  }

  .v2-article-admin-shortcuts {
    gap: 5px;
    margin-top: 8px;
    padding: 6px;
  }

  .v2-article-admin-shortcuts__label {
    flex: 0 0 auto;
    padding-inline: 3px;
  }

  .v2-article-admin-shortcuts__action {
    min-height: 34px;
    padding: 6px 9px;
    font-size: .76rem;
  }

  .account-shell--login {
    gap: 16px;
    margin-top: 12px;
  }

  .account-intro h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 11vw, 2.75rem);
  }

  .account-intro > p {
    font-size: .98rem;
    line-height: 1.45;
  }

  .account-benefits {
    display: none;
  }

  .account-auth-card {
    padding: 18px;
    box-shadow: none;
  }

  #cookie-banner {
    bottom: calc(62px + env(safe-area-inset-bottom));
  }

  html.platform-nav-minimized body {
    padding-bottom: 0;
  }

  html.platform-nav-minimized .platform-mobile-nav {
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom));
    left: auto;
    display: flex;
    width: auto;
    min-height: 44px;
    padding: 0;
    border: 1px solid var(--ic-rule);
    border-radius: 999px;
    box-shadow: 0 8px 24px rgba(7, 17, 38, .18);
  }

  html.platform-nav-minimized .platform-mobile-nav a {
    display: none;
  }

  html.platform-nav-minimized .platform-mobile-nav__toggle {
    position: static;
    min-width: 66px;
    height: 42px;
    padding: 0 12px;
    border: 0;
    border-radius: 999px;
    box-shadow: none;
  }

  html.platform-nav-minimized #cookie-banner {
    bottom: calc(58px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 360px) {
  .platform-mobile-nav a {
    font-size: .61rem;
  }

  .search-serp__form {
    grid-template-columns: minmax(0, 1fr) 78px;
  }

  .journey-segments button {
    font-size: .72rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .platform-mobile-nav {
    backdrop-filter: none;
  }
}