/* The Penza Post 2.0 — theme for AVE.cms 3.3. Built from the approved mockups (2026-11-09):
   Penza_Post_Homepage_Poll_Day.html, Penza_Post_All_Investigations.html, Penza_Post_All_Photo_Reports.html.
   No external fonts or libraries: Georgia for headlines, Arial for text. */

:root{
	--navy:#071f3d; --blue:#122e51; --ink:#111b2a; --red:#b51f2c; --line:#d4d4d4; --line-soft:#e1e1e1;
	--sub:#536474; --hover:#1d5a96; --pad:clamp(14px,1.8vw,40px);
	--serif:Georgia,"Times New Roman",serif; --sans:Arial,"Helvetica Neue",Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--blue);background:#fff;font-family:var(--sans)}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.muted{color:#526375;font-size:12px;line-height:1.3}
.sep{padding:0 7px;color:#8f9ca9}

/* light interactivity agreed with the editor: the photo grows a little, the headline turns a lighter blue,
   no autoplay, no animation noise */
.pp-card img,.image-ratio img,.lead img,.support-image img,.latest-image img,.gallery-hero img,.photo-frame img,.feature-big>img{transition:transform .25s ease}
.pp-card:hover img,.lead:hover img,.support:hover img,.latest-row:hover img,.gallery-hero:hover img,.investigation-card:hover img,.thumb-link:hover img,.inv-item:hover img,.photo-card:hover img,.feature-big:hover>img,.feature-side article:hover img,.aside-item:hover img,.related-card:hover img{transform:scale(1.03)}
a:hover h1,a:hover h2,a:hover h3,a:hover strong,.news-item:hover span{color:var(--hover)}
.lead:hover h1,.gallery-hero:hover h3,.feature-big:hover h2{color:#fff;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}

/* photo crop focus: vertical shots keep the upper part (faces) instead of the centre;
   editors can override per document (field «Фокус фото»: top / center / bottom) */
.image-ratio img,.support-image img,.latest-image img,.photo-frame img,.lead img,.gallery-hero img,.feature-big>img,.aside-item img,.related-card img{object-position:50% 30%}
.focus-top img,img.focus-top{object-position:50% 0 !important}
.focus-center img,img.focus-center{object-position:50% 50% !important}
.focus-bottom img,img.focus-bottom{object-position:50% 100% !important}

/* ---------- header ---------- */
.top{background:linear-gradient(105deg,#061d36 0%,#0b3055 100%);color:#fff;position:relative;z-index:20}
.mast{display:flex;align-items:center;gap:clamp(15px,2vw,36px);height:80px;padding:0 var(--pad)}
.brand{white-space:nowrap;font:700 clamp(25px,2.55vw,44px)/1 var(--serif);letter-spacing:-.7px}
.brand:hover{color:#fff}
.tagline{border-left:1px solid #627b93;padding-left:clamp(12px,1.6vw,28px);font-size:12px;line-height:1.2;color:#f1f5f9}
.util{display:flex;gap:clamp(11px,1.6vw,26px);align-items:center;margin-left:auto;font-size:13px;white-space:nowrap}
.curr{display:flex;gap:18px}
.weather{border-left:1px solid #6e8498;padding-left:20px}
.header-button{border:0;color:#fff;background:transparent;font-size:24px;line-height:1;padding:5px}
.quicknav{position:absolute;z-index:30;top:100%;right:var(--pad);width:min(310px,calc(100vw - 32px));padding:8px 14px;background:#fff;color:#102e52;border:1px solid #e0e0e0;box-shadow:0 16px 34px #001d3940;display:flex;flex-direction:column}
.quicknav[hidden]{display:none!important}
.quicknav a{padding:12px 8px;border-bottom:1px solid #e6e6e6;font-weight:700;font-size:14px}
.quicknav a:last-child{border:0}
.quicknav a:hover,.quicknav a.active{color:var(--red)}

main{width:100%;padding:8px var(--pad) 0}

/* ---------- home: hero ---------- */
.hero-grid{display:grid;grid-template-columns:minmax(0,1.54fr) minmax(0,1.06fr) minmax(285px,.91fr);gap:clamp(8px,.8vw,14px);align-items:stretch;margin-top:0}
.lead{position:relative;min-height:345px;overflow:hidden;background:#d8d8d8;color:#fff;display:block}
.lead img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.lead:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(0,13,26,.93))}
.lead-copy{position:absolute;z-index:1;left:5%;bottom:6%;right:5%}
.lead-copy h1{font:700 clamp(24px,2.15vw,39px)/1.06 var(--serif);margin:0 0 9px;letter-spacing:-.4px}
.lead-copy p{font-size:clamp(13px,.95vw,16px);line-height:1.35;margin:0 0 8px}
.lead-copy .muted{color:#e1e7ef}
.hero-support{min-width:0;display:grid;grid-template-rows:1fr 1fr;gap:8px}
.support{display:grid;grid-template-columns:47% 1fr;gap:10px;padding-bottom:8px;border-bottom:1px solid var(--line);min-width:0;align-items:start}
.support:last-child{padding-bottom:0;border-bottom:0}
.support-image{width:100%;aspect-ratio:11/9;overflow:hidden;background:#ececec;align-self:stretch;position:relative}
.support-image img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.support h2{font:700 clamp(17px,1.2vw,23px)/1.11 var(--serif);color:#081f3e;margin:5px 0 15px}
.daily{border-left:1px solid var(--line);padding-left:clamp(8px,.8vw,14px);min-width:0;display:flex;flex-direction:column;max-height:345px}
.daily-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:8px;gap:8px}
.daily-header h2{font:700 clamp(20px,1.5vw,27px) var(--serif);margin:0;color:var(--navy)}
.daily-header h2:before,.block-title:before{content:'';display:inline-block;width:4px;height:20px;background:var(--red);margin-right:10px;vertical-align:-2px}
.daily-header a{font-size:12px;white-space:nowrap}
.news-scroll{flex:1;min-height:0;overflow-y:auto;scrollbar-color:#a8a8a8 #f4f4f4;scrollbar-width:thin;scrollbar-gutter:stable}
.news-item{display:grid;grid-template-columns:44px 1fr;gap:10px;padding:9px 2px;border-bottom:1px solid var(--line-soft);align-items:start;font-size:13px;line-height:1.23;color:var(--ink)}
.news-item time{font-size:12px;color:var(--blue);padding-top:2px}
.news-item span{font-weight:500}
.news-item .day{display:block;font-size:10px;color:#7a8897}
.daily-all{border-top:1px solid var(--line);padding-top:10px;font-size:12px;font-weight:700}
.daily-all:hover{color:var(--hover)}
/* wide screens: the list takes the full height of the row, the row height comes from the lead and the two stories */
@media(min-width:991px){@supports (contain:size){.hero-grid>.daily{max-height:none;contain:size}}}

/* ---------- home: sections ---------- */
section{margin-top:12px}
.section-top{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:41px;margin-bottom:10px}
.section-top h2{font:700 clamp(23px,1.8vw,31px)/1.1 var(--serif);color:var(--blue);margin:0;padding:7px 0}
.section-top .description{font-size:13px;color:#3b5068;border-left:1px solid #a5b3c3;padding-left:18px}
.section-top a{margin-left:auto;white-space:nowrap;font-size:13px}
.section-top a:hover{color:var(--hover)}
/* Расследования: rows of 4 cards, scrolls down inside the block on desktop */
.investigation-scroll{max-height:640px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#a7a7a7 #f1f1f1;scrollbar-gutter:stable;padding-right:6px}
.investigation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 8px}
.investigation-card{display:block;min-width:0;border-right:1px solid var(--line);padding-right:8px}
.investigation-card:nth-child(4n){border-right-color:transparent}
.image-ratio{width:100%;aspect-ratio:16/9;overflow:hidden;background:#ececec}
.image-ratio img{width:100%;height:100%;display:block;object-fit:cover}
.investigation-card h3{font:700 clamp(17px,1.15vw,21px)/1.11 var(--serif);margin:7px 0 6px;color:#0d213e}
.investigation-card p{font-size:13px;line-height:1.27;margin:0 0 9px;color:#3b4653;min-height:37px}
.bottom-grid{display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:clamp(10px,1vw,18px);margin-top:12px}
.bottom-grid section{margin-top:0;min-width:0}
.bottom-grid section+section{border-left:1px solid var(--line);padding-left:clamp(10px,1vw,18px)}
.bottom-grid .section-top{margin-bottom:10px}
.bottom-grid .section-top h2{font-size:clamp(21px,1.62vw,29px)}
.bottom-grid .description{font-size:11px}
.latest-scroll,.photo-scroll{max-height:452px;min-height:432px;overflow:auto;scrollbar-color:#a7a7a7 #f1f1f1;scrollbar-width:thin;scrollbar-gutter:stable;padding-right:8px}
.latest-row{display:grid;grid-template-columns:28% 1fr;gap:14px;padding:7px 0;border-bottom:1px solid #dbdbdb;min-width:0}
.latest-row:first-child{padding-top:0}
.latest-image{aspect-ratio:16/9;width:100%;overflow:hidden;background:#ececec}
.latest-image img{width:100%;height:100%;object-fit:cover;display:block}
.latest-row h3{font:700 clamp(16px,1.1vw,21px)/1.15 var(--serif);margin:1px 0 11px;color:#0b1f3c}
.gallery-hero{position:relative;aspect-ratio:2.15/1;overflow:hidden;background:#e4e4e4;display:block;color:#fff}
.gallery-hero img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-hero:after{content:'';position:absolute;inset:47% 0 0;background:linear-gradient(transparent,rgba(1,13,24,.91))}
.gallery-hero .hero-title{position:absolute;z-index:1;bottom:15px;left:20px;right:20px}
.hero-title h3{font:700 clamp(24px,2vw,37px)/1.04 var(--serif);margin:6px 0}
.hero-title .muted{color:#edf4fa}
.gallery-small{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:13px}
.thumb-link{min-width:0;display:block}
.thumb-eyebrow{font-size:11px;color:#43596f;margin-top:6px}
.thumb-link h3{font:700 clamp(14px,1vw,19px)/1.14 var(--serif);margin:4px 0 9px}
.photo-meta{font-size:11px}

/* ---------- inner pages: lists ---------- */
.page{padding:0 0 30px;width:100%}
.breadcrumbs{font-size:12px;color:#667586;margin:2px 0 8px}
.breadcrumbs a{color:#3a5b7e}
.breadcrumbs a:hover{color:var(--hover)}
.breadcrumbs .bc-sep{padding:0 8px;color:#9aa6b2}
.title{font:700 clamp(33px,3.2vw,56px)/1.12 var(--serif);color:#102a4d;margin:0 0 11px}
.title:before{content:"";display:inline-block;width:6px;height:.76em;background:#c62836;margin-right:16px;transform:skewX(-9deg)}
.intro{font-size:15px;max-width:900px;line-height:1.5;color:#536273;margin:0 0 12px}
.filters{padding:14px 0;border-top:1px solid #dcdcdc;border-bottom:1px solid #dcdcdc;display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:26px}
.filters .label{font-size:12px;color:#6f7b88}
.pill{border:1px solid #d3d3d3;padding:9px 13px;cursor:pointer;background:#fff;color:#193151;border-radius:4px;font-size:13px;display:inline-block}
.pill.active,.pill:hover{background:#0a3158;color:#fff;border-color:#0a3158}
.filters .meta{font-size:12px;color:#697788;margin-left:auto}
.content-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(240px,1fr);gap:16px}
.inv-list{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.inv-item{border-bottom:1px solid #dfdfdf;padding:14px 0;display:grid;grid-template-columns:42% 1fr;gap:14px;min-width:0;align-items:start}
.photo-frame{aspect-ratio:16/9;overflow:hidden;background:#e3e3e3}
.photo-frame img{width:100%;height:100%;object-fit:cover;display:block}
.inv-item h2{font:700 clamp(17px,1.15vw,24px)/1.13 var(--serif);color:#102744;margin:5px 0 8px}
.inv-item p{font-size:13px;line-height:1.4;color:#4d5c6b;margin:0 0 12px}
.eyebrow{font-size:11px;letter-spacing:.035em;color:#ad2934;font-weight:700;text-transform:uppercase}
.time{font-size:12px;color:#6f7b88}
.aside{border-left:1px solid #e2e2e2;padding-left:14px;min-width:0}
.aside h3{font:700 22px var(--serif);color:#102849;margin:0 0 14px;border-bottom:1px solid #dcdcdc;padding-bottom:13px}
.aside-item{display:grid;grid-template-columns:104px 1fr;gap:11px;padding:13px 0;border-bottom:1px solid #e2e2e2}
.aside-item .photo-frame{width:104px}
.aside-item strong{font:700 16px/1.15 var(--serif)}
.aside-info{border-top:3px solid #0a3158;background:#f4f4f4;margin-top:23px;padding:18px}
.aside-info strong{font:700 21px var(--serif);color:#102849}
.aside-info p{font-size:13px;line-height:1.5;margin:8px 0 0;color:#3c5064}
.aside-info a{color:var(--hover);font-weight:700}
.photo-feature{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);gap:22px;margin-bottom:24px;align-items:start}
.feature-big{position:relative;aspect-ratio:16/9;background:#e5e5e5;overflow:hidden;display:block}
.feature-big>img{width:100%;height:100%;object-fit:cover;display:block}
.feature-big:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(2,15,32,.9))}
.feature-text{position:absolute;left:24px;bottom:24px;right:25px;color:#fff;z-index:1}
.feature-text h2{font:700 clamp(23px,2.4vw,41px)/1.04 var(--serif);margin:10px 0}
.feature-text .eyebrow{color:#fff}
.feature-text .time{color:#edf2f7}
.feature-side{display:grid;gap:18px}
.feature-side article{display:block;border-bottom:1px solid #e1e1e1;min-height:0;padding-bottom:10px}
.feature-side .photo-frame{width:100%;height:auto;margin-bottom:7px}
.feature-side h3{font:700 clamp(16px,1.05vw,22px)/1.13 var(--serif);margin:3px 0 9px}
.photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 22px}
.photo-card{border-bottom:1px solid #e1e1e1;padding-bottom:14px;min-width:0}
.photo-card h3{font:700 clamp(17px,1.3vw,24px)/1.16 var(--serif);margin:10px 0}
.photo-card .eyebrow{margin-top:11px}
.section-heading{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d3d3d3;margin:10px 0 17px;padding-top:20px}
.section-heading h2{font:700 28px var(--serif);color:#112d4d;margin:0}
.section-heading span{color:#687786;font-size:13px}
/* AVE pagination output */
.pager,.pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;padding:26px 0;list-style:none;margin:0}
.pager a,.pager span,.pagination a,.pagination span{border:1px solid #d3d3d3;min-width:38px;padding:9px 12px;text-align:center;border-radius:4px;font-size:13px;color:#193151;background:#fff}
.pager a:hover,.pagination a:hover,.pager .active,.pagination .active,.pagination .current{background:#0a3158;color:#fff;border-color:#0a3158}
/* plain news list (Все новости, Все материалы, old sections) */
.news-list{display:grid;gap:0}
.news-row{display:grid;grid-template-columns:240px 1fr;gap:18px;padding:16px 0;border-bottom:1px solid #dfdfdf;min-width:0}
.news-row h2{font:700 clamp(18px,1.3vw,24px)/1.15 var(--serif);color:#102744;margin:4px 0 8px}
.news-row p{font-size:14px;line-height:1.45;color:#4d5c6b;margin:0 0 10px}
.news-row.no-photo{grid-template-columns:1fr}
/* client 09.11 «белого минимум»: in list rows the photo takes the full height of the row (never less than 16:9),
   the date sits at the bottom of the text column */
.news-row>.photo-frame,.inv-item>.photo-frame,.aside-item>.photo-frame{align-self:stretch;position:relative}
/* the column gives the width; without it a stretched 16:9 box widens itself over the text */
.news-row>.photo-frame,.inv-item>.photo-frame{width:100%}
.news-row>.photo-frame img,.inv-item>.photo-frame img,.aside-item>.photo-frame img{position:absolute;inset:0}
.news-row>div:last-child,.inv-item>div:last-child,.aside-item>div:last-child{display:flex;flex-direction:column;min-width:0}
.news-row>div:last-child>.time,.inv-item>div:last-child>.time{margin-top:auto}
.aside-item>div:last-child>.time{margin-top:auto;padding-top:8px}
/* list pages (rubrics, materials, digest, partners, search): two columns of cards like «Расследования» — photo + headline,
   no wide empty text column; one column on phones */
.news-list:has(>.news-row){grid-template-columns:1fr 1fr;column-gap:14px}
.news-list>.news-row{grid-template-columns:42% 1fr;gap:14px;padding:14px 0}
.news-list>.news-row h2{font:700 clamp(17px,1.15vw,24px)/1.13 var(--serif);margin:5px 0 8px}
@media(max-width:650px){
	.news-list:has(>.news-row),.inv-list{grid-template-columns:1fr}
	.news-list>.news-row{grid-template-columns:120px 1fr;gap:12px}
	.news-list>.news-row h2{font-size:17px}
	.investigations .section-top h2{font-size:19px}
}
/* narrow phones: investigation card = photo on the left over both rows, headline and date on the right */
@media(max-width:420px){
	.investigation-grid>.investigation-card>.image-ratio{grid-row:1/3;align-self:stretch;position:relative}
	.investigation-grid>.investigation-card>.image-ratio img{position:absolute;inset:0}
	.investigation-grid>.investigation-card>h3,.investigation-grid>.investigation-card>.muted{grid-column:2}
	.investigation-grid>.investigation-card>.muted{align-self:end;margin-top:0}
}
.investigation-card{display:flex;flex-direction:column}
.investigation-card>.muted{margin-top:auto}
.latest-row>.latest-image{align-self:stretch;position:relative}
.latest-row>.latest-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.day-head{font:700 15px var(--sans);color:#6b7a8a;text-transform:uppercase;letter-spacing:.04em;margin:22px 0 4px;padding-bottom:6px;border-bottom:2px solid var(--blue)}

/* ---------- article page ---------- */
.article-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,24vw,420px);gap:clamp(14px,1.4vw,24px);align-items:start}
.article{min-width:0}
.article h1{font:700 clamp(28px,2.7vw,46px)/1.1 var(--serif);color:#0b1f3c;margin:6px 0 14px;letter-spacing:-.3px}
.article-meta{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:13px;color:#5d6b7a;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:18px}
.article-meta .eyebrow{font-size:12px}
.article-lead-photo{margin:0 0 20px}
.article-lead-photo .photo-frame{aspect-ratio:3/2}
.article-lead-photo figcaption{font-size:12px;color:#6b7988;margin-top:7px;line-height:1.4}
.article-text{font:400 clamp(18px,calc(10.5px + .6vw),22px)/1.62 var(--serif);color:#16202e}
.article-text p{margin:0 0 1em}
.article-text a{color:var(--hover);text-decoration:underline;text-underline-offset:2px}
.article-text h2,.article-text h3{font-family:var(--serif);color:#0b1f3c;line-height:1.2;margin:1.4em 0 .6em}
.article-text blockquote{margin:1.2em 0;padding:4px 0 4px 20px;border-left:4px solid var(--red);color:#2b3a4c;font-style:italic}
.article-text img{height:auto;display:block;margin:1em auto}
.article-text table{border-collapse:collapse;width:100%;font:14px/1.4 var(--sans)}
.article-text td,.article-text th{border:1px solid var(--line);padding:6px 8px}
.article-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0}
.article-gallery a{display:block;aspect-ratio:4/3;overflow:hidden;background:#ececec}
.article-gallery img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;transition:transform .25s ease}
.article-gallery a:hover img{transform:scale(1.03)}
.article-share{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin:24px 0}
.article-share .label{font-size:13px;color:#5d6b7a}
.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.article-poll{margin:26px 0}
.related{margin-top:10px}
.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.related-card{display:block;min-width:0}
.related-card h3{font:700 17px/1.18 var(--serif);color:#0d213e;margin:9px 0 6px}
.article-side{position:sticky;top:12px;min-width:0}
.article-side .daily{border-left:0;padding-left:0;max-height:none}
.article-side .news-scroll{max-height:560px}
.block-title{font:700 22px var(--serif);color:var(--navy);margin:0 0 10px}

/* static pages (Редакция, О нас, Соглашение) */
.static-page{max-width:900px}
.static-page .article-text{font-size:17px}

/* ---------- footer ---------- */
.footer{background:linear-gradient(115deg,#061d37 0%,#0a2e53 100%);color:#fff;margin-top:10px;padding:20px var(--pad) 22px;display:grid;grid-template-columns:minmax(155px,1.1fr) minmax(185px,1.35fr) minmax(170px,1.15fr) minmax(114px,.8fr) minmax(290px,1.55fr);gap:clamp(12px,1.35vw,23px);align-items:start}
.footcol{border-right:1px solid #5f7991;padding-right:clamp(9px,1vw,15px);min-width:0}
.footcol:last-of-type{border:0}
.footcol h3{margin:0 0 10px;font:700 17px/1.15 var(--serif)}
.footcol .footlogo{font:700 clamp(23px,1.8vw,33px)/1 var(--serif);white-space:nowrap}
.footcol p,.footcol a{font-size:11px;line-height:1.37;margin:3px 0;color:#e4ebf4}
.footcol a{display:block}
.footcol a:hover{text-decoration:underline}
.footcol small{font-size:10px;color:#b3c1cd}
.age{display:inline-block;border:1px solid #a0afbc;border-radius:3px;padding:4px 7px;font-weight:700;margin-top:14px}
.counters{padding:10px var(--pad);display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:11px;color:#73808b}

/* ---------- poll (footer card and under the article) ---------- */
.poll-card{align-self:stretch;min-width:0;padding:14px 16px 11px;background:linear-gradient(145deg,#1c466c,#12385e);border:1px solid #7293b1;border-radius:9px;box-shadow:inset 0 1px 0 #ffffff2b;color:#fff}
.poll-heading{display:flex;align-items:center;gap:8px;border-bottom:1px solid #90a7c0;padding-bottom:7px;margin-bottom:10px}
.poll-mark{width:4px;height:18px;background:#e84550;transform:skew(-14deg);flex:none}
.poll-heading h3{font:800 16px/1.15 var(--sans);letter-spacing:.3px;margin:0;color:#fff}
.poll-question{font:700 13px/1.34 var(--serif);margin:0 0 10px;color:#fff}
.poll-options{margin:0;padding:0;border:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 6px}
.poll-options label{display:flex;align-items:center;gap:6px;cursor:pointer;font:500 11.5px/1.18 var(--sans);color:#fff}
.poll-options input{width:14px;height:14px;accent-color:#e8424f;cursor:pointer;flex:none;margin:0}
.poll-actions{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.poll-actions button,.poll-actions a,.poll-back{padding:8px 12px;border-radius:4px;font-weight:700;font-size:12px;line-height:1.15}
.poll-vote{background:#c82431;border:1px solid #e83948;color:#fff}
.poll-vote:hover{background:#a91a28}
.poll-results-button,.poll-back{background:#183653;border:1px solid #e1e1e1;color:#fff}
.poll-results-button:hover,.poll-back:hover{background:#275680}
.poll-note{font-size:9.5px;line-height:1.28;color:#c7d7e7;margin:10px 0 0}
.poll-message{margin:0 0 11px;color:#e9f2fb;font-size:11px}
.poll-progress{margin-bottom:9px}
.poll-result-head{display:flex;justify-content:space-between;gap:7px;font-size:10.5px;margin-bottom:3px}
.poll-result-bar{height:6px;background:#092541;border-radius:4px;overflow:hidden}
.poll-result-fill{height:100%;background:#92badb;border-radius:4px}
.poll-result-selected .poll-result-fill{background:#e94c5a}
.article-poll .poll-card{max-width:620px}
.article-poll .poll-question{font-size:16px}
.article-poll .poll-options label{font-size:13px}

/* ---------- search ---------- */
.search-dialog{position:fixed;inset:0;background:#0008;z-index:40;display:none;align-items:flex-start;justify-content:center;padding:15vh 20px}
.search-dialog.open{display:flex}
.search-box{width:min(600px,100%);background:#fff;padding:25px;box-shadow:0 12px 50px #0004;color:var(--navy)}
.search-box h2{font:700 26px var(--serif);margin:0 0 14px}
.search-box form{display:flex;gap:8px}
.search-box input{padding:12px;width:100%;border:1px solid #aab8c5}
.search-box button[type=submit]{background:#0a3158;color:#fff;border:0;padding:0 18px}
.search-close{float:right;font-size:22px;background:none;border:0}

/* ---------- responsive ---------- */
@media(min-width:1800px){.poll-options{grid-template-columns:repeat(3,minmax(0,1fr))}.poll-card{padding:17px 19px 14px}}
@media(max-width:1250px){
	.footer{grid-template-columns:repeat(3,minmax(0,1fr))}
	.footcol:nth-child(3){border-right:0}
	.footcol:nth-child(4){border:0}
	.poll-card.in-footer{grid-column:2/-1}
	.poll-options{grid-template-columns:repeat(3,minmax(0,1fr))}
	.article-grid{grid-template-columns:minmax(0,1fr) 280px}
}
@media(max-width:1240px){
	.content-grid{grid-template-columns:minmax(0,1fr) 280px}
}
@media(max-width:1200px){
	.tagline{display:none}
	.curr{gap:12px}
	.hero-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(225px,.86fr)}
	.lead{min-height:310px}
	.daily{max-height:310px}
	.investigation-grid{gap:10px 8px}
	.investigation-card{padding-right:8px}
	.investigation-card h3{font-size:16px}
	.investigation-card p{font-size:12px}
	.bottom-grid .section-top .description{display:none}
	.latest-scroll,.photo-scroll{max-height:440px}
	.gallery-hero{aspect-ratio:2.02/1}
}
@media(max-width:990px){
	.hero-grid{grid-template-columns:1.4fr 1fr}
	.lead{min-height:305px}
	.daily{grid-column:1/-1;max-height:235px;min-height:235px;border-left:0;border-top:1px solid var(--line);padding:13px 0 0}
	.investigation-grid{grid-template-columns:repeat(2,1fr);gap:10px 8px}
	.investigation-card:nth-child(2n){border-right-color:transparent}
	.investigation-card:nth-child(4n){border-right-color:transparent}
	.investigation-card h3{font-size:19px}
	.bottom-grid{grid-template-columns:1fr}
	.bottom-grid section+section{padding-left:0;border:0}
	.latest-scroll,.photo-scroll{max-height:350px;min-height:270px}
	.gallery-hero{aspect-ratio:2.1/1}
	.gallery-small{gap:18px}
	.article-grid{grid-template-columns:1fr}
	.article-side{position:static}
}
@media(max-width:880px){
	.footer{grid-template-columns:repeat(2,minmax(0,1fr))}
	.footcol:nth-child(3){border-right:1px solid #5f7991}
	.footcol:nth-child(2),.footcol:nth-child(4){border-right:0}
	.poll-card.in-footer{grid-column:1/-1}
}
@media(max-width:830px){
	.weather{display:none}
	.content-grid{grid-template-columns:1fr}
	.aside{border:0;padding:0}
	.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.photo-feature{grid-template-columns:1fr}
	.feature-side{grid-template-columns:1fr 1fr}
	.news-row{grid-template-columns:180px 1fr}
	.related-grid{grid-template-columns:1fr 1fr}
}
/* phones: no scroll boxes inside the page (the finger gets stuck in them), the blocks show a few cards and
   the «Все …» link; agreed with the editor 2026-11-09 */
@media(max-width:650px){
	.mast{height:59px;padding:0 15px}
	.quicknav{right:12px}
	.brand{font-size:26px}
	.util{gap:8px}
	.curr,.weather{display:none}
	main{padding:16px 15px 0}
	.hero-grid{grid-template-columns:1fr}
	.lead{min-height:290px}
	.hero-support{grid-template-rows:none;grid-template-columns:1fr 1fr;gap:13px}
	.support{display:block}
	.support-image{aspect-ratio:16/9}
	.support h2{font-size:17px;margin:7px 0}
	.support .muted{font-size:11px}
	.daily{grid-column:auto;max-height:none;min-height:0}
	.news-scroll,.latest-scroll,.photo-scroll,.investigation-scroll{max-height:none;min-height:0;overflow:visible;padding-right:0}
	.news-scroll .news-item:nth-child(n+8),.latest-scroll .latest-row:nth-child(n+6),.investigation-grid .investigation-card:nth-child(n+5),.photo-scroll .thumb-link:nth-child(n+5){display:none}
	.section-top{gap:8px;min-height:42px}
	.section-top .description{display:none}
	.section-top h2{font-size:23px}
	.section-top a{font-size:12px}
	.investigation-grid{grid-template-columns:1fr 1fr;gap:10px 8px}
	.investigation-card{padding-right:0;border:0}
	.investigation-card h3{font-size:16px}
	.investigation-card p{display:none}
	.bottom-grid{gap:20px}
	.gallery-hero{aspect-ratio:16/9}
	.gallery-small{grid-template-columns:repeat(2,1fr)}
	.footer{grid-template-columns:1fr 1fr;gap:16px}
	.footcol .footlogo{font-size:25px}
	.poll-options{grid-template-columns:repeat(2,minmax(0,1fr))}
	.news-row{grid-template-columns:120px 1fr;gap:12px}
	.news-row p{display:none}
	.article-text{font-size:17px}
	.article-gallery{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
	.filters .meta{width:100%;margin-left:0}
	.inv-item{grid-template-columns:132px minmax(0,1fr);gap:10px}
	.inv-item h2{font-size:17px}
	.inv-item p{display:none}
	.photo-grid{grid-template-columns:1fr}
	.feature-side{grid-template-columns:1fr}
	.feature-side article{display:grid;grid-template-columns:40% 1fr;gap:10px}
	.aside-item{grid-template-columns:96px 1fr}
	.aside-item .photo-frame{width:96px}
	.related-grid{grid-template-columns:1fr}
}
@media(max-width:420px){
	.lead-copy h1{font-size:26px}
	.lead{min-height:275px}
	.hero-support{grid-template-columns:1fr}
	.support{display:grid;grid-template-columns:40% 1fr}
	.support h2{font-size:16px}
	.investigation-grid{grid-template-columns:1fr}
	.investigation-card{display:grid;grid-template-columns:42% 1fr;gap:12px;border-bottom:1px solid var(--line);padding-bottom:11px}
	.investigation-card h3{margin:0}
	.latest-row{grid-template-columns:33% 1fr}
	.gallery-small{grid-template-columns:1fr 1fr}
	.footer{grid-template-columns:1fr}
	.footcol{border-right:0!important;border-bottom:1px solid #526f8c;padding-bottom:13px}
	.poll-card.in-footer{grid-column:auto}
}

/* ---------- AVE templates: additions ---------- */
/* phone: the lead story is a photo with the headline under it (long headlines never run over the top edge) */
@media(max-width:650px){
	.lead{min-height:0;background:var(--navy)}
	.lead img{position:relative;height:auto;aspect-ratio:4/3}
	.lead:after{display:none}
	.lead-copy{position:relative;left:auto;right:auto;bottom:auto;padding:14px 14px 16px}
	.lead-copy p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
	.gallery-hero{aspect-ratio:auto;background:var(--navy)}
	.gallery-hero img{position:relative;height:auto;aspect-ratio:16/10}
	.gallery-hero:after{display:none}
	.gallery-hero .hero-title{position:relative;left:auto;right:auto;bottom:auto;padding:12px 14px 14px}
}
.counter-logos{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}
.article .eyebrow{display:inline-block}
.article .eyebrow:hover{color:var(--hover)}
.article-meta .admin-edit{color:#8d99a6;text-decoration:underline;font-size:12px}
.article-anons{font:600 19px/1.5 var(--serif);color:#22324a;margin:0 0 18px}
.article-anons p{margin:0 0 .6em}
.article-video{position:relative;aspect-ratio:16/9;background:#000;margin:0 0 20px}
.article-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* article photo: shown whole, never cropped (vertical photos keep the head) */
.article-lead-photo .photo-frame{aspect-ratio:auto;display:flex;justify-content:center;background:#f1f1f1}
/* client 09.11: the lead photo fills the column (no grey side fields); very tall photos are cut to max(78vh,560px),
   the editor's «Фокус фото» picks the visible part, a click opens the whole photo */
.article-lead-photo .photo-frame img{width:100%;height:auto;max-height:max(78vh,560px);object-fit:cover;object-position:50% 30%}
.article-lead-photo a.photo-frame{cursor:zoom-in}
.article-credits{font-size:13px;color:#5d6b7a;margin:16px 0 0}
.article-credits p{margin:2px 0}
.article-credits a{color:var(--hover);word-break:break-all}
.article-text iframe{max-width:100%}
.section-list{min-width:0}
.section-text{max-width:860px}
/* photo viewer */
.lightbox{position:fixed;inset:0;background:rgba(3,12,24,.93);display:none;align-items:center;justify-content:center;z-index:1000}
.lightbox.open{display:flex}
.lightbox img{max-width:94vw;max-height:88vh;object-fit:contain;box-shadow:0 10px 40px #0008}
.lightbox button{position:absolute;color:#fff;background:none;border:0;font-size:44px;line-height:1;padding:10px 14px;cursor:pointer;opacity:.85}
.lightbox button:hover{opacity:1}
.lb-close{top:6px;right:10px}
.lb-prev{left:6px;top:50%;transform:translateY(-50%)}
.lb-next{right:6px;top:50%;transform:translateY(-50%)}
.lb-count{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:#cfd8e3;font-size:13px}
.pagination .dots{border:0;background:none;min-width:0;padding:9px 2px}
.poll-result-fill{display:block}
.poll-results[hidden],form[data-poll-form][hidden]{display:none}
.article-poll .poll-card{color:#fff}
.poll-card .ave-poll__notice{background:none;border:0;padding:0;margin:0 0 10px;color:#e9f2fb;font-size:12px;box-shadow:none}
.poll-card .poll-result-head{color:#fff}
/* search page (module «Поиск по сайту») in the site style */
.site-search-page{max-width:1100px}
.site-search-header .site-search-eyebrow{color:var(--red);font-size:11px;letter-spacing:.035em;font-weight:700;text-transform:uppercase;margin:0 0 4px}
.site-search-header h1{font:700 clamp(30px,3vw,48px)/1.12 var(--serif);color:#102a4d;margin:0 0 8px}
.site-search-header h1:before{content:"";display:inline-block;width:6px;height:.76em;background:#c62836;margin-right:14px;transform:skewX(-9deg)}
.site-search-header p{color:#536273}
.site-search-form button[type=submit]{background:#0a3158;border-color:#0a3158;color:#fff}
.site-search-form button[type=submit]:hover{background:var(--hover)}
.site-search-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;padding:26px 0}
.site-search-pagination a{border:1px solid #d3d3d3;min-width:38px;padding:9px 12px;text-align:center;border-radius:4px;font-size:13px;color:#193151;background:#fff}
.site-search-pagination a[aria-current],.site-search-pagination a:hover{background:#0a3158;color:#fff;border-color:#0a3158}
/* phone: «Читайте также» as compact rows */
@media(max-width:650px){
	.related-card{display:grid;grid-template-columns:118px 1fr;column-gap:12px;align-items:start;padding-bottom:12px;border-bottom:1px solid var(--line)}
	.related-card .photo-frame{grid-row:1/5}
	.related-card h3{font-size:16px;margin:2px 0 4px}
}

/* client mockup 09.11 19:57 «компактнее»: lower hero, lighter headlines, «Темы дня» as one row of 4 cards,
   section headings like «Новости дня» (red slash + title + description) instead of navy plates */
.daily-header h2:before,.block-title:before,.section-top h2:before{transform:skewX(-14deg)}
.lead{min-height:300px}
.lead-copy h1{font-size:clamp(21px,1.8vw,31px);line-height:1.1;letter-spacing:-.2px}
.lead-copy p{font-size:clamp(12px,.9vw,15px);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lead-badge{position:absolute;z-index:2;left:clamp(10px,1.2vw,18px);top:clamp(10px,1.2vw,18px);background:var(--red);color:#fff;font:700 12px/1 var(--sans);padding:5px 8px;border-radius:2px;max-width:60%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.support{grid-template-columns:45% 1fr}
.support h2{font-size:clamp(15px,1.08vw,20px);line-height:1.15;margin:3px 0 8px}
.section-top{min-height:40px}
.section-top h2,.bottom-grid .section-top h2{font:700 clamp(19px,1.45vw,25px)/1.1 var(--serif);color:var(--navy);padding:7px 0;white-space:nowrap}
.section-top h2:before{content:'';display:inline-block;width:4px;height:19px;background:var(--red);margin-right:10px;vertical-align:-2px}
.bottom-grid .section-top .description{display:none}
.investigation-scroll{max-height:none;overflow:visible;padding-right:0}
.investigation-grid .investigation-card:nth-child(n+5){display:none}
.investigation-card .image-ratio{aspect-ratio:5/2}
.investigation-card h3{font-size:clamp(15px,1.05vw,19px);line-height:1.18;margin:7px 0 6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:1200px){.lead{min-height:280px}}
@media(max-width:650px){
	.lead{min-height:0}
	.lead-badge{font-size:11px}
	.investigation-card .image-ratio{aspect-ratio:16/9}
}

/* client 09.11 19:58–20:05: «гигантизм, режет глаза» → everything one size down (mockup scale); scrolling only in «Новости дня»;
   bottom blocks after the client's mockup: light heading bars, 4 latest rows, photo hero + 3 photos without captions, rounded photos */
.mast{height:62px}
.brand{font-size:clamp(22px,2.05vw,34px)}
.daily-header h2{font-size:clamp(18px,1.4vw,24px)}
.title{font-size:clamp(26px,2.3vw,40px)}
.article h1{font-size:clamp(24px,2.1vw,36px)}
.site-search-header h1{font-size:clamp(24px,2.2vw,36px)}
.news-row h2,.news-list>.news-row h2,.inv-item h2{font-size:clamp(15px,1.05vw,19px)}
.aside h3{font-size:19px}
.aside-item strong{font-size:15px}
.related-card h3{font-size:15px}
.section-heading h2{font-size:22px}
.feature-text h2{font-size:clamp(20px,1.9vw,32px)}
.feature-side h3{font-size:clamp(14px,.95vw,18px)}
.photo-card h3{font-size:clamp(15px,1.05vw,19px)}
/* no inner scroll except the news feed */
.latest-scroll,.photo-scroll{max-height:none;min-height:0;overflow:visible;padding-right:0}
.latest-scroll .latest-row:nth-child(n+5){display:none}
.gallery-small .thumb-link:nth-child(n+4){display:none}
/* bottom blocks */
.bottom-grid .section-top{background:#f1f1f1;border:0;border-radius:4px;padding:0 14px;min-height:42px}
.latest-row{grid-template-columns:28% 1fr;gap:14px;padding:9px 0}
.latest-row h3{font-size:clamp(14px,1vw,17px);line-height:1.2;margin:2px 0 8px}
.latest-row>.latest-image,.gallery-hero,.thumb-link .image-ratio{border-radius:5px}
.hero-title h3{font-size:clamp(18px,1.55vw,28px);line-height:1.12}
.gallery-small{gap:10px;margin-top:10px}
.thumb-link .thumb-eyebrow,.thumb-link h3,.thumb-link .photo-meta{display:none}
@media(max-width:650px){
	.mast{height:56px}
	.latest-scroll .latest-row:nth-child(n+5){display:none}
	.gallery-small .thumb-link:nth-child(n+3){display:none}
}
/* client 09.11 20:05 «голосовалку уменьшаем» + 20:13 «низ вот так неплохо ИИ подсказывает»: compact footer, small bold labels
   instead of headings, red slash before the name; the poll is a small white card (options in a row, buttons on the right).
   The poll under an article keeps its own look. */
.footer{padding:16px var(--pad);align-items:stretch}
@media(min-width:1251px){.footer{grid-template-columns:minmax(150px,1fr) minmax(180px,1.3fr) minmax(165px,1.1fr) minmax(130px,.85fr) minmax(330px,1.9fr)}}
.footcol h3{font:700 12px/1.2 var(--sans);letter-spacing:.2px;margin:0 0 6px}
.footcol .footlogo{font-size:clamp(20px,1.55vw,28px);display:flex;align-items:center;gap:8px;margin-bottom:6px}
.footcol .footlogo:before{content:'';width:4px;height:.85em;background:var(--red);transform:skewX(-14deg);flex:none}
.footcol p b{color:#fff;font-weight:700}
.footcol p a{display:inline}
.age{margin-top:9px;padding:2px 6px;font-size:11px}
/* the module wraps the card in div.ave-poll: that wrapper is the grid item */
.footer>.ave-poll{display:flex;min-width:0}
@media(max-width:1250px){.footer>.ave-poll{grid-column:2/-1}}
@media(max-width:990px){.footer>.ave-poll{grid-column:1/-1}}
@media(max-width:420px){.footer>.ave-poll{grid-column:auto}}
.footer .poll-card{flex:1;align-self:stretch;padding:10px 12px;background:#fff;border:0;border-radius:4px;box-shadow:none;color:var(--navy)}
.footer .poll-heading{border:0;padding:0;margin:0 0 4px;gap:6px}
.footer .poll-mark{width:3px;height:13px;background:var(--red)}
.footer .poll-heading h3{font:800 12px/1.1 var(--sans);letter-spacing:.5px;color:var(--navy)}
.footer .poll-question{font:700 12px/1.3 var(--sans);color:#1d2f42;margin:0 0 7px}
.footer form[data-poll-form]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:start}
.footer form[data-poll-form]>*{grid-column:1/-1}
.footer form[data-poll-form]>.poll-options{grid-column:1;grid-row:1}
.footer form[data-poll-form]>.poll-actions{grid-column:2;grid-row:1;flex-direction:column;align-items:stretch;margin:0;gap:5px}
.footer form[data-poll-form]>:empty{display:none}
.footer .poll-options{display:flex;flex-wrap:wrap;gap:5px 12px}
.footer .poll-options label{font:11px/1.2 var(--sans);color:#1d2f42;gap:4px}
.footer .poll-options input{width:12px;height:12px}
.footer .poll-actions button,.footer .poll-actions a,.footer .poll-back{padding:5px 12px;font-size:11px;border-radius:3px}
.footer .poll-vote{background:#c82431;border-color:#c82431}
.footer .poll-results-button,.footer .poll-back{background:#fff;border:1px solid #9aabbc;color:var(--navy)}
.footer .poll-results-button:hover,.footer .poll-back:hover{background:#f1f1f1}
.footer .poll-message{color:#1d2f42;font-size:11px;margin:0}
.footer .poll-results{margin-top:8px}
.footer .poll-note{color:#5b6b7b}
.footer .poll-result-head{font-size:10.5px;color:#1d2f42}
.footer .poll-progress{margin-bottom:6px}
.footer .poll-result-bar{height:4px;background:#e8e8e8}
.footer .poll-result-fill{background:#5d87ad}
/* «Архив новостей» calendar (client 09.11 20:06): /news aside and under «Новости дня» on article pages */
.news-cal{margin:0 0 18px}
.article-side .news-cal{margin-top:16px}
.news-cal-head{display:flex;align-items:center;justify-content:space-between;background:#f1f1f1;border-radius:4px;padding:6px 8px;margin-bottom:6px}
.news-cal-head strong{font:700 14px var(--sans);color:var(--navy)}
.news-cal-head a,.news-cal-head span{width:24px;text-align:center;font-size:18px;line-height:1;color:var(--navy)}
.news-cal-head a:hover{color:var(--red)}
.news-cal table{width:100%;border-collapse:collapse;table-layout:fixed;font:13px/1 var(--sans)}
.news-cal th{font-size:11px;font-weight:700;color:#6b7988;padding:4px 0;text-align:center}
.news-cal td{text-align:center;padding:1px}
.news-cal td a,.news-cal td span{display:block;padding:6px 0;border-radius:3px}
.news-cal td a{color:var(--navy);font-weight:700;background:#f6f6f6}
.news-cal td a:hover{background:var(--navy);color:#fff}
.news-cal td span{color:#b3bdc8}
.news-cal th.we,.news-cal td.we a{color:#b0232f}
.news-cal td.today a,.news-cal td.today span{box-shadow:inset 0 0 0 1px var(--navy)}
.news-cal td.sel a{background:var(--red);color:#fff}
.day-back{margin:14px 0 0;font-size:13px;font-weight:700}
/* the article aside is sticky; with the calendar it is taller than short screens → not sticky there */
@media(max-height:960px){.article-side{position:static}}
/* client 09.11 20:08 «гл. фото репортажей не должно быть равно фото наверху»: a lower photo-report hero, smaller title */
.gallery-hero{aspect-ratio:2.75/1}
.hero-title h3{font-size:clamp(16px,1.3vw,23px)}
.gallery-hero .hero-title{bottom:11px;left:16px;right:16px}
@media(max-width:650px){.gallery-hero{aspect-ratio:auto}}
/* client 09.11 20:14 «Съехало»: the photo reports end on the same line as «Последние материалы» —
   the three small photos take the rest of the column height (two columns only, ≥991 px) */
@media(min-width:991px){
	.bottom-grid .photos{display:flex;flex-direction:column}
	.bottom-grid .photo-scroll{flex:1;display:flex;flex-direction:column;min-height:0}
	.bottom-grid .gallery-hero{flex:none}
	.bottom-grid .gallery-small{flex:1}
	.bottom-grid .thumb-link{display:flex;flex-direction:column}
	.bottom-grid .thumb-link .image-ratio{flex:1;aspect-ratio:auto;min-height:110px;position:relative}
	.bottom-grid .thumb-link .image-ratio img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
}
/* client 09.11 20:22 «лейбл укрупним» (the «The Penza Post» name in the header) + Moscow time next to the rates and the weather */
.brand{font-size:clamp(27px,2.65vw,43px);letter-spacing:-.6px}
.clock{border-left:1px solid #6e8498;padding-left:clamp(11px,1.6vw,20px);display:flex;flex-direction:column;align-items:center;line-height:1.15}
.clock b{font:700 16px/1.1 var(--sans);letter-spacing:.5px;font-variant-numeric:tabular-nums}
.clock small{font-size:11px;color:#c9d6e3}
@media(max-width:830px){.clock{border-left:0;padding-left:0}}
@media(max-width:650px){.brand{font-size:26px}}
@media(max-width:760px){.clock small{display:none}}
@media(max-width:480px){.clock{display:none}}
/* 360 px phones: «Последние материалы» + «Все материалы →» did not fit in one line */
@media(max-width:400px){.bottom-grid .section-top{padding:0 10px;gap:6px}.section-top h2,.bottom-grid .section-top h2{font-size:17px}.section-top>a{font-size:11.5px}}
/* the red «Событие» badge on the lead photo was in the same screenshot → a little larger too */
.lead-badge{font-size:clamp(13px,1vw,16px);padding:6px 10px}
@media(max-width:650px){.lead-badge{font-size:12px;padding:5px 8px}}
/* ===== client 09.11 20:29–20:34 (his AI review + «голосовалку удалим», «поставь туда календарь архива») ===== */
/* footer: the poll is gone, the archive calendar stands in its place — same width as the poll card (client 20:39
   «вписываем в эту же ширину плашки»), light grey («подсери»), compact: title and month in one line, low cells */
.footer>.news-cal{margin:0;align-self:stretch;min-width:0;background:#ededed;color:var(--navy);border-radius:4px;padding:8px 10px 7px;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;row-gap:5px}
.footer .news-cal .block-title{display:flex;align-items:center;gap:6px;margin:0;padding:0;border:0;font:800 12px/1.1 var(--sans);letter-spacing:.5px;text-transform:uppercase;color:var(--navy);white-space:nowrap}
.footer .news-cal .block-title:before{content:'';width:3px;height:13px;background:var(--red);transform:skewX(-14deg);flex:none}
.footer .news-cal .block-title:after{display:none}
.footer .news-cal-head{background:#fff;padding:2px 4px;margin:0;border-radius:3px}
.footer .news-cal-head strong{font-size:12px}
.footer .news-cal-head a,.footer .news-cal-head span{width:20px;font-size:16px}
.footer .news-cal table{grid-column:1/-1;font-size:11px}
.footer .news-cal th{font-size:9.5px;padding:0 0 1px}
.footer .news-cal td{padding:1px}
.footer .news-cal td a,.footer .news-cal td span{padding:2px 0;line-height:13px}
.footer .news-cal td a{background:#fff}
.footer .news-cal td span{color:#a5b1bd}
.footer>.footcol:nth-child(4){border-right:0}
@media(max-width:1250px){.footer>.news-cal{grid-column:auto}}
@media(max-width:650px){.footer>.news-cal{grid-column:1/-1;max-width:380px}}

/* photos: one proportion family — investigations 3:2 (were flat 5:2 strips), the big photo report 16:9 (was a 2.75:1 banner).
   The photo report column is narrower than «Последние материалы», so its main photo stays smaller than the lead photo on top
   (client 20:08); both columns end on one line: the shorter one lets its photos grow a little */
.investigation-card .image-ratio{aspect-ratio:3/2}
.gallery-hero{aspect-ratio:16/9}
@media(min-width:991px){
	.bottom-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
	.latest-row{grid-template-columns:17% 1fr}
	.bottom-grid .latest{display:flex;flex-direction:column}
	.bottom-grid .latest-scroll{flex:1;display:flex;flex-direction:column}
	.bottom-grid .latest-row{flex:1 0 auto}
	.bottom-grid .thumb-link .image-ratio{flex:1 0 auto;aspect-ratio:16/9;min-height:0}
}
@media(max-width:650px){.gallery-hero{aspect-ratio:auto}.investigation-card .image-ratio{aspect-ratio:16/9}}

/* text sizes stop growing at ~1500 px: on a 2560 px screen the headlines stay the same as on a laptop */
.brand{font-size:clamp(27px,2.65vw,40px)}
.lead-copy h1{font-size:clamp(21px,1.8vw,27px)}
.support h2{font-size:clamp(15px,1.08vw,18px)}
.section-top h2,.bottom-grid .section-top h2{font-size:clamp(19px,1.45vw,22px)}
.investigation-card h3{font-size:clamp(15px,1.05vw,17px)}
.latest-row h3{font-size:clamp(14px,1vw,16px)}
.hero-title h3{font-size:clamp(16px,1.3vw,20px)}
@media(max-width:650px){.lead-copy h1{font-size:22px}}
@media(max-width:400px){.section-top h2,.bottom-grid .section-top h2{font-size:17px}}
/* client 09.11 20:44 «Сереньким тоже. Это лента.»: «Новости дня» gets the same light-grey plate as the bottom blocks */
.daily-header{background:#f1f1f1;border:0;border-radius:4px;padding:0 12px;min-height:42px;margin-bottom:6px}
.daily-header h2{font-size:clamp(18px,1.4vw,22px)}
/* client 09.11 20:47 «про это забыли в лейбле»: the globe of the original logo, between «The» and «Penza Post» as it was */
.brand{display:inline-flex;align-items:center}
.brand-globe{width:1.02em;height:1.02em;margin:0 .2em 0 .22em;flex:none;display:block}
@media(max-width:1270px){.tagline{display:none}}
/* client 09.11 20:50 «по высоте поднимем всю линию, фотка главная станет выше — это акцент»: the top row is taller again
   (about 3:2 for the lead photo at every width; the two materials and «Новости дня» follow the row) */
@media(min-width:991px){.lead{min-height:clamp(330px,29vw,600px)}}
/* 20:51 «Серым тоже. Как везде»: «Темы дня» on the same light-grey plate */
.investigations .section-top{background:#f1f1f1;border:0;border-radius:4px;padding:0 14px;min-height:42px}
/* 20:52 «Попробуем белый на серый»: the strip under the footer (rights, cookies, counters) on light grey */
.counters{background:#ededed;color:#56636f}
.counters a{color:#3b5068}
/* client 09.11 20:59 «фотки тоже чуть выше, шрифт чуть больше, как сверху; в фотоальбоме фотки тоже подрастут»:
   «Последние материалы» — larger photos and the same headline size as «Темы дня»; the photo report column a bit wider
   again (its 16:9 photo still stays well below the taller lead photo), so its three small photos grow too */
@media(min-width:991px){
	.bottom-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
	.latest-row{grid-template-columns:22% 1fr}
}
.latest-row h3{font-size:clamp(15px,1.05vw,17px);line-height:1.18}
/* very wide screens: the lead stops growing at 600 px, so the photo report column narrows again to stay below it */
@media(min-width:2000px){.bottom-grid{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}}
/* client 09.11 21:01 «наш лейбл укрупним — плашку чуть шире. Лейбл ведь. Бренд»: a taller header bar and a larger name */
.mast{height:70px}
.brand{font-size:clamp(29px,2.85vw,44px)}
.curr{gap:14px}
@media(max-width:760px){.brand{font-size:27px}}
@media(max-width:650px){.mast{height:60px}.brand{font-size:28px}}
@media(max-width:380px){.brand{font-size:26px}}
.tagline{white-space:nowrap;font-size:11.5px}
@media(max-width:1270px){.tagline{display:none}}
/* client 09.11 21:10 «попробуем залить фон серым, с тонкой границей белого по краям… глянем как будет»:
   «Последние материалы» rows as light-grey cards (same grey as the plates), thin white gaps between them */
.latest-scroll{display:flex;flex-direction:column;gap:4px}
.latest-row,.latest-row:first-child{background:#f1f1f1;border:0;border-radius:4px;padding:8px}
.latest-row h3{margin-top:0}
/* 21:13 «между фото и загами тоже отсечку сделай, белым»: photo tile | thin white cut | grey text tile */
.latest-row,.latest-row:first-child{background:none;padding:0;border-radius:0;column-gap:4px}
.latest-row>.latest-image{border-radius:4px 0 0 4px}
.latest-row>div:not(.latest-image){background:#f1f1f1;border-radius:0 4px 4px 0;padding:9px 12px}
/* 21:14 «и здесь также залей — акцент главных новостей»: the two materials next to the lead in the same style —
   photo tile | thin white cut | grey text tile, 4 px white between the two */
.hero-support{gap:4px}
.support,.support:last-child{gap:4px;padding-bottom:0;border-bottom:0;align-items:stretch}
.support>.support-image{border-radius:4px 0 0 4px}
.support>div:not(.support-image){background:#f1f1f1;border-radius:0 4px 4px 0;padding:10px 12px}
.support h2{margin-top:0}
@media(max-width:650px){
	.support>.support-image{border-radius:4px 4px 0 0}
	.support>div:not(.support-image){margin-top:4px;border-radius:0 0 4px 4px}
}
@media(max-width:420px){
	.support>.support-image{border-radius:4px 0 0 4px}
	.support>div:not(.support-image){margin-top:0;border-radius:0 4px 4px 0}
}
/* 21:16 «да, но ширину белого как справа»: the white cuts and gaps = the 10 px gaps between the photo report photos */
.latest-scroll{gap:10px}
.latest-row,.latest-row:first-child{column-gap:10px}
.hero-support{gap:10px}
.support,.support:last-child{gap:10px}
@media(max-width:650px){.support>div:not(.support-image){margin-top:10px}}
@media(max-width:420px){.support>div:not(.support-image){margin-top:0}}
/* 21:18 «щель одинаковая белая должна быть»: from a grey card to the column line and from the line to the next column —
   the same 10 px as between photo and text */
@media(min-width:991px){
	.hero-grid{gap:10px}
	.hero-grid>.daily{padding-left:10px}
	.bottom-grid{gap:10px}
	.bottom-grid section+section{padding-left:10px}
}
/* footer, first column: the two lines of the tagline stay whole («портал» was left alone on a line) */
@media(min-width:1251px){.footer{grid-template-columns:minmax(200px,1.2fr) minmax(180px,1.2fr) minmax(165px,1fr) minmax(130px,.75fr) minmax(340px,1.75fr)}}
.footcol:first-child p{font-size:10.5px;white-space:nowrap}
@media(max-width:420px){.footcol:first-child p{white-space:normal}}
/* 21:25 «и в ленте новостей выделять заги: черным, красным, синим» — the old checkboxes «Выделить черным / красным / синим»
   (fields bold, boldRed, boldblue) of the news form colour the headline in «Новости дня» and on «Все новости» */
.news-item.hl-black>span{color:#000;font-weight:700}
.news-item.hl-red>span{color:#c41e2a;font-weight:700}
.news-item.hl-blue>span{color:#0b4ea2;font-weight:700}

/* ===== inner pages — client 09.11 21:26 «вторичные сейчас также страдают гигантоманией»: the language of the home page
   (grey plates with the red slash, cards «photo | 10 px white | grey text», 10 px gaps), sizes capped ===== */
/* page title: a grey plate like the home blocks */
.title,.site-search-header h1{display:flex;align-items:center;font-size:clamp(20px,1.6vw,24px);line-height:1.15;background:#f1f1f1;border-radius:4px;padding:9px 14px;margin:0 0 10px;letter-spacing:0}
.title:before,.site-search-header h1:before{width:4px;height:.9em;margin-right:12px;transform:skewX(-14deg);flex:none}
.intro{font-size:13px;line-height:1.45;margin:0 0 12px;color:#56636f}
.breadcrumbs{margin-bottom:6px}
/* list cards: rubric lists, «Все материалы», «Расследования», search results */
.news-list:has(>.news-row){column-gap:10px;row-gap:10px}
.inv-list{gap:10px}
.news-row,.news-list>.news-row,.inv-item{grid-template-columns:36% 1fr;gap:0 10px;padding:0;border:0}
.news-row>.photo-frame,.inv-item>.photo-frame{border-radius:4px 0 0 4px}
.news-row>div:last-child,.inv-item>div:last-child{background:#f1f1f1;border-radius:0 4px 4px 0;padding:10px 12px}
.news-row.no-photo>div:last-child{border-radius:4px}
.news-row h2,.news-list>.news-row h2,.inv-item h2{font-size:clamp(15px,1.05vw,17px);line-height:1.18;margin:4px 0 8px}
.eyebrow{font-size:10.5px}
@media(max-width:650px){.news-row,.news-list>.news-row,.inv-item{grid-template-columns:120px 1fr}}
/* right column: same plate and cards; the white slit to it is 10 px, like on the home page */
@media(min-width:831px){.content-grid{gap:10px}.aside{padding-left:10px}}
.aside h3{display:flex;align-items:center;font:700 clamp(18px,1.4vw,22px)/1.15 var(--serif);background:#f1f1f1;border:0;border-radius:4px;padding:0 12px;min-height:42px;margin:0 0 10px}
.aside h3:before{content:'';width:4px;height:20px;background:var(--red);margin-right:10px;transform:skewX(-14deg);flex:none}
.aside-item{grid-template-columns:96px 1fr;gap:10px;padding:0;border:0;margin-bottom:10px}
.aside-item>.photo-frame{border-radius:4px 0 0 4px}
.aside-item>div:last-child{background:#f1f1f1;border-radius:0 4px 4px 0;padding:8px 10px}
.aside-item strong{font-size:14px;line-height:1.2}
.aside-info{margin-top:10px;padding:14px;border-radius:4px}
.aside-info strong{font-size:17px}
/* «Все новости»: the day heading as a small grey plate */
.day-head{font-size:12px;background:#f1f1f1;border:0;border-radius:4px;padding:7px 12px;margin:14px 0 4px;color:#3b5068}
/* photo reports page: big photo + two, then the archive; cards with grey text under a white slit */
.photo-feature{gap:10px;margin-bottom:12px}
.feature-side{gap:10px}
.feature-text h2{font-size:clamp(18px,1.5vw,24px)}
.feature-side article,.photo-card,.related-card{background:#f1f1f1;border:0;border-radius:4px;overflow:hidden;padding:0}
.feature-side .photo-frame,.photo-card .photo-frame,.related-card .photo-frame{margin:0;border-bottom:10px solid #fff;border-radius:0}
.feature-side .eyebrow,.photo-card .eyebrow,.related-card .eyebrow{margin:0 12px}
.feature-side h3,.photo-card h3,.related-card h3{font-size:clamp(14px,1vw,16px);line-height:1.2;margin:4px 12px 6px}
.feature-side .time,.photo-card .time,.related-card .time{display:block;margin:0 12px 10px}
.photo-grid{gap:10px}
.section-heading{background:#f1f1f1;border:0;border-radius:4px;padding:0 14px;min-height:42px;margin:0 0 10px}
.section-heading h2{display:flex;align-items:center;font-size:clamp(18px,1.4vw,22px)}
.section-heading h2:before{content:'';width:4px;height:20px;background:var(--red);margin-right:10px;transform:skewX(-14deg);flex:none}
.section-heading span{font-size:12px}
/* article: smaller headline and text, lower lead photo, «Читайте также» on a plate */
.article h1{font-size:clamp(22px,1.95vw,28px);line-height:1.15}
.article-anons{font-size:17px}
.article-text{font-size:clamp(16px,calc(13px + .28vw),18px);line-height:1.6}
.static-page .article-text{font-size:16px}
.article-lead-photo .photo-frame img{max-height:max(62vh,420px)}
.related .block-title{display:flex;align-items:center;background:#f1f1f1;border-radius:4px;padding:0 12px;min-height:42px;font-size:clamp(18px,1.4vw,22px);margin:0 0 10px}
.related-grid{gap:10px}
.site-search-header p{font-size:13px}
.aside h3{font-size:clamp(16px,1.15vw,18px);white-space:nowrap}
/* photo reports: the big photo fills the height of the two on the right (no white hole under it) */
@media(min-width:831px){
	.photo-feature{align-items:stretch}
	.feature-big{aspect-ratio:auto;align-self:stretch;min-height:clamp(300px,28vw,520px)}
	.feature-big>img{position:absolute;inset:0}
}
/* client 09.11 21:47 «здесь красный кант убери и саму плашку уменьши»: the search dialog — smaller, no red focus frame */
.search-box{width:min(460px,100%);padding:16px 18px 18px;border-radius:4px}
.search-box h2{font-size:20px;margin:0 0 10px}
.search-box input{padding:9px 11px;font-size:14px;border:1px solid #b9c6d3;border-radius:3px}
.search-box input:focus,.search-box input:focus-visible{outline:0;border-color:#0a3158;box-shadow:none}
.search-box button[type=submit]{padding:0 14px;font-size:14px;border-radius:3px}
.search-close{font-size:20px}
/* client 09.11 «мне кажется нужно уменьшить масштаб» (/news/04-08-2021/72673: 30+ photos inside the text, each stretched
   to the whole 1000 px column — a 32 000 px page): photos in the text at most 680 px wide and 60 % of the screen high,
   centred; the gallery in 4 columns; a lower lead photo */
.article-text img{max-width:min(100%,680px)!important;max-height:60vh;width:auto;height:auto!important;object-fit:contain;margin:14px auto;border-radius:4px}
.article-text iframe,.article-video{max-width:680px;margin-left:auto;margin-right:auto}
.article-lead-photo .photo-frame img{max-height:max(52vh,380px)}
@media(min-width:991px){.article-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}}
.article-gallery a{border-radius:4px}
.article h1{font-size:clamp(21px,1.75vw,26px)}
.article-anons{font-size:16px}
.article-text{font-size:clamp(15.5px,calc(12.5px + .25vw),17px)}

/* client 09.11 22:45 «Темы дня»: five cards on a wide screen (four below 1200 px, 2×2 on tablets), photos strictly 16:9
   (object-fit cover — cut, never squeezed), headlines at most three lines, then «…» */
.investigation-card .image-ratio{aspect-ratio:16/9}
.investigation-card h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
@media(min-width:1200px){
	.investigation-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
	.investigation-grid .investigation-card:nth-child(5){display:flex}
	.investigation-card:nth-child(4n){border-right-color:var(--line)}
	.investigation-card:nth-child(5n){border-right-color:transparent}
}
/* client 09.11 22:46 «Последние материалы» (no grey emptiness under the headlines) + 23:01 his mockup «И слева — прокрутку,
   так уйдут поля»: on a computer the block is a 2-column grid of cards — photo 16:9 on top, headline (≤2 lines) and
   «rubric | date» on the grey plate under it — inside a scroll box exactly as high as «Фоторепортажи» next to it (the
   photo column alone sets the height of the pair). Phones keep the plain list without an inner scroll. */
@media(min-width:991px){
	.bottom-grid .latest-scroll{contain:size;flex:1 1 0;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:max-content;align-content:start;gap:10px;overflow-x:hidden;overflow-y:auto;padding-right:8px;scrollbar-width:thin;scrollbar-color:#a7a7a7 #f1f1f1;scrollbar-gutter:stable}
	.bottom-grid .latest-scroll>.latest-row,.bottom-grid .latest-scroll>.latest-row:first-child{display:flex;flex-direction:column;gap:0;padding:0;border:0;min-width:0}
	.bottom-grid .latest-row>.latest-image{aspect-ratio:16/9;align-self:auto;position:relative;border-radius:4px 4px 0 0;flex:0 0 auto}
	.bottom-grid .latest-row>div:not(.latest-image){flex:1;display:flex;flex-direction:column;border-radius:0 0 4px 4px;padding:9px 12px 10px}
	.bottom-grid .latest-row h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:clamp(14px,1vw,16px);line-height:1.2;margin:0 0 6px}
	.bottom-grid .latest-row .muted{margin-top:auto}
}
@media(max-width:420px){.investigation-grid>.investigation-card>.image-ratio{align-self:start;aspect-ratio:16/9}}
/* client 09.11 22:47 «Фоторепортажи»: the three small photos are full materials again — photo 16:9, headline (at most three
   lines, then «…»), date and the number of shots (« · 37 фото», only when the report has a gallery) */
.gallery-small .thumb-link{display:flex;flex-direction:column}
.gallery-small .thumb-link .thumb-eyebrow{display:none}
.gallery-small .thumb-link h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;font:700 clamp(14px,.95vw,15px)/1.2 var(--serif);color:#0d213e;margin:7px 0 5px}
.gallery-small .thumb-link .photo-meta{display:block;margin-top:auto;font-size:12px}
/* 23:01 mockup: the small photo reports are cards like «Последние материалы» — photo, then the grey plate with the
   headline and «Фоторепортаж | date · N фото» */
.gallery-small .thumb-link .image-ratio{border-radius:4px 4px 0 0}
.gallery-small .thumb-link .thumb-text{flex:1;display:flex;flex-direction:column;background:#f1f1f1;border-radius:0 0 4px 4px;padding:8px 10px 9px}
.gallery-small .thumb-link .thumb-text h3{margin:0 0 5px}
@media(min-width:991px){.bottom-grid .gallery-small{flex:0 0 auto}.bottom-grid .thumb-link .image-ratio{flex:0 0 auto;aspect-ratio:16/9;min-height:0}}
/* client 09.11 22:46 main photo: the same size, but the darkening under the white headline is even — it starts higher and
   is already dense behind the text, so a light patch of the photo no longer eats the letters; a soft shadow on the text */
.lead:after{inset:12% 0 0;background:linear-gradient(to bottom,rgba(0,13,26,0) 0%,rgba(0,13,26,.32) 22%,rgba(0,13,26,.62) 42%,rgba(0,13,26,.8) 64%,rgba(0,13,26,.9) 84%,rgba(0,13,26,.93) 100%)}
.gallery-hero:after{inset:35% 0 0;background:linear-gradient(to bottom,rgba(1,13,24,0) 0%,rgba(1,13,24,.45) 35%,rgba(1,13,24,.8) 70%,rgba(1,13,24,.9) 100%)}
.lead-copy h1,.lead-copy p,.hero-title h3{text-shadow:0 1px 3px rgba(0,0,0,.45)}
.gallery-small .thumb-link .thumb-text .photo-meta{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gallery-small .thumb-link .thumb-text .sep{padding:0 4px}
/* two full rows of cards next to «Фоторепортажи» (1280–1920): the card column a little narrower, the photo column wider
   (its photo stays lower than the lead photo on top); very wide screens — three cards in a row */
@media(min-width:991px){
	.bottom-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
	.bottom-grid .latest-row>div:not(.latest-image){padding:8px 12px 8px}
	.bottom-grid .latest-row h3{margin-bottom:4px}
}
@media(min-width:2000px){
	.bottom-grid{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}
	.bottom-grid .latest-scroll{grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* client 09.11 23:08 «Отсинхронизируй, чтобы не залезало в статике. Фотки немного уменьшить, заги три строки»: the scroll
   box shows exactly two rows of cards (three on very wide screens' grid it is still two rows) — each row is half of the
   box, so nothing peeks out at the bottom; the scroll snaps from row to row. The headline gets up to three lines (the
   place is kept, so the dates of neighbouring cards stand on one line) and the photo takes the rest of the card. */
@media(min-width:991px){
	.bottom-grid .latest-scroll{grid-auto-rows:calc((100% - 10px) / 2);scroll-snap-type:y mandatory}
	.bottom-grid .latest-scroll>.latest-row{scroll-snap-align:start;min-height:0;overflow:hidden}
	.bottom-grid .latest-row>.latest-image{aspect-ratio:auto;flex:1 1 0;min-height:0}
	.bottom-grid .latest-row>div:not(.latest-image){flex:0 0 auto}
	.bottom-grid .latest-row h3{-webkit-line-clamp:3;line-clamp:3;min-height:3.6em}
}
.section-top .description:empty{display:none}
/* client 09.11 23:12 «Низ убери выход след. ряда. Фотки уменьш. Заги — в три строки, как выше, где 5 окон»: the headline
   of a card is set like the «Расследования» cards (same size, three lines kept); the card column is a little wider and
   the photo column a little narrower, so the two rows of cards are lower and their photos smaller */
@media(min-width:991px) and (max-width:1999px){.bottom-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}}
@media(min-width:991px){.bottom-grid .latest-row h3{font-size:clamp(15px,1.05vw,17px);line-height:1.18;min-height:3.54em}}
@media(max-width:1799px){.gallery-small .thumb-link .ph-rub{display:none}}
/* client 09.11 23:14 «сузить нижний синий паспорт минимум на треть»: the passport keeps only «© Сетевое издание …, 2015» and
   the registration number, founder and editor-in-chief (the same person) are one entry; on a computer the archive calendar
   puts its title and the month switch on the left and the days on the right, with low rows; smaller paddings */
@media(min-width:1251px){
	.footer{padding-top:10px;padding-bottom:10px;grid-template-columns:minmax(200px,1.15fr) minmax(190px,1.25fr) minmax(190px,1.1fr) minmax(150px,.8fr) minmax(330px,1.6fr)}
	.footcol .footlogo{margin-bottom:4px}
	.footcol p{margin:2px 0}
	.footcol>a{margin:1px 0}
	.age{margin-top:6px}
	.footer>.news-cal{grid-template-columns:auto 1fr;grid-template-rows:auto auto 1fr;align-items:start;column-gap:12px;row-gap:6px;padding:6px 10px}
	.footer .news-cal .block-title{grid-column:1;grid-row:1}
	.footer .news-cal-head{grid-column:1;grid-row:2}
	.footer .news-cal table{grid-column:2;grid-row:1/-1}
	.footer .news-cal th{font-size:9px;line-height:10px;padding:0}
	.footer .news-cal td{padding:.5px 1px}
	.footer .news-cal td a,.footer .news-cal td span{padding:1px 0;line-height:10px;font-size:10.5px}
}
.nowrap{white-space:nowrap}
@media(min-width:1251px){.footer .news-cal td a,.footer .news-cal td span{padding:1.5px 0;line-height:11px}}
/* phones: the photo report title sits under the photo (position:relative) — the later desktop offsets (left/right 16px)
   moved it 16px to the right and the last letters touched the edge */
@media(max-width:650px){.gallery-hero .hero-title{left:auto;right:auto;bottom:auto}}
.section-top a.inv-link[href=""]{display:none}
/* client 09.11 23:26 /fotoreportazh «все картинки одинаковые — это библиотека, альбом; не крупни; по четыре-пять в ряд с
   динамической центровкой»: one album of equal cards (photo 16:9, grey plate with the headline ≤3 lines and «date · N фото»),
   5 in a row on wide screens, 4 / 3 / 2 below; a short last row stands in the middle. 20 per page (fills 4 or 5 columns). */
.photo-album{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;--n:5;margin-bottom:12px}
.photo-album>.photo-card{flex:0 0 calc((100% - (var(--n) - 1) * 10px) / var(--n));min-width:0;display:flex}
.photo-album>.photo-card>a{display:flex;flex-direction:column;width:100%}
.photo-album .photo-frame{aspect-ratio:16/9;border-bottom:0;border-radius:4px 4px 0 0;flex:none}
.photo-album .photo-card h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;font-size:clamp(14px,.95vw,16px);line-height:1.2;margin:8px 12px 5px}
.photo-album .photo-card .time{margin:auto 12px 9px;font-size:12px}
@media(max-width:1399px){.photo-album{--n:4}}
@media(max-width:1099px){.photo-album{--n:3}}
@media(max-width:700px){.photo-album{--n:2}.photo-album .photo-card h3{margin:7px 9px 4px}.photo-album .photo-card .time{margin:auto 9px 8px;font-size:11px}}
/* client 09.11 23:29–23:30 article photos «по две — будет ровная линия по бокам» (site.js builds .article-photos): two
   equal 3:2 photos in a row across the whole text column, a single / odd last photo takes the whole width (up to 75% of
   the screen height, cropped, never squeezed); one column on phones */
.article-text .article-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}
.article-photos .article-photo{display:block;overflow:hidden;border-radius:4px;aspect-ratio:3/2;background:#ececec}
.article-photos .article-photo.wide{grid-column:1/-1;aspect-ratio:auto}
.article-text .article-photos img{display:block;width:100%!important;height:100%!important;max-width:none!important;max-height:none;margin:0!important;border-radius:0;object-fit:cover}
.article-text .article-photos .wide img{height:auto!important;max-height:75vh}
@media(max-width:600px){.article-text .article-photos{grid-template-columns:1fr}.article-photos .article-photo{aspect-ratio:auto}.article-text .article-photos img{height:auto!important;max-height:80vh}}
@media(min-width:601px){.article-photos .article-photo.wide{aspect-ratio:16/9}.article-text .article-photos .wide img{height:100%!important;max-height:none}}
/* client 09.11 23:32 «В статьях это у нас лид… Заливаем его серым, как на старой версии Пенза Пост. В админке он Анонс»:
   the anons of an article stands on the same light-grey plate as the rest of the site */
.article-anons{background:#f1f1f1;border-radius:4px;padding:14px 18px;margin:4px 0 18px}
.article-anons>:last-child{margin-bottom:0}
@media(max-width:600px){.article-anons{padding:12px 14px 12px 16px;font-size:15.5px}}
/* 4:3 office screens (1024–1199 px, client 09.11 23:39): «Новости дня» stays on one line in the narrow feed column */
@media(min-width:991px) and (max-width:1199px){.daily-header{gap:6px;padding:0 10px}.daily-header h2{white-space:nowrap;font-size:17px}.daily-header a{font-size:11px;white-space:nowrap}}
/* client 09.11 ~23:50 (his AI review of the article page): keep the newspaper serif, but an article must read easily —
   the text column 780 px (not the whole width of a Mac), headline 30–38, body 17–19 px / 1.65, 22 px between paragraphs,
   soft graphite #252b33, subheads 21–25, captions 13; the lead (anons) is no longer a heavy bold grey wall: regular
   20–21 px on an almost white field with a thin navy line on the left. The lead photo and the photo pairs keep the full
   column width, the reading column stands in its middle, so both sides stay even. */
.article h1{font-size:clamp(26px,2.5vw,38px);line-height:1.15;letter-spacing:-.2px}
.article-anons{background:#f9f9f9;border-left:3px solid var(--navy);border-radius:0 4px 4px 0;padding:14px 20px;font:400 clamp(17px,1.45vw,21px)/1.5 var(--serif);color:#1d2733}
.article-text{font:400 clamp(17px,1.35vw,19px)/1.65 var(--serif);color:#252b33}
.article-text p{margin:0 0 22px}
.article-text h2,.article-text h3{font-size:clamp(21px,1.75vw,25px);font-weight:700;line-height:1.25;margin:32px 0 12px;color:#0b1f3c}
.article-lead-photo figcaption{font-size:13px}
@media(min-width:991px){
	.article>.eyebrow,.article>h1,.article>.article-meta,.article>.article-anons,.article-text>:not(.article-photos),.article>.article-credits,.article>.article-share{max-width:780px;margin-left:auto;margin-right:auto}
	.article>.eyebrow{display:block}
}
@media(max-width:600px){.article-anons{padding:12px 14px;font-size:17px}}
/* client 10.11 00:01–00:05 (penzanews.ru as the model: «колонку для сужения страницы», «у них до низу вся страница заполнена»,
   «фотки шире текста», «крупно всё»): on a computer the article page has three columns — the article (the lead photo, the
   photo pairs and the text are of ONE width), a middle column of modules (the teaser block of the old site — sysblock
   side_teaser, editable in the admin — then investigations and photo reports) and «Новости дня» down to the bottom without
   an inner scroll. Narrower than 1200 px: the article and the feed; phones as before. The 780 px reading column of 23:50 is
   no longer needed: the article column itself is 650–800 px. */
.article-mid{display:none;min-width:0}
@media(min-width:1200px){
	.article-page{max-width:1540px;margin-inline:auto}
	.article-page .article-grid{grid-template-columns:minmax(0,1fr) clamp(240px,20vw,330px) clamp(280px,23.5vw,400px);gap:20px}
	.article-mid{display:block}
}
@media(min-width:991px){
	.article>.eyebrow,.article>h1,.article>.article-meta,.article>.article-anons,.article-text>:not(.article-photos),.article>.article-credits,.article>.article-share{max-width:none}
	.article-page .article-side{position:static}
	.article-page .article-side .news-scroll{max-height:none;overflow:visible}
}
.article h1{font-size:clamp(24px,2.1vw,32px);margin:4px 0 10px}
.article-anons{font-size:clamp(16px,1.25vw,19px);padding:12px 18px}
.article-text{font-size:clamp(16px,1.2vw,18px);line-height:1.6}
.article-text p{margin:0 0 18px}
.article-text h2,.article-text h3{font-size:clamp(19px,1.5vw,22px);margin:26px 0 10px}
.article-lead-photo{margin:0 0 16px}
.article-lead-photo .photo-frame{aspect-ratio:3/2;display:block}
.article-lead-photo .photo-frame img{width:100%;height:100%;max-height:none;object-fit:cover}
/* middle column modules: grey plate title, cards = photo 16:9 | 10 px white | grey text plate */
.side-block{margin:0 0 16px}
.side-title{display:flex;align-items:center;font:700 clamp(16px,1.15vw,18px)/1.15 var(--serif);background:#f1f1f1;border-radius:4px;padding:0 12px;min-height:42px;margin:0 0 10px;white-space:nowrap}
.side-title:before{content:'';width:4px;height:20px;background:var(--red);margin-right:10px;transform:skewX(-14deg);flex:none}
.side-title a{color:#102849}
.side-card{display:block;background:#f1f1f1;border-radius:4px;overflow:hidden;margin:0 0 10px;color:inherit}
.side-card .photo-frame{border-bottom:10px solid #fff}
.side-card-text{padding:0 12px 10px}
.side-card h3{font:700 clamp(14px,1vw,15px)/1.22 var(--serif);color:#0d213e;margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.side-card:hover h3{color:var(--hover)}
.side-card .time{font-size:12px;color:#6b7988}
.side-all{display:block;font-size:12px;font-weight:700;color:#102849}
.side-all:hover{color:var(--hover)}
.side-teaser{margin:0 0 16px;min-height:42px}
/* client 10.11 00:07–00:09 «может сделать как на пенза пост старом? Заг сбоку… попробуй наш макет» + «вот красиво» (the old
   site's article): the lead photo on the left (about half of the column), beside it the section, the headline (regular
   Georgia, not a bold poster) and the date; the anons below in a grey box, italic; the text; gallery thumbnails four in a
   row at the bottom. Phones: the headline, then the photo, as before. */
.article-head{margin:0 0 16px}
.article-head .article-lead-photo,.article-head .article-video{margin:0}
.article-head-text .eyebrow{display:inline-block;margin:0 0 6px}
.article h1{font:400 clamp(22px,1.75vw,27px)/1.22 var(--serif);color:#0b1f3c;letter-spacing:0;margin:0 0 12px}
@media(min-width:700px){
	.article-head.has-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:"media text";gap:16px;align-items:start}
	.article-head.has-media>.article-head-text{grid-area:text}
	.article-head.has-media>.article-lead-photo,.article-head.has-media>.article-video{grid-area:media;max-width:none}
	.article-head.has-media .article-meta{border:0;padding:0;margin:0}
}
.article-anons{background:#f1f1f1;border:0;border-radius:4px;padding:14px 18px;margin:0 0 18px;font:italic 400 clamp(16px,1.3vw,19px)/1.5 var(--serif);color:#2a3440}
.article-text{font-size:clamp(16px,1.27vw,19px)}
.article-gallery{margin:18px 0}
/* middle column, lighter: the first card of a block with its photo, the next ones as compact rows (photo | 10 px | grey text) */
.side-card+.side-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;background:none;border-radius:0}
.side-card+.side-card .photo-frame{border:0;border-radius:4px 0 0 4px;aspect-ratio:auto;align-self:stretch;position:relative;min-height:70px}
.side-card+.side-card .photo-frame img{position:absolute;inset:0}
.side-card+.side-card .side-card-text{background:#f1f1f1;border-radius:0 4px 4px 0;padding:8px 10px;display:flex;flex-direction:column}
.side-card+.side-card h3{font-size:13.5px;line-height:1.2}
.side-card+.side-card .time{margin-top:auto;font-size:11.5px}
.side-card:first-of-type .side-card-text{padding-top:0}
/* the teaser blocks of SMI2 (their own markup and styles, made to look like ours) */
.side-teaser [id^="container_"]{margin:0!important;background:none!important}
.side-teaser [id^="header_"]{display:flex!important;align-items:center;margin:0 0 10px!important;padding:0 12px!important;min-height:42px;background:#f1f1f1;border:0!important;border-radius:4px}
.side-teaser [id^="header_"] .logo{width:62px!important}
.side-teaser .list-container{padding:0 12px!important;background:#f1f1f1!important;border-radius:4px}
.side-teaser .list-container-item{font-family:var(--sans)!important;border-color:#dcdcdc!important}
.side-teaser .list-container-item .title,.side-teaser .list-container-item .title a{font:400 13.5px/1.3 var(--sans)!important;color:#0d213e!important}
.side-teaser .list-container-item:hover .title a{color:var(--hover)!important}
.article-partners{margin:18px 0 0}
.article-partners:empty{display:none}
@media(max-width:700px){.article-partners{display:none}}
/* SMI2 names its item headlines «.title» — the page-title plate of the site must not reach them */
.side-teaser .title,.article-partners .title{display:block!important;font:400 13.5px/1.3 var(--sans)!important;background:none!important;padding:0!important;margin:0!important;border-radius:0!important;color:#0d213e!important;letter-spacing:0!important;min-height:0!important}
.side-teaser .title:before,.article-partners .title:before{content:none!important;display:none!important}
.article-partners .title{font-size:14px!important;margin-top:6px!important}
.side-teaser .title a,.article-partners .title a{font:inherit!important;color:inherit!important}
.side-teaser .title a:hover,.article-partners .title a:hover{color:var(--hover)!important}
/* client 10.11 00:01–00:09 «вторичные — разлет большой, крупно всё» + «попробуй наш макет»: the list pages (sections, «Все
   новости», «Все материалы», «Расследования», «Дайджест») stand in the same frame as the article and as on the old site —
   the list (one material per row: photo on the left, the headline beside it), the middle column of modules and the feed
   on the right, down to the bottom. 991–1199 px: the list and one column; phones as before. */
@media(min-width:1200px){
	.list-page{max-width:1540px;margin-inline:auto}
	.list-page .content-grid{grid-template-columns:minmax(0,1fr) clamp(240px,20vw,330px) clamp(280px,23.5vw,400px);gap:20px}
	.list-page .article-mid{display:block}
	.list-page .content-grid>.aside{border:0;padding:0}
	.list-page .news-list:has(>.news-row),.list-page .inv-list{grid-template-columns:1fr}
	.list-page .news-row,.list-page .news-list>.news-row,.list-page .inv-item{grid-template-columns:clamp(170px,14vw,210px) minmax(0,1fr)}
	.list-page .news-row>.photo-frame,.list-page .inv-item>.photo-frame{aspect-ratio:3/2}
}
@media(min-width:991px){
	.list-page .article-side{position:static}
	.list-page .article-side .news-scroll{max-height:none;overflow:visible}
}
.list-page .news-row h2,.list-page .news-list>.news-row h2,.list-page .inv-item h2{font:400 clamp(16px,1.25vw,19px)/1.25 var(--serif);color:#0b1f3c;margin:4px 0 8px}
.article-mid .aside{border:0;padding:0;margin:0 0 16px}
.article-mid .aside-info{margin-top:0}
.aside .article-side{margin-top:16px;position:static}
/* client 10.11 00:19: «тизеры СМИ2 туда вместо наших дублей» — the middle column holds only the teaser block, and it
   rides along while the article is read (sticky), so the column is never an empty strip; «лид — такой шрифт» (the old
   site: Times New Roman italic) and «плашку серую чуть темнее» */
@media(min-width:1200px){.article-mid{position:sticky;top:10px;align-self:start}}
.article-anons{font:italic 400 clamp(17px,1.34vw,20px)/1.45 "Times New Roman",Times,serif;color:#2b2f36;background:#e8e8e8}
.side-teaser .pp-teaser-note{font-size:12px;line-height:1.45;color:#56636f;background:#f1f1f1;border-radius:4px;padding:12px}
/* client 10.11 00:23 «фотку увеличь немного, чтобы текст занимал до низу поле»: the lead photo a bit larger (≈55 % of the
   column), the headline block as tall as the photo — section and headline at the top, the date on the photo's bottom line;
   the photo caption goes under the photo */
@media(min-width:700px){
	.article-head.has-media{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-areas:"media text" "cap .";gap:0 18px;align-items:stretch}
	.article-head.has-media>.article-lead-photo{display:contents}
	.article-head.has-media .article-lead-photo>.photo-frame{grid-area:media;align-self:start}
	.article-head.has-media .article-lead-photo>figcaption{grid-area:cap;margin-top:6px}
	.article-head.has-media>.article-video{align-self:start}
	.article-head.has-media>.article-head-text{display:flex;flex-direction:column;min-width:0}
	.article-head.has-media .article-meta{margin-top:auto;padding-top:10px}
}
@media(min-width:700px){.article-head.has-media h1{font-size:clamp(22px,1.85vw,28px)}}
/* client 10.11 00:24 «серый точно такой найди… без синевы»: the anons box exactly as on the old site — #f0f0f0, text #333 */
.article-anons{background:#f0f0f0;color:#333}
/* client 10.11 00:29 «шрифт ЗАГа чуть уменьшь» (1422 px: 26 → 23.5 px, as the old site's 24 px) */
@media(min-width:700px){.article-head.has-media h1,.article h1{font-size:clamp(20px,1.65vw,25px)}}
/* client 10.11 00:33 «тип шрифта зага… нужен такой же, как на старом сайте»: the old site's article headline is Georgia too,
   but graphite #333 with tight lines (24 px / 1.1); the lead there renders in Times (not Times New Roman) on a Mac */
.article h1{color:#333;line-height:1.12;letter-spacing:0}
@media(min-width:700px){.article-head.has-media h1,.article h1{font-size:clamp(20px,1.69vw,25px)}}
.article-anons{font-family:Times,"Times New Roman",serif}
/* 00:34–00:36 «при наведении подчёркивание не нужно… цветом можно»: headlines on photos change colour only */
.lead:hover h1,.gallery-hero:hover h3,.feature-big:hover h2{text-decoration:none;color:#d4e5fa}
.lead h1,.gallery-hero h3,.feature-big h2{transition:color .2s ease}
/* 00:38 «отступ чуть больше, нет атмосферности, зажато» (the breadcrumbs are gone): air under the header on inner pages */
.page{padding-top:16px}
/* client 10.11 00:53–00:56 «здесь пусть белое остаётся, анимации достаточно; на чёрном фоне синий так себе» (the big home
   photo, the big photo report — «и здесь»): headlines on photos stay white on hover, only the photo zooms */
.lead:hover h1,.gallery-hero:hover h3,.feature-big:hover h2{color:#fff;text-decoration:none}
/* 00:44 «опусти чуток — фото и заг» and 00:50 «заг подопусти, как в старом Пенза Пост»: more air under the header; the
   headline with its date sits in the middle of the photo's height, as on the old site (the date right under it) */
.page{padding-top:20px}
@media(min-width:700px){
	.article-head.has-media>.article-head-text{justify-content:center}
	.article-head.has-media .article-meta{margin-top:12px;padding-top:0}
}
/* client 10.11 00:58 «фото автор у нас внизу, а вверху — ВК и ОК» (the old site): VK and OK under the date in the article
   head; the photo credit after the text in small type */
.head-share{margin-top:12px;min-height:24px}
.article-credits{margin:4px 0 18px;font-size:13px;line-height:1.5;color:#555}
.article-credits p{margin:0 0 4px}
.article-credits:empty{display:none}
/* client 10.11 01:01 «все-таки верхнюю лейбл-планку ещё пошире бы»: the header bar taller again (70 → 84 px on a computer)
   with a larger name; the rates, the weather and the clock a touch larger to match */
.mast{height:84px}
.brand{font-size:clamp(30px,3.15vw,50px)}
.tagline{font-size:12.5px;line-height:1.3}
.util{font-size:14px}
.clock b{font-size:17px}
@media(max-width:1199px){.mast{height:76px}}
@media(max-width:760px){.mast{height:68px}.brand{font-size:29px}}
@media(max-width:650px){.mast{height:64px}.brand{font-size:29px}}
@media(max-width:380px){.brand{font-size:26px}}
@media(max-width:1400px){.tagline{display:none}}
/* client 09.11 23:15 «очень важна мобильная версия»: a shorter footer on phones — the section links in one wrapped row,
   tighter columns; the legal texts under the footer stay complete, in slightly smaller type */
@media(max-width:650px){
	.footer{gap:10px;padding:14px var(--pad) 16px}
	.footcol{padding-bottom:9px}
	.footcol .footlogo{margin-bottom:4px}
	.footcol p{margin:2px 0}
	.footer>.footcol:nth-child(4){display:flex;flex-wrap:wrap;gap:2px 16px}
	.footer>.footcol:nth-child(4) a{display:inline-block;margin:2px 0;font-size:12px}
	.counters{padding:10px var(--pad);gap:6px;font-size:10.5px;line-height:1.3}
}

/* ---------- client 10.11 09:51 / 10:00: row «Выбор редактора» + «Авторский проект» between «Расследования» and the bottom blocks.
   The row is a .bottom-grid too, so its two columns line up with «Последние материалы» / «Фоторепортажи» below. ---------- */
.mid-grid+.bottom-grid{margin-top:12px}
.mid-grid:not(:has(.author-project)){grid-template-columns:1fr}
.editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.editor-card{display:grid;grid-template-columns:38% minmax(0,1fr);gap:10px;min-width:0;align-items:stretch}
.editor-image{position:relative;min-width:0;min-height:96px;overflow:hidden;background:#ececec;border-radius:4px 0 0 4px}
.editor-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .25s ease}
.editor-card:hover .editor-image img{transform:scale(1.05)}
.editor-card>div:not(.editor-image){display:flex;flex-direction:column;min-width:0;background:#f1f1f1;border-radius:0 4px 4px 0;padding:9px 12px}
.editor-card h3{font:700 clamp(15px,1.05vw,17px)/1.18 var(--serif);color:#0b1f3c;margin:0 0 6px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}
.editor-card .muted{margin-top:auto;font-size:11.5px}
.author-project{display:flex;flex-direction:column;min-width:0}
.author-banner{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;color:#fff}
.ab-photo{position:relative;display:block;flex:1 1 auto;min-height:104px;overflow:hidden;background:#0b2a4d;border-radius:4px 4px 0 0}
.ab-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 70%;transition:transform .25s ease}
.author-banner:hover .ab-photo img{transform:scale(1.04)}
.ab-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,29,55,.1) 0%,rgba(6,29,55,.3) 38%,rgba(6,29,55,.6) 60%,rgba(6,29,55,.62) 100%)}
.ab-copy{position:absolute;z-index:1;top:50%;right:2%;width:60%;transform:translateY(-50%);text-align:center;padding:0 8px}
.ab-title{display:block;font:600 clamp(20px,1.75vw,30px)/1.08 var(--sans);letter-spacing:.2px;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.ab-title b{font-weight:800}
.ab-sub{display:block;margin-top:5px;font:600 clamp(11.5px,.85vw,14px)/1.25 var(--sans);color:#f1f1f1;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.ab-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding:8px 12px;background:#f1f1f1;border-radius:0 0 4px 4px;color:#333;font-size:13px;line-height:1.25}
.ab-foot b{white-space:nowrap;color:var(--navy);font-weight:700}
.author-banner:hover .ab-foot b{color:var(--hover)}
@media(min-width:991px) and (max-width:1199px){
	.editor-card{grid-template-columns:36% minmax(0,1fr)}
	.editor-card>div:not(.editor-image){padding:8px 10px}
	.editor-card h3{font-size:14px}
	.editor-card .muted{font-size:10.5px}
}
@media(max-width:990px){
	.mid-grid{gap:12px}
	.ab-photo{flex:none;aspect-ratio:16/5;min-height:0}
}
@media(max-width:600px){
	.editor-grid{grid-template-columns:1fr}
	.ab-photo{aspect-ratio:2.4/1}
	.ab-copy{width:66%;right:1%}
	.ab-title{font-size:21px}
	.ab-sub{font-size:11.5px}
	.ab-foot{font-size:12px;padding:8px 10px}
}

/* ---------- client 10.11 10:39 (his AI's advice on the header): the original Penza Post logotype in white — «The», globe, «PENZA POST»
   and «информационно-аналитический портал» under it (theme/penzapost/img/logo-white.svg from the old logo.svg); ~8% smaller than the
   text logo before; the clock ~12% smaller. The tagline keeps only «Независимое региональное издание» (the portal line is in the logo). ---------- */
.brand-logo{display:block;height:clamp(40px,3.8vw,56px);width:auto;max-width:none}
.clock b{font-size:15px}
@media(max-width:760px){.brand-logo{height:42px}}
@media(max-width:650px){.brand-logo{height:30px}}
@media(max-width:380px){.brand-logo{height:26px}}
@media(max-width:1400px){.tagline{display:none}}
@media(max-width:340px){.brand-logo{height:22px}}

/* client 10.11 10:21 «поярче»: the banner photo brighter (the file itself: brightness/colour up) and a light veil only behind the words;
   a ready-made banner with the words on it (the «крупная надпись» block left empty) is shown whole, uncropped */
.ab-photo:after{background:radial-gradient(ellipse 46% 78% at 69% 50%,rgba(6,29,55,.5) 0%,rgba(6,29,55,.26) 55%,rgba(6,29,55,0) 100%)}
.ab-title{text-shadow:0 1px 3px rgba(0,0,0,.55),0 0 16px rgba(6,29,55,.6)}
.ab-sub{text-shadow:0 1px 3px rgba(0,0,0,.6),0 0 10px rgba(6,29,55,.6)}
.ab-photo:not(:has(.ab-copy)){flex:none;min-height:0;aspect-ratio:auto;background:none}
.ab-photo:not(:has(.ab-copy)) img{position:static;height:auto}
.ab-photo:not(:has(.ab-copy)):after{display:none}

/* client 10.11 ~11:35: his own banner (the words are in the picture, «крупная надпись» and «подпись» blocks empty). The picture keeps its
   proportions; on wide screens the «Выбор редактора» cards stretch to the banner's height so both columns end on one line; when the cards
   are the taller ones, the banner box grows and the picture is cropped at the sides only (the words in the middle stay whole) */
@media(min-width:991px){
	.mid-grid .editor{display:flex;flex-direction:column}
	.mid-grid .editor-grid{flex:1 1 auto}
	.ab-photo:not(:has(.ab-copy)){flex:1 0 auto;background:#1d5fae}
	.ab-photo:not(:has(.ab-copy)) img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
}
.ab-photo:not(:has(.ab-copy)) img{display:block}

/* client 10.11 12:17 «Видео (ссылка)»: VK Видео / Rutube / OK players, a video file, or a link button */
.article-video video{position:absolute;inset:0;width:100%;height:100%;background:#000}
.article-video-link{margin:10px 0 0;font-size:14px}
.article-video-link a{display:inline-block;padding:7px 12px;border-radius:4px;background:#f1f1f1;color:var(--navy);font-weight:700}
.article-video-link a:hover{color:var(--hover)}

/* client 10.11 12:32 «сними попробуй на этих двух окнах серый фон»: the two news next to the main slider without the grey box */
.support>div:not(.support-image){background:none;padding:2px 0 0}
.support>.support-image{border-radius:4px}
/* client 10.11 12:34 «немного растяни лейбл, поле справа пустоватое»: the logo ≈16 % larger where the header has room (phones as before) */
@media(min-width:761px){.brand-logo{height:clamp(40px,4.4vw,64px)}}

/* client 10.11 12:47–12:48 static pages «О нас», «Редакция», «Наше признание», «Соглашение» «в стиль общий страниц сайта»:
   three columns like the lists; the texts keep the old site's markup, its inline look is evened out here */
.static-page.list-page{max-width:1540px}
.static-text.section-text{max-width:none}
.static-text>div[style]{background:none!important;padding:0!important;margin:0!important;border:0!important}
.static-text [style*="font-size"]{font-size:inherit!important}
.static-text [style*="line-height"]{line-height:inherit!important}
.static-text [style*="font-family"]{font-family:inherit!important}
.static-text [style*="color"]:not(a){color:inherit!important}
.static-text p:empty{display:none}
.static-text a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.static-text a:hover{color:var(--hover)}
.static-text p>img:only-child,.static-text>div>p>img{border-radius:4px}
/* «Наше признание»: two in a row, every photo whole on a light tile, a click opens the viewer */
.award-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 1em}
.award-grid .award-item{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;padding:8px;background:#f1f1f1;border-radius:4px;overflow:hidden}
.static-text .award-grid .award-item img{width:100%;height:100%!important;max-width:100%!important;max-height:none;margin:0;object-fit:contain;border-radius:2px;transition:transform .25s}
.award-grid .award-item:hover img{transform:scale(1.03)}
@media(max-width:420px){.award-grid{gap:8px}.award-grid .award-item{padding:5px}}
/* the two term | definition tables of «Пользовательское соглашение»: site look; on a phone every row is a card (term above) */
.static-text table{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:.92em;line-height:1.5}
.static-text td,.static-text th{border:1px solid var(--line-soft);padding:10px 12px;vertical-align:top;overflow-wrap:anywhere;hyphens:auto}
.static-text td:first-child{width:32%;background:#f6f6f6}
.static-text td p{margin:0 0 .5em}.static-text td p:last-child{margin-bottom:0}
@media(max-width:650px){
	.static-text table,.static-text tbody,.static-text tr,.static-text td{display:block;width:auto}
	.static-text tr{border:1px solid var(--line-soft);border-radius:4px;margin-bottom:8px;overflow:hidden}
	.static-text td,.static-text td:first-child{border:0;width:auto;padding:8px 10px}
}
.static-text{min-width:0;overflow-wrap:break-word}
@media(max-width:650px){.static-text{overflow-wrap:anywhere}}

/* ---------- client 10.11 16:32 «Сносим авторский проект. Явно неуклюже он тут висит. Взамен подтягиваем большое фото фоторепов вверх,
   а снизу добавляем один ряд из фотоальбома». One grid under «Расследования»: on the left «Выбор редактора» over «Последние материалы»
   (its scroll box takes the rest of the height), on the right «Фоторепортажи» for the whole height — the big photo and two rows of the
   album (6 on computers and tablets, 4 on phones). Both columns end on one line. ---------- */
@media(min-width:991px){
	.home-grid{grid-template-areas:"editor photos" "latest photos";grid-template-rows:auto 1fr;row-gap:10px}
	.home-grid>.editor{grid-area:editor}
	.home-grid>.latest{grid-area:latest;border-left:0;padding-left:0}
	.home-grid>.photos{grid-area:photos;border-left:1px solid var(--line);padding-left:10px}
}
.home-grid .gallery-small .thumb-link{display:flex}
.home-grid .gallery-small .thumb-link:nth-child(n+7){display:none}
@media(max-width:650px){.home-grid .gallery-small .thumb-link:nth-child(n+5){display:none}}

/* client 10.11 17:05 «подправим верхнюю плашку, тяжеловата она» (after 01:01 «пошире» → 84 px and 12:34 «растяни лейбл»):
   the bar ~17% lower and the logotype ~17% smaller, colours and content as they are */
.mast{height:70px}
@media(min-width:761px){.brand-logo{height:clamp(36px,3.7vw,52px)}}
@media(max-width:1199px){.mast{height:66px}}
@media(max-width:760px){.mast{height:60px}}
@media(max-width:650px){.mast{height:56px}}

/* ---------- client 10.11 19:25 «давай ещё такой вид посмотрим» (his second mockup; the 17:22 variant — a thin navy line, a white
   masthead, «информационно-аналитический портал» next to the logo — is in before-header-1925/): one header row. On the left, on
   white, the original logotype with «информационно-аналитический портал» under it (img/logo-navy-full.svg); on the right a navy panel
   from the edge of the big photo of the home page to the edge of the screen (the row uses the columns of the home page top): rates,
   weather, Moscow time with the date under it, search, menu. Under the row the light grey line of sections (serif, as in the mockup,
   the current one underlined in red). Phones: the short logo on white and a navy corner with search and menu. ---------- */
.top{background:#fff;color:var(--blue)}
.top .mast{--logo-h:clamp(46px,6vw,88px);display:grid;grid-template-columns:minmax(0,1.54fr) minmax(0,1.06fr) minmax(285px,.91fr);column-gap:10px;align-items:stretch;height:calc(var(--logo-h) + 14px);padding:0 var(--pad)}
.top .brand{grid-column:1;align-self:center;justify-self:start;min-width:0}
/* 19:41 «лейбл растащить побольше на поле, чтобы белого справа было меньше от букв Пенза Пост»: the logotype ≈85 % of the white field, the row follows it */
.top .brand-logo{height:var(--logo-h);width:auto;max-width:100%;object-fit:contain;object-position:left center}
.top .util{grid-column:2/-1;position:relative;display:flex;align-items:center;gap:0;margin:0 calc(-1 * var(--pad)) 0 -5px;padding:0 clamp(14px,2.2vw,34px);background:linear-gradient(105deg,#061d36 0%,#0b3055 100%);color:#fff;font-size:clamp(13px,1.05vw,14px);white-space:nowrap}
.top .curr{display:flex;gap:clamp(14px,1.9vw,28px)}
.top .weather{display:inline;border:0;padding:0}
.top .clock{display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1.1;border:0;padding:0}
.top .clock b{font-size:clamp(16px,1.4vw,19px)}
.top .clock small{display:block;font-size:11px;color:#c9d6e3}
.usep{flex:1 1 0;min-width:14px;max-width:84px;align-self:stretch;display:flex;align-items:center;justify-content:center}
.usep:before{content:'';width:1px;height:30px;background:rgba(255,255,255,.28)}
.usep.blank{max-width:none}
.usep.blank:before{content:none}
.util-btns{display:flex;align-items:center;gap:clamp(4px,1vw,14px)}
.top .header-button{color:#fff;padding:6px;line-height:0;font-size:0}
.header-button svg{display:block;width:24px;height:24px}
.top .quicknav{right:clamp(8px,1.2vw,20px)}
.sections{display:flex;background:#f1f1f1;border-top:1px solid #e4e4e4;border-bottom:1px solid #dadada;padding:0 var(--pad)}
.sections a{position:relative;flex:1;display:flex;justify-content:center;font:700 clamp(14px,1.2vw,16px)/1 var(--serif);color:var(--navy);white-space:nowrap}
.sections a+a:before{content:'';position:absolute;left:0;top:50%;height:16px;margin-top:-8px;border-left:1px solid #b9c0c8}
.sections a span{display:block;padding:12px 2px 9px;border-bottom:3px solid transparent}
.sections a:hover span,.sections a.active span{border-bottom-color:var(--red)}
main{padding-top:14px}
@media(max-width:1200px){.top .mast{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(225px,.86fr)}}
@media(max-width:990px){
	.top .mast{--logo-h:clamp(46px,8vw,80px);grid-template-columns:1.4fr 1fr;column-gap:8px}
	.top .util{margin-left:-4px}
	.top .curr,.top .curr+.usep{display:none}
}
@media(min-width:991px) and (max-width:1100px){.top .weather,.top .weather+.usep{display:none}}
@media(max-width:830px){.top .weather,.top .weather+.usep{display:none}}
@media(max-width:900px){
	.sections{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:0}
	.sections::-webkit-scrollbar{display:none}
	.sections a{flex:none;padding:0 14px;font-size:14px}
	.sections a:first-child{padding-left:var(--pad)}
	.sections a:last-child{padding-right:var(--pad)}
}
@media(max-width:650px){
	.top .mast{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;height:56px;padding:0 0 0 15px}
	.top .brand-logo{height:min(30px,calc((100vw - 125px) / 9.23))}
	.top .util{grid-column:2;margin:0;padding:0 8px}
	.top .curr,.top .weather,.top .clock,.top .usep{display:none}
	.top .quicknav{right:8px}
	.sections a:first-child{padding-left:15px}
	.sections a:last-child{padding-right:15px}
	main{padding-top:14px}
}
/* client 10.11 17:53 «коль мы анимировали темы на главной, давай и на вторичных»: the list cards of the inner pages (sections, «Все
   материалы», «Выбор редактора», «ОБЪЕКТИВная Пенза», search…) — the photo grows a little on hover, as on the home page */
.news-row:hover .photo-frame img{transform:scale(1.03)}

/* client 10.11 21:18 «зачернение на главном слайдере уменьши радикально» → 21:2x «с главного фото вообще режим затемнения
   убери»: no darkening layer over the main photo at all (the photo as it is); only the letters of the white headline,
   subtitle and date keep a soft shadow so they stay readable on a light photo. Phones: the text is under the photo anyway.
   21:33 «попробуй низ очень немного затенить, чтобы буквы белые лучше читались от подзаголовка»: only a light shade over
   the lower part of the photo (none at the top, about 20 % behind the subtitle, 42 % at the very bottom) */
.lead:after{display:block;inset:45% 0 0;background:linear-gradient(to bottom,rgba(0,10,20,0) 0%,rgba(0,10,20,.2) 45%,rgba(0,10,20,.42) 100%)}
@media(max-width:650px){.lead:after{display:none}}
.lead-copy h1,.lead-copy p,.lead-copy .muted{text-shadow:0 1px 2px rgba(0,0,0,.8),0 0 8px rgba(0,0,0,.5),0 0 22px rgba(0,0,0,.3)}
.lead-copy .muted{color:#fff}
@media(max-width:650px){.lead-copy h1,.lead-copy p,.lead-copy .muted{text-shadow:none}.lead-copy .muted{color:#e1e7ef}}

/* client 10.11 22:18 «Меняем РАССЛЕДОВАНИЯ на Дайджест. И ставим вторую строчку новостей»: the block shows two rows of cards —
   10 from 1200 px (5 columns), 8 at 991–1199 px (4), 6 on tablets and phones (3 rows of 2; a list below 421 px) */
@media(min-width:1200px){.investigation-grid .investigation-card:nth-child(n+5):nth-child(-n+10){display:flex}}
@media(min-width:991px) and (max-width:1199px){.investigation-grid .investigation-card:nth-child(n+5):nth-child(-n+8){display:flex}}
@media(min-width:421px) and (max-width:990px){.investigation-grid .investigation-card:nth-child(n+5):nth-child(-n+6){display:flex}}
@media(max-width:420px){.investigation-grid .investigation-card:nth-child(n+5):nth-child(-n+6){display:grid}}