/*!
Theme Name: mejgorodtaxi
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: mejgorodtaxi
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

mejgorodtaxi is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */


*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background-color: #fefefe;
	 font-family: 'Montserrat';
}




header .container{
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

li{
    list-style: none;
}

a{
    text-decoration: none;
}

.container{
    max-width: 1200px;
    margin: 0 auto;
}

.menu{
    display: flex;
    gap: 16px;
}

.menu a{
font-family: 'Montserrat';
font-weight: 500;
font-size: 16px;
font-feature-settings: 'pnum' on, 'lnum' on;
color: #010101;
transition: 0.3s ease-in;
}


.menu a:hover{
    color: #f3b600;
}

.social_media_wrapper{
    display: flex;
    gap: 10px;
}


.phone_header{
    font-family: 'Montserrat';
    font-weight: 700;
    font-size: 22px;
    color: #010101;
    transition: 0.3s ease-in;
	background-color: #f7b809;
    padding: 13px 60px;
    border: none;
    font-size: 16px;
    border-radius: 10px;
    color: #010101;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.phone_header:hover{
     color: #ffc20b;
}


.hero_block{
    background-image: 
    linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8)), /* Затемняющий слой */
    url(/wp-content/uploads/2026/03/yellow-taxi-rainy-city-street_780838-15160-1.webp);
    max-width: 1200px;
    margin: 0 auto;
    height: auto;
    padding-bottom: 110px;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 20px;
    margin-top: 30px;
	padding-left: 50px;
    padding-right: 50px;
}


.title{
font-family: 'Montserrat';
font-weight: 600;
font-size: 40px;
text-align: center;
color: #FFFFFF;
padding-top: 110px;
padding-bottom: 20px;
}

.prg_hero{
    font-family: 'Montserrat';
    font-weight: 600;
    font-size: 17px;
    text-align: center;
    color: #FFFFFF;
    padding-bottom: 20px;

}

.btn_hero{
padding: 10px 65px;
border: 1.5px solid #FFFFFF;
border-radius: 20px;
font-family: 'Montserrat';
font-style: normal;
font-weight: 600;
font-size: 15px;
color: #FFFFFF;
display: block;
margin: 0 auto;
width: fit-content;
}

.title_sections{
    font-family: 'Montserrat';
font-weight: 600;
font-size: 34px;
text-align: center;
color: #010101;
}

.section_container{
    margin-top: 60px;
}

.card-img, .card-img-bottom, .card-img-top{
 object-fit: cover;
    width: 100%;
    border-radius: 20px;
    margin-bottom: 20px;
    height: 270px;
}
  

  .cards-cont {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 20px;
            max-width: 1200px;
            padding: 0 20px;
        }

        .card{
              border-radius: 20px !important;
            padding: 20px;
        }

        .card a{
            font-family: 'Montserrat';
            font-weight: 700;
            font-size: 20px;
            color: #010101;
            transition: 0.3s ease-in;

        }
        
        .card a:hover{
             color: #f3b600;
        }


/* Горизонтальный стиль для формы расчета такси */
.сont_form {
    background-color: #ffffff; /* Белый цвет блока */
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
       max-width: 80%;
    margin: 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.3);
    
}

.сont_form, .title_sections{
    margin-bottom: 20px;
}

.input_wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
    align-items: end;
}

.input-group {
    position: relative;
    margin-bottom: 0;
}

.input-group:not(:has(.btn_dop)) {
    display: flex;
    flex-direction: column;
}

.input-group input,
.input-group select {
    width: 100%;
    padding: 16px 20px;
    border: 2px solid #e8ecef;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: rgba(255, 255, 255, 0.8);
    outline: none;
    color: #2d3748;
}



.input-group input::placeholder {
    color: #555555;
    font-weight: 400;
}




/* Основная кнопка расчета */
.btn_price_taxi {
    background: #ffc20b;
    color: #010101;
    border: none;
    padding: 18px 30px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    letter-spacing: 0.5px;
    margin-top: 30px;
}

.servise_wrapper{
    margin: 40px auto;
}

/* Стили для выпадающего списка услуг */
#services {
    border: 2px solid #e8ecef;
    border-radius: 12px;
    padding: 15px;
    background: rgba(255, 255, 255, 0.9);
    transition: all 0.3s ease;
    margin-top: 10px;
    font-size: 14px;
}

/* Кастомные стрелки для select */
.input-group select {  
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 16px;
    padding-right: 45px;
}

/* Иконки для полей ввода */
.input-group:nth-child(1) input {
   
    background-repeat: no-repeat;
    background-position: left 15px center;
    background-size: 22px;
}

