body{
margin:0;
font-family:Arial, sans-serif;
	background:#f5f6f8; /* ВАЖНО */
}

/* ========================= */
/* HEADER */
/* ========================= */

.site-header{
position:fixed;
top:0px;
left:0;
width:100%;

background:transparent;

padding:20px 0;

transition:all .3s ease;

z-index:9999;

}

.site-header.scrolled{

background:#ffffff;
box-shadow:0 5px 20px rgba(0,0,0,0.08);


}
.header-container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
padding-left:60px;
padding-right:40px;
}
.logo a{
font-size:22px;
font-weight:bold;
text-decoration:none;
color:#000;
}
.main-menu ul{
display:flex;
gap:35px;
list-style:none;
margin:0;
padding:0;
}

.main-menu a{
text-decoration:none;
color:#333;
font-weight:500;
}

/* пункт меню */
.main-menu ul li{
position:relative;
}

/* подменю */
.main-menu ul li .sub-menu{
display:none;
position:absolute;
top:100%;
margin-top:-5px;
left:0;
background:white;
min-width:220px;
box-shadow:0 10px 20px rgba(0,0,0,0.08);
padding:10px 0;
z-index:10000;
}

/* показ подменю */
.main-menu ul li:hover .sub-menu,
.main-menu ul li .sub-menu:hover{
display:block;
}


/* mobile submenu */

@media (max-width:768px){

.main-menu ul{
flex-direction:column;
gap:0;
}

.main-menu ul li .sub-menu{
position:static;
box-shadow:none;
padding:0;
}

.main-menu ul li .sub-menu.open{
display:block;
}

}



.burger{
display:none;
flex-direction:column;
gap:5px;
cursor:pointer;
}

.burger span{
width:25px;
height:3px;
background:#333;
display:block;
}

@media (max-width:768px){

.main-menu{
display:none;
position:absolute;
top:70px;
left:0;
width:100%;
background:white;
}

.main-menu ul{
flex-direction:column;
gap:0;
}

.main-menu li{
padding:15px;
border-bottom:1px solid #eee;
}

.burger{
display:flex;
}

.header-container{
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
}

.logo{
justify-self:start;
}

.header-whatsapp{
display:flex;
align-items:center;
justify-content:center;
}

.header-whatsapp img{
width:25px;
height:25px;
display:block;
}

.header-whatsapp svg{
width:50px;
height:50px;
}

.burger{
justify-self:end;
}
	.logo img{
max-width:100px;
height:auto;
}
	
.main-menu.active{
display:block;
}

}
.menu-item-has-children > a::after{
content:" ▼";
font-size:12px;
}

.main-menu ul li {
position: relative;
}
/* скрываем подменю */

.main-menu ul li .sub-menu{
display:none;
position:absolute;
top:100%;
left:100px;
background:white;
min-width:220px;
box-shadow:0 10px 20px rgba(0,0,0,0.08);
padding:10px 0;
}
/* показываем при наведении */

@media (min-width:769px){

.main-menu ul li:hover > .sub-menu{
display:block;
}

}

/* пункты */

.main-menu ul li .sub-menu li{
padding:8px 20px;
white-space:nowrap;
}

.main-menu ul li .sub-menu{
display:none;
position:absolute;
top:100%;
left:0;
background:white;
min-width:220px;
box-shadow:0 10px 20px rgba(0,0,0,0.08);
padding:5px 0;
z-index:10000;
}

.main-menu ul li .sub-menu li a{
display:block;
padding:8px 16px;
}

.main-menu ul li:hover .sub-menu,
.main-menu ul li .sub-menu:hover{
display:block;
}


/* ========================= */
/* HERО */
/* ========================= */
.hero{
padding:70px 20px;
text-align:center;
}

.hero h1{
font-size:48px;
margin-bottom:20px;
}

.hero p{
font-size:22px;
}
.hero {

    position: relative;
    min-height: 80vh;

    background-image: url("../images/hero.jpg");
    background-size: cover;
    background-position: center;

    display: flex;
    align-items: center;
}

.hero-overlay {

    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.35);
}

.hero-container {

    position: relative;

    max-width: 1200px;
    margin: auto;

    width: 100%;
    padding: 0 20px;

    display: grid;
    grid-template-columns: 1fr 520px;
}

.hero-content {

    grid-column: 2;

    color: white;
}

.hero-title {

    font-size: 64px;
    font-weight: 700;
    margin-bottom: 20px;
}

.hero-subtitle {

    font-size: 22px;
    margin-bottom: 40px;
}

.hero-button a {

    display: inline-block;
    background: white;
    color: #111;

    padding: 16px 32px;
    border-radius: 6px;

    text-decoration: none;
    font-weight: 600;
}

@media (max-width: 900px) {

.hero-container {

    grid-template-columns: 1fr;
}

.hero-content {

    grid-column: auto;
    text-align: center;
}

.hero-title {

    font-size: 40px;
}

}



