/* Калита: посадочные страницы под поисковые запросы. Поверх styles.css, главную не трогает. */
.pg-hero{position:relative; overflow:hidden; padding:clamp(40px,6vw,72px) 0 clamp(36px,5vw,64px)}
.pg-hero .hero-photo{position:absolute; inset:0; background:url("art/office-hero.jpg") center 30%/cover no-repeat}
.pg-hero .hero-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(100deg, rgba(245,247,250,.97) 0%, rgba(245,247,250,.92) 50%, rgba(245,247,250,.6) 100%)}
.pg-hero .wrap{position:relative}
.pg-hero h1{font-size:clamp(30px,4.2vw,50px); line-height:1.08; max-width:22ch}
.pg-hero .lead{max-width:56ch}
.pg-hero .hero-buttons{margin-top:28px; display:flex; flex-wrap:wrap; gap:12px}
.crumbs{font-size:14.5px; color:var(--ink-3); margin-bottom:18px}
.crumbs a{color:var(--ink-2); text-decoration:none}
.crumbs a:hover{color:var(--ink)}

.pg-body{padding:clamp(40px,6vw,72px) 0}
.pg-body .wrap{max-width:860px}
.pg-body h2{font-size:clamp(24px,3vw,34px); line-height:1.15; margin-top:clamp(36px,5vw,56px)}
.pg-body h2:first-child{margin-top:0}
.pg-body h3{font-size:19px; margin-top:26px}
.pg-body p{margin-top:14px; color:var(--ink-2); max-width:68ch}
.pg-body ul.pg-list, .pg-body ol.pg-list{margin-top:16px; display:flex; flex-direction:column; gap:10px; color:var(--ink-2); max-width:68ch}
.pg-body ul.pg-list li{position:relative; padding-left:24px}
.pg-body ul.pg-list li::before{content:""; position:absolute; left:2px; top:.65em; width:9px; height:9px; border-radius:50%; background:var(--accent)}
.pg-body ol.pg-list{counter-reset:n}
.pg-body ol.pg-list li{position:relative; padding-left:44px; counter-increment:n}
.pg-body ol.pg-list li::before{content:counter(n); position:absolute; left:0; top:-1px; width:30px; height:30px; border-radius:50%; background:var(--accent-soft); color:var(--accent-deep); font:600 15px/30px "Onest",sans-serif; text-align:center}
.pg-body li b{color:var(--ink)}
.pg-shot{margin-top:24px; padding:10px; max-width:640px}
.pg-shot img{border-radius:var(--r-img); width:100%}
.pg-shot figcaption{padding:10px 6px 4px; font-size:14.5px; color:var(--ink-3)}
figure.pg-shot{margin-left:0; margin-right:0}
.pg-cta{margin-top:28px; display:flex; flex-wrap:wrap; gap:12px}
.pg-note{font-size:15px; color:var(--ink-3)}
.pg-faq{padding:0 0 clamp(48px,6vw,80px)}
.pg-faq .wrap{max-width:860px}
.pg-faq h2{font-size:clamp(24px,3vw,34px)}
.pg-faq .faq-list{margin-top:24px}
.pg-more{padding:0 0 clamp(48px,6vw,80px)}
.pg-more .wrap{max-width:860px}
.pg-more h2{font-size:clamp(22px,2.6vw,28px)}
.pg-more-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:20px}
.pg-more-grid a{display:block; padding:18px 20px; text-decoration:none; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-card); box-shadow:var(--shadow-s); transition:box-shadow .2s ease, transform .2s ease}
.pg-more-grid a:hover{box-shadow:var(--shadow-m); transform:translateY(-2px)}
.pg-more-grid b{display:block; font-family:"Onest",sans-serif; font-weight:600; color:var(--ink)}
.pg-more-grid span{display:block; margin-top:4px; font-size:15px; color:var(--ink-2); line-height:1.45}
.pg-body .link{margin-top:14px}
@media (max-width:620px){
  .pg-hero .hero-buttons .btn, .pg-cta .btn{flex:1 1 100%}
  .pg-body ol.pg-list li{padding-left:40px}
}

