:root{--bg:#f6f7fb;--surface:#fff;--text:#15171c;--muted:#6d7280;--line:#e8e9ee;--accent:#6b4eff;--accent2:#846cff;--dark:#1c1d22;--ok:#1b9b67;--warn:#e19427;--danger:#c83b48;--shadow:0 18px 60px rgba(22,25,35,.08);--radius:24px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(1180px,calc(100% - 36px));margin:0 auto}.narrow{max-width:760px}.site-header{position:sticky;top:0;z-index:20;background:rgba(246,247,251,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(232,233,238,.75)}.header-inner{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:11px;align-items:center;font-size:17px}.brand strong{color:var(--accent)}.brand-mark{width:34px;height:34px;display:block;object-fit:cover;border-radius:11px;box-shadow:0 8px 24px rgba(35,65,190,.22)}.top-nav{display:flex;align-items:center;gap:24px}.top-nav>a:not(.button){color:#4c505b}.inline-form{display:inline}.link-button{border:0;background:none;padding:0;cursor:pointer;color:#4c505b}.link-button.danger,.danger{color:var(--danger)}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:14px;padding:13px 19px;font-weight:700;cursor:pointer;transition:.18s ease}.button:disabled{opacity:.65;cursor:wait}.button-small{padding:9px 15px;border-radius:11px}.button-primary{background:var(--accent);color:#fff;box-shadow:0 9px 25px rgba(107,78,255,.2)}.button-primary:hover{background:#5d41ed;transform:translateY(-1px)}.button-dark{background:var(--dark);color:#fff}.button-ghost{background:#fff;border:1px solid var(--line);color:var(--text)}.button-wide{width:100%}.button-yandex{background:#111;color:#fff;padding:15px 20px}.hero{padding:88px 0 54px;background:radial-gradient(circle at 50% 0,rgba(107,78,255,.1),transparent 40%)}.hero-content{text-align:center;max-width:940px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800;color:var(--accent);margin-bottom:10px}.hero h1{font-size:clamp(38px,6vw,68px);line-height:1.03;letter-spacing:-.045em;max-width:900px;margin:0 auto 22px}.hero-copy{font-size:19px;color:var(--muted);max-width:720px;margin:0 auto 34px}.lookup-form{max-width:820px;margin:auto;background:#fff;padding:8px;border-radius:19px;display:flex;gap:8px;box-shadow:var(--shadow);border:1px solid var(--line)}.lookup-form input{flex:1;min-width:0;border:0;background:transparent;padding:13px 16px;outline:none;font-size:16px}.lookup-form .button{min-width:150px}.lookup-hint{color:var(--muted);font-size:13px;margin-top:12px}.lookup-message{max-width:820px;margin:22px auto 0;padding:14px 18px;border-radius:14px;text-align:left}.lookup-message.loading{background:#eeebff;color:#4d3db9}.lookup-message.error{background:#fff0f1;color:#a72b38}.product-result{max-width:1100px;margin:36px auto 0;text-align:left}.result-card{display:grid;grid-template-columns:190px 1fr 290px;gap:26px;padding:24px;border:1px solid var(--line);border-radius:26px;background:#fff;box-shadow:var(--shadow)}.result-image-wrap{aspect-ratio:1/1;border-radius:18px;background:#f3f4f8;overflow:hidden}.result-image{width:100%;height:100%;object-fit:contain}.result-image-placeholder{height:100%;display:grid;place-items:center;color:var(--muted)}.result-meta{font-size:12px;color:var(--muted);margin-bottom:7px}.result-main h2{font-size:24px;line-height:1.25;margin:0 0 12px}.result-price{font-size:31px;font-weight:850;letter-spacing:-.03em;margin-bottom:20px}.result-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}.result-facts span{display:flex;flex-direction:column;color:#454955}.result-facts b{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}.economy-preview{background:#f7f5ff;border-radius:18px;padding:18px}.economy-row{display:flex;justify-content:space-between;border-top:1px solid #e5e0ff;padding:12px 0}.economy-row:first-of-type{border-top:0}.section{padding:38px 0 70px}.section-soft{background:#efeff5}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card,.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px}.feature-card h2,.panel h2{font-size:21px;margin:12px 0 8px;letter-spacing:-.02em}.feature-card p,.panel p{color:var(--muted);margin:0}.feature-icon{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#f0edff;color:var(--accent);font-size:11px;font-weight:800}.text-link{display:inline-block;margin-top:18px;color:var(--accent);font-weight:700}.status-line{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;margin-top:16px}.status-dot{width:8px;height:8px;border-radius:50%;background:#aaa}.status-ok{background:var(--ok)}.status-warn{background:var(--warn)}.cta-row{display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-row h2{font-size:34px;letter-spacing:-.035em;margin:0 0 8px}.cta-row p{color:var(--muted);margin:0}.site-footer{border-top:1px solid var(--line);background:#efeff5}.footer-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px}.muted{color:var(--muted)}.auth-section{min-height:calc(100vh - 155px);display:grid;place-items:center;padding:60px 18px}.auth-card{width:min(480px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;padding:38px;text-align:center;box-shadow:var(--shadow)}.auth-mark{margin:0 auto 18px;width:48px;height:48px;border-radius:15px}.auth-card h1{font-size:32px;letter-spacing:-.035em;margin:5px 0 12px}.auth-card p{color:var(--muted)}.fineprint{font-size:12px;color:var(--muted)!important;margin-top:16px!important}.dashboard-section{padding:50px 0 80px}.dashboard-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}.dashboard-head h1{font-size:40px;letter-spacing:-.04em;margin:0 0 5px}.user-chip{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 14px}.user-chip img,.user-chip>span{width:40px;height:40px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:#eeeaff;color:var(--accent);font-weight:800}.user-chip div{display:flex;flex-direction:column}.user-chip small{color:var(--muted)}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel-span-2{grid-column:1/-1}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px}.panel-head h2{margin:0}.badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#eff0f4;color:#656a75;font-size:12px;font-weight:750}.badge-ok{background:#e8f8f1;color:#15784f}.connection-row{display:flex;align-items:center;justify-content:space-between;gap:20px}.metric-panel{display:flex;flex-direction:column}.metric-label{color:var(--muted);font-size:13px}.metric-value{font-size:38px;letter-spacing:-.04em;margin:6px 0}.metric-panel small{color:var(--muted)}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:13px 12px;border-bottom:1px solid var(--line)}th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em}.empty-state{padding:24px;border:1px dashed #d9dbe2;border-radius:16px;color:var(--muted);text-align:center}.stack-form{display:grid;gap:17px;margin-top:26px}.stack-form label{display:grid;gap:7px;font-weight:650}.stack-form input{width:100%;border:1px solid #dfe1e7;border-radius:13px;padding:13px 14px;outline:none;background:#fff}.stack-form input:focus{border-color:#a89aff;box-shadow:0 0 0 3px #efedff}.danger-zone{margin-top:25px;padding-top:20px;border-top:1px solid var(--line)}.back-link{display:inline-block;margin-bottom:16px;color:var(--muted)}.status-box{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:15px}.status-box.success{background:#eaf8f2;color:#176f4e}.status-box.warning{background:#fff5e7;color:#925d12}.subheading{margin:26px 0 12px}.flash-stack{padding-top:16px}.flash{padding:13px 16px;border-radius:12px;margin-bottom:8px}.flash-success{background:#eaf8f2;color:#176f4e}.flash-danger{background:#fff0f1;color:#a72b38}.flash-warning{background:#fff5e7;color:#925d12}.flash-info{background:#eef1ff;color:#4052a4}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:860px){.result-card{grid-template-columns:130px 1fr}.economy-preview{grid-column:1/-1}.feature-grid{grid-template-columns:1fr}.cta-row,.dashboard-head{align-items:flex-start;flex-direction:column}.dashboard-grid{grid-template-columns:1fr}.panel-span-2{grid-column:auto}.top-nav{gap:13px}}
@media(max-width:600px){.container{width:min(100% - 24px,1180px)}.header-inner{height:62px}.top-nav>a:not(.button){display:none}.hero{padding-top:54px}.hero h1{font-size:40px}.hero-copy{font-size:16px}.lookup-form{display:grid;padding:7px}.lookup-form .button{width:100%}.result-card{grid-template-columns:1fr}.result-image-wrap{max-width:220px;margin:auto;width:100%}.result-facts{grid-template-columns:1fr}.cta-row h2{font-size:28px}.footer-inner{align-items:flex-start;flex-direction:column;justify-content:center;padding:18px 0}.auth-card{padding:28px 22px}.dashboard-section{padding-top:34px}.dashboard-head h1{font-size:34px}.user-chip{width:100%}.connection-row{align-items:flex-start;flex-direction:column}}


/* Authentication modal */
.auth-modal[hidden]{
  display:none;
}

.auth-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:20px;
}