.input-group:nth-child(2) input {
   
    background-repeat: no-repeat;
    background-position: left 15px center;
    background-size: 22px;
}

.result{
    margin-top: 20px;
    font-size: 17px;
}

.number{
    color: #f3b600;


font-family: 'Montserrat';
font-weight: 500;
font-size: 35px;

}

.suggestions-promo{
    display: none !important;
}

.name_servise{
    font-family: 'Montserrat';
    font-weight: 500;
    font-size: 21px;
    color: #000000;
}

.left_service_wrapper_card{
    display: flex;
    gap: 20px;
    align-items: center;
}

.service_cards{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #010101;
    padding: 15px 0;
}

.right_service_wrapper_card button{
    font-family: 'Montserrat';
    font-weight: 400;
    font-size: 20px;
    background: none;
    border: none;
    color: #000000;
    cursor: pointer;
    transition: 0.3s ease-in;
}

.right_service_wrapper_card button:hover{
    color: #f3b600;
}

.card_advantages{
    display: flex;
    gap: 15px;
}


.advantages_wrapper{
    max-width: 1150px;
    margin: 0 auto;
    margin-top: 40px;
}

.card_advantages p{
    font-size: 18px;
     font-family: 'Montserrat';
    font-weight: 400;
}

.cards_advantages_wrapper{
    display: flex;
    justify-content: space-between;
    gap: 65px;
}

.card-slider{
    margin-top: 40px;
}


.card-slider .card-item {
    border-radius: 8px;
    display: flex;
    padding-bottom: 15px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
	height: auto;
}

.card-slider .card-item .card-image {
  width: 320px;
    height: 300px;
    border-radius: 20px;
    object-fit: cover;
}

.card-title{
        font-weight: 500;
    font-size: 1.56rem;
    font-family: 'Montserrat';
    text-align: center;
}

.card-details{
    width: 70%;
}

.card-details a{
    background: #ffc20b;
    color: #010101;
    border: none;
    padding: 12px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 16px !important;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    margin-top: 20px;
    text-align: center;
    display: block;
}

.swiper-button-next, .swiper-button-prev{
   color: #f3b600 !important;
}

.swiper-button-next{
    padding-left: 30px !important;
    padding-bottom: 20px !important;
}



.swiper-button-prev{
        margin-left: -12px !important;
}

.contact_cont{
    background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url(/wp-content/uploads/2026/03/i-6-2.webp) no-repeat center center;
    background-size: cover;
    padding: 100px 0 100px;
    margin-top: 60px;
}

.contact_cont h2{
    font-size: 33px;
    text-align: center;
    font-weight: 700;
    color: white;
}


.socila_media_wrapper {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
}


.socila_media_wrapper a {
    padding: 10px 60px;
    background-color: #FFFFFF;
    border-radius: 20px;
    color: #070707;
     font-family: 'Montserrat';
}

.footer{
    background: #ffc20b;
    color: #010101;
    padding: 20px 0;
    font-size: 15px;
     font-family: 'Montserrat';
}

