/* Картки сторінок «Що робимо» (.cards) у стилі «Сцени»: тонка рамка, номер, кругла стрілка,
   заголовок унизу; при наведенні картка заливається кораловим знизу. Тексти — ті самі. Без JS. */
main .cards{counter-reset:svc;gap:18px}
main .cards article{counter-increment:svc;position:relative;min-height:320px;padding:28px;border:1px solid #20221f22!important;border-radius:0;box-shadow:none;background:transparent;display:flex;flex-direction:column;overflow:hidden;color:#20221f;transition:color .45s,border-color .45s}
main .cards article::before{content:'';position:absolute;inset:0;background:#ef8354;transform:translateY(101%);transition:transform .6s cubic-bezier(.77,0,.18,1)}
main .cards article::after{content:counter(svc,decimal-leading-zero);position:relative;order:-1;font-size:13px;color:#ef8354;transition:color .45s}
main .cards article>*{position:relative}
main .cards article:hover{border-color:#ef8354}
main .cards article:hover::before{transform:none}
main .cards article:hover::after{color:#20221f}
main .cards .card-mark{position:absolute;right:24px;top:22px;width:46px;height:46px;border-radius:50%;border:1px solid #20221f33;display:grid;place-items:center;font-size:16px;color:#20221f;transition:background .4s,border-color .4s,color .4s}
main .cards article:hover .card-mark{background:#20221f;border-color:#20221f;color:#f3f0ea}
main .cards h3{margin:auto 0 0;padding-top:60px;font-size:clamp(23px,2.1vw,32px);line-height:1.05;letter-spacing:-.03em;font-weight:600;color:#20221f}
main .cards p{margin:12px 0 0;font-size:14px;line-height:1.55;color:#55524c;transition:color .45s}
main .cards article:hover p{color:#20221fcc}
@media(max-width:900px){main .cards article{min-height:220px;padding:22px}main .cards h3{padding-top:40px}}
/* заголовки розділів сторінок «Що робимо» — як у «Сцені»: підпис із кружечком, великий графітовий заголовок,
   друга частина (span.soft) — теплим сірим. Темні блоки (.continuity, .closing) не чіпаємо. */
main .imprint{font:500 11px/1.4 Onest,system-ui,sans-serif!important;letter-spacing:.22em!important;text-transform:uppercase;color:#6b6862!important;text-shadow:none!important;display:flex!important;align-items:center;gap:12px;margin:0 0 6px}
main .imprint::before{content:'';flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:#ef8354}
main section:not(.continuity):not(.closing):not(.bd-band):not(.ft-cta):not(.ml-lit):not(.redesign-hero):not(.ps-proc) h2:not(.sr-only){font-size:clamp(40px,4.8vw,78px)!important;line-height:1!important;font-weight:600!important;letter-spacing:-.04em!important;color:#20221f}
main section:not(.continuity):not(.closing):not(.bd-band):not(.ft-cta):not(.ml-lit) h2 .soft{color:#6b6862}
/* формати «До 5 / До 10 сторінок» (.format-grid) — так само, як картки: рамка, номер, кругла стрілка,
   коралова заливка знизу при наведенні; підпис, заголовок, текст і посилання — ті самі й у тому ж порядку */
main .format-grid{counter-reset:fmt;gap:18px}
main .format-grid article{counter-increment:fmt;position:relative;display:flex;flex-direction:column;min-height:340px;padding:28px;border-radius:0;border:1px solid #20221f22!important;background:transparent!important;color:#20221f;box-shadow:inset 0 0 0 0 #ef8354;transition:box-shadow .6s cubic-bezier(.77,0,.18,1),border-color .45s}
main .format-grid article::before{content:counter(fmt,decimal-leading-zero);font-size:13px;color:#ef8354;margin-bottom:auto;transition:color .45s}
main .format-grid article::after{content:'↗';position:absolute;right:24px;top:22px;width:46px;height:46px;border-radius:50%;border:1px solid #20221f33;display:grid;place-items:center;font-size:16px;transition:background .4s,border-color .4s,color .4s}
main .format-grid article:hover{box-shadow:inset 0 -700px 0 0 #ef8354;border-color:#ef8354!important}
main .format-grid article:hover::before{color:#20221f}
main .format-grid article:hover::after{background:#20221f;border-color:#20221f;color:#f3f0ea}
main .format-grid .eyebrow{margin-top:60px;font-size:11px;letter-spacing:.2em;color:#6b6862}
main .format-grid h3{margin:14px 0 0;font-size:clamp(26px,2.4vw,38px);line-height:1.05;letter-spacing:-.035em;font-weight:600;color:#20221f}
main .format-grid p{margin:12px 0 0;font-size:14px;line-height:1.6;color:#55524c}
main .format-grid article:hover :is(p,.eyebrow){color:#20221fcc}
main .format-grid .text-link{margin-top:22px;align-self:flex-start;color:#20221f;border-color:#20221f55}
/* кольори тексту сторінок «Що робимо» — як у «Сцені»: графіт і теплий сірий (замість синюватого) */
:root{--ink:#20221f;--muted:#6b6862}
body{color:#20221f}
main :is(.faq,.section,.portfolio-section,.update-story,.subscription-story,.example) :is(h3,summary){color:#20221f}
main :is(.faq details p,.section p:not(.imprint):not(.eyebrow),.portfolio-caption p,.portfolio-note p,.update-story p,.subscription-story p,.example-note,.small-note){color:#55524c}
main .faq summary>span{border-color:#20221f33;color:#20221f}
main .bd-band .bd-cols p,main .bd-band .bd-cols .small-note{color:#20221f}
/* тарифи «Сайту за підпискою» (.subscription-plans) — стиль карток «Сцени»: рамка, номер, кругла стрілка,
   коралова заливка знизу при наведенні; підпис, назва, опис, ціна, оплата й кнопка — ті самі й у тому ж порядку */
main .subscription-plans{counter-reset:pl;gap:18px}
main .subscription-plans article{counter-increment:pl;position:relative;padding:28px;border-radius:0!important;border:1px solid #20221f22!important;background:transparent!important;color:#20221f;box-shadow:inset 0 0 0 0 #ef8354;transition:box-shadow .6s cubic-bezier(.77,0,.18,1),border-color .45s}
main .subscription-plans article::before{content:counter(pl,decimal-leading-zero);font-size:13px;color:#ef8354;margin-bottom:44px;transition:color .45s}
main .subscription-plans article::after{content:'↗';position:absolute;right:24px;top:22px;width:46px;height:46px;border-radius:50%;border:1px solid #20221f33;display:grid;place-items:center;font-size:16px;transition:background .4s,border-color .4s,color .4s}
main .subscription-plans article:hover{box-shadow:inset 0 -900px 0 0 #ef8354;border-color:#ef8354!important}
main .subscription-plans article:hover::before{color:#20221f}
main .subscription-plans article:hover::after{background:#20221f;border-color:#20221f;color:#f3f0ea}
main .subscription-plans .eyebrow{font-size:11px;letter-spacing:.2em;color:#6b6862}
main .subscription-plans h3{font-size:clamp(26px,2.4vw,38px);line-height:1.05;letter-spacing:-.035em;font-weight:600;color:#20221f;margin:14px 0 12px}
main .subscription-plans .plan-price{font-size:clamp(44px,4.4vw,68px);font-weight:600;letter-spacing:-.05em;color:#20221f}
main .subscription-plans .plan-price span{color:#6b6862;font-weight:500}
main .subscription-plans article:hover :is(p,.eyebrow,.plan-price span){color:#20221fcc}
main .subscription-plans .pill{display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding:18px 24px;border-radius:999px;background:#20221f;color:#f3f0ea;border:0;font:700 12px/1 Onest,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:background .3s}
main .subscription-plans .pill span{color:#ef8354}
main .subscription-plans .pill:hover{background:#000}
main .subscription-plans .plan-payment{border-color:#20221f22!important;color:#55524c}
