/* ==========================================================================
   UIKIT-THEME.CSS
   Переопределение СТАНДАРТНЫХ стилей/классов UIkit3 под токены проекта.
   Здесь — только то, что относится к базовым и наиболее часто
   кастомизируемым сущностям UIkit (Base, Typography, Link, Navbar,
   Container, Button). Подключать ПОСЛЕ uikit.min.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Дизайн-токены проекта (основа темы, на них опираются переопределения ниже)
   -------------------------------------------------------------------------- */
:root{
  --color-text-dark:     #1D1D1D;
  --color-text-white:    #ffffff;
  --color-primary:       #12233D;
  --color-light:         #F0F6FF;
  --color-soft:          #E4ECF7;
  --color-element:       #AACCFF;
  --color-accent:        #609FFF;
  --color-hover:         #548CE1;
  --color-blue:          #003F9F;
  --color-text-light:    #8C95A3;
  --color-text-meta:     #9FA7B3;
  --color-element-light: #C4CDD9;

  --font-main: 'Raleway', sans-serif;
  --font-num:  'Inter', sans-serif;

  --container-max: 1440px;
}

/* --------------------------------------------------------------------------
   Base — переопределение html/body, которые задаёт UIkit Base-компонент
   18px десктоп / 17px планшет / 16px мобильный, line-height 1.4em,
   вес Regular (400), межсимвольный интервал 0.03em (=3%)
   -------------------------------------------------------------------------- */
html, body{
  font-family: var(--font-main);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.4em;
  letter-spacing: 0.03em;
  color: var(--color-soft);
  background: var(--color-primary);
  overflow-x: hidden;
}
body{min-height: 100vh;}
@media (min-width: 640px) and (max-width: 959px){
  html, body{ font-size: 17px; }
}
@media (max-width: 639px){
  html, body{ font-size: 16px; }
}