.footer .container{
     display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer .container a{
    font-size: 15px;
     font-family: 'Montserrat';
       color: #010101;
}

.swiper-button-next, .swiper-button-prev{
     margin-top: -50px !important;
}

.header_top_social_media_wrapper{
    display: none !important;
}

.header_top{
    display: flex !important;
    justify-content: end !important;
}

.hamburger {
	position: relative;
display: none !important;
	width: 26px;
	cursor: pointer;
	appearance: none;
	background: none;
	outline: none;
	border: none;
    z-index: 200;
    display: block;
}

.hamburger .bar, .hamburger:after, .hamburger:before {
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	background-color: #000000;
	margin: 6px 0px;
	transition: 0.4s;
}

.hamburger.is-active:before {
	transform: rotate(-45deg) translate(-3px, 2px);
}

.hamburger.is-active:after {
	transform: rotate(45deg) translate(-9px, -8px);
}

.hamburger.is-active .bar {
	opacity: 0;
}





.mobile-nav {
    position: fixed;
    top: 0;
    left: 100%;
    width: 100%;
    min-height: 100vh;
    display: block;
    z-index: 98;
    background-color: #ffffff;
       padding-top: 140px;
    transition: 0.4s;
	    padding-left: 20px;
    padding-right: 20px;
}

.mobile-nav.is-active {
	left: 0;
}

.mobile-nav a {
	display: block;
	width: 100%;
	max-width: 200px;
	margin: 0 auto 16px;
	text-align: center;
	padding: 12px 16px;
	color: black;
	text-decoration: none;
	font-size: 16px;
	transition: 0.3s ease-in;
}


.mobile-nav a:hover{
     color: #f3b600;
}

.social_media_list_page_sity button {
    background-color: #f7b809;
    padding: 13px 60px;
    border: none;
    font-size: 16px;
    border-radius: 10px;
    color: #010101;
    cursor: pointer;
    transition: all 0.3s 
cubic-bezier(0.4, 0, 0.2, 1);
margin: 0 auto;
display: block;
}


@media(max-width: 1200px){
    .container, .cards_advantages_wrapper{
        padding: 0 20px;
    }

    br{
        display: none;
    }
}

@media(max-width: 870px){
    .title{
        font-size: 35px;
    }

    .menu{
        display: none;
    }

    .hamburger{
        display: block !important;
    }

    .cards_advantages_wrapper{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 30px;
    }
}


@media(max-width: 500px){
    .prg_hero{
        padding: 20px;
    }

    .social_media_wrapper{
        display: none;
    }

    .phone_header{
        display: none;
    }

    .title_sections {
    font-size: 30px;
    }

    .header_top_social_media_wrapper{
        display: flex !important;
        position: relative !important;
    z-index: 999 !important;
    }

    .socila_media_wrapper a {
        width: 100% !important;
    }

    .title {
        font-size: 30px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 10px;
    }

    .right_service_wrapper_card button{
    font-size: 18px;
            width: 120px;
        text-align: end;
}


.name_servise {
    font-size: 20px;
}

.card-title {
    font-size: 1.42rem;
}
	
	
	.hero_block{
		padding-left: 0px;
		padding-right: 0px;
	}
}




.cards-cont{
    padding: 0;
}

.sity_title{
    margin-top: 20px;
}


.сont_form{
    max-width: 80%;
}

.socila_media_wrapper a {
    font-family: 'Montserrat';
    text-align: center;
}

.footer .container a {
    text-align: end;
            flex-wrap: wrap;
        display: flex;
}


/* Стили для оверлея (подложки) */
.modal-overlay {
display: none; /* По умолчанию скрыто */
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7); /* Полупрозрачный фон */
z-index: 1000; /* Высокий z-index для отображения над другими элементами */
justify-content: center;
align-items: center;
}

/* Стили для контейнера модального окна */
.modal-window {
background-color: #fff;
border-radius: 8px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
max-width: 500px;
width: 90%;
position: relative;
animation: modalFadeIn 0.3s ease-out;
}

/* Стили для заголовка модального окна */
.modal-header {
padding: 15px 20px;
border-bottom: 1px solid #eaeaea;
display: flex;
justify-content: space-between;
align-items: center;
}

.modal-header h3{
    font-size: 25px;
}

/* Стили для кнопки закрытия */
.close-btn {
font-size: 35px;
font-weight: bold;
color: #888;
cursor: pointer;
transition: color 0.2s;
}

.close-btn:hover {
color: #333;
}

/* Стили для содержимого модального окна */
.modal-content {
padding: 20px;
max-height: 70vh; /* Максимальная высота для скролла */
overflow-y: auto; /* Добавление скролла при необходимости */
}

.main-zakaz{
    display: grid;
}

.main-zakaz input{
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 10px;
    width: 100%;
    outline: none;
    font-family: "Montserrat";
    font-size: 15px;
}


.main-zakaz textarea{
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 10px;
    width: 100%;
    outline: none;
    resize: none;
    font-family: "Montserrat";
     font-size: 15px;
}


.ti-widget.ti-wp-testimonial-1 .ti-review-item>.ti-inner{
    width: fit-content !important;
}

.btn_zakaz{
        background: #ffc20b;
    color: #010101;
    border: none;
    padding: 15px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    letter-spacing: 0.5px;
}

