/*
 * svadba.tatar — тема сайта поверх унаследованных main.css/site.css.
 *
 * Палитра: айвори (бумага), изумруд (никах, орнамент), золото (шитьё
 * калфака), гранат (акцент, дозированно), тёплый тёмно-коричневый текст.
 * Шрифты: Cormorant — заголовки, Golos Text — текст; оба с cyrillic-ext,
 * то есть с татарскими ә ө ү җ ң һ (см. /fonts/sv/fonts.css).
 */

:root {
    --sv-ivory: #faf6ee;
    --sv-paper: #fffdf8;
    --sv-sand: #f3ecdf;
    --sv-line: #e7dfcf;
    --sv-emerald: #1f5a48;
    --sv-emerald-deep: #173f33;
    --sv-emerald-ink: #0f2c24;
    --sv-gold: #c29a4e;
    --sv-gold-soft: #e6d3a8;
    --sv-garnet: #8e2b3a;
    --sv-ink: #2a2320;
    --sv-muted: #6b5f55;

    --sv-serif: 'Cormorant', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --sv-sans: 'Golos Text', 'Segoe UI', Roboto, Arial, sans-serif;

    --sv-radius: 14px;
    --sv-radius-sm: 8px;
    --sv-shadow: 0 1px 2px rgba(42, 35, 32, .06), 0 8px 24px rgba(42, 35, 32, .06);
    --sv-shadow-lift: 0 2px 4px rgba(42, 35, 32, .08), 0 16px 40px rgba(42, 35, 32, .10);
    --sv-container: 1200px;
    --site-header-height: 72px;
}

/* ---------- База ---------- */

body.sv {
    background: var(--sv-ivory);
    color: var(--sv-ink);
    font-family: var(--sv-sans);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

body.sv h1, body.sv h2, body.sv h3, body.sv h4 {
    color: var(--sv-ink);
}

body.sv a {
    color: var(--sv-emerald);
}

body.sv a:hover,
body.sv a:focus {
    color: var(--sv-emerald-deep);
}

body.sv :focus-visible {
    outline: 2px solid var(--sv-gold);
    outline-offset: 2px;
}

.svContainer {
    width: 100%;
    max-width: var(--sv-container);
    margin: 0 auto;
    padding: 0 24px;
}

@media (max-width: 600px) {
    .svContainer { padding: 0 16px; }
}

.svMain { display: block; }

.pageShell { background: var(--sv-ivory); }

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

.svBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 50px;
    padding: 0 28px;
    border-radius: 999px;
    border: 1.5px solid transparent;
    font-family: var(--sv-sans);
    font-weight: 600;
    font-size: 16px;
    letter-spacing: .01em;
    text-decoration: none !important;
    transition: background-color .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s;
    cursor: pointer;
}

.svBtn--primary,
body.sv a.svBtn--primary {
    background: var(--sv-emerald);
    color: #fff;
    box-shadow: 0 6px 18px rgba(31, 90, 72, .22);
}

.svBtn--primary:hover,
body.sv a.svBtn--primary:hover {
    background: var(--sv-emerald-deep);
    color: #fff;
    transform: translateY(-1px);
}

.svBtn--ghost,
body.sv a.svBtn--ghost {
    background: transparent;
    color: var(--sv-emerald);
    border-color: var(--sv-emerald);
}

.svBtn--ghost:hover,
body.sv a.svBtn--ghost:hover {
    background: var(--sv-emerald);
    color: #fff;
}

.svBtn--gold,
body.sv a.svBtn--gold {
    background: var(--sv-gold);
    color: var(--sv-emerald-ink);
}

.svBtn--gold:hover,
body.sv a.svBtn--gold:hover {
    background: var(--sv-gold-soft);
    color: var(--sv-emerald-ink);
}

/* Унаследованные кнопки (.button.btn--*) — в ту же форму */
body.sv .button.btn--primary,
body.sv .button.btn--secondary,
body.sv .button.btn--danger {
    border-radius: 999px;
    font-family: var(--sv-sans);
    font-weight: 600;
}

body.sv .button.btn--primary {
    background: var(--sv-emerald);
    border-color: var(--sv-emerald);
    color: #fff;
}

body.sv .button.btn--primary:hover {
    background: var(--sv-emerald-deep);
    border-color: var(--sv-emerald-deep);
}

body.sv .button.btn--secondary {
    background: transparent;
    color: var(--sv-emerald);
    border: 1.5px solid var(--sv-emerald);
}

body.sv .button.btn--secondary:hover {
    background: var(--sv-emerald);
    color: #fff;
}

/* Удалить / отменить заказ: раньше без стиля — квадратная (2026-10-05) */
body.sv .button.btn--danger {
    background: #A8322D;
    border: 1.5px solid #A8322D;
    color: #fff;
}

body.sv .button.btn--danger:hover {
    background: #8C2925;
    border-color: #8C2925;
    color: #fff;
}

body.sv .button.btn--danger:disabled {
    opacity: .5;
    cursor: not-allowed;
}

/* ---------- Логотип ---------- */

.svLogo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none !important;
    color: var(--sv-emerald) !important;
}

.svLogo__mark { color: var(--sv-gold); flex: none; }

.svLogo__word {
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: 27px;
    line-height: 1;
    letter-spacing: .01em;
    color: var(--sv-emerald);
}

.svLogo__dot { color: var(--sv-gold); }

.svLogo--light .svLogo__word { color: #fff; }

/* ---------- Шапка ---------- */

.svHeader {
    /* Прокручивается документ (site.css): шапка в потоке и прилипает
       к верху окна, отступ под неё контенту не нужен. */
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(250, 246, 238, .94);
    backdrop-filter: saturate(1.2) blur(8px);
    border-bottom: 1px solid var(--sv-line);
}

.svHeader__inner {
    display: flex;
    align-items: center;
    gap: 28px;
    min-height: var(--site-header-height);
}

.svHeader__menu { flex: 1; min-width: 0; }

.svHeader__utils { display: flex; align-items: center; gap: 12px; }

.svHeader__burger { display: none; }

.svNav { text-align: left !important; }

.svNav .svNav__list {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.svNav .svNav__list > li { position: relative; float: none; }

.svNav .svNav__list > li > a {
    display: block;
    padding: 10px 14px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 500;
    color: var(--sv-ink);
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0;
}

.svNav .svNav__list > li > a:hover,
.svNav .svNav__list > li > a[aria-current="page"] {
    background: var(--sv-sand);
    color: var(--sv-emerald);
}

.svNav .setSubmenu > a::after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 8px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-3px) rotate(45deg);
}

.svNav .submenu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 250px;
    margin: 0;
    padding: 8px;
    list-style: none;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
    box-shadow: var(--sv-shadow-lift);
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity .15s, transform .15s, visibility .15s;
    z-index: 20;
}

.svNav .setSubmenu:hover > .submenu,
.svNav .setSubmenu:focus-within > .submenu,
.svNav .setSubmenu > a[aria-expanded="true"] + .submenu {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.svNav .submenu a {
    display: block;
    padding: 9px 12px;
    border-radius: var(--sv-radius-sm);
    color: var(--sv-ink);
    font-size: 15px;
    text-decoration: none;
    text-transform: none;
}

.svNav .submenu a:hover {
    background: var(--sv-sand);
    color: var(--sv-emerald);
}

@media (max-width: 1080px) {
    .svHeader__menu,
    .svHeader__utils .accountNav--desktop { display: none; }
    .svHeader__burger { display: inline-flex; margin-left: auto; }
    .svHeader__burger { box-shadow: none; }
}

/* ---------- Общие секции ---------- */

.svSection { padding: 88px 0; }

.svSection--tint { background: var(--sv-sand); }

.svSection--emerald {
    background: var(--sv-emerald);
    color: #f5efe2;
    position: relative;
    overflow: hidden;
}

.svSection--emerald .svH2 { color: #fff; }

@media (max-width: 767px) {
    .svSection { padding: 56px 0; }
}

.svSectionHead { max-width: 720px; margin: 0 0 40px; }

.svSectionHead--row {
    max-width: none;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.svSectionHead__lead { margin: 12px 0 0; color: var(--sv-muted); font-size: 17px; }

.svEyebrow {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--sv-muted);
}

.svEyebrow--gold { color: var(--sv-gold-soft); }

body.sv .svH2 {
    margin: 0;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: clamp(32px, 4vw, 46px);
    line-height: 1.1;
    letter-spacing: -.005em;
}

.svLinkArrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    text-decoration: none !important;
}

.svLinkArrow svg { transition: transform .2s; }
.svLinkArrow:hover svg { transform: translateX(3px); }

.svNotice {
    margin: 20px 0 0;
    padding: 14px 18px;
    border-radius: var(--sv-radius-sm);
    background: #e8f0ec;
    color: var(--sv-emerald-deep);
}

/* ---------- Орнамент ---------- */

/* Лента с тюльпанами над подвалом. Временно не выводится (убрана из
   partials/_footer.html.twig); вернуть — вставить <div class="svOrnamentBand"
   aria-hidden="true"></div> первой строкой в <footer>. */
.svOrnamentBand {
    height: 28px;
    background-color: var(--sv-emerald-deep);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='28' viewBox='0 0 56 28'%3E%3Cg fill='%23c29a4e'%3E%3Cpath d='M28 4c-2.4 2-3.6 4.6-3.6 7.2 0 2.2 1.4 4 3.6 4.6 2.2-.6 3.6-2.4 3.6-4.6C31.6 8.6 30.4 6 28 4Z'/%3E%3Cpath d='M24.2 7.5c-2.5.2-4.3 2-4.7 4.3 1.2 2.6 4.3 4.2 7.6 4.2-1.8-1.1-3-3-3-5.1l.1-3.4ZM31.8 7.5c2.5.2 4.3 2 4.7 4.3-1.2 2.6-4.3 4.2-7.6 4.2 1.8-1.1 3-3 3-5.1l-.1-3.4Z' opacity='.7'/%3E%3Cpath d='M27.3 15.8h1.4V24h-1.4z'/%3E%3Ccircle cx='4' cy='14' r='1.6'/%3E%3Ccircle cx='52' cy='14' r='1.6'/%3E%3Cpath d='M8 14h12M36 14h12' stroke='%23c29a4e' stroke-width='.8' opacity='.6'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: repeat-x;
    background-position: center;
}

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

.svHero {
    position: relative;
    padding: 72px 0 96px;
    overflow: hidden;
    background: linear-gradient(180deg, var(--sv-paper) 0%, var(--sv-ivory) 100%);
}

.svHero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: 56px;
    align-items: center;
}

