:root {
  color-scheme: light;
  --ranel-blue: #075b9d;
  --ranel-blue-dark: #07365f;
  --ranel-ink: #1d2b3a;
  --ranel-muted: #607080;
  --ranel-border: #e2e8ef;
  --ranel-surface: #ffffff;
  --ranel-background: #f3f6f9;
}

* {
  box-sizing: border-box;
}

html,
body {
  background: var(--ranel-background);
}

body {
  color: var(--ranel-ink);
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
}

p {
  line-height: 1.7;
}

a {
  color: var(--ranel-blue);
  transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

a:hover {
  color: var(--ranel-blue-dark);
}

.top-aside,
header,
.banner,
.banner-slider,
.small_banner,
#content-container,
.footer-callout,
footer {
  min-width: 0;
}

.top-aside,
.banner-slider,
.small_banner,
footer {
  background: var(--ranel-blue-dark);
}

.top-aside {
  padding: 9px 0;
  background: #062d4d;
}

.top-aside .sidebar-widget {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.top-aside *,
.top-aside a {
  color: #eaf4fc;
  font-size: 13px;
  text-shadow: none;
}

.top-aside a:hover {
  color: #ffffff;
}

.top-aside ul li a {
  background: none;
}

.center-wrap,
#main-wrap {
  width: calc(100% - 48px);
  max-width: 1120px;
}

header {
  padding: 16px 0;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(18, 45, 70, 0.08);
}

.companyIdentity {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.companyIdentity img {
  width: 162px;
  max-width: 100%;
  height: auto;
  margin: 0;
}

header nav {
  position: static;
  margin: 0;
}

header nav ul {
  display: flex;
  align-items: center;
  gap: 8px;
}

nav > ul > li + li {
  margin-left: 0;
}

header nav a {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  padding: 0 16px;
  border-radius: 8px;
  color: #34485c;
  font-size: 15px;
  font-weight: 600;
}

header nav a:hover,
header nav a:focus-visible {
  color: var(--ranel-blue);
  background: #edf5fb;
}

.banner-slider {
  overflow: hidden;
  background:
    radial-gradient(ellipse at 82% 18%, rgba(52, 157, 218, 0.46), transparent 38%),
    linear-gradient(120deg, #07365f 0%, #075b9d 58%, #0879b8 100%);
}

.banner-slider .center-wrap {
  padding: 54px 0;
}

.banner-slider h1,
.banner-slider h2,
.banner-slider h3,
.banner-slider h4,
.banner-slider h5,
.banner-slider h6 {
  margin: 0 0 18px;
  color: #ffffff;
  font-size: clamp(22px, 2vw, 26px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.15;
}

.banner-slider p {
  max-width: 560px;
  color: #e4f0fa;
  font-size: 17px;
}

.banner-slider .home-slider-post {
  display: grid;
  grid-template-areas: "content image";
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  align-items: center;
  column-gap: 2%;
}

.banner-slider .home-slider-post > .one_half:first-child {
  grid-area: content;
}

.banner-slider .home-slider-post > .one_half + .one_half {
  grid-area: image;
}

.banner-slider .home-slider-post > .one_half {
  float: none;
  width: auto;
  margin: 0;
  padding: 0;
}

.banner-slider .one_half + .one_half {
  display: flex;
  justify-content: flex-end;
  transform: translateX(30px);
}

.banner-slider .img-frame.full-half {
  position: relative;
  width: 100%;
  max-width: none;
  aspect-ratio: 2.1 / 1;
  margin: 0 0 0 auto;
  padding: 4px;
  border: 0;
  border-radius: 14px;
  background: #dce7ed;
  box-shadow: 0 18px 38px rgba(0, 22, 43, 0.34);
}

.banner-slider .img-frame.full-half img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
  object-position: center;
  border-radius: 8px;
  transform: scale(1.08, 1.12);
}

.banner-slider .img-frame {
  overflow: hidden;
}

.banner-slider .img-frame img {
  display: block;
  width: 100%;
  height: auto;
}

.small_banner {
  padding: 28px 0;
  background:
    radial-gradient(ellipse at 85% 15%, rgba(52, 157, 218, 0.34), transparent 40%),
    linear-gradient(110deg, #07365f, #075b9d);
}

.small_banner .page-banner-heading {
  display: block;
  margin: 0;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.025em;
}

.small_banner .page-banner-description {
  position: static;
  width: auto;
  margin: 4px 0 0;
  color: #dcecf8;
  font-size: 15px;
  text-align: left;
}

div.breadcrumbs {
  margin: 12px 0 0 -4px;
  color: #dcecf8;
  font-size: 13px;
}

.breadcrumbs > a {
  color: #ffffff;
}

#content-container {
  background: var(--ranel-background);
}

#main-wrap {
  padding: 48px 0 56px;
}

#main-wrap h1,
#main-wrap h2,
#main-wrap h3,
#main-wrap h4,
#main-wrap h5,
#main-wrap h6 {
  color: var(--ranel-ink);
  font-weight: 700;
  letter-spacing: -0.02em;
}

#main-wrap h4 {
  margin-bottom: 16px;
  font-size: 25px;
}

