/* Start:/local/templates/premium_clinic/css/about.css?176493338616045*/
/* ==== Hero (только на странице) ==== */
.hero-section {
    display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; margin-bottom:80px; padding:60px 0;
}
.hero-title { font-size:42px; font-weight:700; line-height:1.2; margin-bottom:20px; color:#333; }
.hero-title .accent { color:#17a2b8; }
.hero-subtitle { font-size:20px; color:#666; line-height:1.5; }
.hero-image img {
    width:100%; height:400px; object-fit:cover; border-radius:20px; box-shadow:0 20px 40px rgba(0,0,0,.1);
}

/* ==== Заголовки секций (строго в секциях страницы) ==== */
.about-section .section-header,
.services-section .section-header,
.licenses-section .section-header,
.gallery-section .section-header,
.team-section .section-header,
.values-section .section-header,
.contact-section .section-header {
    text-align:center; margin-bottom:60px;
}
.about-section .section-title,
.services-section .section-title,
.licenses-section .section-title,
.gallery-section .section-title,
.team-section .section-title,
.values-section .section-title,
.contact-section .section-title {
    font-size:36px; font-weight:700; color:#333; margin-bottom:20px;
}
.about-section .section-line,
.services-section .section-line,
.licenses-section .section-line,
.gallery-section .section-line,
.team-section .section-line,
.values-section .section-line,
.contact-section .section-line {
    width:80px; height:4px; background:linear-gradient(135deg,#17a2b8,#20c997); margin:0 auto; border-radius:2px;
}

/* ==== About ==== */
.about-section { margin-bottom:80px; }
.about-section .about-content { display:grid; grid-template-columns:2fr 1fr; gap:60px; align-items:start; }
.about-section .about-text { font-size:16px; line-height:1.8; color:#555; }
.about-section .about-text p { margin-bottom:20px; }

.about-section .about-stats { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.about-section .stat-item {
    text-align:center; padding:30px 20px; background:#fff; border-radius:15px;
    box-shadow:0 10px 30px rgba(0,0,0,.1); transition: transform .3s ease;
}
.about-section .stat-item:hover { transform: translateY(-5px); }
.about-section .stat-number { font-size:36px; font-weight:700; color:#17a2b8; margin-bottom:10px; }
.about-section .stat-label { font-size:14px; color:#666; text-transform:uppercase; font-weight:500; }

/* ==== Services ==== */
.services-section { margin-bottom:80px; }
.services-section .services-info {
    display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; margin-bottom:30px;
}
.services-section .service-highlight {
    background:#fff; border:1px solid #e9ecef; border-radius:12px; padding:18px 16px; box-shadow:0 4px 14px rgba(0,0,0,.05);
}
.services-section .service-highlight h3 { font-size:18px; margin-bottom:6px; color:#333; }
.services-section .service-highlight p { color:#666; }

.services-section .services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:30px; }
.services-section .service-card {
    background:#fff; padding:40px 30px; border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.08);
    text-align:center; transition:.3s; position:relative; overflow:hidden;
}
.services-section .service-card::before {
    content:''; position:absolute; inset:0; left:-100%;
    background:linear-gradient(90deg,transparent,rgba(23,162,184,.1),transparent); transition:left .5s ease;
}
.services-section .service-card:hover::before { left:100%; }
.services-section .service-card:hover { transform: translateY(-10px); box-shadow:0 20px 40px rgba(0,0,0,.15); }

.services-section .service-icon {
    width:80px; height:80px; margin:0 auto 25px;
    background:linear-gradient(135deg,#17a2b8,#20c997); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:#fff;
}
.services-section .service-icon svg { width:40px; height:40px; }
.services-section .service-title { font-size:22px; font-weight:600; margin-bottom:15px; color:#333; }
.services-section .service-description { color:#666; line-height:1.6; }

/* ==== Team ==== */
.team-section { margin-bottom:80px; }
.team-section .team-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:40px; }
.team-section .team-card { background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.1); transition: transform .3s; }
.team-section .team-card:hover { transform: translateY(-5px); }
.team-section .team-photo { height:250px; overflow:hidden; }
.team-section .team-photo img { width:100%; height:100%; object-fit:cover; transition: transform .3s; }
.team-section .team-card:hover .team-photo img { transform: scale(1.05); }
.team-section .team-info { padding:30px; }
.team-section .team-name { font-size:20px; font-weight:600; color:#333; margin-bottom:8px; }
.team-section .team-position { color:#17a2b8; font-weight:500; margin-bottom:5px; }
.team-section .team-experience { color:#666; font-size:14px; margin-bottom:15px; }
.team-section .team-description { color:#555; line-height:1.6; font-size:14px; }

/* ==== Values ==== */
.values-section { margin-bottom:80px; }
.values-section .values-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:30px; }
.values-section .value-card { background:#fff; padding:40px 30px; border-radius:15px; box-shadow:0 8px 25px rgba(0,0,0,.08); text-align:center; transition:.3s; }
.values-section .value-card:hover { transform: translateY(-5px); box-shadow:0 15px 35px rgba(0,0,0,.15); }
.values-section .value-icon {
    width:70px; height:70px; margin:0 auto 20px;
    background:linear-gradient(135deg,#e91e63,#f06292); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:#fff;
}
.values-section .value-icon svg { width:35px; height:35px; }
.values-section .value-title { font-size:20px; font-weight:600; margin-bottom:15px; color:#333; }
.values-section .value-description { color:#666; line-height:1.6; font-size:14px; }

/* ==== Licenses ==== */
.licenses-section { margin-bottom:80px; }
.licenses-section .licenses-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.licenses-section .license-item {
    display:flex; align-items:center; gap:14px; background:#fff; border:1px solid #e9ecef; border-radius:12px; padding:16px 18px;
    box-shadow:0 6px 18px rgba(0,0,0,.06);
}
.licenses-section .license-icon {
    width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#17a2b8,#20c997);
    display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0;
}
.licenses-section .license-icon svg { width:24px; height:24px; }

/* ==== Gallery ==== */
.gallery-section { margin-bottom:80px; }
.gallery-section .gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.gallery-section .gallery-item { border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.gallery-section .gallery-item img { width:100%; height:220px; object-fit:cover; }

/* ==== Contacts / Form (строго внутри блока контактов) ==== */
.contact-section { margin-bottom:80px; }
.contact-section .contact-content { display:grid; grid-template-columns:1fr 1fr; gap:60px; }
.contact-section .contact-info { display:flex; flex-direction:column; gap:30px; }
.contact-section .contact-item { display:flex; align-items:flex-start; gap:20px; }
.contact-section .contact-icon {
    width:50px; height:50px; background:linear-gradient(135deg,#17a2b8,#20c997); border-radius:50%;
    display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0;
}
.contact-section .contact-icon svg { width:24px; height:24px; }
.contact-section .contact-details h4 { font-size:18px; font-weight:600; color:#333; margin-bottom:8px; }
.contact-section .contact-details p { color:#666; margin-bottom:5px; }

.contact-section .appointment-form { background:#fff; padding:40px; border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.1); }
.contact-section .appointment-form h3 { font-size:24px; font-weight:600; color:#333; margin-bottom:30px; text-align:center; }
.contact-section .form-group { margin-bottom:20px; }
.contact-section .form-group input,
.contact-section .form-group select,
.contact-section .form-group textarea {
    width:100%; padding:15px; border:2px solid #e9ecef; border-radius:10px; font-size:16px; transition:border-color .3s ease, box-shadow .3s;
}
.contact-section .form-group input:focus,
.contact-section .form-group select:focus,
.contact-section .form-group textarea:focus {
    outline:none; border-color:#17a2b8; box-shadow:0 0 0 3px rgba(23,162,184,.15);
}
.contact-section .form-group textarea { height:100px; resize:vertical; }
.contact-section .form-error { display:block; margin-top:8px; color:#d93025; font-size:13px; }
.contact-section .form-alert { margin-bottom:16px; padding:12px 14px; border-radius:10px; font-size:14px; }
.contact-section .form-alert_success { background:#e6f9f3; color:#116b56; border:1px solid #b9ecdf; }

.contact-section .submit-btn {
    width:100%; background:linear-gradient(135deg,#17a2b8,#20c997); color:#fff; border:none; padding:15px;
    border-radius:10px; font-size:16px; font-weight:600; cursor:pointer; transition:.3s;
}
.contact-section .submit-btn:hover { transform: translateY(-2px); box-shadow:0 8px 20px rgba(23,162,184,.3); }
.contact-section .submit-btn:disabled { opacity:.7; cursor:not-allowed; }

/* ==== Анимации / утилиты (узко и безопасно) ==== */
.will-animate { opacity:0; transform: translateY(26px); }
.revealed { opacity:1 !important; transform: translateY(0) !important; transition: opacity .6s ease, transform .6s ease; }
.sr-only {
    position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important;
    overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important;
}

/* ==== Адаптив ===== */
@media (max-width: 992px) {
    .hero-section { grid-template-columns:1fr; gap:40px; text-align:center; }
    .about-section .about-content { grid-template-columns:1fr; gap:40px; }
    .about-section .about-stats { grid-template-columns:repeat(2,1fr); gap:20px; }
    .contact-section .contact-content { grid-template-columns:1fr; gap:40px; }
    .gallery-section .gallery-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 768px) {
    .services-section .services-grid { grid-template-columns:1fr; }
    .team-section .team-grid { grid-template-columns:1fr; }
    .values-section .values-grid { grid-template-columns:repeat(2,1fr); }
    .gallery-section .gallery-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 480px) {
    .hero-title { font-size:28px; }
    .hero-subtitle { font-size:18px; }
    .about-section .section-title,
    .services-section .section-title,
    .licenses-section .section-title,
    .gallery-section .section-title,
    .team-section .section-title,
    .values-section .section-title,
    .contact-section .section-title { font-size:28px; }
    .about-section .about-stats { grid-template-columns:1fr; }
    .values-section .values-grid, .services-section .services-info { grid-template-columns:1fr; }
    .services-section .service-card, .values-section .value-card { padding:30px 20px; }
    .contact-section .appointment-form { padding:30px 20px; }
    .gallery-section .gallery-grid { grid-template-columns:1fr; }
}
/* ===========================
   Lightbox — Лицензии/свидетельства
   Полный CSS (вставь в конец about.css)
   =========================== */

/* Брендовые цвета */
:root{
    --ld-brand: #17a2b8;
    --ld-brand-2: #20c997;
    --ld-text: #333;
}

/* Кликабельность элементов списка лицензий */
.licenses-section .license-item[role="button"]{
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    border: 1px solid #e9ecef;
}
.licenses-section .license-item[role="button"]:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(23,162,184,.18);
    border-color: rgba(23,162,184,.35);
}

/* Состояние скрытия */
.ld-lightbox[hidden]{ display:none !important; }

/* Корневой контейнер модалки: по центру */
.ld-lightbox{
    position: fixed; inset: 0; z-index: 10000;
    display: flex; align-items: center; justify-content: center;
    padding: 24px;
    /* лёгкая анимация появления */
    animation: ld-fade-in .18s ease-out;
}

/* Подложка в стиле сайта */
.ld-lightbox__overlay{
    position: absolute; inset: 0;
    background: rgba(23,162,184,.35);           /* бирюзовый полупрозрачный */
    backdrop-filter: blur(2px) saturate(1.05);   /* аккуратный блюр */
}

/* Карточка диалога */
.ld-lightbox__dialog{
    position: relative;
    width: min(92vw, 980px);
    max-height: calc(100vh - 48px);
    background: #fff;
    color: var(--ld-text);
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(23,162,184,.35);
    padding: 28px 32px 40px;
    display: flex; flex-direction: column; align-items: center;
}

/* Изображение */
.ld-lightbox__img{
    max-width: 100%;
    max-height: calc(100vh - 180px);  /* чтобы помещалось с кнопками и подписью */
    border-radius: 8px;
    background: #fff;
    display: block;
}

/* Подпись */
.ld-lightbox__caption{
    margin-top: 12px;
    font-size: 14px;
    color: #444;
    text-align: center;
}

/* Кнопки управления */
.ld-lightbox__close,
.ld-lightbox__prev,
.ld-lightbox__next{
    position: absolute;
    width: 44px; height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(23,162,184,.35);
    background: rgba(23,162,184,.15);
    color: #0f4250;
    cursor: pointer;
    display: grid; place-items: center;
    font-size: 22px; line-height: 1;
    transition: background-color .15s ease, transform .15s ease;
}
.ld-lightbox__close{ top: 12px; right: 12px; }
.ld-lightbox__prev{ left: 12px; top: 50%; transform: translateY(-50%); }
.ld-lightbox__next{ right: 12px; top: 50%; transform: translateY(-50%); }
.ld-lightbox__close:hover,
.ld-lightbox__prev:hover,
.ld-lightbox__next:hover{ background: rgba(23,162,184,.25); }
.ld-lightbox__prev:active,
.ld-lightbox__next:active{ transform: translateY(-50%) scale(.96); }

/* Миниатюры страниц (если их несколько) */
.ld-lightbox__thumbs{
    margin-top: 12px;
    display: flex; gap: 8px; justify-content: center; flex-wrap: wrap;
}
.ld-lightbox__thumb{
    width: 64px; height: 64px;
    border-radius: 6px; overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color .15s ease, transform .15s ease;
}
.ld-lightbox__thumb:hover{ transform: translateY(-1px); }
.ld-lightbox__thumb[aria-current="true"]{ border-color: var(--ld-brand); }
.ld-lightbox__thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; }

/* Анимация появления */
@keyframes ld-fade-in{
    from{ opacity: 0; } to{ opacity: 1; }
}

/* Мобильная адаптация */
@media (max-width: 640px){
    .ld-lightbox{ padding: 10px; }
    .ld-lightbox__dialog{ width: 94vw; padding: 22px 14px 28px; }
    .ld-lightbox__prev, .ld-lightbox__next{ top: auto; bottom: 10px; transform: none; }
    .ld-lightbox__prev{ left: 14px; }
    .ld-lightbox__next{ right: 14px; }
    .ld-lightbox__img{ max-height: calc(100vh - 150px); }
}

/* Пользователи, у кого выключены анимации */
@media (prefers-reduced-motion: reduce){
    .ld-lightbox, .ld-lightbox__thumb{ animation: none !important; transition: none !important; }
}
/* Галерея: курсор увеличения */
.gallery-grid img { cursor: zoom-in; }


/* End */
/* /local/templates/premium_clinic/css/about.css?176493338616045 */