@import url("foundation.css");

/* ===============================
   Общие стили
   =============================== */
body {
    background-image: linear-gradient(180deg, #ffffff, #fefefe, #eeeeee);
    font-family: 'Helvetica Neue', 'Helvetica', Arial, PT Sans, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}

.text-bold {
  font-weight: bold; /* or a numerical value like 700 */
} 
.text-small {
  font-size: small;
}

.noselect {
            -moz-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
            -o-user-select: none;
            user-select: none;
        }
/* ===============================
   Ссылки
   =============================== */
a {
    line-height: inherit;
    color: #0000FF;
    text-decoration: none;
    cursor: pointer;
}

a:hover,
a:focus {
    color: #FF0000;
}

a:visited {
    color: #669;
    text-decoration: none;
}

a img {
    border: 0;
}

/* ===============================
   Изображения
   =============================== */
.image-radius,
.header-image {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 1rem;
    border-radius: 10px;
    line-height: 0;
}

.image-radius:hover,
.thumbnail:focus {
    border: solid 1px #fefefe;
    border-radius: 10px;
}

.image-flex {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

.thumbnail:hover,
.thumbnail:focus {
    border: solid 4px #fefefe;
    border-radius: 5px;
    transition: box-shadow 200ms ease-out;
    box-shadow: 0 0 8px 2px rgb(53 63 69 / 50%);
}

/* ===============================
   Телефон
   =============================== */
.tel {
    line-height: 1;
    font-weight: bold;
    font-size: 120%;
    color: #a8192f;
}

.tel a {
    line-height: 1;
    font-weight: bold;
    font-size: 120%;
    color: #a8192f;
}

.tel a:hover,
.tel a:focus {
    color: #cc4b37;
    background-color: #fdf6e3;
}
/* только пункты с телефоном */
.header ul li:has(.tel)::marker {
    color: #3adb76;
    text-shadow:
        0 0 3px rgba(58,219,118,0.9),
        0 0 6px rgba(58,219,118,0.7),
        0 0 10px rgba(58,219,118,0.45),
        0 0 16px rgba(58,219,118,0.25);
}

/* ===============================
   Меню
   =============================== */
.menu a {
    font-weight: 500;
    color: #010101;
    font-size: 120%;
}

.menu a:hover,
.menu a:focus {
    background: #1779ba;
    text-decoration: none;
    color: #fefefe;
}

/* Меню текст без ссылок */
.menu .menu-text {
    padding: 0.7rem 1rem;
    font-weight: 500;
    line-height: 1;
    color: #666;
    background: #ddd;
    font-size: 120%;
}

/* ===== DESKTOP ===== */
.dropdown.menu > li.is-active > a,
.dropdown.menu li li.is-active > a {
    font-weight: 500;
    line-height: 1;
    color: #666;
    background-color: #ddd;
}

/* ===== MOBILE ===== */
.vertical.menu > li.active > a,
.vertical.menu li li.active > a {
    font-weight: 500;
    line-height: 1;
    color: #666;
    background-color: #ddd;
}

/* Стрелки dropdown */
.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px;
    content: "";
    border-bottom-width: 0;
    border-color: #ff0000 transparent transparent;
    right: 5px;
    left: auto;
    margin-top: -3px;
}

.dropdown.menu.vertical > li.opens-left > a::after {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px;
    content: "";
    border-left-width: 0;
    border-color: transparent #ff0000 transparent transparent;
    right: auto;
    left: 5px;
}

.dropdown.menu.vertical > li.opens-right > a::after {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px;
    content: "";
    border-right-width: 0;
    border-color: transparent transparent transparent #ff0000;
}

/* ===============================
   Контейнеры и блоки
   =============================== */
.header {
    position: relative;
    padding: 15px 0;
}

.logo {
    display: block;
    margin: 0 auto;
}
.logo.float-left {
  transition: filter .35s ease;
}

.logo.float-left:hover {
  animation: logo-soft-shine .75s ease-out;
}

@keyframes logo-soft-shine {
  0%, 100% {
    filter: brightness(1);
  }

  45% {
    filter: brightness(1.14) drop-shadow(0 0 5px rgba(215, 180, 105, .28));
  }
}

.navtop {
    display: block;
    padding: 10px 0;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    background-image: linear-gradient(180deg, #ffffff, #f1efef, #f1f1f1);
}

.breadcrumb {
    text-align: left;
    position: relative;
    margin-top: 5px;
}

.services {
    position: relative;
    padding: 15px 0 20px 0;
    border-top: 1px solid #eee;
}

.content {
    text-align: left;
    position: relative;
    padding: 0 0 35px 0;
}

.footer {
  background: #f7f7f7;
  margin-top: 3rem;
  padding-top: 3rem;
}

.footer .menu a {
  padding: .4rem 0;
}

.footer sup {
  font-size: .7em;
  opacity: .7;
}

/* ===============================
   Мультиколонки
   =============================== */
.multi-col-2 {  
    column-count: 2;  
    column-width: 150px;  
    column-gap: 30px;  
    column-rule: 1px dotted #ccc;  
}
.multi-col-2 h4 {  
    column-span: all;  
}

.multi-col-4 {  
    column-count: 4;  
    column-width: 150px;  
    column-gap: 30px;  
    column-rule: 1px solid #ddd;  
}
.multi-col-4 h4 {  
    column-span: all;  
}

/* Правая колонка */
.container-ad {
    margin: 0 0 1rem 0;
    padding: 1rem;
    background: #fdf6e3;
    border-radius: 10px;
}

/* ===============================
   Grav Form + Foundation override
   =============================== */
.form-field {
    margin-bottom: 1rem;
}

.form-field > label {
    font-weight: 600;
    display: block;
    margin-bottom: 0.25rem;
}

.form-field input[type="text"],
.form-field input[type="email"],
.form-field textarea,
.form-field input[type="file"] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #cacaca;
    border-radius: 0.25rem;
    font-size: 1rem;
    background: #fff;
    cursor: pointer;
}

.form-field textarea {
    min-height: 120px;
}

.form-field input:focus,
.form-field textarea:focus {
    border-color: #1779ba;
    box-shadow: 0 0 5px rgba(23,121,186,.5);
    outline: none;
}

.form-field input[type="radio"] {
    margin-right: 0.25rem;
}

.form-field .form-error {
    color: #cc4b37;
    font-size: 0.85rem;
    margin-top: 0.25rem;
    display: block;
}

.form-field.error input,
.form-field.error textarea {
    border-color: #cc4b37;
    background-color: #fef2f2;
}

form button[type="submit"],
form input[type="submit"] {
    background-color: #1779ba;
    color: #fff;
    padding: 0.75rem 1.5rem;
    border: none;
    cursor: pointer;
}

form button[type="submit"]:hover,
form input[type="submit"]:hover {
    background-color: #14679e;
}

.form-field .honeypot {
    display: none !important;
}

.form-field .help-text {
    font-size: 0.8rem;
    color: #6f6f6f;
    margin-top: 0.25rem;
}

/* Required fields */
input[required],
textarea[required] {
    border-left: 4px solid #e6e6e6;
}

input[required]:focus,
textarea[required]:focus {
    border-left-color: #28a745;
}

.required {
    color: #d9534f;
    margin-left: 4px;
    font-weight: 600;
}