/*
  Standards-based responsive refinement.
  Goals: WCAG 2.2 reflow at 320 CSS px, readable mobile type, and 44px
  touch targets for primary controls. This layer intentionally loads last.
*/

:root {
  --readable-body: 1rem;
  --readable-support: .9375rem;
  --readable-meta: .8125rem;
  --readable-label: .75rem;
}

/*
  Public-service readability baseline. Body copy uses the browser's 16px
  default while compact labels remain visibly secondary, never microscopic.
*/
body {
  font-size: var(--readable-body);
  line-height: 1.6;
}

/*
  Devanagari characters form words with a continuous headline. English
  display tracking, especially negative letter-spacing, breaks that joining
  line between shaped clusters. Keep Nepali text on a Devanagari font and
  let the shaping engine control its natural spacing.
*/
html[lang="ne"] :where(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  a,
  button,
  label,
  legend,
  li,
  dt,
  dd,
  th,
  td,
  time,
  span,
  strong,
  small,
  em,
  input,
  select,
  textarea
) {
  font-family: "Noto Sans Devanagari", "Nirmala UI", Mangal, sans-serif !important;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
  letter-spacing: 0 !important;
  word-spacing: normal;
}

html[lang="ne"] :where(h1, h2, h3, h4, h5, h6) {
  line-height: 1.2 !important;
}

.hero-description,
.mp-profile-intro,
.mp-profile-body,
.mp-timeline p,
.home-budget-heading p,
.home-events-heading p,
.home-directory-heading-copy > p,
.page-hero-copy > p:last-child,
.events-hero-copy > p:last-child,
.contact-hero-copy > p:last-child,
.contact-section-heading > p:last-child,
.secretariat-heading > p:last-child {
  font-size: var(--readable-body) !important;
  line-height: 1.65 !important;
}

.contact-card p,
.contact-guidance p,
.coverage-summary,
.featured-media-summary,
.media-method-note p,
.events-privacy-note p,
.events-source-note span,
.atlas-scope-note,
.story-interpretation,
.budget-source-notes > p:not(.page-kicker) {
  font-size: var(--readable-support) !important;
  line-height: 1.6 !important;
}

.district-contact-name,
.district-contact-email,
.person-copy span,
.mp-current-roles article > span,
.home-event-card p,
.event-list-card p,
.contact-form label,
.budget-table td,
.budget-table th {
  font-size: .875rem !important;
  line-height: 1.5 !important;
}

.current-role-label,
.home-budget-overview-heading > strong,
.home-budget-overview-heading > span,
.home-budget-government-heading > span,
.home-budget-evidence,
.home-events-heading > a,
.home-budget-stat span,
.home-budget-stat small,
.atlas-profile-list span,
.atlas-profile-head > div > span,
.atlas-map-head span,
.atlas-map-caption,
.atlas-provenance,
.atlas-provenance strong,
.story-main-label,
.mini-bar-row strong,
.events-day time,
.events-day-secondary,
.calendar-more-events,
.event-card-meta,
.budget-meta,
.budget-file-meta {
  font-size: var(--readable-meta) !important;
  line-height: 1.5 !important;
}

.atlas-story-card h3,
.story-card h3 {
  font-size: 1rem !important;
  line-height: 1.35 !important;
}

.constituency-scorecard small,
.constituency-scorecard em,
.atlas-layer span,
.archive-status,
.featured-media-kicker,
.event-category,
.events-weekdays,
.events-calendar-system button,
.events-calendar-system button span,
.events-view-toggle button,
.events-view-toggle button span,
.events-filters button {
  font-size: var(--readable-label) !important;
  line-height: 1.45 !important;
}

.hero-eyebrow,
.page-kicker,
.section-eyebrow,
.directory-kicker,
.constituency-source-card small,
.atlas-view-nav button span,
.atlas-options summary span,
.atlas-select-label,
.atlas-select-label > span,
.atlas-select-wrap,
.atlas-layers legend,
.atlas-legend span,
.atlas-map-footer-actions,
.atlas-map-footer-actions span,
.member-table th,
.budget-source-button span,
.events-source-status,
.events-upcoming-panel header > span {
  font-size: var(--readable-label) !important;
  line-height: 1.45 !important;
}

