:root {
    --brand:#0d6efd;

    --brand-hover:#0b5ed7;

    --ink:#20222a;

    --muted:#6b7280;

    --line:#e9edf3;

    --bg:#f8f9fb;

    --card:#ffffff;

    --radius:16px;

    --shadow:
        0 4px 18px rgba(15, 23, 42, .04);

    --transition:.2s ease;
}


/* BASE */

body {
    background: var(--bg);

    color: var(--ink);

    font-family:
        Inter,
        system-ui,
        sans-serif;

    line-height: 1.6;
}

a {
    text-decoration: none;
}

img {
    max-width: 100%;
}

.section-title {
    font-size: 1.7rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.muted {
    color: var(--muted);
}


/* TOPBAR */

.topbar {
    background:#0f172a;

    color:#dbe4ff;

    font-size:.9rem;
}


/* HEADER */

.site-header {
    background:#fff;

    border-bottom:1px solid var(--line);

    position: sticky;

    top: 0;

    z-index: 30;
}


/* NAVIGATION */

.nav-link {
    color: #20222a;

    text-decoration: none;

    font-weight: 400;

    padding: 6px 10px;

    border-radius: 8px;

    transition: var(--transition);
}

.nav-link:hover {
    color: var(--brand);

    background:#f5f7fb;
}


/* DROPDOWN */

.dropdown {
    position: relative;
}

.dropdown-menu {
    display: none;

    position: absolute;

    top: 100%;
    left: 0;

    min-width: 240px;

    background: #fff;

    border: 1px solid var(--line);

    border-radius: 12px;

    padding: 8px 0;

    box-shadow:
        0 10px 30px rgba(0,0,0,0.05);
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-item {
    display:block;

    padding: 10px 16px;

    color: #20222a;

    font-size: 14px;

    transition: var(--transition);
}

.dropdown-item:hover {
    background: #f5f7fb;

    color: var(--brand);
}


/* CARDS */

.content-card {
    background:#fff;

    border:1px solid var(--line);

    border-radius: var(--radius);

    box-shadow: var(--shadow);
}


/* KPI */

.kpi-card {
    background:#fff;

    border:1px solid var(--line);

    border-radius: var(--radius);

    padding:24px;

    height:100%;

    transition: var(--transition);
}

.kpi-card:hover {
    transform: translateY(-2px);
}


/* HERO */

.hero-title {
    font-size: 3rem;

    font-weight: 700;

    line-height: 1.1;
}

.hero-subtitle {
    font-size: 1.15rem;

    color: var(--muted);
}


/* BUTTONS */

.btn-primary {
    border-radius: 10px;
}

.btn-success {
    border-radius: 10px;
}

.btn-outline-secondary {
    border-radius: 10px;
}


/* BREADCRUMBS */

.breadcrumb {
    font-size: .95rem;
}

.breadcrumb a {
    color: var(--brand);
}


/* ACCORDION */

.accordion-item {
    border-radius: 12px !important;

    overflow: hidden;

    border:1px solid var(--line);
}

.accordion-button {
    font-weight: 600;
}


/* FOOTER */

.site-footer {
    border-top:1px solid var(--line);

    background:#fff;
}


/* MOBILE */

@media (max-width: 768px) {

    .hero-title {
        font-size: 2rem;
    }

    .section-title {
        font-size: 1.4rem;
    }

}

.phone {
  text-decoration: none; /* убрать подчеркивание */
  color: inherit;        /* цвет как у окружающего текста */
}




/* акцентная полоса сверху */
.hero-accent {
  height: 6px;
  color: black;
  background: linear-gradient(90deg, #2b7a62, #48b28a, #2b7a62);
}

.content {
  padding: 2.5rem 2rem;
}

@media (max-width: 680px) {
  .content {
    padding: 1.8rem 1.2rem;
  }
}

/* типографика */
h1 {
  font-size: 1.9rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.01em;
  background: linear-gradient(135deg, #1f5e4c, #0f3b2f);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  margin-bottom: 1.5rem;
  /*
  border-left: 5px solid #2b7a62;
  */
  padding-left: 1.2rem;
}

h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 2rem 0 1rem 0;
  color: #1e4a3b;
  border-bottom: 2px solid #e2edf2;
  padding-bottom: 0.5rem;
}

h3 {
  font-size: 1.2rem;
  font-weight: 600;
  margin: 1.5rem 0 0.75rem 0;
  color: #2c5a4a;
}

.lead {
  font-size: 1.1rem;
  color: #ffffff;
  background: #000000;
  padding: 1rem 1.4rem;
  border-radius: 1.5rem;
  margin: 1.2rem 0 1rem 0;
  /*
  border-left: 3px solid #48b28a;
  */
}

p {
  margin-bottom: 1.2rem;
  color: #2c3f4f;
}

.highlight-list {
  margin: 1.2rem 0 1.8rem 0;
  list-style: none;
  background: #fefcf5;
  border-radius: 1.25rem;
  padding: 0.5rem 0;
  box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}

.highlight-list li {
  padding: 0.85rem 1.2rem;
  /*
  border-left: 4px solid #2b7a62;
  */
  margin-bottom: 0.2rem;
  background: #ffffff;
  border-radius: 0 1rem 1rem 0;
  transition: 0.1s ease;
}

.highlight-list li strong {
  color: #1f5e4c;
  font-weight: 700;
  display: inline-block;
  min-width: 200px;
}

@media (max-width: 550px) {
  .highlight-list li strong {
    display: block;
    margin-bottom: 0.3rem;
  }
}

.app-list {
  margin: 1rem 0 1.5rem 0;
  padding-left: 1.5rem;
}

.app-list li {
  margin-bottom: 0.65rem;
  padding-left: 0.5rem;
}

.app-list li::marker {
  color: #2b7a62;
  font-weight: bold;
}

.info-card {
  background: #eef3f0;
  border-radius: 1.5rem;
  padding: 1.6rem 1.8rem;
  margin: 2rem 0 0.5rem 0;
  border: 1px solid #d4e2dc;
}

.info-card p:last-child {
  margin-bottom: 0;
}

.btn-ghost {
  display: inline-block;
  margin-top: 0.5rem;
  font-weight: 600;
  color: #2b7a62;
  text-decoration: none;
  border-bottom: 2px solid #b9d9cf;
  transition: 0.2s;
}

.btn-ghost:hover {
  color: #1d5b48;
  border-bottom-color: #2b7a62;
}

footer {
  background: #f9fbfc;
  padding: 1.2rem 2rem;
  border-top: 1px solid #e2edf2;
  font-size: 0.85rem;
  color: #5a7687;
  text-align: center;
}

a {
  text-decoration: none;
}

hr {
  margin: 1rem 0;
  border: none;
  height: 1px;
  background: linear-gradient(90deg, #cbdde5, transparent);
}


/* =======================================
   HEADER
======================================= */

.header-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 0;
}

.header-left{
    display:flex;
    align-items:center;
    gap:16px;
}

.header-menu{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:10px 0;
}

.header-services{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.header-cta{
    flex-shrink:0;
}

@media (max-width: 991px){

    .header-left{
        flex-wrap:wrap;
        gap:10px;
    }

    .header-menu{
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
        padding:15px 0;
    }

    .header-services{
        flex-direction:column;
        align-items:flex-start;
        width:100%;
    }

    .header-cta{
        width:100%;
    }

    .header-cta .btn{
        width:100%;
    }
}
@media (min-width: 992px){

    #mainNavbar{
        display:block !important;
    }

}


.header-secondary{

    display:flex;
    gap:28px;

    padding:12px 0;

    border-top:1px solid #ececec;
}

.header-secondary a{

    color:#333;

    text-decoration:none;

    font-weight:500;
}

.header-secondary a:hover{

    color:#0d6efd;
}
