/* =========================================================================
   Лендинг «Свои». Все стили живут здесь и через админку не редактируются.
   ========================================================================= */

:root {
    --sv-dark:      #0F1319;
    --sv-dark-hover:#151A22;
    --sv-cream:     #EFE7DA;
    --sv-ink:       #181C22;
    --sv-accent:    #E0A458;
    --sv-accent-2:  #F2C078;
    --sv-brick:     #C0562B;
    --sv-brick-2:   #D2612F;
    --sv-paper:     #FFF6EC;

    --sv-line-dark:  rgba(239, 231, 218, .16);
    --sv-line-light: rgba(24, 28, 34, .16);

    --sv-max: 1280px;
    --sv-pad: clamp(20px, 4vw, 32px);

    --sv-font-display: 'Onest', system-ui, sans-serif;
    --sv-font-text:    'Golos Text', system-ui, sans-serif;

    --sv-ease: cubic-bezier(.2, .7, .3, 1);
}

/* --- база ---------------------------------------------------------------- */

* { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--sv-dark);
    color: var(--sv-cream);
    font-family: var(--sv-font-text);
}

a { color: var(--sv-accent); text-decoration: none; }
a:hover { color: var(--sv-accent-2); }

img, picture, svg { display: block; max-width: 100%; }

/* класс с display: перебил бы атрибут hidden, поэтому правило жёсткое */
[hidden] { display: none !important; }

:focus-visible {
    outline: 2px solid var(--sv-accent);
    outline-offset: 3px;
}

.sv-visually-hidden {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

@keyframes svRise {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: none; }
}
@keyframes svFade {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}

.sv-rise { animation: svRise 380ms var(--sv-ease) both; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* --- картинки ------------------------------------------------------------ */

.sv-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* заглушка, пока фото не загружено */
.sv-img-empty {
    position: absolute;
    inset: 0;
    display: block;
    background:
        repeating-linear-gradient(135deg,
            rgba(224, 164, 88, .07) 0 12px,
            rgba(224, 164, 88, .02) 12px 24px);
}

.sv-ar-34 { aspect-ratio: 3 / 4; }
.sv-ar-43 { aspect-ratio: 4 / 3; }
.sv-ar-11 { aspect-ratio: 1 / 1; }

/* --- сетка секций -------------------------------------------------------- */

.sv-wrap {
    max-width: var(--sv-max);
    margin: 0 auto;
    padding: 0 var(--sv-pad);
}

.sv-section { padding: clamp(80px, 9vw, 140px) 0; }

.sv-section--dark  { background: var(--sv-dark);  color: var(--sv-cream); }
.sv-section--light { background: var(--sv-cream); color: var(--sv-ink); }
.sv-section--clip  { overflow: hidden; }

/* шапка блока: «02 — Форматы» с чертой снизу */
.sv-head {
    padding-bottom: 22px;
    border-bottom: 1px solid var(--sv-line-dark);
}
.sv-section--light .sv-head { border-bottom-color: var(--sv-line-light); }

.sv-eyebrow {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(239, 231, 218, .55);
}
.sv-section--light .sv-eyebrow { color: rgba(24, 28, 34, .5); }

.sv-h2 {
    margin: 44px 0 0;
    font-family: var(--sv-font-display);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1;
    font-size: clamp(34px, 5vw, 68px);
}
.sv-h2--ch14 { max-width: 14ch; }
.sv-h2--ch18 { max-width: 18ch; }
.sv-h2--ch20 { max-width: 20ch; }
.sv-h2--ch22 { max-width: 22ch; }

/* заголовок + текст справа в один ряд */
.sv-two {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(24px, 5vw, 72px);
    align-items: end;
    margin-top: 44px;
}
.sv-two .sv-h2 { margin: 0; }

.sv-lead {
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(239, 231, 218, .72);
    max-width: 42ch;
}
.sv-section--light .sv-lead { color: rgba(24, 28, 34, .75); }

/* --- кнопки -------------------------------------------------------------- */

.sv-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 0 32px;
    border: 0;
    border-radius: 999px;
    font-family: var(--sv-font-text);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: .01em;
    cursor: pointer;
    transition: background 200ms, border-color 200ms, color 200ms;
}

