/******************************************************************
Theme Name: Scape Child
Theme URI: http://themes.whiteboxstud.io/scape/main/landing
Description: Scape Child Theme
Author: Whitebox-Studio
Author URI: http://themeforest.net/user/whitebox-studio
Template: scape
Version: 1.0

*/
:root{
  --radius: 0px;
  --arrow-bg: rgba(255,255,255,.15);
  --arrow-hover: rgba(255,255,255,.35);
  --arrow-color: #fff;
  --transition: .6s cubic-bezier(.22,.7,.26,1);
  --gold: linear-gradient(90deg,#d4af37,#ffd700,#d4af37);
}

*{box-sizing:border-box;}
html,body{
  margin:0; padding:0;
  background:#0f1318; color:#fff;
  font-family:'Montserrat',sans-serif;
}


#footer .widget a {
    color: #f6f7fc;
    letter-spacing: 0.02em;
    font-family: 'Montserrat';
}

.slider{width:100%;margin:0;}

.viewport{
  position:relative;
  width:100%;
  aspect-ratio:16/7;
  overflow:hidden;
  background:#111;
  isolation:isolate;
}

.slides{position:relative;height:100%;}

.slide{
  position:absolute;inset:0;
  opacity:0;transform:translateX(40px) scale(1.02);
  transition:opacity var(--transition),transform var(--transition);
}
.slide.active{
  opacity:1;transform:translateX(0) scale(1);
  z-index:2;
}
.slide img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
  transform:scale(1.05);
  transition:transform 4s ease;
}
.slide.active img{transform:scale(1.02);}
.overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.0) 40%,rgba(0,0,0,.7) 100%);
  z-index:1;
}

/* подложка под текст */
.caption-bg{
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(6px);
  border-radius:16px;
  padding:1.8em 2em;
  display:inline-block;
  max-width:620px;
}

/* контент */
.caption{
  position:absolute;bottom:10%;left:8%;right:8%;
  z-index:5;
}
.caption h3{
  margin:0 0 .3em;
  font-size:clamp(28px,5vw,52px);
  line-height:1.1;
  font-weight:700;
	color: #fff;
}
.caption p{
  margin:0 0 1.2em;
  color:rgba(255,255,255,.9);
  font-size:clamp(15px,2vw,18px);
  line-height:1.6;
}

/* золотая кнопка */
.btn-gold{
  display:inline-block;
  padding:.8em 1.8em;
  border-radius:12px;
  color:#000;
  background:var(--gold);
  background-size:200% auto;
  font-weight:600;
  text-decoration:none;
  position:relative;
  overflow:hidden;
  transition:all .4s ease;
  box-shadow:0 0 18px rgba(255,215,0,.4);
}
.btn-gold::before{
  content:"";
  position:absolute;
  top:0; left:-75px;
  width:50px; height:100%;
  background:rgba(255,255,255,.6);
  transform:skewX(-20deg);
  transition:0.5s;
  opacity:0;
}
.btn-gold:hover{
  background-position:right center;
  box-shadow:0 0 28px rgba(255,215,0,.7);
  transform:translateY(-2px);
}
.btn-gold:hover::before{
  left:120%;
  opacity:1;
}

/* стрелки */
.nav{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:space-between;
  z-index:10;pointer-events:none;
  padding:0 14px;
}
.nav button{
  pointer-events:auto;
  width:58px;height:58px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.25);
  background:var(--arrow-bg);
  color:var(--arrow-color);
  display:grid;place-items:center;
  cursor:pointer;
  transition:background .25s ease,transform .2s ease,border-color .2s ease;
  backdrop-filter:blur(4px);
}
.nav button:hover{
  background:var(--arrow-hover);
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.5);
}
.nav svg{width:26px;height:26px;stroke-width:2;}

@media (max-width:768px){
  .viewport{aspect-ratio:2/3;}
  .caption{bottom:8%;}
  .caption h3{font-size:clamp(22px,6vw,34px);}
  .caption p{font-size:clamp(14px,3.5vw,16px);}
  .nav button{width:46px;height:46px;}
  .caption-bg{padding:1em 1.4em;}
}


.f-wrap{max-width:1400px;margin:110px auto;padding:0px;margin-bottom: 0px;}
.f-page-title{font-size:32px;margin:0 0 16px; font-family: 'Montserrat'; letter-spacing: 0.02em;}
.f-filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 24px;}
.f-filter{padding:8px 14px;border-radius:999px;border:1px solid #ddd;background:#f7f7f7;cursor:pointer;text-decoration:none;color:#222;transition:.2s;}
.f-filter:hover{transform:translateY(-1px);}
.f-filter.is-active{background:#111;color:#fff;border-color:#111;}
.f-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px; margin-bottom: 35px}
@media(max-width:900px){.f-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.f-grid{grid-template-columns:1fr;}}
.f-card{background:#fff;border:1px solid #eee;border-radius:16px;overflow:hidden;transition:.2s;display:block;}
.f-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.08);transform:translateY(-2px);}
.f-card__image{aspect-ratio:4/3;overflow:hidden;background:#fafafa;}
.f-card__image img{width:100%;height:100%;object-fit:cover;display:block;}
.f-card__meta{padding:12px 14px;}
.f-card__title{margin:0 0 6px;font-size:18px;line-height:1.3;}
.f-loadmore{display:inline-block;margin:24px auto 24px;padding:12px 18px;border-radius:12px;background:#111;color:#fff;text-decoration:none;}


/* Только для каталога (если класс в body есть) */
.page-template-catalog-acf .site-footer,
.page-template-catalog-acf .footer-bottom {
  font-family: 'Montserrat';
}

/* или глобально (если нужно везде) */

.site-footer, .footer-bottom {
  font-family: 'Montserrat';
}

.f-catalog.is-loading .f-grid { opacity: .35; }
.f-grid { transition: opacity .18s ease; }

.f-skeleton{
  display:none;
  gap:16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.f-catalog.is-loading .f-skeleton{ display:grid; }

@media (max-width: 1024px){ .f-skeleton{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px){ .f-skeleton{ grid-template-columns: 1fr; } }

.f-skeleton__item{
  border-radius:14px;
  height:320px;
  background: linear-gradient(90deg, #f2f2f2 25%, #e9e9e9 37%, #f2f2f2 63%);
  background-size: 400% 100%;
  animation: fShimmer 1.1s infinite;
}
@keyframes fShimmer { 0%{background-position:100% 0} 100%{background-position:0 0} }