body.sv .svHero__title {
    margin: 0 0 20px;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: clamp(42px, 6vw, 72px);
    line-height: 1.02;
    letter-spacing: -.01em;
    color: var(--sv-emerald-ink);
}

.svHero__title em {
    font-style: italic;
    font-weight: 500;
    color: var(--sv-garnet);
}

.svHero__lead {
    max-width: 560px;
    margin: 0 0 32px;
    font-size: 18px;
    color: var(--sv-muted);
}

.svHero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.svHero__actions--center { justify-content: center; }

.svHero__trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
    color: var(--sv-muted);
}

.svHero__trust li { display: inline-flex; align-items: center; gap: 6px; }
.svHero__trust svg { color: var(--sv-emerald); }

.svHero__visual { display: flex; flex-direction: column; align-items: center; gap: 18px; }


.svLangSwitch {
    display: inline-flex;
    padding: 4px;
    border-radius: 999px;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    box-shadow: var(--sv-shadow);
}

.svLangSwitch__btn {
    border: 0;
    background: transparent;
    padding: 8px 16px;
    border-radius: 999px;
    font: 600 14px/1 var(--sv-sans);
    color: var(--sv-muted);
    cursor: pointer;
    transition: background-color .2s, color .2s;
}

.svLangSwitch__btn.is-active { background: var(--sv-emerald); color: #fff; }

/* Макет приглашения на первом экране */
.svMock {
    width: min(100%, 400px);
    aspect-ratio: 100 / 140;
    padding: 14px;
    background: var(--sv-paper);
    border-radius: 6px;
    box-shadow: var(--sv-shadow-lift);
    transform: rotate(-1.5deg);
}

.svMock__frame {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 22px;
    text-align: center;
    border: 1px solid var(--sv-gold);
    outline: 4px double rgba(194, 154, 78, .45);
    outline-offset: -10px;
    background:
        radial-gradient(circle at 50% 0%, rgba(194, 154, 78, .12), transparent 55%),
        var(--sv-paper);
}

.svMock__tulip { color: var(--sv-gold); margin-bottom: 14px; }

.svMock__text p { margin: 0; }

.svMock__salute {
    font-family: var(--sv-serif);
    font-style: italic;
    font-size: 20px;
    color: var(--sv-garnet);
}

.svMock__body {
    margin-top: 6px !important;
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sv-muted);
}

.svMock__names {
    margin: 18px 0 0;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: clamp(32px, 4vw, 42px);
    line-height: 1.05;
    color: var(--sv-emerald-ink);
}

.svMock__names span {
    display: block;
    font-style: italic;
    font-weight: 500;
    font-size: .6em;
    color: var(--sv-gold);
}

.svMock__divider {
    width: 120px;
    height: 10px;
    margin: 16px 0;
    background:
        linear-gradient(var(--sv-gold), var(--sv-gold)) left center / 48px 1px no-repeat,
        linear-gradient(var(--sv-gold), var(--sv-gold)) right center / 48px 1px no-repeat,
        radial-gradient(circle, var(--sv-gold) 3px, transparent 3.5px) center / 10px 10px no-repeat;
}

.svMock__date { margin: 0; font-weight: 600; letter-spacing: .06em; color: var(--sv-ink); }
.svMock__place { margin: 4px 0 0; font-size: 13px; color: var(--sv-muted); }

.svMock .svMock__text--ru { display: none; }
.svMock[data-lang="ru"] .svMock__text--tt { display: none; }
.svMock[data-lang="ru"] .svMock__text--ru { display: block; }
.svMock[data-lang="both"] .svMock__text--ru { display: block; }
.svMock[data-lang="both"] div.svMock__text--ru { margin-top: 10px; }
.svMock[data-lang="both"] div.svMock__text--ru .svMock__salute { font-size: 16px; }
.svMock[data-lang="both"] p.svMock__place.svMock__text--ru { display: none; }

@media (max-width: 900px) {
    .svHero { padding: 40px 0 64px; }
    .svHero__inner { grid-template-columns: 1fr; gap: 40px; }
    .svMock { transform: none; }
}

/* ---------- Продукция ---------- */

.svProducts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.svProduct {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px 22px;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
    text-decoration: none !important;
    color: var(--sv-ink) !important;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

.svProduct:hover {
    transform: translateY(-3px);
    box-shadow: var(--sv-shadow-lift);
    border-color: var(--sv-gold-soft);
}

.svProduct__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 10px;
    border-radius: 50%;
    background: var(--sv-sand);
    color: var(--sv-emerald);
}

.svProduct__name { font-family: var(--sv-serif); font-weight: 600; font-size: 23px; line-height: 1.15; }
.svProduct__text { font-size: 14px; color: var(--sv-muted); }

@media (max-width: 900px) { .svProducts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .svProducts { grid-template-columns: 1fr; } }

/* ---------- Шаги ---------- */

.svSteps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: none;
}

.svStep {
    position: relative;
    padding: 28px;
    background: var(--sv-paper);
    border-radius: var(--sv-radius);
    border: 1px solid var(--sv-line);
}

.svStep__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-bottom: 16px;
    border-radius: 50%;
    border: 1.5px solid var(--sv-gold);
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: 24px;
    color: var(--sv-emerald);
    /* Цифры одной высоты по центру кружка: по умолчанию у Cormorant
       «старостильные» (1 и 2 — как строчные, у 3 хвост вниз) — сидели низко. */
    font-variant-numeric: lining-nums;
    font-feature-settings: "lnum" 1;
    line-height: 1;
}

body.sv .svStep__title { margin: 0 0 8px; font-family: var(--sv-serif); font-weight: 600; font-size: 26px; }
.svStep p { margin: 0; color: var(--sv-muted); }

@media (max-width: 800px) { .svSteps { grid-template-columns: 1fr; } }

/* ---------- Преимущества ---------- */

.svFeatures {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 32px;
}

.svFeature { padding-top: 20px; border-top: 2px solid var(--sv-gold); }
body.sv .svFeature__title { margin: 0 0 10px; font-family: var(--sv-serif); font-weight: 600; font-size: 25px; line-height: 1.15; }
.svFeature p { margin: 0; color: var(--sv-muted); font-size: 15px; }

@media (max-width: 900px) { .svFeatures { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .svFeatures { grid-template-columns: 1fr; } }

/* ---------- Блок для гостей ---------- */

.svGuests {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr);
    gap: 48px;
    align-items: center;
}

.svGuests__lead { margin: 16px 0 28px; font-size: 17px; color: #e4dccb; max-width: 560px; }

.svQuote {
    margin: 0;
    padding: 24px 26px;
    border-radius: var(--sv-radius);
    background: var(--sv-paper);
    color: var(--sv-ink);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
}

.svQuote__label { margin: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--sv-muted); }
.svQuote__text { margin: 0; font-family: var(--sv-serif); font-style: italic; font-size: 30px; line-height: 1.15; color: var(--sv-emerald-deep); }
.svQuote__tr { margin: 6px 0 0; font-size: 14px; color: var(--sv-muted); }

@media (max-width: 800px) { .svGuests { grid-template-columns: 1fr; } }

/* ---------- FAQ ---------- */

.svFaq__list { max-width: none; }

.svFaq__item { border-bottom: 1px solid var(--sv-line); }

.svFaq__item summary {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 0;
    list-style: none;
    cursor: pointer;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: 23px;
}

.svFaq__item summary::-webkit-details-marker { display: none; }

.svFaq__item summary::after {
    content: '+';
    flex: none;
    font-family: var(--sv-sans);
    font-weight: 400;
    font-size: 26px;
    line-height: 1;
    color: var(--sv-gold);
    transition: transform .2s;
}

.svFaq__item[open] summary::after { transform: rotate(45deg); }
.svFaq__item p { margin: 0 0 20px; color: var(--sv-muted); }

/* ---------- Финальный призыв ---------- */

.svSection--cta { padding-top: 24px; }

.svCta {
    padding: 64px 24px;
    text-align: center;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: 24px;
    box-shadow: var(--sv-shadow);
}

.svCta p { margin: 12px 0 28px; color: var(--sv-muted); }

/* ---------- Подвал ---------- */

.svFooter { background: var(--sv-emerald-ink); color: #cfc6b3; }

.svFooter__grid {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, 1fr);
    gap: 40px;
    padding-top: 56px;
    padding-bottom: 40px;
}

.svFooter__tagline { margin: 16px 0 8px; max-width: 320px; font-size: 15px; }

.svFooter__title {
    margin-bottom: 14px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--sv-gold);
}

.svFooter__links { margin: 0; padding: 0; list-style: none; }
.svFooter__links li { margin: 0 0 8px; }