.foot .foot-pages{margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); font-size:14.5px; line-height:1.9; color:rgba(255,255,255,.55)}
.foot .foot-pages a{display:inline; color:rgba(255,255,255,.72)}
.foot .foot-pages a:hover{color:#fff}

/* Раздел «Статьи» (/stati/): строка автора, блок действия, примеры переписки, промт, таблица, карточки оглавления */
.pg-hero nav.crumbs{display:block}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.st-meta{margin-top:16px; font-size:14.5px; color:var(--ink-3)}
.pg-body h3 + .pg-list{margin-top:10px}
.st-cta{margin-top:32px; max-width:720px; padding:20px 22px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 20px; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-card); box-shadow:var(--shadow-s)}
.st-cta b{display:block; font-family:"Onest",sans-serif; font-weight:600; font-size:18px; line-height:1.3; color:var(--ink)}
.pg-body .st-cta p{margin-top:4px; font-size:15px; color:var(--ink-2)}
.st-chat{margin:24px 0 0; padding:14px; max-width:560px; display:flex; flex-direction:column; gap:8px; background:#E4ECF4; border-radius:var(--r-card)}
.st-chat figcaption{font-size:14px; line-height:1.45; color:var(--ink-2); padding:2px 4px 6px}
.st-chat.is-bad figcaption{color:#A23A2E}
.pg-body .st-msg{margin:0; max-width:86%; padding:9px 13px 10px; border-radius:16px; font-size:15.5px; line-height:1.45; color:var(--ink); box-shadow:0 1px 2px rgba(14,23,38,.07)}
.st-msg .who{display:block; font-size:12px; font-weight:600; letter-spacing:.01em; color:var(--ink-3); margin-bottom:2px}
.st-in{align-self:flex-start; background:#fff; border-bottom-left-radius:6px}
.st-out{align-self:flex-end; background:#D9F2C8; border-bottom-right-radius:6px}
.st-prompt{margin:18px 0 0; max-width:68ch; padding:18px 20px; background:#fff; border:1px solid var(--line-2); border-left:3px solid var(--accent); border-radius:14px; font:400 15px/1.6 "Golos Text",system-ui,sans-serif; color:var(--ink); white-space:pre-wrap; overflow-wrap:anywhere}
.st-table-wrap{margin-top:18px; max-width:720px; overflow-x:auto; -webkit-overflow-scrolling:touch; background:#fff; border:1px solid var(--line-2); border-radius:14px}
.st-table{width:100%; min-width:520px; border-collapse:collapse; font-size:15px; line-height:1.45}
.st-table th, .st-table td{padding:11px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line-2)}
.st-table tr:last-child th, .st-table tr:last-child td{border-bottom:0}
.st-table thead th{font-family:"Onest",sans-serif; font-weight:600; color:var(--ink); background:var(--bg)}
.st-table tbody th{font-weight:600; color:var(--ink); width:30%}
.st-table td{color:var(--ink-2)}
.st-cards{margin-top:28px; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px}
.st-card{display:flex; flex-direction:column; gap:6px; padding:20px 22px; text-decoration:none; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-card); box-shadow:var(--shadow-s); transition:box-shadow .2s ease, transform .2s ease}
.st-card:hover{box-shadow:var(--shadow-m); transform:translateY(-2px)}
.st-card b{font-family:"Onest",sans-serif; font-weight:600; font-size:18px; line-height:1.3; color:var(--ink)}
.st-card span{font-size:15px; line-height:1.5; color:var(--ink-2)}
.st-card em{margin-top:auto; padding-top:6px; font-style:normal; font-size:13.5px; color:var(--accent-deep)}
@media (max-width:620px){
  .st-cta .btn{flex:1 1 100%}
  .st-chat{padding:12px}
}
