@font-face { font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/lora-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/lora-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/playfair-display-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("../fonts/playfair-display-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
--ink: #111;
--muted: #6b6b6b;
--line: #e6e6e6;
--bg: #fff;
--soft: #f6f6f4;
--accent: #ef2673;
--serif: "Lora", Georgia, "Times New Roman", serif;
--display: "Playfair Display", Georgia, "Times New Roman", serif;
--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
--wrap: 1200px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 17px/1.65 var(--serif); }
img, video, iframe { max-width: 100%; height: auto; }
a { color: inherit; text-decoration-color: rgba(0, 0, 0, .3); text-underline-offset: 2px; }
@media (hover: hover) { a:hover { color: var(--accent); } }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 400; line-height: 1.25; margin: 0 0 .5em; }
ul, ol { padding-left: 1.2em; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -9999px; top: 0; background: #000; color: #fff; padding: 8px 12px; z-index: 100; }
.skip:focus { left: 8px; top: 8px; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 15px; }
.wrap--narrow { max-width: var(--wrap); }
/* Header */
.site-header { border-bottom: 1px solid var(--line); background: var(--bg); }
.site-header__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 125px; padding-top: 30px; gap: 10px; }
.site-header__logo { text-align: center; grid-column: 2; grid-row: 1; line-height: 0; }
.site-header__logo img, .custom-logo { height: 100px; width: auto; max-height: none; display: inline-block; }
.site-header__left { grid-column: 1; grid-row: 1; justify-self: start; }
.site-header__right { grid-column: 3; grid-row: 1; justify-self: end; display: flex; align-items: center; gap: 4px; }
.header-social { display: none; align-items: center; gap: 12px; margin-right: 10px; }
.header-social a { display: inline-flex; padding: 4px; color: #3b5998; }
.header-social a + a { color: #bc2a8d; }
.header-social a:hover { opacity: .7; }
.nav-toggle, .search-toggle { background: none; border: 0; padding: 12px; cursor: pointer; color: inherit; }
.nav-toggle__bar, .nav-toggle__bar::before, .nav-toggle__bar::after { display: block; width: 20px; height: 2px; background: currentColor; position: relative; }
.nav-toggle__bar::before, .nav-toggle__bar::after { content: ""; position: absolute; left: 0; }
.nav-toggle__bar::before { top: -6px; }
.nav-toggle__bar::after { top: 6px; }
.header-search { border-top: 1px solid var(--line); padding: 14px 0; }
.primary-nav { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.drawer-head { display: none; }
.primary-nav .menu { list-style: none; margin: 0; padding: 0; }
.primary-nav a { display: block; padding: 10px 0; text-decoration: none; font: 600 12px var(--display); text-transform: uppercase; }
.primary-nav .sub-menu { list-style: none; padding-left: 16px; margin: 0; }
.primary-nav .sub-menu a { font-weight: 400; text-transform: none; letter-spacing: 0; }
@media (min-width: 900px) {
.nav-toggle { display: none; }
.header-social { display: flex; }
.primary-nav { display: block; }
.primary-nav .menu { display: flex; justify-content: center; gap: 28px; }
.primary-nav .menu > li { position: relative; }
.primary-nav a { padding: 0; line-height: 34px; }
.primary-nav .sub-menu { display: none; position: absolute; top: 100%; left: -16px; min-width: 220px; background: var(--bg); border: 1px solid var(--line); padding: 8px 16px; z-index: 20; }
.primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu { display: block; }
}
/* Banner */
.banner { text-align: center; margin: 30px auto 0; max-width: var(--wrap); padding: 0 15px; }
.banner__img { max-width: 728px; width: 100%; height: auto; display: inline-block; }
/* Layout */
.site-main { padding: 27px 0 60px; }
.layout { display: grid; gap: 30px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .layout { grid-template-columns: minmax(0, 1fr) 370px; gap: 30px; } }
.grid { display: grid; gap: 34px 30px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Cards */
.card__img { display: block; background: var(--soft); aspect-ratio: 3 / 2; overflow: hidden; }
.card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card__body { padding-top: 14px; }
.meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.cats { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 10px; }
.cats a { display: inline-block; padding: 6px 0; text-decoration: none; color: var(--ink); } /* 24 px tall tap area */
.cats a:hover { color: var(--accent); }
.card__title { font-size: 23px; margin: 10px 0 10px; }
.card__title a { text-decoration: none; }
.card__excerpt { margin: 0; color: #444; font-size: 15px; line-height: 1.55; }
/* Archive heads */
.archive-head { margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.archive-head h1 { font-size: 34px; margin: 0; }
.archive-head__desc { color: var(--muted); margin-top: 8px; }
.more { text-align: center; margin-top: 40px; }
.btn, .search-form button, .comment-form .submit, .cookie__btn { display: inline-block; background: var(--ink); color: #fff; border: 0; padding: 12px 22px; font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; text-decoration: none; cursor: pointer; }
.btn:hover, .search-form button:hover, .comment-form .submit:hover { background: var(--accent); color: #fff; }
/* Pagination */
.pagination { margin-top: 44px; font: 600 14px var(--sans); }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.pagination .page-numbers { padding: 8px 14px; border: 1px solid var(--line); text-decoration: none; }
.pagination .current { background: var(--ink); color: #fff; border-color: var(--ink); }
/* Sidebar */
.widget { margin-bottom: 36px; }
.widget__title { display: flex; align-items: center; gap: 14px; font: 600 12px var(--display); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 20px; }
.widget__title::before, .widget__title::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.widget__list { list-style: none; margin: 0; padding: 0; }
.widget__list li { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.4; }
.mini { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 14px; align-items: start; margin-bottom: 20px; }
.mini__img { display: block; width: 90px; height: 90px; background: var(--soft); overflow: hidden; }
.mini__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mini__title { font: 400 16px/1.35 var(--display); margin: 4px 0 0; }
.mini__title a { text-decoration: none; }
.mini .cats { font: 600 10px var(--sans); text-transform: uppercase; letter-spacing: .05em; }
.widget__list a { text-decoration: none; }
/* Breadcrumbs */
.crumbs ol { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; font: 13px var(--sans); color: var(--muted); }
.crumbs li + li::before { content: "›"; margin-right: 4px; }
.crumbs a { text-decoration: none; }
/* Single */
.post { min-width: 0; }
.post__head { margin-bottom: 22px; }
.post__title { font-size: 38px; font-weight: 400; margin: 10px 0 14px; }
@media (min-width: 900px) { .post__title { font-size: 44px; } }
.post__meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font: 13px var(--sans); color: var(--muted); }
.post__meta a { text-decoration: none; }
.post__figure { margin: 0 0 28px; }
.post__figure img { width: 100%; display: block; }
.post__figure figcaption, .entry figcaption { font: 13px var(--sans); color: var(--muted); margin-top: 8px; }
.entry { font-size: 19px; line-height: 1.75; overflow-wrap: break-word; }
.entry > * { margin-top: 0; margin-bottom: 1.3em; }
.entry h2 { font-size: 28px; margin-top: 1.6em; }
.entry h3 { font-size: 23px; margin-top: 1.4em; }
.entry blockquote { margin: 1.5em 0; padding: 0 0 0 20px; border-left: 3px solid var(--ink); font-style: italic; }
.entry img, .entry .wp-block-image img { height: auto; }
.entry .alignwide, .entry .alignfull { max-width: 100%; }
.entry iframe { width: 100%; }
.entry table { width: 100%; border-collapse: collapse; font-size: 16px; }
.entry td, .entry th { border: 1px solid var(--line); padding: 8px; }
.share { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin: 34px 0 18px; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font: 600 13px var(--sans); }
.share a { text-decoration: none; padding: 6px 12px; border: 1px solid var(--line); }
.share a:hover { border-color: var(--ink); }
.tags { list-style: none; padding: 0; margin: 0 0 30px; display: flex; flex-wrap: wrap; gap: 8px; font: 13px var(--sans); }
.tags a { text-decoration: none; background: var(--soft); padding: 4px 10px; display: inline-block; }
.related { margin-top: 50px; }
.related h2 { font-size: 24px; }
/* Pages, 404 */
.page__title { font-size: 40px; }
.notfound { padding: 40px 0 20px; max-width: 640px; }
.notfound h1 { font-size: 40px; }
/* Forms */
.search-form { display: flex; gap: 0; max-width: 560px; }
.search-form input[type=search] { flex: 1; min-width: 0; border: 1px solid #ccc; border-right: 0; padding: 11px 14px; font: 16px var(--sans); }
input[type=text], input[type=email], input[type=url], textarea { width: 100%; border: 1px solid #ccc; padding: 10px 12px; font: 16px var(--sans); }
label { font: 600 13px var(--sans); }
/* Comments */
.comments { margin-top: 50px; }
.comments__title, .comment-reply-title { font-size: 24px; }
.comment-list { list-style: none; padding: 0; }
.comment-list .children { list-style: none; padding-left: 24px; }
.comment-body { padding: 14px 0; border-bottom: 1px solid var(--line); font: 15px/1.5 var(--sans); }
/* Footer */
.social-bar { background: #fdecec; padding: 36px 0; margin-top: 10px; }
.social-bar__row { display: flex; justify-content: space-around; flex-wrap: wrap; gap: 20px; max-width: 900px; }
.social-bar a { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 600 12px var(--display); text-transform: uppercase; letter-spacing: .06em; }
.site-footer { background: var(--bg); text-align: center; padding-top: 50px; font: 14px/1.7 var(--sans); }
.site-footer__logo .custom-logo, .site-footer__logo img { max-height: 90px; }
.menu--footer { list-style: none; padding: 0; margin: 38px 0 20px; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 20px; }
.menu--footer a { text-decoration: none; color: #e5195f; font: 400 13px var(--display); text-transform: uppercase; letter-spacing: .05em; }
.menu--footer a:hover { color: var(--ink); }
.site-footer__text { color: #5f5656; max-width: 1100px; margin: 0 auto; font: 12px/1.75 var(--display); text-transform: uppercase; letter-spacing: .04em; }
.site-footer__text p { margin: 0 0 8px; }
.site-footer__bottom { margin-top: 44px; padding: 20px 0 26px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
/* Cookie note */
.cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: #111; color: #fff; padding: 12px 20px; display: flex; gap: 16px; align-items: center; justify-content: center; font: 14px var(--sans); }
.cookie[hidden] { display: none; }
.cookie a { color: #fff; }
.cookie__btn { background: #fff; color: #111; padding: 8px 16px; }
.cookie__btn--no { background: transparent; color: #fff; border: 1px solid #fff; }
/* Contact Form 7 */
.wpcf7 p { margin: 0 0 16px; }
.wpcf7 input[type=text], .wpcf7 input[type=email], .wpcf7 textarea { width: 100%; }
.wpcf7 textarea { min-height: 160px; }
.wpcf7-submit { background: var(--ink); color: #fff; border: 0; padding: 12px 26px; font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; cursor: pointer; }
.wpcf7-not-valid-tip, .wpcf7-response-output { font: 14px var(--sans); }
/* Mobile: slide-in drawer instead of an inline menu */
@media (max-width: 899px) {
.site-header__row { height: 72px; padding-top: 0; }
.site-header__logo img, .custom-logo { height: 54px; }
.primary-nav { position: fixed; top: 0; left: 0; bottom: 0; width: 280px; max-width: 85vw; background: #fff; z-index: 100; transform: translateX(-100%); transition: transform .25s ease; overflow-y: auto; border: 0; padding: 20px; visibility: hidden; }
.primary-nav.is-open { transform: none; visibility: visible; }
.primary-nav .wrap { padding: 0; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.drawer-head .custom-logo { height: 42px; }
.drawer-close { background: #222; color: #fff; border: 0; width: 28px; height: 28px; font-size: 20px; line-height: 1; cursor: pointer; }
.primary-nav .menu > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.primary-nav .menu > li > a { flex: 1; padding: 14px 0; font: 600 17px var(--serif); text-transform: none; letter-spacing: 0; }
.primary-nav .sub-menu { display: none; width: 100%; padding: 0 0 8px 12px; }
.primary-nav li.is-expanded > .sub-menu { display: block; }
.primary-nav .sub-menu a { padding: 8px 0; font: 400 15px var(--serif); }
.submenu-toggle { background: none; border: 1px solid var(--line); width: 28px; height: 28px; cursor: pointer; font-size: 12px; }
.drawer-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 90; }
.drawer-overlay[hidden] { display: none; }
body.drawer-open { position: fixed; left: 0; right: 0; width: 100%; overflow: hidden; }
.primary-nav { overscroll-behavior: contain; }
}
@media (min-width: 900px) { .submenu-toggle { display: none; } }
/* Sticky bar that slides in after scrolling past the header */
.sticky-bar { position: fixed; top: 0; left: 0; right: 0; height: 40px; z-index: 60; background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, .12); display: flex; align-items: center; gap: 14px; padding: 0 12px; transform: translateY(-110%); transition: transform .2s ease; }
.sticky-bar.is-on { transform: none; }
.sticky-bar__menu { display: flex; gap: 20px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; flex: 1; }
.sticky-bar__menu::-webkit-scrollbar { display: none; }
.sticky-bar__menu a { font: 600 12px var(--display); text-transform: uppercase; text-decoration: none; padding: 12px 0; }
.sticky-bar .nav-toggle { display: inline-block; padding: 8px; }
.sticky-bar__social { display: none; gap: 10px; }
@media (min-width: 900px) {
.sticky-bar { justify-content: center; }
.sticky-bar .nav-toggle { display: none; }
.sticky-bar__menu { flex: 0 1 auto; justify-content: center; overflow: visible; }
.sticky-bar__social { display: flex; position: absolute; right: 20px; }
}
/* Magazine home */
.hero { display: grid; gap: 24px; margin-top: 8px; }
@media (min-width: 900px) { .hero { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 30px; } }
.hero__img { display: block; background: var(--soft); overflow: hidden; aspect-ratio: 3 / 2; }
.hero__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero__body { padding-top: 16px; }
.hero__title { font-size: 34px; margin: 10px 0; }
@media (min-width: 900px) { .hero__title { font-size: 40px; } }
.hero__title a, .hero__subtitle a { text-decoration: none; }
.hero__excerpt { color: #444; font-size: 17px; margin: 0; }
.hero__side { display: grid; gap: 24px; align-content: start; }
@media (min-width: 640px) and (max-width: 899px) { .hero__side { grid-template-columns: 1fr 1fr; } }
.hero__item .cats { margin-top: 12px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .05em; }
.hero__subtitle { font-size: 21px; margin: 8px 0 0; }
.topics-bar { display: flex; align-items: center; gap: 14px; margin: 34px 0 10px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.topics-bar::-webkit-scrollbar { display: none; }
.topics-bar__label { font: 700 12px var(--display); text-transform: uppercase; letter-spacing: .08em; flex: none; }
.topics { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.topics-bar .topics { flex-wrap: nowrap; }
.topics a { display: inline-block; white-space: nowrap; padding: 6px 14px; border: 1px solid var(--line); border-radius: 20px; text-decoration: none; font: 600 12px var(--sans); }
.topics a:hover { border-color: var(--ink); color: var(--ink); }
.block { margin-bottom: 46px; }
.block__head { display: flex; align-items: baseline; justify-content: space-between; border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin-bottom: 22px; gap: 10px; }
.block__title { font: 700 20px var(--display); margin: 0; }
.block__more { font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .06em; text-decoration: none; white-space: nowrap; }
.block__grid { display: grid; gap: 26px; }
@media (min-width: 640px) { .block__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 30px; } }
.block__list .mini { margin-bottom: 20px; }
.block__list .mini:last-child { margin-bottom: 0; }
.lead-card { margin-bottom: 36px; }
.lead-card .card__title { font-size: 32px; }
.archive-topics { margin: -6px 0 26px; }
/* Article page: centered header, share rail on the left, no sidebar (as on the old site) */
.single__head { text-align: center; max-width: 920px; margin: 10px auto 34px; }
.single__meta { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 14px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.single__meta .cats { justify-content: center; }
.single__title { font-size: 34px; line-height: 1.15; margin: 18px 0 16px; }
@media (min-width: 700px) { .single__title { font-size: 48px; } }
@media (min-width: 1100px) { .single__title { font-size: 56px; } }
.single__by { font: 11px var(--sans); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.single__by a { color: var(--accent); text-decoration: none; }
.single__updated { text-transform: none; }
.single__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 0 15px; }
.share-rail { display: flex; gap: 10px; justify-content: center; }
.share-rail__btn { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; }
.share-rail__btn:hover { color: #fff; opacity: .85; }
.share--fb { background: #3b5998; }
.share--tg { background: #229ed9; }
.share--wa { background: #25d366; }
.share--x { background: #111; }
.share--c { background: #222; }
.single__body { min-width: 0; }
@media (min-width: 1100px) {
.single__grid { grid-template-columns: 1fr minmax(0, 870px) 1fr; gap: 0 30px; }
.share-rail { flex-direction: column; justify-self: end; align-self: start; position: sticky; top: 90px; margin-right: 6px; }
}
.entry a { color: var(--accent); }
.entry a:hover { color: var(--ink); }
.entry { font-size: 17px; line-height: 1.85; }
.entry p.has-initial { position: relative; }
@media (min-width: 700px) {
.entry p.has-initial::before { content: attr(data-initial); position: absolute; left: -6px; top: -26px; font: 400 150px/1 var(--display); color: #ebebeb; z-index: -1; pointer-events: none; }
.entry { isolation: isolate; }
}
.grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 899px) { .grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .grid--three { grid-template-columns: 1fr; } }
/* Reading progress inside the sticky bar */
.sticky-bar__progress { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--accent); }
/* Endless scroll */
.feed-divider { display: flex; align-items: center; gap: 16px; max-width: 1170px; margin: 60px auto 40px; padding: 0 15px; font: 700 12px var(--display); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
.feed-divider::before, .feed-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.feed-status { text-align: center; padding: 20px; font: 14px var(--sans); color: var(--muted); }
.feed-sentinel { height: 1px; }
/* Home: latest-news column next to the top story */
.hero__side-title { font: 700 13px var(--display); text-transform: uppercase; letter-spacing: .08em; border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin: 0 0 18px; }
.hero__side .mini { margin-bottom: 16px; }
.hero__side .mini:last-child { margin-bottom: 0; }
.mini--time .meta { font-size: 10px; }
/* Sticky bar: dropdown for Categories, search, same look as the old site */
.sticky-bar__item { position: relative; display: flex; align-items: center; }
.sticky-bar__item.has-sub > a::after { content: ""; display: inline-block; width: 5px; height: 5px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); margin: 0 0 3px 6px; }
.sticky-bar__dropdown { display: none; position: absolute; top: 100%; left: -14px; min-width: 220px; background: #fff; border: 1px solid var(--line); box-shadow: 0 6px 18px rgba(0, 0, 0, .1); padding: 8px 14px; z-index: 5; }
.sticky-bar__dropdown a { display: block; padding: 6px 0; font: 400 14px var(--serif); text-transform: none; white-space: nowrap; }
@media (min-width: 900px) { .sticky-bar__item.has-sub:hover .sticky-bar__dropdown { display: block; } }
.sticky-bar__search { background: none; border: 0; padding: 8px; cursor: pointer; color: inherit; display: inline-flex; margin-left: auto; }
@media (min-width: 900px) { .sticky-bar__search { position: absolute; right: 16px; margin: 0; } .sticky-bar__social { right: 52px; } }
.sticky-bar__panel { position: absolute; top: 100%; left: 0; right: 0; display: flex; gap: 0; background: #fff; padding: 12px 15px; box-shadow: 0 6px 12px rgba(0, 0, 0, .1); }
.sticky-bar__panel[hidden] { display: none; }
.sticky-bar__panel input { flex: 1; min-width: 0; border: 1px solid #ccc; border-right: 0; padding: 9px 12px; font: 16px var(--sans); }
.sticky-bar__panel button { background: var(--ink); color: #fff; border: 0; padding: 0 20px; font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; cursor: pointer; }
@media (min-width: 900px) { .primary-nav .menu > li.menu-item-has-children > a::after { content: ""; display: inline-block; width: 5px; height: 5px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); margin: 0 0 3px 6px; } }
/* Mega menu */
.mega { display: none; background: #fff; }
.mega__title { font: 700 12px var(--display); text-transform: uppercase; letter-spacing: .08em; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 2px solid var(--accent); }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega li a { display: block; padding: 5px 0; font: 400 15px var(--serif); text-transform: none; letter-spacing: 0; line-height: 1.35; text-decoration: none; }
.mega li a:hover { color: var(--accent); }
.mega__feature { display: none; text-decoration: none; }
@media (min-width: 900px) {
.primary-nav { position: relative; }
.primary-nav .menu > li.has-mega { position: static; }
.primary-nav li.has-mega:hover > .mega, .primary-nav li.has-mega:focus-within > .mega { display: block; }
.primary-nav .mega, .sticky-bar__mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 40; border-top: 1px solid var(--line); box-shadow: 0 14px 28px rgba(0, 0, 0, .12); }
.mega__inner { max-width: var(--wrap); margin: 0 auto; padding: 30px 15px 34px; display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 34px; }
.mega__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; }
.mega__feature { display: block; position: relative; overflow: hidden; background: var(--soft); aspect-ratio: 4 / 5; }
.mega__feature img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.mega__feature:hover img { transform: scale(1.04); }
.mega__label { position: absolute; left: 14px; top: 14px; background: var(--accent); color: #fff; font: 700 10px var(--sans); text-transform: uppercase; letter-spacing: .08em; padding: 4px 8px; }
.mega__headline { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 16px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .75)); color: #fff; font: 400 18px/1.25 var(--display); }
.sticky-bar__item.has-sub { position: static; }
.sticky-bar__item.has-sub:hover > .sticky-bar__mega { display: block; }
.sticky-bar__mega { background: #fff; }
}
/* in the drawer the groups are stacked */
@media (max-width: 899px) {
.primary-nav li.is-expanded > .mega { display: block; width: 100%; padding: 4px 0 10px 12px; }
.mega__inner, .mega__cols { display: block; }
.mega__col { margin-bottom: 14px; }
.mega__title { font-size: 11px; border: 0; color: var(--muted); margin-bottom: 4px; padding: 0; }
.mega li a { font-size: 15px; padding: 6px 0; }
}
.mega__sub { margin-top: 12px; padding: 6px 0 2px; font: 600 10px var(--sans); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
/* Contact and advertising pages */
.page-hero { text-align: center; max-width: 820px; margin: 10px auto 44px; }
.page-hero__title { font-size: 40px; margin: 0 0 16px; }
@media (min-width: 900px) { .page-hero__title { font-size: 54px; } }
.page-hero__lead { font-size: 19px; line-height: 1.6; color: #444; margin: 0 0 22px; }
.contact-layout { display: grid; gap: 34px; margin-bottom: 40px; }
@media (min-width: 900px) { .contact-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 50px; align-items: start; } }
.contact-cards { display: grid; gap: 18px; }
.contact-card { border: 1px solid var(--line); padding: 24px 26px; background: #fff; }
.contact-card h2 { font-size: 22px; margin: 0 0 8px; }
.contact-card p { margin: 0 0 8px; font-size: 16px; color: #444; }
.contact-card p:last-child { margin-bottom: 0; }
.contact-card__mail { font: 600 20px var(--display); color: var(--accent); text-decoration: none; word-break: break-all; }
.contact-card__link { font: 600 14px var(--sans); text-decoration: none; color: var(--accent); }
.contact-card__social { display: flex; gap: 18px; font: 600 14px var(--sans); }
.contact-form { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 34px 32px 36px; box-shadow: 0 14px 40px rgba(0, 0, 0, .06); }
.contact-form h2 { font-size: 28px; margin: 0 0 22px; }
.contact-form--wide { max-width: 860px; margin: 56px auto 20px; }
.contact-form p { margin: 0 0 10px; }
.contact-form form { margin: 0; }
.contact-form label { display: block; font: 600 13px var(--sans); color: #222; margin-bottom: 20px; letter-spacing: .01em; }
.contact-form .req { color: var(--accent); margin-left: 3px; }
.contact-form .wpcf7-form-control-wrap { display: block; margin-top: 8px; }
.contact-form input[type=text], .contact-form input[type=email], .contact-form select, .contact-form textarea { display: block; width: 100%; min-height: 52px; border: 1px solid #dcdcdc; background: #fafafa; padding: 14px 16px; font: 400 16px var(--sans); color: var(--ink); border-radius: 6px; box-shadow: none; transition: border-color .15s, background .15s, box-shadow .15s; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #9a9a9a; }
.contact-form input:hover, .contact-form select:hover, .contact-form textarea:hover { border-color: #b8b8b8; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline: 0; background: #fff; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(17, 17, 17, .08); }
.contact-form select { appearance: none; -webkit-appearance: none; padding-right: 44px; background-image: url("data:image/svg+xml;utf8,"); background-repeat: no-repeat; background-position: right 18px center; cursor: pointer; }
.contact-form textarea { min-height: 170px; resize: vertical; line-height: 1.5; }
.contact-form .cf-row { display: grid; gap: 0 20px; }
@media (min-width: 640px) { .contact-form .cf-row { grid-template-columns: 1fr 1fr; } }
.cf-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 4px; }
.cf-note { font: 13px/1.4 var(--sans); color: var(--muted); }
.contact-form input[type=submit] { background: var(--ink); color: #fff; border: 0; border-radius: 6px; padding: 16px 34px; min-height: 52px; font: 600 13px var(--sans); text-transform: uppercase; letter-spacing: .09em; cursor: pointer; transition: background .15s, transform .15s; }
.contact-form input[type=submit]:hover { background: var(--accent); }
.contact-form input[type=submit]:active { transform: translateY(1px); }
@media (max-width: 639px) { .contact-form { padding: 24px 18px 26px; } .contact-form input[type=submit] { width: 100%; } }
.contact-form .wpcf7-spinner { display: none; }
.wpcf7-not-valid-tip { color: #b3002d; font: 13px var(--sans); margin-top: 6px; display: block; }
.contact-form input.wpcf7-not-valid, .contact-form textarea.wpcf7-not-valid { border-color: #b3002d; background: #fff8f9; }
.contact-form .wpcf7-response-output { margin: 20px 0 0 !important; padding: 14px 16px !important; font: 14px/1.4 var(--sans); border-radius: 6px; border: 1px solid #dcdcdc !important; }
.contact-form .wpcf7-mail-sent-ok { border-color: #1b8a4b !important; background: #f2fbf6; color: #14663a; }
.contact-form .wpcf7-validation-errors, .contact-form .wpcf7-mail-sent-ng, .contact-form .wpcf7-spam-blocked { border-color: #b3002d !important; background: #fff8f9; color: #8a0023; }
.stats { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 56px; }
@media (min-width: 900px) { .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; } }
.stat { border-top: 2px solid var(--ink); padding: 16px 4px 0; }
.stat strong { display: block; font: 400 26px/1.15 var(--display); }
.stat span { display: block; margin-top: 6px; font: 13px/1.4 var(--sans); color: var(--muted); }
.ads-section { max-width: 960px; margin: 0 auto 50px; }
.ads-section h2 { font-size: 30px; margin-bottom: 20px; }
.formats { display: grid; gap: 20px; }
@media (min-width: 800px) { .formats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.format { border: 1px solid var(--line); padding: 24px; }
.format h3 { font-size: 21px; margin: 0 0 10px; }
.format p { margin: 0; font-size: 16px; color: #444; }
.ads-note { margin-top: 16px; font: 14px var(--sans); color: var(--muted); }
.steps { list-style: none; padding: 0; margin: 0; counter-reset: step; display: grid; gap: 18px; }
@media (min-width: 800px) { .steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.steps li { counter-increment: step; position: relative; padding-top: 44px; font-size: 16px; line-height: 1.5; }
.steps li::before { content: counter(step); position: absolute; top: 0; left: 0; width: 32px; height: 32px; border-radius: 50%; background: var(--accent); color: #fff; font: 600 15px/32px var(--sans); text-align: center; }
.ads-rules ul { padding-left: 1.2em; font-size: 16px; line-height: 1.7; }
.ads-rules code { background: var(--soft); padding: 1px 6px; font-size: .9em; }
/* Previous / next article: boxed, with arrows */
.post-nav { display: grid; border: 1px solid var(--line); margin: 44px 0 30px; }
@media (min-width: 700px) { .post-nav { grid-template-columns: 1fr 1fr; } }
.post-nav__item { display: flex; align-items: center; gap: 22px; padding: 26px 28px; text-decoration: none; color: var(--ink); min-width: 0; }
.post-nav__item svg { flex: none; color: var(--ink); transition: transform .2s, color .2s; }
.post-nav__text { display: block; min-width: 0; }
.post-nav__label { display: block; font: 600 11px var(--display); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 8px; }
.post-nav__title { display: block; font: 400 19px/1.35 var(--display); }
a.post-nav__item:hover .post-nav__title, a.post-nav__item:hover svg { color: var(--accent); }
a.post-nav__prev:hover svg { transform: translateX(-4px); }
a.post-nav__next:hover svg { transform: translateX(4px); }
.post-nav__next { justify-content: space-between; text-align: right; }
@media (min-width: 700px) { .post-nav__next, .post-nav__none--end { border-left: 1px solid var(--line); } }
@media (max-width: 699px) { .post-nav__next, .post-nav__none--end { border-top: 1px solid var(--line); } }
.post-nav__none { color: var(--muted); font: 17px var(--display); }
.post-nav__none--end { justify-content: flex-end; }
/* Related posts: compact 3 x 2 grid like the old site */
.related { margin: 60px 0 40px; }
.related h2 { font: 400 24px var(--display); margin: 0 0 22px; }
.grid--related { gap: 32px 30px; }
.compact__img { display: block; aspect-ratio: 17 / 10; background: var(--soft); overflow: hidden; }
.compact__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s; }
.compact:hover .compact__img img { transform: scale(1.03); }
.compact__title { font: 600 15px/1.45 var(--display); margin: 14px 0 0; }
.compact__title a { text-decoration: none; }
.compact__title a:hover { color: var(--accent); }
/* "All news" link: quiet, right aligned, with an arrow */
.more-link { display: inline-flex; align-items: center; gap: 16px; padding: 14px 4px 14px 0; border-bottom: 1px solid var(--ink); font: 600 12px var(--display); text-transform: uppercase; letter-spacing: .14em; text-decoration: none; color: var(--ink); transition: color .2s, border-color .2s, gap .2s; }
.more-link svg { transition: transform .25s; }
.more-link:hover { color: var(--accent); border-color: var(--accent); gap: 22px; }
.more-link:hover svg { transform: translateX(4px); }
/* Pager: older on the left, newer on the right */
.pager { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 46px; padding-top: 22px; border-top: 1px solid var(--line); }
.pager a { display: inline-flex; align-items: center; gap: 12px; font: 600 12px var(--display); text-transform: uppercase; letter-spacing: .1em; text-decoration: none; color: var(--ink); padding: 8px 0; }
.pager a svg { transition: transform .2s; }
.pager a:hover { color: var(--accent); }
.pager__newer:hover svg { transform: translateX(-4px); }
.pager__older:hover svg { transform: translateX(4px); }
.pager__info { font: 13px var(--sans); color: var(--muted); }
.pager .is-off { min-width: 1px; }
@media (max-width: 559px) { .pager__info { display: none; } .pager a span { font-size: 11px; letter-spacing: .06em; } }
/* Guides page */
.guide { margin-bottom: 56px; scroll-margin-top: 70px; }
.guide .block__head { align-items: flex-end; }
.guide__desc { margin: 6px 0 0; font: 14px var(--sans); color: var(--muted); }
.page--guides .topics-bar { margin-top: 0; }
/* Archive overview page */
.page-hero__links { display: flex; justify-content: center; gap: 26px; flex-wrap: wrap; margin: 4px 0 0; font: 600 13px var(--sans); }
.page-hero__links a { color: var(--accent); text-decoration: none; }
.arch { max-width: 1000px; margin: 0 auto 50px; }
.arch .block__title { border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin-bottom: 22px; }
.arch__years { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .arch__years { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.arch__years a { display: block; border: 1px solid var(--line); padding: 16px 18px; text-decoration: none; transition: border-color .15s; }
.arch__years a:hover { border-color: var(--ink); }
.arch__years strong { display: block; font: 400 28px var(--display); }
.arch__years span { font: 13px var(--sans); color: var(--muted); }
.arch__cols { list-style: none; margin: 0; padding: 0; display: grid; gap: 0 40px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .arch__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .arch__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.arch__cols a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); text-decoration: none; font: 400 17px var(--serif); }
.arch__cols a:hover span { color: var(--accent); }
.arch__cols em { font: 13px var(--sans); color: var(--muted); font-style: normal; }
/* Rubrics overview */
.rubrics { display: grid; gap: 44px 30px; grid-template-columns: minmax(0, 1fr); margin-bottom: 56px; }
@media (min-width: 640px) { .rubrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .rubrics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rubric__img { display: block; aspect-ratio: 17 / 10; background: var(--soft); overflow: hidden; }
.rubric__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rubric__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 16px 0 10px; padding-bottom: 8px; border-bottom: 2px solid var(--ink); }
.rubric__title { font: 400 24px var(--display); margin: 0; }
.rubric__title a { text-decoration: none; }
.rubric__count { font: 600 12px var(--sans); color: var(--muted); }
.rubric__list { list-style: none; margin: 0 0 12px; padding: 0; }
.rubric__list li { padding: 9px 0; border-bottom: 1px solid var(--line); font: 400 15px/1.4 var(--serif); }
.rubric__list a { text-decoration: none; }
.rubric__list a:hover { color: var(--accent); }
.rubric__all { font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; text-decoration: none; color: var(--accent); }
.mega__all a { font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; text-decoration: none; color: var(--accent); }
.mega__main { min-width: 0; }
.primary-nav .menu > li.has-mega > a[href="#"], .sticky-bar__item.has-sub > a { cursor: default; }
/* Own advertising banner shown where the old ticket banner was: light, in the site's pink */
.house-ad { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; max-width: 728px; min-height: 90px; margin: 0 auto; padding: 14px 20px; text-align: center; text-decoration: none; color: var(--ink); background: linear-gradient(100deg, #fdecec 0%, #fff7f3 55%, #fdecec 100%); border: 1px solid #f4d3d6; overflow: hidden; }
.house-ad::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: linear-gradient(#2f6fd6 50%, #f2c230 50%); }
.house-ad:hover { color: var(--ink); border-color: var(--accent); }
.house-ad__kicker { font: 600 10px var(--sans); text-transform: uppercase; letter-spacing: .22em; color: var(--muted); }
.house-ad__title { font: 400 22px/1.2 var(--display); }
.house-ad__cta { display: inline-flex; align-items: center; gap: 10px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--accent); transition: gap .2s; }
.house-ad:hover .house-ad__cta { gap: 16px; }
@media (max-width: 559px) { .house-ad__title { font-size: 18px; } }
.banner__link { display: block; max-width: 728px; margin: 0 auto; border: 1px solid #f4d3d6; }
.banner__link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.banner__link .banner__img { display: block; width: 100%; height: auto; }
/* Partner card in the sidebar */
.partner__card { display: block; position: relative; padding: 22px 22px 20px; border: 1px solid #f4d3d6; background: linear-gradient(160deg, #fff7f3 0%, #fdecec 100%); text-decoration: none; color: var(--ink); transition: border-color .15s; }
.partner__card:hover { border-color: var(--accent); color: var(--ink); }
.partner__kicker { display: block; font: 600 10px var(--sans); text-transform: uppercase; letter-spacing: .18em; color: var(--muted); margin-bottom: 14px; }
.partner__mark { display: block; margin-bottom: 12px; }
.partner__title { display: block; font: 400 24px/1.2 var(--display); margin-bottom: 8px; }
.partner__text { display: block; font: 14px/1.5 var(--sans); color: #555; margin-bottom: 14px; }
.partner__cta { display: inline-flex; align-items: center; gap: 10px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--accent); transition: gap .2s; }
.partner__card:hover .partner__cta { gap: 16px; }
/* Mega panel footer: all rubrics on the left, small city links on the right */
.mega__foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line); }
.mega__foot .mega__all { margin: 0; padding: 0; border: 0; font: 600 12px var(--sans); text-transform: uppercase; letter-spacing: .08em; text-decoration: none; color: var(--accent); }
.mega__cities { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 14px; font: 12px var(--sans); }
.mega__cities span { text-transform: uppercase; letter-spacing: .12em; font-weight: 600; font-size: 10px; color: var(--muted); }
.mega__cities a { font: 13px var(--sans); text-decoration: none; color: #444; }
.mega__cities a:hover { color: var(--accent); }
/* Highlighted rubrics in the mega panel (travel, tourism) */
.mega li.mega__feat { display: flex; align-items: center; gap: 8px; }
.mega__badge { flex: none; padding: 2px 6px 1px; border-radius: 3px; background: var(--accent); color: #fff; font: 700 9px/1.5 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.mega__foot { grid-column: 1 / -1; }
#ads-form { scroll-margin-top: 70px; }
/* Breadcrumbs on articles: short and centred above the heading */
.crumbs--center ol { justify-content: center; margin-bottom: 8px; }
.partner__logo { display: block; height: 34px; width: auto; margin: 0 0 14px; }
/* Own advertising banner, built in code: near-black with warm bokeh lights, like the old ticket banner */
.promo { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 22px; max-width: 728px; margin: 0 auto; padding: 18px 24px 18px 0; background: #0f0e0d; border: 1px solid #0a0908; text-decoration: none; color: #fff; overflow: hidden; isolation: isolate; }
.promo::before { content: ""; position: absolute; inset: -20px; z-index: -1; filter: blur(5px); background:
radial-gradient(circle at 7% 58%, rgba(232, 140, 44, .75) 0, rgba(232, 140, 44, 0) 11%),
radial-gradient(circle at 21% 14%, rgba(255, 196, 104, .55) 0, rgba(255, 196, 104, 0) 9%),
radial-gradient(circle at 36% 92%, rgba(205, 112, 38, .6) 0, rgba(205, 112, 38, 0) 12%),
radial-gradient(circle at 58% 12%, rgba(255, 178, 74, .4) 0, rgba(255, 178, 74, 0) 10%),
radial-gradient(circle at 74% 88%, rgba(150, 128, 112, .45) 0, rgba(150, 128, 112, 0) 9%),
radial-gradient(circle at 93% 36%, rgba(240, 160, 58, .6) 0, rgba(240, 160, 58, 0) 12%),
radial-gradient(circle at 98% 92%, rgba(255, 210, 128, .45) 0, rgba(255, 210, 128, 0) 8%); }
.promo:hover { color: #fff; }
.promo::after { content: ""; position: absolute; left: 22px; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, rgba(240, 170, 60, 0), #f0aa3c 30%, #ffd27a 70%, rgba(255, 210, 122, 0)); }
.promo__orn { align-self: stretch; margin: -18px 0; background-color: #000; background-image: url("data:image/svg+xml;utf8,"); background-size: 22px 22px; border-right: 1px solid rgba(255, 255, 255, .35); }
.promo__text { display: block; text-align: left; }
.promo__kicker { display: block; font: 600 10px var(--sans); text-transform: uppercase; letter-spacing: .24em; color: #f0aa3c; margin-bottom: 5px; }
.promo__title { display: block; font: 400 25px/1.15 var(--display); color: #fff; text-shadow: 0 1px 14px rgba(0, 0, 0, .55); }
.promo__sub { display: block; margin-top: 7px; font: 500 12px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .72); }
.promo__sub i { font-style: normal; color: #f0aa3c; margin: 0 4px; }
.promo__cta { display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px; background: #000; color: #fff; border: 1px solid rgba(255, 255, 255, .55); font: 700 11px var(--sans); text-transform: uppercase; letter-spacing: .12em; white-space: nowrap; transition: background .2s, color .2s, border-color .2s, gap .2s; }
.promo:hover .promo__cta { background: #fff; color: #000; border-color: #fff; gap: 14px; }
@media (max-width: 639px) {
.promo { grid-template-columns: 1fr; gap: 12px; padding: 18px 16px 20px; text-align: center; }
.promo__orn { display: none; }
.promo::after { left: 0; }
.promo__text { text-align: center; }
.promo__title { font-size: 21px; }
.promo__cta { justify-self: center; }
}
/* Home on phones: one continuous feed (the "latest news" list and the fresh grid are the same stream) */
@media (max-width: 899px) { .hero__side { display: none; } }
@media (min-width: 900px) { .feed-dup { display: none; } .feed-more { display: none; } }
.feed-more { text-align: center; margin: 34px 0 0; }
.feed-more__btn { background: #fff; color: var(--ink); border: 1px solid var(--ink); padding: 15px 34px; font: 600 12px var(--sans); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; width: 100%; max-width: 360px; transition: background .2s, color .2s; }
.feed-more__btn:hover { background: var(--ink); color: #fff; }
.feed-more__btn[disabled] { opacity: .5; cursor: default; }
/* Sticky bar on phones: soft fade on the right edge shows that the menu scrolls */
@media (max-width: 899px) {
.sticky-bar__menu { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); padding-right: 18px; }
.sticky-bar__search { margin-left: 0; }
}
/* Back to top: round, with a ring that shows reading progress */
.to-top { position: fixed; right: 18px; bottom: 22px; z-index: 55; width: 44px; height: 44px; padding: 0; display: flex; align-items: center; justify-content: center; background: #111; color: #fff; border: 0; border-radius: 50%; cursor: pointer; opacity: 0; transform: translateY(16px) scale(.6); pointer-events: none; transition: opacity .3s, transform .35s cubic-bezier(.2, .9, .3, 1.4), background .2s; box-shadow: 0 8px 22px rgba(0, 0, 0, .28); }
.to-top.is-on { opacity: 1; transform: none; pointer-events: auto; }
.to-top__ring { position: absolute; inset: 0; transform: rotate(-90deg); }
.to-top__track, .to-top__bar { fill: none; stroke-width: 2.4; }
.to-top__track { stroke: rgba(255, 255, 255, .18); }
.to-top__bar { stroke: var(--accent); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset .15s linear; }
.to-top__arrow { position: relative; transition: transform .25s; }
.to-top:hover { background: var(--accent); }
.to-top:hover .to-top__bar { stroke: #fff; }
.to-top:hover .to-top__arrow { transform: translateY(-3px); }
body.has-cookie .to-top { bottom: 96px; }
body.drawer-open .to-top { display: none; }
@media (max-width: 559px) { body.has-cookie .to-top { bottom: 150px; } .to-top { right: 14px; } }
html, body { overflow-x: clip; max-width: 100%; }
@media (max-width: 899px) { .sticky-bar { max-width: 100vw; overflow: hidden; } }
/* Touch targets and tiny labels on phones */
@media (max-width: 899px) {
.nav-toggle, .search-toggle { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.meta, .cats { font-size: 12px; }
.cats a { display: inline-block; padding: 5px 0; }
.topics a { padding: 9px 15px; }
.mini .cats { font-size: 11px; }
}
/* About page */
.about-hero { text-align: center; max-width: 860px; margin: 8px auto 52px; }
.about-hero__kicker { font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .24em; color: var(--accent); margin: 0 0 14px; }
.about-hero__title { font-size: 46px; margin: 0 0 22px; }
@media (min-width: 900px) { .about-hero__title { font-size: 64px; } }
.about-hero__lead { font: italic 400 26px/1.35 var(--display); margin: 0 auto 14px; max-width: 760px; }
@media (min-width: 900px) { .about-hero__lead { font-size: 32px; } }
.about-hero__sub { font: 16px/1.6 var(--sans); color: var(--muted); margin: 0; }
.about-mission { display: grid; gap: 30px; max-width: 1000px; margin: 0 auto 56px; }
@media (min-width: 900px) { .about-mission { grid-template-columns: 5fr 7fr; gap: 56px; align-items: start; } }
.about-quote { margin: 0; padding: 30px 32px; background: linear-gradient(135deg, #fff4ef 0%, #fdecec 100%); border-left: 4px solid var(--accent); font: 400 34px/1.2 var(--display); }
.about-quote span { display: block; margin-top: 14px; font: 15px/1.5 var(--sans); color: #6b5a5e; }
.about-mission__text p { font-size: 18px; line-height: 1.75; margin: 0 0 1.1em; }
.about-section { max-width: 1000px; margin: 0 auto 56px; }
.about-section .block__title { border-bottom: 2px solid var(--ink); padding-bottom: 10px; margin-bottom: 22px; }
.about-section__lead { margin: -6px 0 24px; font: 15px var(--sans); color: var(--muted); }
.about-tiles { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .about-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .about-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.about-tile { display: flex; flex-direction: column; gap: 8px; padding: 24px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: border-color .15s, transform .2s; }
.about-tile:hover { border-color: var(--ink); transform: translateY(-2px); color: var(--ink); }
.about-tile__title { font: 400 22px/1.2 var(--display); }
.about-tile__text { font: 14px/1.5 var(--sans); color: #555; }
.about-tile__more { margin-top: auto; padding-top: 6px; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .12em; color: var(--accent); }
.issues { display: grid; gap: 26px 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .issues { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.issue { margin: 0; }
.issue__cover { display: block; aspect-ratio: 3 / 4.2; background: var(--soft); overflow: hidden; box-shadow: 0 10px 28px rgba(0, 0, 0, .14); transition: transform .25s, box-shadow .25s; }
a.issue__cover:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(0, 0, 0, .2); }
.issue__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.issue figcaption { padding-top: 14px; display: flex; flex-direction: column; gap: 4px; font: 13px/1.45 var(--sans); }
.issue figcaption strong { font: 400 19px var(--display); }
.issue figcaption span { color: var(--muted); }
.issue figcaption a { color: var(--accent); font-weight: 600; text-decoration: none; margin-top: 4px; }
.about-join { max-width: 860px; margin: 0 auto 30px; padding: 44px 36px; text-align: center; color: #fff; background: radial-gradient(120% 160% at 0% 0%, #3b2a2a 0%, rgba(59, 42, 42, 0) 60%), #121110; }
.about-join h2 { font-size: 32px; margin: 0 0 14px; color: #fff; }
.about-join p { font: 16px/1.7 var(--sans); color: rgba(255, 255, 255, .8); margin: 0 auto 22px; max-width: 640px; }
.about-join__links { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-bottom: 0 !important; }
.about-join .btn { background: #fff; color: #111; }
.about-join .btn:hover { background: var(--accent); color: #fff; }
.about-join .btn--line { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .6); }
.about-join .btn--line:hover { background: #fff; color: #111; }
.about-mission__text .about-call { padding: 18px 22px; background: #f6f3ef; border-left: 4px solid var(--accent); font-weight: 600; }
.about-join .about-join__thanks { font: 400 26px/1.35 var(--display); color: #fff; max-width: 680px; }
/* A long word in a headline must not stretch the grid (and the image) past the screen */
.hero { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .hero { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }
h1, h2, h3, .hero__title, .card__title, .single__title { overflow-wrap: break-word; hyphens: auto; }
.site-footer__badge { margin: 26px 0 0; line-height: 0; }
.site-footer__badge img { display: inline-block; max-width: 100%; height: auto; }
/* Ukrainians.it partner card: dark, with a blue and yellow edge, to stand apart from the Archemap card */
.partner__card--ua { background: #14181f; border: 0; border-top: 6px solid transparent; border-image: linear-gradient(90deg, #0057b8 50%, #ffd700 50%) 1; color: #fff; }
.partner__card--ua:hover { color: #fff; }
.partner__card--ua .partner__kicker { color: #aab3c2; }
.partner__card--ua .partner__title { color: #fff; }
.partner__card--ua .partner__text { color: #c9d0db; }
.partner__card--ua .partner__cta { color: #ffd700; }