/* Статья «Школы и университеты Дубая». */

.art-alarm.is-gold{background:#fff4d6;color:#8a5f0a}
.art-alarm.is-gold i{background:#e3a21a;animation-name:art-pulse-gold}
@keyframes art-pulse-gold{0%{box-shadow:0 0 0 0 rgba(227,162,26,.45)}100%{box-shadow:0 0 0 10px rgba(227,162,26,0)}}
.is-pink{background:#ffdfe8;color:#ec4775}
.is-orange{background:#ffe8c9;color:#ee8b12}

/* ---------- обложка ---------- */

.sch-hero{position:relative;display:grid;place-items:center;min-height:360px;border-radius:34px;background:linear-gradient(160deg,#fff6de,#f7f8fa)}
.sch-stage{position:relative;width:250px;height:250px}
.sch-orbit{position:absolute;inset:0;border:2px dashed rgba(199,137,18,.35);border-radius:50%;animation:sch-spin 24s linear infinite}
.sch-main{position:absolute;inset:48px;display:grid;place-items:center;border-radius:50%;background:#e3a21a;color:#fff;font-size:84px;box-shadow:0 0 0 12px #fff,0 26px 50px rgba(227,162,26,.35)}
.sch-dot{position:absolute;display:grid;place-items:center;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#fff;font-size:26px;box-shadow:0 10px 22px rgba(33,44,62,.14);animation:sch-around 12s linear infinite}
.sch-dot.is-a{color:#1782e8}
.sch-dot.is-b{color:#ec4775;animation-delay:-3s}
.sch-dot.is-c{color:#9b50df;animation-delay:-6s}
.sch-dot.is-d{color:#1f9b64;animation-delay:-9s}
@keyframes sch-spin{to{transform:rotate(360deg)}}
@keyframes sch-around{from{left:50%;top:50%;transform:rotate(0) translateX(125px) rotate(0)}to{left:50%;top:50%;transform:rotate(360deg) translateX(125px) rotate(-360deg)}}
.sch-chip{position:absolute;padding:9px 14px;border-radius:999px;background:#fff;box-shadow:0 12px 28px rgba(33,44,62,.12);font-size:14px;font-weight:700;animation:sch-bob 6s ease-in-out infinite}
.sch-chip.is-a{left:6%;top:12%;color:#1782e8}
.sch-chip.is-b{right:8%;top:10%;color:#9b50df;animation-delay:-1s}
.sch-chip.is-c{right:4%;bottom:26%;color:#ec4775;animation-delay:-2s}
.sch-chip.is-d{left:4%;bottom:22%;color:#ee8b12;animation-delay:-3s}
.sch-chip.is-e{left:40%;bottom:6%;color:#1f9b64;animation-delay:-4s}
@keyframes sch-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ---------- сравнение ---------- */

.sch-compare{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px;margin-top:26px}
.sch-compare__col{padding:clamp(20px,3vw,32px);border-radius:32px;background:var(--surface)}
.sch-compare__col.is-main{background:#eaf3ff}
.sch-compare__icon{display:grid;place-items:center;width:56px;height:56px;margin-bottom:16px;border-radius:50%;font-size:27px}
.sch-compare__lead{margin:8px 0 0;color:var(--muted);font-size:16px;line-height:1.45}
.sch-compare ul{display:grid;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.sch-compare li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:#fff;font-size:15px;line-height:1.45}
.sch-compare li i{flex:none;margin-top:1px;color:var(--muted);font-size:20px}

/* ---------- программы ---------- */

.sch-curricula{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:24px}
.sch-curricula article{padding:20px;border-radius:26px;background:var(--surface)}
.sch-curricula span{display:grid;place-items:center;width:52px;height:52px;margin-bottom:14px;border-radius:50%;font-size:15px;font-weight:800;letter-spacing:.02em}
.sch-curricula strong{display:block;font-size:17px;line-height:1.2;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
.sch-curricula p{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.45}

/* ---------- бюджет ---------- */

.sch-budget{margin-top:clamp(64px,8vw,112px);padding:clamp(28px,5vw,56px);border-radius:40px;background:linear-gradient(160deg,#fff8e6,#fffdf7)}
.sch-budget__control{margin-top:22px;padding:20px;border-radius:24px;background:#fff;box-shadow:0 12px 30px rgba(120,90,20,.08)}
.sch-budget__control p{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 6px}
.sch-budget__control p span{color:var(--muted);font-size:14px;font-weight:650}
.sch-budget__control p strong{font-size:30px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sch-budget__scale{display:flex;justify-content:space-between;color:var(--soft);font-size:12px;font-weight:650}
.sch-schools{display:grid;gap:8px;margin:16px 0 12px;padding:0;list-style:none}
.sch-schools li{
  display:grid;grid-template-columns:minmax(180px,1.1fr) minmax(0,1.4fr) auto;align-items:center;gap:16px;
  padding:14px 18px;border-radius:20px;background:#fff;
  transition:opacity .35s ease,transform .45s cubic-bezier(.16,1,.3,1),box-shadow .3s ease;
}
.sch-schools li.is-out{opacity:.42}
.sch-schools li.is-fit{box-shadow:0 0 0 2px #1f9b64,0 12px 28px rgba(31,155,100,.12)}
.sch-schools strong{display:block;font-size:16px;line-height:1.25}
.sch-schools strong a{color:inherit;text-decoration:none}
.sch-schools strong a i{font-size:12px;color:var(--soft)}
.sch-schools strong a:hover{color:var(--blue-ink)}
.sch-khda{display:flex;align-items:center;gap:14px;margin-top:6px;padding:16px 18px;border-radius:22px;background:#fff;color:var(--ink);text-decoration:none;box-shadow:0 10px 26px rgba(120,90,20,.08);transition:transform .35s cubic-bezier(.16,1,.3,1)}
.sch-khda:hover{transform:translateY(-2px)}
.sch-khda>span{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:#fff0c8;color:#c78912;font-size:22px}
.sch-khda div{flex:1;min-width:0}
.sch-khda strong{display:block;font-size:16px}
.sch-khda small{color:var(--muted);font-size:14px}
.sch-khda>i{color:var(--soft);font-size:18px}
.sch-schools small{color:var(--muted);font-size:13px}
.sch-schools b{font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sch-bar{position:relative;height:12px;border-radius:999px;background:#f1efe8}
.sch-bar i{position:absolute;top:0;bottom:0;left:calc(var(--a) / 120000 * 100%);width:calc((var(--b) - var(--a)) / 120000 * 100%);min-width:8px;border-radius:999px;background:linear-gradient(90deg,#f2c14e,#e3a21a)}
.sch-schools li.is-fit .sch-bar i{background:linear-gradient(90deg,#4cd08a,#1f9b64)}
.sch-bar:after{content:'';position:absolute;top:-6px;bottom:-6px;left:calc(var(--budget,30000) / 120000 * 100%);width:2px;border-radius:9px;background:#1D1D1F}

/* ---------- рейтинг ---------- */

.sch-rating{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:24px 0 12px;padding:0;list-style:none}
.sch-rating li{display:grid;align-content:end;min-height:132px;padding:14px;border-radius:20px;color:#fff;transform-origin:50% 100%}
.sch-rating span{font-size:12px;font-weight:700;opacity:.85}
.sch-rating strong{font-size:16px;line-height:1.2}
.sch-rating .is-1{background:#127a4c;min-height:180px}
.sch-rating .is-2{background:#1f9b64;min-height:164px}
.sch-rating .is-3{background:#4cb884;min-height:148px}
.sch-rating .is-4{background:#e3a21a;min-height:132px}
.sch-rating .is-5{background:#ee8b12;min-height:116px}
.sch-rating .is-6{background:#e5484d;min-height:100px}
.sch-rating{align-items:end}
.sch-rating.is-armed li{transform:scaleY(.2);opacity:.2}
.sch-rating.is-shown li{transform:none;opacity:1;transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .4s ease}
.sch-rating.is-shown li:nth-child(2){transition-delay:.06s}
.sch-rating.is-shown li:nth-child(3){transition-delay:.12s}
.sch-rating.is-shown li:nth-child(4){transition-delay:.18s}
.sch-rating.is-shown li:nth-child(5){transition-delay:.24s}
.sch-rating.is-shown li:nth-child(6){transition-delay:.3s}

/* ---------- калькулятор возраста ---------- */

.sch-age{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);align-items:center;gap:clamp(24px,5vw,64px)}
.sch-age__tool{padding:22px;border-radius:30px;background:#1D1D1F;color:#fff}
.sch-age__tool label{display:grid;gap:8px}
.sch-age__tool label span{color:rgba(255,255,255,.7);font-size:14px;font-weight:650}
.sch-age__tool input[type=date]{min-height:52px;padding:0 14px;border:0;border-radius:16px;background:#2c2c2e;color:#fff;font:inherit;font-size:17px;color-scheme:dark}
.sch-age__result{margin-top:16px;padding:18px;border-radius:22px;background:#fff;color:#1D1D1F}
.sch-age__years{margin:0;color:var(--muted);font-size:15px}
.sch-age__years strong{margin-right:4px;color:#1D1D1F;font-size:44px;font-weight:800;letter-spacing:-.04em;vertical-align:-4px}
.sch-age__grade{margin:6px 0 0;font-size:20px;font-weight:750;letter-spacing:-.02em}
.sch-age__result.is-pop{animation:sch-pop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes sch-pop{from{transform:scale(.96)}to{transform:none}}
.sch-age__map{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:12px 0 0;padding:0;list-style:none}
.sch-age__map li{display:grid;gap:2px;padding:10px;border-radius:14px;background:#2c2c2e;font-size:12px;transition:background .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.sch-age__map li b{font-size:14px}
.sch-age__map li span{color:rgba(255,255,255,.65)}
.sch-age__map li.is-on{background:#1f7ff2;transform:translateY(-3px)}
.sch-age__map li.is-on span{color:#fff}

/* ---------- документы ---------- */

.sch-docs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:22px}
.sch-docs div{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:22px;background:var(--surface);font-size:15px;line-height:1.4}
.sch-docs i{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:#1782e8;font-size:22px}

/* ---------- университеты ---------- */

.sch-unis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.sch-unis article{padding:clamp(20px,3vw,30px);border-radius:30px;background:var(--surface)}
.sch-unis__tag{display:inline-block;margin:0 0 12px;padding:5px 11px;border-radius:999px;font-size:13px;font-weight:700}
.sch-unis strong{display:block;font-size:18px;line-height:1.3;letter-spacing:-.015em}
.sch-unis__price{margin:16px 0 0;font-size:28px;font-weight:800;letter-spacing:-.03em}
.sch-unis__price small{color:var(--muted);font-size:14px;font-weight:600;letter-spacing:0}

@media (max-width:1000px){
  .sch-curricula{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sch-docs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .sch-compare,.sch-age,.sch-unis{grid-template-columns:1fr}
  .sch-schools li{grid-template-columns:minmax(0,1fr) auto}
  .sch-schools .sch-bar{grid-column:1/-1;grid-row:2}
  .sch-rating{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:700px){
  /* Программы на телефоне — стопкой, как карточки Wallet: видны корешки,
     нажатая карточка раскрывается. Без скрипта — обычный список. */
  .sch-curricula{grid-template-columns:1fr;gap:0}
  .sch-curricula.is-wallet article{position:relative;margin-top:-26px;padding:18px 18px 34px;border:1px solid rgba(29,29,31,.05);box-shadow:0 -8px 22px rgba(33,44,62,.06);cursor:pointer;transition:margin .5s cubic-bezier(.16,1,.3,1),background .3s ease}
  .sch-curricula.is-wallet article:first-child{margin-top:0}
  .sch-curricula.is-wallet article:nth-child(1){background:#eaf3ff}
  .sch-curricula.is-wallet article:nth-child(2){background:#f2e9ff}
  .sch-curricula.is-wallet article:nth-child(3){background:#ffe8ef}
  .sch-curricula.is-wallet article:nth-child(4){background:#fff1dd}
  .sch-curricula.is-wallet article:nth-child(5){background:#e6f6ee}
  .sch-curricula.is-wallet article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;column-gap:14px}
  .sch-curricula.is-wallet article span{grid-row:1;margin:0;width:44px;height:44px;font-size:13px;background:#fff}
  .sch-curricula.is-wallet article strong{grid-row:1}
  .sch-curricula.is-wallet article:after{content:'';grid-row:1;grid-column:3;width:10px;height:10px;border-right:2px solid var(--soft);border-bottom:2px solid var(--soft);transform:rotate(45deg) translateY(-3px);transition:transform .35s ease}
  .sch-curricula.is-wallet article p{grid-column:1/-1;max-height:0;margin:0;overflow:hidden;opacity:0;transition:max-height .5s cubic-bezier(.16,1,.3,1),opacity .3s ease,margin .4s ease}
  .sch-curricula.is-wallet article.is-open{margin-bottom:12px;box-shadow:0 18px 40px rgba(33,44,62,.12)}
  .sch-curricula.is-wallet article.is-open + article{margin-top:-14px}
  .sch-curricula.is-wallet article.is-open p{max-height:160px;margin-top:12px;opacity:1;font-size:15px}
  .sch-curricula.is-wallet article.is-open:after{transform:rotate(-135deg) translateY(-3px)}
  .sch-curricula.is-wallet article:focus-visible{outline:2px solid #0071E3;outline-offset:2px}
}
@media (max-width:560px){
  .sch-docs{grid-template-columns:1fr}
  .sch-age__map{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sch-rating{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sch-rating li{min-height:88px!important}
  .sch-budget{border-radius:30px;margin-left:-4px;margin-right:-4px}
  .sch-hero{min-height:300px}
  .sch-stage{transform:scale(.8)}
  .sch-schools li{padding:12px 14px}
}
@media (prefers-reduced-motion:reduce){
  .sch-chip,.sch-orbit,.sch-dot{animation:none}
  .sch-dot.is-a{left:12%;top:18%}.sch-dot.is-b{left:88%;top:22%}.sch-dot.is-c{left:14%;top:82%}.sch-dot.is-d{left:86%;top:80%}
}