.home-gateway-label,
.home-directory-verified,
.home-directory-verified span,
.home-directory-heading a,
.emergency-link span,
.sector-switch-button span,
.atlas-verified,
.atlas-verified span,
.atlas-primary-stats span,
.atlas-service small,
.events-empty-state > div span {
  font-size: var(--readable-label) !important;
  line-height: 1.45 !important;
}

/* WCAG AA contrast for compact constituency labels and controls. */
.atlas-view-nav button.is-active,
.atlas-profile-action {
  background-color: #006fa8 !important;
  color: #fff !important;
}

.atlas-view-nav button.is-active span,
.atlas-profile-action span {
  color: #fff !important;
}

.constituency-scorecard small,
.constituency-scorecard em,
.atlas-profile-head > div > span,
.atlas-primary-stats span,
.atlas-service small,
.atlas-map-footer-actions > span,
.story-main-label,
.story-household-chart span,
.story-donut-legend span,
.mini-bar-label,
.story-interpretation {
  color: #486879 !important;
}

/* Census explorer and media library were added after the original audit layer. */
.census-browser-identity small,
.census-view-card header small,
.census-scope-badge,
.census-library-header small,
.census-dataset-detail > header small,
.census-dataset-group > header small,
.dataset-study-intro > div:first-child > span,
.dataset-study-facts small,
.coverage-publisher,
.video-card-source,
.video-card-date {
  font-size: var(--readable-label) !important;
  line-height: 1.45 !important;
}

.census-browser-count,
.census-browser-scope,
.census-category-strip button,
.census-category-strip button small,
.census-library-header p,
.census-library-status,
.census-library-footer,
.dataset-actions button,
.census-detail-note,
.aggregate-metric-grid span,
.aggregate-chart-card summary,
.explorer-method p,
.explorer-method a,
.census-read-button,
.census-empty-area-actions button,
.census-browser-open small,
.dataset-study-intro p,
.dataset-study-intro aside strong,
.media-method-note {
  font-size: var(--readable-meta) !important;
  line-height: 1.5 !important;
}

.census-view-card > p,
.census-dataset-description,
.census-card-insight,
.aggregate-chart-card > p,
.aggregate-intro,
.census-dataset-group > header p,
.coverage-summary,
.featured-media-summary {
  font-size: var(--readable-support) !important;
  line-height: 1.6 !important;
}

.census-table-wrap table,
.census-table-wrap thead th {
  font-size: .875rem !important;
  line-height: 1.5 !important;
}

.census-mini-chart text,
.dataset-full-chart text,
.dataset-full-chart.advanced-chart text {
  font-size: 11px !important;
}

.census-category-strip button,
.census-read-button,
.census-empty-area-actions button,
.census-library-close,
.dataset-actions button,
.coverage-link {
  min-height: 44px;
}

.coverage-link {
  font-size: .875rem !important;
}

/* The chronology is a reading sequence, so keep it bounded and vertical. */
.mp-journey {
  width: min(100%, 1040px);
  margin-right: auto;
  margin-left: auto;
}

.mp-journey-heading {
  display: block;
  max-width: 760px;
  margin-bottom: 34px;
}

.mp-journey-heading p {
  max-width: 65ch;
  font-size: var(--readable-body);
}

.mp-journey-source-note {
  min-height: 44px;
  margin-top: 12px;
  font-size: 12px;
}

.mp-timeline {
  --timeline-date: 160px;
  --timeline-marker: 44px;
  --timeline-gap: 20px;
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  width: min(100%, 900px);
  margin: 0;
  padding: 0;
  overflow: visible;
  list-style: none;
}

.mp-timeline::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--timeline-date) + var(--timeline-gap) + (var(--timeline-marker) / 2));
  width: 1px;
  height: auto;
  background: rgba(0, 125, 185, .3);
  content: "";
}

.mp-timeline > li,
.mp-timeline > li:not(:first-child) {
  position: relative;
  display: grid;
  grid-template-columns: var(--timeline-date) var(--timeline-marker) minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  column-gap: var(--timeline-gap);
  min-width: 0;
  padding: 0 0 34px;
}

.mp-timeline > li:last-child {
  padding-bottom: 0;
}

.mp-timeline-marker {
  grid-column: 2;
  grid-row: 1 / span 3;
  width: var(--timeline-marker);
  height: var(--timeline-marker);
  align-self: start;
  border-radius: 12px;
  background: #f8fcfd;
}