.auth-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(13,15,23,.68);
  backdrop-filter:blur(5px);
  opacity:0;
  transition:opacity .18s ease;
}

.auth-modal-dialog{
  position:relative;
  z-index:1;
  width:min(440px,100%);
  background:#fff;
  border:1px solid rgba(255,255,255,.5);
  border-radius:26px;
  padding:34px;
  text-align:center;
  box-shadow:
    0 30px 90px rgba(0,0,0,.28),
    0 4px 18px rgba(0,0,0,.08);
  opacity:0;
  transform:translateY(12px) scale(.975);
  transition:
    opacity .18s ease,
    transform .18s ease;
  outline:none;
}

.auth-modal.is-open .auth-modal-backdrop{
  opacity:1;
}

.auth-modal.is-open .auth-modal-dialog{
  opacity:1;
  transform:translateY(0) scale(1);
}

.auth-modal-close{
  position:absolute;
  top:14px;
  right:16px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#f1f2f6;
  color:#686d79;
  cursor:pointer;
  font-size:25px;
  font-weight:400;
  line-height:1;
}

.auth-modal-close:hover{
  background:#e7e8ee;
  color:#252830;
}

.auth-modal-logo{
  width:62px;
  height:62px;
  display:block;
  object-fit:cover;
  margin:0 auto 18px;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(34,65,190,.22);
}