body.sv .svFooter__links a { color: #e9e2d2; font-size: 15px; text-decoration: none; }
body.sv .svFooter__links a:hover { color: #fff; text-decoration: underline; }

.svFooter__bottom {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-top: 18px;
    padding-bottom: 24px;
    border-top: 1px solid rgba(230, 211, 168, .18);
    font-size: 14px;
}

@media (max-width: 900px) { .svFooter__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .svFooter__grid { grid-template-columns: 1fr; } }

/* ---------- Внутренние страницы (унаследованная разметка) ---------- */

body.sv .container { max-width: var(--sv-container); }

body.sv .heading-line,
body.sv .pageIntro__title,
body.sv .infoProducts h1 {
    font-family: var(--sv-serif);
    font-weight: 600;
    color: var(--sv-emerald-ink);
}

body.sv .mainText { color: var(--sv-ink); font-size: 16px; line-height: 1.7; }

body.sv .modal-content {
    border-radius: var(--sv-radius);
    border: 1px solid var(--sv-line);
    background: var(--sv-paper);
}

/* Карточки шаблонов */
.svDesignGrid { margin: 0 -8px; }

body.sv .layoutCard__preview { background-color: var(--sv-sand); border-radius: var(--sv-radius-sm); }
body.sv .nameDesign { font-family: var(--sv-sans); font-weight: 600; color: var(--sv-ink); }

/* ---------- Страница продукции /designer/{slug}/ ---------- */

.svPageHead { padding: 48px 0 32px; }

body.sv .svPageHead__title {
    margin: 0 0 12px;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.05;
    color: var(--sv-emerald-ink);
}

.svPageHead__lead { margin: 0; max-width: 680px; font-size: 18px; color: var(--sv-muted); }

.svFormats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.svFormat {
    display: flex;
    flex-direction: column;
    padding: 24px;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
}

.svFormat__stage {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 170px;
    margin-bottom: 18px;
    border-radius: var(--sv-radius-sm);
    background: var(--sv-sand);
}

.svFormat__sheet {
    position: relative;
    background: var(--sv-paper);
    border: 1px solid var(--sv-gold);
    box-shadow: var(--sv-shadow);
}

.svFormat__sheet::after {
    content: '';
    position: absolute;
    inset: 8%;
    border: 1px dashed rgba(31, 90, 72, .35);
}

body.sv .svFormat__name { margin: 0 0 8px; font-family: var(--sv-serif); font-weight: 600; font-size: 24px; }

.svFormat__specs { margin: 0 0 20px; padding: 0; list-style: none; font-size: 14px; color: var(--sv-muted); }
.svFormat__specs li { padding: 3px 0; }
.svFormat .svBtn { margin-top: auto; width: 100%; }
.svFormat__specs { margin-bottom: 6px; }
/* «i Для типографии»: вылеты и безопасная зона по клику */
.svFormat__print { margin: 0 0 18px; font-size: 13px; color: var(--sv-muted); }
.svFormat__print summary {
    display: inline-flex; align-items: center; gap: 6px;
    list-style: none; cursor: pointer; color: var(--sv-emerald);
}
.svFormat__print summary::-webkit-details-marker { display: none; }
.svFormat__print summary:hover { text-decoration: underline; text-underline-offset: 3px; }
.svFormat__printIcon {
    display: inline-grid; place-items: center; width: 16px; height: 16px;
    border: 1px solid currentColor; border-radius: 50%;
    font: italic 600 11px/1 var(--sv-serif);
}
.svFormat__print ul { margin: 8px 0 0; padding: 10px 12px; list-style: none; background: var(--sv-sand); border-radius: var(--sv-radius-sm); }
.svFormat__print li + li { margin-top: 4px; }
/* Ссылка к ленте шаблонов под заголовком страницы конструктора */
.svPageHead__jump { display: inline-block; margin-top: 14px; font-size: 15px; font-weight: 500; color: var(--sv-emerald); text-decoration: underline; text-decoration-color: rgba(31, 90, 72, .3); text-underline-offset: 4px; }
.svPageHead__jump:hover { text-decoration-color: currentColor; }
#templates-title { scroll-margin-top: calc(var(--site-header-height) + 16px); }

.svPageActions { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 0; }

/* Форматы сразу под H1 — основной сценарий страницы конструктора */
.svFormatsSection { padding: 56px 0 72px; }
@media (max-width: 767px) { .svFormatsSection { padding: 40px 0 48px; } }
/* Телефон: форматы — компактные строки (миниатюра · название и размер ·
   «Создать» во всю ширину), чтобы лента шаблонов была близко к первому экрану. */
@media (max-width: 600px) {
    .svFormats { gap: 10px; }
    .svFormat {
        display: grid;
        grid-template-columns: 64px 1fr;
        grid-template-areas: "stage name" "stage specs" "btn btn";
        column-gap: 14px;
        row-gap: 2px;
        align-items: center;
        padding: 14px;
    }
    .svFormat__stage { grid-area: stage; height: 64px; margin: 0; }
    .svFormat__sheet { flex: none; transform: scale(.36); }
    .svFormatsSection { padding: 32px 0 36px; }
    body.sv .svFormat__name { grid-area: name; align-self: end; margin: 0; font-size: 19px; line-height: 1.15; }
    .svFormat__specs { grid-area: specs; align-self: start; margin: 0; font-size: 13px; }
    .svFormat__specs li { padding: 0; }
    .svFormat__specs li + li { display: none; }
    .svFormat__print { display: none; }
    .svFormat .svBtn { grid-area: btn; margin-top: 10px; }
    .svFormat > [itemprop="offers"] { display: none; }
}

/* ---------- Лента шаблонов (scroll-snap, partials/_design_rail.html.twig) ---------- */

.svSection--rail { padding: 72px 0 32px; }
.svSection--banner { padding: 24px 0 8px; }
@media (max-width: 767px) {
    .svSection--rail { padding: 48px 0 24px; }
    .svSection--banner { padding: 16px 0 0; }
}

.svRail__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 24px;
}

.svRail__nav { display: flex; flex-shrink: 0; gap: 8px; }
.svRail__nav[hidden] { display: none; }

body.sv .svRail__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1.5px solid var(--sv-line);
    border-radius: 50%;
    background: var(--sv-paper);
    color: var(--sv-emerald);
    cursor: pointer;
    transition: border-color .2s, opacity .2s;
}
body.sv .svRail__btn:hover:not(:disabled) { border-color: var(--sv-emerald); }
body.sv .svRail__btn:disabled { opacity: .35; cursor: default; }
.svRail__btn--prev svg { transform: rotate(180deg); }

.svRail__track {
    --rail-gap: 20px;
    --rail-per-view: 4;
    display: flex;
    gap: var(--rail-gap);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 0 14px;
    scrollbar-width: thin;
    scrollbar-color: var(--sv-gold-soft) transparent;
}

body.sv .svRail__track > a {
    flex: 0 0 calc((100% - (var(--rail-per-view) - 1) * var(--rail-gap)) / var(--rail-per-view));
    min-width: 0;
    margin: 0;
    scroll-snap-align: start;
}

.svRail .layoutCard__preview,
.svRail .layoutCard__preview.preview_img_click { height: 260px; }

@media (max-width: 1024px) { .svRail__track { --rail-per-view: 3; } }

/* Телефон: лента до краёв экрана (сознательный горизонтальный скролл
   внутри ленты, у страницы его нет), видно край следующей карточки. */
@media (max-width: 767px) {
    .svRail__nav { display: none !important; }
    .svRail__track {
        --rail-gap: 12px;
        --rail-per-view: 2.2;
        margin: 0 -16px;
        padding: 4px 16px 12px;
        scroll-padding-inline: 16px;
    }
    .svRail .layoutCard__preview,
    .svRail .layoutCard__preview.preview_img_click { height: 200px; }
}

@media (prefers-reduced-motion: reduce) { .svRail__track { scroll-behavior: auto; } }

.svRail__more { margin: 20px 0 0; }
@media (max-width: 600px) { .svRail__more .svBtn { width: 100%; } }

/* ---------- Тихий баннер комплекта (partials/_kit_banner.html.twig) ---------- */

.svKitBanner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 28px;
    padding: 22px 28px;
    border: 1px solid var(--sv-gold-soft);
    border-radius: var(--sv-radius);
    background: var(--sv-paper);
}

body.sv .svKitBanner__title {
    margin: 0;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: 24px;
    line-height: 1.2;
    color: var(--sv-emerald-ink);
}

.svKitBanner__text { margin: 4px 0 0; color: var(--sv-muted); }
.svKitBanner__price { font-weight: 600; color: var(--sv-ink); white-space: nowrap; }

/* Каталог /designs/: баннер под выдачей, над «Другими подборками» */
.templates-kit { margin-top: 40px; }
.templates-blank { margin: 28px 0 0; text-align: center; font-size: 15px; color: var(--sv-muted); }
.templates-blank a { font-weight: 600; }

/* Каталог /designs/: текст подборки под выдачей (стили прозы — .svProse,
   как у SEO-текста страницы конструктора). */
.templates-seo { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--sv-line); }
.templates-seo .svProse { color: var(--sv-ink); }
.templates-seo h2 {
    margin: 0 0 16px;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.15;
    color: var(--sv-emerald-ink);
}
.templates-seo h2:not(:first-child) { margin-top: 36px; }
.templates-seo h3 {
    margin: 28px 0 8px;
    font-family: var(--sv-sans);
    font-weight: 600;
    font-size: 18px;
    line-height: 1.35;
    color: var(--sv-ink);
}
.templates-seo ul { margin: 0 0 1em; padding-left: 1.2em; }
.templates-seo li { margin: 0 0 .35em; }
.templates-seo__faq { margin: 0; }
.templates-seo__faq dt { margin: 20px 0 4px; font-weight: 600; }
.templates-seo__faq dd { margin: 0; color: var(--sv-muted); }

@media (max-width: 600px) {
    .svKitBanner { padding: 18px; }
    .svKitBanner__btn { width: 100%; }
}

