/* pages.css — публичные страницы (таск 06): главная, портфолио, жанр, публикации, публикация, «Для фотографов», «Обо мне», «Контакты».
   Только то, чего нет в site.css: раскладка страниц и несколько небольших компонентов (шапка страницы, пагинация, подпись плитки
   публикации, пункты «Что разберём», блок записи на урок). Цвета, шрифты, отступы — только токены :root из site.css; литералов цвета нет.
   Брейкпоинты те же: 600 / 900 / 1200 px. Бюджет — не больше 20 КБ. */

/* ===== 1. Шапка страницы и тело ===== */
.page-head{padding-block:var(--sp-8) var(--sp-7)}
.page-head .eyebrow{margin-bottom:var(--sp-3)}
.page-head__lead{max-width:var(--w-prose);margin-top:var(--sp-5)}
.page-head__intro{max-width:var(--w-prose);margin-top:var(--sp-5)}
.page-head__intro > * + *{margin-top:var(--sp-3)}
.page-head--center{text-align:center}
.page-head--center .page-head__lead,.page-head--center .page-head__intro{margin-inline:auto}
.page-body{padding-top:0}
.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-3) var(--sp-6);margin-bottom:var(--sp-7)}
.photo-notice{max-width:var(--w-prose);margin-top:var(--sp-8);font-size:var(--fs-small);line-height:1.6;color:var(--cocoa)}
.photo-notice p + p{margin-top:var(--sp-2)}
.photo-notice a{color:inherit}
.pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2) var(--sp-6);padding-block:var(--sp-8) 0}
.pager__next{margin-left:auto}
/* Одна работа или одно фото: не маленькая плитка в углу, а кадр по центру крупнее обычного ряда */
.gallery--single{--row-h:clamp(280px,110vw,640px);justify-content:center}
.gallery--single::after{content:none}
.gallery--single .gallery__item{flex:0 1 calc(var(--ar,1) * var(--row-h))}
/* Последний блок страницы: воздух над подвалом уже даёт его собственный отступ (--section-y), второй не нужен */
.site-main > .section:last-child{padding-bottom:0}
.page-photographers .site-footer{margin-top:0} /* последний блок «Для фотографов» — на linen, как подвал: без полосы между ними */
.page-photographers .site-main > .signup:last-child{padding-bottom:var(--section-y)}

/* ===== 2. Главная ===== */
.hero{padding-block:var(--sp-8) var(--sp-9)}
.hero__title{font-size:var(--fs-display);line-height:var(--lh-tight);letter-spacing:var(--track-head)}
.hero__role{margin-top:var(--sp-4)}
.hero__lead{max-width:var(--w-prose);margin-top:var(--sp-3)}
.hero__row{margin-top:var(--sp-7);list-style:none}
.hero__row > li{min-width:0}
@media (min-width:600px){.hero__row{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4)}}
@media (min-width:900px){.hero__row{gap:var(--sp-5)}}
.outlets__more{margin-top:var(--sp-5)}
.invite{display:grid;gap:var(--sp-7);align-items:center}
.invite__text > * + *{margin-top:var(--sp-4)}
.invite__text .lead{max-width:var(--w-prose)}
.invite__media img{width:100%;border-radius:var(--r-photo)}
@media (min-width:900px){.invite--media{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--sp-9)}}
.about-short{display:grid;gap:var(--sp-7)}
.about-short__portrait img{width:100%;border-radius:var(--r-photo)}
.about-short__text > * + *{margin-top:var(--sp-4)}
.about-short__more{margin-top:var(--sp-5)}
@media (min-width:900px){
  .about-short{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-9);align-items:start}
  .about-short--portrait{grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr)}
}
.contact-band{text-align:center}
.contact-band h2{margin-bottom:var(--sp-6)}

/* «Коротко»: определение от модуля меток над списком */
.facts__lead{margin-bottom:var(--sp-5)} /* вид — .lead (site.css) */

/* ===== 3. Публикации: простая галерея =====
   Кадры — партиал gallery (ряды одной высоты, как в жанре; вид — site.css). Издание, заголовок и дата — в просмотре.
   Ниже галереи — строки публикаций без фото: издание — .eyebrow, дата и метка языка — .pub-card__meta (site.css). */
