
/* Интернет в Сербии — компоненты. Значения только из tokens.css. */
.isr, .isr * { box-sizing: border-box; }
.isr { font-family: var(--font-sans); color: var(--navy); font-size: 17px; line-height: 24px; font-weight: 300; }
.isr b, .isr strong { font-weight: 800; }
.isr :where(a) { color: var(--link); }
.isr-dark { background: var(--navy); color: var(--white); }
.isr-dark a { color: var(--lime); }

/* Header */
.isr-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
  min-height: 72px; padding: var(--space-3) var(--space-5); background: var(--white); border-bottom: var(--border-card) solid var(--line); }
.isr .isr-header__name { font: 800 22px/24px var(--font-sans); letter-spacing: -.02em; color: var(--navy); text-decoration: none; }
.isr-header__name span { display: block; font: 400 13px/16px var(--font-sans); letter-spacing: 0; color: var(--slate); }
.isr-header__short { display: none; }
@media (max-width: 600px) {
  .isr-header { padding: var(--space-3) var(--space-4); }
  .isr-header__long { display: none; }
  .isr-header__short { display: inline; }
}

/* Button */
.isr-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  height: var(--field-height); padding: 0 28px; border-radius: var(--radius-pill); border: var(--border-card) solid var(--navy);
  background: var(--navy); color: var(--white); font: 800 18px/22px var(--font-sans); text-decoration: none; cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .1s ease; }
.isr .isr-btn { color: var(--white); }
.isr .isr-btn:not(.isr-btn--promo):not(.isr-btn--outline):hover, .isr-btn:not(.isr-btn--promo):not(.isr-btn--outline):hover { background: var(--lime); border-color: var(--navy); color: var(--navy); }
.isr-btn:active { transform: scale(.97); }
.isr-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.isr-btn[disabled], .isr-btn[aria-disabled="true"] { background: var(--line); border-color: var(--line); color: var(--slate); cursor: not-allowed; }
.isr .isr-btn--promo, .isr-btn--promo { background: var(--lime); border-color: var(--lime); color: var(--navy); }
.isr-btn--promo:hover { background: var(--white); border-color: var(--white); }
.isr .isr-btn--outline, .isr-btn--outline { background: transparent; color: var(--navy); }
.isr-btn--outline:hover { background: var(--navy); color: var(--white); }
.isr .isr-dark .isr-btn--outline, .isr-dark .isr-btn--outline { color: var(--white); border-color: var(--white); }
.isr-dark .isr-btn--outline:hover { background: var(--white); color: var(--navy); }
.isr-btn--block { width: 100%; }
@media (prefers-reduced-motion: reduce) { .isr-btn { transition: none; } .isr-btn:active { transform: none; } }

/* Badge */
.isr-badge { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: var(--radius-pill);
  background: var(--lime); color: var(--navy); font: 800 14px/18px var(--font-sans); white-space: nowrap; }
.isr-badge--navy { background: var(--navy); color: var(--lime); }
.isr-badge--pale { background: var(--sky-pale); color: var(--navy); }

/* Hero */
.isr-hero { position: relative; overflow: hidden; padding: var(--space-8) var(--space-6); background: var(--navy); color: var(--white); }
.isr-hero__body { position: relative; z-index: 1; max-width: 640px; display: grid; gap: var(--space-5); }
.isr-hero__title { margin: 0; font: 800 64px/64px var(--font-sans); letter-spacing: -.02em; text-wrap: balance; }
.isr-hero__title em { font-style: normal; color: var(--lime); }
.isr-hero__lead { margin: 0; font: 300 20px/28px var(--font-sans); color: var(--on-navy-muted); }
.isr-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.isr-hero__arc { position: absolute; right: -120px; bottom: -220px; width: 520px; height: 520px; border-radius: 50%; background: var(--lime); }
.isr-hero__arc::after { content: ""; position: absolute; inset: 96px; border-radius: 50%; background: var(--navy); }
@media (max-width: 600px) {
  .isr-hero { padding: var(--space-7) var(--space-4) 160px; }
  .isr-hero__title { font-size: 40px; line-height: 42px; }
  .isr-hero__arc { right: -140px; bottom: -380px; }
}

/* Promo banner: фирменная дуга сверху, как в «promotion trading» брендбука */
.isr-promo { position: relative; overflow: hidden; display: grid; gap: var(--space-3); padding: 120px var(--space-6) var(--space-6);
  border-radius: var(--radius-block); background: var(--lime); color: var(--navy); }
.isr-promo::before { content: ""; position: absolute; left: 50%; top: -260px; width: 460px; height: 340px; transform: translateX(-50%);
  border-radius: 50%; background: var(--sky); }