/* SEO-тексты страниц — на всю ширину контейнера, как остальные блоки (решение владельца 2026-10-01) */
.svProse { font-size: 17px; line-height: 1.75; }
.svProse p { margin: 0 0 1em; }

.svChips { display: flex; flex-wrap: wrap; gap: 10px; }

body.sv .svChip {
    display: inline-flex;
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px solid var(--sv-line);
    background: var(--sv-paper);
    color: var(--sv-ink);
    font-weight: 500;
    text-decoration: none;
}

body.sv .svChip:hover { border-color: var(--sv-emerald); color: var(--sv-emerald); }

/* Хаб /designer/ */
.svHubGrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 900px) { .svHubGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .svHubGrid { grid-template-columns: 1fr; } }

/* Хлебные крошки */
body.sv .breadcrumbs,
body.sv .breadcrumb { background: transparent; font-size: 14px; }

body.sv .bread_crumbs { padding: 20px 0 0; background: transparent; }
body.sv .bread_crumbs ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--sv-muted); }
body.sv .bread_crumbs a { color: var(--sv-muted); text-decoration: none; }
body.sv .bread_crumbs a:hover { color: var(--sv-emerald); }
body.sv .bread_crumbs__sep { color: var(--sv-gold); }

/* Меню в одну строку: шапка не должна расти в высоту */
.svNav .svNav__list { flex-wrap: nowrap; white-space: nowrap; gap: 0; }
.svNav .svNav__list > li > a { padding: 10px 12px; }
.svHeader__inner { gap: 20px; }
@media (max-width: 1240px) {
    .svNav .svNav__list > li > a { padding: 10px 9px; font-size: 14.5px; }
}

body.sv .svNav.mainMenu { margin-top: 0; }
body.sv .svNav ul.parent { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 0; }
body.sv .svNav ul.parent > li { font-size: 15px; }
body.sv .svNav ul.parent > li > a {
    padding: 10px 12px;
    font-family: var(--sv-sans);
    font-weight: 500;
    border-radius: 999px;
    color: var(--sv-ink);
}
body.sv .svNav ul.parent > li > a:hover,
body.sv .svNav ul.parent > li > a[aria-current="page"] {
    background: var(--sv-sand);
    color: var(--sv-emerald);
    text-decoration: none;
}
body.sv .svNav .setSubmenu > a::after { margin-left: 2px; }
@media (max-width: 1240px) {
    body.sv .svNav ul.parent > li > a { padding: 10px 9px; }
    body.sv .svNav ul.parent > li { font-size: 14.5px; }
}

body.sv #goUp { width: 44px; height: 44px; }

/* Унаследованные секции внутренних страниц — на айвори, а не на белом */
body.sv .section { background-color: transparent; }
body.sv .section--band-green { background-color: var(--sv-emerald); }

/* ---------- Комплекты ---------- */

.svKits {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
}

.svKits--compact { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

body.sv .svKit {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
    color: var(--sv-ink);
    text-decoration: none;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

body.sv .svKit:hover { transform: translateY(-3px); box-shadow: var(--sv-shadow-lift); border-color: var(--sv-gold-soft); color: var(--sv-ink); }

.svKit__cover { display: block; aspect-ratio: 16 / 10; background: var(--sv-sand); }
.svKit__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.svKit__body { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 20px; }
.svKit__name { font-family: var(--sv-serif); font-weight: 600; font-size: 26px; line-height: 1.1; }
.svKit__text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; color: var(--sv-muted); }
.svKit__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; color: var(--sv-muted); }
.svKit__tag { padding: 2px 10px; border-radius: 999px; background: var(--sv-sand); font-size: 12px; color: var(--sv-muted); }

.svKit__palette { display: inline-flex; gap: 4px; }
.svKit__palette span { width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(42, 35, 32, .15); }
.svKit__palette--lg span { width: 20px; height: 20px; }

.svKitHero { padding: 32px 0 56px; }
.svKitHero__inner { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 48px; align-items: center; }
.svKitHero__cover { border-radius: 18px; overflow: hidden; background: var(--sv-sand); box-shadow: var(--sv-shadow); aspect-ratio: 16 / 10; }
.svKitHero__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.svKitHero__facts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 20px 0 0; }
.svKitHero__count { margin: 16px 0 0; font-weight: 600; color: var(--sv-emerald); }

@media (max-width: 900px) {
    .svKitHero__inner { grid-template-columns: 1fr; gap: 28px; }
}

.svKitSection .svSectionHead { margin-bottom: 24px; }

.svKitGrid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 24px 20px;
    min-height: 0;
}

.svKitGrid > a { display: block; width: auto !important; margin: 0 !important; }

.svKitTimeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.svKitTimeline__item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 20px;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
}

.svKitTimeline__when { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--sv-muted); }
.svKitTimeline__title { font-family: var(--sv-serif); font-weight: 600; font-size: 22px; line-height: 1.15; }
.svKitTimeline__why { font-size: 14px; color: var(--sv-muted); }

@media (max-width: 900px) { .svKitTimeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .svKitTimeline { grid-template-columns: 1fr; } }

/* ---------- Живая поддержка ---------- */

.svSupport { position: fixed; right: 20px; bottom: 20px; z-index: 1100; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.svSupport__btn {
    min-height: 48px; padding: 0 22px; border: 0; border-radius: 999px;
    background: var(--sv-emerald); color: #fff; font: 600 15px/1 var(--sv-sans);
    box-shadow: 0 8px 24px rgba(15, 44, 36, .25); cursor: pointer;
}
.svSupport__btn:hover { background: var(--sv-emerald-deep); }
.svSupport__panel { width: min(320px, calc(100vw - 40px)); padding: 18px 20px; background: var(--sv-paper); border: 1px solid var(--sv-line); border-radius: var(--sv-radius); box-shadow: var(--sv-shadow-lift); }
.svSupport__panel[hidden] { display: none; }
.svSupport__title { margin: 0 0 6px; font-family: var(--sv-serif); font-weight: 600; font-size: 22px; }
.svSupport__text { margin: 0 0 14px; font-size: 14px; color: var(--sv-muted); }
.svSupport__links { display: flex; gap: 8px; }
.svSupport__links .svBtn { min-height: 42px; padding: 0 18px; font-size: 14px; }
/* Кнопка «наверх» из site.css уходит влево, чтобы не спорить с поддержкой */
body.sv #goUp { left: 20px; right: auto; }

.svKitPromise { padding: 0 0 24px; }
.svKitPromise__inner { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.svKitPromise__item { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-left: 2px solid var(--sv-gold); background: var(--sv-paper); border-radius: 0 var(--sv-radius-sm) var(--sv-radius-sm) 0; }
.svKitPromise__title { font-weight: 600; }
.svKitPromise__text { font-size: 14px; color: var(--sv-muted); }
@media (max-width: 800px) { .svKitPromise__inner { grid-template-columns: 1fr; } }

/* ---------- Страница шаблона: мокапы и комплект ---------- */

.svMockups { margin: 40px 0 8px; }
body.sv .svMockups__title { margin: 0 0 16px; font-family: var(--sv-serif); font-weight: 600; font-size: 32px; color: var(--sv-emerald-ink); }
.svMockups__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.svMockups__item { margin: 0; overflow: hidden; border-radius: var(--sv-radius); background: var(--sv-sand); border: 1px solid var(--sv-line); }
.svMockups__item img { display: block; width: 100%; height: auto; }
.svMockups__item figcaption { padding: 8px 14px 10px; font-size: 13px; color: var(--sv-muted); background: var(--sv-paper); }

body.sv .svKitLink {
    display: grid; gap: 2px; margin: 28px 0 8px; padding: 18px 22px;
    border: 1px solid var(--sv-gold-soft); border-radius: var(--sv-radius);
    background: var(--sv-paper); color: var(--sv-ink); text-decoration: none;
    transition: box-shadow .2s, border-color .2s;
}
body.sv .svKitLink:hover { border-color: var(--sv-gold); box-shadow: var(--sv-shadow); color: var(--sv-ink); }
.svKitLink__eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--sv-muted); }
.svKitLink__name { font-family: var(--sv-serif); font-weight: 600; font-size: 26px; color: var(--sv-emerald-ink); }
.svKitLink__text { font-size: 14px; color: var(--sv-muted); }

/* ---------- «Моя свадьба»: вход на сайте ---------- */

