/* =========================================================================
Reznikov Studio — внутренние страницы (кейс/процесс/поставки и пр.)
Ширина/ритм/шапка НАСЛЕДУЮТСЯ ОТ ГЛАВНОЙ: .container (--content-max 1760),
.section (--space-7), те же токены style.css. Самодостаточно (home.css грузится
только на главной), поэтому .section и мобильное меню шапки определяем здесь.
========================================================================= */
/* Защита от гориз. переполнения (была только в home.css → на внутренних терялась «белая полоса справа») */
html, body { max-width: 100%; overflow-x: clip; }
/* .section отсутствует в style.css (жила в home.css) — воспроизводим как на главной */
.section { padding-block: var(--space-7); }
.section--tight { padding-block: clamp(56px, 7vw, 80px); }
.section-head { margin-bottom: var(--space-5); }
.section-head h2 { font: var(--type-h2); margin: 12px 0 0; }
/* ------------------------------------------------------------------ */
/* ШАПКА: мобильное меню для solid header + hero-nav внутренних */
/* (порт минимального набора из home.css — glass-nav/hamburger/overlay)*/
/* ------------------------------------------------------------------ */
.hamburger { display: none; flex-direction: column; gap: 5px; padding: 10px 4px; background: none; border: none; cursor: pointer; }
.hamburger span { display: block; width: 22px; height: 1.5px; background: currentColor; }
.nav-mobile { display: none; align-items: center; gap: 8px; }
.nav-pop-wrap { position: relative; }
.nav-pop-wrap.is-open { z-index: 200; }
.nav-mini { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--radius-pill); border: 1px solid currentColor; background: none; color: inherit; cursor: pointer; opacity: .8; transition: color var(--dur-brand), border-color var(--dur-brand), opacity var(--dur-brand); }
.nav-mini:hover, .nav-pop-wrap.is-open .nav-mini { color: var(--bronze-light); border-color: var(--bronze-light); opacity: 1; }
.nav-pop { position: absolute; top: calc(100% + 12px); right: 0; min-width: 172px; background: var(--graphite); border: 1px solid rgba(244,240,231,.16); box-shadow: 0 22px 48px -18px rgba(0,0,0,.6); padding: 8px; display: none; flex-direction: column; gap: 2px; z-index: 60; }
.nav-pop-wrap.is-open .nav-pop { display: flex; }
.nav-pop a { display: flex; align-items: center; gap: 12px; padding: 12px; color: #F4F0E7; font: 500 13px/1 var(--font-sans); letter-spacing: .02em; }
.nav-pop a:hover { background: rgba(201,169,110,.14); color: var(--bronze-light); }
.nav-pop a svg { width: 17px; height: 17px; color: var(--bronze-light); flex: none; }
.nav-pop--lang { min-width: 0; padding: 12px 16px; align-items: center; }
.nav-pop--lang .lang-switch { font-size: 14px; gap: 10px; }
.nav-pop--lang .lang-switch a { color: #F4F0E7; }
.nav-under { display: none; }
.menu-overlay {
position: fixed; inset: 0; z-index: 100; background: var(--graphite); color: var(--limestone);
display: flex; flex-direction: column; transform: translateX(100%); visibility: hidden;
transition: transform var(--dur-brand) var(--ease-brand), visibility var(--dur-brand);
overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
}
.menu-overlay.open { transform: none; visibility: visible; }
.menu-overlay__top { display: flex; align-items: center; justify-content: space-between; padding: 28px var(--gutter) 0; }
.menu-overlay__top .brand__word { color: var(--limestone); }
.menu-overlay__close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; font: 300 26px/1 var(--font-sans); background: none; border: none; color: var(--limestone); cursor: pointer; }
.menu-overlay nav { display: flex; flex-direction: column; padding: 40px var(--gutter) 0; flex: 1; }
.menu-overlay nav a { display: flex; align-items: baseline; justify-content: space-between; font: 600 clamp(26px,7vw,32px)/1.1 var(--font-serif); color: var(--limestone); padding: 16px 0; border-bottom: 1px solid rgba(244,240,231,.14); }
.menu-overlay nav a:hover { color: var(--bronze-light); }
.menu-overlay nav a span { font: 400 14px/1 var(--font-sans); color: rgba(244,240,231,.4); }
.menu-overlay__foot { padding: 0 var(--gutter) 32px; }
.menu-phone { display: block; font: 600 20px/1 var(--font-serif); font-feature-settings: 'lnum' 1; margin-bottom: 6px; color: var(--limestone); }
.menu-hours { font: 400 12px/1.6 var(--font-sans); color: rgba(244,240,231,.5); }
/* solid header: бургер/мобильная группа на узких */
.site-header--solid .nav-mobile .nav-mini { color: var(--text-body); border-color: var(--hair-strong); }
.site-header--solid .nav-mobile .nav-mini:hover { color: var(--bronze); border-color: var(--bronze); }
.site-header--solid .hamburger { color: var(--text-body); }
@media (max-width: 1080px) {
.site-header--solid .nav-links { display: none; }
.site-header--solid .nav-tools .lang-switch,
.site-header--solid .nav-phone { display: none; }
.site-header--solid .nav-mobile { display: flex; }
.site-header--solid .hamburger { display: flex; }
}
/* общие элементы */
.eyebrow { display: inline-block; font: 500 12px/1.2 var(--font-sans); letter-spacing: var(--kicker-tracking); text-transform: uppercase; color: var(--text-accent); }
/* reznikov_img оборачивает ![]()
в — заставляем заполнять контейнеры */
.ph { background: var(--ph-bg); }
.media picture, .media img { display: block; width: 100%; height: 100%; }
.media img { object-fit: cover; }
.media { position: relative; overflow: hidden; background: var(--ph-bg); }
/* ================================================================== */
/* КЕЙС (single-portfolio) — блоки макета, ширина главной */
/* ================================================================== */
/* HERO — тёмный, своя glass-шапка (светлая схема через локальный скоуп) */
.case-hero {
position: relative; min-height: 100vh; display: flex; flex-direction: column; overflow: hidden; padding-top: calc(var(--masthead-h, 94px) + clamp(14px, 3vw, 28px));
color: #F4F0E7;
background: linear-gradient(180deg,#26292E 0%,#1A1C20 44%,#322D26 100%); /* фолбэк без фото */
--nav-text:#F4F0E7; --nav-text-soft:rgba(244,240,231,.85); --nav-round-border:rgba(244,240,231,.35);
--logo-invert:1; --nav-bg:rgba(244,240,231,.10); --nav-border:rgba(244,240,231,.28);
--nav-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 24px 60px -20px rgba(27,29,32,.45);
}
.case-hero--plain { min-height: 62vh; }
.case-hero__media { position: absolute; inset: 0; z-index: 0; }
.case-hero__scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(20,21,24,.68) 0%, rgba(20,21,24,.30) 32%, rgba(20,21,24,.50) 66%, rgba(20,21,24,.85) 100%); }
.case-hero__nav { position: relative; z-index: 10; padding-top: 28px; } /* выше hero-play (z:4), иначе play перехватывает тапы по поповерам */
.case-hero .glass-nav .brand__word { color: #F4F0E7; }
.case-hero__body { position: relative; z-index: 2; margin-top: auto; padding-bottom: clamp(56px, 7vw, 84px); }
.case-hero__kicker { font: 500 12px/1.2 var(--font-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--bronze-light); margin: 0 0 22px; }
.case-hero__title { font: var(--type-display); color: #F4F0E7; margin: 0 0 14px; max-width: 15ch; letter-spacing: -.01em; overflow-wrap: break-word; }
.case-hero__sub { font: 400 clamp(17px,2vw,22px)/1.4 var(--font-serif); color: rgba(244,240,231,.86); margin: 0 0 36px; }
.case-hero__meta { display: flex; flex-wrap: wrap; border-top: 1px solid rgba(244,240,231,.24); max-width: 900px; }
.case-hero__meta > div { flex: 0 1 auto; min-width: 150px; border-left: 1px solid rgba(244,240,231,.24); padding: 16px 28px 0 20px; }
.case-hero__meta dt { font: 500 10px/1 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: rgba(244,240,231,.5); margin: 0 0 8px; }
.case-hero__meta dd { font: 600 19px/1.2 var(--font-serif); color: #F4F0E7; margin: 0; font-feature-settings: 'lnum' 1; }
/* ИСТОРИЯ — крупный Playfair-лид, читаемая колонка по центру */
.case-story__inner { max-width: 940px; margin-inline: auto; }
.case-story__lede { font: 600 clamp(24px,3vw,34px)/1.4 var(--font-serif); margin: 24px 0 0; letter-spacing: -.005em; }
.case-story__note { font: var(--type-lead); color: var(--text-muted); margin: 28px 0 0; }
/* ЗАДАЧА — dim-фон, сетка заголовок | текст+список */
.case-task { background: var(--surface-dim); border-block: 1px solid var(--hair); }
.case-task__grid { display: grid; grid-template-columns: 4fr 7fr; column-gap: clamp(48px,7vw,120px); row-gap: 28px; }
.case-task__grid h2 { font: var(--type-h2); margin: 12px 0 0; max-width: 16ch; }
.case-task__lead { font: 400 clamp(16px,1.3vw,18px)/1.7 var(--font-sans); margin: 0 0 32px; max-width: 62ch; }
.case-list { border-top: 1px solid var(--hair); max-width: 62ch; }
.case-list__row { display: flex; gap: 18px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.case-list__row:last-child { border-bottom: none; }
.case-list__n { font: 600 14px/1 var(--font-serif); color: var(--text-accent); font-feature-settings: 'lnum' 1; flex: 0 0 24px; }
.case-list__t { font: 400 15px/1.6 var(--font-sans); color: var(--text-soft); }
/* РЕШЕНИЕ — асимметричная 12-колоночная сетка (как «Проекты» на главной) */
.case-solution h2 { font: var(--type-h2); margin: 0 0 56px; max-width: 20ch; }
.case-grid { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: 24px; row-gap: clamp(48px,6vw,88px); align-items: start; }
.case-figure { margin: 0; }
.case-figure figcaption { font: 400 14px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 16px; }
.case-solution p { font: 400 clamp(16px,1.3vw,18px)/1.7 var(--font-sans); margin: 0 0 20px; max-width: 42ch; }
.case-solution p:last-child { margin-bottom: 0; }
.col-4 { grid-column: span 4; } .col-5 { grid-column: span 5; } .col-6 { grid-column: span 6; }
.col-7 { grid-column: span 7; } .col-8 { grid-column: span 8; }
.gc-9 { grid-column: 9 / span 4; } .gc-5 { grid-column: 5 / span 8; } .gc-7 { grid-column: 7 / span 6; }
.self-center { align-self: center; }
/* Решение — сбалансированные чередующиеся ряды: фото 7 / текст 5, по центру (вместо разлёта 8/4) */
.case-rows { display: flex; flex-direction: column; gap: clamp(56px, 7vw, 104px); }
.case-row { display: grid; grid-template-columns: 7fr 5fr; column-gap: clamp(40px, 5vw, 80px); align-items: center; }
.case-row--reverse { grid-template-columns: 5fr 7fr; }
.case-row .case-figure { margin: 0; }
.case-solution__text p:last-child { margin-bottom: 0; }
/* две фигуры рядом (портретные детали — колонны/скульптуры) */
.case-duo { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 44px); align-items: start; }
.case-duo .case-figure { margin: 0; }
.case-duo figcaption { font: 400 14px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 16px; }
@media (max-width: 700px) { .case-duo { grid-template-columns: 1fr; row-gap: 28px; } }
.ar-16-10 { aspect-ratio: 16/10; } .ar-16-9 { aspect-ratio: 16/9; } .ar-4-5 { aspect-ratio: 4/5; } .ar-4-3 { aspect-ratio: 4/3; } .ar-3-4 { aspect-ratio: 3/4; } .ar-3-2 { aspect-ratio: 3/2; } .ar-2-3 { aspect-ratio: 2/3; }
/* ДЕТАЛИ — 2 колонки, подпись+материал */
.case-details h2 { font: var(--type-h2); margin: 0 0 56px; }
.case-details__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px 40px; }
.case-details figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-top: 16px; }
.case-details figcaption b { font: 600 21px/1.25 var(--font-serif); }
.case-details figcaption span { font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); white-space: nowrap; }
.case-details__text { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 8px 0 0; }
/* ПРОСТРАНСТВА УСАДЬБЫ — тёмная полоса-факты (вместо выдуманных «цифр») */
.case-spaces { background: var(--graphite); color: #F4F0E7; }
.case-spaces .eyebrow { color: var(--bronze-light); margin-bottom: 48px; }
.case-spaces__row { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid rgba(244,240,231,.18); }
.case-spaces__cell { border-left: 1px solid rgba(244,240,231,.18); padding: 28px 24px 10px 20px; display: flex; flex-direction: column; gap: 10px; }
.case-spaces__v { font: 600 22px/1.2 var(--font-serif); }
.case-spaces__l { font: 400 13px/1.55 var(--font-sans); color: rgba(244,240,231,.6); }
/* ГАЛЕРЕЯ — карусель (main.js [data-carousel]) */
.case-gallery__head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.case-gallery__head h2 { font: var(--type-h2); margin: 0; }
.int-carousel { position: relative; }
.int-carousel__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.int-carousel__track::-webkit-scrollbar { display: none; }
.int-slide { flex: 0 0 46%; scroll-snap-align: start; margin: 0; }
.int-slide .media { aspect-ratio: 3/2; }
.int-carousel__nav { display: flex; gap: 12px; margin-top: 28px; }
.int-carousel__btn { width: 52px; height: 52px; border-radius: var(--radius-pill); border: 1px solid var(--hair-strong); background: none; color: var(--text-body); font: 400 18px/1 var(--font-sans); cursor: pointer; transition: color var(--dur-brand), border-color var(--dur-brand); }
.int-carousel__btn:hover { border-color: var(--bronze); color: var(--bronze); }
.int-carousel__btn:disabled { opacity: .3; cursor: default; border-color: var(--hair); color: var(--text-muted); }
/* СОСЕДНИЕ ПРОЕКТЫ */
.case-neighbors { border-top: 1px solid var(--hair); }
.case-neighbors__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.case-neighbor { color: var(--text-body); }
.case-neighbor .media { aspect-ratio: 16/9; }
.case-neighbor:hover .media img { transform: scale(1.03); }
.case-neighbor .media img { transition: transform var(--dur-brand) var(--ease-brand); }
.case-neighbor__row { display: flex; align-items: baseline; gap: 14px; margin-top: 20px; }
.case-neighbor--next .case-neighbor__row { justify-content: flex-end; text-align: right; }
.case-neighbor__arr { font: 400 16px/1 var(--font-sans); color: var(--text-accent); }
.case-neighbor__lbl { font: 500 10px/1 var(--font-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.case-neighbor__name { font: 600 26px/1.2 var(--font-serif); }
.case-neighbor__sub { font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); font-feature-settings: 'lnum' 1; margin-top: 5px; }
/* CTA (кипарис) */
.case-cta { background: var(--cypress); color: #F4F0E7; }
.case-cta__grid { display: grid; grid-template-columns: 1fr 1fr; border-left: 1px solid rgba(244,240,231,.18); }
.case-cta__col { padding: 8px 64px 8px 32px; display: flex; flex-direction: column; gap: 16px; }
.case-cta__col + .case-cta__col { padding: 8px 32px 8px 64px; }
.case-cta__col:first-child { border-right: 1px solid rgba(244,240,231,.18); }
.case-cta .eyebrow { color: var(--bronze-light); }
.case-cta h2 { font: 600 clamp(28px,3.2vw,36px)/1.15 var(--font-serif); margin: 0; color: #F4F0E7; }
.case-cta p { font: 400 15px/1.6 var(--font-sans); color: rgba(244,240,231,.72); margin: 0; }
.case-cta .btn { align-self: flex-start; margin-top: 8px; }
.case-cta__msgs { display: flex; flex-wrap: wrap; gap: 10px; margin: 2px 0; }
.case-cta .kt-chip { border-color: rgba(244,240,231,.28); color: #F4F0E7; }
.case-cta .kt-chip:hover { border-color: var(--bronze-light); color: var(--bronze-light); }
.case-cta .kt-chip svg, .case-cta .kt-chip .ic-glyph { color: var(--bronze-light); }
/* ------------------------------------------------------------------ */
/* АДАПТИВ */
/* ------------------------------------------------------------------ */
@media (max-width: 1080px) {
.case-hero__nav .nav-links, .case-hero__nav .nav-contact { display: none; }
.case-hero__nav .nav-mobile { display: flex; }
.case-hero__nav .hamburger { display: flex; }
}
@media (max-width: 900px) {
.case-task__grid { grid-template-columns: 1fr; }
.case-grid > * { grid-column: 1 / -1 !important; }
.case-row, .case-row--reverse { grid-template-columns: 1fr; row-gap: 22px; }
.case-row--reverse .case-figure { order: -1; }
.case-details__grid { grid-template-columns: 1fr; }
.case-spaces__row { grid-template-columns: 1fr 1fr; }
.case-spaces__cell:nth-child(n+3) { border-top: 1px solid rgba(244,240,231,.18); }
.int-slide { flex-basis: 82%; }
.case-neighbors__grid { grid-template-columns: 1fr; gap: 40px; }
.case-cta__grid { grid-template-columns: 1fr; border-left: none; }
.case-cta__col, .case-cta__col + .case-cta__col { padding: 32px 0; border-right: none; }
.case-cta__col:first-child { border-right: none; border-bottom: 1px solid rgba(244,240,231,.18); }
}
@media (max-width: 560px) {
.case-hero__nav .nav-mobile .nav-pop-wrap { display: none; }
.case-hero__nav .nav-under { display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding: 12px 0 0; }
.case-spaces__row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 400px) {
.case-hero__title { font-size: 40px; }
}
/* ═══════════════════════════════════════════════════════════════════
Порт с главной (home.css не грузится на внутренних):
hero-видео кейса · видео-карточка RuTube · форма-заявка (стекло)
═══════════════════════════════════════════════════════════════════ */
/* кнопка play (стеклянная) */
.play {
position: relative; width: 84px; height: 84px; border-radius: var(--radius-pill);
background: rgba(15,16,19,.56); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
border: 2px solid rgba(244,240,231,.95); box-shadow: 0 18px 44px -10px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.3);
display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.play::before { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 2px solid rgba(244,240,231,.45); animation: rz-playpulse 2.6s var(--ease-brand) infinite; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .play::before { animation: none; } }
.play svg { width: 24px; height: 28px; }
/* ── Hero-видео кейса (десктоп: автозапуск поверх постера; мобайл: постер + play) ── */
.case-hero__video {
position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
opacity: 0; transition: opacity .9s var(--ease-brand); z-index: 0;
}
.case-hero__video.is-ready { opacity: 1; }
.case-hero__play {
display: none; position: absolute; left: 50%; top: 44%; transform: translate(-50%,-50%); z-index: 4;
width: 74px; height: 74px; background: rgba(18,19,22,.42); border-color: rgba(244,240,231,.7);
box-shadow: 0 12px 32px -8px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.25);
}
.case-hero__play:hover { background: rgba(18,19,22,.55); }
.case-hero.hero-video-on .case-hero__video { opacity: 1; }
.case-hero.hero-video-on .case-hero__play { display: none; }
@media (max-width: 768px) { .case-hero__video { display: none; } .case-hero__play { display: inline-flex; } }
@media (prefers-reduced-motion: reduce) { .case-hero__video { display: none; } }
/* ── Видео-карточка RuTube (постер + play → ленивый iframe) — те же классы, что на главной ── */
.project__video { position: relative; cursor: pointer; }
.project__video::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(18,19,22,.18); transition: background var(--dur-brand) var(--ease-brand); }
.project__video:hover::after { background: rgba(18,19,22,.30); }
.project__video .play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 3; width: 84px; height: 84px; }
.project__videolabel { position: absolute; left: 16px; bottom: 16px; z-index: 3; font: 500 10px/1 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--limestone); border: 1px solid rgba(244,240,231,.5); padding: 8px 12px; pointer-events: none; }
.project__iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 5; }
.project__video.is-playing .play, .project__video.is-playing .project__videolabel { display: none; }
.project__video.is-playing::after { display: none; }
/* ── Форма заявки (тёмная секция + liquid glass) — порт с главной ── */
.lead { display: grid; grid-template-columns: 5fr 6fr; column-gap: 120px; align-items: stretch; padding-block: 0; }
.lead__intro { align-self: center; }
.lead__intro h2 { font: var(--type-h2); margin: 0 0 24px; }
.lead__intro p { font: 400 16px/1.65 var(--font-sans); color: var(--text-muted); margin: 0; max-width: 42ch; }
.lead-section { position: relative; overflow: hidden; padding-block: var(--space-7); }
.lead-section__bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.05); }
.lead-section__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,19,22,.84) 0%, rgba(18,19,22,.72) 100%); }
.lead-section .lead { position: relative; z-index: 2; }
.lead-section .lead__intro h2 { color: #F4F0E7; }
.lead-section .lead__intro p { color: rgba(244,240,231,.8); }
.rez-form { display: flex; flex-direction: column; gap: 36px; }
.rez-form__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 32px; row-gap: 36px; }
.rez-field { display: flex; flex-direction: column; gap: 10px; }
.rez-field > span { font: 500 11px/1.2 var(--font-sans); letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-muted); }
.rez-field input, .rez-field textarea {
background: transparent; border: none; border-bottom: 1px solid var(--hair-strong); outline: none;
padding: 10px 0; font: 400 17px/1.4 var(--font-sans); color: var(--text-body); resize: vertical;
}
.rez-field input:focus, .rez-field textarea:focus { border-color: var(--bronze); }
.rez-form__submit { display: flex; align-items: center; gap: 28px; margin-top: 4px; flex-wrap: wrap; }
.rez-form__consent { font: 400 12px/1.5 var(--font-sans); color: var(--text-muted); max-width: 32ch; }
.rez-form__note { font: 500 13px/1.5 var(--font-sans); padding: 12px 16px; }
.rez-form__note--ok { background: rgba(44,66,55,.1); color: var(--cypress); }
.rez-form__note--err { background: rgba(165,127,73,.12); color: var(--bronze-deep); }
/* кастомный выпадающий список */
.rz-select { position: relative; }
.rz-select__native { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; opacity: 0; pointer-events: none; }
.rz-select__trigger {
width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px;
background: transparent; border: none; border-bottom: 1px solid var(--hair-strong); outline: none;
padding: 10px 2px 10px 0; font: 400 17px/1.4 var(--font-sans); color: var(--text-body);
text-align: left; cursor: pointer;
}
.rz-select__trigger::after {
content: ""; width: 16px; height: 16px; flex: none;
background: url("data:image/svg+xml;utf8,") no-repeat center / contain;
transition: transform var(--dur-brand) var(--ease-brand);
}
.rz-select.is-open .rz-select__trigger { border-bottom-color: var(--bronze-light); }
.rz-select.is-open .rz-select__trigger::after { transform: rotate(180deg); }
.rz-select__trigger:focus-visible { border-bottom-color: var(--bronze-light); }
.rz-select__value.is-placeholder { color: rgba(244,240,231,.5); }
.rz-select__list {
position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 30; margin: 0; padding: 6px; list-style: none;
background: rgba(24,26,28,.98); border: 1px solid rgba(244,240,231,.16);
box-shadow: 0 26px 64px -26px rgba(0,0,0,.75); max-height: 320px; overflow-y: auto;
-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.rz-select__opt {
padding: 12px 16px; font: 400 16px/1.3 var(--font-sans); color: rgba(244,240,231,.86); cursor: pointer;
transition: background var(--dur-brand) var(--ease-brand), color var(--dur-brand) var(--ease-brand);
}
.rz-select__opt:hover, .rz-select__opt:focus-visible { background: rgba(201,169,110,.18); color: var(--limestone); outline: none; }
.rz-select__opt.is-active { color: var(--bronze-light); }
.rz-select__opt.is-placeholder { color: rgba(244,240,231,.5); }
/* glass-вариант формы (на тёмной lead-секции) */
.rez-form--glass {
background: var(--glass-bg-strong); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
border: 1px solid var(--glass-border); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--shadow-glass);
padding: clamp(28px, 2.8vw, 46px); color: var(--limestone); border-radius: var(--radius-glass);
}
.rez-form--glass .rez-field > span { color: rgba(244,240,231,.7); }
.rez-form--glass .rez-field input, .rez-form--glass .rez-field select { color: #F4F0E7; border-bottom-color: rgba(244,240,231,.4); }
.rez-form--glass .rez-field input::placeholder { color: rgba(244,240,231,.5); }
.rez-form--glass .rez-field input:focus, .rez-form--glass .rez-field select:focus { border-bottom-color: var(--bronze-light); }
@media (max-width: 900px) {
.lead { grid-template-columns: 1fr; row-gap: 40px; }
.rez-form__grid { grid-template-columns: 1fr; }
}
/* ═══════════════════════════════════════════════════════════════════
Кейс-лонгрид: главы · reveal-движение · sticky-сцена · пул-цитаты · миры
═══════════════════════════════════════════════════════════════════ */
/* появление блоков при прокрутке (движение) */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 1s var(--ease-brand), transform 1s var(--ease-brand); will-change: opacity, transform; }
.reveal.is-in { opacity: 1; transform: none; }
.reveal--d1 { transition-delay: .09s; }
.reveal--d2 { transition-delay: .18s; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }
/* заголовок главы (для «сканеров» — номер + сюжетный H2 + подводка) */
.chapter { max-width: 52ch; }
.chapter__num { font: 500 12px/1 var(--font-sans); letter-spacing: .28em; text-transform: uppercase; color: var(--bronze); }
.chapter__title { font: var(--type-h2); margin: 18px 0 0; }
.chapter__lede { font: 400 clamp(17px, 1.5vw, 21px)/1.66 var(--font-sans); color: var(--text-muted); margin: 24px 0 0; }
/* пул-цитата — голос архитектора */
.pullquote { margin: 0; padding: 0; }
.pullquote p { font: 400 clamp(24px, 3vw, 40px)/1.32 var(--font-serif); letter-spacing: -.01em; color: var(--text-body); margin: 0; }
.pullquote cite { display: block; margin-top: 22px; font: 500 12px/1 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--bronze); font-style: normal; }
/* sticky-сцена «прибытие»: цитата закреплена, кадры проходят мимо */
.story-sticky { display: grid; grid-template-columns: 5fr 7fr; column-gap: clamp(40px, 5vw, 88px); align-items: start; }
.story-sticky__aside { position: sticky; top: 104px; align-self: start; }
.story-sticky__flow { display: flex; flex-direction: column; gap: clamp(28px, 3vw, 48px); }
.story-beat { margin: 0; }
.story-beat__step { display: block; font: 500 12px/1 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--bronze); margin-bottom: 14px; }
.story-beat figcaption { font: 400 clamp(15px, 1.2vw, 17px)/1.6 var(--font-sans); color: var(--text-muted); margin-top: 16px; max-width: 52ch; }
@media (max-width: 900px) {
.story-sticky { grid-template-columns: 1fr; row-gap: 40px; }
.story-sticky__aside { position: static; }
}
/* мягкий зум фото при наведении (интерактивность) */
.case-figure .media img, .story-beat .media img, .world-slide .media img { transition: transform 1.2s var(--ease-brand); }
.case-figure:hover .media img, .story-beat:hover .media img, .world-slide:hover .media img { transform: scale(1.04); }
/* «Миры» — слайд карусели (переиспользуем int-carousel/data-carousel) */
.world-slide { flex: 0 0 clamp(280px, 34vw, 460px); }
.world-slide .media { aspect-ratio: 4 / 5; }
.world-slide__title { font: 500 20px/1.3 var(--font-serif); margin: 16px 0 6px; }
.world-slide__text { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 0; max-width: 42ch; }
/* состав усадьбы — компактный индекс для «сканеров» */
.estate-index { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--hair); border: 1px solid var(--hair); }
.estate-index__cell { background: var(--surface-card); padding: clamp(20px, 2vw, 30px); }
.estate-index__v { display: block; font: 500 17px/1.3 var(--font-serif); }
.estate-index__l { display: block; font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 6px; }
@media (max-width: 760px) { .estate-index { grid-template-columns: repeat(2, 1fr); } }
.project__video video.project__iframe{object-fit:cover;background:#000}
/* =========================================================================
ХАБ «ПОРТФОЛИО» (archive-portfolio) — 2026-07-08
========================================================================= */
.pf-intro { padding-bottom: 0; }
.pf-intro__title { font: 400 clamp(38px, 5vw, 64px)/1.06 var(--font-serif); color: var(--text-body); letter-spacing: -0.01em; margin: 16px 0 0; max-width: 20ch; overflow-wrap: break-word; }
.pf-intro__lead { font: 400 clamp(16px, 1.3vw, 20px)/1.65 var(--font-sans); color: var(--text-soft); max-width: 62ch; margin: 22px 0 0; }
.pf-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 56px 40px; }
.pf-card { display: block; }
.pf-card__media { position: relative; aspect-ratio: 3/2; overflow: hidden; background: var(--ph-bg); }
.pf-card__media picture { display: block; width: 100%; height: 100%; }
.pf-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-brand); }
.pf-card:hover .pf-card__media img { transform: scale(1.04); }
.pf-card__ph { position: absolute; inset: 0; background: linear-gradient(135deg, var(--graphite), var(--cypress)); opacity: .5; }
.pf-card__body { padding-top: 20px; }
.pf-card__kicker { display: block; font: 500 11px/1.2 var(--font-sans); letter-spacing: 0.2em; text-transform: uppercase; color: var(--bronze); margin-bottom: 10px; }
.pf-card__title { font: 400 clamp(24px, 2vw, 30px)/1.15 var(--font-serif); color: var(--text-body); margin: 0; }
.pf-card__meta { display: block; font: 400 14px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 8px; }
.pf-card__more { display: inline-block; margin-top: 16px; font: 500 12px/1 var(--font-sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-soft); border-bottom: 1px solid var(--hair-strong); padding-bottom: 6px; transition: color var(--dur-brand) var(--ease-brand), border-color var(--dur-brand) var(--ease-brand); }
.pf-card:hover .pf-card__more { color: var(--bronze); border-color: var(--bronze); }
.pf-empty { font: 400 18px/1.5 var(--font-sans); color: var(--text-muted); }
/* CTA-полоса «закрытое портфолио» (кипарис, по DS) */
.pf-cta { background: var(--cypress); color: var(--limestone); }
.pf-cta__inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center; padding-block: 72px; }
.pf-cta .kicker--light { color: var(--bronze-light); }
.pf-cta__title { font: 400 clamp(26px, 2.6vw, 40px)/1.15 var(--font-serif); color: var(--limestone); margin: 14px 0 0; max-width: 20ch; }
.pf-cta__lead { font: 400 16px/1.6 var(--font-sans); color: rgba(244,240,231,.82); max-width: 46ch; margin: 16px 0 0; }
.pf-cta__actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-end; }
.pf-cta__ghost { border-color: rgba(244,240,231,.4); color: var(--limestone); }
.pf-cta__ghost:hover { border-color: var(--limestone); color: var(--limestone); }
@media (max-width: 900px) {
.pf-grid { grid-template-columns: 1fr; gap: 44px; }
.pf-cta__inner { grid-template-columns: 1fr; gap: 28px; padding-block: 56px; }
.pf-cta__actions { justify-content: flex-start; }
}
/* =========================================================================
ЖУРНАЛ (home/category) — макет «Блог.dc.html», ширина главной. 2026-07-08
========================================================================= */
.jr-intro { padding-bottom: 0; }
.jr-intro__grid { display: grid; grid-template-columns: 1fr minmax(280px, 46ch); gap: 40px; align-items: end; }
.jr-intro__title { font: 600 clamp(46px, 6vw, 96px)/0.98 var(--font-serif); letter-spacing: -.01em; margin: 16px 0 0; overflow-wrap: break-word; }
.jr-intro__lead { font: 400 clamp(15px, 1.1vw, 17px)/1.65 var(--font-sans); color: var(--text-muted); margin: 0 0 12px; }
.jr-intro__back { color: inherit; }
.jr-intro__back:hover { color: var(--bronze); }
.jr-filters { border-block: 1px solid var(--hair); margin-top: clamp(32px, 4vw, 56px); }
.jr-filters__row { display: flex; align-items: center; }
.jr-filters__list { display: flex; gap: clamp(18px, 2vw, 30px); overflow-x: auto; scrollbar-width: none; white-space: nowrap; padding: 14px 0; }
.jr-filters__list::-webkit-scrollbar { display: none; }
.jr-filter { display: inline-flex; align-items: baseline; gap: 8px; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-body); padding: 8px 0; border-bottom: 1px solid transparent; transition: color var(--dur-brand), border-color var(--dur-brand); }
.jr-filter em { font: 400 11px/1 var(--font-sans); font-style: normal; letter-spacing: 0; color: var(--text-muted); font-feature-settings: 'lnum' 1; }
.jr-filter:hover { color: var(--bronze); }
.jr-filter.is-active { color: var(--text-accent); border-color: var(--text-accent); }
.jr-feat { padding-bottom: 0; }
.jr-feat__link { display: grid; grid-template-columns: 7fr 5fr; column-gap: clamp(32px, 4vw, 64px); align-items: center; color: var(--text-body); }
.jr-feat__link .media { aspect-ratio: 16/10; }
.jr-feat__link .media img { transition: transform .7s var(--ease-brand); }
.jr-feat__link:hover .media img { transform: scale(1.03); }
.jr-feat__title { font: 600 clamp(26px, 2.6vw, 42px)/1.15 var(--font-serif); margin: 0 0 20px; }
.jr-feat__excerpt { font: 400 clamp(15px, 1.1vw, 17px)/1.65 var(--font-sans); color: var(--text-muted); margin: 0 0 24px; max-width: 52ch; }
.jr-feat__body .jr-card__more { margin-top: 26px; }
.jr-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); font-feature-settings: 'lnum' 1; }
.jr-meta b { color: var(--text-body); font-weight: 500; }
.jr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(48px, 5vw, 80px) 24px; }
.jr-card__link { display: block; color: var(--text-body); }
.jr-card .media { aspect-ratio: 4/3; }
.jr-card .media img { transition: transform .7s var(--ease-brand); }
.jr-card__link:hover .media img { transform: scale(1.04); }
.jr-card__cat { display: block; font: 500 10px/1 var(--font-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--text-accent); margin: 20px 0 12px; }
.jr-feat__body .jr-card__cat { margin-top: 0; }
.jr-card__title { font: 600 clamp(19px, 1.5vw, 23px)/1.3 var(--font-serif); margin: 0 0 12px; }
.jr-card__excerpt { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 0 0 16px; }
.jr-card__more { display: inline-block; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-accent); border-bottom: 1px solid transparent; padding-bottom: 6px; transition: border-color var(--dur-brand); }
.jr-feat__link:hover .jr-card__more, .jr-card__link:hover .jr-card__more { border-color: var(--text-accent); }
.jr-pager { border-top: 1px solid var(--hair); margin-top: clamp(48px, 6vw, 80px); padding-top: 24px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 20px; font-feature-settings: 'lnum' 1; }
.jr-pager .page-numbers { font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); padding-bottom: 6px; border-bottom: 1px solid transparent; }
.jr-pager a.page-numbers:hover { color: var(--bronze); }
.jr-pager .page-numbers.current { color: var(--text-accent); border-color: var(--text-accent); }
.jr-pager .page-numbers.next { margin-left: auto; color: var(--text-body); }
.jr-pager .page-numbers.next:hover { color: var(--bronze); }
/* CTA Telegram-канала (кипарис, по DS — как pf-cta) */
.jr-cta { background: var(--cypress); color: var(--limestone); }
.jr-cta__inner { display: grid; grid-template-columns: 1.4fr auto; gap: 40px; align-items: center; padding-block: 72px; }
.jr-cta .kicker--light { color: var(--bronze-light); }
.jr-cta__title { font: 600 clamp(26px, 2.6vw, 44px)/1.12 var(--font-serif); color: var(--limestone); margin: 14px 0 0; max-width: 22ch; }
.jr-cta__lead { font: 400 16px/1.6 var(--font-sans); color: rgba(244,240,231,.82); max-width: 46ch; margin: 16px 0 0; }
.jr-cta__actions { display: flex; justify-content: flex-end; }
@media (max-width: 1240px) { .jr-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) {
.jr-intro__grid { grid-template-columns: 1fr; gap: 18px; align-items: start; }
.jr-feat__link { grid-template-columns: 1fr; row-gap: 24px; }
.jr-cta__inner { grid-template-columns: 1fr; gap: 28px; padding-block: 56px; }
.jr-cta__actions { justify-content: flex-start; }
}
@media (max-width: 700px) { .jr-grid { grid-template-columns: 1fr; gap: 44px; } }
/* =========================================================================
СТАТЬЯ ЖУРНАЛА (single post) — макет «Статья блога.dc.html». 2026-07-08
========================================================================= */
.art-head { padding-bottom: clamp(40px, 5vw, 64px); }
.art-head__inner { max-width: 980px; margin-inline: auto; }
.art-crumbs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; font: 500 11px/1.4 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; margin-bottom: clamp(20px, 2.4vw, 28px); }
.art-crumbs a { color: var(--text-muted); }
.art-crumbs a:hover { color: var(--bronze); }
.art-crumbs span { color: var(--text-muted); }
.art-crumbs .art-crumbs__cat { color: var(--text-accent); }
.art-title { font: 600 clamp(30px, 3.4vw, 58px)/1.1 var(--font-serif); letter-spacing: -.01em; margin: 0 0 26px; overflow-wrap: break-word; }
.art-head .jr-meta { font-size: 14px; }
.art-hero .media { aspect-ratio: 21/9; max-height: 76vh; }
@media (max-width: 760px) { .art-hero .media { aspect-ratio: 4/3; } }
.art-layout { display: grid; grid-template-columns: 280px minmax(0, 860px); column-gap: clamp(56px, 7vw, 130px); justify-content: center; align-items: start; }
.art-aside { position: sticky; top: 112px; display: flex; flex-direction: column; gap: 28px; }
.art-aside__label { font: 500 10px/1 var(--font-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 14px; }
.art-toc { border-top: 1px solid var(--hair); padding-top: 20px; }
.art-toc__list { display: flex; flex-direction: column; gap: 13px; }
.art-toc__list a { display: flex; gap: 12px; align-items: baseline; font: 400 14px/1.45 var(--font-sans); color: var(--text-soft); }
.art-toc__list a:hover { color: var(--bronze); }
.art-toc__list a span { font: 600 12px/1.4 var(--font-serif); color: var(--text-accent); font-feature-settings: 'lnum' 1; flex: 0 0 22px; }
.art-share { border-top: 1px solid var(--hair); padding-top: 20px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.art-share a, .art-share button { font: 400 14px/1.4 var(--font-sans); color: var(--text-body); background: none; border: none; padding: 0; cursor: pointer; text-align: left; transition: color var(--dur-brand); }
.art-share a:hover, .art-share button:hover { color: var(--bronze); }
.art-body { font: 400 17px/1.75 var(--font-sans); color: var(--text-body); }
.art-body > p:first-child { font: 600 clamp(19px, 1.7vw, 24px)/1.5 var(--font-serif); margin-bottom: clamp(28px, 3vw, 40px); }
.art-body p { margin: 0 0 24px; }
.art-body p:empty { display: none; }
.art-body h2 { font: 600 clamp(23px, 2vw, 30px)/1.25 var(--font-serif); margin: clamp(36px, 4vw, 52px) 0 18px; scroll-margin-top: 120px; overflow-wrap: break-word; }
.art-body h3 { font: 600 clamp(19px, 1.6vw, 23px)/1.3 var(--font-serif); margin: 32px 0 14px; }
.art-body h4 { font: 600 17px/1.4 var(--font-sans); margin: 28px 0 12px; }
.art-body blockquote { border-block: 1px solid var(--hair); margin: clamp(28px, 3.4vw, 44px) 0; padding: clamp(24px, 3vw, 36px) 0; }
.art-body blockquote p { font: 600 clamp(20px, 2vw, 28px)/1.4 var(--font-serif); margin: 0; }
.art-body blockquote p + p { margin-top: 14px; }
.art-body ul, .art-body ol { margin: 0 0 24px; padding-left: 22px; }
.art-body li { margin-bottom: 10px; }
.art-body li::marker { color: var(--text-accent); }
.art-body a { color: var(--text-accent); border-bottom: 1px solid var(--hair-strong); }
.art-body a:hover { border-color: var(--text-accent); }
.art-body img { max-width: 100%; height: auto; }
.art-body figure { margin: clamp(28px, 3.4vw, 44px) 0; }
.art-body figcaption { font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 12px; }
.art-author { display: flex; gap: 28px; align-items: center; border: 1px solid var(--hair); background: var(--surface-card); padding: clamp(20px, 2.4vw, 28px); margin-top: clamp(40px, 5vw, 64px); }
.art-author__photo { position: relative; flex: 0 0 96px; width: 96px; height: 96px; overflow: hidden; background: var(--ph-bg); }
.art-author__photo picture, .art-author__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.art-author__photo--mono { display: flex; align-items: center; justify-content: center; background: var(--surface-dim); }
.art-author__photo--mono span { font: 600 34px/1 var(--font-serif); color: var(--text-accent); }
.art-author .art-aside__label { margin-bottom: 10px; color: var(--text-accent); }
.art-author__name { font: 600 clamp(19px, 1.6vw, 23px)/1.2 var(--font-serif); margin: 0; }
.art-author__bio { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 6px 0 0; max-width: 52ch; }
.art-related { border-top: 1px solid var(--hair); }
.art-related .kicker { display: block; margin-bottom: clamp(28px, 3.4vw, 44px); }
@media (max-width: 1080px) {
.art-layout { grid-template-columns: 1fr; row-gap: 36px; }
.art-aside { position: static; border: 1px solid var(--hair); background: var(--surface-card); padding: 20px 18px; }
.art-share { display: none; }
}
/* =========================================================================
РАЗДЕЛ «О СТУДИИ» (o-studii / ob-arhitektore / komanda). 2026-07-08
Макеты: Команда.dc.html + Об архитекторе.dc.html; общие блоки .ab-*
========================================================================= */
.ab-intro { padding-bottom: clamp(40px, 5vw, 64px); }
.ab-intro__title { font: 600 clamp(36px, 4.4vw, 72px)/1.04 var(--font-serif); letter-spacing: -.01em; margin: 16px 0 0; max-width: 24ch; overflow-wrap: break-word; }
.ab-intro__lead { font: 400 clamp(16px, 1.3vw, 20px)/1.65 var(--font-sans); color: var(--text-soft); max-width: 62ch; margin: 22px 0 0; }
.ab-h2 { font: var(--type-h2); margin: 14px 0 0; max-width: 24ch; }
.ab-lede { font: 400 clamp(16px, 1.3vw, 18px)/1.7 var(--font-sans); color: var(--text-muted); max-width: 66ch; margin: 22px 0 0; }
.ab-btn { margin-top: 28px; }
.case-solution__text .ab-h2 { margin-bottom: 22px; }
.case-solution__text .kicker + .ab-h2 { margin-top: 12px; }
/* полоса «Кураторы» — dim-фон, текст + 3 квадратных тайла */
.ab-band { background: var(--surface-dim); border-block: 1px solid var(--hair); padding-block: var(--space-7); }
.ab-band__grid { display: grid; grid-template-columns: 5fr 6fr; column-gap: clamp(48px, 6vw, 100px); align-items: center; }
.ab-band__text { font: 400 clamp(15px, 1.2vw, 18px)/1.7 var(--font-sans); color: var(--text-soft); margin: 22px 0 0; max-width: 52ch; }
.ab-band__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 1.6vw, 24px); }
.ar-1-1 { aspect-ratio: 1/1; }
/* цитата с фото автора */
.ab-quoterow__grid { display: grid; grid-template-columns: 220px 1fr; column-gap: clamp(40px, 5vw, 88px); align-items: center; }
.ab-quoterow__photo { width: 220px; aspect-ratio: 1/1; border-radius: 0; }
/* специализация: широкий кадр + заголовок|текст */
.ab-spec__grid { display: grid; grid-template-columns: 5fr 7fr; column-gap: clamp(48px, 6vw, 110px); margin-top: clamp(32px, 4vw, 56px); }
.ab-spec__grid p { font: 400 clamp(15px, 1.2vw, 18px)/1.7 var(--font-sans); color: var(--text-soft); margin: 0 0 18px; max-width: 60ch; }
.ab-why .case-list__t b { display: block; font-weight: 600; color: var(--text-body); margin-bottom: 4px; }
.ab-why__note { font: 400 clamp(15px, 1.2vw, 17px)/1.7 var(--font-sans); color: var(--text-muted); margin: 28px 0 0; max-width: 62ch; }
/* тизер кейса Lion Palace */
.ab-case__link { display: block; color: var(--text-body); }
.ab-case__link .media img { transition: transform .8s var(--ease-brand); }
.ab-case__link:hover .media img { transform: scale(1.03); }
.ab-case__body { display: grid; grid-template-columns: auto 1fr auto; gap: 8px clamp(28px, 4vw, 64px); align-items: baseline; padding-top: 24px; }
.ab-case__title { font: 600 clamp(21px, 2vw, 30px)/1.2 var(--font-serif); margin: 0; grid-row: 2; }
.ab-case__lead { font: 400 15px/1.6 var(--font-sans); color: var(--text-muted); margin: 0; grid-row: 2; }
.ab-case__body .kicker { grid-column: 1 / -1; }
.ab-case__body .jr-card__more { grid-row: 2; white-space: nowrap; }
/* HERO об архитекторе */
.arch-hero { padding-bottom: var(--space-7); }
.arch-hero__grid { display: grid; grid-template-columns: 7fr 5fr; column-gap: clamp(48px, 6vw, 100px); align-items: center; }
.arch-hero__title { font: 600 clamp(40px, 5vw, 84px)/1.0 var(--font-serif); letter-spacing: -.01em; margin: 20px 0 20px; }
.arch-hero__sub { font: 600 clamp(19px, 1.8vw, 25px)/1.4 var(--font-serif); margin: 0 0 22px; max-width: 26ch; }
.arch-hero__sub em { font-style: normal; color: var(--text-accent); }
.arch-hero__lead { font: 400 clamp(15px, 1.2vw, 17px)/1.7 var(--font-sans); color: var(--text-muted); max-width: 52ch; margin: 0; }
/* таймлайн «Путь в архитектуре» */
.tl-band { background: var(--surface-dim); border-block: 1px solid var(--hair); padding-block: var(--space-7); }
.tl-band__title { margin-bottom: clamp(32px, 4.4vw, 56px); }
.tl-item { display: grid; grid-template-columns: 220px 1fr; column-gap: clamp(40px, 5vw, 80px); border-top: 1px solid var(--hair); padding: clamp(22px, 3vw, 34px) 0; }
.tl-item__year { display: block; font: 600 clamp(26px, 2.6vw, 40px)/1 var(--font-serif); color: var(--text-accent); font-feature-settings: 'lnum' 1; }
.tl-item__place { display: block; font: 500 11px/1.4 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--text-muted); margin-top: 10px; }
.tl-item__title { font: 600 clamp(19px, 1.8vw, 24px)/1.25 var(--font-serif); margin: 0 0 10px; }
.tl-item__text { font: 400 15px/1.65 var(--font-sans); color: var(--text-soft); margin: 0; max-width: 64ch; }
/* принципы «Мой подход» — сетка 2×2 */
.pr-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--hair); border-left: 1px solid var(--hair); margin-top: clamp(36px, 4.4vw, 64px); }
.pr-cell { border-right: 1px solid var(--hair); border-bottom: 1px solid var(--hair); padding: clamp(28px, 3vw, 44px) clamp(24px, 3vw, 44px) clamp(30px, 3vw, 44px) clamp(20px, 2.4vw, 32px); display: flex; flex-direction: column; gap: 14px; }
.pr-cell__num { font: 600 clamp(30px, 3vw, 44px)/1 var(--font-serif); color: var(--text-accent); font-feature-settings: 'lnum' 1; }
.pr-cell__title { font: 600 clamp(19px, 1.8vw, 24px)/1.25 var(--font-serif); margin: 0; }
.pr-cell__text { font: 400 15px/1.65 var(--font-sans); color: var(--text-muted); margin: 0; }
/* цитата 30/70 (кипарис) */
.ab-quote { background: var(--cypress); color: var(--limestone); padding-block: clamp(64px, 7vw, 104px); }
.ab-quote__grid { display: grid; grid-template-columns: 7fr 5fr; column-gap: clamp(56px, 7vw, 120px); align-items: center; }
.ab-quote__q { font: 600 clamp(24px, 2.8vw, 40px)/1.3 var(--font-serif); margin: 0; }
.ab-quote__facts { border-top: 1px solid rgba(244,240,231,.18); font-feature-settings: 'lnum' 1; }
.ab-quote__facts > div { display: flex; justify-content: space-between; gap: 24px; padding: 18px 0; border-bottom: 1px solid rgba(244,240,231,.18); }
.ab-quote__facts span { font: 400 15px/1.4 var(--font-sans); color: rgba(244,240,231,.75); }
.ab-quote__facts b { font: 600 15px/1.4 var(--font-serif); color: var(--bronze-light); white-space: nowrap; }
/* КОМАНДА */
.tm-founder { padding-top: 0; }
.tm-founder__grid { display: grid; grid-template-columns: 5fr 7fr; column-gap: clamp(48px, 6vw, 96px); align-items: center; }
.tm-founder__name { font: 600 clamp(30px, 3.4vw, 52px)/1.08 var(--font-serif); margin: 16px 0 20px; }
.tm-founder__bio { font: 400 clamp(15px, 1.2vw, 17px)/1.7 var(--font-sans); color: var(--text-soft); margin: 0 0 36px; max-width: 56ch; }
.tm-facts { display: flex; border-top: 1px solid var(--hair); }
.tm-facts > div { flex: 1; border-left: 1px solid var(--hair); padding: 20px 24px 0 20px; display: flex; flex-direction: column; gap: 8px; }
.tm-facts b { font: 600 clamp(17px, 1.6vw, 24px)/1.1 var(--font-serif); font-feature-settings: 'lnum' 1; font-weight: 600; }
.tm-facts span { font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); }
.tm-band { background: var(--surface-dim); border-block: 1px solid var(--hair); padding-block: var(--space-7); }
.tm-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(44px, 5vw, 72px) 24px; }
.tm-card__role { font: 500 10px/1.4 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--text-accent); margin: 20px 0 8px; }
.tm-card__name { font: 600 clamp(20px, 1.7vw, 24px)/1.2 var(--font-serif); margin: 0; }
.tm-card__line { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 8px 0 0; max-width: 40ch; }
.tm-principle__inner { max-width: 980px; margin-inline: auto; text-align: center; }
.tm-principle__text { font: 600 clamp(21px, 2.2vw, 30px)/1.45 var(--font-serif); margin: 24px 0 0; }
/* карточка сотрудника — ссылка на персональную страницу */
.tm-card__link { display: block; color: var(--text-body); }
.tm-card__link .media img { transition: transform .7s var(--ease-brand); }
.tm-card__link:hover .media img { transform: scale(1.04); }
.tm-card__more { margin-top: 12px; }
.tm-card__link:hover .tm-card__more { border-color: var(--text-accent); }
.tm-founder__more { display: inline-block; margin-top: 28px; }
/* ПЕРСОНАЛЬНАЯ СТРАНИЦА СОТРУДНИКА (/komanda/{slug}/) */
.tmm-hero { padding-bottom: var(--space-7); }
.tmm-hero .art-crumbs { margin-bottom: clamp(28px, 3.4vw, 44px); }
.tmm-line { font: 600 clamp(17px, 1.5vw, 21px)/1.45 var(--font-serif); margin: 16px 0 20px; max-width: 46ch; }
.tmm-facts { padding-block: clamp(56px, 6vw, 88px); }
.tmm-facts__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(48px, 6vw, 110px); row-gap: 32px; align-items: start; }
.tmm-edu { font: 400 clamp(15px, 1.2vw, 17px)/1.7 var(--font-sans); color: var(--text-soft); margin: 0; }
.tmm-practice { list-style: none; margin: 0; padding: 0; }
.tmm-practice li { font: 400 clamp(15px, 1.2vw, 17px)/1.6 var(--font-sans); color: var(--text-soft); padding: 10px 0; border-bottom: 1px solid var(--hair); }
.tmm-practice li:first-child { border-top: 1px solid var(--hair); }
.tmm-neighbor__media img { object-position: center 18%; }
@media (max-width: 900px) {
.tmm-facts__grid { grid-template-columns: 1fr; }
}
@media (max-width: 1080px) {
.ab-band__grid, .ab-quote__grid { grid-template-columns: 1fr; row-gap: 36px; }
.arch-hero__grid { grid-template-columns: 1fr; row-gap: 32px; }
.arch-hero__photo { order: -1; max-width: 560px; }
}
@media (max-width: 900px) {
.tm-founder__grid, .ab-spec__grid { grid-template-columns: 1fr; row-gap: 28px; }
.tm-grid { grid-template-columns: repeat(2, 1fr); gap: 40px 16px; }
.tl-item { grid-template-columns: 1fr; row-gap: 12px; }
.pr-grid { grid-template-columns: 1fr; }
.ab-quoterow__grid { grid-template-columns: 1fr; row-gap: 28px; }
.ab-case__body { grid-template-columns: 1fr; }
.ab-case__body .kicker, .ab-case__title, .ab-case__lead, .ab-case__body .jr-card__more { grid-column: 1; grid-row: auto; }
.tm-facts { flex-direction: column; border-top: none; }
.tm-facts > div { border-left: none; border-top: 1px solid var(--hair); flex-direction: row; align-items: baseline; gap: 16px; padding: 14px 0; }
}
@media (max-width: 560px) {
.tm-grid { grid-template-columns: 1fr 1fr; gap: 32px 12px; }
.tm-card__name { font-size: 17px; }
.tm-card__line { font-size: 12px; }
}
/* =========================================================================
2026-07-08 (2): адаптив единой стеклянной внутренней шапки (как на главной)
========================================================================= */
@media (max-width: 1480px) {
.site-header--glass .glass-nav { gap: 14px; }
.site-header--glass .glass-nav .nav-links { gap: 16px; }
.site-header--glass .nav-phone { display: none; }
.site-header--glass .nav-ico--phone { display: inline-flex; }
}
@media (max-width: 1240px) {
.site-header--glass .nav-links, .site-header--glass .nav-contact { display: none; }
.site-header--glass .nav-mobile { display: flex; }
.site-header--glass .hamburger { display: flex; }
}
/* ============================================================
Страница «Контакты» (page-kontakty.php)
============================================================ */
.kt-intro { padding-bottom: clamp(28px, 3.5vw, 44px); }
.kt-tiles-section { padding-top: 0; }
/* Контактные плитки */
.kt-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.4vw, 22px); }
.kt-tile { display: flex; flex-direction: column; gap: 8px; padding: clamp(22px, 2vw, 30px); background: var(--surface-card); border: 1px solid var(--hair); color: var(--text-body); transition: border-color .3s var(--ease-brand), transform .3s var(--ease-brand); }
a.kt-tile:hover { border-color: var(--bronze); transform: translateY(-3px); }
.kt-tile__ic { display: flex; width: 42px; height: 42px; align-items: center; justify-content: center; color: var(--bronze); }
.kt-tile__ic svg { width: 26px; height: 26px; }
.kt-tile__label { font: 500 12px/1 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--text-muted); margin-top: 6px; }
.kt-tile__val { font: 500 clamp(17px, 1.5vw, 21px)/1.3 var(--font-serif); color: var(--text-body); }
.kt-tile__more { margin-top: auto; padding-top: 12px; font: 500 13px/1 var(--font-sans); color: var(--bronze); }
.kt-tile__msgs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.kt-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 10px; border: 1px solid var(--hair); font: 500 13px/1 var(--font-sans); color: var(--text-body); transition: border-color .3s var(--ease-brand), color .3s var(--ease-brand); }
.kt-chip:hover { border-color: var(--bronze); color: var(--bronze); }
.kt-chip svg, .kt-chip .ic-glyph { width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; }
.kt-chip .ic-glyph { font: 700 11px/1 var(--font-sans); color: var(--bronze); }
/* Карта + как добраться */
.kt-map { display: grid; grid-template-columns: 5fr 7fr; column-gap: clamp(40px, 5vw, 88px); align-items: center; }
.kt-map__addr { font: 500 clamp(17px, 1.5vw, 20px)/1.4 var(--font-serif); color: var(--text-body); margin: 18px 0 0; }
.kt-facts { list-style: none; margin: 24px 0 0; padding: 0; border-top: 1px solid var(--hair); }
.kt-facts li { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--hair); font: 400 15px/1.6 var(--font-sans); color: var(--text-soft); }
.kt-facts__ic { flex: 0 0 22px; color: var(--bronze); }
.kt-facts__ic svg { width: 20px; height: 20px; }
.kt-map__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.kt-map__frame { position: relative; aspect-ratio: 16/11; background: var(--graphite); overflow: hidden; }
.kt-map__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.kt-map__poster { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; padding: 24px;
background:
radial-gradient(120% 90% at 30% 20%, rgba(165,127,73,.16), transparent 60%),
repeating-linear-gradient(0deg, rgba(244,240,231,.05) 0 1px, transparent 1px 46px),
repeating-linear-gradient(90deg, rgba(244,240,231,.05) 0 1px, transparent 1px 46px),
var(--graphite); }
.kt-map__pin { color: var(--bronze-light); }
.kt-map__pin svg { width: 40px; height: 40px; }
.kt-map__posteraddr { font: 500 16px/1.4 var(--font-serif); color: var(--limestone); margin: 0; }
.kt-map__show { pointer-events: none; }
/* Прямая связь */
.kt-connect__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(48px, 6vw, 100px); row-gap: 40px; }
.kt-msgbtns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.kt-msgbtn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; background: var(--surface-card); border: 1px solid var(--hair); font: 500 15px/1 var(--font-sans); color: var(--text-body); transition: border-color .3s var(--ease-brand), transform .3s var(--ease-brand), color .3s var(--ease-brand); }
.kt-msgbtn:hover { border-color: var(--bronze); color: var(--bronze); transform: translateY(-2px); }
.kt-msgbtn svg { width: 20px; height: 20px; color: var(--bronze); }
.kt-msgbtn .ic-glyph { width: 20px; text-align: center; font: 700 13px/1 var(--font-sans); color: var(--bronze); }
.kt-social { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.kt-social__link { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--hair); font: 500 14px/1 var(--font-sans); color: var(--text-soft); transition: border-color .3s var(--ease-brand), color .3s var(--ease-brand); }
.kt-social__link:hover { border-color: var(--bronze); color: var(--bronze); }
.kt-social__link svg { width: 18px; height: 18px; }
.kt-social__link .ic-glyph { width: 18px; text-align: center; font: 700 12px/1 var(--font-sans); }
/* География */
.kt-geo__head { max-width: 72ch; }
.kt-geo__cols { display: grid; grid-template-columns: 2fr 1fr; column-gap: clamp(40px, 5vw, 90px); margin-top: clamp(32px, 4vw, 52px); }
.kt-geo__cap { font: 500 12px/1 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--bronze); margin: 0 0 6px; }
.kt-geo__list { list-style: none; margin: 0; padding: 0; }
.kt-geo__list li { padding: 14px 0; border-bottom: 1px solid var(--hair); font: 400 clamp(16px, 1.4vw, 19px)/1.4 var(--font-serif); color: var(--text-body); }
/* Адаптив */
@media (max-width: 1080px) {
.kt-tiles { grid-template-columns: repeat(2, 1fr); }
.kt-map { grid-template-columns: 1fr; row-gap: 32px; }
.kt-map__info { order: 1; } .kt-map__frame { order: 2; }
.kt-connect__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.kt-tiles { grid-template-columns: 1fr; }
.kt-geo__cols { grid-template-columns: 1fr; row-gap: 28px; }
.kt-map__frame { aspect-ratio: 4/3; }
.kt-map__cta .btn { flex: 1 1 auto; text-align: center; }
}
/* =========================================================================
УСЛУГА — pillar-страница (page-arhitekturnoe-proektirovanie) — 2026-07-09
Переиспользует .case-hero / .chapter / .story-sticky / .estate-index / .ab-band;
ниже — только свои .svc-*.
========================================================================= */
.svc-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 6px; }
.svc-hero__link { font: 500 13px/1 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: rgba(244,240,231,.9); border-bottom: 1px solid rgba(244,240,231,.4); padding-bottom: 7px; transition: color var(--dur-brand) var(--ease-brand), border-color var(--dur-brand) var(--ease-brand); }
.svc-hero__link:hover { color: #F4F0E7; border-color: #F4F0E7; }
.svc-hero .case-hero__media img, .svc-hero .case-hero__media picture { display: block; width: 100%; height: 100%; object-fit: cover; }
.svc-alt { background: var(--surface-dim); border-block: 1px solid var(--hair); }
/* два столбца текст | медиа */
.svc-split { display: grid; grid-template-columns: 6fr 5fr; column-gap: clamp(48px, 6vw, 100px); align-items: center; }
.svc-split--rev .svc-split__text { order: 2; }
.svc-split--rev .svc-split__media { order: 1; }
.svc-split--wide { grid-template-columns: 7fr 5fr; align-items: start; margin-top: clamp(40px, 4.6vw, 64px); }
.svc-split__quote { margin-top: clamp(32px, 3.4vw, 48px); }
.svc-split__quote p { font: 400 clamp(20px, 2.2vw, 30px)/1.36 var(--font-serif); }
.svc-cap { font: 400 clamp(14px, 1.1vw, 16px)/1.6 var(--font-sans); color: var(--text-muted); margin-top: 16px; max-width: 46ch; }
/* чек-листы с бронзовой галочкой */
.svc-checks { list-style: none; margin: clamp(26px, 3vw, 38px) 0 0; padding: 0; display: grid; gap: 15px; }
.svc-checks--2col { grid-template-columns: 1fr 1fr; gap: 16px 40px; margin-top: 0; }
.svc-checks li { display: flex; gap: 14px; align-items: flex-start; font: 400 clamp(15px, 1.2vw, 17px)/1.55 var(--font-sans); color: var(--text-soft); }
.svc-ck { width: 20px; height: 20px; flex: none; color: var(--bronze); margin-top: 2px; }
.svc-scene-head { max-width: 62ch; margin-bottom: clamp(40px, 4.6vw, 64px); }
.svc-scene-head .ab-h2 { margin-top: 16px; }
.svc-scene-head .ab-lede { margin-top: 20px; }
/* этапы — 4 карточки-ссылки */
.svc-stages { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--hair); border: 1px solid var(--hair); }
.svc-stage { background: var(--surface-card); padding: clamp(26px, 2.4vw, 38px) clamp(22px, 2vw, 30px) clamp(28px, 2.4vw, 38px); display: flex; flex-direction: column; min-height: 100%; color: var(--text-body); transition: background var(--dur-brand) var(--ease-brand); }
a.svc-stage:hover { background: var(--surface-dim); }
.svc-stage__n { font: 500 12px/1 var(--font-sans); letter-spacing: .28em; text-transform: uppercase; color: var(--bronze); }
.svc-stage__t { font: 600 clamp(19px, 1.7vw, 24px)/1.2 var(--font-serif); margin: 18px 0 0; }
.svc-stage__d { font: 400 14px/1.6 var(--font-sans); color: var(--text-muted); margin: 12px 0 0; }
.svc-stage__more { margin-top: auto; padding-top: 22px; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); }
a.svc-stage:hover .svc-stage__more { color: var(--bronze); }
.svc-stage--soon .svc-stage__more--soon { color: var(--text-muted); opacity: .7; }
.svc-stage--soon { cursor: default; }
.svc-index { margin-bottom: clamp(8px, 1vw, 12px); }
/* почему мы — тёмная полоса, 4 тезиса */
.svc-whyband { background: var(--graphite); }
.svc-why { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(244,240,231,.14); border: 1px solid rgba(244,240,231,.14); }
.svc-why__tile { background: var(--graphite); padding: clamp(26px, 2.4vw, 36px) clamp(22px, 2vw, 30px) clamp(30px, 2.6vw, 40px); display: flex; flex-direction: column; }
.svc-why__n { font: 600 clamp(24px, 2.4vw, 34px)/1 var(--font-serif); color: var(--bronze-light); font-feature-settings: 'lnum' 1; }
.svc-why__t { font: 600 clamp(18px, 1.6vw, 22px)/1.2 var(--font-serif); color: var(--limestone); margin: 16px 0 0; }
.svc-why__d { font: 400 14px/1.6 var(--font-sans); color: rgba(244,240,231,.72); margin: 12px 0 0; }
@media (max-width: 1080px) {
.svc-stages { grid-template-columns: repeat(2, 1fr); }
.svc-why { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
.svc-split, .svc-split--wide { grid-template-columns: 1fr; row-gap: 40px; }
.svc-split--rev .svc-split__text { order: 1; }
.svc-split--rev .svc-split__media { order: 2; }
.svc-checks--2col { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.svc-stages, .svc-why { grid-template-columns: 1fr; }
}
/* --- Услуга: доработки 2026-07-09 (планировки, почему-6, контакты) --- */
.svc-wide { margin: clamp(40px, 4.6vw, 64px) 0 0; }
.svc-wide .svc-cap { max-width: 72ch; }
/* «Почему именно мы» — теперь 6 причин в 3 колонки (переопределяет базовый repeat(4)) */
.svc-why { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1080px) { .svc-why { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .svc-why { grid-template-columns: 1fr; } }
/* Контакты + мессенджеры + приглашение в бюро */
.svc-contact__grid { display: grid; grid-template-columns: 7fr 5fr; column-gap: clamp(48px, 6vw, 100px); align-items: start; }
.svc-contact__text { font: 400 clamp(15px, 1.2vw, 18px)/1.7 var(--font-sans); color: var(--text-soft); margin: 20px 0 0; max-width: 52ch; }
.svc-contact__facts { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 14px; }
.svc-contact__facts li { display: flex; gap: 14px; align-items: center; font: 400 clamp(15px, 1.2vw, 18px)/1.4 var(--font-sans); color: var(--text-body); }
.svc-contact__facts a { color: var(--text-body); border-bottom: 1px solid var(--hair-strong); }
.svc-contact__facts a:hover { color: var(--bronze); border-color: var(--bronze); }
.svc-contact__ic { width: 22px; height: 22px; flex: none; color: var(--bronze); }
.svc-contact__ic svg { width: 100%; height: 100%; display: block; }
.svc-contact__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.svc-contact__lbl { font: 500 11px/1.4 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--text-accent); margin: 0 0 16px; }
.svc-contact__lbl--2 { margin-top: 34px; }
@media (max-width: 900px) {
.svc-contact__grid { grid-template-columns: 1fr; row-gap: 40px; }
}
/* Портфолио — витрина «ещё проекты» (обложки без страниц, наполняем постепенно) */
.pf-more__title { font: var(--type-h2); color: var(--text-body); margin: 12px 0 0; max-width: 22ch; }
.pf-more__lead { max-width: 66ch; margin: 20px 0 0; font: 400 clamp(16px, 1.3vw, 18px)/1.7 var(--font-sans); color: var(--text-muted); }
.pf-more .pf-grid { margin-top: 48px; }
.pf-card--static { cursor: default; }
.pf-card--static:hover .pf-card__media img { transform: none; }
/* Портфолио-витрина: видео-карточки (loop + play) */
.pf-card__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; background: var(--ph-bg); }
.pf-card--video.pf-card--static .pf-card__media { cursor: pointer; }
.pf-card__media.project__video .project__iframe { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; }
.pf-card__media.project__video .play { width: 64px; height: 64px; }
/* --- Услуга «Дизайн интерьеров» (2026-07-10) --- */
@media (min-width: 1081px) {
.svc-stages--3 { grid-template-columns: repeat(3, 1fr); }
}
.svc-styles { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 2.4vw, 34px); margin-top: clamp(36px, 4vw, 56px); }
.svc-style { display: block; color: inherit; text-decoration: none; }
.svc-style .media img { transition: transform .6s var(--ease-brand, ease); }
.svc-style:hover .media img { transform: scale(1.045); }
.svc-style__t { font: 600 clamp(20px, 1.8vw, 25px)/1.2 var(--font-serif); margin: 16px 0 0; color: var(--text-body); }
.svc-style__d { font: 400 14px/1.5 var(--font-sans); color: var(--text-muted); margin: 6px 0 0; }
.svc-styles__more { margin: clamp(28px, 3vw, 40px) 0 0; }
.svc-hero__link--dark { color: var(--text-body); border-color: var(--hair); }
.svc-hero__link--dark:hover { color: var(--bronze); border-color: var(--bronze); }
@media (max-width: 1024px) { .svc-styles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .svc-styles { grid-template-columns: 1fr; } }
/* --- Этапы проектирования (page-stage) ------------------------------------ */
/* Галерея-доказательства: 3 колонки реальных эскизов/чертежей */
.svc-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.2vw, 32px); margin-top: clamp(36px, 4vw, 56px); }
@media (max-width: 1080px) { .svc-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .svc-gallery { grid-template-columns: 1fr; } }
/* Шаги «как проходит» — карточки svc-stage, ширина по числу шагов */
.svc-stages--flow { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
/* Путь проекта: 8 компактных плиток, текущий этап подсвечен бронзой */
.svc-path { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--hair); border: 1px solid var(--hair); }
.svc-path .svc-path__item { padding: clamp(20px, 1.9vw, 28px) clamp(18px, 1.7vw, 26px); min-height: 0; }
.svc-path .svc-path__item .svc-stage__t { font-size: clamp(16px, 1.35vw, 20px); margin-top: 12px; }
.svc-path .svc-path__item .svc-stage__more { padding-top: 16px; }
.svc-path .svc-path__item.is-now { box-shadow: inset 0 0 0 1px var(--bronze); background: var(--surface-dim); }
.svc-path__now { color: var(--bronze) !important; }
@media (max-width: 1080px) { .svc-path { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .svc-path { grid-template-columns: 1fr; } }
/* =========================================================================
ИНТЕРЬЕРЫ — категории (текстовые фильтры, стиль Журнала) + галерея. 2026-07-13
Единый с /blog/ язык фильтров: капитель с трекингом, счётчик, активный —
акцентом с подчёркиванием; тонкая линейка сверху/снизу. Десктоп — перенос строк,
мобайл (≤700) — свайп. Клик по фото галереи → лайтбокс; ссылка «Смотреть проект».
========================================================================= */
.int-cats { border-block: 1px solid var(--hair); margin-top: clamp(30px, 3.6vw, 48px); padding: clamp(16px, 2vw, 22px) 0; display: flex; flex-direction: column; gap: clamp(8px, 1.1vw, 14px); }
.int-cats__group { min-width: 0; }
.int-filters { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px clamp(18px, 2vw, 30px); }
.int-filter { display: inline-flex; align-items: baseline; gap: 7px; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-body); padding: 6px 0; border-bottom: 1px solid transparent; white-space: nowrap; transition: color var(--dur-brand) var(--ease-brand), border-color var(--dur-brand) var(--ease-brand); }
.int-filter em { font: 400 11px/1 var(--font-sans); font-style: normal; letter-spacing: 0; color: var(--text-muted); font-feature-settings: 'lnum' 1; }
.int-filter:hover { color: var(--bronze); }
.int-filter.is-active { color: var(--text-accent); border-color: var(--text-accent); }
@media (max-width: 700px) {
.int-cats { margin-top: 24px; padding: 16px 0; gap: 0; }
.int-cats__group + .int-cats__group { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--hair); }
.int-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 26px), transparent 100%); mask-image: linear-gradient(90deg, #000 calc(100% - 26px), transparent 100%); }
.int-filters::-webkit-scrollbar { display: none; }
.int-filter { font-size: 11.5px; padding: 9px 0; }
}
/* --- Галерея «по помещениям» --- */
.int-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 3vw, 44px) 24px; }
.int-shot { display: block; margin: 0; color: var(--text-body); }
.int-shot__media { position: relative; display: block; width: 100%; margin: 0; padding: 0; border: 0; aspect-ratio: 4/3; overflow: hidden; background: var(--ph-bg); cursor: zoom-in; font: inherit; color: inherit; }
.int-shot__media picture { display: block; width: 100%; height: 100%; }
.int-shot__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-brand); }
.int-shot__media:hover img { transform: scale(1.04); }
.int-shot__cap { display: block; padding-top: 14px; }
.int-shot__case { display: block; font: 400 clamp(17px, 1.4vw, 20px)/1.25 var(--font-serif); color: var(--text-body); }
.int-shot__note { display: block; font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 5px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.int-shot__link { display: inline-block; margin-top: 10px; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); border-bottom: 1px solid var(--hair-strong); padding-bottom: 6px; transition: color var(--dur-brand) var(--ease-brand), border-color var(--dur-brand) var(--ease-brand); }
.int-shot__link:hover { color: var(--bronze); border-color: var(--bronze); }
@media (max-width: 900px) { .int-gallery { grid-template-columns: repeat(2, 1fr); gap: 28px 18px; } }
@media (max-width: 560px) { .int-gallery { grid-template-columns: 1fr; gap: 32px; } }
/* --- Лайтбокс (просмотр фото на весь экран) --- */
.int-lb { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: clamp(14px, 4vw, 56px); background: rgba(12, 12, 13, .93); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.int-lb[hidden] { display: none; }
.int-lb__fig { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 16px; max-width: min(1440px, 94vw); }
.int-lb__img { max-width: 100%; max-height: 80vh; width: auto; height: auto; object-fit: contain; box-shadow: 0 24px 70px rgba(0, 0, 0, .55); }
.int-lb__cap { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 6px 18px; text-align: center; }
.int-lb__case { font: 400 clamp(18px, 1.6vw, 24px)/1.2 var(--font-serif); color: #F4F0E7; }
.int-lb__note { font: 400 14px/1.5 var(--font-sans); color: rgba(244, 240, 231, .72); }
.int-lb__link { font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--bronze-light); border-bottom: 1px solid currentColor; padding-bottom: 5px; }
.int-lb__link:hover { color: #fff; }
.int-lb__close { position: absolute; top: clamp(12px, 2vw, 24px); right: clamp(12px, 2vw, 24px); width: 44px; height: 44px; border-radius: 999px; border: 1px solid rgba(244, 240, 231, .3); background: rgba(0, 0, 0, .3); color: #F4F0E7; font: 400 26px/1 var(--font-sans); cursor: pointer; transition: border-color var(--dur-brand); }
.int-lb__close:hover { border-color: #F4F0E7; }
.int-lb__nav { position: absolute; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 999px; border: 1px solid rgba(244, 240, 231, .3); background: rgba(0, 0, 0, .3); color: #F4F0E7; font: 400 30px/1 var(--font-serif); cursor: pointer; transition: border-color var(--dur-brand); }
.int-lb__nav:hover { border-color: #F4F0E7; }
.int-lb__nav--prev { left: clamp(8px, 2vw, 28px); }
.int-lb__nav--next { right: clamp(8px, 2vw, 28px); }
@media (max-width: 700px) {
.int-lb__img { max-height: 72vh; }
.int-lb__nav { width: 40px; height: 40px; font-size: 24px; }
.int-lb__nav--prev { left: 6px; }
.int-lb__nav--next { right: 6px; }
}
/* --- Перелинковка со страницы кейса → подборки по помещениям/стилю --- */
.case-explore .eyebrow { display: block; margin-bottom: clamp(20px, 2.4vw, 30px); }
.case-explore__group { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px clamp(18px, 2vw, 26px); }
.case-explore__group + .case-explore__group { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--hair); }
.case-explore__lead { flex: 0 0 auto; min-width: 120px; font: 500 10px/1.5 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--text-muted); }
.case-explore .int-filters { flex: 1 1 320px; }
@media (max-width: 700px) { .case-explore__group { flex-direction: column; align-items: stretch; gap: 8px; } .case-explore__lead { min-width: 0; } }
/* --- Страница «Видеообзоры» (/videoobzory/) --- */
.vr-groupkick { margin-bottom: clamp(20px, 2.4vw, 30px); }
.vr-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(34px, 4vw, 56px) 32px; }
.vr-card { display: block; }
.vr-card .media { margin: 0; }
.vr-card__cap { padding-top: 16px; }
.vr-card__title { font: 400 clamp(20px, 1.7vw, 26px)/1.2 var(--font-serif); color: var(--text-body); margin: 0; }
.vr-card__head { font: 400 14px/1.55 var(--font-sans); color: var(--text-muted); margin: 7px 0 0; max-width: 52ch; }
.vr-card__link { display: inline-block; margin-top: 13px; font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--text-soft); border-bottom: 1px solid var(--hair-strong); padding-bottom: 6px; transition: color var(--dur-brand) var(--ease-brand), border-color var(--dur-brand) var(--ease-brand); }
.vr-card__link:hover { color: var(--bronze); border-color: var(--bronze); }
@media (max-width: 820px) { .vr-grid { grid-template-columns: 1fr; gap: 36px; } }
/* --- Закрытое портфолио (/zakrytoe-portfolio/): гейт логин/пароль --- */
.pv-gate { position: relative; display: flex; align-items: center; min-height: calc(100vh - var(--masthead-h, 94px)); background-size: cover; background-position: center; overflow: hidden; }
.pv-gate__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,12,14,.70) 0%, rgba(11,12,14,.84) 60%, rgba(11,12,14,.92) 100%); }
.pv-gate__inner { position: relative; max-width: 760px; padding-block: clamp(64px, 12vh, 130px); }
.pv-gate .kicker--light { color: var(--bronze-light); }
.pv-gate__title { font: 400 clamp(36px, 5vw, 68px)/1.05 var(--font-serif); color: #F4F0E7; letter-spacing: -.01em; margin: 16px 0 0; max-width: 18ch; overflow-wrap: break-word; }
.pv-gate__lede { font: 400 clamp(16px, 1.3vw, 20px)/1.65 var(--font-sans); color: rgba(244,240,231,.82); margin: 24px 0 0; max-width: 58ch; }
.pv-gate__line { font: 400 clamp(19px, 1.7vw, 26px)/1.3 var(--font-serif); color: #F4F0E7; margin: 28px 0 0; }
.pv-form { margin-top: clamp(30px, 4vw, 46px); max-width: 540px; }
.pv-form__err { color: #E6B0A2; font: 400 14px/1.4 var(--font-sans); margin: 0 0 16px; }
.pv-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.pv-field { display: flex; flex-direction: column; gap: 9px; }
.pv-field span { font: 500 10px/1 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: rgba(244,240,231,.6); }
.pv-field input { background: rgba(244,240,231,.08); border: 1px solid rgba(244,240,231,.24); color: #F4F0E7; padding: 14px 16px; font: 400 15px/1.2 var(--font-sans); border-radius: 0; transition: border-color var(--dur-brand), background-color var(--dur-brand); }
.pv-field input:focus { outline: none; border-color: var(--bronze-light); background: rgba(244,240,231,.13); }
.pv-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pv-form .btn { margin-top: 22px; }
.pv-gate__foot { margin-top: 24px; font: 400 15px/1.5 var(--font-sans); color: rgba(244,240,231,.72); }
.pv-gate__foot a { color: var(--bronze-light); border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.pv-gate__foot a:hover { color: #F4F0E7; }
.pv-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(28px, 4vw, 42px); }
.pv-actions .pv-ghost { border-color: rgba(244,240,231,.4); color: #F4F0E7; }
.pv-actions .pv-ghost:hover { border-color: #F4F0E7; }
@media (max-width: 560px) { .pv-form__row { grid-template-columns: 1fr; } }
/* =========================================================================
Раздел «Материалы и решения» (/materialy/) — витрина «от лица студии».
Партнёры анонимны. Цвета — через семантические токены (авто-флип в тёмной теме
через [data-theme="dark"]): --text-body/soft/muted, --surface-page/dim/card/inverse,
--text-inverse, --hair. Компоненты/сетка — общие (.container, .section, .btn).
========================================================================= */
.mat-top { padding: calc(var(--masthead-h, 94px) + 40px) 0 8px; }
.mat-kicker { font: 600 11px/1.2 var(--font-sans); letter-spacing: .22em; text-transform: uppercase; color: var(--bronze); margin: 0 0 14px; }
.mat-kicker a { color: inherit; text-decoration: none; }
.mat-kicker a:hover { color: var(--bronze-deep); }
.mat-h1 { font: 600 clamp(34px, 5vw, 58px)/1.05 var(--font-serif); letter-spacing: -.01em; margin: 0 0 20px; color: var(--text-body); text-wrap: balance; }
.mat-lede { font: 400 clamp(16px, 1.7vw, 19px)/1.6 var(--font-sans); color: var(--text-soft); max-width: 64ch; margin: 0; }
/* внутренняя навигация раздела — прилипает под шапкой */
.mat-nav { position: sticky; top: var(--masthead-h, 94px); z-index: 20; background: var(--surface-page); border-block: 1px solid var(--hair); margin-top: 28px; }
.mat-nav__row { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-block: 12px; }
.mat-nav__row::-webkit-scrollbar { display: none; }
.mat-nav__link { flex: none; font: 500 13px/1 var(--font-sans); color: var(--text-soft); text-decoration: none; padding: 9px 15px; border: 1px solid var(--hair); border-radius: 100px; white-space: nowrap; transition: color .2s, border-color .2s, background .2s; }
.mat-nav__link:hover { color: var(--bronze); border-color: var(--bronze); }
.mat-nav__link.is-current { color: var(--text-inverse); background: var(--surface-inverse); border-color: var(--surface-inverse); }
/* сетка направлений */
.mat-themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
.mat-theme { text-decoration: none; background: var(--surface-card); border: 1px solid var(--hair); border-radius: 2px; overflow: hidden; display: block; transition: transform .25s var(--ease-brand, ease), border-color .25s; }
.mat-theme:hover { transform: translateY(-3px); border-color: var(--bronze); }
.mat-theme__meta { display: block; padding: 15px 17px 17px; }
.mat-theme__name { display: block; font: 600 18px/1.2 var(--font-sans); color: var(--text-body); margin-bottom: 3px; }
.mat-theme__count { display: block; font: 400 12.5px/1.3 var(--font-sans); color: var(--text-muted); }
/* сетка решений в направлении */
.mat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 20px; }
.mat-card { text-decoration: none; background: var(--surface-card); border: 1px solid var(--hair); border-radius: 2px; overflow: hidden; display: block; transition: transform .25s var(--ease-brand, ease), border-color .25s; }
.mat-card:hover { transform: translateY(-3px); border-color: var(--bronze); }
.mat-card__body { display: block; padding: 16px 18px 19px; }
.mat-card__title { display: block; font: 600 19px/1.25 var(--font-serif); color: var(--text-body); margin-bottom: 6px; }
.mat-card__ex { display: block; font: 400 13.5px/1.5 var(--font-sans); color: var(--text-soft); margin-bottom: 13px; }
.mat-chip { display: inline-flex; font: 500 11.5px/1 var(--font-sans); color: var(--text-muted); border: 1px solid var(--hair); padding: 6px 11px; border-radius: 100px; }
.mat-empty { color: var(--text-muted); font: 400 16px/1.6 var(--font-sans); }
/* плитка-заглушка (пока нет фото партнёра); при наличии фото — оно фоном поверх */
.mat-sw { display: block; height: 158px; background-size: cover; background-position: center; }
.mat-theme .mat-sw { height: 120px; }
.mat-sw--travertine { background-color: #CDBB9A; background-image: repeating-linear-gradient(92deg, rgba(0,0,0,.05) 0 2px, transparent 2px 9px), linear-gradient(135deg, #E7DBC2, #CDBB9A 60%, #D8CBB0); }
.mat-sw--glass { background-image: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.45) 46%, transparent 52%), linear-gradient(135deg, #9fb3b8, #c9d6d4 45%, #7d979b); }
.mat-sw--eng { background-image: linear-gradient(135deg, #3a4750, #586873 60%, #41505a); }
.mat-sw--light { background-image: radial-gradient(circle at 50% 38%, #f6e2b4, #caa869 40%, #6d5836 100%); }
.mat-sw--door { background-image: linear-gradient(120deg, #6f5238, #8a6a45 55%, #5c4227); }
.mat-sw--decor { background-image: linear-gradient(135deg, #b9a888, #a8946f 60%, #cbbd9f); }
.mat-sw--furniture { background-image: linear-gradient(120deg, #7d6a52, #9c8768 55%, #6b5a44); }
.mat-sw--bath { background-image: linear-gradient(135deg, #dfe4e2, #c3ccc8 60%, #e6ebe8); }
.mat-sw--smart { background-image: linear-gradient(135deg, #26303a, #33414d 60%, #1f2831); }
.mat-sw--land { background-image: linear-gradient(135deg, #3c4a37, #586b4e 60%, #2f3b2c); }
/* лендинг решения */
.mat-detail-wrap { padding: calc(var(--masthead-h, 94px) + 48px) 0 24px; }
.mat-detail { display: grid; grid-template-columns: 1.05fr 1fr; gap: 44px; align-items: start; }
.mat-visual { border-radius: 2px; min-height: 460px; height: 100%; background-size: cover; background-position: center; border: 1px solid var(--hair); position: sticky; top: calc(var(--masthead-h, 94px) + 24px); }
.mat-detail__kick { font: 600 12px/1.2 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--bronze); margin: 0 0 14px; }
.mat-detail__h { font: 600 clamp(30px, 4vw, 46px)/1.05 var(--font-serif); margin: 0 0 16px; color: var(--text-body); }
.mat-p { font: 400 15.5px/1.7 var(--font-sans); color: var(--text-body); margin: 16px 0 0; max-width: 60ch; }
.mat-spec { width: 100%; border-collapse: collapse; margin: 28px 0 4px; font: 400 14px/1.5 var(--font-sans); }
.mat-spec td { padding: 12px 0; border-bottom: 1px solid var(--hair); vertical-align: top; }
.mat-spec td:first-child { color: var(--text-muted); width: 40%; font-size: 13px; }
.mat-spec td:last-child { color: var(--text-body); }
.mat-applied { margin-top: 30px; }
.mat-applied__lbl { font: 500 11px/1.2 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 12px; }
.mat-applied__row { display: flex; gap: 12px; flex-wrap: wrap; }
.mat-proj { flex: 1 1 140px; min-width: 130px; border: 1px solid var(--hair); border-radius: 2px; overflow: hidden; text-decoration: none; background: var(--surface-dim); }
.mat-proj__ph { display: block; height: 76px; background-size: cover; background-position: center; }
.mat-proj span:last-child { display: block; padding: 9px 12px; font: 400 12.5px/1.3 var(--font-sans); color: var(--text-soft); }
.mat-quote { margin: 30px 0 0; padding: 0 0 0 20px; border-left: 2px solid var(--bronze); font: 400 italic 19px/1.5 var(--font-serif); color: var(--text-body); }
.mat-cta-card { margin-top: 34px; background: var(--bronze); border-radius: 2px; padding: 26px 28px; }
.mat-cta-card h2 { font: 600 23px/1.1 var(--font-serif); color: #fff; margin: 0 0 7px; }
.mat-cta-card p { font: 400 14px/1.55 var(--font-sans); color: rgba(255,255,255,.88); margin: 0 0 18px; max-width: 46ch; }
.mat-cta-card .btn { background: #fff; color: var(--graphite); border: 0; }
.mat-cta-card .btn:hover { background: rgba(255,255,255,.88); color: var(--graphite); }
.mat-post { max-width: 72ch; }
/* CTA-полоса на корне */
.mat-cta-band { background: var(--surface-dim); border-top: 1px solid var(--hair); }
.mat-cta-band__h { font: 600 clamp(24px, 3.2vw, 38px)/1.1 var(--font-serif); margin: 0 0 16px; color: var(--text-body); }
.mat-cta-band .btn { margin-top: 26px; }
@media (max-width: 820px) {
.mat-detail { grid-template-columns: 1fr; gap: 26px; }
.mat-visual { min-height: 280px; position: static; }
}
/* pf-cta: мессенджеры + призыв писать (заменили одинокий Telegram) */
.pf-cta__actions { flex-direction: column; align-items: flex-end; gap: 22px; }
.pf-cta__msg { text-align: right; max-width: 400px; }
.pf-cta__msg-label { margin: 0 0 14px; font: 500 14px/1.5 var(--font-sans); color: rgba(244,240,231,.75); }
.pf-cta__msgrow { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.pf-msgbtn { display: inline-flex; align-items: center; gap: 9px; padding: 12px 18px; border: 1px solid rgba(244,240,231,.4); color: var(--limestone); font: 500 14px/1 var(--font-sans); transition: border-color .3s var(--ease-brand), background-color .3s var(--ease-brand), transform .3s var(--ease-brand); }
.pf-msgbtn:hover { border-color: var(--limestone); background-color: rgba(244,240,231,.08); transform: translateY(-2px); }
.pf-msgbtn svg { width: 18px; height: 18px; }
.pf-msgbtn .ic-glyph { width: 18px; text-align: center; font: 700 12px/1 var(--font-sans); }
@media (max-width: 860px) {
.pf-cta__actions { align-items: flex-start; }
.pf-cta__msg { text-align: left; }
.pf-cta__msgrow { justify-content: flex-start; }
}
/* =========================================================================
Раздел «Материалы» v2 — продающая подача (воронка желания). 2026-07-14
========================================================================= */
.mat-eyebrow { font: 600 11px/1.2 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--bronze); margin: 0 0 18px; }
/* HERO лендинга — обещание поверх образа/скрима, текст всегда светлый */
.mat-hero { position: relative; min-height: 60vh; display: flex; align-items: flex-end; background-size: cover; background-position: center; padding: calc(var(--masthead-h, 94px) + 40px) 0 0; }
.mat-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,16,18,.15) 0%, rgba(15,16,18,.42) 55%, rgba(15,16,18,.78) 100%); }
.mat-hero__inner { position: relative; z-index: 1; padding-block: 44px 52px; }
.mat-hero__kick { font: 600 12px/1.2 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; color: #E9CfA0; margin: 0 0 16px; }
.mat-hero__h { font: 600 clamp(38px, 6vw, 74px)/1.02 var(--font-serif); letter-spacing: -.01em; color: #F6F2EA; margin: 0 0 16px; max-width: 16ch; text-wrap: balance; }
.mat-hero__promise { font: 400 clamp(18px, 2.2vw, 25px)/1.35 var(--font-serif); color: rgba(246,242,234,.9); margin: 0 0 30px; max-width: 26ch; }
.mat-hero__cta { align-self: flex-start; }
/* тело лендинга */
.mat-lp { padding: clamp(46px, 6vw, 86px) 0; }
.mat-lp__story { max-width: 64ch; }
.mat-lp__lede { font: 400 clamp(19px, 2.2vw, 26px)/1.5 var(--font-serif); color: var(--text-body); margin: 0 0 8px; }
.mat-lp .mat-p { font: 400 16px/1.7 var(--font-sans); color: var(--text-soft); margin: 18px 0 0; max-width: 62ch; }
/* ПОЧЕМУ через студию */
.mat-why { margin-top: clamp(48px, 6vw, 84px); }
.mat-why__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.mat-why__cell { padding: 26px 30px 30px 0; border-top: 2px solid var(--bronze); }
.mat-why__cell + .mat-why__cell { padding-left: 30px; }
.mat-why__n { font: 400 14px/1 var(--font-serif); color: var(--bronze); letter-spacing: .1em; }
.mat-why__cell h3 { font: 600 21px/1.2 var(--font-serif); color: var(--text-body); margin: 14px 0 10px; }
.mat-why__cell p { font: 400 14.5px/1.6 var(--font-sans); color: var(--text-soft); margin: 0; }
/* спека + чеклист */
.mat-split { margin-top: clamp(48px, 6vw, 84px); display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.mat-checks { list-style: none; margin: 0; padding: 0; }
.mat-checks li { position: relative; padding: 12px 0 12px 30px; border-bottom: 1px solid var(--hair); font: 400 15px/1.5 var(--font-sans); color: var(--text-body); }
.mat-checks li::before { content: ""; position: absolute; left: 2px; top: 15px; width: 13px; height: 8px; border-left: 2px solid var(--bronze); border-bottom: 2px solid var(--bronze); transform: rotate(-45deg); }
/* финальный CTA — крупная бронзовая плашка */
.mat-cta-final { margin-top: clamp(48px, 6vw, 84px); }
.mat-cta-final__box { background: var(--bronze); border-radius: 2px; padding: clamp(32px, 4vw, 52px); text-align: center; }
.mat-cta-final__box h2 { font: 600 clamp(26px, 3.4vw, 40px)/1.1 var(--font-serif); color: #fff; margin: 0 0 12px; text-wrap: balance; }
.mat-cta-final__box p { font: 400 16px/1.6 var(--font-sans); color: rgba(255,255,255,.9); margin: 0 auto 24px; max-width: 52ch; }
.mat-cta-final__box .btn { background: #fff; color: var(--graphite); border: 0; }
.mat-cta-final__box .btn:hover { background: rgba(255,255,255,.9); color: var(--graphite); }
.mat-cta-final__note { display: block; margin-top: 14px; font: 400 13px/1.4 var(--font-sans); color: rgba(255,255,255,.8); }
/* корень: три выгоды */
.mat-props { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-bottom: clamp(40px, 5vw, 68px); }
.mat-prop { padding: 24px 28px 26px 0; border-top: 2px solid var(--bronze); }
.mat-prop + .mat-prop { padding-left: 28px; }
.mat-prop__n { font: 400 14px/1 var(--font-serif); color: var(--bronze); letter-spacing: .1em; }
.mat-prop h3 { font: 600 20px/1.2 var(--font-serif); color: var(--text-body); margin: 13px 0 9px; }
.mat-prop p { font: 400 14.5px/1.6 var(--font-sans); color: var(--text-soft); margin: 0; }
.mat-themes__lbl { margin-bottom: 18px; }
/* карточка решения — стрелка-действие */
.mat-card__go { display: block; margin-top: 12px; font: 600 12px/1 var(--font-sans); letter-spacing: .04em; color: var(--bronze); }
@media (max-width: 820px) {
.mat-why__grid, .mat-props { grid-template-columns: 1fr; }
.mat-why__cell + .mat-why__cell, .mat-prop + .mat-prop { padding-left: 0; }
.mat-split { grid-template-columns: 1fr; gap: 30px; }
.mat-hero { min-height: 52vh; }
}
}
/* пульс play-кнопок */
@keyframes rz-playpulse { 0% { transform: scale(1); opacity: .7; } 70% { transform: scale(1.28); opacity: 0; } 100% { opacity: 0; } }
/* Раздел «Материалы» — блок «Поставщикам» (вход/регистрация в кабинет) 2026-07-14 */
.mat-suppliers{border:1px solid var(--hair);border-radius:2px;padding:clamp(28px,4vw,48px);display:flex;gap:34px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--surface-dim)}
.mat-suppliers__text{flex:1 1 460px;min-width:0}
.mat-suppliers__h{font:600 clamp(22px,2.8vw,32px)/1.15 var(--font-serif);margin:8px 0 12px;color:var(--text-body)}
.mat-suppliers .mat-lede{max-width:62ch}
.mat-suppliers__cta{flex:none;white-space:nowrap}
@media(max-width:720px){.mat-suppliers{flex-direction:column;align-items:flex-start;gap:22px}}
/* =========================================================================
SEO-перелинковка (2026-07-16): «Проекты по теме» на статье, «Из журнала» на кейсе
========================================================================= */
.seo-cross__service { margin-top: 36px; display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.seo-cross__service span { font: 400 14px/1.5 var(--font-sans); color: var(--text-soft); }
/* Галерея лендинга решения (Оснащение) */
.mat-gal { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: clamp(40px, 6vw, 70px); }
.mat-gal__item { margin: 0; }
.mat-gal__item img { width: 100%; height: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.mat-gal__item figcaption { font: 400 13px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 10px; }
@media (max-width: 860px) { .mat-gal { grid-template-columns: 1fr; gap: 26px; } }
/* Главы-портфолио лендинга решения */
.mat-chap { margin-top: clamp(56px, 8vw, 100px); }
.mat-chap__h { font: 600 clamp(26px, 3.4vw, 40px)/1.12 var(--font-serif); color: var(--text-body); margin: 14px 0 14px; max-width: 26ch; text-wrap: balance; }
.mat-chap__t { font: 400 16px/1.65 var(--font-sans); color: var(--text-soft); max-width: 68ch; margin: 0 0 30px; }
.mat-chap__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.mat-chap__item { margin: 0; grid-column: span 2; }
.mat-chap__item.is-lead { grid-column: span 4; grid-row: span 2; }
.mat-chap__item img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4/3; }
.mat-chap__item picture { display: block; height: 100%; }
.mat-chap__item.is-lead img { aspect-ratio: auto; }
.mat-chap__item figcaption { font: 400 12.5px/1.5 var(--font-sans); color: var(--text-muted); margin-top: 8px; }
@media (max-width: 860px) {
.mat-chap__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.mat-chap__item, .mat-chap__item.is-lead { grid-column: span 2; grid-row: auto; }
.mat-chap__grid .mat-chap__item:nth-child(n+3):not(.is-lead) { grid-column: span 1; }
}
/* Лента цифр */
.mat-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--hair); border: 1px solid var(--hair); margin-top: clamp(48px, 7vw, 80px); }
.mat-stats__cell { background: var(--surface-card); padding: 30px 20px; text-align: center; }
.mat-stats__cell b { display: block; font: 600 clamp(28px, 3.4vw, 44px)/1 var(--font-serif); color: var(--bronze); }
.mat-stats__cell span { display: block; margin-top: 9px; font: 400 13px/1.45 var(--font-sans); color: var(--text-soft); }
@media (max-width: 700px) { .mat-stats { grid-template-columns: 1fr 1fr; } }
/* Фото в блоке «уже стоит в этих домах» */
.mat-proj__ph { overflow: hidden; }
.mat-proj__ph picture, .mat-proj__ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* ===== Закрытое собрание (vault): приватная глава кейса, карточка-дверь, галерея за гейтом ===== */
.case-vault { background: #17181B; color: #F4F0E7; }
.case-vault .eyebrow { color: var(--bronze-light, #C9A26B); }
.case-vault__head { max-width: 860px; }
.case-vault__title { font: 400 clamp(26px, 2.6vw, 40px)/1.18 var(--font-serif); color: #F4F0E7; margin: 18px 0 14px; letter-spacing: -.01em; }
.case-vault__lede { font: 400 clamp(15px, 1.1vw, 17px)/1.7 var(--font-sans); color: rgba(244,240,231,.6); margin: 0; max-width: 58ch; }
.case-vault__stage { position: relative; margin-top: clamp(30px, 3.4vw, 52px); }
.case-vault__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.8vw, 28px); }
.case-vault__frame { margin: 0; }
.case-vault__frame .media { position: relative; border: 1px solid rgba(165,127,73,.22); }
.case-vault__frame img { transition: filter 1.2s var(--ease-brand, ease); }
.case-vault__frame:hover img { filter: brightness(1.35); }
.case-vault__ask { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.case-vault__ask-card { pointer-events: auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: clamp(22px, 2.4vw, 34px) clamp(26px, 3vw, 46px); background: rgba(16, 18, 21, .55); backdrop-filter: var(--glass-blur, blur(14px)); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(244, 240, 231, .14); border-radius: 18px; box-shadow: 0 24px 70px rgba(0, 0, 0, .4); }
.case-vault__ask p { font: 400 15px/1.6 var(--font-sans); color: rgba(244, 240, 231, .62); margin: 0; }
.case-vault__ask a { color: var(--bronze-light, #C9A26B); border-bottom: 1px solid currentColor; padding-bottom: 2px; transition: color .3s; }
.case-vault__ask a:hover { color: #F4F0E7; }
@media (max-width: 860px) {
.case-vault__grid { grid-template-columns: 1fr; gap: 18px; }
.case-vault__ask { position: static; margin-top: 20px; }
.case-vault__ask-card { width: 100%; background: rgba(16, 18, 21, .55); }
}
/* Карточка-«дверь» закрытого собрания в гриде хаба */
.pf-card--vault .pf-card__media { border: 1px solid rgba(165,127,73,.30); }
.pf-card--vault .pf-card__veil { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(11,12,14,.04) 40%, rgba(11,12,14,.5) 100%); }
/* Галерея закрытого собрания за гейтом (/zakrytoe-portfolio/) */
.pv-coll { background: #141519; color: #F4F0E7; }
.pv-coll .eyebrow { color: var(--bronze-light, #C9A26B); }
.pv-coll__head { max-width: 900px; }
.pv-coll__title { font: 400 clamp(34px, 4vw, 56px)/1.05 var(--font-serif); color: #F4F0E7; margin: 14px 0 0; }
.pv-coll__sub { font: 500 12px/1.4 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: rgba(244,240,231,.6); margin: 14px 0 0; }
.pv-coll__lede { font: 400 clamp(15px, 1.15vw, 18px)/1.65 var(--font-sans); color: rgba(244,240,231,.78); margin: 22px 0 0; max-width: 68ch; }
.pv-coll__grid { columns: 2; column-gap: clamp(16px, 2vw, 30px); margin: clamp(32px, 4vw, 56px) 0 0; }
.pv-coll__frame { margin: 0 0 clamp(16px, 2vw, 30px); break-inside: avoid; }
.pv-coll__frame .media { border: 1px solid rgba(165,127,73,.22); }
.pv-coll__frame figcaption { font: 400 13px/1.5 var(--font-sans); color: rgba(244,240,231,.55); margin-top: 10px; }
.pv-coll__note { font: 400 13px/1.6 var(--font-sans); color: rgba(244,240,231,.45); margin: clamp(26px, 3vw, 40px) 0 0; max-width: 56ch; }
.pv-coll .pv-actions { margin-top: 26px; }
@media (max-width: 760px) { .pv-coll__grid { columns: 1; } }
/* Оглавление собрания: табы разделов + карточки проектов */
.pv-index { padding-bottom: 0; }
.pv-outro { padding-top: 0; }
.pv-coll + .pv-coll { border-top: 1px solid rgba(244,240,231,.08); }
.pv-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: clamp(24px, 3vw, 38px); }
.pv-tab { font: 500 12px/1 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: rgba(244,240,231,.55); background: transparent; border: 1px solid rgba(244,240,231,.18); padding: 12px 18px; cursor: pointer; transition: color .3s, border-color .3s; }
.pv-tab:hover { color: #F4F0E7; border-color: rgba(244,240,231,.4); }
.pv-tab.is-active { color: var(--bronze-light, #C9A26B); border-color: var(--bronze, #A57F49); }
.pv-tab__n { color: rgba(244,240,231,.35); margin-left: 6px; }
.pv-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.6vw, 24px); margin-top: clamp(24px, 3vw, 40px); }
.pv-card { display: block; text-decoration: none; }
.pv-card__media { display: block; aspect-ratio: 4/3; overflow: hidden; border: 1px solid rgba(244,240,231,.1); background: #101114; }
.pv-card__media picture, .pv-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease-brand, ease); }
.pv-card:hover .pv-card__media img { transform: scale(1.04); }
.pv-card__kicker { display: block; font: 500 11px/1.2 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--bronze-light, #C9A26B); margin-top: 14px; }
.pv-card__title { display: block; font: 400 clamp(19px, 1.5vw, 24px)/1.2 var(--font-serif); color: #F4F0E7; margin-top: 8px; }
.pv-card__more { display: inline-block; font: 500 12px/1 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: rgba(244,240,231,.5); margin-top: 10px; }
.pv-card:hover .pv-card__more { color: var(--bronze-light, #C9A26B); }
.pv-card--soon { border: 1px dashed rgba(244,240,231,.18); padding: 22px; align-self: stretch; display: flex; flex-direction: column; justify-content: center; }
.pv-card--soon .pv-card__more { text-transform: none; letter-spacing: .02em; font: 400 13px/1.5 var(--font-sans); }
.pv-private__head { margin-top: clamp(30px, 3.6vw, 54px); }
.pv-private__head .eyebrow { color: var(--bronze-light, #C9A26B); }
.pv-private__lede { font: 400 14px/1.6 var(--font-sans); color: rgba(244,240,231,.55); margin: 10px 0 0; max-width: 56ch; }
.pv-private__head + .pv-coll__grid { margin-top: clamp(18px, 2vw, 28px); }
.pv-coll__frame--private .media { border-color: rgba(165,127,73,.45); }
@media (max-width: 1100px) { .pv-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pv-cards { grid-template-columns: 1fr; } }