.isr-promo > * { position: relative; }
.isr-promo__big { margin: 0; font: 800 64px/60px var(--font-sans); letter-spacing: -.02em; }
.isr-promo__title { margin: 0; font: 800 28px/30px var(--font-sans); letter-spacing: -.02em; }
.isr-promo__text { margin: 0; }
.isr-promo--navy { background: var(--navy); color: var(--white); }
.isr-promo--navy::before { background: var(--lime); }
.isr-promo--navy .isr-promo__big, .isr-promo--navy .isr-promo__title { color: var(--lime); }
.isr-promo--navy .isr-promo__text { color: var(--on-navy-muted); }

/* Tariff card */
.isr-card { display: flex; flex-direction: column; overflow: hidden; border: var(--border-card) solid var(--line);
  border-radius: var(--radius-card); background: var(--white); }
.isr-card--featured { border-color: var(--navy); }
.isr-card__body { display: grid; gap: var(--space-4); padding: var(--space-5); flex: 1; }
.isr-card__top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.isr-card__group { margin: 0 0 var(--space-1); font: 800 14px/18px var(--font-sans); color: var(--slate); }
.isr-card__name { margin: 0; font: 800 28px/30px var(--font-sans); letter-spacing: -.02em; }
.isr-card__speed { margin: var(--space-1) 0 0; font-weight: 800; }
.isr-card__specs { display: flex; flex-direction: column; }
.isr-card__spec-row { display: grid; grid-template-columns: 1fr 1fr; padding: var(--space-4) 0; border-bottom: var(--border-card) solid var(--line); }
.isr-card__spec-row:first-child { border-top: var(--border-card) solid var(--line); }
.isr-card__spec { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.isr-card__spec:first-child { border-right: var(--border-card) solid var(--line); }
.isr-card__spec-label { font-size: 15px; line-height: 20px; color: var(--slate); }
.isr-card__spec-value { font-size: 24px; line-height: 30px; font-weight: 800; }
.isr-list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-2); }
.isr-list li { position: relative; padding-left: 28px; }
.isr-list li::before { content: ""; position: absolute; left: 2px; top: 6px; width: 14px; height: 8px;
  border-left: 3px solid var(--navy); border-bottom: 3px solid var(--navy); transform: rotate(-45deg); }
.isr-dark .isr-list li::before { border-color: var(--lime); }
.isr-price { display: grid; gap: var(--space-3); padding: var(--space-5); background: var(--sky-pale); }
.isr-card--featured .isr-price { background: var(--lime); }
.isr-price__row { display: flex; align-items: baseline; gap: var(--space-1); flex-wrap: wrap; }
.isr-price__num { font: 800 44px/44px var(--font-sans); letter-spacing: -.02em; }
.isr-price__cur { font-weight: 800; }
.isr-price__old { margin-left: var(--space-2); color: var(--slate); text-decoration: line-through; }
.isr-price__note { margin: 0; font: 400 14px/20px var(--font-sans); color: var(--slate); }
.isr-card--featured .isr-price__old, .isr-card--featured .isr-price__note { color: var(--navy); }
.isr-price__note--accent { font-weight: 800; color: var(--navy); }

/* Promo choice */
.isr-choice { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); border: 0; margin: 0; padding: 0; min-width: 0; }
.isr-choice legend { padding: 0; margin-bottom: var(--space-3); font: 800 14px/18px var(--font-sans); }
.isr-option { position: relative; display: flex; gap: var(--space-3); padding: var(--space-4); border: var(--border-card) solid var(--line);
  border-radius: var(--radius-card); background: var(--white); cursor: pointer; }
.isr-option input { position: absolute; opacity: 0; }
.isr-option__dot { flex: none; width: 22px; height: 22px; margin-top: 2px; border: 2px solid var(--slate); border-radius: 50%; background: var(--white); }
.isr-option__title { display: block; font-weight: 800; }
.isr-option__text { display: block; font: 400 14px/20px var(--font-sans); color: var(--slate); }
.isr-option.is-checked, .isr-option:has(input:checked) { border-color: var(--navy); background: var(--sky); }
.isr-option.is-checked .isr-option__dot, .isr-option:has(input:checked) .isr-option__dot { border: 7px solid var(--navy); }
.isr-option:has(input:focus-visible) { box-shadow: var(--focus-ring); }

/* Feature */
.isr-features { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.isr-feature { display: grid; gap: var(--space-3); align-content: start; padding: var(--space-5); border-radius: var(--radius-card);
  border: var(--border-card) solid var(--navy-line); background: var(--navy-raised); color: var(--white); }
.isr-feature__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--lime); color: var(--navy); }
.isr-feature__icon svg { width: 24px; height: 24px; }
.isr-feature__title { margin: 0; font: 800 20px/24px var(--font-sans); letter-spacing: -.01em; }
.isr-feature__text { margin: 0; color: var(--on-navy-muted); }
.isr-feature--light { background: var(--white); border-color: var(--line); color: var(--navy); }
.isr-feature--light .isr-feature__icon { background: var(--navy); color: var(--lime); }
.isr-feature--light .isr-feature__text { color: var(--slate); }