.mp-timeline time {
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  margin: 3px 0 0;
  color: #087fbb;
  font-size: 12px;
  line-height: 1.45;
  text-align: right;
}

.mp-timeline h4,
.mp-timeline p,
.mp-timeline > li > a,
.mp-timeline-links {
  grid-column: 3;
}

.mp-timeline h4 {
  grid-row: 1;
  margin: 0;
  font-size: 19px;
  line-height: 1.25;
}

.mp-timeline p {
  grid-row: 2;
  max-width: 62ch;
  margin: 9px 0 0;
  font-size: var(--readable-body);
  line-height: 1.65;
}

.mp-timeline > li > a,
.mp-timeline-links {
  grid-row: 3;
  margin-top: 8px;
}

.mp-timeline a {
  min-height: 36px;
  margin-top: 0;
  font-size: 12px;
}

@media (max-width: 767px) {
  :root {
    --page-gutter: 16px;
    --compact-gutter: 16px;
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  body {
    min-width: 0;
    font-size: 16px;
    line-height: 1.6;
    overflow-wrap: break-word;
  }

  img,
  video,
  iframe,
  svg {
    max-width: 100%;
  }

  .page-shell,
  .header-inner,
  .mp-profile-inner,
  .secretariat-inner,
  .home-events-inner,
  .home-directory-inner,
  .home-gateway-inner {
    width: calc(100% - 32px);
    max-width: 100%;
  }

  .header-inner {
    min-width: 0;
  }

  .brand-lockup {
    min-width: 0;
    min-height: 44px;
  }

  .brand-title {
    font-size: clamp(13px, 3.7vw, 15px);
  }

  .brand-mobile-role {
    font-size: 12px;
    line-height: 1.2;
  }

  .header-actions {
    gap: 6px;
  }

  .language-selector {
    width: 92px;
    height: 48px;
    padding: 2px;
  }

  .language-option {
    width: 44px;
    min-width: 44px;
    height: 44px;
    font-size: 13px;
  }

  .menu-toggle {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
    padding: 0;
  }

  .mobile-navigation {
    width: min(88vw, 360px);
  }

  .mobile-nav-link {
    min-height: 52px;
    display: flex;
    align-items: center;
    font-size: 17px;
  }

  .page-kicker,
  .section-eyebrow,
  .hero-eyebrow,
  .directory-kicker,
  .archive-status,
  .featured-media-kicker,
  .event-category {
    font-size: 12px !important;
    line-height: 1.4;
  }

  .page-kicker,
  .section-eyebrow,
  .hero-eyebrow,
  .directory-kicker {
    color: #006fa8;
  }

  .page-hero-copy > p:last-child,
  .contact-hero-copy > p:last-child,
  .events-hero-copy > p:last-child,
  .media-archive-hero .page-hero-copy > p:last-child {
    font-size: 16px;
    line-height: 1.62;
  }

  .site-footer-column a,
  .site-footer-information > a {
    min-width: 44px;
  }

  /* Political journey: normal vertical reading, no sideways rail. */
  .mp-journey {
    width: 100%;
    margin-top: 50px;
  }

  .mp-journey-heading {
    max-width: none;
    margin-bottom: 28px;
  }

  .mp-journey-heading h3 {
    font-size: clamp(32px, 9.5vw, 40px);
  }

  .mp-journey-heading p {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.6;
  }

  .mp-journey-source-note {
    display: inline-flex;
    margin-top: 10px;
    font-size: 12px;
  }

  .mp-timeline {
    --timeline-marker: 40px;
    --timeline-gap: 14px;
    display: grid;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    scroll-snap-type: none;
  }

  .mp-timeline.is-expanded {
    grid-template-columns: minmax(0, 1fr);
  }

  .mp-timeline::before {
    top: 0;
    right: auto;
    bottom: 0;
    left: calc(var(--timeline-marker) / 2);
    width: 1px;
    height: auto;
  }

  .mp-timeline.is-expanded::before {
    right: auto;
    width: 1px;
    height: auto;
  }

  .mp-timeline > li,
  .mp-timeline > li:not(:first-child) {
    display: grid;
    grid-template-columns: var(--timeline-marker) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    column-gap: var(--timeline-gap);
    width: 100%;
    min-width: 0;
    padding: 0 0 30px;
    scroll-snap-align: none;
  }

  .mp-timeline > li:last-child {
    padding-bottom: 0;
  }

  .mp-timeline-marker {
    grid-column: 1;
    grid-row: 1 / span 4;
    width: var(--timeline-marker);
    height: var(--timeline-marker);
    font-size: 18px;
  }

  .mp-timeline time,
  .mp-timeline h4,
  .mp-timeline p,
  .mp-timeline > li > a,
  .mp-timeline-links {
    grid-column: 2;
    text-align: left;
  }

  .mp-timeline time {
    grid-row: 1;
    margin: 0;
    font-size: 12px;
  }

  .mp-timeline h4 {
    grid-row: 2;
    margin-top: 4px;
    font-size: 18px;
    line-height: 1.3;
  }

  .mp-timeline p {
    grid-row: 3;
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.65;
  }

  .mp-timeline > li > a,
  .mp-timeline-links {
    grid-row: 4;
    margin-top: 6px;
  }

  .mp-timeline a {
    min-height: 44px;
    font-size: 12px;
  }

  /* Controls that fell below the stricter 44px mobile target. */
  .atlas-view-nav button,
  .atlas-map-tools button,
  .atlas-map-footer-actions button,
  .atlas-options summary,
  .events-month-panel > header button {
    min-width: 44px;
    min-height: 44px;
    width: auto;
    height: 44px;
  }

  .atlas-view-nav button {
    padding-inline: 12px;
    font-size: 13px;
  }

  .atlas-map-tools button {
    width: 44px;
  }

  .atlas-options summary,
  .atlas-map-footer-actions button {
    font-size: 12px;
  }

  .source-link,
  .media-view-all,
  .emergency-link,
  .home-events-heading > a,
  .atlas-source-links a,
  .district-contact-number,
  .district-contact-email {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    font-size: 12px !important;
  }

  .story-link {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
  }

  .archive-filter {
    min-height: 44px;
    font-size: 12px;
  }

  .events-calendar-system button,
  .events-view-toggle button,
  .events-filters button {
    min-height: 44px;
    font-size: 12px !important;
  }

  .events-weekdays {
    font-size: 12px;
    letter-spacing: .03em;
  }

  .events-day time,
  .events-day-secondary,
  .calendar-more-events {
    font-size: 12px !important;
  }

  .atlas-profile-list span,
  .atlas-provenance,
  .atlas-map-caption,
  .media-method-note,
  .events-privacy-note {
    font-size: 12px !important;
    line-height: 1.5;
  }

  .atlas-layer span,
  .atlas-profile-head > div > span,
  .atlas-provenance strong,
  .events-empty-state > div span {
    font-size: 12px !important;
  }

  .story-card h3 {
    font-size: 16px !important;
    line-height: 1.35;
  }

  .census-browser-head,
  .census-library-header,
  .dataset-study-intro {
    min-width: 0;
  }

  .census-category-strip button,
  .census-read-button,
  .census-library-close,
  .dataset-actions button,
  .census-empty-area-actions button {
    min-height: 44px;
    font-size: 13px !important;
  }

  .census-view-card > p,
  .census-dataset-description,
  .census-card-insight,
  .aggregate-chart-card > p,
  .aggregate-intro,
  .census-dataset-group > header p,
  .coverage-summary,
  .featured-media-summary {
    font-size: 15px !important;
  }

  .census-table-wrap table,
  .census-table-wrap thead th {
    font-size: 14px !important;
  }

  .mini-bar-row strong,
  .atlas-map-label,
  .story-line-chart text,
  .story-bar-chart text {
    font-size: 12px !important;
  }

  .contact-consent {
    min-height: 44px;
    align-items: flex-start;
    font-size: 13px !important;
    line-height: 1.55;
  }

  /* Mobile-specific artwork avoids loading and cropping desktop panoramas. */
  .events-hero::after,
  .media-archive-hero::before {
    background-image: linear-gradient(rgba(243, 251, 254, .9), rgba(243, 251, 254, .95)), url('/assets/kabindra-brand/gorkha-hero-landscape-v1-mobile.webp') !important;
  }
}

@media (max-width: 340px) {
  .header-inner {
    width: calc(100% - 20px);
  }

  .brand-logo {
    width: 34px;
    height: 34px;
  }

  .brand-title {
    font-size: 12px;
  }

  .brand-mobile-role {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mp-timeline,
  .mp-timeline * {
    scroll-behavior: auto;
  }
}
