/* ═══════════════════════════════════════
   Front Page Builder — Frontend CSS
   ═══════════════════════════════════════ */

.fpb-page { width: 100%; }

.fpb-section { box-sizing: border-box; }

.fpb-container {
    box-sizing: border-box;
    width: 100%;
    padding: 0 20px;
}

/* Полноширинный контейнер — Hero, CTA прижаты к краям секции */
.fpb-container-full {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
}

/* Кнопка */
.fpb-btn {
    display: inline-block;
    padding: .7em 2.5em;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    transition: opacity .2s, transform .15s;
    cursor: pointer;
    border: none;
    line-height: 1.4;
}
.fpb-btn:hover { opacity: .85; transform: translateY(-1px); color: inherit; text-decoration: none; }

/* Заголовок секции */
.fpb-section-title {
    margin: 0 0 32px;
    font-size: 28px;
    font-weight: 700;
    position: relative;
    padding-bottom: 16px;
}
.fpb-title-center { text-align: center; }
.fpb-title-lined::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 3px;
    background: currentColor;
    opacity: .35;
}
.fpb-title-center.fpb-title-lined::after {
    left: 50%;
    transform: translateX(-50%);
}

/* ─── HERO ─── */
.fpb-hero { overflow: hidden; }
.fpb-block-hero .fpb-container-full,
.fpb-block-cta  .fpb-container-full { padding: 0; }
.fpb-hero-title {
    font-size: clamp(24px, 5vw, 52px);
    font-weight: 800;
    margin: 0 0 16px;
    line-height: 1.2;
    color: inherit;
}
.fpb-hero-subtitle {
    font-size: clamp(14px, 2vw, 20px);
    margin: 0 0 28px;
    opacity: .9;
    color: inherit;
}

/* ─── О НАС ─── */
.fpb-about {
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
}
.fpb-about-text { flex: 1; min-width: 280px; }
.fpb-about-img  { flex: 1; min-width: 280px; }
.fpb-about-img img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    display: block;
}
.fpb-about-imgLeft { flex-direction: row-reverse; }
.fpb-about-content { line-height: 1.8; font-size: 15px; }
.fpb-about-content p { margin: 0 0 14px; }

/* ─── КАРТОЧКИ ─── */
.fpb-cards-grid {
    display: grid;
    grid-template-columns: repeat(var(--cols, 4), 1fr);
    gap: 24px;
}
.fpb-card-item { text-align: center; }
.fpb-card-img-wrap {
    margin: 0 auto 16px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fpb-img-circle  { border-radius: 50%; border: 4px solid #fff; box-shadow: 0 2px 12px rgba(0,0,0,.12); }
.fpb-img-rounded { border-radius: 12px; }
.fpb-img-square  { border-radius: 0; }
.fpb-card-img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.fpb-card-title { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.fpb-card-text  { font-size: 14px; line-height: 1.6; color: #555; }

/* ─── ИКОНКИ ─── */
.fpb-icons-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 32px;
}
.fpb-icon-item { text-align: center; }
.fpb-icon-link {
    display: inline-block;
    transition: transform .2s, opacity .2s;
}
.fpb-icon-link:hover { transform: scale(1.1); opacity: .85; }
.fpb-icon-link img { display: block; object-fit: contain; }
.fpb-icon-label { font-size: 12px; color: #777; margin-top: 6px; }

/* ─── ГАЛЕРЕЯ ─── */
.fpb-gallery {
    display: grid;
    grid-template-columns: repeat(var(--cols, 3), 1fr);
    gap: 12px;
}
.fpb-gallery-item { overflow: hidden; border-radius: 6px; aspect-ratio: 4/3; }
.fpb-gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; display: block; }
.fpb-gallery-item:hover img { transform: scale(1.04); }
.fpb-gallery-item a { display: block; height: 100%; }

/* Лайтбокс */
.fpb-lightbox {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; align-items: center; justify-content: center;
}
.fpb-lb-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.88); }
.fpb-lb-img-wrap { position: relative; z-index: 1; max-width: 90vw; max-height: 90vh; }
.fpb-lb-img-wrap img { max-width: 90vw; max-height: 85vh; border-radius: 4px; display: block; }
.fpb-lb-close {
    position: absolute; top: -40px; right: 0;
    background: none; border: none; color: #fff; font-size: 28px; cursor: pointer;
}

/* ─── ТЕКСТ ─── */
.fpb-text-content { line-height: 1.8; font-size: 15px; }
.fpb-text-content p { margin: 0 0 14px; }

/* ════════════════════════════════════
   АДАПТИВ
   ════════════════════════════════════ */
@media (max-width: 1024px) {
    .fpb-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .fpb-gallery    { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .fpb-section { padding-left: 16px !important; padding-right: 16px !important; }
    .fpb-about   { flex-direction: column !important; gap: 24px; }
    .fpb-about-imgLeft { flex-direction: column !important; }
    .fpb-cards-grid    { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .fpb-gallery       { grid-template-columns: repeat(2, 1fr); }
    .fpb-section-title { font-size: 22px; }
    .fpb-hero-title    { font-size: 26px; }
    .fpb-icons-row     { gap: 20px; }
    .fpb-cta           { padding: 30px 20px !important; }
}

@media (max-width: 400px) {
    .fpb-cards-grid { grid-template-columns: 1fr; }
    .fpb-gallery    { grid-template-columns: 1fr; }
}