/* Пункт шапки «Моя свадьба · 7 из 11» */
body.sv .svWedPill {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 16px;
    border: 1.5px solid var(--sv-emerald);
    border-radius: 999px;
    background: var(--sv-paper);
    color: var(--sv-emerald);
    font: 600 14.5px/1 var(--sv-sans);
    white-space: nowrap;
    text-decoration: none;
}
body.sv .svWedPill:hover { background: var(--sv-emerald); color: #fff; }
body.sv .svNav .svNav__list > li.svWedPill__li { margin-left: 10px; }
body.sv .svNav .svNav__list > li.svWedPill__li > a.svWedPill { padding: 0 16px; border-radius: 999px; }
/* С «Моей свадьбой» меню не помещалось (контейнер 1200px) и пилюля вплотную
   наезжала на корзину (проход 2026-10-05): пункты плотнее, у пилюли отступ. */
body.sv .svNav .svNav__list > li.svWedPill__li { margin-right: 4px; }
body.sv .svNav ul.parent:has(.svWedPill__li) > li > a { padding: 10px 8px; }
body.sv .svNav ul.parent:has(.svWedPill__li) > li { font-size: 14.5px; }
body.sv .svNav .svNav__list > li.svWedPill__li { margin-left: 6px; }
body.sv .svNav .svNav__list > li.svWedPill__li > a.svWedPill { padding: 0 14px; }
@media (max-width: 1240px) {
    body.sv .svNav ul.parent:has(.svWedPill__li) > li > a { padding: 10px 6px; }
    body.sv .svHeader__inner:has(.svWedPill__li) .accountNav__name { max-width: 7em; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 1150px) {
    /* Остаётся значок кабинета (подпись — в aria-label меню и в самом кабинете). */
    body.sv .svHeader__inner:has(.svWedPill__li) .accountNav__name { display: none; }
}
body.sv .svWedPill--header { display: none; }
@media (max-width: 1080px) {
    body.sv .svWedPill--header { display: inline-flex; flex: none; margin-left: auto; min-height: 36px; padding: 0 14px; font-size: 14px; }
    body.sv .svWedPill--header + .svHeader__burger { margin-left: 0; flex: none; }
    .svHeader__inner:has(.svWedPill--header) { gap: 10px; }
    .svHeader__inner:has(.svWedPill--header) .svHeader__utils { display: none; }
}
@media (max-width: 420px) {
    body.sv .svWedPill--header { padding: 0 12px; font-size: 13px; }
}
.svWedPill__li--mobile { margin-bottom: 8px; }
body.sv .mobileMainMenu__list .svWedPill--mobile { display: flex; justify-content: center; min-height: 48px; }

/* Страница комплекта: цена-якорь, главная кнопка, один предмет */
.svKitPrice { display: flex; flex-direction: column; gap: 2px; margin: 22px 0 0; }
.svKitPrice__line { font-size: 15px; color: var(--sv-muted); }
.svKitPrice__line s { text-decoration-thickness: 1px; }
.svKitPrice__line--main { font-family: var(--sv-serif); font-size: 26px; font-weight: 600; line-height: 1.2; color: var(--sv-emerald-ink); }
.svKitPrice__note { font-size: 13.5px; color: var(--sv-muted); }
.svPageActions--kit { align-items: center; gap: 8px 22px; margin-top: 20px; }
.svKitChoose { margin: 0; }
body.sv .svKitOne { font-weight: 500; text-decoration: underline; text-decoration-color: rgba(31, 90, 72, .3); text-underline-offset: 4px; }
body.sv .svKitOne:hover { text-decoration-color: currentColor; }
.svKitGuarantee { margin: 14px 0 0; max-width: 460px; font-size: 13.5px; color: var(--sv-muted); }
@media (max-width: 600px) {
    .svKitChoose, .svKitChoose .svBtn { width: 100%; }
    .svPageActions--kit { flex-direction: column; align-items: stretch; text-align: center; }
    .svKitGuarantee { text-align: center; margin-left: auto; margin-right: auto; }
}

/* Раздел «Комплекты»: подбор по ответам «трёх вопросов» (пакет правок 2, п. 9) */
.svKitsAnswers { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 8px; font-size: 15px; color: var(--sv-ink); }
body.sv .svKitsHead { margin: 20px 0 18px; }
body.sv .svKitsHead--quiet { margin-top: 48px; font-size: 28px; color: var(--sv-muted); }
.svKitsNone { margin: 0 0 18px; font-size: 15px; color: var(--sv-muted); }
.svKits--big { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 28px; }
@media (max-width: 600px) { .svKits--big { grid-template-columns: 1fr; } }
body.sv .svKit--big .svKit__name { font-size: 32px; }

/* Быстрый просмотр: «Взять в мою свадьбу» + «Только этот макет» ссылкой */
.designSizeDialog__actions { display: flex; flex-direction: column; align-items: stretch; gap: 4px; text-align: center; }
body.sv a.designSizeDialog__ctaBtn--link {
    min-width: 0;
    padding: 6px 4px;
    background: none;
    border: 0;
    box-shadow: none;
    color: var(--sv-emerald);
    font: 500 14px/1.3 var(--sv-sans);
    text-decoration: underline;
    text-decoration-color: rgba(31, 90, 72, .3);
    text-underline-offset: 4px;
}
body.sv a.designSizeDialog__ctaBtn--link:hover { color: var(--sv-emerald-deep); background: none; text-decoration-color: currentColor; }
@media (max-width: 1240px) {
}

/* Страница комплекта: группы «Пригласить / Встретить / Поблагодарить» + «Для гостей» */
.svKitGroup__head { margin-bottom: 24px; }
.svKitGroup .svKitSection { margin-top: 28px; }
.svKitGroup .svKitSection:first-of-type { margin-top: 0; }
.svKitSection__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin-bottom: 16px; }
body.sv .svKitSection__title { margin: 0; font-family: var(--sv-sans); font-size: 17px; font-weight: 600; color: var(--sv-ink); }
.svKitSection__why { margin: 0; font-size: 14px; color: var(--sv-muted); }
.svKitGroup--guests .svH2 { color: var(--sv-muted); }

/* ---------- Главная: развилка «комплект / один макет» ---------- */

.svPaths {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.svPath {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 22px;
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
    background: var(--sv-paper);
    box-shadow: var(--sv-shadow);
}

body.sv .svPath__title {
    margin: 0;
    font-family: var(--sv-serif);
    font-weight: 600;
    font-size: 24px;
    line-height: 1.15;
    color: var(--sv-emerald-ink);
}

.svPath__head { display: grid; gap: 4px; }
.svPath__price { font-weight: 600; font-size: 22px; color: var(--sv-ink); white-space: nowrap; }
.svPath__text { margin: 0 0 6px; font-size: 15px; color: var(--sv-muted); }
.svPath__btn { margin-top: auto; padding: 0 18px; white-space: nowrap; }

@media (max-width: 1100px) and (min-width: 901px) {
    .svPath { padding: 18px; }
    body.sv .svPath__title { font-size: 20px; }
    .svPath__text { font-size: 14px; }
}

@media (max-width: 600px) {
    .svPaths { grid-template-columns: 1fr; gap: 16px; }
    .svPath { padding: 20px 18px; }
}

/* ---------- Главная: как это работает, два пути ---------- */

.svRoutes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }

.svRoute {
    padding: 28px;
    background: var(--sv-paper);
    border-radius: var(--sv-radius);
    border: 1px solid var(--sv-line);
}

body.sv .svRoute__title { margin: 0 0 20px; font-family: var(--sv-serif); font-weight: 600; font-size: 26px; }

.svRoute__steps { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.svRoute__steps li { display: flex; align-items: center; gap: 14px; }
.svRoute__steps .svStep__num { flex: none; margin: 0; }
.svRoute__steps p { margin: 0; color: var(--sv-muted); }

@media (max-width: 800px) { .svRoutes { grid-template-columns: 1fr; } }

/* ---------- Аудит 2026-09-26, P3: мобильная версия ---------- */

/* Метки карточек комплектов («9 макетов», «орнамент») — не мельче 13–14 px */
.svKit__meta { font-size: 14px; }
.svKit__tag { font-size: 13px; }

/* Переключатель языка на главной — кнопки от 40 px в высоту */
.svLangSwitch__btn { min-height: 40px; padding: 0 16px; line-height: 1; display: inline-flex; align-items: center; }

/* Мобильное меню: светлый текст на тёмно-изумрудной панели (контраст
   белого на #173f33 ≈ 11:1). Было: тёмно-зелёные ссылки (body.sv a) на
   ярко-зелёном градиенте make-dp — около 2:1. */
body.sv .mobileMainMenu__panel { background: var(--sv-emerald-deep); }
body.sv .mobileMainMenu li > a,
body.sv .mobileMainMenu li > a:hover,
body.sv .mobileMainMenu li > a:focus,
body.sv .mobileMainMenu .accountNav__mobile-list a,
body.sv .mobileMainMenu .accountNav__mobile-login { color: #fff; }
body.sv .mobileMainMenu .accountNav__mobile-list a[aria-current="page"] { color: var(--sv-gold-soft); }
body.sv .mobileMainMenu .accountNav__mobile-list .accountNav__logout { color: #ffd4d4; }
body.sv .mobileMainMenu .accountNav__mobile-signup,
body.sv .mobileMainMenu .accountNav__mobile-signup:hover { color: var(--sv-emerald-deep); }
body.sv .mobileMainMenu .accountNav__heading { color: rgba(255, 255, 255, .75); }

@media (max-width: 900px) {
    /* Хлебные крошки и ссылки подвала — зона нажатия от 44 px. У крошек
       отступ компенсирован отрицательным полем: строка не растёт. */
    body.sv .bread_crumbs a { display: inline-block; padding-block: 14px; margin-block: -14px; }
    .svFooter__links li { margin: 0; }
    body.sv .svFooter__links a { display: block; padding-block: 12px; line-height: 20px; }
}

/* «Наверх» на телефоне не показываем: круг в углу закрывал текст (последние
   строки подвала, абзацы при прокрутке), а прокручивается окно — у браузера
   есть свой быстрый возврат наверх. */
@media (max-width: 690px) {
    body.sv #goUp { display: none !important; }
}

/* Заказ комплекта: одна основная кнопка — на главную свадьбы — над списком */
.orderPaidLayouts__kit { margin: 4px 0 20px; }

/* ---------- Выбор ориентации макета (#typeProductDialog, base.html.twig) ---------- */
.orientDialog .modal-content { border: 0; border-radius: var(--sv-radius); background: var(--sv-paper); box-shadow: var(--sv-shadow); }
.orientDialog__head { padding: 20px 24px 4px; border-bottom: 0; }
body.sv .orientDialog__title { margin: 0; font-family: var(--sv-serif); font-size: 26px; font-weight: 600; line-height: 1.15; color: var(--sv-emerald-ink); }
.orientDialog .modal-body { padding: 12px 24px 24px; }
.orientDialog__choices { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.orientDialog__choice {
    display: flex; flex-direction: column; align-items: center; gap: 12px;
    padding: 18px 12px 16px; border: 1px solid var(--sv-line); border-radius: var(--sv-radius);
    background: #fff; color: var(--sv-ink); text-decoration: none;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.orientDialog__choice:hover, .orientDialog__choice:focus-visible {
    border-color: var(--sv-emerald); box-shadow: var(--sv-shadow); transform: translateY(-2px); color: var(--sv-ink); text-decoration: none;
}
.orientDialog__choice:focus-visible { outline: 2px solid var(--sv-emerald); outline-offset: 3px; }
.orientDialog__stage { display: flex; align-items: center; justify-content: center; width: 100%; height: 130px; border-radius: var(--sv-radius-sm); background: var(--sv-sand); }
.orientDialog__sheet { position: relative; display: block; background: var(--sv-paper); border: 1px solid var(--sv-gold); box-shadow: 0 6px 14px rgba(42, 35, 32, .12); }
.orientDialog__sheet::after { content: ''; position: absolute; inset: 9%; border: 1px dashed rgba(31, 90, 72, .35); }
.orientDialog__sheet--h { width: 108px; height: 72px; }
.orientDialog__sheet--v { width: 72px; height: 108px; }
.orientDialog__label { font-weight: 600; font-size: 16px; }
@media (max-width: 480px) {
    .orientDialog__stage { height: 104px; }
    .orientDialog__sheet--h { width: 84px; height: 56px; }
    .orientDialog__sheet--v { width: 56px; height: 84px; }
}
@media (prefers-reduced-motion: reduce) { .orientDialog__choice { transition: none; } .orientDialog__choice:hover { transform: none; } }
.orientDialog__head { position: relative; padding-right: 64px; }
.orientDialog__head .close {
    position: absolute; top: 14px; right: 14px; float: none;
    display: grid; place-items: center; width: 40px; height: 40px; margin: 0;
    border-radius: 50%; background: var(--sv-sand); color: var(--sv-emerald); opacity: 1; text-shadow: none; font-size: 14px;
}
.orientDialog__head .close:hover, .orientDialog__head .close:focus-visible { background: var(--sv-line); color: var(--sv-emerald-ink); opacity: 1; }


/* Чип «ваш макет сохранён» на входе/регистрации (partials/auth/_pending_layout):
   мини-лист в пропорциях макета с золотой рамкой и галочкой, название с засечками. */
.authPending {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 4px 0 26px;
    padding: 16px 18px 16px 16px;
    background:
        radial-gradient(120% 140% at 0% 0%, rgba(230, 211, 168, .35), transparent 55%),
        linear-gradient(135deg, var(--sv-paper), var(--sv-sand));
    border: 1px solid var(--sv-gold-soft);
    border-radius: var(--sv-radius);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset, 0 10px 28px -18px rgba(23, 63, 51, .45);
    overflow: hidden;
    animation: authPendingIn .5s cubic-bezier(.2, .7, .2, 1) both;
}
.authPending::after {
    /* тонкий золотой блик по верхней кромке */
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--sv-gold), transparent);
    opacity: .55;
}
.authPending__stage {
    position: relative;
    display: grid;
    place-items: center;
    flex: 0 0 76px;
    height: 76px;
}
.authPending__sheet {
    position: relative;
    display: block;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(42, 35, 32, .12), 0 8px 18px -8px rgba(42, 35, 32, .35);
    transform: rotate(-4deg);
}
.authPending__sheet--v { width: 50px; height: 70px; }
.authPending__sheet--h { width: 72px; height: 50px; }
.authPending__sheet--sq { width: 60px; height: 60px; }
.authPending__sheet::before {
    /* внутренняя золотая рамка, как у шаблонов */
    content: "";
    position: absolute;
    inset: 5px;
    border: 1px solid var(--sv-gold);
    border-radius: 1px;
}
.authPending__lines {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.authPending__lines i {
    display: block;
    height: 2px;
    border-radius: 2px;
    background: var(--sv-gold-soft);
}
.authPending__lines i:nth-child(1) { width: 40%; }
.authPending__lines i:nth-child(2) { width: 58%; height: 4px; background: var(--sv-emerald); opacity: .85; }
.authPending__lines i:nth-child(3) { width: 34%; }
.authPending__check {
    position: absolute;
    right: -2px;
    bottom: -2px;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--sv-emerald);
    color: #fff;
    box-shadow: 0 0 0 3px var(--sv-paper), 0 4px 10px rgba(23, 63, 51, .35);
    animation: authPendingCheck .45s .25s cubic-bezier(.3, 1.6, .5, 1) both;
}
.authPending__text { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.authPending__eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--sv-gold);
}
.authPending__title {
    font-family: var(--sv-serif);
    font-size: 26px;
    font-weight: 600;
    line-height: 1.05;
    color: var(--sv-emerald-ink);
}
.authPending__size {
    display: inline-block;
    padding: 3px 10px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--sv-emerald);
    background: rgba(255, 255, 255, .75);
    border: 1px solid var(--sv-line);
    border-radius: 999px;
}
.authPending__note { margin-top: 2px; font-size: 13.5px; line-height: 1.45; color: var(--sv-muted); }
@keyframes authPendingIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes authPendingCheck { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
@media (max-width: 420px) {
    .authPending { gap: 14px; padding: 14px; }
    .authPending__stage { flex-basis: 60px; height: 64px; }
    .authPending__sheet { transform: rotate(-4deg) scale(.82); }
    .authPending__title { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .authPending, .authPending__check { animation: none; }
}
/* Сетка входа/регистрации с чипом: справа — чип над преимуществами,
   на телефоне — чип перед формой (преимущества там скрыты). */
.authPage__grid--pending {
    grid-template-areas: "card pending" "card aside";
    grid-template-rows: auto 1fr;
    row-gap: 8px;
}
.authPage__grid--pending > .authCard { grid-area: card; }
.authPage__grid--pending > .authPage__pending { grid-area: pending; padding: 0 0 0 8px; }
.authPage__grid--pending > .authAside { grid-area: aside; padding-top: 16px; }
.authPage__pending .authPending { margin: 0; }
@media (min-width: 768px) {
    .authPage__pending .authPending { gap: 22px; padding: 22px 24px 22px 20px; }
    .authPage__pending .authPending__stage { flex-basis: 96px; height: 96px; }
    .authPage__pending .authPending__sheet--v { width: 62px; height: 88px; }
    .authPage__pending .authPending__sheet--h { width: 90px; height: 62px; }
    .authPage__pending .authPending__sheet--sq { width: 76px; height: 76px; }
    .authPage__pending .authPending__title { font-size: 30px; }
}
@media (max-width: 767px) {
    .authPage__grid--pending { grid-template-areas: "pending" "card"; grid-template-rows: auto; }
    .authPage__grid--pending > .authPage__pending { padding: 0 0 16px; }
    /* Вход/регистрация на телефоне: после крошек сразу к делу. */
    .section.authPage { padding-top: 20px; }
}

/* Быстрый просмотр шаблона из комплекта: две равные карточки выбора
   «Один макет» / «Весь комплект» (base.html.twig, fillDesignDialog()). */
.designChoice {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px dashed var(--sv-line);
}
.designChoice[hidden], .designSizeDialog__cta[hidden] { display: none; }
.designChoice__card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 16px 16px 14px;
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius);
}
.designChoice__card--kit {
    background: linear-gradient(160deg, var(--sv-paper), var(--sv-sand));
    border-color: var(--sv-gold-soft);
}
.designChoice__badge {
    position: absolute;
    top: -10px;
    right: 14px;
    padding: 2px 10px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sv-emerald-ink);
    background: var(--sv-gold-soft);
    border-radius: 999px;
}
.designChoice__label { font-size: 13px; color: var(--sv-muted); }
.designChoice__price { font-size: 24px; font-weight: 600; line-height: 1.15; color: var(--sv-ink); }
.designChoice__price--text { font-family: var(--sv-serif); font-size: 24px; color: var(--sv-emerald-ink); }
.designChoice__desc { flex: 1; margin-bottom: 10px; font-size: 13.5px; line-height: 1.45; color: var(--sv-muted); }
body.sv .designChoice__btn { width: 100%; min-width: 0; white-space: normal; text-align: center; justify-content: center; }
body.sv .designChoice__kitLink { align-self: center; margin-top: 6px; font-size: 13.5px; color: var(--sv-emerald-ink); text-decoration: underline; text-underline-offset: 3px; }
body.sv .designChoice__kitLink:hover { color: var(--sv-emerald); }
body.sv .designChoice__kitLink[hidden] { display: none; }
@media (max-width: 479px) {
    .designChoice { grid-template-columns: 1fr; gap: 16px; }
}
/* Карточки — в правой колонке окна (если размеров несколько — под превью):
   левая колонка (превью) тянется на все строки, лишняя высота уходит в
   последнюю. На телефоне колонки — стопкой, карточки после превью
   (site.css: превью 1, размеры 2, цена 3). */
