/* ============================================================
   e-uzd — рестайл головної у стиль сторінок-протоколів.
   Підключається ОСТАННІМ (після Bootstrap/style.css та inline-стилів),
   тому перекриває кольори/типографіку, не ламаючи Bootstrap-функціонал
   (модалки, Swiper, LightGallery, сітка). Дизайн-токени = protocol.css.
   ============================================================ */
:root{
  --teal:#42C3C6; --teal-d:#2A9DA0; --teal-dd:#0F7A7D; --teal-bg:#EAF8F8;
  --ink:#0E2730; --muted:#5B6B72; --line:#E2ECEE; --bg:#F6FBFB; --card:#FFFFFF;
  --uzd-shadow:0 6px 24px rgba(15,122,125,.08); --uzd-shadow-sm:0 2px 10px rgba(15,122,125,.06);
  /* перевизначаємо Bootstrap primary → бірюза */
  --bs-primary:#2A9DA0; --bs-primary-rgb:42,157,160; --bs-link-color:#0F7A7D; --bs-link-hover-color:#0E2730;
}

/* ---- Базовий фон + прибрати старі декоративні плями ---- */
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:var(--bg)!important}
.shape{display:none!important}              /* старі плаваючі shape-картинки */
.features-area,.protocols-area,.video-area,.faq-arae,.unlock-area,.telegram-cta-area{background:var(--bg)!important}
.our-team-area{background:#fff!important}

/* ---- Типографіка ---- */
h1,h2,h3,h4,h5{color:var(--ink)}
h1,h2,h3,h4,h5,.navbar-brand,.section-title h2,.fw-bold,.fw-semibold{font-family:'Nunito',sans-serif}
h1,h2{letter-spacing:-.4px}

/* ---- Кольори (перекриття Bootstrap utility) ---- */
.text-primary{color:var(--teal-dd)!important}
.bg-primary{background-color:var(--teal-d)!important}
.bg-primary.bg-opacity-10{background-color:var(--teal-bg)!important}
.text-success{color:var(--teal-d)!important}
.btn-primary{--bs-btn-bg:var(--teal-d);--bs-btn-border-color:var(--teal-d);--bs-btn-hover-bg:var(--teal-dd);--bs-btn-hover-border-color:var(--teal-dd);--bs-btn-active-bg:var(--teal-dd);--bs-btn-disabled-bg:var(--teal-d);--bs-btn-disabled-border-color:var(--teal-d);box-shadow:0 8px 20px rgba(42,157,160,.30)}
.btn-primary:hover{transform:translateY(-1px)}
.btn-outline-primary{--bs-btn-color:var(--teal-dd);--bs-btn-border-color:var(--teal-d);--bs-btn-hover-bg:var(--teal-d);--bs-btn-hover-border-color:var(--teal-d);--bs-btn-active-bg:var(--teal-dd)}
.btn{transition:.15s}

/* ---- Navbar ---- */
#navbar{background:rgba(255,255,255,.92)!important;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.navbar .nav-link.hover:hover{color:var(--teal-dd)!important}
.nav-cta-dicom{color:var(--teal-dd)!important;font-weight:700}
/* Кнопка «догори» — у бренд-колір */
#backtotop{background-color:var(--teal-d)!important}
#backtotop:hover{background-color:var(--teal-dd)!important}

/* Соцмережі — кольорові іконки */
.social-icons .soc{font-size:24px;line-height:1;display:inline-flex;transition:transform .15s,opacity .15s}
.social-icons .soc:hover{transform:translateY(-1px);opacity:.85}
.social-icons .tg{color:#229ED9}
.social-icons .fb{color:#1877F2}
.social-icons .yt{color:#FF0000}
/* Лого-вордмарк як на сторінках протоколів */
.navbar-brand .brand-word{font-family:'Nunito',sans-serif;font-weight:900;font-size:23px;letter-spacing:-.5px;color:var(--ink);line-height:1}
.navbar-brand .brand-word span{color:var(--teal-d)}
.navbar-brand img{width:34px;height:34px;display:block}

/* ---- Hero / banner ---- */
.banner-area{background:linear-gradient(180deg,var(--teal-bg) 0%,var(--bg) 100%)!important}
.banner-content .eyebrow{display:inline-block;background:#fff;border:1px solid var(--line);color:var(--teal-dd);font-weight:700;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase;padding:6px 12px;border-radius:30px;margin-bottom:16px}
.banner-content h1{font-weight:800}
.uzd-note{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 14px;font-size:14px;color:var(--muted);box-shadow:var(--uzd-shadow-sm);max-width:540px;text-align:left;line-height:1.4}
.uzd-note b{color:var(--ink)}
.uzd-note .dot{width:8px;height:8px;border-radius:50%;background:var(--teal-d);flex:none}
.uzd-note .t{flex:1 1 auto}
.banner-img-wrap img{border-radius:16px;box-shadow:var(--uzd-shadow);max-width:100%}
/* Hero-слайдшоу (крос-фейд дизайнованих кадрів зі сторіборду) */
.hero-slides{position:relative;width:100%;max-width:1000px;margin:8px auto 0;aspect-ratio:16/9;border-radius:18px;overflow:hidden;box-shadow:0 18px 50px rgba(14,39,48,.22);background:#fff;border:1px solid var(--line)}
.hero-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.hero-slides img.active{opacity:1}
.hero-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:7px;z-index:2}
.hero-dots span{width:8px;height:8px;border-radius:50%;background:rgba(14,39,48,.22);transition:.25s;cursor:pointer}
.hero-dots span:hover{background:rgba(14,39,48,.45)}
.hero-dots span.active{background:var(--teal-d);width:22px;border-radius:5px}
/* Стрілки ручного перемикання */
.hero-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.85);color:var(--teal-dd);font-size:24px;line-height:1;cursor:pointer;box-shadow:var(--uzd-shadow-sm);display:grid;place-items:center;opacity:0;transition:opacity .2s,background .15s}
.hero-slides:hover .hero-nav{opacity:1}
.hero-nav:hover{background:#fff;color:var(--teal-d)}
.hero-nav-prev{left:12px}
.hero-nav-next{right:12px}
@media (max-width:640px){.hero-nav{opacity:1;width:34px;height:34px;font-size:20px}}

/* ---- Section titles ---- */
.section-title h2{font-weight:800;color:var(--ink)}

/* ---- Feature items → картки ---- */
.feature-item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:var(--uzd-shadow-sm);transition:.15s}
.feature-item:hover{border-color:var(--teal);box-shadow:var(--uzd-shadow);transform:translateY(-2px)}
.feature-item h4{font-size:17px;font-weight:800;margin-bottom:8px}
.feature-item .flex-shrink-0 i{color:var(--teal-d)!important}

/* ---- Pricing ---- */
.pricing-area{background:linear-gradient(180deg,var(--bg) 0%,#fff 100%)!important}
.pricing-card{border:1px solid var(--line)!important;border-radius:16px!important;box-shadow:var(--uzd-shadow-sm)!important}
.pricing-card:hover{box-shadow:var(--uzd-shadow)!important}
.pricing-card-popular{border:1.5px solid var(--teal)!important;box-shadow:var(--uzd-shadow)!important}
.pricing-badge{background:var(--teal-d)!important}
.pricing-icon .material-symbols-outlined{background:var(--teal-bg)!important;color:var(--teal-dd)!important}
.pricing-features li i{color:var(--teal-d)!important}
/* Компактніші картки тарифів на мобільному */
@media (max-width:640px){
  .pricing-card{margin-bottom:1rem!important}
  .pricing-card .card-body{padding:1.1rem 1.25rem!important}
  .pricing-card .text-center{margin-bottom:.75rem!important}
  .pricing-card .pricing-icon{margin-bottom:.4rem!important}
  .pricing-icon .wh-60{width:44px!important;height:44px!important;font-size:24px!important;line-height:44px!important}
  .pricing-card h3{font-size:17px!important;margin-bottom:.15rem!important}
  .pricing-card .fs-36{font-size:26px!important}
  .pricing-features{margin-bottom:.9rem!important}
  .pricing-features li{padding:2px 0!important;margin-bottom:.35rem!important}
  .pricing-card .btn{padding-top:.55rem!important;padding-bottom:.55rem!important}
}

/* ---- Інтерфейс (Swiper) ---- */
.our-team-single-item{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--uzd-shadow-sm)}
.our-team-single-item .team-img img{border-radius:0}
.our-team-single-item .team-content{padding:14px 18px}
.our-team-single-item h3{font-size:17px;font-weight:800}
.controller-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--teal-dd);cursor:pointer;transition:.15s}
.controller-icon:hover{border-color:var(--teal);background:var(--teal-bg)}

/* ---- Протоколи (грід посилань) ---- */
.protocols-area{background:#fff!important}
.protocol-item{background:var(--card);border:1px solid var(--line)!important;border-radius:13px;padding:14px 16px;transition:.15s}
.protocol-item:hover{background:var(--teal-bg);border-color:var(--teal)!important;transform:translateY(-1px)}
a.protocol-item{display:flex;text-decoration:none;color:var(--ink);cursor:pointer;border-color:#BfE6E6!important;box-shadow:var(--uzd-shadow-sm)}
a.protocol-item span.fs-15{font-weight:700}
a.protocol-item .protocol-link-mark{margin-left:auto;color:var(--teal-d);font-weight:800;font-size:18px;opacity:1;transition:transform .15s}
a.protocol-item:hover{background:var(--teal-bg)!important;border-color:var(--teal)!important}
a.protocol-item:hover .protocol-link-mark{transform:translateX(4px)}
.protocol-item i{color:var(--teal-d)!important}

/* ---- Telegram CTA ---- */
.telegram-cta-card{background:linear-gradient(135deg,var(--teal-d) 0%,var(--teal-dd) 100%)!important;box-shadow:0 18px 40px rgba(15,122,125,.25)!important;border-radius:22px!important}
.telegram-cta-card .btn-light{color:var(--teal-dd)}

/* ---- FAQ ---- */
.faq-wrapper .faq-item{border:1px solid var(--line)!important;box-shadow:var(--uzd-shadow-sm)}
.faq-wrapper .faq-btn:hover{background-color:var(--teal-bg)!important}
.faq-wrapper .faq-icon{color:var(--teal-dd)}

/* ---- Фінальний CTA (unlock) → ctaband ---- */
.unlock-area .border-bottom{border-bottom:none!important}
.unlock-content{background:linear-gradient(135deg,var(--teal-d),var(--teal-dd));border-radius:22px;padding:42px 34px;color:#fff;text-align:center;box-shadow:0 18px 40px rgba(15,122,125,.25)}
.unlock-content h2,.unlock-content h4,.unlock-content p{color:#fff}
.unlock-content .btn-primary{background:#fff!important;color:var(--teal-dd)!important;border-color:#fff!important;box-shadow:0 8px 20px rgba(0,0,0,.15)}
.unlock-content .btn-primary:hover{background:#F2FBFB!important}

/* ---- Footer ---- */
.footers-area{background:#fff;border-top:1px solid var(--line)!important}
.footers-area h5{font-family:'Nunito';font-weight:800}
.footers-area a.text-primary,.footers-area .text-primary{color:var(--teal-dd)!important}
.payment-badge{border-color:var(--line)!important}

/* DICOM банер-рядок (опційно) */
.dicom-pill{display:inline-flex;align-items:center;gap:8px;background:var(--teal-bg);border:1px solid #CDEDED;border-radius:12px;padding:8px 14px;color:var(--teal-dd);font-weight:700;text-decoration:none;font-size:14px}
.dicom-pill:hover{background:#dff4f4;color:var(--teal-dd)}