/* Анимация появления модального окна */
@keyframes modalFadeIn {
from {
opacity: 0;
transform: translateY(-20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/* Стили для показа модального окна */
.modal-overlay.active {
display: flex; /* Меняем на flex для центрирования */
}



.details {
  position: relative;
  display: block;
  max-width: 100%;
  margin: 0 auto 10px;
  border-radius: 5px;
  transition: 0.3s;
  overflow: hidden;
}

.details::after {
  position: absolute;
  right: 24px;
  top: 15px;
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-right: 3px solid rgb(255, 194, 11);
  border-bottom: 3px solid rgb(255, 194, 11);
  transform: rotate(-45deg);
  transform-origin: center;
  transition: .3s;
}

.details[open]::after {
  transform: rotate(45deg);
}

.details[open] {
  padding-bottom: 100px;
}

.details[open] .details__title {
  margin-bottom: 32px;
}

.details__title {
  border-radius: 5px;
  padding: 12px 24px;
  font-size: 25px;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  transition: .3s;
}

.details__title::-webkit-details-marker {
  display: none;
}

.details__content {
  padding: 0 25px;
  font-size: 18px;
  margin-bottom: -60px;
}

.details__content p:last-child {
  margin-bottom: 0;
}
.details__content p:first-child {
  margin-top: 0;
}


@media(max-width: 490px){
   .сont_form {
    max-width: 100%;
}
	
	.details__title{
		font-size: 22px;
	}
	
	    .details__title {
        width: 300px;
        padding-left: 0;
    }
	
	.details__content {
    padding: 0;
}
	
	.details::after{
		    top: 20px;
	}
	
	.card-img, .card-img-bottom, .card-img-top {
		height: 220px;
	}
	
	.input_wrapper{
		    display: flex;
    flex-direction: column;
	}
	
	.input-group:not(:has(.btn_dop)) {
    width: -webkit-fill-available;
}
	
	
	.сont_form, .title_sections{
		        font-size: 27px;
	}
	
	
	.name_servise {
    font-size: 21px;
}


.number {
    font-size: 30px;
}



}



@media(max-width: 450px){
    .cards-cont
 {
    margin: 20px auto;
 }
}

@media (max-width: 390px) {
    .right_service_wrapper_card button {
        font-size: 18px;
        text-align: end;
        width: 120px;
    }
	
	
}


.breadcrumbs-list{
    display: flex;
        font-size: 18px;
        gap: 5px;
            margin-bottom: 40px;
}

.breadcrumbs-item a{
    font-size: 18px;
     color: black;
}


.breadcrumbs-item active{
        display: flex;
    gap: 5px;
   
}

.cities-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-top: 40px;
    margin-bottom: 60px;
}


.fag_sity{
     display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    padding: 0px 24px;
}


.sity{
    display: flex;
    gap: 10px;
    font-size: 20px;
    color: black;
        width: fit-content;
}


.empty-content{
    margin-bottom: 40px;
}


.all_sity{
        font-family: 'Montserrat';
    font-weight: 400;
    font-size: 18px;
       display: flex;
    justify-content: center;
    color: black;
}


.photo img{
    width: 50px !important;
    height: 50px !important;
    padding: 0px !important;
    display: block;
    border-radius: 30px;
    min-width: initial !important;
    max-width: initial !important;
    object-fit: cover;
    object-position: top;
}


.card_reviews{
        align-items: start !important;
        padding: 15px;
        border: 1px solid #9da1a1;
}


.name_reviews{
    display: flex;
    gap: 15px;
    align-items: center;
}


.name{
    font-weight: bold;
    font-size: 18px;
    color: #000000;
    margin-bottom: 3px;
}


.ti-stars{
    display: flex;
    gap: 5px;
    margin-top: 10px;
}


.reviews_text{
        font-size: 16px;
            line-height: 20.3px;
              font-weight: 500;
                  margin-top: 10px;
            
}



 .services-table {
            width: 100%;
            border-collapse: collapse;
        }

        .services-table th {
            background-color: #ffc20b;
            color: #010101;
            font-weight: bold;
            padding: 12px 15px;
            text-align: left;
            font-size: 18px;
        }

        .services-table td {
            padding: 10px 15px;
            border: 1px solid #ddd;
            font-size: 18px;
        }

        .services-table tr:nth-child(even) {
            background-color: #f9f9f9;
        }

        .services-table tr:hover {
            background-color: #f1f1f1;
        }



/* Адаптация для мобильных */
@media screen and (max-width: 600px) {
    .services-table {
        font-size: 14px;
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    
    .services-table th,
    .services-table td {
        padding: 8px 12px;
    }
	
	
	.card {
    padding-left: 0;
    padding-right: 0;
}
    
    /* Добавляем тень для указания на скролл */
    .services-table-wrapper {
        position: relative;
        overflow: hidden;
    }
    
    .services-table-wrapper::after {
        content: '→';
        position: absolute;
        right: 10px;
        bottom: 10px;
        background: #3498db;
        color: white;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        animation: bounce 1s infinite;
        opacity: 0.7;
        pointer-events: none;
    }
    
    @keyframes bounce {
        0%, 100% { transform: translateX(0); }
        50% { transform: translateX(5px); }
    }
}