/*-----------------------------------------------------------------------------------
Theme Name:psy
Theme URI:https://psykontact.ru
Description:Web Studio Optima Design
Author:Serhii Dibrova
Author URI:https://optima-design.pro/
--------*/
html {height:100%;width:100%;scroll-behavior: smooth;}
::-webkit-scrollbar {width: 6px; height:2px; border-radius:4px;}
::-webkit-scrollbar-track {background-color: #eee;box-shadow: 0 0 1px 1px #fff inset;}
::-webkit-scrollbar-thumb {background-color: #f3c5d0;}
::-webkit-scrollbar-thumb:hover {background-color: #d48598;}
::-webkit-input-placeholder {color: #96a7bd!important;}
:focus-visible {outline: none;}
body {font-family: "Montserrat Alternates", sans-serif; font-size: 17px;line-height: 1.7;color: #666; background: #f2edea;}
a {transition: linear .3s;}
img {max-width: 100%; height: auto;}
/*TYPO*/
blockquote {position: relative;background: #f2edea;margin: 1.5rem 0;padding: 20px 80px 20px 20px;border-radius: 20px;z-index: 3;}
ol, ul {padding-left: 1rem;}
.post__entry li {position: relative;list-style: none;padding-left: 34px;}
.post__entry li:before {
    content: '';
    background: url(images/icon-check.svg) no-repeat 0 0;
    position: absolute;
    top: 7px;
    left: 0;
    display: block;
    width: 18px;
    height: 18px;}
.post__entry a:hover {color: #b28496}
.h1, h1 {font-size: 2rem; color: #b28496}
h2,.h2 {font-size: 1.8rem;margin: 20px 0;color: #b28496}
h3,.h3 {font-size: 1.5rem;margin: 20px 0;color: #b28496}
h1,h2,h3,h4,h5 {font-weight: 600;}
h3,h4,h5,b,strong {color: #353535}
b,strong {font-weight: 600;}
/*HEADER*/
header {display: flex;align-items: center;justify-content: space-around;padding: 10px 15px;}
.sticky {position: sticky;top: 0; z-index: 10000; background: #f2edea;box-shadow: 0 0 5px #ddd;}
.logo,.quote {padding: 0 15px;}
.logo img {max-width: 100px;}
.quote a {display: flex;font-weight: 500;letter-spacing: 1px;padding: 10px 20px;background: #b28496;border-radius: 20px;color: #fff;text-decoration: none;}
.quote a:hover {color:#eee;background: #ad6d86;transform: scale(1.05);}
/*MAIN*/
.page-wrapper {max-width: 1530px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.08);
    box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.08);
    position: relative;
    margin: 0 auto;
    width: 100%;
    min-width: 300px;
}


/*POST*/

.post__entry a {color:#212529; font-weight: 600;}
.post__entry_img {position: relative;}
.post__entry img {border-radius: 20px; margin: 20px auto; text-align: center;}
#breadcrumbs {font-size: 16px;font-weight: 300;
    position: absolute;
    left: 20px;
    padding: 5px 20px;
    border-radius: 20px;
    bottom: 38px;
    z-index: 2;
    color: #fff;
    background: #b28496a6;
}
#breadcrumbs a {font-weight: 300; color:#fff; text-decoration: none;}
#breadcrumbs a:hover {text-decoration: underline;}
.breadcrumb_last {display: none;}
 .post-card{border:0;border-radius:1rem;box-shadow:0 10px 24px rgba(0,0,0,.08);overflow:hidden;background:#f2edea;}
  .post-media{position:relative;border-top-left-radius:1rem;border-top-right-radius:1rem;overflow:hidden;}
  .post-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
  .post-card:hover .post-media img{transform:scale(1.04);}
  .date-badge{position:absolute;top:1rem;right:1rem;background:#b57658;color:#fff;font-weight:700;border-radius:.5rem;padding:.35rem .6rem;line-height:1;text-transform:uppercase;font-size:.75rem;box-shadow:0 4px 10px rgba(0,0,0,.12);}
  .post-body{position:relative;margin-top:-1.8rem;background:#fff;border-radius:.75rem;padding:1.25rem 1.25rem 1rem;margin-left:1rem;margin-right:1rem;box-shadow:0 10px 24px rgba(0,0,0,.06);}
  .author{position:absolute;left:1rem;top:-1.25rem;width:40px;height:40px;border-radius:50%;border:3px solid #fff;overflow:hidden;box-shadow:0 6px 14px rgba(0,0,0,.15);}
  .byline{font-size:.85rem;color:#7a7a7a;padding-left:3rem;margin-bottom:.4rem;}
  .post-title{font-size:1.25rem;font-weight:700;color:#2a2a2a;margin:0;min-height: 50px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;}
  .post-title a{color:inherit;text-decoration:none;}
  .post-title a:hover{text-decoration:underline;}
  .post-footer{display:flex;justify-content:space-between;align-items:center;color:#7a7a7a;font-weight:600;font-size:.9rem;padding:0 1.25rem 1.1rem;margin-top:.6rem;}
  .post-footer .more{display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;color:#7a7a7a;}
  .post-footer .more:hover{color:#2a2a2a;}

/*EFFECTS*/
.img__slide_in {max-width: 100%; clip-path: inset(100% 0% 0% 0%);}


.pagination {    display: flex;
    align-items: center;
    justify-content: center;}
.p_link {display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    width: 30px;
    height: 30px;
    margin: 0 5px;
    border-radius: 50%;
    background: #b28496;}
.p_link.inactive    {background: #f2edea;
    color: #222;}
.p_link.inactive:hover {color: #fff;background: #b28496;}
/*FOOTER*/
/* GO TO TOP */
.go-top {position:fixed; cursor:pointer; top:0; right:15px; color:#fff; background:#b28496; z-index:99999999; text-align:center; 
border-radius: 50%; width:46px; height:46px; line-height:46px; opacity:0; visibility:hidden; transition:0.9s;}
.go-top.active {top:98%; transform:translateY(-98%); opacity:1; visibility:visible;}
.go-top svg {position:absolute; top:50%; transform:translateY(-50%); left:0; right:0; margin:0 auto; transition:.5s;}
.go-top::before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; z-index:-1; background:#ad6d86; opacity:0; visibility:hidden; transition:.5s;}

.go-top:hover::before, .go-top:focus::before {opacity:1; visibility:visible;border-radius: 50%;}

footer {color: #fff;background: #212529; padding: 50px 0;}
footer a {color:#fff; text-decoration: none;}
ul.footer__menu  {list-style:none; padding-left:0;}
ul.footer__menu a {position: relative;display: inline-block; overflow: hidden;text-decoration: none;}
ul.footer__menu a:hover {color:#b28496;}
ul.footer__menu a::after {content: '';position: absolute;bottom: 0;left: 0;width: 0%;height: 1px; background-color: #b28496;transition: width 0.3s ease;}
ul.footer__menu a:hover::after {width: 100%;}

@media (max-width:1260px) {
    .logo {display: none;}
}
@media (max-width:1159px) {
    header {justify-content: space-between;}
}