/* === /seo/ 13-reviews — Figma 388:6198 (desktop), 423:6151 (mobile) === */
.fmf2 .seo-reviews{padding-bottom:0}
.fmf2 .seo-reviews__head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:40px}
.fmf2 .seo-reviews__head .eyebrow{color:rgba(26,26,26,.6)}
.fmf2 .seo-reviews__head .sect-title{max-width:909px}
.fmf2 .seo-reviews__all{flex:none;margin-top:28px}
.fmf2 .seo-reviews__all--mobile{display:none}

/* лента: на 1320px — 4 карточки по 312px с шагом 24px */
.fmf2 .seo-reviews__track{gap:24px;margin:0;padding:0}

/* карточка: рамка #EBEBEB с «разрывами» 9px на углах (как .seo-cut) */
.fmf2 .seo-review{--cut:9px;--cut-c:var(--c-line);position:relative;display:flex;flex-direction:column;
  width:312px;padding:24px 24px 0;background:#fff}
.fmf2 .seo-review::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(var(--cut-c),var(--cut-c)) var(--cut) 0/calc(100% - 2 * var(--cut)) 1px no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) var(--cut) 100%/calc(100% - 2 * var(--cut)) 1px no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) 0 var(--cut)/1px calc(100% - 2 * var(--cut)) no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) 100% var(--cut)/1px calc(100% - 2 * var(--cut)) no-repeat}
.fmf2 .seo-review__name{font-size:20px;font-weight:500;line-height:1.2;color:var(--c-ink)}
.fmf2 .seo-review__role{margin-top:8px;font-size:16px;line-height:1.4;color:rgba(26,26,26,.6)}

/* ссылка на скан растянута на всю карточку (::after) */
.fmf2 .seo-review__scan{display:block;margin-top:auto;padding-top:40px}
.fmf2 .seo-review__scan::after{content:"";position:absolute;inset:0;z-index:2}
.fmf2 .seo-review__scan:focus-visible{outline:none}
.fmf2 .seo-review:has(.seo-review__scan:focus-visible){outline:2px solid var(--c-accent);outline-offset:2px}

/* превью: верх письма во всю ширину, рамка сверху и по бокам с белыми углами 9px,
   снизу растворяется в белый (Figma: градиент с 106px из 275px) */
.fmf2 .seo-review__img{position:relative;display:block;height:275px;overflow:hidden;background:#fff;
  border:1px solid var(--c-line);border-bottom:0}
.fmf2 .seo-review__img::before,.fmf2 .seo-review__img::after{content:"";position:absolute;top:-1px;z-index:1;width:9px;height:9px;background:#fff}
.fmf2 .seo-review__img::before{left:-1px}
.fmf2 .seo-review__img::after{right:-1px}
.fmf2 .seo-review__img img{width:100%;height:100%;object-fit:cover;object-position:top center;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 106px,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0,#000 106px,transparent 100%)}

/* наведение / фокус: весь кадр — скан, фиолетовая подложка и лупа (Figma 414:1118) */
.fmf2 .seo-review__hover{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;
  background:
    linear-gradient(180deg,rgba(255,255,255,0) 0%,#6657C2 100%),
    linear-gradient(rgba(102,87,194,.1),rgba(102,87,194,.1)),
    var(--scan) center top/100% auto no-repeat #fff;
  opacity:0;transition:opacity .2s ease;pointer-events:none}
.fmf2 .seo-review__zoom{width:48px;height:48px;color:#fff}
.fmf2 .seo-review__zoom *{stroke:currentColor}
.fmf2 .seo-review:hover .seo-review__hover,
.fmf2 .seo-review__scan:focus-visible .seo-review__hover{opacity:1}

/* лайтбокс (assets/js/13-reviews.js) */
/* margin:auto — штатное центрирование dialog, которое снимает reset home.css (.fmf2 *{margin:0}) */
.fmf2 .seo-lightbox{margin:auto;max-width:min(920px,calc(100vw - 32px));max-height:calc(100dvh - 32px);width:fit-content;padding:0;border:0;
  background:transparent;overflow:visible}
.fmf2 .seo-lightbox::backdrop{background:rgba(6,5,7,.8)}
.fmf2 .seo-lightbox__img{display:block;max-width:100%;max-height:calc(100dvh - 32px);width:auto;height:auto;background:#fff}
.fmf2 .seo-lightbox__close{position:absolute;top:8px;right:8px;z-index:1;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:var(--c-dark);color:#fff;transition:background .18s ease}
.fmf2 .seo-lightbox__close:hover{background:var(--c-accent)}
.fmf2 .seo-lightbox__close .ic-svg{width:24px;height:24px}
.fmf2 .seo-lightbox__close .ic-svg *{stroke:currentColor}
html.seo-lightbox-open{overflow:hidden}

@media (max-width:640px){
  .fmf2 .seo-reviews{padding-top:64px}
  .fmf2 .seo-reviews__head{margin-bottom:32px}
  .fmf2 .seo-reviews__head .eyebrow{margin-bottom:16px;line-height:1.4}
  .fmf2 .seo-reviews__head .sect-title{font-size:32px;line-height:1.2}
  .fmf2 .seo-reviews__all{display:none}
  .fmf2 .seo-reviews__all--mobile{display:flex;width:100%;height:46px;margin-top:32px}
  .fmf2 .seo-review{width:100%;padding:16px 16px 0}
  .fmf2 .seo-review__name{font-size:18px}
  .fmf2 .seo-review__scan{padding-top:24px}
  .fmf2 .seo-review__img img{
    -webkit-mask-image:linear-gradient(180deg,#000 0,#000 179px,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0,#000 179px,transparent 100%)}
}
@media (prefers-reduced-motion:reduce){
  .fmf2 .seo-review__hover{transition:none}
}