.auth-modal-dialog h2{
  margin:5px 0 10px;
  font-size:30px;
  line-height:1.12;
  letter-spacing:-.035em;
}

.auth-modal-copy{
  max-width:360px;
  margin:0 auto 24px;
  color:var(--muted);
}

.auth-yandex-button{
  gap:11px;
  min-height:52px;
}

.auth-yandex-symbol{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  flex:0 0 27px;
  border-radius:50%;
  background:#fc3f1d;
  color:#fff;
  font-size:15px;
  font-weight:800;
}

.auth-modal-fineprint{
  margin-bottom:0!important;
}

.auth-modal-open{
  overflow:hidden;
}

.auth-text-button{
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  font:inherit;
}

@media(max-width:600px){
  .auth-modal{
    padding:14px;
  }

  .auth-modal-dialog{
    padding:30px 22px 26px;
    border-radius:22px;
  }

  .auth-modal-dialog h2{
    font-size:27px;
  }
}

/* ADMIN_TARIFF_BROWSER_START */
.admin-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.admin-actions form {
    margin: 0;
}

.tariff-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0 24px;
}

.tariff-summary > div {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
}

.tariff-summary span {
    display: block;
    font-size: 13px;
    color: var(--muted);
    margin-bottom: 5px;
}

.tariff-summary strong {
    font-size: 20px;
}

.admin-filter {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.admin-filter-field {
    display: grid;
    gap: 6px;
    min-width: 220px;
    flex: 1;
}

.admin-filter-field span {
    font-size: 13px;
    color: var(--muted);
}

.admin-filter input,
.admin-filter select {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 0 12px;
    background: var(--card);
    color: var(--text);
    font: inherit;
}

.admin-result-count {
    margin: 4px 0 14px;
}

.admin-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
}

