/* ──────────────────────────────────────────────────────────────
   Спецпроекты aqshamnews.kz — общие стили конструктора блоков.
   Акцентный цвет задаётся из админки через --accent на <html>.
   Шрифт Montserrat лежит у нас: латиница + кириллица, включая
   казахские ә ғ қ ң ө ұ ү һ і.
   ────────────────────────────────────────────────────────────── */
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-cyrillic-ext.woff2)format("woff2");font-weight:400 700;font-display:swap;
  unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-cyrillic.woff2)format("woff2");font-weight:400 700;font-display:swap;
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-latin.woff2)format("woff2");font-weight:400 700;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-cyrillic-ext-i.woff2)format("woff2");font-weight:400 700;font-style:italic;font-display:swap;
  unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-cyrillic-i.woff2)format("woff2");font-weight:400 700;font-style:italic;font-display:swap;
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Mont;src:url(/fonts/montserrat/mont-latin-i.woff2)format("woff2");font-weight:400 700;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --accent:#be3449;            /* перекрывается из админки */
  --night:#141a26;
  --ink:#221e1c;
  --paper:#f7f4f0;
  --tint:#ece6e2;
  --ash:#6b645e;
  --col:32.5rem;
  --step:clamp(2.75rem,6vw,5.5rem);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:Mont,system-ui,sans-serif;font-size:clamp(1rem,.45vw + .92rem,1.0938rem);
  line-height:1.68;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:.07em;text-decoration-color:var(--accent)}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
figure{margin:0}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}

.sp-col{max-width:var(--col);margin-inline:auto;padding-inline:1.25rem}
.sp-wide{max-width:64rem;margin-inline:auto;padding-inline:1.25rem}
.sp-block{margin-block:var(--step)}

/* обложка */
.sp-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;background:var(--night);overflow:hidden}
.sp-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.sp-hero__scrim{position:absolute;inset:0}
.sp-hero--light .sp-hero__scrim{background:linear-gradient(180deg,rgba(20,26,38,.25)0%,rgba(20,26,38,.05)35%,rgba(20,26,38,.6)80%,rgba(20,26,38,.8)100%)}
.sp-hero--medium .sp-hero__scrim{background:linear-gradient(180deg,rgba(20,26,38,.5)0%,rgba(20,26,38,.15)35%,rgba(20,26,38,.82)78%,rgba(20,26,38,.96)100%)}
.sp-hero--dark .sp-hero__scrim{background:linear-gradient(180deg,rgba(20,26,38,.7)0%,rgba(20,26,38,.5)35%,rgba(20,26,38,.92)78%,rgba(20,26,38,1)100%)}
.sp-hero__body{position:relative;width:100%;max-width:64rem;margin-inline:auto;padding:0 1.25rem clamp(3.5rem,9vh,6rem)}
.sp-hero__up{font-weight:600;font-size:.84rem;letter-spacing:.14em;color:#fff;opacity:.85;margin:0 0 1.5rem;
  display:inline-block;border-bottom:2px solid var(--accent);padding-bottom:.35rem}
