:root {
  --ar-mint: #bfe8dc;
  --ar-mint-soft: #eef8f5;
  --ar-cream: #fbf8f1;
  --ar-ink: #202b2a;
  --ar-muted: #5f6c69;
  --ar-line: #dce6e2;
  --ar-green: #126a5a;
}

.ar-specialists-page #main { padding: 0; }
.ar-specialists { background: #fff; color: var(--ar-ink); font-family: inherit; }
.ar-specialists *, .ar-specialists *::before, .ar-specialists *::after { box-sizing: border-box; }
.ar-specialists__hero { align-content: center; background-color: #424846; background-image: linear-gradient(102deg, rgba(42, 47, 45, .96) 0%, rgba(52, 59, 57, .86) 48%, rgba(66, 72, 70, .28) 100%), var(--ar-specialists-hero-background, none); background-position: center, 100% 50%; background-repeat: no-repeat; background-size: cover; border: 1px solid rgba(66, 72, 70, .12); border-radius: clamp(24px, 4vw, 36px); box-shadow: 0 22px 62px rgba(66, 72, 70, .14); display: grid; isolation: isolate; margin: 32px auto 0; max-width: 1180px; min-height: clamp(300px, 34vw, 390px); overflow: hidden; padding: clamp(36px, 6vw, 68px); position: relative; width: calc(100% - 64px); }
.ar-specialists__hero::after { display: none; }
.ar-specialists__hero::before { background: rgba(244, 217, 170, .32); border-radius: 50%; bottom: -230px; content: ''; height: 390px; left: -120px; position: absolute; width: 390px; z-index: -1; }
.ar-specialists__hero-inner, .ar-specialists__directory { margin: 0 auto; max-width: 1180px; padding-left: 32px; padding-right: 32px; }
.ar-specialists__hero-inner { margin: 0; max-width: 760px; padding: 0; position: relative; z-index: 1; }
.ar-specialists__eyebrow { color: #f4d9aa; font-size: 13px; font-weight: 800; letter-spacing: .13em; margin: 0 0 12px; text-transform: uppercase; }
.ar-specialists__hero h1 { color: #fff; font-size: clamp(36px, 4.6vw, 58px); font-weight: 700; letter-spacing: -.045em; line-height: 1.06; margin: 0; max-width: 760px; }
.ar-specialists__lead { color: rgba(255, 255, 255, .84); font-size: clamp(16px, 1.25vw, 19px); line-height: 1.58; margin: 18px 0 24px; max-width: 66ch; }
.ar-specialists__directory { padding-bottom: 96px; padding-top: 72px; }
.ar-specialists__intro { align-items: end; display: flex; justify-content: space-between; margin-bottom: 32px; }
.ar-specialists h2 { font-size: clamp(32px, 4vw, 48px); letter-spacing: -.035em; line-height: 1.08; margin: 0; }
.ar-specialists__total { color: var(--ar-muted); margin: 0 0 5px; }
.ar-specialists__total strong { color: var(--ar-green); font-size: 24px; margin-right: 5px; }
.ar-specialists__filters { align-items: end; background: #fff; border: 1px solid var(--ar-line); border-radius: 20px; box-shadow: 0 12px 35px rgba(32,43,42,.06); display: grid; gap: 16px; grid-template-columns: minmax(280px, 1.8fr) minmax(210px, 1fr) auto auto; padding: 20px; }
.ar-specialists__filters label > span:first-child { color: #495754; display: block; font-size: 13px; font-weight: 700; margin: 0 0 8px; }
.ar-specialists__search-wrap { display: block; position: relative; }
.ar-specialists__search-wrap svg { fill: none; height: 20px; left: 15px; position: absolute; stroke: #64726f; stroke-linecap: round; stroke-width: 1.8; top: 50%; transform: translateY(-50%); width: 20px; }
.ar-specialists__filters input[type="search"], .ar-specialists__filters select { background: #fafcfb; border: 1px solid #cfdad6; border-radius: 11px; color: var(--ar-ink); height: 48px; margin: 0; width: 100%; }
.ar-specialists__filters input[type="search"] { padding: 0 15px 0 45px; }
.ar-specialists__filters select { padding: 0 36px 0 14px; }
.ar-specialists__filters input:focus, .ar-specialists__filters select:focus { border-color: var(--ar-green); box-shadow: 0 0 0 3px rgba(18,106,90,.12); outline: 0; }
.ar-specialists__online { align-items: center; display: flex; gap: 9px; min-height: 48px; white-space: nowrap; }
.ar-specialists__online input { accent-color: var(--ar-green); height: 18px; margin: 0; width: 18px; }
.ar-specialists__online span { margin: 0 !important; }
.ar-specialists__reset { background: transparent; border: 0; color: var(--ar-green); cursor: pointer; font-size: 14px; font-weight: 700; height: 48px; padding: 0 8px; text-decoration: underline; text-underline-offset: 4px; }
.ar-specialists__notice { color: var(--ar-muted); font-size: 14px; line-height: 1.55; margin: 16px 0 0; max-width: 900px; }
.ar-specialists__notice strong { color: var(--ar-ink); font-weight: 700; }
.ar-specialists__notice a { color: var(--ar-green); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.ar-specialists__notice a:hover, .ar-specialists__notice a:focus-visible { text-decoration-thickness: 2px; }
.ar-specialists__status { color: var(--ar-muted); font-size: 14px; margin: 16px 0; min-height: 21px; }
.ar-specialists__grid { display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ar-specialist-card { background: #fff; border: 1px solid var(--ar-line); border-radius: 18px; box-shadow: 0 8px 28px rgba(32,43,42,.045); display: flex; flex-direction: column; min-width: 0; overflow: hidden; padding: 24px; transition: border-color .2s, box-shadow .2s, transform .2s; }
.ar-specialist-card:hover { border-color: #b7d7cd; box-shadow: 0 14px 32px rgba(32,43,42,.09); transform: translateY(-2px); }
.ar-specialist-card[hidden] { display: none; }
.ar-specialist-card__header { align-items: flex-start; display: flex; gap: 14px; }
.ar-specialist-card__avatar { align-items: center; background: var(--ar-mint); border-radius: 13px; color: #145d51; display: flex; flex: 0 0 46px; font-size: 19px; font-weight: 800; height: 46px; justify-content: center; text-transform: uppercase; }
.ar-specialist-card h3 { font-size: 20px; letter-spacing: -.02em; line-height: 1.25; margin: 1px 0 7px; }
.ar-specialist-card__location { align-items: flex-start; color: var(--ar-muted); display: flex; font-size: 13px; gap: 5px; line-height: 1.4; margin: 0; white-space: pre-line; }
.ar-specialist-card__location svg { fill: none; flex: 0 0 15px; height: 15px; margin-top: 2px; stroke: var(--ar-green); stroke-width: 1.7; width: 15px; }
.ar-specialist-card__contact { border-top: 1px solid #edf1ef; color: #495754; font-size: 13px; line-height: 1.55; margin-top: 19px; overflow-wrap: anywhere; padding-top: 17px; }
.ar-specialist-card__contact h4 { color: var(--ar-muted); font-size: 11px; letter-spacing: .1em; margin: 0 0 8px; text-transform: uppercase; }
.ar-specialist-card__contact p { margin: 0 0 10px; }
.ar-specialist-card__contact p:last-child { margin-bottom: 0; }
.ar-specialist-card__contact a { color: var(--ar-green); font-weight: 650; }
.ar-specialist-card__training { border-top: 1px solid #edf1ef; margin-top: auto; padding-top: 14px; }
.ar-specialist-card__training summary { align-items: center; color: var(--ar-ink); cursor: pointer; display: flex; font-size: 14px; font-weight: 750; gap: 8px; list-style: none; }
.ar-specialist-card__training summary::-webkit-details-marker { display: none; }
.ar-specialist-card__training summary > span:first-child { flex: 1; }
.ar-specialist-card__count { align-items: center; background: var(--ar-mint-soft); border-radius: 20px; color: var(--ar-green); display: inline-flex; font-size: 12px; height: 25px; justify-content: center; min-width: 25px; padding: 0 8px; }
.ar-specialist-card__training summary svg { fill: none; height: 17px; stroke: var(--ar-green); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; transition: transform .2s; width: 17px; }
.ar-specialist-card__training[open] summary svg { transform: rotate(180deg); }
.ar-specialist-card__training ul { list-style: none; margin: 15px 0 0; padding: 0; }
.ar-specialist-card__training li { border-left: 2px solid var(--ar-mint); color: #40504d; font-size: 12px; line-height: 1.45; margin-bottom: 11px; padding-left: 10px; }
.ar-specialist-card__training time { color: var(--ar-muted); display: block; font-size: 11px; margin-top: 2px; }
.ar-specialists__more-wrap { text-align: center; }
.ar-specialists__more { background: var(--ar-ink); border: 1px solid var(--ar-ink); border-radius: var(--ar-button-radius); color: #fff; cursor: pointer; font-size: 15px; font-weight: 750; margin-top: 38px; padding: 14px 24px; }
.ar-specialists__more:hover { background: var(--ar-green); border-color: var(--ar-green); }
.ar-specialists__more[hidden] { display: none; }
.ar-specialists__empty { background: #fff; border: 1px dashed #b8cbc5; border-radius: 18px; padding: 52px 24px; text-align: center; }
.ar-specialists__empty > span { color: var(--ar-green); font-size: 42px; }
.ar-specialists__empty h3 { font-size: 24px; margin: 8px 0; }
.ar-specialists__empty p { color: var(--ar-muted); margin: 0 0 18px; }
.ar-specialists__empty button { background: transparent; border: 1px solid var(--ar-green); border-radius: var(--ar-button-radius); color: var(--ar-green); cursor: pointer; font-weight: 700; padding: 10px 17px; }

@media (max-width: 1050px) {
  .ar-specialists__filters { grid-template-columns: 1fr 1fr; }
  .ar-specialists__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .ar-specialists__hero { border-radius: 22px; margin-top: 20px; width: calc(100% - 40px); }
  .ar-specialists__hero-inner, .ar-specialists__directory { padding-left: 20px; padding-right: 20px; }
  .ar-specialists__hero-inner { padding: 28px 20px 50px; }
  .ar-specialists h1 { font-size: 42px; }
  .ar-specialists__directory { padding-bottom: 70px; padding-top: 52px; }
  .ar-specialists__intro { align-items: flex-start; flex-direction: column; gap: 15px; }
  .ar-specialists__filters, .ar-specialists__grid { grid-template-columns: 1fr; }
  .ar-specialists__filters { padding: 16px; }
  .ar-specialists__online { min-height: 34px; }
  .ar-specialists__reset { height: 34px; justify-self: start; padding: 0; }
  .ar-specialist-card { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ar-specialist-card, .ar-specialist-card__training summary svg { transition: none; }
}


@media (max-width: 767px) {
  .ar-specialists__hero { background-image: linear-gradient(180deg, rgba(42, 47, 45, .96) 0%, rgba(52, 59, 57, .84) 68%, rgba(66, 72, 70, .48) 100%), var(--ar-specialists-hero-background, none); background-position: center, 68% 50%; border-radius: 22px; margin-top: 20px; min-height: 0; padding: 34px 22px; width: calc(100% - 28px); }
  .ar-specialists__hero-inner { padding: 0; }
  .ar-specialists__hero h1 { font-size: clamp(34px, 10vw, 44px); }
}