/* ========================================================================== Радио 3:16 — child theme styles (loaded after Astra) 1. Tokens 2. Base 3. Header 4. Player 5. Buttons & controls 6. Homepage 7. Cards, chips, grids 8. Content pages 9. Footer 10. Motion ========================================================================== */ /* 1. Tokens ---------------------------------------------------------------- */ :root { --r-ink: #17151A; --r-ink-2: #211E25; --r-ink-3: #332F37; --r-text: #2B2730; --r-cream: #FAF6F1; --r-cream-2: #F3EEE7; --r-paper: #FFFFFF; --r-line: #E7E0D7; --r-soft: #D9D2C8; --r-muted: #6B645C; /* 5.4:1 on cream */ --r-muted-dark: #A39C94; /* 6.7:1 on ink */ --r-red: #DD5E4B; /* logo red — decorative / large text on ink */ --r-red-strong: #C0442F; /* white text on it: 5.1:1 */ --r-red-hover: #A63726; --r-red-text: #B83D2A; /* red text on cream/white: 5.2:1 */ --r-red-light: #EF7A66; /* red text on ink: 6.6:1 */ --r-chip: #F3DDD8; --r-display: 'Unbounded', 'Manrope', system-ui, sans-serif; --r-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; --r-s1: 4px; --r-s2: 8px; --r-s3: 12px; --r-s4: 16px; --r-s5: 24px; --r-s6: 32px; --r-s7: 48px; --r-s8: 64px; --r-s9: 96px; --r-radius: 20px; --r-radius-sm: 12px; --r-gutter: clamp(16px, 5vw, 80px); --r-max: 1280px; --r-ease: cubic-bezier(.2, .7, .2, 1); --r-player-h: 56px; --r-top: var(--wp-admin--admin-bar--height, 0px); } /* Astra's global palette → brand (links, buttons, headings, text everywhere) */ body.r316 { --ast-global-color-0: #B83D2A; --ast-global-color-1: #8F2C1D; --ast-global-color-2: #17151A; --ast-global-color-3: #2B2730; } .r316 a { color: var(--r-red-text); } .r316 a:hover { color: var(--r-red-hover); } /* 2. Base ------------------------------------------------------------------ */ body.r316, .r316 button, .r316 input, .r316 select, .r316 textarea { font-family: var(--r-body); } body.r316 { font-size: 17px; line-height: 1.65; color: var(--r-text); -webkit-font-smoothing: antialiased; } .r316 h1, .r316 h2, .r316 h3, .r316 h4, .r316 h5, .r316 h6, .r316 .entry-content h1, .r316 .entry-content h2, .r316 .entry-content h3, .r316 .entry-content h4, .r316 .entry-content h5, .r316 .entry-content h6 { font-family: var(--r-body); font-weight: 700; color: var(--r-ink); line-height: 1.25; } .r316 .entry-title, .r316 .entry-content h1 { font-family: var(--r-display); font-weight: 600; font-size: clamp(28px, 3.2vw, 44px); line-height: 1.15; letter-spacing: -0.01em; } .r316 .entry-content h2 { font-size: clamp(22px, 2.2vw, 28px); } .r316 .entry-content h3 { font-size: 22px; } .r316 .entry-content p, .r316 .entry-content li { font-size: 17px; line-height: 1.75; } .r316 .entry-content a:not([class]), .r316 .entry-content p a, .r316 .entry-content li a { color: var(--r-red-text); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } .r316 .entry-content a:not([class]):hover, .r316 .entry-content p a:hover, .r316 .entry-content li a:hover { color: var(--r-red-hover); text-decoration-thickness: 2px; } .r316 a:focus-visible, .r316 button:focus-visible, .r316 input:focus-visible, .r316 select:focus-visible, .r316 textarea:focus-visible, .r316 [tabindex]:focus-visible { outline: 3px solid var(--r-red) !important; outline-offset: 3px; box-shadow: none; } .r316 ::selection { background: var(--r-chip); color: var(--r-ink); } /* Skip link visible on focus */ .r316 .skip-link:focus { background: var(--r-ink); color: var(--r-cream); padding: 12px 20px; border-radius: 999px; z-index: 100000; top: 8px; left: 8px; } /* 3. Header (Astra legacy header) -------------------------------------------- */ .r316 #masthead .main-header-bar { background: var(--r-cream); border-bottom: 1px solid var(--r-line); padding: 0; } .r316 #masthead .main-header-bar .ast-container { max-width: var(--r-max); padding-left: var(--r-gutter); padding-right: var(--r-gutter); } .r316 #masthead .main-header-container { min-height: 88px; gap: var(--r-s5); } .r316 #masthead .site-logo-img img, .r316 #masthead .custom-logo-link img { width: 64px; max-width: 64px; height: auto; } .r316 #masthead .site-branding { padding: var(--r-s3) 0; } .r316 .main-header-menu > .menu-item > .menu-link { font-family: var(--r-body); font-weight: 600; font-size: 16px; color: var(--r-ink); padding: 0 var(--r-s3); line-height: 88px; position: relative; transition: color .2s var(--r-ease); } .r316 .main-header-menu > .menu-item > .menu-link::after { content: ""; position: absolute; left: var(--r-s3); right: var(--r-s3); bottom: 26px; height: 2px; background: var(--r-red); transform: scaleX(0); transform-origin: left; transition: transform .25s var(--r-ease); } .r316 .main-header-menu > .menu-item > .menu-link:hover { color: var(--r-red-text); } .r316 .main-header-menu > .menu-item > .menu-link:hover::after, .r316 .main-header-menu > .current-menu-item > .menu-link::after, .r316 .main-header-menu > .current-menu-ancestor > .menu-link::after { transform: scaleX(1); } .r316 .main-header-menu > .current-menu-item > .menu-link, .r316 .main-header-menu > .current-menu-ancestor > .menu-link { color: var(--r-ink); } /* Support button in the menu */ .r316 .main-header-menu > .r316-menu-support { display: flex; align-items: center; margin-left: var(--r-s3); } .r316 .main-header-menu > .r316-menu-support > .menu-link { line-height: 1 !important; height: auto !important; padding: 13px 22px !important; border: 2px solid var(--r-ink); border-radius: 999px; font-weight: 700; font-size: 15px; white-space: nowrap; transition: background .2s, color .2s; } /* Desktop: keep header on one row; search collapses to an icon until used */ @media (min-width: 922px) { .r316 #masthead .main-header-container { flex-wrap: nowrap; } .r316 #masthead .ast-main-header-bar-alignment { flex: 1 1 auto; min-width: 0; } .r316 #masthead .ast-masthead-custom-menu-items { flex: 0 0 auto; margin-left: var(--r-s2); } .r316 #masthead .search-form .search-field { width: 48px; padding: 0; color: transparent; cursor: pointer; border-color: var(--r-line); background: var(--r-cream-2); } .r316 #masthead .search-form .search-field::placeholder { color: transparent; } .r316 #masthead .search-form:not(:focus-within) .search-submit { pointer-events: none; } .r316 #masthead .search-form .search-field:focus { width: 260px; padding: 0 48px 0 20px; color: var(--r-ink); cursor: text; background: var(--r-paper); } .r316 #masthead .search-form .search-field:focus::placeholder { color: var(--r-muted); } .r316 #masthead .search-form:focus-within { position: relative; z-index: 5; } } @media (min-width: 922px) and (max-width: 1180px) { .r316 .main-header-menu > .menu-item > .menu-link { padding: 0 var(--r-s2); font-size: 15px; } .r316 .main-header-menu > .menu-item > .menu-link::after { left: var(--r-s2); right: var(--r-s2); } } .r316 .main-header-menu > .r316-menu-support > .menu-link::after { display: none; } .r316 .main-header-menu > .r316-menu-support > .menu-link:hover { background: var(--r-ink); color: var(--r-cream); } /* Search in header */ .r316 #masthead .ast-masthead-custom-menu-items { padding: 0; } .r316 #masthead .ast-masthead-custom-menu-items .widget { margin: 0; } .r316 #masthead .search-form { position: relative; display: flex; align-items: center; } .r316 #masthead .search-form label { margin: 0; width: 100%; } .r316 #masthead .search-form .search-field { height: 48px; width: 220px; padding: 0 48px 0 20px; border-radius: 999px; border: 1px solid var(--r-line); background: var(--r-paper); color: var(--r-ink); font-size: 15px; transition: border-color .2s, width .25s var(--r-ease); } .r316 #masthead .search-form .search-field::placeholder { color: var(--r-muted); opacity: 1; } .r316 #masthead .search-form .search-field:focus { border-color: var(--r-ink); width: 260px; } .r316 #masthead .search-form .search-submit { position: absolute; right: 4px; top: 4px; width: 40px; height: 40px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; font-size: 0; color: transparent; background: var(--r-cream-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2317151A' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center/18px no-repeat; } .r316 #masthead .search-form .search-submit:hover { background-color: var(--r-line); } /* Mobile header — one compact row: logo · search · menu */ @media (max-width: 921px) { .r316 #masthead .main-header-container { flex-direction: row !important; flex-wrap: wrap; align-items: center; justify-content: space-between; min-height: 64px; gap: var(--r-s3); } .r316 #masthead .site-branding { flex: 0 0 auto; padding: var(--r-s2) 0 !important; text-align: left !important; } .r316 #masthead .site-logo-img img, .r316 #masthead .custom-logo-link img { width: 44px; max-width: 44px; } .r316.ast-header-break-point #masthead .ast-masthead-custom-menu-items, .r316 #masthead .ast-masthead-custom-menu-items { flex: 1 1 120px; order: 2; padding: 0 !important; margin: 0 !important; display: block; } .r316 #masthead .search-form .search-field, .r316 #masthead .search-form .search-field:focus { width: 100%; height: 44px; } .r316 #masthead .search-form .search-submit { width: 36px; height: 36px; } .r316 #masthead .ast-masthead-custom-menu-items { flex: 1 1 0 !important; min-width: 0; width: auto !important; } .r316 #masthead .ast-mobile-menu-buttons { order: 3; flex: 0 0 auto !important; width: auto !important; justify-content: flex-end !important; padding: 0 !important; margin: 0 !important; } .r316 #masthead .menu-toggle .mobile-menu-wrap { display: none; } .r316 #masthead .main-header-bar-navigation { order: 4; flex-basis: 100%; } .r316 #masthead .menu-toggle { min-width: 44px; min-height: 44px; border-radius: 999px; background: transparent !important; color: var(--r-ink) !important; border: 1px solid var(--r-line) !important; padding: 0 14px !important; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; } .r316 .main-header-menu { background: var(--r-cream) !important; border-top: 1px solid var(--r-line); } .r316 .main-header-menu > .menu-item > .menu-link { line-height: 1.4; padding: 14px 4px; border-bottom: 1px solid var(--r-line) !important; } .r316 .main-header-menu > .menu-item > .menu-link::after { display: none; } .r316 .main-header-menu > .current-menu-item > .menu-link { color: var(--r-red-text); } .r316 .main-header-menu > .r316-menu-support { margin: var(--r-s4) 0; } .r316 .main-header-menu > .r316-menu-support > .menu-link { border-bottom: 2px solid var(--r-ink) !important; padding: 14px 22px; } } /* 4. Persistent player --------------------------------------------------------- */ .r316-player { position: sticky; top: var(--r-top); z-index: 99; background: var(--r-ink); color: var(--r-cream); box-shadow: 0 1px 0 rgba(0, 0, 0, .2); } .r316-player__inner { max-width: var(--r-max); margin: 0 auto; padding: 0 var(--r-gutter); min-height: var(--r-player-h); display: flex; align-items: center; gap: var(--r-s4); } .r316-player__toggle { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 999px; border: 0; padding: 0; background: var(--r-red); color: var(--r-ink); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: transform .2s var(--r-ease), background .2s; } .r316-player__toggle:hover { transform: scale(1.06); background: var(--r-red-light); } .r316-player__art { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; flex: 0 0 auto; } .r316-player__meta { display: flex; align-items: center; gap: var(--r-s3); min-width: 0; flex: 1 1 auto; } .r316-player__badge { display: inline-flex; align-items: center; gap: var(--r-s2); flex: 0 0 auto; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-red-light); } .r316-player[data-mode="episode"] .r316-player__badge .r316-dot { animation: none; background: var(--r-muted-dark); } .r316-player__title { display: flex; align-items: baseline; gap: var(--r-s3); min-width: 0; font-size: 15px; white-space: nowrap; } .r316-player__title a { color: var(--r-cream); font-weight: 700; text-decoration: none; overflow: hidden; text-overflow: ellipsis; } .r316-player__title a:hover { text-decoration: underline; color: var(--r-paper); } .r316-player__artist { color: var(--r-muted-dark); overflow: hidden; text-overflow: ellipsis; min-width: 0; } .r316-player__next { flex: 0 0 auto; font-size: 14px; color: var(--r-muted-dark); } .r316-player[data-mode="episode"] .r316-player__next { display: none; } .r316-player__golive { flex: 0 0 auto; height: 36px; padding: 0 16px; border-radius: 999px; cursor: pointer; border: 1.5px solid var(--r-red-light); background: transparent; color: var(--r-cream); font: 700 13px/1 var(--r-body); } .r316-player__golive:hover { background: var(--r-red-light); color: var(--r-ink); } .r316-player__volume { flex: 0 0 auto; display: flex; align-items: center; gap: var(--r-s2); } .r316-player__mute { width: 36px; height: 36px; border: 0; background: transparent; color: var(--r-muted-dark); border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; } .r316-player__mute:hover { color: var(--r-cream); } .r316-player__mute .r316-icon--muted, .r316-player__mute[aria-pressed="true"] .r316-icon--volume { display: none; } .r316-player__mute[aria-pressed="true"] .r316-icon--muted { display: inline; } .r316-player__volume input[type="range"] { width: 96px; accent-color: var(--r-red); background: transparent; border: 0; padding: 0; } .r316-player__error { margin: 0; font-size: 13px; color: var(--r-red-light); } /* Mobile: floating bar at the bottom */ @media (max-width: 921px) { .r316-player { position: fixed; top: auto; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); background: var(--r-cream); color: var(--r-ink); border-radius: 18px; box-shadow: 0 12px 32px rgba(23, 21, 26, .35), 0 0 0 1px rgba(23, 21, 26, .06); } body.r316 { padding-bottom: 96px; } .r316-player__inner { min-height: 64px; padding: 0 var(--r-s2) 0 var(--r-s3); gap: var(--r-s3); flex-wrap: wrap; } .r316-player__toggle { order: 5; width: 48px; height: 48px; background: var(--r-red-strong); color: var(--r-paper); } .r316-player__toggle:hover { background: var(--r-red-hover); } .r316-player__art { width: 44px; height: 44px; } .r316-player__meta { flex-direction: column; align-items: flex-start; gap: 2px; } .r316-player__badge { font-size: 11px; color: var(--r-red-text); } .r316-player__title { flex-direction: column; gap: 0; font-size: 14px; max-width: 100%; } .r316-player__title a { color: var(--r-ink); max-width: 100%; } .r316-player__title a:hover { color: var(--r-ink); } .r316-player__artist { color: var(--r-muted); font-size: 13px; max-width: 100%; } .r316-player__next, .r316-player__volume { display: none; } .r316-player__golive { order: 4; border-color: var(--r-red-text); color: var(--r-red-text); height: 32px; padding: 0 10px; font-size: 12px; } .r316-player__error { flex-basis: 100%; order: 6; color: var(--r-red-text); padding-bottom: var(--r-s2); } } /* 5. Buttons & controls ---------------------------------------------------------- */ .r316-icon { display: inline-block; vertical-align: middle; flex: 0 0 auto; } .r316-icon--pause { display: none; } .is-playing > .r316-icon--play { display: none; } .is-playing > .r316-icon--pause { display: inline-block; } .r316-spinner { display: none; width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid currentColor; border-right-color: transparent; animation: r316-spin .8s linear infinite; flex: 0 0 auto; } .is-loading > .r316-icon { display: none !important; } .is-loading > .r316-spinner { display: inline-block; } @keyframes r316-spin { to { transform: rotate(360deg); } } .r316-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--r-red); display: inline-block; flex: 0 0 auto; } .r316-player[data-state="playing"][data-mode="live"] .r316-dot, .r316-eyebrow--live .r316-dot { animation: r316-pulse 2s infinite; } @keyframes r316-pulse { 0% { box-shadow: 0 0 0 0 rgba(221, 94, 75, .7); } 70% { box-shadow: 0 0 0 8px rgba(221, 94, 75, 0); } 100% { box-shadow: 0 0 0 0 rgba(221, 94, 75, 0); } } .r316-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--r-s3); height: 52px; padding: 0 28px; border-radius: 999px; border: 0; cursor: pointer; font: 700 17px/1 var(--r-body); text-decoration: none !important; white-space: nowrap; transition: background .2s var(--r-ease), transform .2s var(--r-ease), color .2s; } .r316-btn--lg { height: 64px; padding: 0 34px 0 26px; font-size: 18px; } .r316-btn--primary { background: var(--r-red-strong); color: var(--r-paper) !important; } .r316-btn--primary:hover { background: var(--r-red-hover); transform: translateY(-1px); } .r316-btn--dark { background: var(--r-ink); color: var(--r-cream) !important; } .r316-btn--dark:hover { background: var(--r-ink-3); transform: translateY(-1px); } .r316-play { width: 44px; height: 44px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; flex: 0 0 auto; background: var(--r-ink); color: var(--r-cream); display: inline-flex; align-items: center; justify-content: center; transition: transform .2s var(--r-ease), background .2s; } .r316-play:hover { transform: scale(1.07); background: var(--r-red-strong); color: var(--r-paper); } .r316-play.is-playing { background: var(--r-red-strong); color: var(--r-paper); } .r316-play--wide { width: 56px; height: 56px; background: var(--r-red-strong); color: var(--r-paper); } .r316-play--wide:hover { background: var(--r-red-hover); } .r316-link-arrow { display: inline-flex; align-items: center; gap: var(--r-s2); min-height: 44px; font-weight: 700; font-size: 16px; color: var(--r-red-text) !important; text-decoration: none !important; } .r316-link-arrow .r316-icon { transition: transform .2s var(--r-ease); } .r316-link-arrow:hover .r316-icon { transform: translateX(4px); } .r316-link-arrow:hover { text-decoration: underline !important; text-underline-offset: 4px; } .r316-eyebrow { display: inline-flex; align-items: center; gap: var(--r-s2); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-red-text); } .r316-h2 { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: clamp(26px, 3vw, 40px) !important; line-height: 1.15 !important; letter-spacing: -0.01em; margin: var(--r-s2) 0 0 !important; color: var(--r-ink); } /* 6. Homepage -------------------------------------------------------------------- */ .r316-front #content > .ast-container, .r316-front .site-content > .ast-container { max-width: none !important; padding: 0 !important; margin: 0 !important; display: block !important; } .r316-front #content { padding: 0 !important; background: var(--r-paper); } .r316-wrap { max-width: var(--r-max); margin: 0 auto; padding-left: var(--r-gutter); padding-right: var(--r-gutter); box-sizing: border-box; } .r316-hero { position: relative; overflow: hidden; background: var(--r-ink); color: var(--r-cream); padding: clamp(48px, 8vw, 112px) 0; } .r316-hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; } .r316-hero__text { display: flex; flex-direction: column; gap: var(--r-s5); } .r316-hero .r316-eyebrow { color: var(--r-red-light); } .r316 .r316-hero__title { font-family: var(--r-display); font-weight: 600; color: var(--r-cream); font-size: clamp(34px, 4.6vw, 64px); line-height: 1.08; letter-spacing: -0.02em; margin: 0; } .r316-hero__lead { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; color: var(--r-soft); max-width: 34em; margin: 0; } .r316-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--r-s5); margin-top: var(--r-s3); } .r316-hero__link { color: var(--r-cream) !important; font-weight: 700; text-underline-offset: 4px; text-decoration: underline; min-height: 44px; display: inline-flex; align-items: center; } .r316-hero__link:hover { color: var(--r-paper) !important; text-decoration-thickness: 2px; } .r316-hero__watermark { position: absolute; z-index: 0; right: -0.04em; bottom: -0.22em; pointer-events: none; user-select: none; font-family: var(--r-display); font-weight: 700; font-size: clamp(200px, 36vw, 540px); line-height: 1; color: var(--r-ink-2); letter-spacing: -0.04em; } .r316-np { background: var(--r-cream); color: var(--r-ink); border-radius: 24px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, .4); max-width: 460px; margin-left: auto; } .r316-np__art { position: relative; aspect-ratio: 16 / 10; background: var(--r-ink-2); display: flex; align-items: center; justify-content: center; overflow: hidden; } .r316-np__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .r316-np__fallback { font-family: var(--r-display); font-weight: 700; font-size: 96px; color: var(--r-red); letter-spacing: -0.03em; } .r316-np__body { padding: var(--r-s5) 28px 28px; display: flex; flex-direction: column; gap: var(--r-s1); } .r316-np__title { font-family: var(--r-display); font-weight: 600; font-size: 22px; line-height: 1.25; margin: var(--r-s1) 0 0; color: var(--r-ink); } .r316-np__artist { margin: 0; font-size: 15px; color: var(--r-muted); } .r316-np__next { margin: var(--r-s3) 0 0; padding-top: var(--r-s3); border-top: 1px solid var(--r-line); font-size: 14px; color: var(--r-muted); } .r316-np__next:empty, .r316-np__artist:empty { display: none; } .r316-section { padding: clamp(56px, 7vw, 96px) 0; background: var(--r-paper); } .r316-section--cream { background: var(--r-cream); } .r316-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--r-s5); margin-bottom: clamp(24px, 3vw, 40px); flex-wrap: wrap; } .r316-shows { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--r-s5); } .r316-shows li { margin: 0; } .r316-show { display: flex; flex-direction: column; gap: var(--r-s2); text-decoration: none !important; color: var(--r-ink) !important; } .r316-show__img { display: block; aspect-ratio: 1 / 1; border-radius: var(--r-radius); overflow: hidden; background: var(--r-line); margin-bottom: var(--r-s2); } .r316-show__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s var(--r-ease); } .r316-show:hover .r316-show__img img { transform: scale(1.06); } .r316-show__name { font-weight: 700; font-size: 17px; line-height: 1.3; } .r316-show:hover .r316-show__name { color: var(--r-red-text); } .r316-show__count { font-size: 14px; color: var(--r-muted); } .r316-topics { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); align-items: start; } .r316-topics__intro p { color: var(--r-muted); margin: var(--r-s4) 0 0; } .r316-support { background: var(--r-red); color: var(--r-ink); padding: clamp(48px, 6vw, 80px) 0; } .r316-support__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--r-s7); } .r316-support .r316-h2 { color: var(--r-ink); max-width: 20em; margin: 0 0 var(--r-s3) !important; } .r316-support p { margin: 0; font-size: 18px; color: var(--r-ink); max-width: 38em; } @media (max-width: 1100px) { .r316-shows { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 921px) { .r316-hero__inner { grid-template-columns: minmax(0, 1fr); } .r316-np { margin-left: 0; max-width: none; display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; border-radius: 16px; box-shadow: none; background: var(--r-ink-2); color: var(--r-cream); } .r316-np__art { aspect-ratio: 1 / 1; height: 96px; } .r316-np__fallback { font-size: 28px; } .r316-np__body { padding: var(--r-s3) var(--r-s4); } .r316-np .r316-eyebrow { color: var(--r-red-light); font-size: 11px; } .r316-np__title { font-family: var(--r-body); font-weight: 700; font-size: 16px; color: var(--r-cream); } .r316-np__artist, .r316-np__next { color: var(--r-muted-dark); font-size: 13px; } .r316-np__next { border: 0; padding: 0; margin: 0; } .r316-btn--lg { width: 100%; } .r316-hero__actions { flex-direction: column; align-items: stretch; } .r316-hero__link { justify-content: center; } .r316-topics { grid-template-columns: minmax(0, 1fr); } .r316-support__inner { flex-direction: column; align-items: stretch; } } @media (max-width: 640px) { .r316-shows { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 42%; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--r-s3); margin-right: calc(-1 * var(--r-gutter)); padding-right: var(--r-gutter); padding-bottom: var(--r-s2); scrollbar-width: none; } .r316-shows::-webkit-scrollbar { display: none; } .r316-shows li { scroll-snap-align: start; } .r316-show__img { border-radius: 16px; } .r316-show__name { font-size: 15px; } } /* 7. Cards, chips, grids ------------------------------------------------------------ */ .r316-grid { display: grid; gap: var(--r-s6); } .r316-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 1024px) { .r316-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--r-s5); } } .r316-card { background: var(--r-cream); border-radius: var(--r-radius); overflow: hidden; display: flex; flex-direction: column; transition: transform .25s var(--r-ease), box-shadow .25s var(--r-ease); } .r316-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(23, 21, 26, .10); } .r316-card__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--r-line); } .r316-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .r316-card__body { padding: var(--r-s5) 28px 28px; display: flex; flex-direction: column; gap: var(--r-s3); flex: 1 1 auto; } .r316 .r316-card__title { margin: 0; font-family: var(--r-body); font-size: 20px; font-weight: 700; line-height: 1.35; } .r316-card__title a { color: var(--r-ink) !important; text-decoration: none !important; } .r316-card__title a:hover { color: var(--r-red-text) !important; text-decoration: underline !important; text-underline-offset: 3px; } .r316-card__title a::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */ .r316-card { position: relative; } .r316-card .r316-chip, .r316-card .r316-play { position: relative; z-index: 1; } .r316-card__foot { margin-top: auto; padding-top: var(--r-s2); display: flex; align-items: center; gap: var(--r-s3); font-size: 14px; color: var(--r-muted); } .r316-chip { align-self: flex-start; display: inline-flex; align-items: center; min-height: 32px; padding: 4px 12px; border-radius: 999px; background: var(--r-chip); color: var(--r-ink) !important; font-size: 13px; font-weight: 700; text-decoration: none !important; transition: background .2s, color .2s; } .r316-chip:hover { background: var(--r-ink); color: var(--r-cream) !important; } .r316-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--r-s3); align-items: center; } .r316-chips li { margin: 0; } .r316-chip--lg { min-height: 48px; padding: 0 22px; font-size: 16px; font-weight: 600; background: var(--r-paper); border: 1.5px solid var(--r-soft); } .r316-chip--lg:hover { border-color: var(--r-ink); } @media (max-width: 640px) { .r316-grid--3 { grid-template-columns: minmax(0, 1fr); gap: 0; } .r316-card { flex-direction: row; align-items: flex-start; gap: var(--r-s3); background: transparent; border-radius: 0; padding: var(--r-s4) 0; border-bottom: 1px solid var(--r-line); } .r316-card:hover { transform: none; box-shadow: none; } .r316-card__media { flex: 0 0 112px; width: 112px; aspect-ratio: 4 / 3; border-radius: var(--r-radius-sm); } .r316-card__body { padding: 0; gap: var(--r-s2); } .r316-card .r316-chip { background: transparent; padding: 0; min-height: 0; color: var(--r-red-text) !important; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; } .r316 .r316-card__title { font-size: 16px; } .r316-card__foot { padding-top: 0; } .r316-chip--lg { min-height: 44px; padding: 0 18px; font-size: 15px; } } /* 8. Content pages -------------------------------------------------------------------- */ .r316.ast-separate-container, .r316.ast-separate-container #content { background-color: var(--r-cream); } .r316.ast-separate-container .ast-article-single, .r316.ast-separate-container .ast-article-post, .r316.ast-separate-container .comments-area .comment-respond, .r316.ast-separate-container .ast-author-box { background-color: var(--r-paper); border-radius: 24px; padding: clamp(24px, 4.5vw, 64px); } .r316.ast-separate-container .ast-article-post { margin-bottom: var(--r-s5); } .r316 .ast-breadcrumbs-wrapper, .r316 .ast-breadcrumbs, .r316 .breadcrumbs { font-size: 14px; color: var(--r-muted); } .r316 .ast-breadcrumbs-wrapper a, .r316 .breadcrumbs a { color: var(--r-red-text); } /* Audio players in content */ .r316 .wp-block-audio { margin: var(--r-s5) 0; } .r316 .wp-block-audio audio { width: 100%; min-width: 0; } /* Episode "listen" bar above content */ .r316-episode-bar { display: flex; align-items: center; gap: var(--r-s4); background: var(--r-cream); border-radius: 16px; padding: var(--r-s4); margin-bottom: var(--r-s5); } .r316-episode-bar > div { display: flex; flex-direction: column; gap: 2px; } .r316-episode-bar__label { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-muted); } .r316 .r316-episode-bar__show { font-weight: 700; color: var(--r-ink); text-decoration: none; } .r316 .r316-episode-bar__show:hover { color: var(--r-red-text); text-decoration: underline; } /* More from this show */ .r316-more { margin-top: var(--r-s7); } .r316-more .r316-h2 { font-size: clamp(22px, 2.4vw, 30px) !important; } .r316.ast-separate-container .r316-more { background: var(--r-paper); border-radius: 24px; padding: clamp(24px, 4.5vw, 64px); } /* Live card (Слушайте page) */ .r316-livecard { display: grid; grid-template-columns: 180px minmax(0, 1fr) auto; gap: var(--r-s5); align-items: center; background: var(--r-ink); color: var(--r-cream); border-radius: 24px; padding: var(--r-s5); margin: 0 0 var(--r-s6); } .r316-livecard__art { width: 180px; aspect-ratio: 1 / 1; border-radius: 16px; overflow: hidden; background: var(--r-ink-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ctext x='50' y='62' text-anchor='middle' font-family='sans-serif' font-weight='700' font-size='34' fill='%23DD5E4B'%3E3:16%3C/text%3E%3C/svg%3E") center/80% no-repeat; } .r316-livecard__art img { width: 100%; height: 100%; object-fit: cover; display: block; } .r316-livecard .r316-eyebrow { color: var(--r-red-light); } .r316 .r316-livecard__title { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: clamp(22px, 2.6vw, 32px) !important; color: var(--r-cream) !important; margin: var(--r-s2) 0 var(--r-s1) !important; line-height: 1.2 !important; } .r316 .r316-livecard p { margin: 0; color: var(--r-muted-dark); font-size: 16px; } @media (max-width: 760px) { .r316-livecard { grid-template-columns: 88px minmax(0, 1fr); } .r316-livecard__art { width: 88px; } .r316-livecard .r316-btn { grid-column: 1 / -1; width: 100%; } } /* Spectra (UAG) post grids: consistent cards */ .r316 .uagb-post-grid .uagb-post__inner-wrap, .r316 .uagb-post__items .uagb-post__inner-wrap { background: var(--r-cream) !important; border-radius: var(--r-radius); overflow: hidden; text-align: left !important; transition: transform .25s var(--r-ease), box-shadow .25s var(--r-ease); } .r316 .uagb-post__items .uagb-post__inner-wrap:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(23, 21, 26, .10); } .r316 .uagb-post__image { margin: 0 !important; } .r316 .uagb-post__image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; } .r316 .uagb-post__text { text-align: left !important; } .r316 .uagb-post__title { font-family: var(--r-body) !important; font-weight: 700 !important; font-size: 19px !important; line-height: 1.35 !important; padding: var(--r-s5) 28px 28px !important; margin: 0 !important; text-align: left !important; } .r316 .uagb-post__title a { color: var(--r-ink) !important; text-decoration: none !important; } .r316 .uagb-post__title a:hover { color: var(--r-red-text) !important; text-decoration: underline !important; text-underline-offset: 3px; } /* Pagination (WP + Spectra) — AA contrast, 44px targets */ .r316 .page-numbers, .r316 .uagb-post-pagination-wrap .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px; margin: 0 4px 8px 0; border-radius: 999px; background: var(--r-cream-2) !important; color: var(--r-ink) !important; font-weight: 700; font-size: 15px; text-decoration: none !important; border: 0 !important; } .r316 a.page-numbers:hover { background: var(--r-line) !important; } .r316 .page-numbers.current { background: var(--r-ink) !important; color: var(--r-cream) !important; } .r316 .page-numbers.dots { background: transparent !important; min-width: 24px; padding: 0; } /* Kadence gallery captions (Предавания) */ .r316 .kb-gallery-caption-style-bottom .kadence-blocks-gallery-item__caption, .r316 .kadence-blocks-gallery-item .kadence-blocks-gallery-item__caption { font-family: var(--r-body); font-weight: 700; } /* Generic buttons from blocks */ .r316 .wp-block-button__link, .r316 .ast-button, .r316 button.ast-button, .r316 input[type="submit"]:not(.search-submit) { border-radius: 999px; font-family: var(--r-body); font-weight: 700; background-color: var(--r-red-strong); color: var(--r-paper); border-color: var(--r-red-strong); } .r316 .wp-block-button__link:hover, .r316 .ast-button:hover, .r316 input[type="submit"]:not(.search-submit):hover { background-color: var(--r-red-hover); border-color: var(--r-red-hover); color: var(--r-paper); } /* 9. Footer (Astra small footer) -------------------------------------------------------- */ .r316 #colophon .ast-small-footer, .r316 .ast-small-footer { background: var(--r-ink) !important; color: var(--r-soft) !important; padding: clamp(40px, 5vw, 72px) 0 !important; border: 0 !important; font-size: 15px; } .r316 .ast-small-footer .ast-footer-overlay { background: transparent !important; padding: 0 !important; } .r316 .ast-small-footer .ast-container { max-width: var(--r-max); padding-left: var(--r-gutter); padding-right: var(--r-gutter); } .r316 .ast-small-footer strong { display: block; margin-bottom: var(--r-s3); font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--r-red-light); } .r316 .ast-small-footer ul { list-style: none; margin: 0 0 var(--r-s5); padding: 0; display: flex; flex-direction: column; gap: var(--r-s1); } .r316 .ast-small-footer ul li { margin: 0; } .r316 .ast-small-footer a { color: var(--r-soft) !important; text-decoration: none; display: inline-flex; align-items: center; min-height: 32px; font-size: 16px; } .r316 .ast-small-footer a:hover { color: var(--r-paper) !important; text-decoration: underline; text-underline-offset: 3px; } .r316 .ast-small-footer .ast-footer-site-title { font-weight: 700; color: var(--r-paper); } @media (max-width: 767px) { .r316 .ast-small-footer .ast-small-footer-section { text-align: left !important; } .r316 .ast-small-footer .ast-small-footer-section-2 { margin-top: var(--r-s5); padding-top: var(--r-s5); border-top: 1px solid var(--r-ink-3); } } /* PJAX loading hint */ .r316-navigating #content { opacity: .55; transition: opacity .15s; } .r316-navigating body { cursor: progress; } /* 10. Motion ---------------------------------------------------------------------------- */ @media (prefers-reduced-motion: reduce) { .r316 *, .r316 *::before, .r316 *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } } /* 11. Fixes after first deploy ------------------------------------------------------------ */ /* Headings never break mid-word */ .r316 h1, .r316 h2, .r316 h3, .r316 .entry-title { overflow-wrap: normal; word-break: normal; -webkit-hyphens: manual; hyphens: manual; } @media (max-width: 640px) { .r316 .entry-title, .r316 .entry-content h1 { font-size: 26px; line-height: 1.2; } .r316 .entry-content h2 { font-size: 21px; } .r316.ast-separate-container .ast-article-single, .r316.ast-separate-container .ast-article-post, .r316.ast-separate-container .r316-more { padding: var(--r-s5) var(--r-s4); border-radius: 18px; } .r316.ast-separate-container #primary { margin: var(--r-s4) 0; } .r316.ast-separate-container .ast-container { padding-left: 12px; padding-right: 12px; } } /* Now-playing card: hide the "3:16" placeholder once real artwork is shown */ .r316-np__art img:not([hidden]) ~ .r316-np__fallback { display: none; } /* Player: song title gets priority over the artist line */ .r316-player__title a { flex: 0 1 auto; min-width: 4em; max-width: 60%; } .r316-player__artist { flex: 1 1 0; } @media (max-width: 921px) { .r316-player__title a { max-width: 100%; } } /* Range input: brand colours on all browsers */ .r316-player__volume input[type="range"] { -webkit-appearance: none; appearance: none; height: 4px; border-radius: 4px; background: var(--r-ink-3); } .r316-player__volume input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; border-radius: 50%; background: var(--r-red); border: 0; } .r316-player__volume input[type="range"]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--r-red); border: 0; } /* 12. Header fit + artwork (v1.0.2) ------------------------------------------------------ */ @media (min-width: 922px) { body.r316 #masthead .main-header-menu { flex-wrap: nowrap; } body.r316 #masthead .search-form .search-field { width: 48px; padding: 0; color: transparent; cursor: pointer; background: var(--r-cream-2); } body.r316 #masthead .search-form .search-field::placeholder { color: transparent; } body.r316 #masthead .search-form .search-field:focus { width: 260px; padding: 0 48px 0 20px; color: var(--r-ink); cursor: text; background: var(--r-paper); } body.r316 #masthead .search-form .search-field:focus::placeholder { color: var(--r-muted); } } @media (min-width: 922px) and (max-width: 1180px) { body.r316 .main-header-menu > .r316-menu-support { display: none; } } /* Now-playing artwork: AzuraCast art is small, so show it as a crisp square on a dark stage */ .r316-np__art { aspect-ratio: auto; height: 240px; background: radial-gradient(circle at 50% 40%, #2A2630 0%, var(--r-ink-2) 70%); } .r316-np__art img { position: static; width: 168px; height: 168px; border-radius: 16px; box-shadow: 0 16px 40px rgba(0, 0, 0, .5); } @media (max-width: 921px) { .r316-np__art { height: 96px; background: var(--r-ink-3); } .r316-np__art img { width: 96px; height: 96px; border-radius: 0; box-shadow: none; } } /* Inner pages: less empty space above the content box */ .r316.ast-separate-container #primary, .r316.ast-separate-container #secondary { padding-top: var(--r-s7); padding-bottom: var(--r-s7); margin-top: 0; } @media (max-width: 640px) { .r316.ast-separate-container #primary { padding-top: var(--r-s4); padding-bottom: var(--r-s5); } } /* Теми page (Spectra taxonomy list) → compact chips + live filter */ .r316 .uagb-taxonomy__outer-wrap.uagb-layout-grid { display: flex !important; flex-wrap: wrap; gap: var(--r-s2); grid-template-columns: none !important; } .r316 .uagb-taxonomy__outer-wrap .uagb-taxomony-box { padding: 0 !important; margin: 0 !important; border: 0 !important; background: none !important; width: auto !important; box-shadow: none !important; text-align: left !important; } .r316 .uagb-taxonomy__outer-wrap .uagb-tax-link { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--r-soft); background: var(--r-paper); text-decoration: none !important; transition: background .2s, border-color .2s, color .2s; } .r316 .uagb-taxonomy__outer-wrap .uagb-tax-link:hover { background: var(--r-ink); border-color: var(--r-ink); } .r316 .uagb-taxonomy__outer-wrap .uagb-tax-title { font-family: var(--r-body) !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.2 !important; margin: 0 !important; padding: 0 !important; color: var(--r-ink) !important; text-align: left !important; } .r316 .uagb-taxonomy__outer-wrap .uagb-tax-link:hover .uagb-tax-title { color: var(--r-cream) !important; } .r316 .uagb-taxonomy__outer-wrap .uagb-tax-count { display: none; } .r316-filter { display: flex; flex-wrap: wrap; align-items: center; gap: var(--r-s3); margin: 0 0 var(--r-s5); } .r316-filter input[type="search"] { flex: 1 1 260px; max-width: 420px; height: 52px; padding: 0 20px; border-radius: 999px; border: 1.5px solid var(--r-soft); background: var(--r-paper); font-size: 16px; color: var(--r-ink); } .r316-filter input[type="search"]:focus { border-color: var(--r-ink); } .r316-filter__count { font-size: 14px; color: var(--r-muted); } .r316-filter__empty { color: var(--r-muted); } .r316 .uagb-taxonomy__outer-wrap .uagb-taxomony-box[hidden] { display: none !important; } /* 13. Light theme for the player bar and homepage hero (v1.1.0) ------------------------------ */ /* Player bar: white strip between the cream header and the page */ .r316-player { background: var(--r-paper); color: var(--r-ink); border-top: 1px solid var(--r-line); border-bottom: 1px solid var(--r-line); box-shadow: 0 6px 20px -12px rgba(23, 21, 26, .18); } .r316-player__toggle { background: var(--r-red-strong); color: var(--r-paper); } .r316-player__toggle:hover { background: var(--r-red-hover); } .r316-player__badge { color: var(--r-red-text); } .r316-player[data-mode="episode"] .r316-player__badge .r316-dot { background: var(--r-muted); } .r316-player__title a { color: var(--r-ink); } .r316-player__title a:hover { color: var(--r-red-text); } .r316-player__artist, .r316-player__next { color: var(--r-muted); } .r316-player__art { box-shadow: 0 0 0 1px var(--r-line); } .r316-player__golive { border-color: var(--r-red-text); color: var(--r-red-text); } .r316-player__golive:hover { background: var(--r-red-strong); border-color: var(--r-red-strong); color: var(--r-paper); } .r316-player__mute { color: var(--r-muted); } .r316-player__mute:hover { color: var(--r-ink); background: var(--r-cream-2); } .r316-player__volume input[type="range"] { background: var(--r-line); } .r316-player__error { color: var(--r-red-text); } @media (max-width: 921px) { .r316-player { background: var(--r-paper); border: 1px solid var(--r-line); box-shadow: 0 12px 32px rgba(23, 21, 26, .18); } } /* Hero: warm light stage */ .r316-hero { background: radial-gradient(1200px 600px at 85% 20%, rgba(221, 94, 75, .10), transparent 60%), linear-gradient(180deg, var(--r-cream) 0%, #F3EAE0 100%); color: var(--r-ink); border-bottom: 1px solid var(--r-line); } .r316-hero .r316-eyebrow { color: var(--r-red-text); } .r316 .r316-hero__title { color: var(--r-ink); } .r316-hero__lead { color: #4A443F; } .r316-hero__link { color: var(--r-ink) !important; } .r316-hero__link:hover { color: var(--r-red-text) !important; } .r316-hero__watermark { color: rgba(221, 94, 75, .07); } /* Now-playing card on light */ .r316-np { background: var(--r-paper); box-shadow: 0 24px 60px -20px rgba(23, 21, 26, .25), 0 0 0 1px var(--r-line); } .r316-np__art { background: radial-gradient(circle at 50% 40%, #FFFFFF 0%, var(--r-cream-2) 75%); } .r316-np__art img { box-shadow: 0 16px 36px -10px rgba(23, 21, 26, .35); } @media (max-width: 921px) { .r316-np { background: var(--r-paper); color: var(--r-ink); box-shadow: 0 0 0 1px var(--r-line); } .r316-np__art { background: var(--r-cream-2); } .r316-np .r316-eyebrow { color: var(--r-red-text); } .r316-np__title { color: var(--r-ink); } .r316-np__artist, .r316-np__next { color: var(--r-muted); } } /* Section rhythm below a light hero: white → cream → white */ .r316-home [aria-labelledby="r316-shows-title"] { background: var(--r-paper); } /* shows */ .r316-home [aria-labelledby="r316-eps-title"] { background: var(--r-cream); } /* episodes */ .r316-home [aria-labelledby="r316-eps-title"] .r316-card { background: var(--r-paper); box-shadow: 0 0 0 1px var(--r-line); } .r316-home [aria-labelledby="r316-topics-title"] { background: var(--r-paper); } /* topics */ .r316-home [aria-labelledby="r316-topics-title"] .r316-chip--lg { background: var(--r-cream); } @media (max-width: 640px) { .r316-home [aria-labelledby="r316-eps-title"] .r316-card { background: transparent; box-shadow: none; } } /* 14. Live card (Слушайте): no placeholder behind real artwork + light style (v1.1.1) -------- */ .r316-livecard__art.has-art, .r316-livecard__art:has(img:not([hidden])) { background: var(--r-paper); } .r316-np__art.has-art .r316-np__fallback { display: none; } .r316-livecard { background: var(--r-paper); color: var(--r-ink); box-shadow: 0 24px 60px -24px rgba(23, 21, 26, .22), 0 0 0 1px var(--r-line); } .r316-livecard__art { background-color: var(--r-cream-2); box-shadow: 0 0 0 1px var(--r-line); } .r316-livecard .r316-eyebrow { color: var(--r-red-text); } .r316 .r316-livecard__title { color: var(--r-ink) !important; } .r316 .r316-livecard p { color: var(--r-muted); } /* 15. Show pages: light header block instead of dark grey (v1.2.0) ---------------------------- */ .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child { background: var(--r-cream) !important; border-radius: var(--r-radius); overflow: hidden; box-shadow: 0 0 0 1px var(--r-line); margin-bottom: var(--r-s6); } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child > .uagb-columns__overlay { background: var(--r-cream) !important; opacity: 1 !important; } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child .has-white-color { color: var(--r-ink) !important; } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child p { color: #4A443F !important; font-size: 17px; } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child h1 { color: var(--r-ink) !important; } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child img { border-radius: 16px; } .r316 .entry-content > .wp-block-uagb-columns.uagb-columns__background-color:first-child .wp-block-getwid-advanced-spacer { height: 32px !important; } /* Section headings typed in lowercase ("последни предавания") */ .r316 .entry-content .uagb-heading-text::first-letter { text-transform: uppercase; } .r316 .entry-content .uagb-heading-text { font-family: var(--r-display); font-weight: 600; letter-spacing: -0.01em; } /* Breadcrumb bar: quiet, below the player */ .r316 .ast-header-breadcrumb { background: var(--r-cream) !important; border-bottom: 1px solid var(--r-line); } .r316 .ast-header-breadcrumb .ast-container { max-width: var(--r-max); padding-left: var(--r-gutter); padding-right: var(--r-gutter); } .r316 .ast-header-breadcrumb, .r316 .ast-header-breadcrumb * { font-size: 14px; } /* 16. Audit round 2 (v1.3.0) ------------------------------------------------------------------- */ /* Mobile player: never wrap the play button to a second row */ @media (max-width: 921px) { .r316-player__inner { flex-wrap: nowrap; } .r316-player__meta { flex: 1 1 0; min-width: 0; } .r316-player__error { position: absolute; left: 12px; right: 12px; bottom: calc(100% + 6px); background: var(--r-paper); border-radius: 10px; padding: 6px 10px !important; box-shadow: 0 0 0 1px var(--r-line); } } .r316-player__title a { line-height: 24px; min-height: 24px; display: inline-block; } /* Tap targets ≥ 24px */ .r316 #masthead .custom-logo-link { display: block; } .r316 .ast-header-breadcrumb a { display: inline-block; padding: 3px 0; min-height: 24px; } @media (max-width: 640px) { .r316-card .r316-chip { min-height: 24px; } } /* Volume slider: 24px hit area, 4px visual track */ .r316-player__volume input[type="range"] { height: 24px; background: transparent !important; cursor: pointer; } .r316-player__volume input[type="range"]::-webkit-slider-runnable-track { height: 4px; border-radius: 4px; background: var(--r-line); } .r316-player__volume input[type="range"]::-webkit-slider-thumb { margin-top: -5px; } .r316-player__volume input[type="range"]::-moz-range-track { height: 4px; border-radius: 4px; background: var(--r-line); } /* Social Snap share buttons: AA contrast, no horizontal overflow on phones */ .r316 .ss-facebook-color:not(.ss-custom-color) { background-color: #1464D8 !important; } .r316 .ss-inline-share-content, .r316 .ss-social-icons-container { flex-wrap: wrap !important; max-width: 100%; } .r316 .ss-inline-share-wrapper { max-width: 100%; overflow: hidden; } /* Page title for pages that had none */ .r316 .r316-page-title { margin: 0 0 var(--r-s5); } /* Listings: archives, topics, search, 404 */ .r316-listing { width: 100%; } .r316-listing__head { display: flex; flex-direction: column; align-items: flex-start; gap: var(--r-s3); margin: 0 0 var(--r-s6); } .r316 .r316-listing__title { font-family: var(--r-display); font-weight: 600; font-size: clamp(28px, 3.6vw, 48px); line-height: 1.1; margin: 0; color: var(--r-ink); } .r316-listing__desc { margin: 0; color: var(--r-muted); font-size: 17px; } .r316-listing .r316-card { background: var(--r-paper); box-shadow: 0 0 0 1px var(--r-line); } .r316-listing .r316-card .r316-card__title { font-size: 19px; } @media (max-width: 640px) { .r316-listing .r316-card { background: transparent; box-shadow: none; } } .r316-listing .search-form { display: flex; gap: var(--r-s2); width: 100%; max-width: 520px; margin-top: var(--r-s2); position: relative; } .r316-listing .search-form label { flex: 1 1 auto; margin: 0; } .r316-listing .search-form .search-field { width: 100%; height: 52px; padding: 0 20px; border-radius: 999px; border: 1.5px solid var(--r-soft); background: var(--r-paper); font-size: 16px; } .r316-listing .search-form .search-field:focus { border-color: var(--r-ink); } .r316-listing .search-form .search-submit { height: 52px; padding: 0 24px; border-radius: 999px; border: 0; background: var(--r-ink); color: var(--r-cream); font-weight: 700; cursor: pointer; } .r316-listing .search-form .search-submit:hover { background: var(--r-ink-3); } .r316-listing .navigation.pagination { margin-top: var(--r-s7); } .r316-listing .nav-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--r-s1); } .r316-empty { padding: var(--r-s7) 0; color: var(--r-muted); } .r316-404__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--r-s5); margin-top: var(--r-s4); } .r316-404 .r316-h2 { margin-bottom: var(--r-s5) !important; } .r316.ast-separate-container .r316-listing { padding-top: var(--r-s7); } /* Keyboard focus never hidden under the sticky player (WCAG 2.4.11) */ html { scroll-padding-top: calc(var(--wp-admin--admin-bar--height, 0px) + 72px); } @media (max-width: 921px) { html { scroll-padding-top: 16px; scroll-padding-bottom: 96px; } } /* 17. Episode transport: ±15 s + seek bar in the radio bar (v1.4.0) ----------------------------- */ .r316-js .r316-native-audio { display: none; } .r316-player__transport { display: flex; align-items: center; gap: var(--r-s1); flex: 0 0 auto; } .r316-player__skip { width: 40px; height: 40px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; background: transparent; color: var(--r-ink); display: inline-flex; align-items: center; justify-content: center; transition: background .2s, color .2s; } .r316-player__skip[hidden] { display: none; } .r316-player__skip:hover { background: var(--r-cream-2); color: var(--r-red-text); } .r316-player[data-mode="episode"] .r316-player__meta { flex: 0 1 300px; } .r316-player__progress { flex: 1 1 260px; min-width: 160px; display: flex; align-items: center; gap: var(--r-s3); } .r316-player__progress[hidden] { display: none; } .r316-player__time { font-size: 13px; color: var(--r-muted); font-variant-numeric: tabular-nums; min-width: 3.2em; text-align: center; } .r316-player__progress input[type="range"] { --r316-pct: 0%; flex: 1 1 auto; min-width: 0; height: 24px; margin: 0; padding: 0; border: 0; cursor: pointer; -webkit-appearance: none; appearance: none; background: transparent; } .r316-player__progress input[type="range"]::-webkit-slider-runnable-track { height: 4px; border-radius: 4px; background: linear-gradient(to right, var(--r-red-strong) var(--r316-pct), var(--r-line) var(--r316-pct)); } .r316-player__progress input[type="range"]::-moz-range-track { height: 4px; border-radius: 4px; background: var(--r-line); } .r316-player__progress input[type="range"]::-moz-range-progress { height: 4px; border-radius: 4px; background: var(--r-red-strong); } .r316-player__progress input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 14px; height: 14px; margin-top: -5px; border-radius: 50%; background: var(--r-red-strong); border: 2px solid var(--r-paper); box-shadow: 0 0 0 1px var(--r-red-strong); } .r316-player__progress input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: var(--r-red-strong); border: 2px solid var(--r-paper); } .r316-player__progress input[type="range"]:hover::-webkit-slider-thumb { transform: scale(1.15); } @media (max-width: 1180px) and (min-width: 922px) { .r316-player[data-mode="episode"] .r316-player__volume { display: none; } } /* Mobile: [art][title][−15][▶][+15], thin seek line along the bottom edge */ @media (max-width: 921px) { .r316-player__transport { order: 5; gap: 0; } .r316-player__toggle { order: 0; } .r316-player__skip { width: 40px; height: 44px; } .r316-player[data-mode="episode"] .r316-player__meta { flex: 1 1 0; } .r316-player__progress { position: absolute; left: 14px; right: 14px; bottom: 2px; min-width: 0; gap: 0; } .r316-player__progress .r316-player__time { display: none; } .r316-player__progress input[type="range"] { height: 16px; } .r316-player__progress input[type="range"]::-webkit-slider-runnable-track { height: 3px; } .r316-player__progress input[type="range"]::-webkit-slider-thumb { width: 12px; height: 12px; margin-top: -4.5px; } .r316-player[data-mode="episode"] .r316-player__inner { padding-bottom: 10px; min-height: 72px; } .r316-player { overflow: visible; } } @media (max-width: 921px) { .r316-player[data-mode="episode"] .r316-player__golive { display: none !important; } } .r316-player[data-mode="episode"] .r316-player__meta { flex-direction: column; align-items: flex-start; gap: 0; flex: 1 1 280px; } .r316-player[data-mode="episode"] .r316-player__badge { font-size: 11px; line-height: 1.3; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .r316-player[data-mode="episode"] .r316-player__title a { max-width: 100%; } .r316-player[data-mode="episode"] .r316-player__progress { flex: 1 1 240px; } .r316-player__meta { overflow: hidden; } .r316-player__title { max-width: 100%; min-width: 0; } .r316-player__title a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* Mobile horizontal scroll fix (v1.4.3): Astra footer row's negative margins overflowed the viewport */ .r316 .ast-small-footer .ast-row { margin-left: 0; margin-right: 0; } .r316 .ast-small-footer .ast-small-footer-section { padding-left: 0; padding-right: 0; } /* Safety net: nothing may widen the page (clip keeps the sticky player working, unlike overflow:hidden) */ html, body.r316 { overflow-x: clip; } /* 18. Mobile slide-in menu (v1.5.0) ------------------------------------------------------------ */ .r316-drawer[hidden] { display: none !important; } .r316-drawer { position: fixed; inset: 0; z-index: 100000; } .r316-drawer__backdrop { position: absolute; inset: 0; background: rgba(23, 21, 26, .45); opacity: 0; transition: opacity .3s var(--r-ease); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } .r316-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(88vw, 380px); background: var(--r-cream); color: var(--r-ink); display: flex; flex-direction: column; gap: var(--r-s5); padding: calc(var(--r-s4) + env(safe-area-inset-top, 0px)) var(--r-s5) calc(var(--r-s5) + env(safe-area-inset-bottom, 0px)); box-shadow: -24px 0 60px rgba(23, 21, 26, .25); transform: translateX(100%); transition: transform .3s var(--r-ease); overflow-y: auto; overscroll-behavior: contain; outline: none; } .r316-drawer.is-open .r316-drawer__backdrop { opacity: 1; } .r316-drawer.is-open .r316-drawer__panel { transform: translateX(0); } html.r316-drawer-open, html.r316-drawer-open body { overflow: hidden; } .admin-bar .r316-drawer__panel { top: var(--wp-admin--admin-bar--height, 0px); } .r316-drawer__top { display: flex; align-items: center; justify-content: space-between; } .r316-drawer__logo img { width: 48px; height: 48px; display: block; } .r316-drawer__close { width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--r-line); background: var(--r-paper); color: var(--r-ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; } .r316-drawer__close:hover { background: var(--r-ink); color: var(--r-cream); } .r316-drawer__live { width: 100%; } .r316-drawer__menu { list-style: none; margin: 0; padding: 0; } .r316-drawer__menu > li { margin: 0; border-bottom: 1px solid var(--r-line); } .r316-drawer__menu > li:first-child { border-top: 1px solid var(--r-line); } .r316-drawer__menu a { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 0 var(--r-s1); font-family: var(--r-display); font-weight: 600; font-size: 20px; letter-spacing: -0.01em; color: var(--r-ink) !important; text-decoration: none !important; } .r316-drawer__menu a::after { content: ""; width: 10px; height: 10px; border-right: 2px solid currentColor; border-top: 2px solid currentColor; transform: rotate(45deg); opacity: .35; transition: opacity .2s, transform .2s; } .r316-drawer__menu a:hover::after { opacity: 1; transform: translateX(3px) rotate(45deg); } .r316-drawer__menu .current-menu-item > a, .r316-drawer__menu .current-menu-ancestor > a { color: var(--r-red-text) !important; } .r316-drawer__menu .current-menu-item > a::after { opacity: 1; } .r316-drawer__menu .sub-menu { list-style: none; margin: 0 0 var(--r-s3); padding: 0 0 0 var(--r-s4); } .r316-drawer__menu .sub-menu a { font-family: var(--r-body); font-size: 16px; min-height: 44px; } .r316-drawer__bottom { margin-top: auto; display: flex; flex-direction: column; gap: var(--r-s4); } .r316-drawer__support { width: 100%; } .r316-drawer__label { margin: var(--r-s2) 0 0; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-muted); } .r316-drawer__social { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--r-s2); flex-wrap: wrap; } .r316-drawer__social li { margin: 0; } .r316-drawer__social a { width: 48px; height: 48px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--r-paper); color: var(--r-ink) !important; box-shadow: 0 0 0 1px var(--r-line); transition: background .2s, color .2s, transform .2s var(--r-ease); } .r316-drawer__social a:hover { background: var(--r-red-strong); color: var(--r-paper) !important; transform: translateY(-2px); } /* Staggered entrance for menu items */ .r316-drawer__menu > li, .r316-drawer__live, .r316-drawer__bottom { opacity: 0; transform: translateX(16px); transition: opacity .3s var(--r-ease), transform .3s var(--r-ease); } .r316-drawer.is-open .r316-drawer__live { opacity: 1; transform: none; transition-delay: .06s; } .r316-drawer.is-open .r316-drawer__menu > li { opacity: 1; transform: none; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(1) { transition-delay: .09s; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(2) { transition-delay: .12s; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(3) { transition-delay: .15s; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(4) { transition-delay: .18s; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(5) { transition-delay: .21s; } .r316-drawer.is-open .r316-drawer__menu > li:nth-child(n+6) { transition-delay: .24s; } .r316-drawer.is-open .r316-drawer__bottom { opacity: 1; transform: none; transition-delay: .26s; } /* The mobile player bar stays below the drawer; hide it while the menu is open */ html.r316-drawer-open .r316-player { visibility: hidden; } @media (min-width: 922px) { .r316-drawer { display: none !important; } } /* 19. Search: instant suggestions + results page (v1.6.0) --------------------------------------- */ .r316-suggest-host { position: relative; } .r316-suggest { position: absolute; top: calc(100% + 8px); right: 0; z-index: 1000; width: min(440px, calc(100vw - 24px)); max-height: min(70vh, 560px); overflow-y: auto; overscroll-behavior: contain; background: var(--r-paper); color: var(--r-ink); border-radius: 18px; padding: var(--r-s2); box-shadow: 0 24px 60px -12px rgba(23, 21, 26, .28), 0 0 0 1px var(--r-line); text-align: left; } .r316-suggest[hidden] { display: none; } .r316-suggest__group + .r316-suggest__group { margin-top: var(--r-s2); padding-top: var(--r-s2); border-top: 1px solid var(--r-line); } .r316-suggest__label { padding: var(--r-s2) var(--r-s3) var(--r-s1); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-muted); } .r316-suggest__item { display: flex; align-items: center; gap: var(--r-s3); padding: var(--r-s2) var(--r-s3); border-radius: 12px; color: var(--r-ink) !important; text-decoration: none !important; min-height: 44px; } .r316-suggest__item:hover, .r316-suggest__item.is-active { background: var(--r-cream-2); } .r316-suggest__item.is-active { box-shadow: inset 0 0 0 2px var(--r-red); } .r316-suggest__img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex: 0 0 auto; background: var(--r-line); } .r316-suggest__item.is-show .r316-suggest__img { border-radius: 12px; } .r316-suggest__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; } .r316-suggest__text strong { font-size: 15px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .r316-suggest__text small { font-size: 13px; color: var(--r-muted); } .r316-suggest__chips { display: flex; flex-wrap: wrap; gap: 6px; padding: var(--r-s1) var(--r-s3) var(--r-s2); } .r316-suggest__item.is-chip { min-height: 36px; padding: 0 14px; border-radius: 999px; background: var(--r-cream); font-size: 14px; font-weight: 600; box-shadow: 0 0 0 1px var(--r-line); } .r316-suggest__item.is-chip:hover, .r316-suggest__item.is-chip.is-active { background: var(--r-ink); color: var(--r-cream) !important; box-shadow: none; } .r316-suggest__item.is-all { margin-top: var(--r-s2); justify-content: center; font-weight: 700; color: var(--r-red-text) !important; background: var(--r-cream); } .r316-suggest__empty { margin: 0; padding: var(--r-s4); color: var(--r-muted); font-size: 15px; } .r316-suggest-host.is-searching .search-submit { animation: r316-pulse-bg 1s ease-in-out infinite; } @keyframes r316-pulse-bg { 50% { opacity: .5; } } /* Header (desktop): keep the field open while the dropdown is in use */ @media (min-width: 922px) { body.r316 #masthead .search-form:focus-within .search-field { width: 300px; padding: 0 48px 0 20px; color: var(--r-ink); cursor: text; background: var(--r-paper); } body.r316 #masthead .search-form:focus-within .search-field::placeholder { color: var(--r-muted); } } /* Header (mobile): dropdown spans the screen under the header */ @media (max-width: 921px) { #masthead .r316-suggest { position: fixed; top: auto; left: 12px; right: 12px; width: auto; margin-top: 8px; max-height: 65vh; } #masthead .r316-suggest-host { position: static; } } /* Results page */ .r316-searchpage-form { width: 100%; max-width: 640px; } .r316-sr-block { width: 100%; margin-top: var(--r-s5); } .r316 .r316-sr-label { margin: 0 0 var(--r-s3); font-family: var(--r-body); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-muted); } .r316-sr-shows { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--r-s3); } .r316-sr-shows li { margin: 0; } .r316-sr-shows a { display: flex; align-items: center; gap: var(--r-s3); padding: var(--r-s2) var(--r-s4) var(--r-s2) var(--r-s2); border-radius: 16px; background: var(--r-paper); box-shadow: 0 0 0 1px var(--r-line); color: var(--r-ink) !important; text-decoration: none !important; } .r316-sr-shows a:hover { box-shadow: 0 0 0 2px var(--r-ink); } .r316-sr-shows img { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; } .r316-sr-shows span { display: flex; flex-direction: column; line-height: 1.3; } .r316-sr-shows small { color: var(--r-muted); font-size: 13px; } .r316-chip__n { font-size: 12px; color: var(--r-muted); margin-left: 6px; } .r316-filter-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--r-s2); } .r316-filter-chips li { margin: 0; } .r316-fchip { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px; border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--r-ink) !important; text-decoration: none !important; background: var(--r-paper); box-shadow: 0 0 0 1px var(--r-soft); } .r316-fchip span { font-size: 12px; color: var(--r-muted); } .r316-fchip:hover { box-shadow: 0 0 0 2px var(--r-ink); } .r316-fchip.is-active { background: var(--r-ink); color: var(--r-cream) !important; box-shadow: none; } .r316-fchip.is-active span { color: var(--r-soft); } @media (max-width: 640px) { .r316-filter-chips { flex-wrap: nowrap; overflow-x: auto; margin-right: calc(-1 * var(--r-gutter)); padding-right: var(--r-gutter); scrollbar-width: none; } .r316-fchip { white-space: nowrap; } } /* 20. Fixes round (v1.7.0) --------------------------------------------------------------------- */ /* Search dropdown above the sticky radio bar (header stacks over the bar) */ .r316 #masthead { position: relative; z-index: 100; } .r316-suggest mark { background: #F6D5CD; color: inherit; border-radius: 3px; padding: 0 1px; } @media (max-width: 921px) { #masthead .r316-suggest { position: fixed; left: 12px; right: 12px; top: 72px; bottom: auto; width: auto; margin: 0; } } /* Mobile menu button: one big, reliable 48px target */ .r316-js #masthead .ast-mobile-menu-buttons.r316-has-burger > .ast-button-wrap { display: none !important; } .r316-burger { width: 48px; height: 48px; padding: 0 !important; border-radius: 999px; border: 1px solid var(--r-line) !important; background: var(--r-paper) !important; color: var(--r-ink) !important; display: inline-flex !important; align-items: center; justify-content: center; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; } .r316-burger svg { pointer-events: none; } .r316-burger:hover, .r316-burger[aria-expanded="true"] { background: var(--r-ink) !important; color: var(--r-cream) !important; } @media (min-width: 922px) { .r316-burger { display: none !important; } } /* Page intros built with a Spectra info box (Събития, Проекти, …) */ .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-icon-wrap, .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-image-icon-content, .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-separator-parent { display: none !important; } .r316 .entry-content > .wp-block-uagb-info-box:first-of-type { margin: 0 0 var(--r-s7); text-align: left !important; } .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-content, .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-infobox__content-wrap { text-align: left !important; padding: 0 !important; } .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-title { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: clamp(30px, 3.6vw, 48px) !important; line-height: 1.1 !important; color: var(--r-ink) !important; margin: 0 0 var(--r-s3) !important; text-align: left !important; } .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-title::first-letter { text-transform: uppercase; } .r316 .entry-content > .wp-block-uagb-info-box:first-of-type .uagb-ifb-desc { font-size: 18px !important; color: var(--r-muted) !important; margin: 0 !important; max-width: 40em; text-align: left !important; } /* Събития: each event as a card (video, title, place · date, text) */ .r316-page-events .entry-content .uagb-columns__inner-wrap { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--r-s6) !important; } .r316-page-events .entry-content .uagb-column__wrap { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; } .r316-page-events .entry-content .wp-block-group { height: 100%; background: var(--r-cream); border-radius: var(--r-radius); overflow: hidden; box-shadow: 0 0 0 1px var(--r-line); } .r316-page-events .entry-content .wp-block-group__inner-container { padding: 0 0 var(--r-s5); } .r316-page-events .entry-content .wp-block-embed { margin: 0 0 var(--r-s4) !important; } .r316-page-events .entry-content .wp-block-embed iframe { border-radius: 0; } .r316-page-events .entry-content .wp-block-group h3 { text-align: left !important; font-family: var(--r-display) !important; font-weight: 600; font-size: 22px; line-height: 1.25; margin: 0 var(--r-s5) var(--r-s3); } .r316-page-events .entry-content .wp-block-group ul { list-style: none; margin: 0 var(--r-s5) var(--r-s3); padding: 0; display: flex; flex-wrap: wrap; gap: var(--r-s2); } .r316-page-events .entry-content .wp-block-group ul li { margin: 0; font-size: 14px; font-weight: 700; color: var(--r-ink); background: var(--r-paper); box-shadow: 0 0 0 1px var(--r-line); border-radius: 999px; padding: 4px 12px; line-height: 1.5; } .r316-page-events .entry-content .wp-block-group ul li:last-child { color: var(--r-red-text); } .r316-page-events .entry-content .wp-block-group p { margin: 0 var(--r-s5); font-size: 16px; line-height: 1.7; color: var(--r-text); } /* Проекти: projects as clickable cards */ .r316-page-3-16-pro .entry-content .uagb-columns__inner-wrap { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--r-s6) !important; } .r316-page-3-16-pro .entry-content .uagb-column__wrap { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; } .r316-page-3-16-pro .wp-block-kadence-infobox { height: 100%; } .r316-page-3-16-pro .kt-blocks-info-box-link-wrap { display: flex !important; flex-direction: column; height: 100%; padding: 0 !important; margin: 0 !important; background: var(--r-cream) !important; border: 0 !important; border-radius: var(--r-radius) !important; overflow: hidden; box-shadow: 0 0 0 1px var(--r-line) !important; text-align: left !important; text-decoration: none !important; transition: transform .25s var(--r-ease), box-shadow .25s var(--r-ease); } .r316-page-3-16-pro .kt-blocks-info-box-link-wrap:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(23, 21, 26, .12), 0 0 0 1px var(--r-line) !important; } .r316-page-3-16-pro .kt-blocks-info-box-media-container, .r316-page-3-16-pro .kt-blocks-info-box-media { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; } .r316-page-3-16-pro .kadence-info-box-image-inner-intrisic-container { max-width: none !important; } .r316-page-3-16-pro .kadence-info-box-image-intrisic { width: 100% !important; } .r316-page-3-16-pro .kt-info-box-image { border-radius: 0 !important; } .r316-page-3-16-pro .kt-infobox-textcontent { padding: var(--r-s5) 28px 28px !important; } .r316-page-3-16-pro .kt-blocks-info-box-title { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: 24px !important; line-height: 1.2 !important; color: var(--r-ink) !important; margin: 0 0 var(--r-s3) !important; text-align: left !important; } .r316-page-3-16-pro .kt-blocks-info-box-text { font-size: 16px !important; line-height: 1.7 !important; color: var(--r-text) !important; margin: 0 !important; text-align: left !important; } .r316-page-3-16-pro .kt-infobox-textcontent::after { content: "Към проекта →"; display: inline-block; margin-top: var(--r-s4); font-weight: 700; color: var(--r-red-text); } /* За нас: keep the full-width section inside the page box, tidy team cards */ .r316 .entry-content > .wp-block-getwid-section.alignfull { margin-left: 0 !important; margin-right: 0 !important; width: auto !important; max-width: 100% !important; left: auto !important; right: auto !important; } .r316 .entry-content > .wp-block-getwid-section .wp-block-getwid-section__wrapper { padding-left: 0 !important; padding-right: 0 !important; } .r316 .entry-content > .wp-block-getwid-section .wp-block-getwid-section__inner-wrapper { max-width: 100% !important; } .r316-page-about .wp-block-getwid-advanced-heading__content { font-family: var(--r-display) !important; font-weight: 600; } .r316-page-about .wp-block-getwid-advanced-heading__content::first-letter { text-transform: uppercase; } .r316-page-about .wp-block-columns.has-3-columns { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--r-s6) !important; margin: 0 !important; } .r316-page-about .wp-block-columns.has-3-columns > .wp-block-column { flex: none !important; width: auto !important; margin: 0 !important; min-width: 0; background: var(--r-cream); border-radius: var(--r-radius); overflow: hidden; box-shadow: 0 0 0 1px var(--r-line); padding-bottom: var(--r-s4); } .r316-page-about .wp-block-getwid-person { text-align: left; margin: 0; } .r316-page-about .wp-block-getwid-person__image { margin: 0 0 var(--r-s4) !important; } .r316-page-about .wp-block-getwid-person__image img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; border-radius: 0; } .r316-page-about .wp-block-getwid-person__content-wrapper { padding: 0 var(--r-s5); text-align: left !important; } .r316-page-about .wp-block-getwid-person__title { display: block; font-weight: 700; font-size: 19px; color: var(--r-ink); line-height: 1.3; } .r316-page-about .wp-block-getwid-person__subtitle { display: block; font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--r-red-text); margin-top: 4px; } .r316-page-about .wp-block-getwid-social-links { margin: var(--r-s3) 0 0 !important; } .r316-page-about .wp-block-getwid-social-links__list { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex; gap: var(--r-s2); justify-content: flex-start !important; } .r316-page-about .wp-block-getwid-social-links__list:empty { display: none; } .r316-page-about .wp-block-getwid-social-links__item { margin: 0 !important; list-style: none !important; } .r316-page-about .wp-block-getwid-social-links__item::marker { content: none; } .r316-page-about .wp-block-getwid-social-links__link { width: 36px; height: 36px; border-radius: 999px; display: inline-flex !important; align-items: center; justify-content: center; background: var(--r-paper); color: var(--r-ink) !important; box-shadow: 0 0 0 1px var(--r-line); text-decoration: none !important; } .r316-page-about .wp-block-getwid-social-links__link:hover { background: var(--r-ink); color: var(--r-cream) !important; } .r316-page-about .wp-block-getwid-social-links__link[href*="facebook.com"]::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 21v-7.5h2.6l.4-3h-3V8.6c0-.9.3-1.5 1.5-1.5h1.6V4.4c-.3 0-1.2-.1-2.3-.1-2.3 0-3.8 1.4-3.8 3.9v2.3H8v3h2.5V21h3z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 21v-7.5h2.6l.4-3h-3V8.6c0-.9.3-1.5 1.5-1.5h1.6V4.4c-.3 0-1.2-.1-2.3-.1-2.3 0-3.8 1.4-3.8 3.9v2.3H8v3h2.5V21h3z'/%3E%3C/svg%3E") center/contain no-repeat; } .r316-page-about .wp-block-getwid-social-links__link i, .r316-page-about .wp-block-getwid-social-links__link .wp-block-getwid-social-links__icon { display: none; } .r316-page-about .wp-block-columns.has-3-columns > .wp-block-column > p { padding: 0 var(--r-s5); font-size: 16px; line-height: 1.7; margin: var(--r-s3) 0 0; text-align: left; } .r316-page-about .entry-content > p.has-text-align-center:last-child, .r316-page-about .entry-content > p.has-text-align-center:last-of-type { margin-top: var(--r-s7); padding: var(--r-s5); background: var(--r-cream); border-radius: var(--r-radius); font-weight: 600; } .r316-page-about .wp-block-getwid-social-links__link .wp-block-getwid-social-links__wrapper { display: none !important; } /* Astra 4.14 search widget draws its own icon layer over the field — it must not swallow clicks */ .r316 #masthead .search-form::before, .r316 #masthead .search-form::after { display: none !important; pointer-events: none !important; } .r316-suggest__note { margin: 0 0 var(--r-s1); padding: var(--r-s2) var(--r-s3); font-size: 13px; color: var(--r-muted); } .r316-didyoumean { margin: var(--r-s3) 0 0; font-size: 17px; } .r316-didyoumean a { font-weight: 700; } /* Spectra column wrappers add their own padding/max-width — let the cards use the full page width */ .r316-page-events .entry-content > .uagb-columns__wrap, .r316-page-3-16-pro .entry-content > .uagb-columns__wrap { padding: 0 !important; margin: 0 !important; max-width: none !important; width: 100% !important; } .r316-page-events .entry-content .uagb-columns__inner-wrap, .r316-page-3-16-pro .entry-content .uagb-columns__inner-wrap { max-width: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } .r316-page-events .entry-content .uagb-column__inner-wrap, .r316-page-3-16-pro .entry-content .uagb-column__inner-wrap { padding: 0 !important; margin: 0 !important; height: 100%; } @media (max-width: 640px) { .r316-page-events .entry-content .uagb-columns__inner-wrap, .r316-page-3-16-pro .entry-content .uagb-columns__inner-wrap { grid-template-columns: minmax(0, 1fr); } } /* 21. Предавания page (theme grid) ------------------------------------------------- */ .r316-showspage { margin: var(--r-s5) 0 var(--r-s7); } .r316-shows--page { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--r-s6) var(--r-s5); } .r316-showspage__more { margin: var(--r-s8, 64px) 0 var(--r-s5) !important; font-size: clamp(22px, 2.4vw, 28px); } .r316-extras { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--r-s4); } .r316-extras li { margin: 0; } .r316-extra { position: relative; display: flex; flex-direction: column; gap: 4px; height: 100%; padding: var(--r-s5) 56px var(--r-s5) var(--r-s5); border-radius: var(--r-radius); background: var(--r-cream); border: 1px solid var(--r-line); color: var(--r-ink) !important; text-decoration: none !important; transition: border-color .2s, background .2s; } .r316-extra:hover, .r316-extra:focus-visible { border-color: var(--r-red); background: #fff; } .r316-extra__name { font-weight: 800; font-size: 18px; } .r316-extra__text { font-size: 14px; color: var(--r-muted); } .r316-extra svg { position: absolute; right: var(--r-s5); top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--r-red-text); transition: transform .2s; } .r316-extra:hover svg { transform: translate(4px, -50%); } @media (max-width: 921px) { .r316-extras { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 480px) { .r316-extras { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 921px) { .r316-shows--page { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 640px) { .r316-shows.r316-shows--page { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; scroll-snap-type: none; margin-right: 0; padding-right: 0; gap: var(--r-s5) var(--r-s3); } } /* 22. Kadence fallback (content kept readable without the Kadence Blocks plugin) ------ */ .r316-krow { display: grid; gap: var(--r-s5); grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); margin: 0 0 var(--r-s5); } .r316-krow--1 { --cols: 1; } .r316-krow--2 { --cols: 2; } .r316-krow--3 { --cols: 3; } .r316-krow--4 { --cols: 4; } .r316-krow--center-wide { grid-template-columns: 1fr 2fr 1fr; } .r316-krow > .wp-block-kadence-column { min-width: 0; } @media (max-width: 767px) { .r316-krow, .r316-krow--center-wide { grid-template-columns: minmax(0, 1fr); } } .wp-block-kadence-infobox { margin: 0 0 var(--r-s4); } .wp-block-kadence-infobox .kt-blocks-info-box-link-wrap { display: block; height: 100%; border-radius: var(--r-radius); text-decoration: none; color: inherit; } .wp-block-kadence-infobox .kt-info-halign-center { text-align: center; } .wp-block-kadence-infobox .kt-blocks-info-box-title { color: var(--r316-kb-title, inherit); margin: var(--r-s2) 0; } .wp-block-kadence-infobox img { max-width: 100%; height: auto; display: block; margin: 0 auto; border-radius: calc(var(--r-radius) - 4px); } .wp-block-kadence-infobox .kt-info-svg-icon svg { max-width: 72px; height: auto; } .r316-kgallery { list-style: none; margin: 0 0 var(--r-s6); padding: 0; display: grid; gap: var(--r-s3); } .r316-kgallery--grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } .r316-kgallery--strip { grid-auto-flow: column; grid-auto-columns: minmax(260px, 32%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--r-s2); } .r316-kgallery li { margin: 0; scroll-snap-align: start; } .r316-kgallery a { display: block; text-decoration: none; color: var(--r-ink); } .r316-kgallery img { width: 100%; height: auto; display: block; border-radius: var(--r-radius); } .r316-kgallery__cap { display: block; font-weight: 700; margin-top: var(--r-s2); } /* 23. Getwid fallback (only when the Getwid plugin is off: body.r316-no-getwid) ------ */ .r316-fa { width: 1em; height: 1em; display: inline-block; vertical-align: -0.125em; } .r316-no-getwid .wp-block-getwid-section { position: relative; } .r316-no-getwid .wp-block-getwid-section__wrapper { position: relative; padding-top: var(--r-s4); padding-bottom: var(--r-s4); } .r316-no-getwid .getwid-padding-top-small { padding-top: var(--r-s4); } .r316-no-getwid .getwid-padding-bottom-small { padding-bottom: var(--r-s4); } .r316-no-getwid .getwid-padding-top-medium { padding-top: var(--r-s6); } .r316-no-getwid .getwid-padding-bottom-medium { padding-bottom: var(--r-s6); } .r316-no-getwid .getwid-padding-top-large { padding-top: var(--r-s8); } .r316-no-getwid .getwid-padding-bottom-large { padding-bottom: var(--r-s8); } .r316-no-getwid .wp-block-getwid-section__inner-wrapper { position: relative; margin: 0 auto; } .r316-no-getwid .wp-block-getwid-section__background-holder { position: absolute; inset: 0; pointer-events: none; } .r316-no-getwid .wp-block-getwid-section__background, .r316-no-getwid .wp-block-getwid-section__foreground { position: absolute; inset: 0; } .r316-no-getwid .wp-block-getwid-section__content { position: relative; } .r316-no-getwid .wp-block-getwid-advanced-spacer { display: block; } .r316-no-getwid .wp-block-getwid-advanced-heading__content { margin: 0; } .r316-no-getwid .wp-block-getwid-icon { margin: 0 0 var(--r-s4); line-height: 1; color: var(--r-red-text); } .r316-no-getwid .wp-block-getwid-icon.is-aligned-center { text-align: center; } .r316-no-getwid .wp-block-getwid-image-box { margin: 0 0 var(--r-s5); } .r316-no-getwid .wp-block-getwid-image-box.has-text-center { text-align: center; } .r316-no-getwid .wp-block-getwid-image-box__image { display: block; max-width: 100%; height: auto; margin: 0 auto var(--r-s4); border-radius: var(--r-radius); } .r316-no-getwid .wp-block-getwid-person__image img { max-width: 100%; height: auto; display: block; } .r316-no-getwid .wp-block-getwid-person__title, .r316-no-getwid .wp-block-getwid-person__subtitle { display: block; } .r316-no-getwid .wp-block-getwid-social-links__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--r-s3); } .r316-no-getwid .getwid-justify-content-center { justify-content: center; } .r316-no-getwid .wp-block-getwid-social-links__item { margin: 0; } .r316-no-getwid .wp-block-getwid-social-links__link { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-size: 22px; text-decoration: none; } /* Image slider → scroll-snap carousel */ .r316-gslider { position: relative; margin: 0 0 var(--r-s5); } .r316-gslider__track { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; border-radius: var(--r-radius); } .r316-gslider__track::-webkit-scrollbar { display: none; } .r316-gslider__slide { margin: 0; scroll-snap-align: center; display: flex; align-items: center; justify-content: center; background: var(--r-paper); } .r316-gslider__slide figure { margin: 0; } .r316-gslider__slide a { display: block; } .r316-gslider__slide img { display: block; max-width: 100%; max-height: 70vh; width: auto; height: auto; margin: 0 auto; } .r316-gslider__btn { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 999px; border: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.92); color: var(--r-ink); box-shadow: 0 2px 10px rgba(23,21,26,.18); cursor: pointer; } .r316-gslider__btn:hover { background: var(--r-ink); color: var(--r-cream); } .r316-gslider__btn svg { width: 20px; height: 20px; } .r316-gslider__btn--prev { left: var(--r-s3); } .r316-gslider__btn--prev svg { transform: rotate(180deg); } .r316-gslider__btn--next { right: var(--r-s3); } @media (prefers-reduced-motion: reduce) { .r316-gslider__track { scroll-behavior: auto; } } /* 24. Аудиокниги: show the whole cover, not a 16:9 crop */ .r316-page-audioknigi .uagb-post__image img { aspect-ratio: auto; height: auto; object-fit: contain; } .r316-page-audioknigi .uagb-post__image { background: var(--r-paper); } /* 25. Show pages (page-show.php) --------------------------------------------------- */ .r316-showhead { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; margin: 0 0 var(--r-s8); } .r316-showhead__title { font-family: var(--r-display); font-weight: 600; font-size: clamp(34px, 5vw, 56px); line-height: 1.05; letter-spacing: -0.02em; margin: var(--r-s3) 0 var(--r-s4) !important; color: var(--r-ink); } .r316-showhead__desc { font-size: 18px; line-height: 1.65; color: #4A443F; margin: 0 0 var(--r-s5); max-width: 36em; } .r316-showhead__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--r-s4); } .r316-showhead__play { display: inline-flex; align-items: center; gap: var(--r-s2); } .r316-showhead__play .r316-icon--pause { display: none; } .r316-showhead__play.is-playing .r316-icon--play { display: none; } .r316-showhead__play.is-playing .r316-icon--pause { display: inline-block; } .r316-showhead__count { font-weight: 700; color: var(--r-muted); } .r316-showhead__latest { margin: var(--r-s4) 0 0; font-size: 15px; color: var(--r-muted); } .r316-showhead__img img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; border-radius: 20px; box-shadow: 0 20px 40px rgba(23, 21, 26, .12); } .r316-show__episodes .r316-h2 { margin: 0 0 var(--r-s5) !important; } .r316-muted { color: var(--r-muted); font-weight: 400; font-size: .6em; } @media (max-width: 767px) { .r316-showhead { grid-template-columns: minmax(0, 1fr); margin-bottom: var(--r-s7); } .r316-showhead__img { order: -1; max-width: 280px; } } /* Theme post grids (replacing Spectra's) + audiobook covers */ .r316-postgrid { margin: var(--r-s5) 0; } .r316-grid--covers .r316-card__media { aspect-ratio: auto; background: var(--r-paper); } .r316-grid--covers .r316-card__media img { height: auto; object-fit: contain; } /* Теми page */ .r316-topics-page__popular { margin: var(--r-s3) 0 var(--r-s7); } .r316-topics-page .r316-sr-label, .r316 .entry-content .r316-topics-page h2.r316-sr-label { margin: 0 0 var(--r-s3) !important; font-family: var(--r-body) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--r-muted) !important; } .r316-topics-page__all { gap: var(--r-s2); } .r316-topics-page__all li[hidden] { display: none !important; } /* 26. Spectra fallback (only when the plugin is off: body.r316-no-spectra) ------------ */ .r316-no-spectra .wp-block-uagb-columns { position: relative; box-sizing: border-box; } .r316-no-spectra .uagb-columns__overlay, .r316-no-spectra .uagb-column__overlay, .r316-no-spectra .uagb-section__overlay { display: none; } .r316-no-spectra .uagb-columns__inner-wrap { display: flex; gap: var(--r316-gap, 20px); margin: 0 auto; align-items: flex-start; } .r316-no-spectra .uagb-columns__valign-center > .uagb-columns__inner-wrap, .r316-no-spectra .uagb-columns__valign-middle > .uagb-columns__inner-wrap { align-items: center; } .r316-no-spectra .wp-block-uagb-column { flex: 1 1 var(--r316-col, 0); min-width: 0; } .r316-no-spectra .uagb-column__inner-wrap { height: 100%; } @media (max-width: 767px) { .r316-no-spectra .uagb-columns__stack-mobile > .uagb-columns__inner-wrap, .r316-no-spectra .uagb-columns__inner-wrap { flex-direction: column; align-items: stretch; } .r316-no-spectra .wp-block-uagb-column { flex-basis: auto; width: 100%; } } .r316-no-spectra .uagb-section__inner-wrap { margin: 0 auto; } .r316-no-spectra .wp-block-uagb-container { display: flex; flex-direction: var(--r316-dir, column); gap: var(--r-s5); flex: 1 1 var(--r316-w, auto); min-width: 0; box-sizing: border-box; } .r316-no-spectra .wp-block-uagb-container.uagb-is-root-container { margin: 0 0 var(--r-s6); } .r316-no-spectra .uagb-container-inner-blocks-wrap { display: flex; flex-direction: var(--r316-dir, column); flex-wrap: wrap; gap: var(--r-s5); width: 100%; } .r316-no-spectra .uagb-container-inner-blocks-wrap > .wp-block-uagb-container { flex: 1 1 calc(var(--r316-w, 100%) - var(--r-s5)); } .r316-no-spectra .entry-content .wp-block-uagb-container.alignfull { width: auto !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; left: auto; right: auto; } .r316-no-spectra .wp-block-uagb-container > figure, .r316-no-spectra .wp-block-uagb-container .wp-block-audio { width: 100%; margin: 0; } .r316-no-spectra .wp-block-uagb-container img { max-width: 100%; height: auto; border-radius: 12px; } .r316-no-spectra .wp-block-uagb-container > h3, .r316-no-spectra .wp-block-uagb-container > h2 { margin: 0 !important; } @media (max-width: 767px) { .r316-no-spectra .uagb-container-inner-blocks-wrap, .r316-no-spectra .wp-block-uagb-container { flex-direction: column; } } .r316-no-spectra .wp-block-uagb-advanced-heading { margin: 0 0 var(--r-s5); } .r316-no-spectra .wp-block-uagb-advanced-heading .uagb-heading-text { color: var(--r316-hc, var(--r-ink)); margin: 0; } .r316-no-spectra .uagb-separator-wrap { display: flex; justify-content: inherit; } .r316-no-spectra .wp-block-uagb-advanced-heading[style*="center"] .uagb-separator { margin-left: auto; margin-right: auto; } .r316-no-spectra .uagb-separator { width: var(--r316-sep-w, 12%); border-top: 3px solid var(--r316-sep-c, var(--r-red)); margin: var(--r-s3) 0; } .r316-no-spectra .uagb-desc-text:empty { display: none; } .r316-no-spectra .wp-block-uagb-info-box { margin: 0 0 var(--r-s5); } .r316-no-spectra .uagb-ifb-icon svg { width: 40px; height: 40px; fill: var(--r-red-text); } .r316-no-spectra .uagb-ifb-image-content img, .r316-no-spectra .wp-block-uagb-info-box img { max-width: var(--r316-ib-img, 100%); height: auto; } .r316-no-spectra .uagb-ifb-title { margin: var(--r-s3) 0 var(--r-s2); } .r316-no-spectra .uagb-ifb-separator { width: 30%; border-top: 2px solid var(--r-line); margin: var(--r-s3) auto; } .r316-no-spectra .wp-block-uagb-marketing-button { margin: var(--r-s4) 0; } .r316-no-spectra .uagb-marketing-btn__link { display: inline-flex; align-items: center; gap: var(--r-s2); padding: 14px 26px; border-radius: 999px; background: var(--r-red-strong); color: #fff !important; text-decoration: none !important; font-weight: 700; } .r316-no-spectra .uagb-marketing-btn__link:hover { background: var(--r-ink); } .r316-no-spectra .uagb-marketing-btn__link svg { width: 18px; height: 18px; fill: currentColor; } .r316-no-spectra .uagb-marketing-btn__title { margin: 0; font-size: 17px; color: inherit !important; } .r316-no-spectra .uagb-marketing-btn__prefix-text:empty { display: none; } .r316-no-spectra .wp-block-uagb-inline-notice { border-left: 4px solid var(--r316-notice, var(--r-red)); background: var(--r-cream); border-radius: 12px; padding: var(--r-s4) var(--r-s5); margin: 0 0 var(--r-s5); } .r316-no-spectra .uagb-notice-title { margin: 0 0 var(--r-s2); font-weight: 700; } .r316-no-spectra .uagb-notice-dismiss { display: none; } .r316-no-spectra .uagb-marketing-btn__align-center { text-align: center; } /* 27. Old landing pages without the builders: info boxes, buttons, Центърът -------- */ .r316-no-spectra .wp-block-uagb-info-box svg { width: 44px !important; height: 44px !important; fill: var(--r-red-text); display: inline-block; } .r316-no-spectra .uagb-ifb-icon-wrap { margin: 0 0 var(--r-s2); line-height: 0; } .r316.r316-no-spectra .entry-content .uagb-ifb-title { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: clamp(22px, 2.6vw, 30px) !important; line-height: 1.2; margin: 0 0 var(--r-s2) !important; color: var(--r-ink); } .r316.r316-no-spectra .entry-content .uagb-ifb-title strong { font-weight: inherit; } .r316-no-spectra .uagb-ifb-title::first-letter { text-transform: uppercase; } .r316-no-spectra .uagb-ifb-separator { width: 64px !important; max-width: 100%; border-top: 3px solid var(--r-red) !important; margin: var(--r-s3) auto var(--r-s5) !important; } .r316-no-spectra .wp-block-uagb-info-box[style*="left"] .uagb-ifb-separator { margin-left: 0 !important; } .r316-no-spectra .uagb-ifb-text-wrap:empty { display: none; } /* Marketing button: icon + label on one line, normal button size */ .r316-no-spectra .uagb-marketing-btn__link { padding: 14px 26px !important; } .r316-no-spectra .uagb-marketing-btn__title-wrap { display: flex; align-items: center; gap: 10px; } .r316-no-spectra .uagb-marketing-btn__icon-wrap { display: inline-flex; line-height: 0; } .r316.r316-no-spectra .entry-content .uagb-marketing-btn__title { font-family: var(--r-body) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.2 !important; color: inherit !important; margin: 0 !important; letter-spacing: 0; } .r316-no-spectra .uagb-marketing-btn__title::first-letter { text-transform: uppercase; } .r316-no-spectra .uagb-marketing-btn__prefix-wrap { display: none; } .r316-no-spectra .uagb-marketing-btn__align-center .uagb-marketing-btn__wrap { display: flex; justify-content: center; } /* Kadence "flip" icons: the second (hover) icon must not show under the first */ .kt-info-svg-icon-flip { display: none !important; } /* Центърът (post "center" + page "center-test"): reviews next to episode tiles */ .postid-6421 .entry-content > .wp-block-uagb-columns, .r316-page-center-test .entry-content > .wp-block-uagb-columns { margin: 0 0 var(--r-s7) !important; padding: 0 !important; } .postid-6421 .entry-content > .wp-block-uagb-columns .uagb-columns__inner-wrap, .r316-page-center-test .entry-content > .wp-block-uagb-columns .uagb-columns__inner-wrap { align-items: center; gap: clamp(24px, 4vw, 56px); max-width: none; } .postid-6421 .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child .uagb-column__inner-wrap, .r316-page-center-test .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child .uagb-column__inner-wrap { background: var(--r-cream); border-radius: var(--r-radius); padding: clamp(20px, 3vw, 36px); position: relative; height: auto; } .postid-6421 .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child h3, .r316-page-center-test .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child h3 { font-size: 17px !important; line-height: 1.4; margin: 0 0 var(--r-s3) !important; color: var(--r-ink); } .postid-6421 .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child p, .r316-page-center-test .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:first-child p { font-size: 16px; line-height: 1.7; color: #4A443F; margin: 0; } /* the two episode tiles on the right sit side by side */ .postid-6421 .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:last-child .uagb-column__inner-wrap, .r316-page-center-test .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:last-child .uagb-column__inner-wrap { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--r-s4); height: auto; } .postid-6421 .wp-block-kadence-infobox, .r316-page-center-test .wp-block-kadence-infobox { margin: 0; } .postid-6421 .wp-block-kadence-infobox .kt-blocks-info-box-title, .r316-page-center-test .wp-block-kadence-infobox .kt-blocks-info-box-title { font-size: 16px !important; margin: var(--r-s2) 0 0 !important; } .postid-6421 .wp-block-kadence-infobox .kt-blocks-info-box-link-wrap:hover .kt-blocks-info-box-title { color: var(--r-red-text); } @media (max-width: 767px) { .postid-6421 .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:last-child .uagb-column__inner-wrap, .r316-page-center-test .entry-content > .wp-block-uagb-columns ~ .wp-block-uagb-columns .wp-block-uagb-column:last-child .uagb-column__inner-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--r-s3); } } /* 28. "Адам и Ева to date" landing page — the project's own gold palette ----------- */ .r316-page-adam-i-eva-to-date { --aie-gold: #958251; --aie-gold-dark: #6E5F37; --aie-gold-deep: #5A4D2C; --aie-tint: #F5F1E8; --aie-line: #E4DCC8; } .r316-page-adam-i-eva-to-date .entry-content { --r-red: var(--aie-gold); --r-red-text: var(--aie-gold-dark); } .r316-page-adam-i-eva-to-date .entry-content > * { margin-left: auto; margin-right: auto; } .r316-page-adam-i-eva-to-date .entry-title.r316-page-title { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* the banner already shows the title */ .r316-page-adam-i-eva-to-date .entry-content > .wp-block-spacer { height: clamp(28px, 4vw, 48px) !important; } /* banner + gold intro, joined into one hero card */ .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover { width: 100% !important; max-width: none !important; margin: var(--r-s5) 0 0 !important; min-height: clamp(160px, 26vw, 320px) !important; border-radius: 20px 20px 0 0; overflow: hidden; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover .wp-block-cover__inner-container:empty, .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover p:empty { display: none; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section { width: 100% !important; max-width: none !important; margin: 0 !important; border-radius: 20px; overflow: hidden; background: var(--aie-gold); } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section .wp-block-getwid-section__wrapper { padding: clamp(28px, 5vw, 56px) clamp(20px, 5vw, 48px) !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section .wp-block-getwid-section__inner-wrapper { max-width: 680px !important; } .r316-page-adam-i-eva-to-date .wp-block-getwid-section .uagb-heading-text { color: #fff !important; font-family: var(--r-body) !important; font-weight: 700 !important; font-size: clamp(20px, 2.4vw, 26px) !important; line-height: 1.4 !important; text-align: center; } .r316-page-adam-i-eva-to-date .wp-block-getwid-section .uagb-separator { width: 64px; border-top: 2px solid rgba(255,255,255,.6) !important; margin: var(--r-s4) auto !important; } .r316-page-adam-i-eva-to-date .wp-block-getwid-section .uagb-desc-text { color: #FBF7EC !important; font-size: 18px !important; font-style: italic; text-align: center; margin: 0 !important; } .r316-page-adam-i-eva-to-date .wp-block-getwid-section .uagb-desc-text br { display: none; } /* three gold tiles: аудио / още разкази / купи тук */ .r316-page-adam-i-eva-to-date .entry-content > .wp-block-kadence-rowlayout { width: 100%; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .r316-krow--3.r316-krow--equal { gap: var(--r-s4); margin: 0; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .wp-block-kadence-infobox { margin: 0; height: 100%; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-link-wrap { display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: var(--r-s3); min-height: 180px; border-radius: 20px !important; padding: var(--r-s6) var(--r-s4) !important; background: var(--aie-gold) !important; transition: background .2s var(--r-ease), transform .2s var(--r-ease), box-shadow .2s var(--r-ease); } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-link-wrap:hover, .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-link-wrap:focus-visible { background: var(--aie-gold-deep) !important; transform: translateY(-3px); box-shadow: 0 14px 28px rgba(90, 77, 44, .25); } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-info-svg-icon svg { width: 56px !important; height: 56px !important; stroke-width: 1.5; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-title { color: #fff !important; font-family: var(--r-display) !important; font-weight: 600 !important; font-size: 22px !important; margin: 0 !important; } .r316-page-adam-i-eva-to-date .kt-blocks-info-box-title::first-letter { text-transform: uppercase; } /* card slider: one centred column, no empty side columns */ .r316-page-adam-i-eva-to-date .entry-content > .r316-krow--center-wide { display: block; max-width: 620px; margin: 0 auto !important; } .r316-page-adam-i-eva-to-date .r316-krow--center-wide > .wp-block-kadence-column:not(.inner-column-2) { display: none; } .r316-page-adam-i-eva-to-date .r316-gslider { margin: 0; } .r316-page-adam-i-eva-to-date .r316-gslider__track { border-radius: 20px; } .r316-page-adam-i-eva-to-date .r316-gslider__slide { background: var(--aie-tint); padding: var(--r-s4); } .r316-page-adam-i-eva-to-date .r316-gslider__slide img { max-height: 520px; border-radius: 12px; } .r316-page-adam-i-eva-to-date .r316-gslider__btn { color: var(--aie-gold-deep); } .r316-page-adam-i-eva-to-date .r316-gslider__btn:hover { background: var(--aie-gold-deep); color: #fff; } /* text sections */ .r316-page-adam-i-eva-to-date .entry-content h2 { color: var(--aie-gold-deep) !important; font-family: var(--r-display) !important; font-weight: 600 !important; font-size: clamp(24px, 3vw, 32px) !important; line-height: 1.2; } .r316-page-adam-i-eva-to-date .entry-content h2 strong { font-weight: inherit; } .r316-page-adam-i-eva-to-date .entry-content > h2 { margin-top: var(--r-s7) !important; margin-bottom: var(--r-s4) !important; } .r316-page-adam-i-eva-to-date .entry-content > p { max-width: 720px; font-size: 18px; line-height: 1.75; text-align: center; color: #4A443F; } .r316-page-adam-i-eva-to-date .entry-content > p + p { font-style: italic; color: var(--aie-gold-dark); } /* two info cards */ .r316-page-adam-i-eva-to-date .entry-content > .wp-block-group { width: 100%; max-width: none; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-group .wp-block-columns { gap: var(--r-s5); margin: 0; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-group .wp-block-column:not(:has(.r316-tile)) { background: var(--aie-tint); border-top: 4px solid var(--aie-gold); border-radius: 16px; padding: clamp(22px, 3vw, 36px); } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-group .wp-block-column h2 { font-size: clamp(20px, 2.2vw, 24px) !important; margin: 0 0 var(--r-s3) !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-group .wp-block-column p { font-size: 16px; line-height: 1.75; margin: 0; color: #4A443F; } /* partners */ .r316-page-adam-i-eva-to-date .wp-block-uagb-info-box { margin: var(--r-s7) auto var(--r-s3) !important; } .r316-page-adam-i-eva-to-date .wp-block-uagb-info-box svg { fill: var(--aie-gold) !important; width: 36px !important; height: 36px !important; } .r316-page-adam-i-eva-to-date .wp-block-uagb-info-box .uagb-ifb-title { color: var(--aie-gold-deep) !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) { width: 100% !important; max-width: 760px !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .wp-block-getwid-section__inner-wrapper { max-width: none !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .wp-block-columns { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--r-s5); margin: 0; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .wp-block-column { margin: 0 !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .kt-blocks-info-box-link-wrap { display: flex !important; align-items: center; justify-content: center; aspect-ratio: 1 / 1; padding: var(--r-s4) !important; border-radius: 16px !important; background: #fff !important; box-shadow: 0 0 0 1px var(--aie-line); transition: box-shadow .2s, transform .2s; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .kt-blocks-info-box-link-wrap:hover { box-shadow: 0 0 0 2px var(--aie-gold); transform: translateY(-2px); } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) img { max-width: 130px !important; width: 100%; filter: grayscale(1); opacity: .85; transition: filter .2s, opacity .2s; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) a:hover img { filter: none; opacity: 1; } .r316-page-adam-i-eva-to-date .kt-infobox-textcontent:empty { display: none; } @media (max-width: 767px) { .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover { border-radius: 16px 16px 0 0; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section.alignfull { border-radius: 16px; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .r316-krow--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--r-s2); } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-link-wrap { min-height: 120px; padding: var(--r-s4) var(--r-s2) !important; border-radius: 14px !important; gap: var(--r-s2); } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-info-svg-icon svg { width: 36px !important; height: 36px !important; } .r316-page-adam-i-eva-to-date .wp-block-kadence-rowlayout .kt-blocks-info-box-title { font-size: 15px !important; text-align: center; } .r316-page-adam-i-eva-to-date .entry-content > p { font-size: 17px; text-align: left; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .wp-block-columns { gap: var(--r-s3); } .r316-page-adam-i-eva-to-date .r316-gslider__slide img { max-height: 60vh; } } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .kt-blocks-info-box-media-container, .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) .kt-blocks-info-box-media, .r316-page-adam-i-eva-to-date .entry-content > .wp-block-getwid-section:not(.alignfull) [class*="kadence-info-box-image"] { width: 100%; display: flex; justify-content: center; margin: 0 !important; padding: 0 !important; } /* 29. Team feedback, Nov 2026 --------------------------------------------------------- */ /* Station logo artwork: no rounded corners (they clipped the logo) */ .r316-player__art { border-radius: 2px; object-fit: contain; background: #fff; } .r316-livecard__art, .r316-livecard__art img { border-radius: 4px; } .r316-livecard__art img { object-fit: contain; background: #fff; } /* Hero: text + carousel */ .r316-hero__lead { font-size: clamp(18px, 1.7vw, 22px); } .r316-hero__card { min-width: 0; } .r316-hcar { position: relative; max-width: 560px; margin-left: auto; } .r316-hcar__viewport { border-radius: 24px; overflow: hidden; background: var(--r-paper); box-shadow: 0 24px 60px -20px rgba(23, 21, 26, .28), 0 0 0 1px var(--r-line); } .r316-hcar__track { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; } .r316-hcar__track::-webkit-scrollbar { display: none; } .r316-hcar__slide { margin: 0; scroll-snap-align: start; min-width: 0; } .r316-hcar__card { display: flex; flex-direction: column; height: 100%; color: var(--r-ink) !important; text-decoration: none !important; } .r316-hcar__media { position: relative; display: block; aspect-ratio: 5 / 2; overflow: hidden; background: var(--r-cream-2); } .r316-hcar__blur { position: absolute; inset: -24px; background-size: cover; background-position: center; filter: blur(22px) saturate(1.1); opacity: .55; transform: scale(1.1); } .r316-hcar__img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .5s var(--r-ease); } a.r316-hcar__card:hover .r316-hcar__img { transform: scale(1.03); } .r316-hcar__cap { display: flex; align-items: center; justify-content: space-between; gap: var(--r-s3); padding: 18px 22px; font-weight: 700; font-size: 17px; line-height: 1.35; border-top: 1px solid var(--r-line); background: var(--r-paper); } .r316-hcar__cap .r316-icon { flex: 0 0 auto; color: var(--r-red-text); transition: transform .2s var(--r-ease); } a.r316-hcar__card:hover .r316-hcar__cap { color: var(--r-red-text); } a.r316-hcar__card:hover .r316-hcar__cap .r316-icon { transform: translateX(4px); } .r316-hcar__controls { display: flex; align-items: center; justify-content: center; gap: var(--r-s3); margin-top: var(--r-s4); } .r316-hcar__btn, .r316-hcar__pause { width: 44px; height: 44px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; background: var(--r-paper); color: var(--r-ink); box-shadow: 0 0 0 1px var(--r-line); } .r316-hcar__btn:hover, .r316-hcar__pause:hover { background: var(--r-ink); color: var(--r-cream); } .r316-hcar__btn[data-dir="-1"] .r316-icon { transform: rotate(180deg); } .r316-hcar__dots { display: flex; gap: 2px; } .r316-hcar__dot { width: 28px; height: 44px; border: 0; padding: 0; background: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; } .r316-hcar__dot::before { content: ""; width: 9px; height: 9px; border-radius: 999px; background: rgba(23, 21, 26, .22); transition: width .25s var(--r-ease), background .25s; } .r316-hcar__dot[aria-current="true"]::before { width: 22px; background: var(--r-red-strong); } .r316-hcar__pause .r316-hcar__i-play { display: none; } .r316-hcar__pause[aria-pressed="true"] .r316-hcar__i-play { display: block; } .r316-hcar__pause[aria-pressed="true"] .r316-hcar__i-pause { display: none; } @media (max-width: 921px) { .r316-hcar { max-width: none; margin: 0; } .r316-hcar__viewport { border-radius: 18px; } .r316-hcar__cap { padding: 14px 16px; font-size: 16px; } } @media (prefers-reduced-motion: reduce) { .r316-hcar__track { scroll-behavior: auto; } .r316-hcar__img { transition: none; } } /* Homepage rhythm in the new order: Последни (white) → Подкасти (cream) → Теми (white) */ .r316-home [aria-labelledby="r316-eps-title"] { background: var(--r-paper); } .r316-home [aria-labelledby="r316-eps-title"] .r316-card { background: var(--r-cream); box-shadow: none; } .r316-home [aria-labelledby="r316-shows-title"] { background: var(--r-cream); } .r316-home [aria-labelledby="r316-topics-title"] { background: var(--r-paper); } .r316-home .r316-section-head { align-items: center; } .r316-home .r316-section-head .r316-h2 { margin: 0 !important; } .r316-support .r316-h2 { margin: 0 !important; } /* Menu: "Гледай" opens YouTube in a new tab */ .r316-menu-watch > a::after, #masthead .main-header-menu > li > a[target="_blank"]::after, .r316-drawer__menu > li > a[target="_blank"]::after { content: ""; display: inline-block; width: .8em; height: .8em; margin-left: .35em; vertical-align: -.05em; background: currentColor; opacity: .6; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat; } /* Recordings inside pages/posts (audiobooks, courses, series) → track rows */ .r316-track { display: flex; align-items: center; gap: var(--r-s4); margin: var(--r-s3) 0 var(--r-s4); padding: 12px 16px 12px 12px; background: var(--r-cream); border-radius: 16px; box-shadow: 0 0 0 1px var(--r-line); transition: box-shadow .2s, background .2s; } .r316-track:hover { box-shadow: 0 0 0 1px var(--r-red-light, #E8907F); } .r316-track.is-current { background: #fff; box-shadow: 0 0 0 2px var(--r-red); } .r316-track__play { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 999px; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; background: var(--r-red-strong); color: #fff; transition: transform .15s var(--r-ease), background .2s; } .r316-track__play:hover { transform: scale(1.06); background: var(--r-ink); } .r316-track__play .r316-icon--pause { display: none; } .r316-track__play.is-playing .r316-icon--play, .r316-track__play.is-loading .r316-icon--play { display: none; } .r316-track__play.is-playing .r316-icon--pause { display: inline-block; } .r316-track__body { flex: 1 1 auto; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px var(--r-s3); } .r316-track__title { font-weight: 700; font-size: 16px; line-height: 1.35; color: var(--r-ink); } .r316-track__time { font-size: 13px; color: var(--r-muted); font-variant-numeric: tabular-nums; white-space: nowrap; } .r316-track__bar { grid-column: 1 / -1; height: 4px; border-radius: 4px; background: var(--r-line); overflow: hidden; display: none; } .r316-track.is-current .r316-track__bar { display: block; } .r316-track__bar > span { display: block; height: 100%; width: 0; background: var(--r-red); transition: width .25s linear; } .r316-track + .r316-track { margin-top: calc(-1 * var(--r-s2)); } @media (max-width: 640px) { .r316-track { gap: var(--r-s3); padding: 10px 12px 10px 10px; } .r316-track__play { width: 44px; height: 44px; } .r316-track__title { font-size: 15px; } } .r316-track__n:not(:empty) { display: inline-block; min-width: 1.6em; color: var(--r-muted); font-weight: 700; font-variant-numeric: tabular-nums; } .r316-track.is-started .r316-track__time { color: var(--r-red-text); } .r316-tracklist { display: flex; flex-direction: column; gap: var(--r-s2); margin: var(--r-s3) 0 var(--r-s5); } .r316-tracklist .r316-track { margin: 0; } .r316-series { display: flex; align-items: center; justify-content: space-between; gap: var(--r-s4); flex-wrap: wrap; margin: var(--r-s5) 0 var(--r-s3); padding: var(--r-s4) var(--r-s5); border-radius: 18px; background: var(--r-ink); color: var(--r-cream); } .r316-series__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .r316-series__kicker { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-red-light, #E8907F); } .r316-series__count { font-weight: 700; font-size: 16px; } .r316-series__go { display: inline-flex; align-items: center; gap: var(--r-s2); } /* 30. Editor block styles (Слайдер / Карта / Важно) -------------------------------- */ .wp-block-gallery.r316-gslider__track { display: grid !important; grid-auto-flow: column; grid-auto-columns: 100%; gap: 0 !important; flex-wrap: nowrap !important; margin: 0 !important; } .wp-block-gallery.r316-gslider__track > figure.wp-block-image { width: 100% !important; margin: 0 !important; scroll-snap-align: center; display: flex !important; align-items: center; justify-content: center; background: var(--r-paper); } .wp-block-gallery.r316-gslider__track > figure img { max-height: 70vh; width: auto !important; height: auto !important; object-fit: contain !important; margin: 0 auto; } .wp-block-gallery.r316-gslider__track > figure figcaption { position: static !important; background: none !important; color: var(--r-muted) !important; } .is-style-r316-card { background: var(--r-cream); border-radius: var(--r-radius); padding: clamp(20px, 3vw, 32px); } .is-style-r316-card > :first-child { margin-top: 0; } .is-style-r316-card > :last-child { margin-bottom: 0; } .is-style-r316-notice { border-left: 4px solid var(--r-red); background: var(--r-cream); border-radius: 12px; padding: var(--r-s4) var(--r-s5); margin: 0 0 var(--r-s5); } .is-style-r316-notice > :first-child { margin-top: 0; } .is-style-r316-notice > :last-child { margin-bottom: 0; } /* 31. Converted content (standard blocks that replaced Kadence / Getwid / Spectra) ------ */ /* Tiles (were Kadence info boxes): image or icon + linked title; whole tile clickable */ .r316-tile { position: relative; text-align: center; margin: 0 0 var(--r-s4); border-radius: var(--r-radius); transition: transform .2s var(--r-ease), box-shadow .2s var(--r-ease); } .r316-tile > * { margin-left: auto !important; margin-right: auto !important; } .r316-tile .wp-block-image { margin: 0 0 var(--r-s3); } .r316-tile .wp-block-image img { border-radius: calc(var(--r-radius) - 4px); width: 100%; height: auto; } .r316-tile .wp-block-heading { font-size: 17px !important; line-height: 1.35; margin: 0 !important; } .r316-tile .wp-block-heading a { color: inherit !important; text-decoration: none !important; } .r316-tile .wp-block-heading a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; } .r316-tile:hover .wp-block-heading a, .r316-tile:focus-within .wp-block-heading a { color: var(--r-red-text) !important; } .r316-tile.is-filled { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--r-s3); min-height: 170px; padding: var(--r-s6) var(--r-s4) !important; color: #fff; } .r316-tile.is-filled .wp-block-heading, .r316-tile.is-filled .wp-block-heading a, .r316-tile.is-filled p { color: #fff !important; } .r316-tile.is-filled .wp-block-heading { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: 21px !important; } .r316-tile.is-filled:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(23, 21, 26, .18); filter: brightness(.92); } .r316-tile__icon { display: inline-flex; color: #fff; } .r316-tile__icon svg { width: 52px; height: 52px; stroke: currentColor; } .r316-tile .wp-block-heading::first-letter { text-transform: uppercase; } /* Info blocks (were Spectra info boxes) */ .r316-infobox { text-align: center; margin: 0 0 var(--r-s5); } .r316-infobox.is-left { text-align: left; } .r316-infobox > * { margin-left: auto !important; margin-right: auto !important; } .r316-infobox.is-left > * { margin-left: 0 !important; } .r316-infobox .wp-block-heading { font-family: var(--r-display) !important; font-weight: 600 !important; margin: 0 0 var(--r-s2) !important; } .r316-infobox .wp-block-heading::first-letter { text-transform: uppercase; } .r316-infobox .wp-block-buttons { justify-content: center; } /* Team cards (were Getwid "person") */ .r316-person { margin: 0; } .r316-person .wp-block-image { margin: 0 0 var(--r-s4); } .r316-person .wp-block-image img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; } .r316-person .wp-block-heading { font-family: var(--r-body) !important; font-size: 19px !important; font-weight: 700 !important; margin: 0 var(--r-s5) !important; } .r316-person > p { font-size: 14px !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--r-red-text) !important; margin: 4px var(--r-s5) 0 !important; padding: 0 !important; } .r316-person .wp-block-social-links { margin: var(--r-s3) var(--r-s5) 0 !important; gap: var(--r-s2); } .r316-page-about .r316-person > * { max-width: none !important; } /* Buttons from old "marketing buttons" */ .r316 .entry-content .wp-block-button__link { background: var(--r-red-strong); color: #fff; border-radius: 999px; padding: 14px 26px; font-weight: 700; text-decoration: none; } .r316 .entry-content .wp-block-button__link:hover { background: var(--r-ink); color: #fff; } /* Sections (were Getwid sections) */ .r316-section.has-background { border-radius: 20px; padding: clamp(24px, 4vw, 48px) clamp(20px, 4vw, 40px); } /* — Адам и Ева to date (converted) — */ .r316-page-adam-i-eva-to-date .entry-content > .r316-section.has-background { width: 100%; max-width: none !important; margin: 0 0 var(--r-s5) !important; color: #fff; } .r316-page-adam-i-eva-to-date .r316-section.has-background .wp-block-heading { color: #fff !important; font-family: var(--r-body) !important; font-weight: 700 !important; font-size: clamp(20px, 2.4vw, 26px) !important; line-height: 1.4; } .r316-page-adam-i-eva-to-date .r316-section.has-background p { color: #FBF7EC !important; font-size: 18px; font-style: italic; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover { border-radius: 20px 20px 0 0; margin-bottom: 0 !important; } .r316-page-adam-i-eva-to-date .entry-content > .wp-block-cover + .r316-section.has-background { border-radius: 0 0 20px 20px; } .r316-page-adam-i-eva-to-date .wp-block-columns:has(> .wp-block-column > .r316-tile.is-filled) { gap: var(--r-s4); } .r316-page-adam-i-eva-to-date .r316-tile.is-filled { margin: 0; border-radius: 20px; } .r316-page-adam-i-eva-to-date .r316-tile:not(.is-filled) { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; padding: var(--r-s4); background: #fff; box-shadow: 0 0 0 1px var(--aie-line, #E4DCC8); } .r316-page-adam-i-eva-to-date .r316-tile:not(.is-filled) img { max-width: 130px !important; filter: grayscale(1); opacity: .85; border-radius: 0; } .r316-page-adam-i-eva-to-date .r316-tile:not(.is-filled):hover img { filter: none; opacity: 1; } .r316-page-adam-i-eva-to-date .r316-tile:not(.is-filled) .wp-block-image { margin: 0; } .r316-page-adam-i-eva-to-date .r316-tile:not(.is-filled) .wp-block-image a::after { content: ""; position: absolute; inset: 0; } .r316-page-adam-i-eva-to-date .r316-infobox .wp-block-heading { color: var(--aie-gold-deep, #5A4D2C) !important; } .r316-page-adam-i-eva-to-date .r316-infobox { margin-top: var(--r-s7); } .r316-page-adam-i-eva-to-date .wp-block-gallery.r316-gslider__track > figure { background: var(--aie-tint, #F5F1E8); padding: var(--r-s4); } @media (max-width: 781px) { .r316-page-adam-i-eva-to-date .wp-block-columns:has(> .wp-block-column > .r316-tile.is-filled) { flex-wrap: nowrap !important; gap: var(--r-s2); } .r316-page-adam-i-eva-to-date .wp-block-columns:has(> .wp-block-column > .r316-tile.is-filled) > .wp-block-column { flex-basis: 0 !important; } .r316-page-adam-i-eva-to-date .r316-tile.is-filled { min-height: 120px; padding: var(--r-s4) var(--r-s2) !important; border-radius: 14px; } .r316-page-adam-i-eva-to-date .r316-tile.is-filled .wp-block-heading { font-size: 15px !important; } .r316-page-adam-i-eva-to-date .r316-tile__icon svg { width: 34px; height: 34px; } .r316-page-adam-i-eva-to-date .wp-block-columns:has(> .wp-block-column > .r316-tile:not(.is-filled)) { flex-wrap: nowrap !important; gap: var(--r-s3); } } /* — Центърът (converted): reviews next to episode tiles — */ .postid-6421 .entry-content > .wp-block-columns, .r316-page-center-test .entry-content > .wp-block-columns { align-items: center !important; gap: clamp(24px, 4vw, 56px); margin: 0 0 var(--r-s7) !important; } .postid-6421 .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child:not(:has(.wp-block-buttons)), .r316-page-center-test .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child:not(:has(.wp-block-buttons)) { background: var(--r-cream); border-radius: var(--r-radius); padding: clamp(20px, 3vw, 36px); } .postid-6421 .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child h3, .r316-page-center-test .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child h3 { font-size: 17px !important; line-height: 1.4; margin: 0 0 var(--r-s3) !important; } .postid-6421 .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child p, .r316-page-center-test .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:first-child p { font-size: 16px; line-height: 1.7; color: #4A443F; } .postid-6421 .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:last-child:has(.r316-tile), .r316-page-center-test .entry-content > .wp-block-columns ~ .wp-block-columns > .wp-block-column:last-child:has(.r316-tile) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--r-s4); } .postid-6421 .r316-tile, .r316-page-center-test .r316-tile { margin: 0; } .postid-6421 .entry-content .wp-block-buttons, .r316-page-center-test .entry-content .wp-block-buttons { justify-content: center; } .r316-page-adam-i-eva-to-date .entry-content > .r316-infobox + .wp-block-spacer { display: none; } .r316-page-adam-i-eva-to-date .entry-content > .r316-section:not(.has-background) { padding: 0 !important; } .r316-page-adam-i-eva-to-date .entry-content > .r316-section:not(.has-background) .wp-block-columns { gap: var(--r-s4); } /* Converted Spectra columns with a background (headers): light, like before */ .r316 .entry-content > .wp-block-columns.has-background { background: var(--r-cream) !important; border-radius: var(--r-radius); box-shadow: 0 0 0 1px var(--r-line); padding: clamp(24px, 4vw, 48px) !important; margin-bottom: var(--r-s6); align-items: center !important; gap: clamp(24px, 4vw, 48px); } .r316 .entry-content > .wp-block-columns.has-background .has-white-color { color: var(--r-ink) !important; } .r316 .entry-content > .wp-block-columns.has-background p { color: #4A443F !important; font-size: 17px; } .r316 .entry-content > .wp-block-columns.has-background img { border-radius: 16px; } .r316 .entry-content .wp-block-heading::first-letter, .r316 .entry-content .wp-block-button__link::first-letter { text-transform: uppercase; } /* Page intros (converted info box at the top of Събития, Проекти, …): big title + muted text, no box */ .r316 .entry-content > h1.screen-reader-text + .r316-infobox, .r316 .entry-content > .r316-infobox:first-child { background: none !important; box-shadow: none !important; border-radius: 0 !important; height: auto !important; text-align: left !important; margin: 0 0 var(--r-s7) !important; padding: 0 !important; } .r316 .entry-content > h1.screen-reader-text + .r316-infobox > *, .r316 .entry-content > h1.screen-reader-text + .r316-infobox .wp-block-group__inner-container { margin-left: 0 !important; padding: 0 !important; } .r316 .entry-content > h1.screen-reader-text + .r316-infobox .wp-block-heading { font-size: clamp(30px, 3.6vw, 48px) !important; line-height: 1.1 !important; margin: 0 0 var(--r-s3) !important; text-align: left !important; } .r316 .entry-content > h1.screen-reader-text + .r316-infobox p { font-size: 18px !important; color: var(--r-muted) !important; margin: 0 !important; max-width: 40em; text-align: left !important; } /* Събития (converted): two event cards per row */ .r316-page-events .entry-content > .wp-block-columns { gap: var(--r-s6) !important; margin: 0 0 var(--r-s6) !important; } .r316-page-events .entry-content > .wp-block-columns > .wp-block-column { flex: 1 1 0 !important; } /* Проекти (converted): projects as clickable cards */ .r316-page-3-16-pro .entry-content > .wp-block-columns { gap: var(--r-s6) !important; } .r316-page-3-16-pro .r316-tile { height: 100%; margin: 0; padding: 0 0 28px; background: var(--r-cream); border-radius: var(--r-radius); overflow: hidden; box-shadow: 0 0 0 1px var(--r-line); text-align: left; } .r316-page-3-16-pro .r316-tile:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(23, 21, 26, .12), 0 0 0 1px var(--r-line); } .r316-page-3-16-pro .r316-tile > .wp-block-group__inner-container { margin: 0 !important; padding: 0 !important; } .r316-page-3-16-pro .r316-tile .wp-block-group__inner-container > * { margin-left: 28px !important; margin-right: 28px !important; } .r316-page-3-16-pro .r316-tile .wp-block-group__inner-container > .wp-block-image { margin: 0 0 var(--r-s5) !important; } .r316-page-3-16-pro .r316-tile .wp-block-image img { border-radius: 0; width: 100%; } .r316-page-3-16-pro .r316-tile .wp-block-heading { font-family: var(--r-display) !important; font-weight: 600 !important; font-size: 24px !important; text-align: left !important; margin: 0 28px var(--r-s3) !important; } .r316-page-3-16-pro .r316-tile p { font-size: 16px; line-height: 1.7; text-align: left !important; margin: 0 28px !important; } .r316-page-3-16-pro .r316-tile::after { content: "Към проекта →"; display: block; margin: var(--r-s4) 28px 0; font-weight: 700; color: var(--r-red-text); } /* Astra wraps group content in an inner container */ .r316-tile > .wp-block-group__inner-container, .r316-infobox > .wp-block-group__inner-container, .r316-person > .wp-block-group__inner-container { margin: 0 !important; padding: 0 !important; max-width: none !important; } .r316-tile.is-filled > .wp-block-group__inner-container { display: flex; flex-direction: column; align-items: center; gap: var(--r-s3); } .r316-person .wp-block-group__inner-container > p { font-size: 14px !important; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--r-red-text) !important; margin: 4px var(--r-s5) 0 !important; padding: 0 !important; text-align: left; } .r316-person .wp-block-social-links { margin: var(--r-s3) var(--r-s5) 0 !important; } .r316-person .wp-block-social-links .wp-social-link { background: var(--r-paper) !important; color: var(--r-ink) !important; box-shadow: 0 0 0 1px var(--r-line); } .r316-person .wp-block-social-links .wp-social-link:hover { background: var(--r-ink) !important; color: var(--r-cream) !important; } .r316-person .wp-block-social-links .wp-social-link a { padding: 8px; } /* Converted section headings (e.g. "Екип"): display font like before */ .r316 .entry-content > .r316-section .wp-block-heading, .r316-page-about .entry-content .wp-block-heading:not(.r316-person .wp-block-heading) { font-family: var(--r-display) !important; font-weight: 600 !important; } /* 32. Audiobooks (inc/audiobooks.php) ------------------------------------------------------ */ .r316-book { display: grid; grid-template-columns: minmax(240px, 340px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; margin-top: var(--r-s5); } .r316-book__side { position: sticky; top: calc(var(--r-top) + var(--r-player-h) + 96px); display: flex; flex-direction: column; gap: var(--r-s5); } .r316-book__card { display: flex; flex-direction: column; gap: var(--r-s4); } .r316-book__cover { display: block; width: 100%; max-width: 230px; height: auto; aspect-ratio: 319 / 453; object-fit: cover; border-radius: 14px; box-shadow: 0 18px 40px -12px rgba(23, 21, 26, .35), 0 0 0 1px rgba(23, 21, 26, .06); } .r316-book__info { display: flex; flex-direction: column; gap: 2px; } .r316-book__kicker { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--r-red-text); } .r316 .r316-book__author { margin: 0; font-size: 18px; font-weight: 700; color: var(--r-ink); line-height: 1.35; } .r316 .r316-book__stats { margin: 0; font-size: 15px; color: var(--r-muted); font-variant-numeric: tabular-nums; } .r316-book__go { width: 100%; justify-content: center; display: inline-flex; align-items: center; gap: var(--r-s3); min-height: 56px; padding: 10px 20px; text-align: left; } .r316-book__go .r316-icon--pause { display: none; } .r316-book__go.is-playing .r316-icon--play, .r316-book__go.is-loading .r316-icon--play { display: none; } .r316-book__go.is-playing .r316-icon--pause { display: inline-block; } .r316-book__go .r316-spinner { display: none; } .r316-book__go.is-loading .r316-spinner { display: inline-block; } .r316-book__go-text { display: flex; flex-direction: column; line-height: 1.2; } .r316-book__go-text [data-r316-book-go-label] { font-size: 17px; font-weight: 700; } .r316-book__go-text small { font-size: 13px; font-weight: 600; opacity: .85; } .r316-book__go-text small[hidden] { display: none; } .r316-book__progress { display: flex; flex-direction: column; gap: 6px; } .r316-book__progress[hidden] { display: none; } .r316-book__progress-bar { height: 6px; border-radius: 6px; background: var(--r-line); overflow: hidden; } .r316-book__progress-bar > span { display: block; height: 100%; width: 0; background: var(--r-red); border-radius: inherit; transition: width .4s var(--r-ease); } .r316-book__progress-text { font-size: 13px; color: var(--r-muted); font-weight: 600; } .r316-book__about { font-size: 16px; line-height: 1.7; color: var(--r-text); border-top: 1px solid var(--r-line); padding-top: var(--r-s5); } .r316-book__about > :first-child { margin-top: 0; } .r316-book__about > :last-child { margin-bottom: 0; } .r316-book__about p { margin: 0 0 var(--r-s4); } .r316 .r316-book__toc-title { font-family: var(--r-display); font-weight: 600; font-size: 22px !important; line-height: 1.3; margin: 0 0 var(--r-s4); color: var(--r-ink); } .r316 .r316-book__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--r-s2); } .r316 .r316-book__list > li { margin: 0; } .r316-chapter { scroll-margin-top: calc(var(--r-top) + var(--r-player-h) + 120px); } .r316-chapter .r316-track__title { display: flex; gap: var(--r-s2); align-items: baseline; } .r316-chapter .r316-track__n { flex: 0 0 auto; min-width: 1.8em; } .r316-chapter__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .r316-chapter__label { font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--r-muted); line-height: 1.3; } .r316-chapter__sub { font-weight: 700; } .r316-chapter .r316-track__play { width: 44px; height: 44px; background: var(--r-paper); color: var(--r-ink); box-shadow: 0 0 0 1.5px var(--r-soft); } .r316-chapter .r316-track__play:hover, .r316-chapter.is-current .r316-track__play, .r316-chapter.is-next .r316-track__play { background: var(--r-red-strong); color: #fff; box-shadow: none; } .r316-chapter .r316-track__play .r316-spinner { display: none; } .r316-chapter .r316-track__play.is-loading .r316-spinner { display: inline-block; } .r316-chapter.is-current .r316-chapter__label { color: var(--r-red-text); } .r316-chapter.is-done:not(.is-current) .r316-track__title { color: var(--r-muted); } .r316-chapter.is-done:not(.is-current) .r316-track__n { position: relative; color: transparent; } .r316-chapter.is-done:not(.is-current) .r316-track__n::after { content: ""; position: absolute; left: 0; top: 50%; width: 16px; height: 16px; margin-top: -9px; background: var(--r-red-text); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat; } .r316-chapter.is-next { box-shadow: 0 0 0 1.5px var(--r-red-light, #E8907F); } .r316-chapter .r316-track__time { align-self: start; padding-top: 2px; } /* Player bar: previous / next chapter */ .r316-player__step[hidden] { display: none; } .r316-player__step:disabled { opacity: .35; cursor: default; background: transparent !important; color: var(--r-ink) !important; } @media (max-width: 921px) { .r316-book { grid-template-columns: 1fr; gap: var(--r-s5); margin-top: var(--r-s4); } /* Phones/tablets: card → chapters → about the book */ .r316-book__side { display: contents; } .r316-book__card { order: 1; } .r316-book__chapters { order: 2; } .r316-book__about { order: 3; } .r316-book__card { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--r-s3) var(--r-s4); align-items: center; } .r316-book__cover { grid-row: 1; border-radius: 10px; max-width: none; } .r316-book__actions, .r316-book__progress { grid-column: 1 / -1; } .r316-book__about { padding-top: var(--r-s4); } } @media (max-width: 640px) { .r316-chapter .r316-track__body { grid-template-columns: minmax(0, 1fr); } .r316-chapter .r316-track__time { padding: 0 0 0 calc(1.8em + var(--r-s2)); } .r316-chapter .r316-track__title { font-size: 15px; } /* Small screens: chapter buttons replace ±15 s in the bar (lock screen keeps both) */ .r316-has-queue .r316-player__skip:not(.r316-player__step) { display: none; } }