@media (max-width: 800px) {
    .tariff-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* ADMIN_TARIFF_BROWSER_END */

/* PUBLIC_TARIFFS_START */

.tariffs-page {
    padding: 40px 0 60px;
}

.tariffs-page-head {
    margin-bottom: 22px;
}

.tariffs-page-head h1 {
    margin-bottom: 8px;
}

.tariffs-meta {
    margin-bottom: 18px;
}

.tariffs-meta-main {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.tariffs-meta-main > div {
    min-width: 0;
}

.tariffs-meta-label {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    color: var(--muted);
}

.tariffs-meta-main strong {
    display: block;
    font-size: 15px;
}

.tariffs-list-panel {
    overflow: visible;
}

.tariffs-search {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.tariffs-search input {
    min-width: 0;
    flex: 1;
    height: 44px;
    padding: 0 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--card);
    color: var(--text);
    font: inherit;
}

.tariffs-result-line {
    margin: 8px 0 14px;
    font-size: 13px;
    color: var(--muted);
}

.tariffs-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.tariffs-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
}

.tariffs-table th,
.tariffs-table td {
    padding: 12px 10px;
    vertical-align: middle;
}

.tariffs-table thead th {
    white-space: nowrap;
    font-size: 11px;
}

.tariffs-table .tariff-group {
    text-align: center;
    font-size: 13px;
}

.tariff-main-category {
    font-weight: 600;
}

.tariff-type-name {
    font-weight: 600;
}

.tariff-rate {
    text-align: center;
    white-space: nowrap;
    font-weight: 700;
}

.tariff-extra-cell {
    min-width: 130px;
}

.tariff-details {
    position: relative;
}

.tariff-details summary {
    cursor: pointer;
    white-space: nowrap;
    color: var(--blue);
    font-weight: 600;
    font-size: 13px;
    user-select: none;
}

.tariff-details summary::marker {
    color: var(--muted);
}

.tariff-extra-box {
    width: 330px;
    margin-top: 10px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--card);
    box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

.tariff-extra-section + .tariff-extra-section {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.tariff-extra-section > strong {
    display: block;
    margin-bottom: 8px;
}

.tariff-extra-grid {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 14px;
    font-size: 13px;
}

.tariff-extra-grid span {
    color: var(--muted);
}

.tariff-extra-grid b {
    white-space: nowrap;
}

.tariffs-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 18px;
}

@media (max-width: 900px) {
    .tariffs-meta-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tariffs-search {
        flex-wrap: wrap;
    }

    .tariffs-search input {
        flex-basis: 100%;
    }
}

/* PUBLIC_TARIFFS_END */

/* TARIFF_CATEGORY_NAV_START */

.tariff-navigator {
    margin-bottom: 20px;
}

.tariff-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 4px 0 18px;
    font-size: 13px;
}

.tariff-breadcrumbs a {
    color: var(--blue);
    text-decoration: none;
}

.tariff-breadcrumbs span {
    color: var(--muted);
}

.tariff-nav-level {
    padding-top: 16px;
    margin-top: 14px;
    border-top: 1px solid var(--line);
}

.tariff-nav-title {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 12px;
}

.tariff-nav-title strong {
    font-size: 15px;
}

.tariff-nav-title span {
    color: var(--muted);
    font-size: 12px;
}