.sv-btn--primary { background: var(--sv-brick); color: var(--sv-paper); }
.sv-btn--primary:hover { background: var(--sv-brick-2); color: var(--sv-paper); }

.sv-btn--ghost {
    background: transparent;
    border: 1px solid rgba(239, 231, 218, .35);
    color: var(--sv-cream);
    font-weight: 500;
}
.sv-btn--ghost:hover {
    border-color: var(--sv-cream);
    background: rgba(239, 231, 218, .07);
    color: var(--sv-cream);
}

.sv-btn--chat {
    gap: 9px;
    padding: 0 22px;
    background: rgba(239, 231, 218, .09);
    border: 1px solid rgba(239, 231, 218, .16);
    color: var(--sv-cream);
    font-size: 15px;
    font-weight: 400;
}
.sv-btn--chat:hover { background: rgba(239, 231, 218, .16); color: var(--sv-cream); }

.sv-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex: none;
}
.sv-dot--wa { background: #5BC47A; }
.sv-dot--tg { background: #63B7E6; }

.sv-round-btn {
    width: 48px;
    height: 48px;
    flex: none;
    border-radius: 50%;
    border: 1px solid rgba(24, 28, 34, .28);
    background: transparent;
    color: var(--sv-ink);
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
    transition: background 200ms;
}
.sv-round-btn:hover { background: rgba(24, 28, 34, .08); }

.sv-round-btn--dark {
    border-color: rgba(239, 231, 218, .3);
    color: var(--sv-cream);
    font-size: 20px;
}
.sv-round-btn--dark:hover { background: rgba(239, 231, 218, .12); }

/* --- шапка --------------------------------------------------------------- */

.sv-header {
    position: absolute;
    top: 0; left: 0; right: 0;
    z-index: 5;
    padding: 18px var(--sv-pad);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.sv-logo {
    font-family: var(--sv-font-display);
    font-weight: 800;
    font-size: clamp(26px, 6vw, 30px);
    letter-spacing: -.055em;
    color: var(--sv-cream);
    line-height: 1;
}

.sv-nav {
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.4vw, 30px);
    font-size: 14px;
    letter-spacing: .01em;
}
.sv-nav__link { color: rgba(239, 231, 218, .72); }
.sv-nav__link:hover { color: var(--sv-cream); }

.sv-phone-btn {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid rgba(239, 231, 218, .28);
    border-radius: 999px;
    color: var(--sv-cream);
    font-weight: 500;
    white-space: nowrap;
    transition: border-color 200ms, color 200ms;
}
.sv-phone-btn:hover { border-color: var(--sv-accent); color: var(--sv-accent-2); }

.sv-phone-btn__short { display: none; }

@media (max-width: 859px) {
    .sv-nav__link { display: none; }
}
@media (max-width: 479px) {
    .sv-phone-btn__full  { display: none; }
    .sv-phone-btn__short { display: inline; }
}

/* --- первый экран -------------------------------------------------------- */

.sv-hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
}

.sv-hero__bg {
    position: absolute;
    inset: 0;
    transform: translateY(var(--sv-hero-shift, 0px));
    will-change: transform;
}

.sv-hero__veil {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(15, 19, 25, .86) 0%,
        rgba(15, 19, 25, .45) 34%,
        rgba(15, 19, 25, .82) 72%,
        #0F1319 100%);
}
.sv-hero__veil--side {
    background: linear-gradient(90deg, rgba(15, 19, 25, .7) 0%, rgba(15, 19, 25, 0) 62%);
}

.sv-hero__inner {
    position: relative;
    width: 100%;
    max-width: var(--sv-max);
    margin: 0 auto;
    padding: clamp(112px, 22vw, 150px) var(--sv-pad) 0;
}

.sv-eyebrow-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}
.sv-eyebrow-row__line {
    width: 34px;
    height: 1px;
    background: rgba(239, 231, 218, .4);
    flex: none;
}
.sv-eyebrow-row .sv-eyebrow { color: rgba(239, 231, 218, .66); }

