/*
Theme Name: PSL
Theme URI: https://example.com
Author: DajeStalin
Author URI: https://example.com
Description: Базовая тема под перенос с Wix/статических HTML
Version: 1.0.0
Text Domain: psl
*/

@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;600&display=swap');

html, body {
  font-family: 'Play', sans-serif;
}

body,
html {
    margin: 0 !important;
}

header {
    margin-top: 27px;
}

#wpadminbar {
    display: none !important;
}

/* ===== Палитра ===== */
:root{
  --psl-primary:#112B6F;   /* основной */
  --psl-hover:#1E4BC2;     /* hover */
}

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

/* Фон для body только на front-page */
body.psl-home{
  /* верхний слой — белый с прозрачностью; нижний — твоя картинка */
  background-image:
    linear-gradient(rgba(255,255,255,.65), rgba(255,255,255,.65)),
    url("/wp-content/uploads/2025/10/bg-psl.avif");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}

/* общий фон для главной и Services */
body.psl-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.65), rgba(255,255,255,.65)),
    url("/wp-content/uploads/2025/10/bg-psl.avif");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}
@media (max-width:900px){
  body.psl-bg{ background-attachment: scroll; } /* безопасно для мобилок */
}


/* ====================================================================== */

/* ===== Header ===== */
.psl-header{position:relative;z-index:10;background:transparent;overflow:visible;}
.psl-header__inner{min-height:96px;display:flex;align-items:flex-start;gap:24px}

/* logo */
.psl-logo img{height:60px;width:auto;display:block}
.psl-logo__text{font-weight:700;font-size:22px;color:var(--psl-primary);text-decoration:none}

/* right column (desktop: column) */
.psl-header__right{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:8px;position:relative}

/* menu (desktop) */
.psl-menu{display:flex;gap:28px;justify-content:flex-end;align-items:center;margin:0;padding:0;list-style:none}
.psl-menu a{display:inline-block;padding:6px 0;text-decoration:none;color:var(--psl-primary);font-weight:400;letter-spacing:.2px;font-size:18px}
.psl-menu .current-menu-item>a,
.psl-menu a:hover{color:var(--psl-hover);text-decoration:none}

/* language under menu, dropdown absolute (doesn't push) */
.psl-lang{position:relative;align-self:flex-end}
.psl-lang__btn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:0;cursor:pointer;padding:6px 0;color:#333;font-weight:400;font-size:15px}
.psl-lang__chev{transition:transform .2s}
.psl-lang.is-open .psl-lang__chev{transform:rotate(180deg)}
.psl-lang__list{
  position:absolute;right:0;top:calc(100% + 6px);z-index:10000;
  margin:0;padding:0;list-style:none;background:transparent;border:0;box-shadow:none;
  transform-origin:top;transform:scaleY(0);opacity:0;visibility:hidden;
  transition:transform .16s ease,opacity .16s ease,visibility 0s linear .16s;pointer-events:none;width:100%;
}
.psl-lang.is-open .psl-lang__list{transform:scaleY(1);opacity:1;visibility:visible;pointer-events:auto;transition:transform .16s ease,opacity .16s ease,visibility 0s}
.psl-lang__link{display:block;padding:4px 0;text-decoration:none;color:#2a3f8f}
.psl-lang__link:hover{color:var(--psl-hover);text-decoration:none}

/* burger button */
.psl-burger{display:none;background:none;border:0;padding:8px;cursor:pointer;align-self:flex-end}
.psl-burger span{display:block;width:24px;height:2px;background:var(--psl-primary);margin:5px 0;border-radius:2px}

/* hero overlap (optional) */
/* .overlap-header{margin-top:-96px;padding-top:96px} */

/* ===== Offcanvas (inside header) ===== */
.psl-offcanvas{
  position:fixed;inset:0 0 0 auto;width:min(78vw,360px);
  background:#fff;box-shadow:-8px 0 24px rgba(0,0,0,.15);
  transform:translateX(100%);transition:transform .25s ease;z-index:9999;
  display:flex;flex-direction:column
}
.psl-offcanvas__overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.25);
  opacity:0;visibility:hidden;transition:opacity .2s ease, visibility 0s linear .2s;z-index:9998
}
.psl-offcanvas__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid rgba(0,0,0,.06)}
.psl-offcanvas__close{background:none;border:0;font-size:32px;line-height:1;cursor:pointer;color:var(--psl-primary)}
.psl-offcanvas__nav{padding:12px 18px 24px}
.psl-offcanvas__menu{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:18px}
.psl-offcanvas__menu a{text-decoration:none;color:var(--psl-primary);font-size:22px;font-weight:500}
.psl-offcanvas__menu a:hover{color:var(--psl-hover)}