@media (max-width: 768px){

.hero{
    background-position: 35% center; /* смещение на Марию */
}

}


/* SERVICES */

.services {

padding:70px 20px;
background: #f5f6f8;

}

.services-container {

max-width: 1200px;
margin: auto;

display: grid;
grid-template-columns: 1fr 1fr;
gap: 120px;

align-items: start;

}

.services-left h2 {

font-size: 32px;
margin-bottom: 25px;

}

.services-left p {

font-size: 16px;
line-height: 1.7;
color: #555;

margin-bottom: 20px;

}

.services-right {

display: flex;
flex-direction: column;
gap: 22px;

}

.service-item {

display: flex;
justify-content: space-between;
align-items: center;

font-size: 24px;
font-weight: 500;

text-decoration: none;
color: #2c3a4b;

padding: 16px 0;

border-bottom: 1px solid #e5e7eb;

transition: all .25s ease;

}

.service-item:hover {

background: #3f37ff;
color: white;

padding-left: 20px;
padding-right: 20px;

}

.service-item .arrow {

font-size: 26px;

}


@media (max-width: 900px){

.services-container {

grid-template-columns: 1fr;
gap: 60px;

}

.service-item {

font-size: 20px;

}

}


/* features */

.features {

padding:10px 20px;
background:#f5f6f8;

}

.features-container{

max-width:1200px;
margin:auto;

}

.features-title{

text-align:center;
font-size:32px;
margin-bottom:80px;

}

.features-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:60px;
list-style:none;
    padding:0;
    margin:0;
}

.feature-number{

color:#3f37ff;
font-weight:600;
display:block;
margin-bottom:12px;

}

.feature-title{
    font-size:20px;
    margin-bottom:12px;
    font-weight:600;
    color:#2c3a4b;
}

.feature-item p{

font-size:16px;
line-height:1.7;
color:#555;

}

@media (max-width:768px){

.features-grid{

grid-template-columns:1fr;
gap:40px;

}

}

/* references */
.references {

padding:70px 20px;
background:#f5f6f8;

}

.references-container{

max-width:1200px;
margin:auto;

display:grid;
grid-template-columns:1fr 1fr;
gap:120px;

align-items:start;

}

.references-left h2{

font-size:48px;
line-height:1.2;
color:#4a4f5a;

}

.references-right p{

font-size:18px;
line-height:1.8;
color:#555;
margin-bottom:20px;

}

.references-btn{

display:inline-flex;
align-items:center;
gap:12px;

margin-top:20px;

padding:16px 28px;

border:2px solid #3f37ff;
color:#3f37ff;

text-decoration:none;
font-weight:500;

border-radius:6px;

transition:all .25s ease;

}

.references-btn:hover{

background:#3f37ff;
color:white;

}

.references-btn .arrow{

font-size:20px;

}
@media (max-width:768px){

.references-container{

grid-template-columns:1fr;
gap:40px;

}

.references-left h2{

font-size:32px;

}

}
.about-statement{

padding:10px 20px;
background:#f5f6f8;
margin-bottom:70px;

}
.about-container{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:120px;
align-items:center;
}
.about-image img{
width:100%;
height:auto;
display:block;
}
.about-content h2{
font-size:42px;
line-height:1.4;
color:#3b4351;
margin-bottom:40px;
}
.about-signature{

width:160px;

}

@media (max-width:768px){
.about-container{
grid-template-columns:1fr;
gap:40px;
}
.about-content{
order:1;
}
.about-image{
order:2;

}
.about-content h2{
font-size:30px;
}
}
/* footer */

.site-footer{
    background:#e6e9ef;
    padding:20px 20px;
	 
}

.footer-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:100px; /* увеличили расстояние */
}

.footer-title{
    font-size:18px;
    font-weight:700;
    margin-bottom:20px;
    color:#2c3a4b;
}

.footer-col ul{
    list-style:none;
    padding:0;
    margin:0;
}

.footer-col li{
    margin-bottom:12px;
}

.footer-col a{
    position: relative;
    text-decoration: none;
    color:#2c3a4b;
}

.footer-col a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-2px;
    width:0;
    height:2px;
    background:#3f37ff;
    transition: width .25s ease;
}

.footer-col a:hover::after{
    width:100%;
}

.footer-brand img{
    width:140px;
    margin-bottom:10px;
}

.footer-social{
    margin-top:10px;
    display:flex;
    gap:14px;
}

.footer-social img{
    width:20px;
}

@media (max-width:768px){
    .footer-container{
        grid-template-columns:1fr;
        gap:40px;
    }
}
/* ========================= */
/* SERVICE PAGE */
/* ========================= */

/* HERO */

.service-hero{
    padding:220px 20px 140px;
    background-image:url("../images/hero.jpg");
    background-size:cover;
    background-position:center;
    color:white;
    text-align:center;
}

.service-hero-overlay{
position:absolute;
inset:0;
background:rgba(0,0,0,0.45);
}

.service-hero-container{
position:relative;
max-width:900px;
margin:auto;
}

