/* Общая сетка и ритм приглашения. Брендбук: типографика 15-18, палитра 22, сетка 34. */
:root{
 --page-gutter:clamp(64px,8.333333vw,160px);
 --content-width:min(1280px,calc(100vw - 2 * var(--page-gutter)));
 --page-edge:calc((100vw - var(--content-width)) / 2);
 --column-gap:clamp(32px,4.166667vw,64px);
 --section-space:clamp(72px,6.666667vw,96px);
 --body-size:clamp(22px,1.666667vw,25px);
 --body-leading:1.48;
 --paragraph-gap:40px;
}
.page-shell,.author-layout{width:var(--content-width);max-width:none}
.author-layout{gap:var(--column-gap);padding-block:64px}
.author-copy{font-size:var(--body-size);line-height:var(--body-leading);max-width:560px}
.author-rule{margin-block:32px}

/* Основные абзацы: один шрифт и один размер во всех частях рассказа. */
.story-program .program-lead,.story-program .program-meaning,
.connection .quote-copy,.connection .body-copy,
.conversation .conversation-copy,.conversation .conversation-note{
 font-family:Myriad,Arial,sans-serif;font-size:var(--body-size);
 line-height:var(--body-leading);letter-spacing:0;font-weight:400;
}
.program.story-program{padding-top:var(--section-space)}
.story-program .program-lead,.story-program .program-meaning{width:calc((100% - var(--column-gap)) * 2 / 3)}
.story-program .program-lead{margin-left:0}
.story-program .program-meaning{margin-left:auto}
.story-program .program-gallery{margin-block:48px}

/* Портрет и аудитория могут выходить за текстовую сетку; слова остаются на ней. */
.section.connection{
 width:100%;margin-inline:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:var(--column-gap);padding:var(--section-space) 0 0;
}
.story-program+.connection{padding-top:var(--section-space)}
.connection-portrait{
 width:calc(100% + var(--page-edge));margin-left:calc(-1 * var(--page-edge));
 height:clamp(580px,54vw,820px);
}
.connection-text{max-width:none;padding-top:64px;padding-bottom:64px}
.connection .body-copy{margin-top:var(--paragraph-gap)}
.connection .freedom-phrase{font-size:1em;text-decoration-thickness:1px}

.section.conversation{
 width:100%;margin-inline:0;padding:var(--section-space) 0;
 min-height:calc((var(--content-width) * .58 + var(--page-edge)) * .75 + var(--section-space) * 2 + 32px);
}
.conversation-text{width:48%;max-width:600px}
.conversation-audience{
 right:calc(-1 * var(--page-edge));top:calc(var(--section-space) + 32px);
 width:calc(58% + var(--page-edge));
}
.conversation .conversation-phrase{
 font-family:Myriad,Arial,sans-serif;font-weight:400;
 font-size:clamp(42px,4.166667vw,64px);line-height:1.12;letter-spacing:-.025em;
 max-width:var(--content-width);margin-block:32px;
}
.conversation .conversation-note{margin-top:var(--paragraph-gap)}

/* Даты сохраняют крупный фирменный акцент и собираются на той же сетке. */
.section.schedule{width:100%;margin-inline:0;padding:var(--section-space) 0}
.schedule .schedule-intro{width:42%;font-size:clamp(26px,2.222222vw,34px);line-height:1.35}
.schedule .date-list{column-gap:var(--column-gap);row-gap:48px;margin-top:32px}
.schedule .date-days{font-size:clamp(36px,3.333333vw,52px)}
.schedule .date-month{font-size:clamp(26px,2.222222vw,34px)}
.schedule .year{font-size:clamp(21px,1.666667vw,25px)}
.schedule .date-featured .date-days{font-size:clamp(160px,16.666667vw,256px)}
.schedule .date-featured .date-month{font-size:clamp(64px,6.666667vw,102px)}
.schedule .date-featured .year{font-size:clamp(32px,3.333333vw,48px)}
.schedule .date-featured .arrow{width:clamp(56px,5.555556vw,80px);height:clamp(56px,5.555556vw,80px)}

/* Утверждённая личная подпись - единственное намеренное исключение с засечками. */
.closing{width:100%;margin-inline:0;padding:var(--section-space) 0 calc(var(--section-space) + 32px)}
.closing .closing-line{font-size:clamp(54px,5.555556vw,84px);line-height:1.12}
.closing .signature{font-size:clamp(34px,3.333333vw,48px);margin-top:48px}
.closing .contact-link{font-size:var(--body-size);margin-top:32px}
.social-footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 112px;gap:var(--column-gap);padding-block:48px}
.footer-logo{width:260px}
.social-footer h2{min-height:60px}
.footer-mascot{width:104px}

@media(max-width:899px){
 :root{
  --page-gutter:clamp(24px,6.25vw,56px);
  --column-gap:32px;--section-space:64px;--body-size:21px;--paragraph-gap:32px;
 }
 .author-layout{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:32px}
 .photo-target{width:min(80%,280px);justify-self:center}
 .story-program .program-lead,.story-program .program-meaning{width:100%;margin-left:0}
 .section.connection{grid-template-columns:1fr;gap:0;padding-block:64px 0}
 .connection-portrait{width:100%;margin-left:0;height:clamp(360px,78vw,620px)}
 .connection-text{padding:0 0 32px}
 .section.conversation{min-height:0;padding-block:64px 0}
 .conversation-text{width:100%;max-width:none}
 .conversation .conversation-phrase{font-size:clamp(34px,6vw,48px);max-width:100%}
 .conversation-audience{position:relative;top:auto;right:auto;width:100%;margin-top:24px}
 .schedule .schedule-intro{width:100%;max-width:560px;font-size:26px}
 .schedule .date-list{column-gap:32px;row-gap:32px}
 .schedule .date-days{font-size:36px}
 .schedule .date-month{font-size:26px}
 .schedule .date-featured .date-days{font-size:clamp(82px,20vw,170px)}
 .schedule .date-featured .date-month{font-size:clamp(44px,9vw,70px)}
 .schedule .date-featured .year{font-size:30px}
 .schedule .date-featured .arrow{width:clamp(35px,7vw,60px);height:auto}
 .closing{padding-block:64px 96px}
 .closing .closing-line{font-size:clamp(38px,6.5vw,60px)}
 .closing .signature{font-size:34px;margin-top:40px}
 .social-footer{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) 88px;gap:28px}
 .footer-logo{width:240px}
 .social-footer h2{min-height:56px}
 .footer-mascot{width:88px}
}
@media(max-width:699px){
 :root{--body-size:20px;--section-space:56px;--paragraph-gap:28px}
 .social-footer{grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:32px 24px;padding-block:36px}
 .social-footer h2{min-height:0}
 .footer-mascot{width:84px}
}

@media(max-width:380px){
 .schedule .date-list{column-gap:20px}
 .schedule .date-days{font-size:31px}
 .schedule .date-month{font-size:24px}
 .schedule .date-featured .year{font-size:25px}
 .schedule .date-featured .arrow{width:35px;height:35px}
}