.sv-hero__title {
    margin: 0;
    font-family: var(--sv-font-display);
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: .94;
    font-size: clamp(46px, 7.6vw, 116px);
    color: var(--sv-cream);
    text-wrap: balance;
    max-width: 15ch;
}
.sv-hero__title em {
    font-style: normal;
    color: var(--sv-accent);
}

.sv-hero__lead {
    margin: 30px 0 0;
    max-width: 56ch;
    font-size: clamp(17px, 1.5vw, 21px);
    line-height: 1.55;
    color: rgba(239, 231, 218, .8);
}

.sv-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: clamp(30px, 5vw, 44px);
}
.sv-hero__chats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.sv-hero__foot {
    position: relative;
    width: 100%;
    max-width: var(--sv-max);
    margin: 0 auto;
    padding: 0 var(--sv-pad);
}

.sv-stats {
    margin-top: clamp(40px, 7vw, 72px);
    border-top: 1px solid var(--sv-line-dark);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    column-gap: 16px;
}
.sv-stat { padding: 26px 0 34px; }
.sv-stat__n {
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: clamp(28px, 3vw, 42px);
    letter-spacing: -.03em;
    color: var(--sv-cream);
    line-height: 1;
}
.sv-stat__label {
    margin-top: 8px;
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(239, 231, 218, .55);
}

/* --- форматы (табы) ------------------------------------------------------ */

.sv-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 44px;
}
.sv-tab {
    min-height: 48px;
    padding: 0 24px;
    border-radius: 999px;
    border: 1px solid rgba(24, 28, 34, .24);
    background: transparent;
    color: rgba(24, 28, 34, .8);
    font-family: var(--sv-font-text);
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: background 200ms, border-color 200ms, color 200ms;
}
.sv-tab:hover { border-color: rgba(24, 28, 34, .5); }
.sv-tab.is-active {
    background: var(--sv-ink);
    border-color: var(--sv-ink);
    color: var(--sv-cream);
}

.sv-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(32px, 5vw, 72px);
    align-items: start;
    margin-top: clamp(36px, 5vw, 56px);
}

.sv-format[hidden] { display: none; }
.sv-format.is-fading { animation: svFade 340ms var(--sv-ease) both; }

.sv-format__title {
    margin: 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: clamp(24px, 2.6vw, 34px);
    letter-spacing: -.03em;
    line-height: 1.15;
}
.sv-format__desc {
    margin: 18px 0 0;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(24, 28, 34, .75);
    max-width: 46ch;
}

.sv-bullets {
    list-style: none;
    margin: 34px 0 0;
    padding: 0;
    display: grid;
    gap: 1px;
    background: rgba(24, 28, 34, .14);
}
.sv-bullets li {
    background: var(--sv-cream);
    padding: 16px 0 16px 2px;
    display: flex;
    gap: 14px;
    align-items: baseline;
    font-size: 16px;
    line-height: 1.45;
}
.sv-bullets__i {
    font-family: var(--sv-font-display);
    font-size: 12px;
    color: var(--sv-brick);
    letter-spacing: .08em;
    flex: none;
}

.sv-inline-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    margin-top: 30px;
    color: var(--sv-brick);
    font-weight: 600;
    font-size: 16px;
    border-bottom: 1px solid rgba(192, 86, 43, .35);
}
.sv-inline-link:hover {
    color: var(--sv-ink);
    border-bottom-color: rgba(24, 28, 34, .5);
}