.service-title{
font-size:64px;
font-weight:600;
margin-bottom:20px;
}

.service-subtitle{
font-size:22px;
opacity:.9;
}



/* services services--tight */

.services--tight {
    padding-bottom: 20px;
}

.services--tight + .service-content {
    padding-top: 20px;
}

/* CONTENT */

.site-main{
    max-width:1200px;
    margin:0 auto;
    padding:0 20px;
}

.entry-content{
max-width:900px;
margin:0 auto;
}

.service-container{
max-width:1200px;
margin:0 auto;
padding:0 20px;
}
.service-content {
    padding: 50px 20px;
}


.service-hero{
position:relative;
height:380px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
overflow:hidden;
}

.service-hero-bg{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:url('/wp-content/themes/maria-theme/images/hero.jpg') center/cover no-repeat;
filter:brightness(0.55);
}

.service-hero-container{
position:relative;
z-index:2;
}

.service-title{
font-size:48px;
margin-bottom:10px;
}

.service-subtitle{
font-size:18px;
opacity:0.9;
}


.contact-section{
padding-top:150px;
padding-bottom:80px;
}

.contact-container{
max-width:1200px;
margin:0 auto;
padding:0 20px;
display:grid;
grid-template-columns:1fr 1fr;
gap:80px;
}

.contact-left h2{
font-size:36px;
margin-bottom:20px;
}

.contact-left p{
margin-bottom:40px;
color:#555;
}

.contact-item{
display:flex;
align-items:center;
margin-bottom:30px;
}

.contact-icon{
width:50px;
height:50px;
border-radius:50%;
background:#3c3cff;
display:flex;
align-items:center;
justify-content:center;
color:white;
margin-right:20px;
font-size:20px;
}

.contact-text strong{
display:block;
font-size:12px;
letter-spacing:1px;
color:#777;
}

.contact-text span{
font-size:18px;
font-weight:600;
}
/* мобилка сервис-херо*/
@media (max-width:768px){

.service-title{
    font-size:40px;
    line-height:1.3;
    padding:0 10px;
}

/* убрать лишние отступы SureForms */

.contact-right .sureforms-field,
.contact-right .sf-field,
.contact-right .sf-field-wrapper{
margin-bottom:8px !important;
}

/* уменьшить расстояние между элементами */

.contact-right form{
gap:10px !important;
}

/* input */

.contact-right input{
height:36px;
padding:8px 10px;
font-size:14px;
}

/* textarea */

.contact-right textarea{
height:90px;
padding:8px 10px;
}

/* label */

.contact-right label{
margin-bottom:2px;
font-size:13px;
}

/* кнопка */

.contact-right button{
margin-top:6px;
padding:9px 16px;
}

/* === УБИРАЕМ БЕЛЫЙ ФОН SUREFORMS === */

.contact-right div {
    background: transparent !important;
}


/* УБИРАЕМ правую колонку LatePoint */
.latepoint-booking-form-w .latepoint-summary-w {
    display: none !important;
}

/* Растягиваем форму на всю ширину */
.latepoint-booking-form-w .latepoint-form-w {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
}
/* ===== PORTFOLIO PAGE ===== */

.portfoliopage .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* заголовок */
.portfoliopage h1 {
    margin-bottom: 30px;
    font-size: 32px;
}

/* сетка */
.list-case {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* карточка */
.case {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: transform 0.3s ease;
}

/* hover эффект */
.case:hover {
    transform: translateY(-5px);
}

/* картинка */
.case__img {
    width: 100%;
    overflow: hidden;
    border-radius: 10px;
}

.case__img img {
    width: 100%;
    height: auto;
    display: block;
}

/* заголовок */
.case__title {
    margin-top: 12px;
    font-size: 16px;
    font-weight: 500;
}

/* ===== ПАГИНАЦИЯ ===== */

.pagination {
    margin-top: 40px;
    display: flex;
    gap: 10px;
}

.pagination a,
.pagination span {
    padding: 8px 12px;
    background: #f1f1f1;
    text-decoration: none;
}

.pagination .current {
    background: #000;
    color: #fff;
}
/* ===== SINGLE PORTFOLIO FIX ===== */

/* норм контейнер */
.casepage .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* блок макета */
#fullscreen {
    max-width: 1000px;
    margin: 40px auto;
}

/* картинка */
#fullscreen img {
    width: 100%;
    height: auto;
    display: block;
}

/* контент ниже */
.casepage .content {
    max-width: 1000px;
    margin: 40px auto;
}

/* защита от вылазов */
.casepage img {
    max-width: 100%;
    height: auto;
}
/* отступ от хедера */
.portfoliopage {
    padding-top: 60px;
}

/* для single страницы */
.casepage {
    padding-top: 60px;
}
/* ===== АДАПТИВ ===== */

@media (max-width: 900px) {
    .list-case {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 500px) {
    .list-case {
        grid-template-columns: 1fr;
    }
}