/* FAQ */
.isr-faq { display: grid; border-top: var(--border-card) solid var(--navy); }
.isr-faq__item { border-bottom: var(--border-card) solid var(--line); }
.isr-faq__q { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-4) 0;
  font: 800 18px/24px var(--font-sans); cursor: pointer; list-style: none; }
.isr-faq__q::-webkit-details-marker { display: none; }
.isr-faq__q:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }
.isr-faq__icon { flex: none; position: relative; width: 32px; height: 32px; border-radius: 50%; background: var(--lime); }
.isr-faq__icon::before, .isr-faq__icon::after { content: ""; position: absolute; left: 9px; top: 15px; width: 14px; height: 2px; background: var(--navy); }
.isr-faq__icon::after { transform: rotate(90deg); transition: transform .15s ease; }
.isr-faq__item[open] .isr-faq__icon::after { transform: rotate(0); }
.isr-faq__a { margin: 0; padding: 0 48px var(--space-5) 0; color: var(--navy); }
@media (prefers-reduced-motion: reduce) { .isr-faq__icon::after { transition: none; } }

/* Form */
.isr-form { display: grid; gap: var(--space-4); padding: var(--space-6); border-radius: var(--radius-card); background: var(--white);
  border: var(--border-card) solid var(--line); }
.isr-form__row { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); }
.isr-field { display: grid; gap: 6px; min-width: 0; }
.isr-field > label, .isr-field__label { font: 800 14px/18px var(--font-sans); color: var(--navy); }
.isr-field input, .isr-field textarea, .isr-field select { width: 100%; height: var(--field-height); padding: 0 var(--space-4);
  border: var(--border-card) solid var(--line); border-radius: var(--radius-card); background: var(--white); color: var(--navy);
  font: 400 17px/24px var(--font-sans); }
.isr-field select { appearance: none; padding-right: 44px;
  background: var(--white) no-repeat right 16px center / 12px 8px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23002340' stroke-width='2'/%3E%3C/svg%3E"); }
.isr-field textarea { height: 104px; padding: 12px var(--space-4); resize: vertical; }
.isr-field input::placeholder, .isr-field textarea::placeholder { color: var(--slate); opacity: 1; }
.isr-field input:focus, .isr-field textarea:focus, .isr-field select:focus { outline: none; border-color: var(--navy); box-shadow: var(--focus-ring); }
.isr-field__hint { font: 400 14px/20px var(--font-sans); color: var(--slate); }
.isr-pills { display: flex; flex-wrap: wrap; gap: var(--space-2); border: 0; margin: 0; padding: 0; min-width: 0; }
.isr-pills legend { padding: 0; margin-bottom: 6px; font: 800 14px/18px var(--font-sans); }
.isr-pill { position: relative; display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: var(--radius-pill);
  border: var(--border-card) solid var(--line); background: var(--white); font: 800 15px/18px var(--font-sans); cursor: pointer; }
.isr-pill input { position: absolute; opacity: 0; }
.isr-pill.is-checked, .isr-pill:has(input:checked) { background: var(--navy); border-color: var(--navy); color: var(--lime); }
.isr-pill:has(input:focus-visible) { box-shadow: var(--focus-ring); }
.isr-check { display: flex; gap: var(--space-3); align-items: flex-start; font: 400 14px/20px var(--font-sans); color: var(--slate); cursor: pointer; }
.isr-check input { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--navy); border-radius: var(--radius-sm); }
.isr-check input:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.isr-success { display: grid; gap: var(--space-2); padding: var(--space-6); border-radius: var(--radius-card); background: var(--sky); text-align: center; }
.isr-success__title { margin: 0; font: 800 28px/30px var(--font-sans); letter-spacing: -.02em; }
.isr-success p { margin: 0; }

/* Review */
.isr-review { display: grid; gap: var(--space-3); align-content: start; padding: var(--space-5); border-radius: var(--radius-card);
  background: var(--white); border: var(--border-card) solid var(--line); margin: 0; }
.isr-review__text { margin: 0; font: 300 18px/26px var(--font-sans); }
.isr-review__who { font: 400 14px/20px var(--font-sans); color: var(--slate); }
.isr-review__who b { display: block; color: var(--navy); font-size: 17px; line-height: 24px; }

/* Contacts */
.isr-contacts { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.isr-contact { display: inline-flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-5) var(--space-2) var(--space-2);
  border: var(--border-card) solid var(--navy-line); border-radius: var(--radius-pill); background: var(--navy-raised); color: var(--white); text-decoration: none; }
.isr-dark .isr-contact { color: var(--white); }
.isr-contact:hover { border-color: var(--lime); }
.isr-contact:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.isr-contact__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--lime); color: var(--navy); }
.isr-contact__icon svg { width: 20px; height: 20px; }
.isr-contact__label { display: block; font: 400 13px/16px var(--font-sans); color: var(--on-navy-muted); }
.isr-contact__value { display: block; font-weight: 800; }