.sp-hero__title{font-weight:700;color:#fff;margin:0;font-size:clamp(1.95rem,6vw,4.1rem);line-height:1.06;letter-spacing:-.03em;max-width:17ch}
.sp-hero__sub{font-weight:500;color:#fff;opacity:.88;margin:.7rem 0 0;font-size:clamp(1.15rem,2.6vw,1.9rem);line-height:1.25;max-width:24ch}
.sp-hero__down{position:absolute;left:50%;bottom:1.4rem;translate:-50% 0;width:26px;height:26px;opacity:.55}
.sp-hero__down path{stroke:#fff;stroke-width:1.6;fill:none}
@media (prefers-reduced-motion:no-preference){
  .sp-hero__up,.sp-hero__title,.sp-hero__sub{animation:spRise .9s cubic-bezier(.2,.7,.3,1) backwards}
  .sp-hero__title{animation-delay:.08s}.sp-hero__sub{animation-delay:.16s}
  .sp-hero__down{animation:spNudge 2.4s ease-in-out 1.2s infinite}}
@keyframes spRise{from{opacity:0;transform:translateY(1.1rem)}to{opacity:1;transform:none}}
@keyframes spNudge{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,6px)}}

/* текстовые блоки */
.sp-lead{font-weight:500;font-size:clamp(1.1rem,.8vw + .95rem,1.35rem);line-height:1.5}
.sp-h2{font-weight:700;font-size:clamp(1.45rem,2.9vw,2.1rem);line-height:1.18;letter-spacing:-.02em;margin:0;max-width:22ch}
.sp-h2--large{font-size:clamp(1.9rem,4.4vw,3rem);max-width:18ch}
.sp-rule::before{content:"";display:block;width:2.5rem;height:3px;background:var(--accent);margin-bottom:1.1rem}
.sp-up{font-weight:500;font-size:.95rem;color:var(--ash);margin:0 0 .35rem}
.sp-quote{font-weight:500;font-size:clamp(1.05rem,.7vw + .95rem,1.25rem);line-height:1.45;
  border-left:3px solid var(--accent);padding-left:1.4rem;margin:0}
.sp-quote__who{display:block;margin-top:.7rem;font-size:.92rem;font-weight:500;color:var(--ash)}
.sp-note{background:var(--tint);padding:clamp(1.4rem,3vw,2rem);font-size:1rem;line-height:1.65}

/* фото */
.sp-photo--full img{width:100%;max-height:82svh;object-fit:cover}
.sp-cap{margin-top:.65rem;font-size:.88rem;color:var(--ash);max-width:var(--col)}
.sp-photo--full .sp-cap{margin-inline:auto;padding-inline:1.25rem}

.sp-duo{display:grid;gap:clamp(1.5rem,4vw,3rem);align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,.78fr)}
.sp-duo--left>figure{order:-1}
@media (max-width:46rem){.sp-duo{grid-template-columns:1fr}.sp-duo--left>figure{order:0}}

.sp-cols{display:grid;gap:clamp(1.4rem,3vw,2.5rem);font-size:1rem;line-height:1.65}
.sp-cols--2{grid-template-columns:repeat(2,1fr)}
.sp-cols--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:52rem){.sp-cols--2,.sp-cols--3{grid-template-columns:1fr}}

/* цитата на фото */
.sp-onphoto{position:relative;min-height:min(88svh,46rem);display:flex;align-items:center;background:var(--night)}
.sp-onphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sp-onphoto__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,26,38,.88)0%,rgba(20,26,38,.62)55%,rgba(20,26,38,.35)100%)}
.sp-onphoto__txt{position:relative;max-width:64rem;margin-inline:auto;padding:3rem 1.25rem;width:100%}
.sp-onphoto__txt p{font-weight:500;color:#fff;max-width:30rem;font-size:clamp(1.15rem,1.1vw + 1rem,1.6rem);line-height:1.4;margin:0}

/* слайдер: на чистом CSS, без библиотек */
.sp-slider{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:thin;padding-bottom:.75rem}
.sp-slider>figure{flex:0 0 min(86%,46rem);scroll-snap-align:center}
.sp-slider img{width:100%;aspect-ratio:3/2;object-fit:cover}
.sp-slider__hint{margin-top:.6rem;font-size:.85rem;color:var(--ash)}

/* видео */
.sp-video{position:relative;aspect-ratio:16/9;background:var(--night)}
.sp-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* финал */
.sp-final{background:var(--accent);color:#fff;margin-top:var(--step)}
.sp-final__in{max-width:44rem;margin-inline:auto;padding:clamp(3rem,8vw,5.5rem)1.25rem;
  font-weight:600;font-size:clamp(1.2rem,1.3vw + 1rem,1.7rem);line-height:1.38}
.sp-foot{padding:2.25rem 1.25rem 3rem;text-align:center;font-weight:500;font-size:.9rem;color:var(--ash)}
.sp-foot a{color:var(--ink)}

/* плашка черновика */
.sp-draft{position:fixed;left:50%;bottom:1rem;translate:-50% 0;z-index:9999;
  background:var(--accent);color:#fff;font-weight:600;font-size:.85rem;
  padding:.55rem 1.1rem;border-radius:999px;box-shadow:0 4px 16px rgba(0,0,0,.25)}