@media (min-width: 768px) {
    .designSizeDialog__top:has(> .designChoice:not([hidden])) { grid-template-columns: minmax(0, 1fr) 270px; grid-template-rows: auto auto 1fr; }
    .designSizeDialog__top > .designSizeDialog__main { grid-column: 1; grid-row: 1 / span 3; }
    .designSizeDialog__top > .designSizeOptions,
    .designSizeDialog__top > .designChoice { grid-column: 2; }
    .designSizeDialog__top > .designChoice { grid-template-columns: 1fr; gap: 20px; padding-top: 10px; border-top: 0; }
    /* Есть плитки размеров (site.js: --sizes) — правая колонка их; карточки
       под превью, рядом друг с другом. */
    .designSizeDialog__top--sizes:has(> .designChoice:not([hidden])) { grid-template-columns: minmax(0, 1fr) 260px; grid-template-rows: auto auto; }
    .designSizeDialog__top--sizes > .designSizeDialog__main { grid-row: 1; }
    .designSizeDialog__top--sizes > .designSizeOptions { grid-row: 1 / span 2; }
    .designSizeDialog__top--sizes > .designChoice { grid-column: 1; grid-row: 2; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 16px; border-top: 1px dashed var(--sv-line); }
}
@media (max-width: 767px) {
    .designChoice { order: 3; }
}