.sv-format-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    background: rgba(24, 28, 34, .06);
}
.sv-format-media__item {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 340ms ease;
}
.sv-format-media__item.is-active {
    opacity: 1;
    pointer-events: auto;
}

/* --- карточки (полный цикл) ---------------------------------------------- */

.sv-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1px;
    background: var(--sv-line-dark);
    margin-top: 64px;
    border-top: 1px solid var(--sv-line-dark);
    border-bottom: 1px solid var(--sv-line-dark);
}
.sv-card {
    background: var(--sv-dark);
    padding: 36px 34px 40px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    transition: background 220ms;
}
.sv-card:hover { background: var(--sv-dark-hover); }
.sv-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.sv-card__num {
    font-family: var(--sv-font-display);
    font-size: 12px;
    letter-spacing: .14em;
    color: rgba(239, 231, 218, .4);
}
.sv-card__title {
    margin: 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 21px;
    letter-spacing: -.02em;
    line-height: 1.25;
}
.sv-card__text {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(239, 231, 218, .68);
}

/* --- логистика ----------------------------------------------------------- */

.sv-media-wide {
    position: relative;
    width: 100%;
    aspect-ratio: 21 / 8;
    min-height: 200px;
    margin-top: clamp(36px, 5vw, 56px);
    background: rgba(24, 28, 34, .06);
}

.sv-cols {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: clamp(28px, 4vw, 56px);
    margin-top: 64px;
}
.sv-col {
    border-top: 1px solid rgba(24, 28, 34, .2);
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.sv-col__num {
    font-family: var(--sv-font-display);
    font-size: 12px;
    letter-spacing: .14em;
    color: var(--sv-brick);
}
.sv-col__title {
    margin: 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 22px;
    letter-spacing: -.02em;
    line-height: 1.25;
}
.sv-col__text {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(24, 28, 34, .75);
}

/* --- портфолио ----------------------------------------------------------- */

.sv-masonry {
    columns: 340px 3;
    column-gap: 20px;
    margin-top: clamp(36px, 5vw, 56px);
}
.sv-case {
    break-inside: avoid;
    margin-bottom: 20px;
}
.sv-case__btn {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: inherit;
    font: inherit;
}
.sv-case__frame {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: rgba(239, 231, 218, .06);
}
.sv-case__zoom {
    position: absolute;
    inset: 0;
    transition: transform 360ms var(--sv-ease);
}
.sv-case__btn:hover .sv-case__zoom { transform: scale(1.045); }

.sv-case__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-top: 14px;
}
.sv-case__type {
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--sv-accent);
}
.sv-case__venue {
    font-size: 13px;
    color: rgba(239, 231, 218, .5);
    text-align: right;
}
.sv-case__idea {
    margin: 8px 0 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 20px;
    letter-spacing: -.02em;
    line-height: 1.3;
    color: var(--sv-cream);
}

/* --- команда ------------------------------------------------------------- */

.sv-team-top {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
}
.sv-team-top .sv-lead { max-width: 34ch; }
.sv-team-nav {
    display: flex;
    gap: 10px;
    flex: none;
}

