.language-menu { position: relative; margin-left: 6px; }
.language-menu summary { padding: 8px 12px; border: 1px solid #ffffff40; border-radius: 10px; cursor: pointer; font-weight: 750; }
.language-menu > div { position: absolute; right: 0; top: calc(100% + 8px); min-width: 170px; padding: 8px; border-radius: 14px; background: #203550; box-shadow: 0 14px 40px #06111f50; z-index: 25; }
.language-menu a { display: block; }
.language-menu a[aria-current="page"] { background: #ffffff20; }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 3px solid #2f68e9; outline-offset: 4px; }
.site-header a:focus-visible, .site-header summary:focus-visible, .site-header button:focus-visible { outline-color: #9cc7ff; }
.topic-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.topic-card { display: block; position: relative; padding: 26px 54px 26px 26px; border: 1px solid #dce6f2; border-radius: 22px; background: #fff; text-decoration: none; transition: border-color .18s ease; }
.topic-card:hover { border-color: #2f68e9; }
.topic-card h3 { margin: 0 0 10px; color: var(--navy); font-size: 1.2rem; line-height: 1.3; }
.topic-card p { margin: 0; color: var(--muted); font-size: .97rem; }
.topic-card > span { position: absolute; right: 24px; bottom: 24px; color: var(--blue); font-size: 1.5rem; }
.local-section { margin-top: 32px; }
.breadcrumbs { color: var(--muted); font-size: .86rem; overflow-wrap: anywhere; }
.breadcrumbs a { color: var(--blue); }
.topic-heading { max-width: 930px; margin: 22px 0 38px; }
.topic-heading h1 { margin: 0; color: var(--navy); font-size: clamp(2rem,4vw,3.35rem); line-height: 1.12; letter-spacing: -.035em; overflow-wrap: break-word; }
.topic-heading > p { margin: 22px 0 0; color: var(--muted); font-size: 1.15rem; line-height: 1.7; }
.topic-layout { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(0,1fr); gap: 40px; align-items: start; }
.article-section { margin-bottom: 30px; }
.article-section h2, .example-card h2, .topic-aside h2 { margin: 0 0 12px; color: var(--navy); font-size: 1.5rem; line-height: 1.25; }
.article-section p, .example-card p { margin: 0; line-height: 1.8; }
.example-card { padding: 26px; border-left: 4px solid var(--blue); border-radius: 0 20px 20px 0; background: #e1ecff; }
.topic-aside ol { padding-left: 22px; margin: 0 0 20px; }
.topic-aside li { padding-left: 5px; margin: 0 0 14px; }
.topic-screen { margin: 30px 0 0; text-align: center; }
.topic-screen img { display: block; width: min(100%,280px); height: auto; margin: auto; border-radius: 20px; box-shadow: var(--shadow); }
.topic-screen figcaption { margin-top: 14px; color: var(--muted); font-size: .85rem; }
.faq { max-width: 900px; }
.faq details { margin: 12px 0; padding: 20px 24px; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.faq summary { font-weight: 750; color: var(--navy); cursor: pointer; line-height: 1.5; }
.faq p { margin: 14px 0 0; }
.topic-pricing { margin-top: 28px; }
.topic-pricing a { color: var(--blue); font-weight: 700; }
@media (max-width:1180px) {
  .language-menu { margin: 5px 0; }
  .language-menu > div { position: static; box-shadow: none; }
}
@media (max-width:760px) {
  .topic-layout, .topic-grid { grid-template-columns: 1fr; gap: 22px; }
  .topic-heading { margin-bottom: 28px; }
  .topic-card { padding: 22px 46px 22px 22px; }
  .topic-card > span { right: 20px; }
  .topic-heading > p { font-size: 1.05rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .store-button, .topic-card { transition: none; }
}