#main-wrap p {
  color: var(--ranel-muted);
}

.home-vertical-callout,
.home-vertical-sidebar,
.sidebar-widget,
.large-callout,
.contact-panel,
#contact,
.subnav {
  border: 1px solid var(--ranel-border);
  border-radius: 14px;
  background: var(--ranel-surface);
  box-shadow: 0 8px 26px rgba(22, 46, 70, 0.06);
}

.home-vertical-callout {
  margin-bottom: 18px;
  padding: 20px;
}

.home-vertical-callout .img-frame.full-third-short {
  width: 100%;
  max-width: 300px;
  height: auto;
  overflow: hidden;
  background: none;
  border: 0;
  border-radius: 10px;
}

.home-vertical-callout .img-frame.full-third-short img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  border-radius: inherit;
}

.home-vertical-callout h5 {
  margin: 0 0 8px;
  font-size: 19px;
}

.home-vertical-callout h5 a {
  color: var(--ranel-ink);
  text-decoration: none;
}

.home-vertical-callout h5 a:hover {
  color: var(--ranel-blue);
}

.brand-logos img {
  display: inline-block;
  width: 110px;
  height: 74px;
  margin: 0 10px 12px 0;
  padding: 10px;
  border: 1px solid var(--ranel-border);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(22, 46, 70, 0.06);
  object-fit: contain;
  vertical-align: middle;
}

.home-vertical-sidebar {
  padding: 24px;
}

.home-vertical-sidebar > * {
  margin-left: 0 !important;
}

.home-vertical-sidebar .recent-post-widget-title {
  padding-right: 0 !important;
  text-align: left !important;
}

.home-vertical-sidebar input[type="text"],
.home-vertical-sidebar input[type="password"] {
  display: block;
  width: 100% !important;
  max-width: 100%;
  margin: 7px 0 0;
  padding-right: 12px !important;
  padding-left: 12px !important;
  font-weight: 400 !important;
  font-size: 15px !important;
}

.home-vertical-sidebar .sidebar-widget {
  margin-bottom: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
}

.widget-auxheading {
  margin-bottom: 18px;
  color: var(--ranel-ink);
  font-size: 20px;
  font-weight: 700;
}

.page_content,
.page_content_right {
  width: calc(100% - 320px);
}

.sidebar {
  width: 280px;
  min-height: 0;
  background: none;
}

div + .sidebar {
  margin-left: calc(100% - 280px);
  background: none;
}

.sidebar-widget,
.large-callout,
#contact,
.subnav {
  padding: 24px;
}

.contact-panel {
  margin-bottom: 20px;
  padding: 24px;
}

.contact-panel .large-callout,
.contact-panel #contact {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.contact-panel .large-callout {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--ranel-border);
}

.contact-panel .large-callout h2 {
  margin: 0 0 8px;
  color: var(--ranel-ink);
  font-size: clamp(24px, 3vw, 30px);
  line-height: 1.2;
}

.contact-panel .large-callout p {
  margin: 0;
}

.right-sidebar .contact_details_wrap {
  background: transparent;
  box-shadow: none;
}

.catalog-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  width: 100%;
}

.catalog-product-card {
  width: auto;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--ranel-border);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 5px 16px rgba(22, 46, 70, 0.06);
  font-size: 15px;
}

.catalog-product-image {
  display: flex;
  height: 210px;
  align-items: center;
  justify-content: center;
  padding: 14px;
  background: #ffffff;
}

.catalog-product-image img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  object-fit: contain;
}

.catalog-product-info {
  padding: 16px;
  border-top: 1px solid var(--ranel-border);
}

.catalog-product-reference a {
  color: var(--ranel-blue);
  font-size: 15px;
  text-decoration: none;
}

.catalog-product-description {
  min-height: 3.2em;
  margin: 8px 0 14px;
  color: var(--ranel-ink);
  line-height: 1.55;
}

.catalog-product-price {
  margin: 0;
  color: var(--ranel-ink);
}