/* offcanvas language */
.psl-offcanvas__lang{position:relative}
.psl-offcanvas__langbtn{display:inline-flex;align-items:center;gap:8px;background:transparent;border:0;cursor:pointer;color:#333;font-size:16px;padding:6px 0}
.psl-offcanvas__langlist{
  position:absolute;left:0;top:calc(100% + 6px);background:#fff;border:1px solid rgba(0,0,0,.1);
  border-radius:8px;padding:8px 10px;list-style:none;margin:0;transform-origin:top;transform:scaleY(0);opacity:0;visibility:hidden;transition:.16s;box-shadow:0 8px 24px rgba(0,0,0,.08)
}
.psl-offcanvas__lang.is-open .psl-offcanvas__langlist{transform:scaleY(1);opacity:1;visibility:visible}
.psl-offcanvas__langlist a{color:var(--psl-primary);text-decoration:none;display:block;padding:6px 4px}
.psl-offcanvas__langlist a:hover{color:var(--psl-hover)}

/* ===== Responsive ===== */
@media (max-width: 900px){
  .psl-lang {display: none;}
  .psl-header__inner{min-height:80px;align-items:center; justify-content: space-between !important;}
  .overlap-header{margin-top:-80px;padding-top:80px}

  /* правая часть: в одну строку — язык слева, бургер справа */
  .psl-header__right{flex-direction:row;align-items:center;gap:16px}
  .psl-menu{display:none}
  .psl-burger{display:inline-block}

  /* открытие офканваса: он потомок header, поэтому target так */
  .psl-header.off-open .psl-offcanvas{transform:translateX(0)}
  .psl-header.off-open .psl-offcanvas__overlay{opacity:1;visibility:visible;transition:opacity .2s ease}
}

@media (max-width: 480px) {
    .custom-logo-link img {
        max-width: 247px;
        max-height: 74px;
    }
}

@media (max-width: 330px) {
    .custom-logo-link img {
        max-width: 229px;
        max-height: 68px;
    }
}
/* ==================================================== */

/* ===== FRONT PAGE: HERO ===== */
.psl-container.front{ max-width: 1400px; }

.psl-hero{
  padding: clamp(64px, 7.5vw, 100px) 0 clamp(42px, 6vw, 56px);
  position: relative;
}

/* ДВЕ колонки: слева медиа фикс/эласт, справа текст */
.psl-hero__grid{
  display: grid;
  grid-template-columns: minmax(340px, 420px) 1fr;  /* левая ≈ 350–420 */
  align-items: center;
  gap: clamp(24px, 4vw, 72px);
}

/* левая колонка */
.psl-hero__media{ width: 100%; max-width: 420px; }
.psl-hero__card{
  width: 100%;
  max-width: 420px;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  margin: 0 0 clamp(20px, 3vw, 32px);
  box-shadow: 16px -2px 3px 0 rgb(0 0 0 / 60%);
  -webkit-box-shadow: 16px -2px 3px 0 rgb(0 0 0 / 60%);
}
.psl-hero__card--second{ margin-top: clamp(8px, 1vw, 12px); }
.psl-hero__card img{ display:block; width:100%; height:auto; border-radius:0 }

/* правая колонка */
.psl-hero__text{
  color:#112B6F;
  width: 100%;
  min-height: 530px;
  display:flex; flex-direction:column; justify-content:space-around;
}
.psl-hero__title{
  margin:0 0 10px;
  color:#112B6F; font-weight:800; letter-spacing:.3px;
  font-size: clamp(28px, 3.2vw, 36px); line-height:1.15;
}
.psl-hero__subtitle{
  margin:0 0 20px; color:#E60940; font-weight:400;
  font-size: clamp(15px, 1.6vw, 20px);
}
.psl-hero__copy{
  color:#112B6F; font-size: clamp(15px, 1.2vw, 18px);
  line-height:1.7; max-width:72ch;
}
.psl-hero__copy p{ margin:0 0 14px }

/* ========= брейкпоинты ========= */

/* крупные планшеты/малые десктопы */
@media (max-width: 1200px){
  .psl-hero__grid{
    grid-template-columns: minmax(320px, 380px) 1fr;
    gap: clamp(20px, 3vw, 48px);
  }
  .psl-hero__media,
  .psl-hero__card{ max-width: 380px; }
  .psl-hero__text{ min-height: 380px; }
}

/* планшеты: одна колонка, текст сверху, медиа по центру */
@media (max-width: 900px){
  .psl-hero{ padding: 56px 0 44px; }
  .psl-hero__grid{ grid-template-columns: 1fr; gap: 24px; }
  .psl-hero__text{ order:1; min-height: initial; }
  .psl-hero__media{ order:2; margin-inline:auto; }
  .psl-hero__card{ margin-left:auto; margin-right:auto; }
}

/* телефоны */
@media (max-width: 560px){
  .psl-hero{ padding: 48px 0 40px; }
  .psl-hero__media,
  .psl-hero__card{ max-width: 320px; }
  .psl-hero__title{ font-size: clamp(24px, 7vw, 28px); }
  .psl-hero__subtitle{ font-size: 16px; }
  .psl-hero__copy{ font-size: 15px; }
}

/* очень узкие */
@media (max-width: 380px){
  .psl-hero__media,
  .psl-hero__card{ max-width: 280px; }
}

/* ===================================================================== */
/* ===== SERVICES PAGE ===== */
.psl-services{
  padding: clamp(56px, 6vw, 50px) 0 clamp(64px, 7vw, 50px);
}
.psl-services__title{
  text-align:center;
  color:#112B6F;
  font-weight:800;
  font-size: clamp(26px, 3vw, 35px);
  margin: 0 0 clamp(28px, 4vw, 48px);
  letter-spacing:.3px;
}

/* сетка → flex с переносом */
.psl-services__grid{
  display:flex;
  flex-wrap: wrap;                 /* <<< перенос строк */
  gap: clamp(20px, 2.8vw, 36px);
  justify-content: space-around;
}

/* карточка */
.psl-serv{
  color:#112B6F;
  max-width: 300px;
  flex: 1 1 23%;                   /* ~4 в ряд на больших */
  display: flex;
  flex-direction: column;
}

/* заголовок: не фиксируем ширину */
.psl-serv__heading{
  color:#112B6F;
  font-weight:800;
  font-size: clamp(16px, 1.4vw, 22px);
  letter-spacing:.4px;
  margin: 0 0 12px;
  max-width: none;                 /* <<< убираем жесткие 350px */
  width: auto;
}

/* медиа */
.psl-serv__media{
  margin:0 0 14px;
  border-radius: 12px;
  overflow:hidden;
  box-shadow: 16px -2px 3px 0 rgb(0 0 0 / 60%);
}
.psl-serv__media img{ display:block; width:100%; height:auto; }

/* тексты/кнопки */
.psl-serv__sub{
  color:#E60940;
  font-weight:400;
  margin: 6px 0 12px;
  font-size: 18px;
  text-align: center;
}
.psl-serv__text{
  font-size: 15px;
  line-height: 1.8;
  text-align: justify;
  min-height: 190px;
}
.psl-serv__cta{ margin-top: auto; text-align: center; } /* кнопка прижимается вниз */
.psl-btn{
  display:inline-block;
  background:#112B6F;
  color:#fff;
  padding: 13px 18px;
  text-decoration:none;
  font-weight:400;
  box-shadow: 0 6px 16px rgba(17,43,111,.18);
}
.psl-btn:hover{ background:#1E4BC2; }

/* ===== адаптив ===== */

/* <= 1200px: 2 колонки */
@media (max-width:1200px){
  .psl-serv{ flex: 1 1 46%; }      /* ~2 в ряд */
  .psl-serv__text{ min-height: 160px; }
  .psl-serv__media{ box-shadow: 12px -2px 3px 0 rgb(0 0 0 / 45%); } /* мягче тень */
}

/* <= 900px: чутка крупнее шрифты, больше зазоров */
@media (max-width:900px){
  .psl-services{ padding: 105px 0 44px; }
  .psl-services__grid{ gap: 22px; }
  .psl-serv__text{ min-height: 0; } /* пусть растёт по контенту */
}

/* <= 640px: 1 колонка */
@media (max-width:640px){
  .psl-serv{ flex: 1 1 100%; max-width: 520px; margin-inline: auto; }
  .psl-serv__media{ box-shadow: 10px -2px 2px 0 rgb(0 0 0 / 36%); }
  .psl-btn{ width: auto; }
}

/* ===================================================================== */


/* ===================================================================== */
/* ===== FEATURES PAGE ===== */
.psl-features{ padding: 0 0 40px }

.psl-container.features{ max-width: 1075px; }

.psl-feat__head{ text-align:center; margin-bottom: clamp(24px, 4vw, 40px) }
.psl-feat__title{
  color:#112B6F; font-weight:800;
  font-size: clamp(24px, 3vw, 35px);
  margin:0 0 6px; letter-spacing:.3px;
}
.psl-feat__lead{ color:#112B6F; font-weight:800; font-size: clamp(14px, 1.4vw, 20px) }

/* список */
.psl-feat__list{ display:grid; gap: clamp(18px, 2.5vw, 26px) }

/* элемент */
.psl-feat{
  display:grid;
  grid-template-columns: clamp(150px, 18vw, 220px) 1fr; /* кружок + контент */
  gap: clamp(16px, 3vw, 48px);
  align-items:start;
}
.psl-feat figure{ margin:0 }

/* столбец текста */
.psl-feat__body{
  min-height: clamp(150px, 18vw, 200px);
  display:flex; flex-direction:column; justify-content:space-around;
}

/* МЕДИА: прозрачный фон, тень по кругу */
.psl-feat__media{
  width: clamp(150px, 18vw, 200px);
  height: clamp(150px, 18vw, 200px);
  background: transparent;          /* было #fff */
  border-radius: 0;                  /* убираем прямоугольное скругление */
  box-shadow: none;                  /* убираем квадратную тень */
  overflow: visible;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 16px -2px 3px 0px rgb(0 0 0 / 60%);
  -webkit-box-shadow: 16px -2px 3px 0px rgb(0 0 0 / 60%);
  border-radius: 12px;
}
.psl-feat__thumb{
  width: 100%; height: 100%;
  border-radius: 50%; overflow: hidden;
  /* красивая тень именно у круга */
}
.psl-feat__thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
}

/* типографика */
.psl-feat__heading{
  color:#112B6F; font-weight:800; margin:0 0 8px;
  font-size: clamp(16px, 1.6vw, 22px); letter-spacing:.3px;
}
.psl-feat__sub{
  color:#E63D09; font-weight:400; margin:0 0 10px;
  font-size: clamp(14px, 1.4vw, 18px); font-style: italic;
}
.psl-feat__text{ color:#112B6F; line-height:1.8; font-size:18px }
.psl-feat__text p{ margin:0 }

/* адаптив */
@media (max-width: 800px){
  .psl-feat{
    grid-template-columns: clamp(120px, 22vw, 160px) 1fr;
  }
  .psl-feat__media{
    width:  clamp(120px, 22vw, 160px);
    height: clamp(120px, 22vw, 160px);
  }
  .psl-feat__body{ min-height: auto; }
}
@media (max-width: 560px){
  .psl-feat__media{
    width:  clamp(200px, 22vw, 160px);
    height: clamp(200px, 22vw, 160px);
  }
  .psl-feat{ grid-template-columns: 1fr; gap:16px }
  .psl-feat__media{ margin: 0 auto }        /* центрируем круг */
  .psl-feat__heading, .psl-feat__sub, .psl-feat__text{ text-align:justify }
  .psl-feat figure {
    margin: 0 auto;
  }
  .psl-feat__body {
    align-items: center;
  }
  .psl-feat__heading {
    font-size: 19px;
  }
  .psl-feat__sub {
    font-size: 17px;
  }
  .psl-feat__text p {
    font-size: 17px;
  }
}

/* ===================================================================== */
/* ===== CONTACT PAGE ===== */
body.psl-contact-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,.5)),
    url("/wp-content/uploads/2025/10/bg_concatcs.jpg");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}

