/* Внутренние страницы: список кейсов и страница кейса.
   Подключается после astraform.css, tailwind.css и smirnov.css.
   Разметку пишет tools/smirnov_build.py. */

.nav-links a[aria-current="page"]::after {
right: 0;
}

/* ---------- первый экран кейса ---------- */
.case-hero {
position: relative;
display: flex;
align-items: flex-end;
min-height: 88svh;
padding-top: 52px;
overflow: hidden;
background: #080808;
color: #fff;
}
.case-hero > img {
position: absolute;
inset: 52px 0 0;
width: 100%;
height: calc(100% - 52px);
object-fit: cover;
}
.case-hero::after {
content: "";
position: absolute;
inset: 52px 0 0;
background: linear-gradient(0deg, rgba(0, 0, 0, .92), rgba(0, 0, 0, .58) 50%, rgba(0, 0, 0, .36));
}
.case-hero-inner {
position: relative;
z-index: 2;
padding-top: 40px;
padding-bottom: clamp(28px, 4vw, 56px);
}
.case-back {
display: inline-block;
margin-bottom: clamp(40px, 12vh, 140px);
font-size: 12px;
text-decoration: none;
border-bottom: 1px solid rgba(255, 255, 255, .5);
padding-bottom: 3px;
}
.case-back:hover {
color: var(--signal);
border-color: var(--signal);
}
.case-hero h1 {
max-width: 16ch;
margin-top: 18px;
font-size: clamp(2.6rem, 6.4vw, 7.6rem);
text-wrap: balance;
}
.case-tagline {
max-width: 34ch;
margin-top: 18px;
font-size: clamp(1.1rem, 1.7vw, 1.8rem);
line-height: 1.15;
letter-spacing: -.02em;
color: #d9d7d3;
}

/* ---------- паспорт кейса ---------- */
.case-meta {
border-top: 1px solid rgba(255, 255, 255, .14);
}
.case-meta-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 28px 32px;
padding-block: clamp(28px, 3.4vw, 48px);
}
.case-meta-grid dt {
color: #8a8986;
}
.case-meta-grid dd {
margin: 10px 0 0;
font-size: 15px;
line-height: 1.4;
}

/* ---------- текст ---------- */
.case-body {
padding-block: clamp(56px, 7vw, 120px);
}
.case-block {
padding-block: clamp(26px, 3.2vw, 52px);
}
.case-row {
display: grid;
grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr);
gap: 7vw;
align-items: start;
}
.case-label {
padding-top: .5em;
}
.case-text {
max-width: 64ch;
font-size: clamp(1.02rem, 1.25vw, 1.3rem);
line-height: 1.5;
}
.case-text p + p,
.case-text p + ol {
margin-top: 1em;
}
.case-text.lead p:first-child {
font-size: clamp(1.35rem, 2.1vw, 2.2rem);
font-weight: 500;
line-height: 1.16;
letter-spacing: -.025em;
}
.case-list {
border-top: 1px solid var(--line);
counter-reset: step;
}
.case-list li {
display: grid;
grid-template-columns: 3.2em 1fr;
padding: 12px 0;
border-bottom: 1px solid var(--line);
counter-increment: step;
}
.case-list li::before {
content: counter(step, decimal-leading-zero);
color: var(--signal);
font-size: .8em;
padding-top: .2em;
}
.case-label.quote-mark {
padding-top: .25em;
font-size: clamp(4rem, 7vw, 7rem);
}
.case-quote {
max-width: 22ch;
font-size: clamp(2rem, 4.4vw, 5.2rem);
font-weight: 500;
line-height: 1;
letter-spacing: -.035em;
}
.case-quote.long {
max-width: 38ch;
font-size: clamp(1.35rem, 2.1vw, 2.2rem);
line-height: 1.2;
letter-spacing: -.025em;
}
.case-quote cite {
display: block;
margin-top: 22px;
font-size: 13px;
font-style: normal;
font-weight: 400;
letter-spacing: 0;
line-height: 1.4;
color: #666;
}
.case-team {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 22px 32px;
max-width: 900px;
}
.case-team dt {
font-size: 12px;
color: #666;
}
.case-team dd {
margin: 6px 0 0;
font-size: 16px;
line-height: 1.35;
}

/* ---------- кадры ----------
   Исходники 1200px по ширине и разной высоты: идут столбцом без обрезки,
   вертикальные встают в правую колонку текста. */
.case-media {
padding-block: clamp(14px, 1.8vw, 28px);
}
.case-fig + .case-fig {
margin-top: 4px;
}
.case-fig figure {
margin: 0;
}
.case-fig img,
.case-fig video {
display: block;
width: 100%;
height: auto;
background: #e6e5e1;
}
.case-fig.tall,
.case-fig.small {
width: calc(62.5% - 2.625vw);
margin-left: auto;
}
.case-fig.pair {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 4px;
}
.case-fig figcaption {
padding: 10px 0 14px;
font-size: 13px;
color: #666;
}

/* ---------- цифры ---------- */
.case-facts {
padding-block: clamp(26px, 3.2vw, 52px);
}
.case-facts .metrics {
grid-template-columns: repeat(var(--cols, 3), 1fr);
border-top: 1px solid var(--line);
}
.case-facts .metric strong {
font-size: clamp(2.6rem, 5.2vw, 6rem);
white-space: nowrap;
}

/* ---------- следующий кейс ---------- */
.case-next {
display: grid;
place-items: center;
gap: 16px;
padding: clamp(60px, 9vw, 150px) 18px;
text-align: center;
text-decoration: none;
background: #080808;
color: #fff;
}
.case-next strong {
font-size: clamp(2.2rem, 6vw, 6.6rem);
font-weight: 600;
line-height: .95;
letter-spacing: -.035em;
text-transform: uppercase;
}
.case-next i {
display: inline-block;
font-style: normal;
color: var(--signal);
transition: transform .4s var(--ease);
}
.case-next:hover i {
transform: rotate(90deg) scale(1.2);
}

/* ---------- список кейсов ---------- */
.cases-head {
padding: clamp(120px, 14vw, 220px) 0 clamp(48px, 6vw, 96px);
}
.cases-head h1 {
margin-top: 36px;
}
.cases-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 3px;
padding-top: 3px;
background: #080808;
}
.cases-grid .project-card {
min-width: 0;
height: auto;
aspect-ratio: 1 / 1.04;
border-right: 0;
}
.cases-grid .project-card img {
width: 100%;
height: 100%;
}
.cases-grid .project-info h2 {
font-size: clamp(1.35rem, 2.2vw, 2.6rem);
letter-spacing: -.035em;
line-height: 1.05;
}

@media (max-width:900px) {
.case-row {
grid-template-columns: minmax(0, 1fr);
gap: 14px;
}
.case-label {
padding-top: 0;
}
.case-label:empty {
display: none;
}
.case-fig.tall,
.case-fig.small {
width: 100%;
}
.cases-grid {
grid-template-columns: 1fr 1fr;
}
/* сброс мобильной высоты карточек из шаблона (72vh) */
.cases-grid .project-card,
.cases-grid .project-card.wide {
height: auto;
}
}
@media (max-width:560px) {
.case-hero h1 {
font-size: clamp(2.2rem, 11vw, 3rem);
}
.case-hero {
min-height: 82svh;
}
.case-fig.pair {
grid-template-columns: 1fr;
}
.case-facts .metrics {
grid-template-columns: 1fr;
}
.cases-grid {
grid-template-columns: 1fr;
}
}
