.mobility-hero { background: #eaf4ee; padding: 38px 0 44px; border-bottom: 1px solid #cbded2; }
.mobility-back { display: block; width: fit-content; color: #22523d; font-weight: 700; margin-bottom: 26px; }
.mobility-hero .eyebrow { display: block; color: #176343; }
.mobility-hero h1 { max-width: 850px; font-size: clamp(2.3rem, 5vw, 4.4rem); line-height: 1.08; letter-spacing: -.045em; color: #103e2c; margin: 14px 0 20px; }
.mobility-hero p { max-width: 660px; font-size: 1.13rem; line-height: 1.7; color: #365749; }
.mobility-hero-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.mobility-steps { display: flex; flex-wrap: wrap; gap: 22px; padding-top: 30px; color: #234a38; }
.mobility-steps span { display: flex; align-items: center; gap: 9px; font-size: .92rem; }
.mobility-steps b { display: inline-grid; place-items: center; width: 28px; height: 28px; border: 1px solid #7ca78d; border-radius: 50%; }
.mobility-section { padding: 48px 0; scroll-margin-top: 110px; }
.mobility-section-tint { background: #f5f7f5; }
.mobility-section h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.2; margin: 8px 0 14px; }
.mobility-destinations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.mobility-destination { display: flex; align-items: center; gap: 14px; padding: 24px; border: 1px solid #d0ddd4; border-radius: 16px; color: #173e2c; background: white; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.mobility-destination > span { color: #567461; font-size: .82rem; }
.mobility-destination strong { font-size: 1.3rem; }
.mobility-destination b { margin-left: auto; font-size: 1.4rem; }
.mobility-destination:hover, .mobility-destination[aria-current] { border-color: #176343; box-shadow: 0 6px 20px #163e2c12; background: #edf7ef; }
.mobility-transport-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.mobility-transport { display: flex; align-items: flex-start; flex-direction: column; padding: 25px; background: white; border: 1px solid #d8e1da; border-top: 5px solid #21724a; border-radius: 16px; }
.mobility-transport--blue { border-top-color: #256485; }
.mobility-transport--yellow { border-top-color: #c28e14; }
.mobility-transport-code { background: #e4f2e9; color: #145a35; min-width: 66px; padding: 13px 10px; border-radius: 12px; text-align: center; font-weight: 900; letter-spacing: .025em; font-size: 1rem; }
.mobility-transport--blue .mobility-transport-code { background: #e7f0fa; color: #215772; }
.mobility-transport--yellow .mobility-transport-code { background: #fff1cc; color: #735000; }
.mobility-official { font-size: .65rem; letter-spacing: .09em; font-weight: 800; color: #526c5b; margin-top: 22px; }
.mobility-transport h3 { font-size: 1.35rem; line-height: 1.25; margin: 8px 0 12px; color: #173e2c; }
.mobility-transport p { font-size: .95rem; line-height: 1.7; margin: 0 0 24px; color: #465a4e; }
.mobility-transport a { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: auto; padding: 14px 0 0; border-top: 1px solid #e0e7e1; width: 100%; font-weight: 800; color: #176343; text-decoration: none; line-height: 1.5; }
.mobility-transport a:hover, .mobility-news a:hover, .mobility-essential-grid a:hover { text-decoration: underline; }
.mobility-footnote, .mobility-intro { line-height: 1.7; color: #4f6256; font-size: .95rem; max-width: 850px; }
.mobility-footnote { margin: 22px 0 0; }
.mobility-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 12px; }
.mobility-filters button { font: inherit; font-weight: 700; border: 1px solid #bfd0c3; background: white; border-radius: 40px; padding: 11px 17px; color: #284e38; cursor: pointer; min-height: 44px; }
.mobility-filters button[aria-pressed="true"] { color: white; background: #175d3b; border-color: #175d3b; }
.mobility-result { font-size: .9rem; color: #52695a; }
.mobility-news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.mobility-news { display: flex; flex-direction: column; padding: 24px; border: 1px solid #d8e1da; border-radius: 14px; background: white; }
.mobility-news-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center; font-size: .76rem; color: #53685b; }
.mobility-news-meta span { border-radius: 5px; background: #eaf3ed; padding: 5px 8px; font-weight: 800; color: #1b593a; }
.mobility-news h3 { font-size: 1.15rem; line-height: 1.5; margin: 18px 0; overflow-wrap: anywhere; }
.mobility-news-check { color: #58695e; font-size: .78rem; line-height: 1.6; }
.mobility-news a { margin-top: auto; padding-top: 16px; font-weight: 800; color: #176343; font-size: .9rem; }
.mobility-empty { grid-column: 1 / -1; padding: 24px; background: #f2f6f3; border-radius: 12px; line-height: 1.7; }
.mobility-source-details { margin-top: 26px; padding-top: 20px; border-top: 1px solid #d8e1da; font-size: .88rem; color: #4f6256; }
.mobility-source-details summary { cursor: pointer; padding: 8px 0; font-weight: 700; }
.mobility-source-details li { margin: 12px 0; line-height: 1.7; }
.mobility-source-details a { color: #175d3b; }
.mobility-essential-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.mobility-essential-grid article { padding: 12px 0 20px; }
.mobility-essential-grid article > span { font-size: .85rem; font-weight: 800; color: #176343; }
.mobility-essential-grid h3 { margin: 12px 0; font-size: 1.2rem; }
.mobility-essential-grid p { line-height: 1.7; color: #4f6256; }
.mobility-essential-grid a { font-weight: 800; color: #176343; }
.mobility-safety { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 25px; padding: 28px; background: #fff0c5; border: 1px solid #d4ad48; border-radius: 16px; color: #503c0a; }
.mobility-safety strong { font-size: 1.2rem; }
.mobility-safety p { margin: 8px 0 0; line-height: 1.6; }
.mobility-destination-note { padding: 26px; background: #f2f6f3; border-left: 4px solid #176343; border-radius: 10px; margin-bottom: 36px; }
.mobility-destination-note p { line-height: 1.8; max-width: 850px; }
[data-mobility-card][hidden], [data-mobility-empty][hidden], [data-mobility-filters][hidden] { display: none !important; }
.mobility-section a:focus-visible, .mobility-section button:focus-visible, .mobility-hero a:focus-visible { outline: 3px solid #246da1; outline-offset: 5px; }
@media(max-width: 1050px) { .mobility-transport-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mobility-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 650px) { .mobility-hero { padding: 28px 0 32px; } .mobility-section { padding: 32px 0; } .mobility-destinations, .mobility-transport-grid, .mobility-news-grid, .mobility-essential-grid { grid-template-columns: minmax(0, 1fr); } .mobility-destination { padding: 18px 22px; } .mobility-steps { flex-direction: column; gap: 12px; } .mobility-hero-links { flex-direction: column; align-items: stretch; } .mobility-safety { flex-direction: column; align-items: stretch; padding: 22px; } .mobility-filters { gap: 7px; } .mobility-filters button { padding: 10px 13px; font-size: .88rem; } }
@media print { .mobility-hero-links, .mobility-filters { display: none; } .mobility-section { padding: 15px 0; } .mobility-transport-grid { grid-template-columns: repeat(2, 1fr); } .mobility-news, .mobility-transport { break-inside: avoid; } }