.sv-team-track {
    margin-top: clamp(36px, 5vw, 56px);
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 0 max(var(--sv-pad), calc((100vw - var(--sv-max)) / 2 + 32px)) 8px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.sv-team-track::-webkit-scrollbar { display: none; }

.sv-member {
    flex: none;
    width: clamp(230px, 72vw, 300px);
    scroll-snap-align: start;
}
.sv-member__photo {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    background: rgba(24, 28, 34, .06);
}
.sv-member__body {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.sv-member__role {
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--sv-brick);
}
.sv-member__name {
    margin: 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 20px;
    letter-spacing: -.02em;
}
.sv-member__line {
    margin: 4px 0 0;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(24, 28, 34, .7);
}

/* --- процесс ------------------------------------------------------------- */

.sv-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 8px 20px;
    margin-top: clamp(40px, 6vw, 64px);
    border-top: 1px solid rgba(239, 231, 218, .22);
}
.sv-step {
    position: relative;
    padding-top: 34px;
}
.sv-step::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--sv-accent);
}
.sv-step__num {
    font-family: var(--sv-font-display);
    font-size: 12px;
    letter-spacing: .14em;
    color: rgba(239, 231, 218, .45);
}
.sv-step__title {
    margin: 12px 0 0;
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 19px;
    letter-spacing: -.02em;
    line-height: 1.3;
}
.sv-step__text {
    margin: 10px 0 0;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(239, 231, 218, .66);
}
.sv-step__time {
    display: inline-block;
    margin-top: 16px;
    padding: 6px 12px;
    border: 1px solid rgba(239, 231, 218, .22);
    border-radius: 999px;
    font-size: 12px;
    letter-spacing: .06em;
    color: rgba(239, 231, 218, .8);
}

.sv-note {
    margin: 56px 0 0;
    padding: 24px 28px;
    border-left: 2px solid var(--sv-brick);
    background: rgba(239, 231, 218, .04);
    max-width: 70ch;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(239, 231, 218, .82);
}

/* --- отзывы -------------------------------------------------------------- */

.sv-reviews {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1px;
    background: var(--sv-line-light);
    margin-top: 56px;
    border-top: 1px solid var(--sv-line-light);
    border-bottom: 1px solid var(--sv-line-light);
}
.sv-review {
    margin: 0;
    background: var(--sv-cream);
    padding: 38px 34px 34px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.sv-review__mark {
    font-family: var(--sv-font-display);
    font-size: 38px;
    line-height: .6;
    color: var(--sv-brick);
}
.sv-review__text {
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(24, 28, 34, .86);
}
.sv-review__cap {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-top: 1px solid var(--sv-line-light);
    padding-top: 18px;
}
.sv-review__name {
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: 16px;
}
.sv-review__role {
    font-size: 14px;
    color: rgba(24, 28, 34, .6);
}
.sv-review__event {
    margin-top: 6px;
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--sv-brick);
}

/* --- вопросы ------------------------------------------------------------- */

.sv-faq-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(28px, 5vw, 80px);
    align-items: start;
    margin-top: 44px;
}
.sv-faq-aside {
    position: sticky;
    top: 40px;
}
.sv-faq-aside .sv-h2 { margin: 0; font-size: clamp(34px, 4.4vw, 58px); }
.sv-faq-aside .sv-lead {
    margin: 22px 0 0;
    font-size: 16px;
    max-width: 32ch;
    color: rgba(239, 231, 218, .7);
}
@media (max-width: 859px) {
    .sv-faq-aside { position: static; }
}

.sv-faq-list {
    display: flex;
    flex-direction: column;
}
.sv-faq-item { border-bottom: 1px solid var(--sv-line-dark); }

.sv-faq-q {
    width: 100%;
    min-height: 44px;
    padding: 26px 0;
    border: 0;
    background: transparent;
    color: var(--sv-cream);
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    font-family: var(--sv-font-display);
    font-weight: 500;
    font-size: clamp(17px, 1.6vw, 21px);
    letter-spacing: -.015em;
    line-height: 1.35;
    transition: color 200ms;
}
.sv-faq-q:hover { color: var(--sv-accent-2); }

.sv-faq-plus {
    flex: none;
    width: 26px;
    height: 26px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--sv-accent);
    transition: transform 260ms var(--sv-ease);
}
.sv-faq-item.is-open .sv-faq-plus { transform: rotate(45deg); }

.sv-faq-a {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 320ms var(--sv-ease), opacity 260ms ease;
}
.sv-faq-item.is-open .sv-faq-a {
    grid-template-rows: 1fr;
    opacity: 1;
}
.sv-faq-a > div { overflow: hidden; }
.sv-faq-a p {
    margin: 0;
    padding: 0 clamp(0px, 6vw, 60px) 28px 0;
    font-size: 16px;
    line-height: 1.65;
    color: rgba(239, 231, 218, .74);
}