/* Корзина: «Приглашение · 100 × 150 мм», под ним шаблон; «что входит» —
   строкой без цены (цена позиции и так справа). */
.cartItem__content {
    grid-template-rows: auto auto auto 1fr auto;
    grid-template-areas:
        "kind kind"
        "title price"
        "tpl tpl"
        "desc desc"
        ". remove";
}
.cartItem--impositionOnly .cartItem__content {
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
        "kind price"
        "title title"
        "tpl tpl"
        ". remove";
}
.cartItem__template { grid-area: tpl; margin: -2px 0 0; font-size: 14px; color: var(--sv-muted); }
.cartItem__includes { grid-area: desc; margin: 0; font-size: 14px; color: var(--sv-muted); }

/* Корзина в шапке: значок был белым под тёмную шапку make-dp — на светлой
   пропадал (виден был только счётчик). Теперь изумрудный на бумаге. */
body.sv .accountNav__cart {
    background: var(--sv-paper);
    border: 1px solid var(--sv-line);
    color: var(--sv-emerald);
}
body.sv .accountNav__cart:hover,
body.sv .accountNav__cart.is-active {
    background: var(--sv-sand);
    border-color: var(--sv-gold-soft);
    color: var(--sv-emerald-deep);
}
.accountNav__cartIcon { display: block; }

/* «Наверх»: кружок 44px, а стрелка (main.css) рассчитана на старые 70px и
   вылезала за край — ровная стрелка по центру. */
body.sv #goUp::before {
    width: 12px;
    height: 12px;
    top: 50%;
    left: 50%;
    border-left-width: 2.5px;
    border-top-width: 2.5px;
    transform: translate(-50%, -25%) rotate(45deg);
}

/* «Мои макеты»: шаблон под названием; «В корзине» / «Ждёт оплаты» — мягкие
   золотистые плашки (красные выглядели как ошибка). */
.layoutCard__template { margin: 2px 0 0; font-size: 13px; color: var(--sv-muted); }
body.sv .layoutCard__badge--cart,
body.sv .layoutCard__badge--order,
body.sv a.layoutCard__badge--cart,
body.sv a.layoutCard__badge--order,
body.sv a.layoutCard__badge--cart:visited,
body.sv a.layoutCard__badge--order:visited {
    color: #7a5a1e;
    background: #fbf3df;
    border-color: var(--sv-gold-soft);
}
body.sv a.layoutCard__badge--cart:hover,
body.sv a.layoutCard__badge--cart:focus,
body.sv a.layoutCard__badge--order:hover,
body.sv a.layoutCard__badge--order:focus {
    color: #5e4414;
    background: #f5e7c4;
    border-color: var(--sv-gold);
}

/* Комплект в составе заказа — одной строкой, состав раскрывается. */
.orderCheckout__compositionRow--kit { align-items: flex-start; }
.orderCheckout__kit { flex: 1; min-width: 0; }
.orderCheckout__kit > summary { list-style: none; cursor: pointer; }
.orderCheckout__kit > summary::-webkit-details-marker { display: none; }
.orderCheckout__kitToggle { margin-left: 6px; font-size: 13px; color: var(--sv-emerald); text-decoration: underline; text-underline-offset: 3px; }
.orderCheckout__kit[open] .orderCheckout__kitToggle { text-decoration: none; }
.orderCheckout__kitList { margin: 8px 0 2px; padding-left: 18px; font-size: 14px; color: var(--sv-muted); }
.orderCheckout__kitList li + li { margin-top: 2px; }

/* Каталог: пустая выдача — заголовок, подсказка и следующий шаг
   (designs.html.twig #designsEmpty, site.js renderEmptyState). */
.containerDesign.is-empty { min-height: 0; }
.designsEmpty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 8px 0 32px;
    padding: 36px 20px;
    text-align: center;
    background: var(--sv-paper);
    border: 1px dashed var(--sv-gold-soft);
    border-radius: var(--sv-radius);
}
.designsEmpty[hidden] { display: none; }
.designsEmpty__icon {
    display: grid; place-items: center; width: 52px; height: 52px;
    border-radius: 50%; background: var(--sv-sand); color: var(--sv-emerald);
}
.designsEmpty__icon svg { width: 24px; height: 24px; }
body.sv .designsEmpty__title { margin: 4px 0 0; font-family: var(--sv-serif); font-size: 26px; font-weight: 600; line-height: 1.15; color: var(--sv-emerald-ink); }
.designsEmpty__text { max-width: 520px; margin: 0; font-size: 15px; color: var(--sv-muted); }
.designsEmpty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }

/* «Войти» / «Регистрация» в шапке — кнопки, а не ссылки как пункты меню
   (сливались с ним; решение владельца 2026-10-02). «Войти» — контурная,
   «Регистрация» — главная, залитая; у наведения свой вид. */