.pub-rows{margin:var(--sp-6) 0 0;padding:0;list-style:none;border-top:var(--hairline) solid var(--sand)}
.pub-row__body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--sp-1) var(--sp-5);padding:var(--sp-4) 0;border-bottom:var(--hairline) solid var(--sand);color:var(--ink);text-decoration:none}
.pub-row__body > *{grid-column:1}
.pub-row__title{font:500 var(--fs-h3)/var(--lh-tight) var(--font-display)}
.pub-row__icon{grid-column:2;grid-row:1 / span 3;color:var(--clay);transition:transform var(--t-base) var(--ease-out)}
a.pub-row__body:hover .pub-row__icon{transform:translateX(var(--sp-1))}
a.pub-row__body:hover .pub-row__title{color:var(--clay-deep)}
.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--sp-2);margin-top:var(--sp-7)}
.pagination__link{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);min-height:var(--tap);padding-inline:var(--sp-2);border:var(--hairline) solid transparent;border-radius:var(--r-pill);color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums;transition:border-color var(--t-fast),color var(--t-fast)}
a.pagination__link:hover{border-color:var(--clay);color:var(--clay)}
.pagination__link.is-current{background:var(--clay);border-color:var(--clay);color:var(--paper)}
.pagination__gap{display:inline-flex;align-items:center;justify-content:center;min-width:var(--tap);color:var(--cocoa)}

/* ===== 4. Страница публикации ===== */
.pub-page .page-head{padding-bottom:var(--sp-7)}
.pub-page__meta{margin-top:var(--sp-4)} /* вид — .pub-card__meta (site.css) */
.pub-page__text{margin-top:var(--sp-5)}
.pub-page__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-6);margin-top:var(--sp-6)}

/* ===== 5. «Для фотографов» ===== */
.lesson-hero{display:grid;gap:var(--sp-7);padding-block:var(--sp-8) var(--sp-9)}
.lesson-hero__text > * + *{margin-top:var(--sp-5)}
.lesson-hero__text h1{margin-top:var(--sp-3)}
.lesson-hero__text .lead{max-width:var(--w-prose)}
.lesson-hero__media img{width:100%;border-radius:var(--r-photo)}
@media (min-width:900px){.lesson-hero--media{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--sp-9);align-items:center}}
.lesson-facts{max-width:var(--w-prose)}
.points{display:grid;gap:0 var(--sp-8);margin:var(--sp-6) 0 0;padding:0;list-style:none;counter-reset:point;border-top:var(--hairline) solid var(--sand)}
.points__item{display:grid;grid-template-columns:var(--sp-8) minmax(0,1fr);align-items:baseline;gap:var(--sp-3);padding:var(--sp-4) 0;border-bottom:var(--hairline) solid var(--sand);counter-increment:point}
.points__item::before{content:counter(point,decimal-leading-zero);font:400 var(--fs-h3)/1 var(--font-display);color:var(--clay);font-variant-numeric:lining-nums}
@media (min-width:900px){.points{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Порядок на телефоне: заголовок → форма → кнопки мессенджеров (запасной путь); на широком экране форма справа, кнопки под заголовком */
.signup__grid{display:grid;gap:var(--sp-7);grid-template-areas:"intro" "form" "messengers"}
.signup__intro{grid-area:intro}
.signup__form{grid-area:form;padding:var(--sp-6);background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow-1)}
.signup__messengers{grid-area:messengers}
.signup__intro > * + *{margin-top:var(--sp-5)}
.signup__intro .lead{max-width:var(--w-prose)}
.signup__messengers-title{margin-bottom:var(--sp-3);font-weight:500}
.signup__grid:not(.signup__grid--form) .signup__messengers{max-width:var(--w-prose)}
.signup__form .form__status{margin-bottom:var(--sp-5)}
@media (min-width:900px){
  .signup__grid--form{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto 1fr;gap:var(--sp-6) var(--sp-9);align-items:start;grid-template-areas:"intro form" "messengers form"}
  .signup__form{padding:var(--sp-7)}
}

/* ===== 6. «Обо мне» и «Контакты» ===== */
.about{padding-top:0}
.about__grid{display:grid;gap:var(--sp-7)}
.about__portrait img{width:100%;border-radius:var(--r-photo)}
.about__caption{margin-top:var(--sp-3);font-size:var(--fs-small);line-height:1.5;color:var(--cocoa)}
.about__definition{max-width:var(--w-prose)}
.about__story{margin-top:var(--sp-5)}
.about__facts{max-width:var(--w-prose);margin-top:var(--sp-7)}
.about__definition + .about__facts{margin-top:var(--sp-6)}
.about__achievements{max-width:56rem;margin-top:var(--sp-7)}
@media (min-width:900px){.about__grid--portrait{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--sp-9);align-items:start}}
.contacts-head__intro{max-width:var(--w-prose)}
.contacts-head__intro > * + *{margin-top:var(--sp-3)}
.contacts-buttons{padding-top:0}
.contacts-buttons .contact-block{max-width:56rem}
.contacts-details .facts{max-width:var(--w-prose)}
/* номер и почта на тач-экране: зона касания не меньше --tap (ссылка в строке списка — сама по себе ниже) */
@media (pointer:coarse){.contacts-details a{display:inline-flex;align-items:center;min-height:var(--tap)}}