/* --- блок заявки --------------------------------------------------------- */

.sv-cta {
    position: relative;
    background: var(--sv-brick);
    color: var(--sv-paper);
    padding: clamp(80px, 9vw, 130px) 0;
    overflow: hidden;
}
.sv-cta__grid {
    position: relative;
    max-width: var(--sv-max);
    margin: 0 auto;
    padding: 0 var(--sv-pad);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: clamp(36px, 6vw, 88px);
    align-items: start;
}
.sv-cta .sv-eyebrow { color: rgba(255, 246, 236, .7); }
.sv-cta__title {
    margin: 32px 0 0;
    font-family: var(--sv-font-display);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: .98;
    font-size: clamp(34px, 5vw, 66px);
    max-width: 16ch;
    text-wrap: balance;
}
.sv-cta__lead {
    margin: 24px 0 0;
    max-width: 40ch;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255, 246, 236, .85);
}
.sv-cta__contacts {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 44px;
    padding-top: 32px;
    border-top: 1px solid rgba(255, 246, 236, .28);
}
.sv-cta__phone {
    font-family: var(--sv-font-display);
    font-weight: 600;
    font-size: clamp(22px, 2.4vw, 30px);
    letter-spacing: -.02em;
    color: var(--sv-paper);
}
.sv-cta__phone:hover { color: var(--sv-dark); }
.sv-cta__mail { font-size: 17px; color: rgba(255, 246, 236, .85); }
.sv-cta__mail:hover { color: var(--sv-paper); }
.sv-cta__chats { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.sv-cta__chat {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 999px;
    background: rgba(255, 246, 236, .16);
    color: var(--sv-paper);
    font-size: 15px;
    transition: background 200ms;
}
.sv-cta__chat:hover { background: rgba(255, 246, 236, .28); color: var(--sv-paper); }

/* форма */
.sv-form {
    background: var(--sv-dark);
    padding: clamp(30px, 3.4vw, 48px);
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.sv-form__row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 18px;
}
.sv-field {
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.sv-label {
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(239, 231, 218, .6);
}
.sv-input,
.sv-textarea {
    border: 1px solid rgba(239, 231, 218, .24);
    border-radius: 4px;
    background: rgba(239, 231, 218, .05);
    color: var(--sv-cream);
    font-family: var(--sv-font-text);
    font-size: 16px;
    outline: none;
    transition: border-color 180ms;
}
.sv-input { min-height: 50px; padding: 0 16px; }
.sv-textarea { padding: 14px 16px; line-height: 1.5; resize: vertical; }
.sv-input:focus,
.sv-textarea:focus { border-color: var(--sv-accent); }
.sv-input::placeholder,
.sv-textarea::placeholder { color: rgba(239, 231, 218, .35); }

.sv-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.sv-chip {
    min-height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(239, 231, 218, .24);
    background: transparent;
    color: rgba(239, 231, 218, .8);
    font-family: var(--sv-font-text);
    font-size: 14px;
    cursor: pointer;
    transition: background 180ms, border-color 180ms, color 180ms;
}
.sv-chip.is-active {
    background: var(--sv-accent);
    border-color: var(--sv-accent);
    color: var(--sv-ink);
}

.sv-submit { margin-top: 4px; }
.sv-form-note {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(239, 231, 218, .5);
}
.sv-form-error {
    margin: 0;
    font-size: 14px;
    color: #FF9B7A;
}

.sv-sent {
    background: var(--sv-dark);
    padding: clamp(36px, 4vw, 56px);
    display: flex;
    flex-direction: column;
    gap: 18px;
    animation: svFade 320ms ease both;
}
.sv-sent__title {
    font-family: var(--sv-font-display);
    font-weight: 800;
    font-size: clamp(24px, 2.6vw, 34px);
    letter-spacing: -.03em;
    color: var(--sv-cream);
}
.sv-sent__text {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(239, 231, 218, .75);
    max-width: 36ch;
}
.sv-sent__btn {
    align-self: flex-start;
    margin-top: 10px;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 999px;
    border: 1px solid rgba(239, 231, 218, .3);
    background: transparent;
    color: var(--sv-cream);
    font-family: var(--sv-font-text);
    font-size: 15px;
    cursor: pointer;
    transition: background 200ms;
}
.sv-sent__btn:hover { background: rgba(239, 231, 218, .12); }

/* --- футер --------------------------------------------------------------- */

.sv-footer {
    background: var(--sv-dark);
    color: var(--sv-cream);
    padding: clamp(56px, 6vw, 88px) 0 40px;
}
.sv-footer__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: clamp(28px, 4vw, 64px);
    padding-bottom: 48px;
    border-bottom: 1px solid var(--sv-line-dark);
}
.sv-footer__logo {
    font-family: var(--sv-font-display);
    font-weight: 800;
    font-size: 34px;
    letter-spacing: -.055em;
    line-height: 1;
}
.sv-footer__about {
    margin: 16px 0 0;
    max-width: 32ch;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(239, 231, 218, .62);
}
.sv-fcol {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 15px;
}
.sv-fcol__title {
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(239, 231, 218, .45);
}
.sv-fcol a { color: rgba(239, 231, 218, .8); }
.sv-fcol a:hover { color: var(--sv-accent-2); }

.sv-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between;
    padding-top: 24px;
    font-size: 13px;
    color: rgba(239, 231, 218, .45);
}
.sv-footer__bottom a { color: rgba(239, 231, 218, .45); }
.sv-footer__bottom a:hover { color: var(--sv-cream); }