.tariff-category-grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.tariff-category-card {
    min-width: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;

    padding: 10px 12px;

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

    background: var(--card);

    color: var(--text);
    text-decoration: none;

    font-size: 12px;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.tariff-category-card:hover {
    border-color: var(--blue);
    box-shadow: 0 4px 14px rgba(0,0,0,.05);
    transform: translateY(-1px);
}

.tariff-category-card.is-active {
    border-color: var(--blue);
    box-shadow:
        0 0 0 2px rgba(76,91,255,.10);
}

.tariff-category-card span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tariff-category-card small {
    flex: 0 0 auto;

    min-width: 25px;
    padding: 2px 6px;

    border-radius: 999px;

    background: rgba(0,0,0,.045);

    color: var(--muted);
    text-align: center;
    font-size: 10px;
}

.tariff-type-browser {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;

    max-height: 230px;
    overflow-y: auto;

    padding: 2px 4px 6px 0;
}

.tariff-type-chip {
    padding: 7px 10px;

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

    background: var(--card);

    color: var(--text);
    text-decoration: none;

    font-size: 11px;
}

.tariff-type-chip:hover,
.tariff-type-chip.is-active {
    border-color: var(--blue);
    color: var(--blue);
}

.tariff-type-chip.is-active {
    font-weight: 700;
    box-shadow:
        0 0 0 2px rgba(76,91,255,.08);
}

@media (max-width: 1000px) {
    .tariff-category-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .tariff-category-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .tariff-category-grid {
        grid-template-columns: 1fr;
    }
}

/* TARIFF_CATEGORY_NAV_END */

/* TARIFF_SMOOTH_NAV_START */

.tariffs-list-panel {
    position: relative;
    transition:
        opacity .18s ease,
        transform .18s ease;
}

.tariffs-list-panel.is-loading {
    opacity: .58;
    pointer-events: none;
}

.tariffs-loading {
    position: sticky;
    top: 78px;
    z-index: 20;

    width: max-content;
    margin: 0 auto 12px;
    padding: 7px 12px;

    display: flex;
    align-items: center;
    gap: 8px;

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

    background: var(--card);

    box-shadow: 0 6px 20px rgba(0,0,0,.08);

    font-size: 12px;
    font-weight: 600;
}

.tariffs-loading-spinner {
    width: 13px;
    height: 13px;

    border: 2px solid var(--line);
    border-top-color: var(--blue);
    border-radius: 50%;

    animation: tariffs-spin .65s linear infinite;
}

.tariffs-panel-enter {
    opacity: .35;
    transform: translateY(3px);
}

.tariffs-panel-enter.tariffs-panel-enter-active {
    opacity: 1;
    transform: translateY(0);
}

@keyframes tariffs-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .tariffs-list-panel {
        transition: none;
    }

    .tariffs-loading-spinner {
        animation-duration: 1.2s;
    }
}

/* TARIFF_SMOOTH_NAV_END */

/* TARIFF_READABILITY_START */

/* На странице тарифов используем больше ширины экрана */
.tariffs-page > .container,
.tariffs-page .container {
    max-width: 1440px;
}

/* Заголовок страницы */
.tariffs-page-head h1 {
    font-size: 34px;
    line-height: 1.15;
}

.tariffs-page-head .muted {
    font-size: 15px;
}

/* Информационный блок сверху */
.tariffs-meta-label {
    font-size: 13px;
}

.tariffs-meta-main strong {
    font-size: 17px;
}

/* Поиск */
.tariffs-search input {
    height: 48px;
    padding: 0 15px;
    font-size: 15px;
}

.tariffs-search .button {
    min-height: 48px;
    font-size: 14px;
}

/* Хлебные крошки */
.tariff-breadcrumbs {
    font-size: 14px;
    gap: 9px;
}

/* Заголовки уровней категорий */
.tariff-nav-title strong {
    font-size: 17px;
}

.tariff-nav-title span {
    font-size: 13px;
}

/* Карточки категорий */
.tariff-category-card {
    min-height: 48px;
    padding: 11px 13px;
    font-size: 14px;
    line-height: 1.3;
}

.tariff-category-card small {
    min-width: 30px;
    padding: 3px 7px;
    font-size: 12px;
}

/* Типы товаров */
.tariff-type-chip {
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.25;
}

/* Найдено товаров */
.tariffs-result-line {
    font-size: 14px;
    margin: 14px 0;
}

/* Основная таблица */
.tariffs-table {
    min-width: 1240px;
}

.tariffs-table th,
.tariffs-table td {
    padding: 14px 12px;
    font-size: 14px;
    line-height: 1.35;
}

.tariffs-table thead th {
    font-size: 12px;
    letter-spacing: .01em;
}

.tariffs-table .tariff-group {
    font-size: 15px;
}

.tariff-main-category {
    font-size: 14px;
}

.tariff-type-name {
    font-size: 14px;
}

.tariff-rate {
    font-size: 15px;
}

.tariff-details summary {
    font-size: 13px;
}

/* Дополнительные тарифы */
.tariff-extra-box {
    width: 360px;
}

.tariff-extra-section > strong {
    font-size: 15px;
}