.catalog-product-price span {
  display: block;
  color: var(--ranel-muted);
  font-size: 11px;
}

.catalog-load-more {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  text-align: center;
}

.catalog-load-more-button {
  min-height: 44px;
  padding: 9px 18px;
  border: 1px solid #cbd7e1;
  border-radius: 8px;
  background: #ffffff;
  color: var(--ranel-blue);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.catalog-load-more-button:hover,
.catalog-load-more-button:focus-visible {
  border-color: var(--ranel-blue);
  background: #edf5fb;
}

.catalog-load-more-button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.catalog-load-more-status {
  color: var(--ranel-muted);
  font-size: 14px;
}

.product-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 18px;
  width: 100%;
}

.product-gallery-image {
  display: flex;
  min-height: 220px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 14px;
  border: 1px solid var(--ranel-border);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 5px 16px rgba(22, 46, 70, 0.06);
}

.product-gallery-image img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: 280px;
  margin: 0;
  object-fit: contain;
}

.product-back-link {
  display: inline-block;
  margin-top: 24px;
  color: var(--ranel-muted);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.product-back-link:hover,
.product-back-link:focus-visible {
  color: var(--ranel-blue);
  text-decoration: underline;
}

.sidebar .subnav > ul {
  margin-left: 0 !important;
}

.sidebar .subnav li {
  border-color: var(--ranel-border);
}

.subnav_cont #fcatalogo > ul > li + li {
  border: 0 !important;
}

.sidebar .subnav li:first-child {
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ranel-border);
}

.sidebar .subnav li:first-child a,
.sidebar .subnav .current_subpage a,
.sidebar .subnav .current_subpage a:hover {
  min-height: 0;
  padding: 2px 0 2px 12px;
  border-left: 3px solid var(--ranel-blue);
  border-radius: 0;
  background: transparent !important;
  background-image: none !important;
  color: var(--ranel-ink) !important;
  font-size: 18px;
  line-height: 1.4;
  text-shadow: none;
}

.subnav_cont #fcatalogo select,
.subnav_cont #fcatalogo input[type="text"] {
  display: block;
  width: 100% !important;
  max-width: 100%;
  font-family: inherit !important;
  font-size: 15px !important;
}

#fcatalogo input[type="text"] {
  padding-right: 12px !important;
  padding-left: 12px !important;
}

#content-container input,
#content-container textarea,
#content-container select {
  border: 1px solid #d5dee7;
  border-radius: 8px;
  background-color: #ffffff;
  box-shadow: none;
  color: var(--ranel-ink);
  font: inherit;
}

form input:not([type]),
form input[type="text"],
form input[type="password"],
form input[type="email"],
form input[type="search"],
form input[type="tel"],
form input[type="url"],
form input[type="number"],
form textarea {
  padding-right: 12px;
  padding-left: 12px;
}

#content-container input[type="text"],
#content-container input[type="password"],
#content-container textarea,
#content-container select {
  min-height: 48px;
  padding: 11px 13px;
}

#content-container input[type="text"]:focus,
#content-container input[type="password"]:focus,
#content-container textarea:focus,
#content-container select:focus {
  border-color: #4194cb;
  outline: 3px solid rgba(7, 91, 157, 0.14);
}

#content-container .tt-form-submit,
#content-container input[type="submit"],
#content-container input[type="button"],
#content-container input[type="reset"],
a.button,
a.button.large {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 11px 20px;
  border: 0;
  border-radius: 9px;
  background: var(--ranel-blue);
  box-shadow: 0 5px 14px rgba(7, 91, 157, 0.2);
  color: #ffffff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  cursor: pointer;
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

#content-container .tt-form-submit:hover,
#content-container input[type="submit"]:hover,
#content-container input[type="button"]:hover,
#content-container input[type="reset"]:hover,
a.button:hover {
  background: var(--ranel-blue-dark);
  box-shadow: 0 7px 18px rgba(7, 54, 95, 0.24);
  color: #ffffff;
  transform: translateY(-1px);
}

#content-container input[type="submit"],
#content-container input[type="button"],
#content-container input[type="reset"] {
  min-width: 112px;
  margin: 4px 8px 4px 0;
}

#fcatalogo > input[type="submit"],
#fcatalogo > input[type="button"] {
  width: calc(50% - 10px);
  min-width: 0;
  padding-right: 8px;
  padding-left: 8px;
}

#fcatalogo > input[type="button"] {
  margin-right: 0;
}

a.button.large {
  min-height: 52px;
  padding: 13px 22px;
}