/* --- лайтбокс кейса ------------------------------------------------------ */

.sv-lb {
    position: fixed;
    inset: 0;
    z-index: 50;
    background: rgba(9, 11, 15, .94);
    overflow-y: auto;
    animation: svFade 240ms ease both;
}
.sv-lb[hidden] { display: none; }
.sv-lb__inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: clamp(24px, 5vw, 64px) 24px 80px;
}
.sv-lb__case[hidden] { display: none; }
.sv-lb__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}
.sv-lb__eyebrow {
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--sv-accent);
}
.sv-lb__title {
    margin: 12px 0 0;
    font-family: var(--sv-font-display);
    font-weight: 800;
    font-size: clamp(26px, 3.4vw, 42px);
    letter-spacing: -.035em;
    line-height: 1.08;
    max-width: 24ch;
    color: var(--sv-cream);
}
.sv-lb__text {
    margin: 24px 0 0;
    max-width: 62ch;
    font-size: 17px;
    line-height: 1.65;
    color: rgba(239, 231, 218, .78);
}
.sv-lb__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
    margin-top: 36px;
}
.sv-lb__photo {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    background: rgba(239, 231, 218, .06);
}

/* закрытая прокрутка фона, пока открыт лайтбокс */
body.sv-locked { overflow: hidden; }

/* --- служебная страница (политика) --------------------------------------- */

.sv-page {
    padding: clamp(120px, 14vw, 180px) 0 clamp(80px, 9vw, 120px);
    background: var(--sv-dark);
    color: var(--sv-cream);
}
.sv-page__title {
    margin: 0 0 32px;
    font-family: var(--sv-font-display);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1.05;
    font-size: clamp(30px, 4vw, 52px);
    max-width: 20ch;
}
.sv-page__body {
    max-width: 70ch;
    font-size: 16px;
    line-height: 1.7;
    color: rgba(239, 231, 218, .78);
}
.sv-page__body p { margin: 0 0 18px; }
.sv-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 32px;
    min-height: 44px;
}