html {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

.font-num{
  font-family: var(--font-num)!important;
}

/*uk-text-muted — приглушенный серый (для второстепенного текста, подписей).
uk-text-secondary — темно-серый (для заголовков или важного текста).
uk-text-success — зеленый (для сообщений об успехе).
uk-text-warning — оранжевый (для предупреждений).
uk-text-danger — красный (для ошибок и деструктивных действий).*/
.uk-text-primary{color: var(--color-accent);}
.uk-text-light{color: var(--color-light);}
.uk-text-black{color: var(--color-text-dark);}
.uk-text-dark{color: var(--color-primary);}
.uk-text-meta{color: var(--color-text-meta);}
.uk-text-white{color: var(--color-text-white);}

.uk-background-default{background-color: var(--color-light);font-weight: 400;} 
.uk-background-soft{background-color: var(--color-soft);font-weight: 400;} 
.uk-background-white{background-color: var(--color-text-white);font-weight: 400;}
/*.uk-background-muted{background-color: var(--color-text-soft);font-weight: 400;}*/
.uk-background-primary{background-color: var(--color-primary);}
.uk-background-secondary{background-color: var(--color-accent);}

.uk-relative{
  position: relative;
}
.uk-box-shadow{
  box-shadow: 0 10px 20px rgba(0, 0, 0, .03);
}
.uk-text-xsmall{
  font-size: 0.75rem;
}
.uk-lh-small{
  line-height: 1.2em;
}
.uk-lh-medium{
  line-height: 1.4em;
}
.uk-lt-medium{
  letter-spacing: 0.08em;
}

.uk-radius{border-radius: 6px;}
.uk-radius1{border-radius: 10px;}
.uk-radius2{border-radius: 20px;}
@media (max-width: 639px){
  .uk-radius2{border-radius: 10px;}
}

.uk-grid-xsmall{
  margin-left: -5px;
}
.uk-grid-xsmall > *{
  padding-left: 5px;
}
.uk-grid + .uk-grid-xsmall,
.uk-grid-xsmall > .uk-grid-margin{
  margin-top: 5px;
}

.uk-text-bold{font-weight: 600!important;}
.uk-text-medium{font-weight: 500!important;}
.uk-text-normal{font-weight: 400!important;}
.uk-text-light{font-weight: 300!important;}
/* --------------------------------------------------------------------------
   Typography — заголовки h1–h6 / .uk-h1–.uk-h6
   -------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6{
  font-family: var(--font-main);
  color: inherit;
  font-weight: 600;
  letter-spacing: 0.03em;
}

h1, .uk-h1{
  font-size: 62px;
  line-height: 0.9em;
}
@media (min-width: 640px) and (max-width: 959px){
  h1, .uk-h1{ font-size: 47px; }
}
@media (max-width: 639px){
  h1, .uk-h1{ font-size: 32px; }
}

h2, .uk-h2{
  font-size: 50px;
  line-height: 1em;
}
@media (min-width: 640px) and (max-width: 959px){
  h2, .uk-h2{ font-size: 38px; }
}
@media (max-width: 639px){
  h2, .uk-h2{ font-size: 30px; }
}

h3, .uk-h3{
  font-size: 36px;
  line-height: 1em;
  font-weight: 500;
}
@media (min-width: 640px) and (max-width: 959px){
  h3, .uk-h3{ font-size: 32px; }
}
@media (max-width: 639px){
  h3, .uk-h3{ font-size: 28px; }
}


h4, .uk-h4{
  font-size: 22px;
  line-height: 1.2em;
  font-weight: 400;
}
@media (min-width: 640px) and (max-width: 959px){
  h4, .uk-h4{ font-size: 21px; }
}
@media (max-width: 639px){
  h4, .uk-h4{ font-size: 20px; }
}

h5, .uk-h5{
  font-size: 20px;
  line-height: 1.2em;
  font-weight: 400;
}
@media (min-width: 640px) and (max-width: 959px){
  h5, .uk-h5{ font-size: 19px; }
}
@media (max-width: 639px){
  h5, .uk-h5{ font-size: 17px; }
}

.uk-text-meta {
  color: var(--color-text-meta);
}

/* --------------------------------------------------------------------------
   Link — базовые ссылки и .uk-link
   -------------------------------------------------------------------------- */
a,
.uk-link,
.uk-link-text,
.uk-link-toggle,
.uk-link-heading,
a:visited,
.uk-link:visited,
.uk-link-text:visited,
.uk-link-toggle:visited,
.uk-link-heading:visited,
a:hover,
a:focus,
.uk-link:hover,
.uk-link:focus,
.uk-link-text:hover,
.uk-link-text:focus,
.uk-link-toggle:hover,
.uk-link-toggle:focus,
.uk-link-heading:hover,
.uk-link-heading:focus{
  color: var(--color-text-white);
  text-decoration: none;
  transition: color .25s ease;
}

a:hover, a:focus,
.uk-link:hover, .uk-link:focus,
.uk-link-text:hover, .uk-link-text:focus,
.uk-link-toggle:hover, .uk-link-toggle:focus,
.uk-link-heading:hover, .uk-link-heading:focus{
  color: var(--color-accent);
}

/* --------------------------------------------------------------------------
   Navbar — .uk-navbar-nav (стандартное меню UIkit)
   -------------------------------------------------------------------------- */
.uk-navbar-nav > li > a{
  font-family: var(--font-main);
  font-weight: 500; /* medium */
  line-height: 1em;
  color: var(--color-text-white);
  text-decoration: none;
}
.uk-navbar-nav > li > a:hover,
.uk-navbar-nav > li > a:focus{
  color: var(--color-element);
}

.uk-background-white .uk-accordion-title{
  color: var(--color-text-dark);
}
.uk-open .uk-accordion-title,
.uk-accordion-title:hover {
    color: var(--color-hover);
}

/* --------------------------------------------------------------------------
   Container — ширина контента проекта
   -------------------------------------------------------------------------- */
.uk-container{
  max-width: var(--container-max);
}

/* --------------------------------------------------------------------------
   Button — .uk-button-default / .uk-button-primary
   -------------------------------------------------------------------------- */
.uk-button{
  font-family: var(--font-main);
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1.1em;
  border-radius: 5px;
  text-transform: none;
  padding: 16px 36px;
  box-shadow: 0 0 0 rgb(from var(--color-hover) r g b / 0);
}
.uk-button-primary{
  background: var(--color-accent);
  color: var(--color-text-white);
}
.uk-button-primary:hover,
.uk-button-primary:focus{
  background: var(--color-hover);
  color: var(--color-text-white);
  box-shadow: 0 0 15px rgb(from var(--color-hover) r g b / 0.15);
}
.uk-button-default{
  background: transparent;
  color: var(--color-element);
  border-color: var(--color-element);
}
.uk-text-black .uk-button-default{
  background: transparent;
  color: var(--color-hover);
  border-color: var(--color-hover);
}
.uk-button-default:hover,
.uk-button-default:focus{
  border-color: var(--color-hover);
  background: var(--color-hover);
  color: var(--color-text-white);
  box-shadow: 0 0 15px rgb(from var(--color-hover) r g b / 0.15);
}
@media (max-width: 639px){
  form .uk-button{
    width: 100%;
  }
}

/* --------------------------------------------------------------------------
   Form — поля формы UIkit
   -------------------------------------------------------------------------- */
.uk-input,
.uk-textarea{
  font-family: var(--font-main);
  font-size: .875rem;
  color: var(--color-text-dark);
  font-weight: 400;
  letter-spacing: 0.03em;
  line-height: 1.1em;
  border-radius: 5px;
  text-transform: none;
  min-height: 51px;
  padding: 16px 20px;
  background: var(--color-light);
  border-color: var(--color-element-light);
}

/* --------------------------------------------------------------------------
   Table — таблица технических характеристик
   -------------------------------------------------------------------------- */
.specs-table-frame{
  border: 1px solid var(--color-element-light);
}

.specs-table{
  border-collapse: collapse;
}

.specs-table th,
.specs-table td{
  border-left: 1px solid var(--color-element-light);
  padding: 10px 12px;
}

.specs-table th:first-child,
.specs-table td:first-child{
  border-left: 0;
}

.specs-table thead th{
  background: var(--color-soft);
  color: inherit; 
  font-weight: 400;
  text-transform: none;
}

.specs-table.uk-table-divider > tbody > tr:not(:first-child){
  border-top: 1px solid var(--color-element-light);
}

.specs-table.uk-table-divider > tbody > tr:first-child{
  border-top: 1px solid var(--color-element-light);
}

hr{
  border-top: 1px solid var(--color-element-light);
}

.uk-border-top{
  border-top: 1px solid rgba(140, 149, 163, 0.5);
}
.uk-border-bottom{
  border-bottom: 1px solid rgba(140, 149, 163, 0.5);
}

.gap{gap:30px;}
.gap-large{gap:40px;}
.gap-medium{gap:20px;}
.gap-small{gap:15px;}

@media (max-width: 659px){
  .gap,.gap\@s{gap:20px;}
  .gap-large,.gap-large\@s{gap:30px;}
  .gap-medium,.gap-medium\@s{gap:15px;}
  .gap-small,.gap-small\@s{gap:15px;}
}
@media (max-width: 959px){
  .gap,.gap\@m{gap:20px;}
  .gap-large,.gap-large\@m{gap:30px;}
  .gap-medium,.gap-medium\@m{gap:15px;}
  .gap-small,.gap-small\@m{gap:15px;}
}


/* ============================================
   СБРОС ОТСТУПОВ ТОЛЬКО ДЛЯ МОБИЛЬНЫХ (< 640px)
   Суффикс: @ns (not-small / only mobile)
   ============================================ */
@media (max-width: 639px) {
    /* MARGIN */
    .uk-margin-remove\@ns { margin: 0 !important; }
    .uk-margin-remove-top\@ns { margin-top: 0 !important; }
    .uk-margin-remove-bottom\@ns { margin-bottom: 0 !important; }
    .uk-margin-remove-vertical\@ns { margin-top: 0 !important; margin-bottom: 0 !important; }
    .uk-margin-remove-horizontal\@ns { margin-left: 0 !important; margin-right: 0 !important; }

    /* PADDING */
    .uk-padding-remove\@ns { padding: 0 !important; }
    .uk-padding-remove-top\@ns { padding-top: 0 !important; }
    .uk-padding-remove-bottom\@ns { padding-bottom: 0 !important; }
    .uk-padding-remove-vertical\@ns { padding-top: 0 !important; padding-bottom: 0 !important; }
    .uk-padding-remove-horizontal\@ns { padding-left: 0 !important; padding-right: 0 !important; }
}

/* ============================================
   СБРОС ОТСТУПОВ ТОЛЬКО ДЛЯ ПЛАНШЕТОВ (640px - 959px)
   Суффикс: @nm (not-medium / only tablet)
   ============================================ */
@media (min-width: 640px) and (max-width: 959px) {
    /* MARGIN */
    .uk-margin-remove\@nm { margin: 0 !important; }
    .uk-margin-remove-top\@nm { margin-top: 0 !important; }
    .uk-margin-remove-bottom\@nm { margin-bottom: 0 !important; }
    .uk-margin-remove-vertical\@nm { margin-top: 0 !important; margin-bottom: 0 !important; }
    .uk-margin-remove-horizontal\@nm { margin-left: 0 !important; margin-right: 0 !important; }

    /* PADDING */
    .uk-padding-remove\@nm { padding: 0 !important; }
    .uk-padding-remove-top\@nm { padding-top: 0 !important; }
    .uk-padding-remove-bottom\@nm { padding-bottom: 0 !important; }
    .uk-padding-remove-vertical\@nm { padding-top: 0 !important; padding-bottom: 0 !important; }
    .uk-padding-remove-horizontal\@nm { padding-left: 0 !important; padding-right: 0 !important; }
}
/* ============================================
   СБРОС ОТСТУПОВ ТОЛЬКО ДЛЯ ПЛАНШЕТОВ (960px - 1199px)
   Суффикс: @nl (not-large / only tablet)
   ============================================ */
@media (min-width: 960px) and (max-width: 1199px) {
    /* MARGIN */
    .uk-margin-remove\@nl { margin: 0 !important; }
    .uk-margin-remove-top\@nl { margin-top: 0 !important; }
    .uk-margin-remove-bottom\@nl { margin-bottom: 0 !important; }
    .uk-margin-remove-vertical\@nl { margin-top: 0 !important; margin-bottom: 0 !important; }
    .uk-margin-remove-horizontal\@nl { margin-left: 0 !important; margin-right: 0 !important; }

    /* PADDING */
    .uk-padding-remove\@nl { padding: 0 !important; }
    .uk-padding-remove-top\@nl { padding-top: 0 !important; }
    .uk-padding-remove-bottom\@nl { padding-bottom: 0 !important; }
    .uk-padding-remove-vertical\@nl { padding-top: 0 !important; padding-bottom: 0 !important; }
    .uk-padding-remove-horizontal\@nl { padding-left: 0 !important; padding-right: 0 !important; }
}

.uk-margin-remove { margin: 0 !important; }
@media (min-width: 640px) {
  .uk-margin-remove\@s{ margin: 0 !important; }
}
@media (min-width: 960px) {
  .uk-margin-remove\@m{ margin: 0 !important; }
}
@media (min-width: 1200px) {
  .uk-margin-remove\@l{ margin: 0 !important; }
}

/* ============================================
   UIKIT 3 - 12 COLUMN GRID SYSTEM
   ============================================ */

/* ============================================
   МОБИЛЬНЫЕ (по умолчанию, все экраны)
   ============================================ */
.uk-width-1-12  { width: 8.33333%; }
.uk-width-2-12  { width: 16.66667%; }
.uk-width-3-12  { width: 25%; }
.uk-width-4-12  { width: 33.33333%; }
.uk-width-5-12  { width: 41.66667%; }
.uk-width-6-12  { width: 50%; }
.uk-width-7-12  { width: 58.33333%; }
.uk-width-8-12  { width: 66.66667%; }
.uk-width-9-12  { width: 75%; }
.uk-width-10-12 { width: 83.33333%; }
.uk-width-11-12 { width: 91.66667%; }
.uk-width-12-12 { width: 100%; }

/* ============================================
   @s - Small (≥ 640px)
   ============================================ */
@media (min-width: 640px) {
    .uk-width-1-12\@s  { width: 8.33333%; }
    .uk-width-2-12\@s  { width: 16.66667%; }
    .uk-width-3-12\@s  { width: 25%; }
    .uk-width-4-12\@s  { width: 33.33333%; }
    .uk-width-5-12\@s  { width: 41.66667%; }
    .uk-width-6-12\@s  { width: 50%; }
    .uk-width-7-12\@s  { width: 58.33333%; }
    .uk-width-8-12\@s  { width: 66.66667%; }
    .uk-width-9-12\@s  { width: 75%; }
    .uk-width-10-12\@s { width: 83.33333%; }
    .uk-width-11-12\@s { width: 91.66667%; }
    .uk-width-12-12\@s { width: 100%; }
}

/* ============================================
   @m - Medium (≥ 960px)
   ============================================ */
@media (min-width: 960px) {
    .uk-width-1-12\@m  { width: 8.33333%; }
    .uk-width-2-12\@m  { width: 16.66667%; }
    .uk-width-3-12\@m  { width: 25%; }
    .uk-width-4-12\@m  { width: 33.33333%; }
    .uk-width-5-12\@m  { width: 41.66667%; }
    .uk-width-6-12\@m  { width: 50%; }
    .uk-width-7-12\@m  { width: 58.33333%; }
    .uk-width-8-12\@m  { width: 66.66667%; }
    .uk-width-9-12\@m  { width: 75%; }
    .uk-width-10-12\@m { width: 83.33333%; }
    .uk-width-11-12\@m { width: 91.66667%; }
    .uk-width-12-12\@m { width: 100%; }
}

/* ============================================
   @l - Large (≥ 1200px)
   ============================================ */
@media (min-width: 1200px) {
    .uk-width-1-12\@l  { width: 8.33333%; }
    .uk-width-2-12\@l  { width: 16.66667%; }
    .uk-width-3-12\@l  { width: 25%; }
    .uk-width-4-12\@l  { width: 33.33333%; }
    .uk-width-5-12\@l  { width: 41.66667%; }
    .uk-width-6-12\@l  { width: 50%; }
    .uk-width-7-12\@l  { width: 58.33333%; }
    .uk-width-8-12\@l  { width: 66.66667%; }
    .uk-width-9-12\@l  { width: 75%; }
    .uk-width-10-12\@l { width: 83.33333%; }
    .uk-width-11-12\@l { width: 91.66667%; }
    .uk-width-12-12\@l { width: 100%; }
}

/* ============================================
   @xl - Extra Large (≥ 1600px)
   ============================================ */
@media (min-width: 1600px) {
    .uk-width-1-12\@xl  { width: 8.33333%; }
    .uk-width-2-12\@xl  { width: 16.66667%; }
    .uk-width-3-12\@xl  { width: 25%; }
    .uk-width-4-12\@xl  { width: 33.33333%; }
    .uk-width-5-12\@xl  { width: 41.66667%; }
    .uk-width-6-12\@xl  { width: 50%; }
    .uk-width-7-12\@xl  { width: 58.33333%; }
    .uk-width-8-12\@xl  { width: 66.66667%; }
    .uk-width-9-12\@xl  { width: 75%; }
    .uk-width-10-12\@xl { width: 83.33333%; }
    .uk-width-11-12\@xl { width: 91.66667%; }
    .uk-width-12-12\@xl { width: 100%; }
}

/* ============================================
   OFFSET CLASSES (сдвиг колонок)
   ============================================ */

/* Mobile */
.uk-offset-1-12  { margin-left: 8.33333%; }
.uk-offset-2-12  { margin-left: 16.66667%; }
.uk-offset-3-12  { margin-left: 25%; }
.uk-offset-4-12  { margin-left: 33.33333%; }
.uk-offset-5-12  { margin-left: 41.66667%; }
.uk-offset-6-12  { margin-left: 50%; }
.uk-offset-7-12  { margin-left: 58.33333%; }
.uk-offset-8-12  { margin-left: 66.66667%; }
.uk-offset-9-12  { margin-left: 75%; }
.uk-offset-10-12 { margin-left: 83.33333%; }
.uk-offset-11-12 { margin-left: 91.66667%; }

/* @s */
@media (min-width: 640px) {
    .uk-offset-1-12\@s  { margin-left: 8.33333%; }
    .uk-offset-2-12\@s  { margin-left: 16.66667%; }
    .uk-offset-3-12\@s  { margin-left: 25%; }
    .uk-offset-4-12\@s  { margin-left: 33.33333%; }
    .uk-offset-5-12\@s  { margin-left: 41.66667%; }
    .uk-offset-6-12\@s  { margin-left: 50%; }
    .uk-offset-7-12\@s  { margin-left: 58.33333%; }
    .uk-offset-8-12\@s  { margin-left: 66.66667%; }
    .uk-offset-9-12\@s  { margin-left: 75%; }
    .uk-offset-10-12\@s { margin-left: 83.33333%; }
    .uk-offset-11-12\@s { margin-left: 91.66667%; }
}

/* @m */
@media (min-width: 960px) {
    .uk-offset-1-12\@m  { margin-left: 8.33333%; }
    .uk-offset-2-12\@m  { margin-left: 16.66667%; }
    .uk-offset-3-12\@m  { margin-left: 25%; }
    .uk-offset-4-12\@m  { margin-left: 33.33333%; }
    .uk-offset-5-12\@m  { margin-left: 41.66667%; }
    .uk-offset-6-12\@m  { margin-left: 50%; }
    .uk-offset-7-12\@m  { margin-left: 58.33333%; }
    .uk-offset-8-12\@m  { margin-left: 66.66667%; }
    .uk-offset-9-12\@m  { margin-left: 75%; }
    .uk-offset-10-12\@m { margin-left: 83.33333%; }
    .uk-offset-11-12\@m { margin-left: 91.66667%; }
}

/* @l */
@media (min-width: 1200px) {
    .uk-offset-1-12\@l  { margin-left: 8.33333%; }
    .uk-offset-2-12\@l  { margin-left: 16.66667%; }
    .uk-offset-3-12\@l  { margin-left: 25%; }
    .uk-offset-4-12\@l  { margin-left: 33.33333%; }
    .uk-offset-5-12\@l  { margin-left: 41.66667%; }
    .uk-offset-6-12\@l  { margin-left: 50%; }
    .uk-offset-7-12\@l  { margin-left: 58.33333%; }
    .uk-offset-8-12\@l  { margin-left: 66.66667%; }
    .uk-offset-9-12\@l  { margin-left: 75%; }
    .uk-offset-10-12\@l { margin-left: 83.33333%; }
    .uk-offset-11-12\@l { margin-left: 91.66667%; }
}

/* ============================================
   ORDER CLASSES (порядок колонок)
   ============================================ */
@media (min-width: 960px) {
    .uk-order-1\@m  { order: 1; }
    .uk-order-2\@m  { order: 2; }
    .uk-order-3\@m  { order: 3; }
    .uk-order-4\@m  { order: 4; }
    .uk-order-5\@m  { order: 5; }
    .uk-order-6\@m  { order: 6; }
    .uk-order-7\@m  { order: 7; }
    .uk-order-8\@m  { order: 8; }
    .uk-order-9\@m  { order: 9; }
    .uk-order-10\@m { order: 10; }
    .uk-order-11\@m { order: 11; }
    .uk-order-12\@m { order: 12; }
}
@media (max-width: 639px){
  .uk-width-small{
    width: 115px;
  }
  .uk-grid-column-standart\@s>*, .uk-grid-standart\@s>* {
    padding-left: 15px;
  }
  .uk-grid-column-standart\@s, .uk-grid-standart\@s {
    margin-left: -15px;
  }
  *+.uk-grid-margin-standart\@s, .uk-grid+.uk-grid-standart\@s, .uk-grid+.uk-grid-row-standart\@s, .uk-grid-standart\@s>.uk-grid-margin, .uk-grid-row-standart\@s>.uk-grid-margin {
    margin-top: 15px;
  }
}
 
/* @s */
@media (min-width: 640px) {
    .uk-position-absolute\@s {
        position: absolute;
    }
}