.psl-contact{ padding: 0px 0px 80px 0px; }
.psl-contact__wrap{ display:flex; justify-content:center; }
.psl-contact__card{
  width: 100%;
  max-width: 630px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  box-shadow: 0 18px 40px rgba(0,0,0,.08);
  border-radius: 2px;
  padding: clamp(22px, 3.3vw, 36px);
}
.psl-contact__title{
  text-align:center;
  color:#000;
  font-weight:800;
  font-size: clamp(22px, 2.8vw, 30px);
  margin:0 0 18px;
  margin-top: 80px;
}

/* Contact Form 7 — общий вид */
.psl-contact .wpcf7-form p{ margin: 0 0 14px; }

.psl-contact input[type="text"],
.psl-contact input[type="email"],
.psl-contact input[type="tel"],
.psl-contact textarea{
  width:100%;
  max-width: 510px;
  border:2px solid #000;
  background:#fff;
  padding: 12px 14px;
  font-size:16px;
  line-height:1.3;
  outline: none;
  font-style: italic;
}
.psl-contact textarea{ min-height: 80px; resize: vertical;height: 80px; }

.psl-contact form {
  text-align: center;
}

.psl-contact input[type="submit"]{
  display:block;
  margin: 10px auto 0;
  background:#373B4D;
  color:#fff;
  border:0;
  padding: 15px 48px;
  font-weight:700;
  cursor:pointer;
  box-shadow: 0 6px 16px rgba(17,43,111,.18);
}
.psl-contact input[type="submit"]:hover{ background:#1E4BC2; }

/* Сообщения CF7 */
.psl-contact .wpcf7 form .wpcf7-response-output{ margin:16px 0 0; }

/* ===== CONTACT PAGE • responsive only ===== */

/* планшеты и уже */
@media (max-width: 1024px){
  .psl-contact__wrap{ padding: 0 24px; }           /* поля по бокам */
  .psl-contact__title{ margin-top: 56px; }
}

/* 768 и уже */
@media (max-width: 768px){
  .psl-contact__wrap{ padding: 0 20px; }
  .psl-contact__card{ padding: 20px; max-width: 640px; }
  .psl-contact__title{ margin-top: 40px; }
  .psl-contact {
    padding-top: 40px;
  }

  /* инпуты на всю ширину карточки */
  .psl-contact input[type="text"],
  .psl-contact input[type="email"],
  .psl-contact input[type="tel"],
  .psl-contact textarea{
    width: 100%;
    font-size: 16px;
  }
}

/* 560 и уже — «мобильная» */
@media (max-width: 560px){
  .psl-contact{ padding: 0 0 48px 0; }
  .psl-contact__wrap{ padding: 0 16px; }
  .psl-contact__card{ padding: 18px; border-radius: 2px; }
  .psl-contact__title{ margin-top: 28px; }
  .psl-contact {
    padding-top: 40px;
  }

  .psl-contact input[type="text"],
  .psl-contact input[type="email"],
  .psl-contact input[type="tel"],
  .psl-contact textarea{
    padding: 11px 12px;
    font-size: 15px;
    width: 75%;
  }

  /* кнопка удобнее пальцем */
  .psl-contact input[type="submit"]{
    /* width: 100%; */
    padding: 14px 18px;
  }
}

/* очень узкие девайсы */
@media (max-width: 380px){
  .psl-contact__wrap{ padding: 0 12px; }
  .psl-contact__card{ padding: 16px; }
  .psl-contact__title{ margin-top: 22px; }
}

/* ===================================================================== */


/* ===== Footer ===== */
.psl-container{
  max-width: 1785px;
  margin: 0 auto;
  padding: 0 16px;
}

/* сам футер и верхний блок */
.psl-footer { position: relative; z-index: 0; }

.psl-footer__top{
  position: relative;
  z-index: 1; /* поверх фона body */
  /* ДВА слоя: 1) текстура; 2) сплошной цвет-подложка */
  background:
    url('/wp-content/uploads/2025/10/bg-footer.png') center top / auto repeat,
    #ffffff; /* или нужный светлый */
  padding: 5px 0;
  color: #1a1a1a;
  text-align: center;
}

/* синяя полоса снизу как была */
.psl-footer__bar{ background:#112B6F; height:28px; }


.psl-footer__line{
  margin: 0;
  line-height: 1.6;
  font-size: 15px;
}
.psl-footer__line a{
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(0,0,0,.2);
}
.psl-footer__line a:hover{
  border-bottom-color: rgba(0,0,0,.5);
}

.psl-footer__bottom{
  background-color: #112B6F;
  color: #fff;
  text-align: center;
  padding: 10px 12px;
}
.psl-footer__copy{
  margin: 0;
  font-size: 14px;
  letter-spacing: .2px;
}

/* Мобилка */
@media (max-width: 640px){
  .psl-footer__top{ padding: 5px 0; }
  .psl-footer__line{ font-size: 14px; }
  .psl-footer__bottom{ padding: 9px 10px; }
  .psl-footer__copy{ font-size: 13px; }
}

/* стабильный контейнер под изображение */
.psl-serv__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio: 3 / 2; /* под свои фото, если другой формат — поменяй */
  object-fit: cover;
}

/* ускоряем композицию */
.psl-serv,
.psl-serv__media,
.psl-serv__heading,
.psl-serv__sub,
.psl-serv__text,
.psl-serv__cta { will-change: transform, opacity; }

/* стабилизируем раскладку картинок в hero */
.psl-hero__card img{
  display:block; width:100%; height:auto;
  aspect-ratio: 700 / 470; /* подгони под реальное соотношение */
}

/* производительность анимаций + уважение reduce-motion */
.psl-hero__card,
.psl-hero__title,
.psl-hero__subtitle,
.psl-hero__copy p { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce){
  [data-aos]{ transition:none!important; animation:none!important; opacity:1!important; transform:none!important; }
}

/* изображение внутри круга — стабильное соотношение сторон */
.psl-feat__thumb img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio: 1 / 1; /* круг из квадрата; подгони если нужно другое */
}

/* производительность + уважение reduce-motion */
.psl-feat,
.psl-feat__media,
.psl-feat__heading,
.psl-feat__sub,
.psl-feat__text { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce){
  [data-aos]{ transition:none!important; animation:none!important; opacity:1!important; transform:none!important; }
}

/* performance hints */
.psl-contact__card,
.psl-contact__title,
.psl-contact .wpcf7-form p,
.psl-contact .wpcf7-form input[type="submit"] { will-change: transform, opacity; }

/* уважение prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  [data-aos]{ transition:none!important; animation:none!important; opacity:1!important; transform:none!important; }
}