.footer-callout {
  padding: 32px 0;
  background: #eaf1f7;
}

.footer-callout-content {
  width: 68%;
}

.footer-callout-content p {
  color: var(--ranel-muted);
  text-shadow: none;
}

.footer-callout-content .callout-heading {
  color: var(--ranel-ink);
  font-size: 22px;
  font-weight: 700;
}

.footer-callout-button {
  margin-top: 8px;
}

footer {
  padding-top: 28px;
  background: #092d4b;
}

footer *,
footer a {
  color: #d9e6f0;
}

footer a:hover {
  color: #ffffff;
}

.footer-copyright {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.hr,
.hr-dotted,
.hr-dotted-double,
.hr-solid-double {
  background: none;
  border-top: 1px solid var(--ranel-border);
}

@media screen and (max-width: 990px) {
  .center-wrap,
  #main-wrap {
    width: calc(100% - 40px);
    max-width: 760px;
  }

  .page_content,
  .page_content_right {
    width: calc(100% - 300px);
  }

  .sidebar {
    width: 260px;
  }

  div + .sidebar {
    margin-left: calc(100% - 260px);
  }

  .home-vertical-callout .img-frame {
    max-width: 300px;
  }
}

@media screen and (max-width: 800px) {
  .banner-slider .one_half + .one_half {
    transform: none;
  }

  .companyIdentity {
    flex-direction: column;
    gap: 12px;
  }

  header nav {
    top: auto;
    padding: 0;
  }

  header nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0;
  }

  .catalog-product-image {
    height: 190px;
  }

  header nav a {
    padding: 0 12px;
  }

  .page_content,
  .page_content_right,
  .sidebar,
  div + .sidebar {
    float: none;
    width: 100% !important;
    margin: 0 0 24px;
  }

  .page_content + .right-sidebar {
    float: none;
    width: 100% !important;
    margin: 0 0 24px;
  }

  .page_content + .right-sidebar > * {
    margin-right: 0;
    margin-left: 0;
  }

  .footer-callout-content {
    width: 60%;
  }
}

@media screen and (max-width: 600px) {
  .center-wrap,
  #main-wrap {
    width: calc(100% - 32px);
  }

  .top-aside .center-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }

  .catalog-products {
    grid-template-columns: minmax(0, 1fr);
  }

  .top-aside .one_half,
  .top-aside .one_half + .one_half {
    float: none;
    width: 100%;
    text-align: center;
  }

  .top-aside .custom-menu,
  .top-aside .social_icons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 12px;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .top-aside .social_icons li {
    float: none;
    margin: 0;
  }

  .top-aside .social_icons a {
    white-space: nowrap;
  }

  .top-aside .one_half + .one_half .social_icons {
    float: none;
    justify-content: center;
  }

  .companyIdentity {
    gap: 8px;
  }

  header nav ul {
    gap: 2px;
  }

  header nav a {
    min-height: 44px;
    padding: 0 10px;
    font-size: 14px;
  }

  .banner-slider .center-wrap {
    padding: 38px 0;
  }

  .banner-slider .one_half + .one_half {
    justify-content: center;
  }

  .banner-slider .one_half {
    width: 100%;
    padding-bottom: 20px;
  }

  .banner-slider .home-slider-post {
    grid-template-areas:
      "image"
      "content";
    grid-template-columns: minmax(0, 1fr);
    row-gap: 24px;
  }

  .banner-slider .home-slider-post > .one_half {
    padding: 0;
  }

  .banner-slider h1,
  .banner-slider h2,
  .banner-slider h3,
  .banner-slider h4,
  .banner-slider h5,
  .banner-slider h6 {
    font-size: 21px;
  }

  .small_banner {
    padding: 24px 0;
  }

  .small_banner .page-banner-heading {
    font-size: 28px;
  }

  #main-wrap {
    padding: 32px 0 40px;
  }

  .home-vertical-callout,
  .home-vertical-sidebar,
  .sidebar-widget,
  .large-callout,
  .contact-panel,
  #contact,
  .subnav {
    padding: 18px;
  }

  .home-vertical-callout .img-frame {
    float: none;
    width: 100%;
    max-width: none;
    margin: 0 0 16px;
  }

  #content-container input[type="text"],
  #content-container input[type="password"],
  #content-container textarea,
  #content-container select {
    width: 100%;
    max-width: 100%;
  }

  .footer-callout-content,
  .footer-callout-button {
    float: none;
    width: 100%;
  }

  .footer-callout-button {
    margin-top: 18px;
  }

  .footer-callout-button a.button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}