body.sv .accountNav__login,
body.sv .accountNav__signup {
    min-height: 38px;
    padding: 0 18px;
    border-radius: 999px;
    font-family: var(--sv-sans);
    font-size: 14px;
    font-weight: 600;
    box-shadow: none;
    transition: color .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
body.sv .accountNav__login {
    color: var(--sv-emerald);
    background: transparent;
    border: 1.5px solid var(--sv-emerald);
}
body.sv .accountNav__login::before { display: none; }
body.sv .accountNav__login:hover,
body.sv .accountNav__login:focus-visible,
body.sv .accountNav__login.is-active {
    color: #fff;
    background: var(--sv-emerald);
    border-color: var(--sv-emerald);
    box-shadow: none;
}
body.sv .accountNav__signup {
    color: #fff;
    background: var(--sv-emerald);
    border: 1.5px solid var(--sv-emerald);
}
body.sv .accountNav__signup:hover,
body.sv .accountNav__signup:focus-visible,
body.sv .accountNav__signup.is-active {
    color: #fff;
    background: var(--sv-emerald-deep);
    border-color: var(--sv-emerald-deep);
    box-shadow: 0 6px 16px -6px rgba(23, 63, 51, .55);
}

/* Самый узкий десктоп (1025–1149px): пункты меню ещё плотнее — с «Моей
   свадьбой» и корзиной строка иначе наезжала на аккаунт (на 1100px — на
   11px). Раньше для этого прятали «Поздравить» и «Статьи»; «Статей» в
   шапке больше нет. */
@media (min-width: 1025px) and (max-width: 1149px) {
    body.sv .svNav .svNav__list > li > a { padding-left: 6px; padding-right: 6px; font-size: 14px; }
    body.sv .svHeader__inner { gap: 14px; }
}

/* «Полезно почитать» — статьи по теме страницы (partials/_related_articles). */
.svRelatedArticles { padding-top: 0; }
.svRelatedArticles--bare { margin: 40px 0 8px; }
body.sv .svRelatedArticles__title { margin-bottom: 18px; }
.svRelatedArticles__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
body.sv a.svRelatedArticles__card {
    display: flex; flex-direction: column; gap: 6px; height: 100%; box-sizing: border-box;
    padding: 18px 20px; background: var(--sv-paper); border: 1px solid var(--sv-line);
    border-radius: var(--sv-radius); color: var(--sv-ink); text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
body.sv a.svRelatedArticles__card:hover { border-color: var(--sv-gold-soft); box-shadow: var(--sv-shadow); }
.svRelatedArticles__heading { font-family: var(--sv-serif); font-size: 21px; font-weight: 600; line-height: 1.2; color: var(--sv-emerald-ink); }
.svRelatedArticles__text { flex: 1; font-size: 14px; line-height: 1.45; color: var(--sv-muted); }
.svRelatedArticles__more { margin-top: 4px; font-size: 14px; font-weight: 600; color: var(--sv-emerald); }
.authPending__template { font-size: 13.5px; line-height: 1.35; color: var(--sv-muted); }
#sketch-download-formats { scroll-margin-top: calc(var(--site-header-height, 72px) + 16px); }

/* «Комплекты»: цена и кнопка начала — в шапке страницы. */
.svKitsOffer { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 18px; }
.svKitsOffer__price { margin: 0; font-size: 18px; color: var(--sv-ink); }
.svKitsOffer__price strong { font-family: var(--sv-serif); font-size: 26px; color: var(--sv-emerald-ink); }
.svKitsOffer__note { display: block; font-size: 14px; color: var(--sv-muted); }
/* Пока есть «Показать ещё» — номерные страницы только для краулера
   (ссылки ?page=N остаются в разметке), человеку одна кнопка. На последней
   странице кнопки нет — пагинатор виден, с него можно вернуться назад. */
.templates-more:not([hidden]) ~ .designsPager {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
/* «3 варианта текста» под именем сгруппированной карточки каталога. */
body.sv .nameDesign__variants { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; color: var(--sv-muted); }
/* Страница шаблона: вариант текста того же дизайна (DesignTemplatePages::variants()). */
body.sv .templatePageView__variants { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; }
body.sv .templatePageView__variantsTitle { flex-basis: 100%; font-size: 13px; color: var(--sv-muted); }
body.sv .templatePageView__variant {
    padding: 7px 14px; border: 1.5px solid var(--sv-line); border-radius: 999px; background: #fff;
    font-family: var(--sv-sans); font-size: 14px; font-weight: 600; color: var(--sv-ink); text-decoration: none;
}
body.sv a.templatePageView__variant:hover,
body.sv a.templatePageView__variant:focus-visible { border-color: var(--sv-emerald); outline: none; }
body.sv .templatePageView__variant.is-active { border-color: var(--sv-emerald); background: var(--sv-emerald); color: #fff; }
/* Статья: несколько кнопок карточками с обложкой и блок комплекта (PageController::articleCtas()). */
body.sv .articleCta__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; text-align: left; }
body.sv .articleCta__card {
    display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px solid var(--sv-line); border-radius: var(--sv-radius);
    background: #fff; color: var(--sv-ink); text-decoration: none; transition: border-color .15s, box-shadow .15s;
}
body.sv .articleCta__card:hover { border-color: var(--sv-emerald); box-shadow: var(--sv-shadow); }
body.sv .articleCta__thumb { display: grid; place-items: center; aspect-ratio: 4 / 3; border-radius: var(--sv-radius-sm); background: var(--sv-sand); overflow: hidden; }
body.sv .articleCta__thumb img { max-width: 88%; max-height: 88%; object-fit: contain; box-shadow: 0 4px 14px rgba(0, 0, 0, .12); }
body.sv .articleCta__label { font-family: var(--sv-sans); font-weight: 600; font-size: 15px; color: var(--sv-emerald-deep); }
/* Комплект в статье — общий «тихий баннер» (_kit_banner.html.twig); отступ от кнопок выше,
   выравнивание — по левому краю, как остальной текст статьи. */
body.sv .articleCta__kitBanner { margin-top: 18px; text-align: left; }
/* Каталог: счётчик и цена в одну строку (на телефоне — друг под другом). */
body.sv .templates-countRow { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; margin-bottom: 16px; }
body.sv .templates-countRow .templates-count { margin-bottom: 0; }
body.sv .templates-price { margin: 0; font-size: 14px; color: var(--sv-muted); }
body.sv .templates-price b { color: var(--sv-ink); font-weight: 600; }
/* Конструктор: цена под лентой шаблонов (designer_show). */
body.sv .svRailPrice { margin: 14px 0 0; font-size: 14px; color: var(--sv-muted); }
body.sv .svRailPrice b { color: var(--sv-ink); font-weight: 600; }
/* «590 ₽» не разрывать: на телефоне «₽» уезжал на отдельную строку. */
body.sv .templates-price b, body.sv .svRailPrice b { white-space: nowrap; }
/* Попап быстрого просмотра: размер одноразмерного шаблона под названием. */
body.sv .designSizeDialog__size { margin: 4px 0 0; font-size: 14px; color: var(--sv-muted); }
/* Попап: кружки цвета дизайна (site.js renderDesignColors). */
body.sv .designColors { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; }
body.sv .designColors[hidden] { display: none; }
body.sv .designColors__label { font-size: 13px; color: var(--sv-muted); margin-right: 4px; min-width: 9em; }
body.sv .designColors__dot {
    width: 26px; height: 26px; padding: 0; border-radius: 50%; border: 2px solid #fff; cursor: pointer;
    background: var(--swatch); box-shadow: 0 0 0 1px var(--sv-line); transition: box-shadow .15s, transform .15s;
}
body.sv .designColors__dot:hover { transform: scale(1.08); }
body.sv .designColors__dot.is-active { box-shadow: 0 0 0 2px var(--sv-emerald); cursor: default; }
body.sv .designColors__dot:focus-visible { outline: 2px solid var(--sv-emerald); outline-offset: 2px; }
/* Окно шаблона: вариант текста — как на странице шаблона (.templatePageView__variant). */
body.sv .designTexts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 10px 0 0; }
body.sv .designTexts[hidden] { display: none; }
body.sv .designTexts__label { font-size: 13px; color: var(--sv-muted); margin-right: 4px; min-width: 9em; }
body.sv .designTexts__chip {
    padding: 5px 12px; border: 1.5px solid var(--sv-line); border-radius: 999px; background: #fff;
    font-family: var(--sv-sans); font-size: 13px; font-weight: 600; color: var(--sv-ink); cursor: pointer;
}
body.sv .designTexts__chip:hover { border-color: var(--sv-emerald); }
body.sv .designTexts__chip.is-active { border-color: var(--sv-emerald); background: var(--sv-emerald); color: #fff; cursor: default; }
body.sv .designTexts__chip:focus-visible { outline: 2px solid var(--sv-emerald); outline-offset: 2px; }
body.sv .templatePageView__variant { display: inline-flex; align-items: center; gap: 7px; }
body.sv .templatePageView__swatch { width: 14px; height: 14px; border-radius: 50%; background: var(--swatch); box-shadow: 0 0 0 1px rgba(255, 255, 255, .7), 0 0 0 2px var(--sv-line); flex: none; }
/* Цвет комплекта: страница комплекта (ссылки ?cvet=) и карточка в списке. */
body.sv .svKitColors { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0 4px; }
body.sv .svKitColors__label { font-size: 14px; color: var(--sv-muted); min-width: 10em; }
body.sv .svKitColors__dot { display: inline-block; width: 30px; height: 30px; border-radius: 50%; background: var(--swatch); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--sv-line); transition: transform .15s; }
body.sv a.svKitColors__dot:hover { transform: scale(1.08); }
body.sv .svKitColors__dot.is-active { box-shadow: 0 0 0 2px var(--sv-emerald); }
body.sv .svKit__colors { display: inline-flex; align-items: center; gap: 5px; }
body.sv .svKit__colorDot { width: 14px; height: 14px; border-radius: 50%; background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(42, 35, 32, .15); }
body.sv .svKit__colorsText { font-size: 12px; color: var(--sv-muted); margin-left: 3px; }
body.sv .svVisuallyHidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Фильтр «Цвет»: кружки — реальные оттенки комплектов (WeddingCollection::SKINS),
   а не базовые цвета make-dp (ярко-синий, лимонный). Два оттенка в семействе —
   по диагонали. Аудит каталога 2026-10-04. */
body.sv .facet__swatch { border-radius: 50%; }
body.sv .facet__swatch--mono { background: linear-gradient(135deg, #FAF6EE 0 50%, #C29A4E 50% 100%); }
body.sv .facet__swatch--blue { background: linear-gradient(135deg, #8FAECB 0 50%, #1C2740 50% 100%); }
body.sv .facet__swatch--green { background: linear-gradient(135deg, #7D8F76 0 50%, #173F33 50% 100%); }
body.sv .facet__swatch--yellow { background: linear-gradient(135deg, #E3A68C 0 50%, #C29A4E 50% 100%); }
body.sv .facet__swatch--red { background: #5E2029; }
body.sv .facet__swatch--pink { background: linear-gradient(135deg, #F3E3E0 0 50%, #C99597 50% 100%); }
body.sv .facet__swatch--violet { background: #ACA0C2; }

/* Каталог на телефоне: разделы продукции — одной строкой с прокруткой.
   Переносом 11 чипов выходило 5 строк (≈234 px), и первая карточка уезжала
   под первый экран (аудит каталога 2026-10-04). До краёв экрана: поле
   контейнера (15 px) уходит в отступ ленты; затухание справа — намёк, что
   дальше есть ещё. Выбранный раздел site.js прокручивает в видимую часть. */
@media (max-width: 767px) {
    body.sv .templates-products {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-inline: -15px;
        padding: 2px 15px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 32px), transparent);
        mask-image: linear-gradient(to right, #000 calc(100% - 32px), transparent);
    }
    body.sv .templates-products::-webkit-scrollbar { display: none; }
    body.sv .templates-products a { flex: none; white-space: nowrap; }
}


/* Переключатель языка (перевод на татарский, 2026-10-06, _lang_switch):
   в шапке — тихая ссылка перед корзиной, самоназванием языка. */
/* Переключатель языка «Рус | Тат» (как на сайтах Татарстана): текущий — выделен, другой — ссылка. */
body.sv .svLang { display: inline-flex; align-items: center; gap: 4px; font: 500 12.5px/1 var(--sv-sans); letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
body.sv .svLang__item { color: var(--sv-muted, #6b6b6b); text-decoration: none; padding: 4px 1px; }
body.sv a.svLang__item:hover { color: var(--sv-emerald); text-decoration: underline; text-underline-offset: 3px; }
body.sv .svLang__item.is-current { color: var(--sv-emerald); font-weight: 700; }
body.sv .svLang__sep { color: var(--sv-line, #d8d8d0); }
/* Полоска над шапкой: маленькая капсула справа, текущий язык залит. */
body.sv .svTopbar { background: var(--sv-ivory-2, #f3eee3); border-bottom: 1px solid var(--sv-line); }
body.sv .svTopbar__inner { display: flex; justify-content: flex-end; align-items: center; min-height: 28px; }
body.sv .svTopbar__inner--wd { max-width: var(--wd-w); margin: 0 auto; padding: 0 var(--wd-pad); box-sizing: border-box; }
body.sv .svLang--top { gap: 0; padding: 1px; border: 1px solid var(--sv-line); border-radius: 999px; background: #fff; font-size: 11px; }
body.sv .svLang--top .svLang__sep { display: none; }
body.sv .svLang--top .svLang__item { padding: 3px 8px; border-radius: 999px; color: var(--sv-ink); font-weight: 600; }
body.sv .svLang--top a.svLang__item:hover { color: var(--sv-emerald); text-decoration: none; background: rgba(31, 90, 72, .06); }
body.sv .svLang--top .svLang__item.is-current { background: var(--sv-emerald); color: #fff; }
body.sv .svLang--mobile { display: flex; justify-content: center; gap: 10px; margin: 16px 0 0; padding: 12px 0; font-size: 15px; }
/* Мобильное меню — тёмно-зелёное: светлые метки, текущая — белая. */
body.sv .svLang--mobile .svLang__item { color: rgba(255, 255, 255, .62); padding: 8px 6px; }
body.sv .svLang--mobile .svLang__item.is-current { color: #fff; }
body.sv .svLang--mobile .svLang__sep { color: rgba(255, 255, 255, .3); }
body.sv .svLang--footer { color: inherit; }
body.sv .svLang--footer .svLang__item { color: inherit; }