.tariff-extra-grid {
    font-size: 14px;
}

/* Пагинация */
.tariffs-pagination {
    font-size: 14px;
}

/* На обычных ноутбуках тоже оставляем комфортный размер */
@media (max-width: 1200px) {
    .tariffs-page > .container,
    .tariffs-page .container {
        max-width: calc(100% - 32px);
    }

    .tariff-category-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .tariffs-page-head h1 {
        font-size: 28px;
    }

    .tariff-category-card {
        font-size: 14px;
    }
}

/* TARIFF_READABILITY_END */

/* TARIFF_WIDTH_TUNING_START */

.tariffs-page > .container,
.tariffs-page .container {
    max-width: 1580px;
}

.tariffs-list-panel {
    padding-left: 18px;
    padding-right: 18px;
}

.tariffs-table {
    min-width: 1180px;
}

@media (max-width: 1650px) {
    .tariffs-page > .container,
    .tariffs-page .container {
        max-width: calc(100% - 40px);
    }
}

@media (max-width: 900px) {
    .tariffs-page > .container,
    .tariffs-page .container {
        max-width: calc(100% - 24px);
    }

    .tariffs-list-panel {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* TARIFF_WIDTH_TUNING_END */

/* TARIFF_RESPONSIVE_LAYOUT_START */

/*
 * DESKTOP
 * Реальная ширина страницы тарифов - 80% окна.
 * max-width: none нужен, чтобы общий .container
 * не ограничивал страницу старой шириной.
 */
.tariffs-page .container {
    width: 80vw;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Сам рабочий блок */
.tariffs-list-panel {
    width: 100%;
}

/* Таблица не должна искусственно ужиматься */
.tariffs-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.tariffs-table {
    width: 100%;
    min-width: 1180px;
}

/* Чуть крупнее основной текст таблицы */
.tariffs-table th,
.tariffs-table td {
    font-size: 15px;
}

.tariffs-table thead th {
    font-size: 12px;
}

.tariff-rate {
    font-size: 16px;
}

/* Категории нормально используют новую ширину */
.tariff-category-grid {
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
}


/*
 * НЕБОЛЬШИЕ НОУТБУКИ
 */
@media (max-width: 1400px) {

    .tariffs-page .container {
        width: 90vw;
    }

    .tariff-category-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}


/*
 * ПЛАНШЕТ
 */
@media (max-width: 1024px) {

    .tariffs-page .container {
        width: 94vw;
    }

    .tariff-category-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .tariffs-meta-main {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .tariffs-table {
        min-width: 1100px;
    }
}


/*
 * ТЕЛЕФОН
 */
@media (max-width: 700px) {

    .tariffs-page {
        padding-top: 24px;
    }

    .tariffs-page .container {
        width: calc(100% - 20px);
    }

    .tariff-category-grid {
        grid-template-columns: 1fr;
    }

    .tariffs-meta-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .tariffs-search {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .tariffs-search input,
    .tariffs-search .button {
        width: 100%;
    }

    .tariffs-list-panel {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*
     * На телефоне таблицу не сжимаем.
     * Пользователь листает её влево-вправо.
     */
    .tariffs-table {
        min-width: 1050px;
    }

    .tariffs-table th,
    .tariffs-table td {
        font-size: 14px;
        padding: 11px 10px;
    }

    .tariff-rate {
        font-size: 15px;
    }

    .tariff-type-browser {
        max-height: 300px;
    }
}


/*
 * ОЧЕНЬ УЗКИЙ ТЕЛЕФОН
 */
@media (max-width: 420px) {

    .tariffs-page .container {
        width: calc(100% - 12px);
    }

    .tariffs-page-head h1 {
        font-size: 27px;
    }
}

/* TARIFF_RESPONSIVE_LAYOUT_END */

/* SITE_STICKY_FOOTER_START */

html {
    min-height: 100%;
}

body {
    min-height: 100vh;
    min-height: 100dvh;

    display: flex;
    flex-direction: column;
}

body > main {
    flex: 1 0 auto;
}

.site-header,
.site-footer {
    flex-shrink: 0;
}

.site-footer {
    margin-top: auto;
}

/* SITE_STICKY_FOOTER_END */

/* SITE_HEADER_WIDTH_START */

/* ПК */
.site-header .container {
    width: 80vw;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Небольшой ноутбук */
@media (max-width: 1400px) {
    .site-header .container {
        width: 90vw;
    }
}

/* Планшет */
@media (max-width: 1024px) {
    .site-header .container {
        width: 94vw;
    }
}

/* Телефон */
@media (max-width: 700px) {
    .site-header .container {
        width: calc(100% - 20px);
    }
}

/* Узкий телефон */
@media (max-width: 420px) {
    .site-header .container {
        width: calc(100% - 12px);
    }
}

/* SITE_HEADER_WIDTH_END */


/* =========================================================
   KADANIKA COST CALCULATOR
   ========================================================= */

.cabinet-home {
  min-height: calc(100vh - 170px);
}

.cabinet-tools-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  margin-top: 28px;
}

.cabinet-tool-card {
  display: flex;
  gap: 22px;
  min-height: 210px;
  padding: 30px;
  color: inherit;
  text-decoration: none;
  background: #fff;
  border: 1px solid #e7e9ef;
  border-radius: 24px;
  box-shadow: 0 8px 30px rgba(18, 24, 40, .05);
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    border-color .15s ease;
}

.cabinet-tool-card:hover {
  transform: translateY(-2px);
  border-color: #d5d9e2;
  box-shadow: 0 16px 40px rgba(18, 24, 40, .09);
}

.cabinet-tool-icon {
  flex: 0 0 62px;
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: #f2f4f7;
  font-size: 28px;
  font-weight: 800;
}

.cabinet-tool-content {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.cabinet-tool-content h2 {
  margin: 2px 0 10px;
  font-size: 24px;
}

.cabinet-tool-content p {
  margin: 0;
  color: #707585;
  line-height: 1.55;
}

.cabinet-tool-link {
  margin-top: auto;
  padding-top: 22px;
  font-weight: 700;
}

.cost-page {
  padding-bottom: 70px;
}

.cost-top-row {
  margin-bottom: 24px;
}

.cost-top-row h1 {
  margin-bottom: 8px;
}

.cost-back {
  display: inline-flex;
  margin-bottom: 22px;
  color: #626979;
  text-decoration: none;
  font-size: 14px;
  font-weight: 650;
}

.cost-back:hover {
  color: #111827;
}

.cost-mode-tabs {
  display: inline-flex;
  gap: 5px;
  margin-bottom: 24px;
  padding: 5px;
  background: #eceef2;
  border-radius: 14px;
}

.cost-mode {
  min-height: 42px;
  padding: 0 18px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #606675;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.cost-mode.active {
  color: #111827;
  background: #fff;
  box-shadow: 0 2px 10px rgba(18, 24, 40, .08);
}

.cost-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 22px;
  align-items: start;
}

.cost-card {
  min-width: 0;
  padding: 26px;
}

.cost-card + .cost-card:not([hidden]) {
  grid-column: 1;
}

.cost-card-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 8px;
}

.cost-card-head h2 {
  margin: 4px 0 0;
}

.cost-chip {
  flex: 0 0 auto;
  padding: 7px 10px;
  border-radius: 999px;
  background: #f1f3f6;
  color: #686f7d;
  font-size: 12px;
  font-weight: 700;
}

.cost-help {
  margin: 0 0 22px;
  color: #737988;
  font-size: 14px;
  line-height: 1.55;
}

.cost-fields,
.cost-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.cost-fields-time {
  margin-top: 12px;
}

.cost-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  color: #424856;
  font-size: 13px;
  font-weight: 650;
}

.cost-field small {
  color: #848a98;
  font-weight: 500;
  line-height: 1.4;
}

.cost-field input,
.cost-field select {
  width: 100%;
  min-height: 48px;
  padding: 0 13px;
  border: 1px solid #dfe2e8;
  border-radius: 12px;
  outline: none;
  background: #fff;
  color: #171a21;
  font: inherit;
  font-size: 15px;
}

.cost-field input:focus,
.cost-field select:focus {
  border-color: #aeb4c0;
  box-shadow: 0 0 0 3px rgba(22, 27, 38, .05);
}

.cost-input-unit {
  position: relative;
}

.cost-input-unit input {
  padding-right: 72px;
}

.cost-input-unit > span {
  position: absolute;
  right: 13px;
  top: 50%;
  transform: translateY(-50%);
  color: #8a909d;
  font-size: 13px;
  font-weight: 650;
  pointer-events: none;
}

.cost-subtitle {
  margin-top: 23px;
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 750;
}

.time-mode {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.time-mode label {
  cursor: pointer;
}

.time-mode input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.time-mode span {
  display: block;
  padding: 9px 12px;
  border: 1px solid #e0e3e9;
  border-radius: 10px;
  color: #6d7380;
  background: #fff;
  font-size: 13px;
  font-weight: 650;
}

.time-mode input:checked + span {
  color: #151922;
  border-color: #c7ccd5;
  background: #f2f4f7;
}

.cost-settings {
  margin-top: 24px;
  border-top: 1px solid #eceef2;
  border-bottom: 1px solid #eceef2;
  padding: 15px 0;
}

.cost-settings summary {
  cursor: pointer;
  font-size: 14px;
  font-weight: 750;
}

.cost-settings[open] summary {
  margin-bottom: 16px;
}

.cost-settings-note {
  margin: 15px 0 0;
  color: #7a808d;
  font-size: 13px;
  line-height: 1.5;
}

.cost-breakdown {
  display: grid;
  gap: 0;
  margin-top: 22px;
}

.cost-breakdown > div {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 0;
  border-bottom: 1px solid #f0f1f4;
  color: #6f7582;
  font-size: 14px;
}

.cost-breakdown strong {
  color: #262b35;
  white-space: nowrap;
}

.cost-breakdown-total {
  margin-top: 4px;
  font-weight: 750;
}

.cost-unit-result {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  margin-top: 18px;
  padding: 18px 20px;
  background: #151820;
  color: #fff;
  border-radius: 15px;
}

.cost-unit-result span {
  font-size: 14px;
}

.cost-unit-result strong {
  font-size: 26px;
  white-space: nowrap;
}

.cost-summary {
  position: sticky;
  top: 92px;
  padding: 24px;
}

.cost-summary h2 {
  margin: 5px 0 24px;
  font-size: 22px;
}

.cost-summary-main {
  padding: 20px;
  border-radius: 16px;
  background: #151820;
  color: #fff;
}

.cost-summary-main span {
  display: block;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, .68);
  font-size: 12px;
}

.cost-summary-main strong {
  display: block;
  font-size: 34px;
  line-height: 1.1;
}

.cost-summary-parts {
  display: grid;
  gap: 9px;
  margin-top: 15px;
}

.cost-summary-parts > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 0;
  border-bottom: 1px solid #eceef2;
  font-size: 13px;
}

.cost-summary-note {
  margin: 18px 0 0;
  color: #7d8390;
  font-size: 13px;
  line-height: 1.55;
}

[hidden] {
  display: none !important;
}

@media (max-width: 900px) {
  .cabinet-tools-grid {
    grid-template-columns: 1fr;
  }

  .cost-grid {
    grid-template-columns: 1fr;
  }

  .cost-card + .cost-card:not([hidden]) {
    grid-column: auto;
  }

  .cost-summary {
    position: static;
  }
}

@media (max-width: 600px) {
  .cabinet-tool-card {
    min-height: auto;
    padding: 22px;
    gap: 16px;
  }

  .cabinet-tool-icon {
    flex-basis: 50px;
    width: 50px;
    height: 50px;
    border-radius: 14px;
    font-size: 22px;
  }

  .cabinet-tool-content h2 {
    font-size: 20px;
  }

  .cost-mode-tabs {
    display: grid;
    width: 100%;
  }

  .cost-mode {
    width: 100%;
  }

  .cost-card {
    padding: 20px;
  }

  .cost-fields,
  .cost-settings-grid {
    grid-template-columns: 1fr;
  }

  .cost-unit-result {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }
}