:root {
--ink: #122029;
--ink-soft: #2a3d4a;
--paper: #f3f6f8;
--paper-2: #e7eef2;
--line: rgba(18, 32, 41, 0.12);
--accent: #1f8a9a;
--accent-deep: #166a76;
--warm: #d4a04a;
--white: #ffffff;
--shadow: 0 18px 50px rgba(18, 32, 41, 0.18);
--font-display: "Literata", "Times New Roman", serif;
--font-body: "Manrope", system-ui, sans-serif;
--max: 1120px;
--radius: 4px;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body.avto-landing {
margin: 0;
font-family: var(--font-body);
color: var(--ink);
background: var(--paper);
line-height: 1.55;
-webkit-font-smoothing: antialiased;
} body.avto-landing #content,
body.avto-landing .site-content,
body.avto-landing .ast-container {
padding: 0 !important;
margin: 0 !important;
max-width: none !important;
}
body.avto-landing .entry-header,
body.avto-landing .ast-article-single > .entry-header {
display: none !important;
}
body.avto-landing .site-content > .ast-container {
display: block !important;
}
body.avto-landing #primary,
body.avto-landing .ast-article-single,
body.avto-landing .entry-content {
margin: 0 !important;
padding: 0 !important;
max-width: none !important;
width: 100% !important;
} body.avto-landing #ast-desktop-header .ast-above-header-bar,
body.avto-landing .header-widget-area {
display: none !important;
}
body.avto-landing #masthead {
background: #fff;
box-shadow: 0 1px 0 rgba(18, 32, 41, 0.08);
position: relative;
z-index: 30;
}
body.avto-landing .ast-primary-header-bar,
body.avto-landing .ast-below-header-bar {
background: #fff !important;
border: 0 !important;
box-shadow: none !important;
} body.avto-landing.ast-desktop #ast-desktop-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
width: min(100% - 2rem, 1120px);
margin: 0 auto;
padding: 0.55rem 0;
}
body.avto-landing.ast-desktop .ast-primary-header-bar,
body.avto-landing.ast-desktop .ast-below-header-bar,
body.avto-landing.ast-desktop .ast-primary-header-bar > .ast-container,
body.avto-landing.ast-desktop .ast-below-header-bar > .ast-container {
display: contents !important;
}
body.avto-landing.ast-desktop .site-header-primary-section-left-center,
body.avto-landing.ast-desktop .site-header-primary-section-center,
body.avto-landing.ast-desktop .site-header-primary-section-right,
body.avto-landing.ast-desktop .site-header-primary-section-right-center,
body.avto-landing.ast-desktop .site-header-below-section-left {
display: none !important;
}
body.avto-landing.ast-desktop .site-header-primary-section-left,
body.avto-landing.ast-desktop .site-header-below-section-right {
display: flex !important;
align-items: center;
}
body.avto-landing .ast-primary-header-bar .site-primary-header-wrap,
body.avto-landing .ast-mobile-header-wrap .ast-primary-header-bar {
min-height: 68px !important;
}
body.avto-landing .ast-below-header-bar .site-below-header-wrap,
body.avto-landing .ast-mobile-header-wrap .ast-below-header-bar {
min-height: 48px !important;
}
body.avto-landing #masthead .custom-logo-link img,
body.avto-landing #masthead .ast-mobile-header-logo {
max-width: 132px !important;
width: 132px !important;
height: auto !important;
}
body.avto-landing .ast-site-identity,
body.avto-landing .site-logo-img {
display: flex !important;
align-items: center;
gap: 0.85rem;
}
body.avto-landing .avto-header-phone {
display: inline-flex;
align-items: center;
gap: 0.4rem;
text-decoration: none !important;
color: #3a4450 !important;
white-space: nowrap;
line-height: 1;
}
body.avto-landing .avto-header-phone img {
width: 46px;
height: 46px;
object-fit: contain;
display: block;
}
body.avto-landing .avto-header-phone span {
font-family: var(--font-body);
font-size: 1.45rem;
font-weight: 700;
letter-spacing: 0.01em;
color: #3a4450;
}
body.avto-landing .avto-header-phone:hover span {
color: var(--accent);
}
body.avto-landing .ast-header-social-1-wrap .header-social-inner-wrap {
display: flex !important;
align-items: center;
gap: 0.55rem;
}
body.avto-landing .ast-header-social-1-wrap .ast-builder-social-element {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border-radius: 0 !important;
line-height: 1 !important;
text-decoration: none !important;
transition: transform 0.2s ease, opacity 0.2s ease;
}
body.avto-landing .ast-header-social-1-wrap .ast-builder-social-element:hover {
transform: scale(1.08);
opacity: 0.85;
}
body.avto-landing .ast-header-social-1-wrap .ahfb-svg-iconset,
body.avto-landing .ast-header-social-1-wrap svg,
body.avto-landing .ast-header-social-1-wrap .ast-social-icon-image-wrap {
display: none !important;
}
body.avto-landing .ast-header-social-1-wrap .ast-builder-social-element::before {
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
font-size: 1.85rem;
-webkit-font-smoothing: antialiased;
}
body.avto-landing .ast-header-social-1-wrap .ast-phone::before {
font-family: "Font Awesome 6 Free";
font-weight: 900;
content: "\f095";
color: #122029;
}
body.avto-landing .ast-header-social-1-wrap .ast-email::before {
font-family: "Font Awesome 6 Free";
font-weight: 900;
content: "\f0e0";
color: #122029;
}
body.avto-landing .ast-header-social-1-wrap .ast-telegram::before {
font-family: "Font Awesome 6 Brands";
font-weight: 400;
content: "\f2c6";
color: #0088cc;
}
body.avto-landing .ast-header-social-1-wrap .ast-whatsapp::before {
font-family: "Font Awesome 6 Brands";
font-weight: 400;
content: "\f232";
color: #25d366;
}
body.avto-landing .ast-header-social-1-wrap .ast-wordpress::before {
font-family: "Font Awesome 6 Brands";
font-weight: 400;
content: "\f409";
color: #7360f2;
}
body.avto-landing .site-below-footer-wrap,
body.avto-landing .site-primary-footer-wrap {
margin-top: 0;
}
.avto {
overflow-x: hidden;
}
.avto a {
color: inherit;
}
.avto-wrap {
width: min(100% - 2rem, var(--max));
margin-inline: auto;
} .avto-hero {
position: relative;
min-height: min(88vh, 820px);
display: grid;
align-items: end;
color: var(--white);
background: #0b161c;
isolation: isolate;
}
.avto-hero__media {
position: absolute;
inset: 0;
margin: 0;
z-index: 0;
}
.avto-hero__media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: 58% 42%;
display: block;
transform: scale(1.02);
}
.avto-hero__shade {
position: absolute;
inset: 0;
background:
linear-gradient(105deg, rgba(7, 14, 20, 0.92) 0%, rgba(7, 14, 20, 0.72) 38%, rgba(7, 14, 20, 0.28) 68%, rgba(7, 14, 20, 0.18) 100%),
linear-gradient(0deg, rgba(7, 14, 20, 0.82) 0%, rgba(7, 14, 20, 0.2) 42%, transparent 70%);
}
.avto-hero__content {
position: relative;
z-index: 2;
padding: 5rem 0 4rem;
max-width: 36rem;
margin-right: auto;
}
.avto-hero__brand,
body.avto-landing .entry-content h1.avto-hero__brand {
margin: 0 0 0.9rem;
font-family: var(--font-display);
font-size: clamp(2.5rem, 6.2vw, 3.85rem);
font-weight: 600;
line-height: 1.02;
letter-spacing: -0.025em;
color: #ffffff !important;
text-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
}
.avto-hero__lead {
margin: 0 0 1.75rem;
font-size: 1.12rem;
line-height: 1.5;
color: rgba(255, 255, 255, 0.9);
max-width: 28rem;
}
.avto-cta {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
}
.avto-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.45rem;
min-height: 3rem;
padding: 0.75rem 1.25rem;
border-radius: var(--radius);
border: 1px solid transparent;
font-family: var(--font-body);
font-size: 0.95rem;
font-weight: 700;
text-decoration: none;
cursor: pointer;
transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.avto-btn:hover {
transform: translateY(-1px);
}
.avto-btn--primary {
background: var(--accent);
color: var(--white);
}
.avto-btn--primary:hover {
background: var(--accent-deep);
}
.avto-btn--ghost {
background: transparent;
color: var(--white);
border-color: rgba(255, 255, 255, 0.45);
}
.avto-btn--ghost:hover {
border-color: #fff;
background: rgba(255, 255, 255, 0.08);
}
.avto-btn--dark {
background: var(--ink);
color: var(--white);
}
.avto-btn--dark:hover {
background: #1c323f;
} .avto-sec {
padding: 4.5rem 0;
}
.avto-sec--muted {
background: var(--paper-2);
}
.avto-sec--ink {
background:
radial-gradient(1200px 500px at 10% 0%, rgba(31, 138, 154, 0.22), transparent 55%),
linear-gradient(160deg, #122029 0%, #1a303c 100%);
color: var(--white);
}
.avto-kicker {
margin: 0 0 0.55rem;
font-size: 0.78rem;
font-weight: 700;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--accent);
}
.avto-sec--ink .avto-kicker {
color: var(--warm);
}
.avto-h2 {
margin: 0 0 1.25rem;
font-family: var(--font-display);
font-size: clamp(1.7rem, 3.4vw, 2.35rem);
line-height: 1.15;
font-weight: 600;
letter-spacing: -0.02em;
color: var(--ink);
}
.avto-sec--ink .avto-h2,
body.avto-landing .entry-content .avto-sec--ink h2 {
color: #ffffff !important;
}
.avto-sec--ink a[href^="tel"],
.avto-sec--ink .avto-mail a {
color: #ffffff !important;
}
.avto-prose p {
margin: 0 0 1rem;
font-size: 1.02rem;
color: var(--ink-soft);
}
.avto-sec--ink .avto-prose p {
color: rgba(255, 255, 255, 0.86);
}
.avto-prose p:last-child {
margin-bottom: 0;
} .avto-about {
display: grid;
grid-template-columns: 0.9fr 1.1fr;
gap: 2.5rem;
align-items: center;
}
.avto-about__photo {
margin: 0;
position: relative;
}
.avto-about__photo img {
width: 100%;
max-width: 420px;
aspect-ratio: 4 / 5;
object-fit: cover;
object-position: 52% 18%;
display: block;
border-radius: var(--radius);
box-shadow: var(--shadow);
}
.avto-facts {
list-style: none;
margin: 1.4rem 0 0;
padding: 0;
display: grid;
gap: 0.55rem;
}
.avto-facts li {
padding: 0.7rem 0.85rem;
background: rgba(255, 255, 255, 0.55);
border-left: 3px solid var(--accent);
font-size: 0.98rem;
} .avto-routes {
display: grid;
grid-template-columns: 1.1fr 0.9fr;
gap: 2rem;
align-items: stretch;
}
.avto-map {
margin: 0;
min-height: 360px;
height: 100%;
border-radius: 12px;
overflow: hidden;
box-shadow: var(--shadow);
background: #e7eef2;
position: relative;
}
.avto-map #avto-map,
.avto-map .leaflet-container {
width: 100%;
height: 100%;
min-height: 360px;
background: #e7eef2;
}
.avto-map .leaflet-control-attribution {
font-size: 10px;
background: rgba(255, 255, 255, 0.78);
}
.avto-map-legend {
position: absolute;
left: 12px;
bottom: 28px;
z-index: 5;
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.45rem 0.7rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.92);
box-shadow: 0 8px 24px rgba(18, 32, 41, 0.12);
font-size: 0.78rem;
font-weight: 700;
color: var(--ink);
pointer-events: none;
}
.avto-map-legend i {
width: 10px;
height: 10px;
border-radius: 50%;
background: var(--accent);
box-shadow: 0 0 0 4px rgba(31, 138, 154, 0.2);
}
.avto-map-pin {
width: 18px;
height: 18px;
margin-left: -9px;
margin-top: -9px;
border-radius: 50%;
background: var(--accent);
border: 3px solid #fff;
box-shadow: 0 0 0 6px rgba(31, 138, 154, 0.22);
}
.avto-map img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.avto-note {
margin-top: 1.25rem;
padding: 1rem 1.1rem;
background: rgba(31, 138, 154, 0.1);
border: 1px solid rgba(31, 138, 154, 0.25);
font-weight: 600;
} .avto-carousel {
position: relative;
}
.avto-carousel__viewport {
overflow: hidden;
border-radius: var(--radius);
box-shadow: var(--shadow);
background: #0b161c;
}
.avto-carousel__track {
display: flex;
transition: transform 0.5s ease;
}
.avto-carousel__track figure {
flex: 0 0 100%;
margin: 0;
aspect-ratio: 16 / 9;
}
.avto-carousel__track img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.avto-carousel__nav {
position: absolute;
top: 50%;
z-index: 2;
width: 2.6rem;
height: 2.6rem;
margin-top: -1.8rem;
border: 0;
border-radius: 999px;
background: rgba(8, 16, 22, 0.55);
color: #fff;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1rem;
transition: background 0.2s ease, transform 0.2s ease;
}
.avto-carousel__nav:hover {
background: rgba(8, 16, 22, 0.82);
transform: scale(1.06);
}
.avto-carousel__nav--prev { left: 0.75rem; }
.avto-carousel__nav--next { right: 0.75rem; }
.avto-carousel__dots {
display: flex;
justify-content: center;
gap: 0.45rem;
margin-top: 0.9rem;
}
.avto-carousel__dot {
width: 0.65rem;
height: 0.65rem;
padding: 0;
border: 0;
border-radius: 999px;
background: rgba(18, 32, 41, 0.28);
cursor: pointer;
}
.avto-carousel__dot.is-active {
background: var(--accent);
transform: scale(1.15);
}
@media (prefers-reduced-motion: reduce) {
.avto-carousel__track {
transition: none;
}
} .avto-contact {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
align-items: start;
}
.avto-mail {
margin: 0.35rem 0 0;
font-weight: 600;
}
.avto-mail a {
text-decoration: none;
color: rgba(255, 255, 255, 0.88);
}
.avto-messengers {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.85rem;
margin: 1.2rem 0 1.5rem;
}
.avto-soc {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 3.15rem;
line-height: 1;
text-decoration: none;
transition: transform 0.2s ease, opacity 0.2s ease;
}
.avto-soc:hover {
transform: scale(1.08);
opacity: 0.85;
}
.avto-soc--vb { color: #7360f2; }
.avto-soc--tg { color: #0088cc; }
.avto-soc--wa { color: #25d366; }
.avto-chip {
display: inline-flex;
align-items: center;
min-height: 2.5rem;
padding: 0.45rem 0.9rem;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.28);
text-decoration: none;
font-weight: 700;
font-size: 0.9rem;
transition: background 0.2s ease;
}
.avto-chip:hover {
background: rgba(255, 255, 255, 0.1);
}
.avto-form-card {
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.14);
padding: 1.35rem;
border-radius: var(--radius);
}
.avto-form-card .wpcf7 {
margin: 0;
}
.avto-form-card,
.avto-form-card p,
.avto-form-card label,
.avto-form-card strong,
.avto-form-card .wpcf7-form p {
color: #ffffff !important;
}
body.avto-landing .site-primary-footer-wrap,
body.avto-landing #colophon .wpcf7,
body.avto-landing .footer-widget-area[data-section="sidebar-widgets-footer-widget-4"],
body.avto-landing .footer-widget-area[data-section="section-fb-html-1"] {
display: none !important;
}
body.avto-landing #colophon,
body.avto-landing #colophon p,
body.avto-landing #colophon label,
body.avto-landing #colophon strong,
body.avto-landing #colophon .widget,
body.avto-landing #colophon .footer-widget-area {
color: #ffffff !important;
}
body.avto-landing #colophon .wpcf7-form p,
body.avto-landing #colophon .wpcf7-form label {
color: #ffffff !important;
font-size: 1rem;
}
.avto-form-card input[type="text"],
.avto-form-card input[type="email"],
.avto-form-card input[type="tel"],
.avto-form-card textarea {
width: 100%;
margin-top: 0.35rem;
margin-bottom: 0.85rem;
padding: 0.75rem 0.85rem;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: var(--radius);
background: rgba(255, 255, 255, 0.08);
color: #fff;
font: inherit;
}
.avto-form-card input::placeholder,
.avto-form-card textarea::placeholder {
color: rgba(255, 255, 255, 0.45);
}
.avto-form-card input[type="submit"],
.avto-form-card .wpcf7-submit {
width: 100%;
min-height: 3rem;
border: 0;
border-radius: var(--radius);
background: var(--accent);
color: #fff;
font-weight: 700;
font-size: 1rem;
cursor: pointer;
}
.avto-form-card input[type="submit"]:hover,
.avto-form-card .wpcf7-submit:hover {
background: var(--accent-deep);
}
.avto-form-card .wpcf7-response-output {
margin: 0.75rem 0 0;
border-radius: var(--radius);
} @media (prefers-reduced-motion: no-preference) {
.avto-hero__content {
animation: avto-rise 0.85s ease both;
}
.avto-about__photo img {
animation: avto-rise 0.9s 0.1s ease both;
}
}
@keyframes avto-rise {
from {
opacity: 0;
transform: translateY(18px);
}
to {
opacity: 1;
transform: translateY(0);
}
} @media (max-width: 921px) {
body.avto-landing .avto-header-phone {
display: none !important;
}
}
@media (max-width: 900px) {
.avto-about,
.avto-routes,
.avto-contact {
grid-template-columns: 1fr;
}
.avto-about__photo img {
max-width: 320px;
margin-inline: auto;
}
.avto-hero {
min-height: 82vh;
}
.avto-hero__media img {
object-position: 72% 40%;
}
.avto-hero__content {
padding: 3.5rem 0 3rem;
}
body.avto-landing #masthead .custom-logo-link img,
body.avto-landing #masthead .ast-mobile-header-logo {
max-width: 110px !important;
width: 110px !important;
}
body.avto-landing .avto-header-phone img {
width: 36px;
height: 36px;
}
body.avto-landing .avto-header-phone span {
font-size: 1.15rem;
}
body.avto-landing .ast-header-social-1-wrap .ast-builder-social-element::before {
font-size: 1.55rem;
}
}
@media (max-width: 560px) {
.avto-cta {
flex-direction: column;
}
.avto-btn {
width: 100%;
}
} .avto-comments {
background: var(--paper);
}
.avto-comments .comments-title {
display: none;
}
.avto-comments .comments-area {
margin: 0;
padding: 0;
background: transparent;
}
.avto-comments .comment-list {
list-style: none;
margin: 0 0 2rem;
padding: 0;
display: grid;
gap: 1rem;
}
.avto-comments .comment-list .children {
list-style: none;
margin: 0.75rem 0 0 1.25rem;
padding: 0;
}
.avto-comments .comment-body {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--radius);
padding: 1.1rem 1.2rem;
}
.avto-comments .comment-author,
.avto-comments .comment-author a,
.avto-comments .fn {
color: var(--ink) !important;
font-weight: 700;
}
.avto-comments .comment-metadata,
.avto-comments .comment-metadata a {
color: var(--ink-soft) !important;
font-size: 0.85rem;
}
.avto-comments .comment-content,
.avto-comments .comment-content p {
color: var(--ink-soft) !important;
font-size: 1rem;
}
.avto-comments .comment-content p:last-child {
margin-bottom: 0;
}
.avto-comments .reply a {
color: var(--accent) !important;
font-weight: 700;
text-decoration: none;
}
.avto-comments .comment-respond {
background: #fff;
border: 1px solid var(--line);
border-radius: var(--radius);
padding: 1.25rem;
}
.avto-comments .comment-reply-title {
font-family: var(--font-display);
font-size: 1.25rem;
color: var(--ink) !important;
margin: 0 0 1rem;
}
.avto-comments .comment-form label,
.avto-comments .comment-notes,
.avto-comments .logged-in-as {
color: var(--ink-soft) !important;
}
.avto-comments .comment-form input[type="text"],
.avto-comments .comment-form input[type="email"],
.avto-comments .comment-form input[type="url"],
.avto-comments .comment-form textarea {
width: 100%;
margin-top: 0.35rem;
margin-bottom: 0.85rem;
padding: 0.75rem 0.85rem;
border: 1px solid var(--line);
border-radius: var(--radius);
background: #fff;
color: var(--ink);
font: inherit;
}
.avto-comments .comment-form .submit,
.avto-comments .comment-form input[type="submit"] {
background: var(--accent) !important;
color: #fff !important;
border: 0;
min-height: 3rem;
padding: 0.75rem 1.25rem;
font-weight: 700;
cursor: pointer;
} html.avto-loading,
html.avto-loading body {
overflow: hidden;
}
#avto-loader {
position: fixed;
inset: 0;
z-index: 99999;
display: flex;
align-items: center;
justify-content: center;
background: #fff;
transition: opacity 0.45s ease, visibility 0.45s ease;
}
#avto-loader.is-hidden {
opacity: 0;
visibility: hidden;
pointer-events: none;
}
.avto-loader__mark {
position: relative;
width: 168px;
height: 168px;
display: flex;
align-items: center;
justify-content: center;
}
.avto-loader__ring {
position: absolute;
inset: -12px;
border-radius: 50%;
border: 3px solid rgba(31, 138, 154, 0.16);
border-top-color: var(--accent);
animation: avto-spin 0.85s linear infinite;
}
.avto-loader__logo {
width: 132px;
height: auto;
display: block;
position: relative;
z-index: 1;
}
.avto-loader__brand {
font-family: var(--font-body);
font-weight: 700;
font-size: 1.15rem;
line-height: 1.25;
color: var(--ink);
text-align: center;
max-width: 12rem;
position: relative;
z-index: 1;
}
@keyframes avto-spin {
to {
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
.avto-loader__ring {
animation: none;
border-color: var(--accent);
}
}