/* MB Gazeta editorial refresh: loaded after the original Layers theme styles. */
:root {
  --mbg-ink: #202b36;
  --mbg-muted: #687584;
  --mbg-paper: #f5f7f9;
  --mbg-card: #ffffff;
  --mbg-line: #e2e8ee;
  --mbg-accent: #147d83;
  --mbg-accent-dark: #0e6269;
  --mbg-radius: 12px;
  --mbg-shadow: 0 8px 26px rgba(28, 48, 66, .08);
}
html { scroll-behavior: smooth; }
body { background: var(--mbg-paper); color: var(--mbg-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; font-size: 17px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
a { color: var(--mbg-accent-dark); text-decoration-thickness: 1px; text-underline-offset: .16em; }
a:hover, a:focus { color: var(--mbg-accent); }
.wrapper-site { background: var(--mbg-paper); }
.header-site { background: #e9f1f2; box-shadow: 0 1px 0 var(--mbg-line); }
.header-site .container { max-width: 1280px; }
.header-site .container.header-block { box-sizing: border-box; padding: 18px 32px !important; }
.header-site .logo { padding: 0; }
.header-site .sitename, .header-site .sitetitle { color: var(--mbg-ink); font-weight: 750; letter-spacing: -.035em; }
.header-site .nav a { color: var(--mbg-ink); font-size: 14px; font-weight: 650; letter-spacing: .01em; }
.header-site .nav a:hover, .header-site .nav .current-menu-item > a { color: var(--mbg-accent); }
.wrapper-content { padding-bottom: 48px; }
.wrapper-content > .container, .wrapper-content .container { max-width: 1240px; }
.widget { margin-bottom: 30px; }
.section-title { margin-bottom: 22px; }
.section-title .heading { color: var(--mbg-ink); font-size: clamp(25px, 3vw, 36px); font-weight: 760; letter-spacing: -.04em; line-height: 1.2; }
.layers-post-widget .grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.layers-post-widget .layers-masonry-column { float: none; width: auto; max-width: none; margin: 0; min-width: 0; }
.layers-post-widget .thumbnail { display: flex; flex-direction: column; height: 100%; }
.layers-post-widget .thumbnail-body { flex: 1 0 auto; }
.layers-post-widget .thumbnail-body .button { display: none !important; }
.layers-post-widget .thumbnail-body .meta-info .meta-item:not(.meta-tags) { display: none !important; }
.layers-post-widget .thumbnail-body .meta-info { margin-top: 12px; }
.thumbnail { overflow: hidden; border: 1px solid var(--mbg-line); border-radius: var(--mbg-radius); background: var(--mbg-card); box-shadow: 0 2px 8px rgba(28,48,66,.035); transition: transform .2s ease, box-shadow .2s ease; }
.thumbnail:hover { transform: translateY(-3px); box-shadow: var(--mbg-shadow); }
.thumbnail-media { overflow: hidden; background: #e8eef1; }
.thumbnail-media img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .35s ease; }
.thumbnail:hover .thumbnail-media img { transform: scale(1.025); }
.thumbnail-body { padding: 19px 20px 21px; }
.thumbnail-body .overlay { padding: 0; background: transparent; }
.thumbnail .article-title .heading { margin: 0 0 10px; font-size: 19px; font-weight: 720; letter-spacing: -.025em; line-height: 1.38; }
.thumbnail .article-title a { color: var(--mbg-ink); text-decoration: none; }
.thumbnail .article-title a:hover { color: var(--mbg-accent-dark); }
.thumbnail .excerpt { color: var(--mbg-muted); font-size: 15px; line-height: 1.55; }
.article { max-width: 820px; margin-inline: auto; }
.article-title h1, .single .article-title .heading { color: var(--mbg-ink); font-size: clamp(32px, 5vw, 52px); font-weight: 780; letter-spacing: -.045em; line-height: 1.12; }
.article-content, .article-body { color: #354352; font-size: 19px; line-height: 1.8; }
.article-content h2, .article-body h2 { margin-top: 1.7em; color: var(--mbg-ink); font-size: 1.5em; line-height: 1.25; }
.article-content img, .article-body img { height: auto; border-radius: 8px; }
input, select, textarea { max-width: 100%; border: 1px solid #ccd6de; border-radius: 8px; padding: 11px 13px; font: inherit; }
button, input[type="submit"], .button, a.button { border-radius: 8px; background: var(--mbg-accent-dark); color: #fff; font-weight: 650; }
button:hover, input[type="submit"]:hover, .button:hover, a.button:hover { background: var(--mbg-accent); color: #fff; }
img, iframe, video { max-width: 100%; }
@media (max-width: 900px) {
  .layers-post-widget .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  body { font-size: 16px; }
  .header-site .container.header-block { padding: 12px 18px !important; }
  .header-site .logo { padding: 0; }
}
@media (max-width: 600px) {
  .layers-post-widget .container.list-grid { box-sizing: border-box; padding-left: 8px !important; padding-right: 8px !important; }
  .layers-post-widget .container.list-grid > .grid { margin-left: 0; margin-right: 0; }
  .layers-post-widget .layers-masonry-column { width: auto; max-width: none; margin-left: 0; margin-right: 0; }
  .layers-post-widget .grid { grid-template-columns: 1fr; gap: 15px; }
  .thumbnail-body { padding: 16px; }
  .thumbnail .article-title .heading { font-size: 18px; }
  .article-content, .article-body { font-size: 17px; line-height: 1.72; }
  .section-title { margin-bottom: 16px; }
  .wrapper-content { padding-bottom: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}


/* Improve contrast on the site's navy "Советы" cards and other inverted cards. */
.thumbnail.invert .thumbnail-body { color: #fff; }
.thumbnail.invert .thumbnail-body .overlay { color: #fff; background: transparent; }
.thumbnail.invert .thumbnail-body .article-title .heading,
.thumbnail.invert .thumbnail-body .article-title a,
.thumbnail.invert .thumbnail-body .excerpt,
.thumbnail.invert .thumbnail-body .meta-info,
.thumbnail.invert .thumbnail-body .meta-info a { color: #fff !important; }
.thumbnail.invert .thumbnail-body .excerpt { opacity: .9; }
.thumbnail.invert .thumbnail-body .article-title a:hover,
.thumbnail.invert .thumbnail-body .meta-info a:hover { color: #d7f1f2 !important; }

/* Keep the mobile off-canvas menu readable against its light panel. */
#off-canvas-right { background: #fff; color: var(--mbg-ink); }
#off-canvas-right a, #off-canvas-right .close-canvas { color: var(--mbg-ink); }
#off-canvas-right .menu-item a { border-bottom: 1px solid var(--mbg-line); }
#off-canvas-right .menu-item a:hover, #off-canvas-right .menu-item.current-menu-item > a { color: var(--mbg-accent-dark); background: #f3f7f8; }
#off-canvas-right .close-canvas { opacity: .8; }
