/* * Revise UI — shared styles for custom (non-Elementor) pages on revise.africa. * * Tokens read the Elementor kit globals (Site Settings > Global Colors / Fonts), * so a change there flows through. Pages must load * /wp-content/uploads/elementor/css/post-5.css and put `elementor-kit-5` on ; * the fallbacks below mirror the kit values for when they are not loaded. */ :root, .elementor-kit-5 { --rv-green: var(--e-global-color-vamtam_accent_1, #0F3D3A); --rv-lime: var(--e-global-color-vamtam_accent_2, #C8F8A9); --rv-mist: var(--e-global-color-vamtam_accent_3, #F2F5F1); --rv-sand: var(--e-global-color-vamtam_accent_4, #F8F7F3); --rv-white: var(--e-global-color-vamtam_accent_5, #FFFFFF); --rv-black: var(--e-global-color-vamtam_accent_6, #000000); --rv-line: var(--e-global-color-vamtam_accent_7, #0000001A); --rv-muted: var(--e-global-color-vamtam_accent_8, #00000099); --rv-green-hover: var(--e-global-color-cd36427, #1F6E69); --rv-text: var(--e-global-color-597ed21, #000000BF); --rv-font: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif; --rv-radius-btn: 6px; --rv-radius-field: 4px; } /* Base */ .rv-page { margin: 0; background: var(--rv-sand); color: var(--rv-text); font-family: var(--rv-font); font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; } .rv-page *, .rv-page *::before, .rv-page *::after { box-sizing: border-box; } .rv-page a { color: var(--rv-black); } /* Top bar */ .rv-top { max-width: 1200px; margin: 0 auto; padding: 20px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; } .rv-top img { display: block; height: 28px; width: auto; } /* Narrow centred column (forms) */ .rv-wrap { max-width: 440px; margin: 0 auto; padding: 32px 16px 64px; } .rv-page .rv-title { font-weight: 400; font-size: clamp(34px, 6vw, 46px); line-height: 1.15; color: var(--rv-black); text-align: center; margin: 0 0 10px; } .rv-sub { text-align: center; color: var(--rv-muted); font-size: 17px; margin: 0 0 36px; } /* Fields */ .rv-label { display: block; font-size: 15px; font-weight: 500; color: var(--rv-black); margin: 0 0 8px; } .rv-input { display: block; width: 100%; height: 50px; padding: 11px 16px; font: inherit; font-size: 16px; color: var(--rv-black); background: var(--rv-white); border: 0.5px solid rgba(0, 0, 0, .25); border-radius: var(--rv-radius-field); margin: 0 0 20px; transition: border-color .3s, box-shadow .3s; } .rv-input:focus { outline: none; border-color: var(--rv-green); box-shadow: 0 0 0 3px rgba(15, 61, 58, .12); } /* Password strength */ .rv-meter { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: -8px 0 8px; } .rv-meter span { height: 4px; border-radius: 2px; background: var(--rv-line); transition: background .2s; } .rv-meter-label { font-size: 13px; color: var(--rv-muted); min-height: 18px; margin: 0 0 14px; } /* Buttons — mirror the theme's Elementor buttons (14px / 500, 16px padding, 6px radius) */ .rv-btn { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 50px; padding: 16px; border-radius: var(--rv-radius-btn); font: inherit; font-size: 14px; font-weight: 500; line-height: 1; cursor: pointer; text-decoration: none; border: 1px solid transparent; transition: background-color .2s, border-color .2s, color .2s; } .rv-page a.rv-btn { text-decoration: none; } /* Primary = the theme's default button (lime on deep green), as used by "Join Community" / "Apply". */ .rv-page .rv-btn-primary { background: var(--rv-lime); color: var(--rv-green); } .rv-page .rv-btn-primary:hover { background: var(--rv-green); color: var(--rv-lime); } .rv-page .rv-btn-dark { background: var(--rv-green); color: var(--rv-white); } .rv-page .rv-btn-dark:hover { background: var(--rv-green-hover); } .rv-page .rv-btn-secondary { background: var(--rv-white); color: var(--rv-black); border-color: rgba(0, 0, 0, .15); } .rv-page .rv-btn-secondary:hover { background: var(--rv-mist); } /* Divider, links, notes */ .rv-or { display: flex; align-items: center; gap: 16px; color: var(--rv-muted); margin: 24px 0; } .rv-or::before, .rv-or::after { content: ""; flex: 1; height: 1px; background: var(--rv-line); } .rv-legal { font-size: 14px; color: var(--rv-muted); margin: 6px 0 24px; } .rv-legal a, .rv-muted-link { color: var(--rv-muted) !important; text-decoration: underline; text-underline-offset: 2px; } .rv-switch { text-align: center; color: var(--rv-muted); font-size: 15px; margin: 36px 0 0; } .rv-switch a { color: var(--rv-green); font-weight: 500; text-decoration: none; } .rv-switch a:hover { text-decoration: underline; } .rv-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: -6px 0 24px; font-size: 14px; color: var(--rv-muted); } .rv-row label { display: flex; gap: 8px; align-items: center; } .rv-row input[type="checkbox"] { accent-color: var(--rv-green); } /* Alerts and cards */ .rv-errors { background: #FDF1F0; border: 1px solid #F3C7C2; color: #8A2A1F; border-radius: var(--rv-radius-field); padding: 12px 16px; margin: 0 0 24px; font-size: 14px; } .rv-errors p { margin: 0; } .rv-errors p + p { margin-top: 4px; } .rv-errors a { color: inherit; } .rv-card { background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; padding: 24px; margin: 0 0 20px; color: var(--rv-text); } .rv-card strong { color: var(--rv-black); font-weight: 500; } /* Account bar (signed-in pages) */ .rv-userbar { display: flex; align-items: center; gap: 16px; font-size: 15px; color: var(--rv-muted); } .rv-userbar span { max-width: 40vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .rv-userbar a { color: var(--rv-muted); text-decoration: none; } .rv-userbar a + a { padding-left: 16px; border-left: 1px solid var(--rv-line); } .rv-userbar-name { max-width: 40vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .rv-userbar a:hover { color: var(--rv-green); } /* Wide shell with main column + sidebar (dashboards) */ .rv-shell { max-width: 1120px; margin: 0 auto; padding: 24px 16px 80px; } .rv-page .rv-title-left { text-align: left; margin: 0 0 40px; } .rv-app-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 80px; align-items: start; } @media (max-width: 900px) { .rv-app-grid { grid-template-columns: 1fr; gap: 48px; } } /* Tabs */ .rv-tabs { display: flex; gap: 32px; border-bottom: 1px solid var(--rv-line); margin: 0 0 32px; } .rv-page .rv-tab { appearance: none; background: none; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 0 0 14px; font: inherit; font-size: 16px; font-weight: 500; color: var(--rv-muted); cursor: pointer; } .rv-page .rv-tab[aria-selected="true"] { color: var(--rv-green); border-bottom-color: var(--rv-green); } .rv-page .rv-tab:hover { color: var(--rv-green); background: none; } .rv-tab:focus-visible { outline: 2px solid var(--rv-green); outline-offset: 4px; } /* Action card */ .rv-card-action { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 32px; margin: 0; } .rv-page .rv-card-title { font-size: 20px; font-weight: 400; color: var(--rv-black); margin: 0 0 6px; } .rv-card-text { margin: 0; color: var(--rv-muted); } .rv-card-empty { text-align: center; color: var(--rv-muted); padding: 40px 24px; margin: 0; } .rv-btn-auto { width: auto; flex: none; padding: 16px 24px; } @media (max-width: 600px) { .rv-card-action { flex-direction: column; align-items: stretch; padding: 24px; } .rv-btn-auto { width: 100%; } } /* Sidebar */ .rv-page .rv-side-title { font-size: 20px; font-weight: 400; color: var(--rv-black); margin: 0 0 12px; } .rv-side-text { color: var(--rv-muted); margin: 0; } .rv-side-links { list-style: none; margin: 28px 0; padding: 28px 0; border-top: 1px solid var(--rv-line); border-bottom: 1px solid var(--rv-line); display: grid; gap: 16px; } .rv-side-links a, .rv-inline-link { color: var(--rv-black); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(0, 0, 0, .3); } .rv-side-links a:hover, .rv-inline-link:hover { color: var(--rv-green); text-decoration-color: currentColor; } /* Page intro */ .rv-back { display: inline-flex; gap: 8px; align-items: center; color: var(--rv-muted) !important; text-decoration: none; margin: 0 0 24px; } .rv-back:hover { color: var(--rv-green) !important; } .rv-page .rv-title-tight { margin-bottom: 10px; } .rv-lead { color: var(--rv-muted); font-size: 17px; margin: 0 0 48px; } .rv-shell-narrow { max-width: 720px; } .rv-toast { background: var(--rv-mist); border: 1px solid var(--rv-line); border-left: 3px solid var(--rv-green); color: var(--rv-green); border-radius: var(--rv-radius-field); padding: 12px 16px; margin: 0 0 24px; } /* Badges */ .rv-badge { display: inline-block; font-size: 13px; font-weight: 500; padding: 4px 10px; border-radius: 999px; } .rv-badge-warn { background: #FDECEA; color: #A8321F; } .rv-badge-ok { background: var(--rv-lime); color: var(--rv-green); } .rv-badge-neutral { background: var(--rv-mist); color: var(--rv-green); border: 1px solid var(--rv-line); } .rv-card-text-gap { margin-top: 10px; } .rv-card-compact { padding: 24px 28px; margin: 0 0 40px; } .rv-page .rv-card-title-sm { font-size: 17px; margin: 0 0 10px; } /* Long form with sticky section menu */ .rv-form-grid { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 80px; align-items: start; } .rv-steps { position: sticky; top: 32px; display: grid; gap: 4px; } .rv-steps a { display: block; padding: 8px 0; color: var(--rv-muted) !important; text-decoration: none; font-size: 16px; transition: color .2s; } .rv-steps a:hover { color: var(--rv-green) !important; } .rv-steps a.is-active { color: var(--rv-black) !important; font-weight: 500; } .rv-steps a.has-error::after { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border-radius: 50%; background: #C0392B; vertical-align: middle; } .rv-section { scroll-margin-top: 32px; padding: 0 0 56px; } .rv-page .rv-section-title { font-size: 26px; font-weight: 400; color: var(--rv-black); margin: 0 0 24px; } .rv-page .rv-subtitle { font-size: 17px; font-weight: 500; line-height: 1.4; color: var(--rv-black); margin: 0 0 4px; } .rv-field { margin: 0 0 28px; } .rv-field .rv-input { margin-bottom: 0; } .rv-help { color: var(--rv-muted); font-size: 14px; margin: -2px 0 10px; } .rv-req { color: #A8321F; margin-left: 2px; } .rv-page .rv-textarea { height: auto; min-height: 110px; padding-top: 12px; padding-bottom: 12px; line-height: 1.5; resize: vertical; } .rv-page .rv-select { appearance: none; padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230F3D3A' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; cursor: pointer; } /* Beats the kit's `.elementor-kit-5 input:not(...):not(...)` rule. */ body.rv-page .rv-input.rv-input:disabled { background-color: #EDEDEA; color: var(--rv-muted); border-color: rgba(0, 0, 0, .12); cursor: default; } .rv-field-error { color: #A8321F; font-size: 14px; margin: 8px 0 0; } .rv-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } @media (max-width: 600px) { .rv-two { grid-template-columns: 1fr; } } .rv-fieldset { border: 0; padding: 0; min-width: 0; } .rv-note { color: var(--rv-muted); margin: 8px 0 0; } .rv-counter { font-size: 13px; color: var(--rv-muted); margin: 8px 0 0; } .rv-counter.is-met { color: var(--rv-green); } /* Team repeater */ .rv-team-row { padding: 20px; margin: 16px 0 0; display: grid; gap: 16px; } .rv-team-row .rv-input { margin: 0; } .rv-page .rv-remove, .rv-page .rv-add { appearance: none; background: none; border: 0; padding: 0; font: inherit; cursor: pointer; } .rv-page .rv-remove { justify-self: end; color: var(--rv-muted); font-size: 14px; } .rv-page .rv-remove:hover { color: #A8321F; background: none; } .rv-page .rv-add { margin-top: 20px; color: var(--rv-black); font-weight: 500; font-size: 16px; } .rv-page .rv-add:hover { color: var(--rv-green); background: none; } /* Chips and pill checkboxes */ .rv-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; } .rv-chips:empty { display: none; } .rv-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--rv-mist); border: 1px solid var(--rv-line); color: var(--rv-green); border-radius: 999px; padding: 6px 8px 6px 14px; font-size: 14px; } .rv-page .rv-chip button { appearance: none; border: 0; background: none; padding: 0 6px; font-size: 16px; line-height: 1; color: var(--rv-muted); cursor: pointer; } .rv-page .rv-chip button:hover { color: #A8321F; background: none; } .rv-pills { display: flex; flex-wrap: wrap; gap: 10px; } .rv-pill { position: relative; cursor: pointer; } .rv-pill input { position: absolute; opacity: 0; pointer-events: none; } .rv-pill span { display: inline-block; padding: 10px 16px; border-radius: 999px; background: var(--rv-white); border: 1px solid rgba(0, 0, 0, .15); font-size: 14px; color: var(--rv-black); transition: background .2s, border-color .2s; } .rv-pill:hover span { border-color: var(--rv-green); } .rv-pill input:checked + span { background: var(--rv-lime); border-color: var(--rv-green); color: var(--rv-green); } .rv-pill input:focus-visible + span { outline: 2px solid var(--rv-green); outline-offset: 2px; } .rv-check { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; color: var(--rv-black); } .rv-check input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--rv-green); flex: none; } /* Fixed bottom action bar */ .rv-has-bar { padding-bottom: 110px; } .rv-actionbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--rv-sand); border-top: 1px solid var(--rv-line); } .rv-actionbar-inner { max-width: 1120px; margin: 0 auto; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; } .rv-actionbar-back { color: var(--rv-muted) !important; text-decoration: none; } .rv-actionbar-back:hover { color: var(--rv-green) !important; } .rv-actionbar-buttons { display: flex; gap: 12px; } @media (max-width: 900px) { .rv-form-grid { grid-template-columns: 1fr; gap: 24px; } .rv-steps { position: sticky; top: 0; z-index: 40; display: flex; gap: 20px; overflow-x: auto; background: var(--rv-sand); margin: 0 -16px; padding: 4px 16px; border-bottom: 1px solid var(--rv-line); scrollbar-width: none; } .rv-steps a { white-space: nowrap; padding: 12px 0; } .rv-section { scroll-margin-top: 72px; } } @media (max-width: 600px) { .rv-actionbar-back { display: none; } .rv-actionbar-buttons { flex: 1; } .rv-actionbar-buttons .rv-btn { flex: 1; padding: 16px 10px; } .rv-card-compact { flex-direction: row; align-items: center; } } /* ================================================================== * * Account area: navigation, co-founder profile controls, matching * ================================================================== */ .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } [hidden].rv-cf-overlay, [hidden].rv-cf-drawer, [hidden].rv-cf-modal, .rv-page [hidden] { display: none !important; } /* Account tabs under the top bar */ .rv-accountnav { border-bottom: 1px solid var(--rv-line); margin: 0 0 8px; } .rv-accountnav-inner { max-width: 1120px; margin: 0 auto; padding: 0 16px; display: flex; gap: 28px; overflow-x: auto; scrollbar-width: none; } .rv-page .rv-accountnav a { display: inline-flex; align-items: center; gap: 8px; padding: 14px 0 12px; color: var(--rv-muted); text-decoration: none; font-weight: 500; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -1px; } .rv-page .rv-accountnav a:hover { color: var(--rv-green); } .rv-page .rv-accountnav a.is-active { color: var(--rv-green); border-bottom-color: var(--rv-green); } .rv-navbadge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--rv-lime); color: var(--rv-green); font-size: 12px; font-weight: 500; } /* Tabs rendered as links */ .rv-page a.rv-tab { text-decoration: none; } .rv-page .rv-tab[aria-current="page"] { color: var(--rv-green); border-bottom-color: var(--rv-green); } /* Profile: optional labels, small checkboxes, on/off switch */ .rv-optional { color: var(--rv-muted); font-weight: 400; } .rv-check-sm { margin-top: 10px; font-size: 14px; color: var(--rv-muted); } .rv-check-sm input { margin-top: 2px; width: 16px; height: 16px; } .rv-toggle-card { padding: 20px 24px; margin: 0 0 24px; } .rv-switch-row { display: flex; gap: 16px; align-items: flex-start; cursor: pointer; } .rv-switch-row input { position: absolute; opacity: 0; pointer-events: none; } .rv-switch-ui { flex: none; position: relative; width: 44px; height: 24px; margin-top: 2px; border-radius: 999px; background: rgba(0, 0, 0, .18); transition: background .2s; } .rv-switch-ui::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--rv-white); box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .2s; } .rv-switch-row input:checked + .rv-switch-ui { background: var(--rv-green); } .rv-switch-row input:checked + .rv-switch-ui::after { transform: translateX(20px); } .rv-switch-row input:focus-visible + .rv-switch-ui { outline: 2px solid var(--rv-green); outline-offset: 2px; } .rv-switch-row strong { color: var(--rv-black); font-weight: 500; } .rv-help-inline { color: var(--rv-muted); font-size: 14px; } #p-cf-fields { transition: opacity .2s; } #p-cf-fields.is-muted { opacity: .55; } .rv-radios { display: flex; flex-wrap: wrap; gap: 10px; } /* Matching: onboarding */ .rv-cf-onboard { max-width: 640px; padding: 32px; } .rv-checklist { list-style: none; margin: 20px 0 28px; padding: 0; display: grid; gap: 12px; } .rv-checklist li { display: flex; align-items: center; gap: 12px; color: var(--rv-black); } .rv-checkmark { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .2); color: var(--rv-green); font-size: 13px; } .rv-checklist li.is-done { color: var(--rv-muted); } .rv-checklist li.is-done .rv-checkmark { background: var(--rv-lime); border-color: var(--rv-green); } /* Matching: status line, filters, cards */ .rv-cf-status { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin: -24px 0 24px; } .rv-cf-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin: 0 0 12px; } .rv-cf-filters .rv-input { height: 44px; padding-top: 8px; padding-bottom: 8px; font-size: 14px; } .rv-cf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; margin: 16px 0 0; } .rv-cf-card { display: flex; flex-direction: column; gap: 14px; padding: 24px; margin: 0; } .rv-cf-card-top { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; } .rv-page .rv-cf-card .rv-card-title-sm { margin: 0 0 2px; } .rv-cf-meta { color: var(--rv-muted); font-size: 14px; margin: 0; font-weight: 400; } .rv-cf-score { flex: none; font-weight: 500; color: var(--rv-green); background: var(--rv-mist); border: 1px solid var(--rv-line); border-radius: 999px; padding: 4px 10px; font-size: 14px; } .rv-cf-score-lg { display: inline-block; margin: 0 0 12px; } .rv-cf-pitch { margin: 0; color: var(--rv-text); white-space: pre-line; } .rv-cf-card .rv-cf-pitch { flex: 1; } .rv-cf-card-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; } .rv-chip-sm { padding: 4px 10px; font-size: 13px; } .rv-page .rv-btn-sm { min-height: 40px; padding: 10px 16px; } /* Matching: request / sent / connection rows */ .rv-cf-row { display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 24px; margin: 0 0 16px; } .rv-cf-row-main { min-width: 0; flex: 1; } .rv-cf-row-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: flex-end; } .rv-cf-quote { margin: 8px 0; color: var(--rv-black); font-style: italic; } .rv-cf-row .rv-cf-pitch { margin: 0 0 8px; font-size: 14px; } .rv-cf-contacts { list-style: none; margin: 10px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; } .rv-cf-contacts a { color: var(--rv-green); } @media (max-width: 700px) { .rv-cf-row { flex-direction: column; align-items: stretch; } .rv-cf-row-actions { justify-content: flex-start; } } /* Text-style buttons */ .rv-page .rv-linkbtn { appearance: none; background: none; border: 0; padding: 0; font: inherit; font-size: 14px; color: var(--rv-muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } .rv-page .rv-linkbtn:hover { color: var(--rv-green); background: none; } /* Profile side panel */ .rv-cf-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, .3); z-index: 60; } .rv-cf-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(560px, 100vw); background: var(--rv-sand); z-index: 61; overflow-y: auto; padding: 32px; box-shadow: -8px 0 24px rgba(0, 0, 0, .12); } .rv-page .rv-cf-x { position: absolute; top: 16px; right: 16px; appearance: none; border: 0; background: none; font-size: 28px; line-height: 1; color: var(--rv-muted); cursor: pointer; padding: 4px 8px; } .rv-page .rv-cf-x:hover { color: var(--rv-black); background: none; } .rv-cf-drawer .rv-subtitle { margin: 24px 0 6px; } .rv-cf-dl { margin: 24px 0 0; display: grid; gap: 10px; } .rv-cf-dl-row { display: grid; grid-template-columns: 170px 1fr; gap: 12px; } .rv-cf-dl dt { color: var(--rv-muted); } .rv-cf-dl dd { margin: 0; color: var(--rv-black); } @media (max-width: 500px) { .rv-cf-dl-row { grid-template-columns: 1fr; gap: 2px; } .rv-cf-drawer { padding: 24px 20px; } } .rv-cf-drawer-actions { margin: 28px 0 16px; } .rv-cf-more { color: var(--rv-muted); font-size: 14px; } /* Dialog */ .rv-cf-modal { position: fixed; inset: 0; z-index: 70; background: rgba(0, 0, 0, .35); display: flex; align-items: center; justify-content: center; padding: 16px; } .rv-cf-modal-box { background: var(--rv-white); border-radius: 10px; width: min(560px, 100%); max-height: 90vh; overflow: auto; padding: 28px; } .rv-cf-modal-box .rv-input { margin: 10px 0 0; } .rv-cf-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; } .rv-cf-stack { display: grid; gap: 4px; } /* Waiting list, invites, member badges, ambassadors */ .rv-waitlist { padding: 32px; margin: 0 0 24px; } .rv-page .rv-waitlist-title { font-size: 32px; font-weight: 400; margin: 16px 0 12px; } .rv-progress { height: 8px; border-radius: 999px; background: var(--rv-line); overflow: hidden; margin: 0 0 16px; } .rv-progress span { display: block; height: 100%; background: var(--rv-green); border-radius: 999px; min-width: 8px; } .rv-waitlist-balance { list-style: none; margin: 16px 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; color: var(--rv-text); } .rv-waitlist-balance strong { color: var(--rv-green); font-weight: 500; font-size: 18px; } .rv-invite { padding: 28px; margin: 24px 0; display: grid; gap: 12px; } .rv-page .rv-invite .rv-card-title { margin: 0; } .rv-invite .rv-card-text { margin: 0; } .rv-invite-emails { display: grid; gap: 8px; } .rv-invite .rv-input { margin: 0; } .rv-page .rv-invite [data-add-email] { justify-self: start; } .rv-invite .rv-help { margin: 0; } .rv-invite-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .rv-invite-result { color: var(--rv-green); font-size: 14px; } .rv-invite-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid var(--rv-line); } .rv-invite-share .rv-help { margin: 0 4px 0 0; } .rv-invite-stats { margin: 0; color: var(--rv-muted); font-size: 14px; } .rv-badge-member, .rv-page .rv-chip-member { background: var(--rv-green); color: var(--rv-lime); border-color: var(--rv-green); } .rv-cf-drawer .rv-chip-member { margin: 0 6px 12px 0; } .rv-amb-event { padding: 28px; margin: 24px 0; } .rv-page .rv-amb-event .rv-card-title { margin: 0 0 6px; } .rv-amb-event .rv-card-text { margin: 0 0 24px; } .rv-amb-form { max-width: 760px; } /* Mentors: list with filters (inside theme pages) and full-page profile */ .rv-embed { background: transparent; } .rv-mentors { padding: 8px 0 0; } .rv-mentors-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; } .rv-mentor-filter { position: sticky; top: 110px; background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; padding: 16px; } .rv-page .rv-mentor-search { height: 44px; margin: 0 0 12px; font-size: 14px; } .rv-mentor-terms { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 2px; } .rv-mentor-term { display: flex; align-items: center; gap: 10px; padding: 6px 4px; cursor: pointer; font-size: 15px; color: var(--rv-black); border-radius: 4px; } .rv-mentor-term:hover { background: var(--rv-mist); } .rv-mentor-term input { width: 16px; height: 16px; accent-color: var(--rv-green); margin: 0; } .rv-mentor-term span:nth-of-type(1) { flex: 1; } .rv-mentor-count { color: var(--rv-muted); font-size: 13px; } .rv-mentor-filter .rv-linkbtn { display: block; margin: 6px 4px 0; } .rv-mentor-group { margin: 0 0 40px; } .rv-page .rv-mentor-group-title { font-size: 24px; font-weight: 400; color: var(--rv-black); margin: 0 0 4px; } .rv-mentor-group-text { color: var(--rv-muted); margin: 0 0 16px; } .rv-mentor-list { display: grid; gap: 14px; } .rv-page a.rv-mentor-card { display: flex; gap: 20px; align-items: flex-start; padding: 20px 24px; background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; text-decoration: none; color: var(--rv-text); transition: border-color .2s, box-shadow .2s; } .rv-page a.rv-mentor-card:hover { border-color: var(--rv-green); box-shadow: 0 2px 10px rgba(15, 61, 58, .08); } .rv-mentor-photo { flex: none; width: 72px; height: 72px; border-radius: 8px; object-fit: cover; background: var(--rv-mist); } .rv-mentor-initials { display: inline-flex; align-items: center; justify-content: center; font-weight: 500; font-size: 22px; color: var(--rv-green); background: var(--rv-lime); } .rv-mentor-body { display: grid; gap: 6px; min-width: 0; } .rv-mentor-name { font-size: 18px; font-weight: 500; color: var(--rv-black); } .rv-mentor-headline { color: var(--rv-muted); font-size: 14px; } .rv-mentor-summary { color: var(--rv-text); font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .rv-mentor-body .rv-chips { margin: 2px 0; } .rv-chip-more { background: transparent; } @media (max-width: 900px) { .rv-mentors-layout { grid-template-columns: 1fr; gap: 24px; } .rv-mentor-filter { position: static; } } @media (max-width: 520px) { .rv-page a.rv-mentor-card { flex-direction: column; } } .rv-mentor-single { padding: 24px 0 40px; } .rv-mentor-hero { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 48px; align-items: center; margin: 8px 0 56px; } .rv-mentor-hero-photo { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 12px; background: var(--rv-mist); } .rv-mentor-hero-photo.rv-mentor-initials { font-size: 72px; } .rv-mentor-eyebrow { display: inline-block; font-size: 12px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: var(--rv-green-hover); margin: 0 0 8px; } .rv-page .rv-mentor-h1 { margin: 0 0 8px; } .rv-mentor-lead { margin: 0 0 16px; } .rv-mentor-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--rv-muted); margin: 16px 0 24px; } .rv-mentor-actions { display: flex; flex-wrap: wrap; gap: 12px; } .rv-mentor-section { margin: 0 0 56px; max-width: 860px; } .rv-mentor-bio p { margin: 0 0 16px; font-size: 16px; line-height: 1.7; color: var(--rv-text); } .rv-mentor-brought { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; } .rv-mentor-brought li { position: relative; padding-left: 32px; color: var(--rv-black); } .rv-mentor-brought li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--rv-lime); color: var(--rv-green); font-size: 12px; display: flex; align-items: center; justify-content: center; } .rv-mentor-how { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .rv-mentor-how .rv-card { margin: 0; padding: 24px; } .rv-mentor-how .rv-card-text { margin: 0; } .rv-mentor-single .rv-mentor-section:has(.rv-mentor-list-grid), .rv-mentor-single .rv-mentor-section:has(.rv-mentor-how) { max-width: none; } .rv-mentor-more-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; } .rv-mentor-list-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .rv-mentor-list-grid .rv-mentor-card { flex-direction: column; } .rv-mentor-cta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; background: var(--rv-green); border-radius: 8px; padding: 48px; color: rgba(255, 255, 255, .7); } .rv-page .rv-mentor-cta-title { color: var(--rv-white); font-size: 28px; font-weight: 400; margin: 0 0 8px; } .rv-mentor-cta p { margin: 0; max-width: 620px; } @media (max-width: 900px) { .rv-mentor-hero { grid-template-columns: 1fr; gap: 24px; } .rv-mentor-hero-photo { max-width: 360px; } .rv-mentor-how, .rv-mentor-list-grid { grid-template-columns: 1fr; } .rv-mentor-cta { padding: 32px 24px; } } /* Brand manual (/brand-manual/) */ .rvb-toc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; } .rvb-toc a { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--rv-line); background: var(--rv-white); color: var(--rv-green); text-decoration: none; font-size: 14px; } .rvb-toc a:hover { background: var(--rv-lime); border-color: var(--rv-green); } .rvb-grid { display: grid; gap: 20px; } .rvb-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rvb-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 900px) { .rvb-grid-2, .rvb-grid-3 { grid-template-columns: 1fr; } } .rvb-panel { background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; padding: 28px; } .rvb-panel p { margin: 0 0 10px; } .rvb-panel-dark { background: var(--rv-green); border-color: var(--rv-green); color: rgba(255, 255, 255, .8); } .rvb-panel-dark .rvb-kicker { color: var(--rv-lime); } .rvb-kicker { display: block; font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--rv-green-hover); margin: 0 0 12px; } .rvb-big { font-size: 22px; line-height: 1.4; color: var(--rv-white); font-weight: 300; } .rvb-list { margin: 0; padding-left: 20px; display: grid; gap: 8px; } .rvb-list-x { list-style: none; padding: 0; } .rvb-list-x li::before { content: "✕"; color: #A8321F; margin-right: 10px; font-size: 12px; } .rvb-cols { columns: 2; column-gap: 40px; display: block; } .rvb-cols li { margin: 0 0 10px; break-inside: avoid; } @media (max-width: 700px) { .rvb-cols { columns: 1; } } .rvb-table-wrap { overflow-x: auto; border: 1px solid var(--rv-line); border-radius: 8px; background: var(--rv-white); } .rvb-table { width: 100%; border-collapse: collapse; font-size: 15px; } .rvb-table th, .rvb-table td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--rv-line); vertical-align: top; } .rvb-table th { font-weight: 500; color: var(--rv-muted); font-size: 13px; background: var(--rv-mist); } .rvb-table tr:last-child td { border-bottom: 0; } .rvb-callout { margin-top: 20px; padding: 16px 20px; border-left: 3px solid var(--rv-green); background: var(--rv-mist); border-radius: 4px; } .rvb-dodont { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 8px 0 28px; } @media (max-width: 700px) { .rvb-dodont { grid-template-columns: 1fr; } } .rvb-do, .rvb-dont { border-radius: 8px; padding: 24px; border: 1px solid var(--rv-line); background: var(--rv-white); } .rvb-do { border-top: 4px solid var(--rv-green); } .rvb-dont { border-top: 4px solid #C0392B; } .rvb-do p, .rvb-dont p { margin: 0 0 12px; color: var(--rv-black); } .rvb-tag { display: inline-block; font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px; } .rvb-do .rvb-tag { color: var(--rv-green); } .rvb-dont .rvb-tag { color: #A8321F; } .rvb-rules h4 { font-size: 17px; margin: 0 0 6px; } .rvb-rules p { margin: 0; } .rvb-logo { margin: 0; border-radius: 8px; overflow: hidden; border: 1px solid var(--rv-line); } .elementor .rvb-logo img, .rvb-logo img { display: block; height: 72px !important; width: auto !important; max-width: 80%; margin: 56px auto; object-fit: contain; } .rvb-logo figcaption { padding: 14px 18px; background: var(--rv-white); font-size: 14px; color: var(--rv-muted); border-top: 1px solid var(--rv-line); } .rvb-logo-light { background: var(--rv-sand); } .rvb-logo-dark { background: var(--rv-green); } .rvb-logo-lime { background: var(--rv-lime); } .rvb-clear { display: flex; justify-content: center; padding: 28px; margin: 4px 0 16px; border: 1px dashed rgba(15, 61, 58, .4); border-radius: 4px; background: repeating-linear-gradient(45deg, transparent 0 8px, rgba(200, 248, 169, .35) 8px 16px); } .elementor .rvb-clear img, .rvb-clear img { width: auto !important; height: 40px !important; background: var(--rv-sand); padding: 12px; } .rvb-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; } .rvb-swatch { border: 1px solid var(--rv-line); border-radius: 8px; overflow: hidden; background: var(--rv-white); } .rvb-chipc { display: block; height: 96px; border-bottom: 1px solid var(--rv-line); } .rvb-swatch > div { padding: 14px 16px; display: grid; gap: 2px; } .rvb-swatch code { font-size: 13px; color: var(--rv-green); background: none; padding: 0; } .rvb-swatch small { color: var(--rv-muted); font-size: 12px; } .rvb-swatch p { margin: 6px 0 0; font-size: 14px; } .rvb-ratio { display: flex; margin: 20px 0 32px; border-radius: 8px; overflow: hidden; border: 1px solid var(--rv-line); font-size: 13px; } .rvb-ratio span { padding: 14px 12px; white-space: nowrap; overflow: hidden; } .rvb-h3 { font-size: 22px; font-weight: 400; color: var(--rv-black); margin: 24px 0 12px; } .rvb-pair { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 28px; border-radius: 4px; margin-right: 10px; font-weight: 500; border: 1px solid var(--rv-line); } .rvb-type-name { margin: 0; font-weight: 500; color: var(--rv-black); min-width: 150px; } .rvb-meta { margin: 4px 0 0; font-size: 13px; color: var(--rv-muted); } .rvb-space { display: grid; gap: 8px; margin: 4px 0 14px; font-size: 13px; color: var(--rv-muted); } .rvb-space div { display: flex; align-items: center; gap: 10px; } .rvb-space span { display: inline-block; height: 12px; background: var(--rv-green); border-radius: 2px; } .rvb-radii { display: flex; flex-wrap: wrap; gap: 12px; } .rvb-radii div { width: 64px; height: 64px; background: var(--rv-lime); color: var(--rv-green); display: flex; flex-direction: column; align-items: center; justify-content: center; font-weight: 500; } .rvb-radii small { font-weight: 400; font-size: 11px; } .rvb-icons { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; } .rvb-icons div { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 20px 8px; border: 1px solid var(--rv-line); border-radius: 8px; background: var(--rv-white); } .rvb-icons i { font-size: 26px; color: var(--rv-green); } .rvb-icons code { font-size: 12px; color: var(--rv-muted); background: none; } .rvb-images figure { margin: 0; } .elementor .rvb-images img, .rvb-images img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; display: block; background: var(--rv-mist); } .rvb-images figcaption { font-size: 14px; color: var(--rv-muted); margin-top: 10px; } .rvb-textlink { color: var(--rv-green) !important; font-weight: 500; text-decoration: underline; text-underline-offset: 4px; } .rvb-member .rv-tabs { margin: 0 0 16px; } .rvb-member .rv-input { margin: 0; } .rvb-downloads { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; } .rvb-downloads a { display: inline-block; padding: 12px 18px; border-radius: 6px; border: 1px solid var(--rv-line); background: var(--rv-white); color: var(--rv-green) !important; text-decoration: none; } .rvb-downloads a:hover { background: var(--rv-lime); } /* Brand manual: section layout examples (rvl-*) */ .rvl-example { margin: 0 0 56px; } .rvl-head { display: flex; gap: 16px; align-items: flex-start; margin: 0 0 20px; padding-top: 24px; border-top: 1px solid var(--rv-line); } .rvl-num { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--rv-green); color: var(--rv-lime); display: flex; align-items: center; justify-content: center; font-weight: 500; } .rvl-head h3 { margin: 0 0 4px; font-size: 22px; font-weight: 400; } .rvl-head p { margin: 0; color: var(--rv-muted); } .rvl-note { margin: 0; padding: 16px 20px; border-left: 3px solid var(--rv-green); background: var(--rv-mist); border-radius: 4px; } .rvl-display { font-family: "Forum", Georgia, serif !important; font-weight: 400 !important; font-size: clamp(30px, 4vw, 48px) !important; line-height: 1.12 !important; color: var(--rv-black); margin: 0 !important; } .rvl-light { color: var(--rv-white) !important; } .rvl-lead { font-size: 17px; color: var(--rv-text); margin: 0; } .rvl-label { display: inline-block; align-self: flex-start; font-size: 12px; font-weight: 500; padding: 4px 10px; border-radius: 4px; background: var(--rv-mist); color: var(--rv-black); margin: 0 0 14px; } .rvl-label-dark { background: var(--rv-white); } .rvl-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 36px; padding: 16px 18px; border-radius: 6px; font-size: 14px; font-weight: 500; text-decoration: none !important; transition: background .2s, color .2s; } .rvl-btn-lime { background: var(--rv-lime); color: var(--rv-green) !important; } .rvl-btn-lime:hover { background: var(--rv-green); color: var(--rv-lime) !important; } .rvl-btn-dark { background: var(--rv-green); color: var(--rv-white) !important; } .rvl-btn-dark:hover { background: var(--rv-green-hover); } .rvl-photo { position: relative; min-height: 460px; border-radius: 12px; background-size: cover; background-position: center; padding: 56px; display: flex; align-items: flex-start; } .rvl-photo::before { content: ""; position: absolute; inset: 0; border-radius: 12px; background: linear-gradient(90deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .15)); } .rvl-photo h2 { position: relative; max-width: 640px; } .rvl-statcard { position: absolute; right: 40px; bottom: -24px; width: 280px; border-radius: 8px; overflow: hidden; background: rgba(40, 50, 45, .6); backdrop-filter: blur(10px); color: rgba(255, 255, 255, .8); padding: 22px 22px 0; } .rvl-statcard span { font-size: 13px; } .rvl-statcard strong { display: block; font-size: 60px; font-weight: 200; color: var(--rv-white); line-height: 1.1; } .rvl-statcard p { margin: 0 0 18px; font-size: 14px; } .rvl-statcard .rvl-btn { margin: 0 -22px; width: calc(100% + 44px); border-radius: 0; } .rvl-split { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: end; margin: 0 0 32px; } .rvl-two { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; } .rvl-imgwrap { position: relative; } .elementor .rvl-imgwrap img, .rvl-imgwrap img { width: 78%; height: 520px; object-fit: cover; border-radius: 8px; display: block; } .elementor .rvl-imgwrap-short img, .rvl-imgwrap-short img { width: 100%; height: 440px; } .rvl-hand { position: absolute; left: 22px; bottom: 60px; margin: 0; font-family: "Nothing You Could Do", cursive; color: var(--rv-white); font-size: 20px; line-height: 1.3; text-shadow: 0 1px 6px rgba(0, 0, 0, .4); } .rvl-float { position: absolute; right: 0; bottom: -20px; width: 46%; min-width: 230px; background: var(--rv-lime) no-repeat top center / 120%; border-radius: 8px; padding: 110px 22px 22px; } .rvl-float h4 { margin: 0 0 8px; font-size: 18px; font-weight: 400; } .rvl-float ul { list-style: none; margin: 0 0 18px; padding: 0; font-size: 14px; color: var(--rv-green); } .rvl-float li::before { content: "✓ "; } .rvl-float .rvl-btn { width: 100%; } .rvl-imgbtn { position: absolute; left: 20px; bottom: 20px; } .rvl-acc { background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; padding: 8px 30px; } .rvl-acc details { border-bottom: 1px solid var(--rv-line); padding: 22px 0; } .rvl-acc details:last-child { border-bottom: 0; } .rvl-acc summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; font-size: 20px; color: var(--rv-black); } .rvl-acc summary::-webkit-details-marker { display: none; } .rvl-acc summary::after { content: "+"; font-size: 24px; font-weight: 300; color: var(--rv-muted); } .rvl-acc details[open] summary::after { content: "–"; } .rvl-acc p { margin: 14px 0 0; } .rvl-checks { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; } .rvl-checks i { color: var(--rv-green); margin-right: 12px; font-size: 20px; vertical-align: middle; } .rvl-impact { position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 0; background: var(--rv-green); border-radius: 8px; padding: 40px 40px 110px; color: rgba(255, 255, 255, .8); overflow: hidden; } .rvl-impact-title i { color: var(--rv-lime); font-size: 24px; } .rvl-impact-title p { font-family: "Forum", Georgia, serif; font-size: 22px; color: var(--rv-white); margin: 16px 0 0; line-height: 1.3; } .rvl-impact-stat { border-left: 1px solid rgba(255, 255, 255, .2); padding: 0 28px; } .rvl-impact-stat strong { display: block; font-size: 48px; font-weight: 300; color: var(--rv-lime); line-height: 1.1; } .rvl-impact-stat span { font-size: 14px; } .rvl-wave { position: absolute; left: 25%; right: 40px; bottom: 24px; width: 72%; height: 80px; } .rvl-bento { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: minmax(210px, auto); gap: 16px; } .rvl-tile { border-radius: 8px; background: var(--rv-mist); padding: 28px; display: flex; flex-direction: column; justify-content: space-between; } .rvl-tile i { font-size: 36px; color: var(--rv-green); } .rvl-tile h4 { margin: 24px 0 8px; font-size: 20px; font-weight: 400; } .rvl-tile p { margin: 0; font-size: 14px; } .rvl-tile-dark { grid-row: span 2; background-size: cover; background-position: center; } .rvl-tile-dark .rvl-btn { align-self: flex-start; } .rvl-tile-lime { grid-row: span 2; background: var(--rv-lime); } .rvl-tile-lime h4 { margin-top: 0; } .rvl-tile-photo { padding: 0; overflow: hidden; grid-row: span 2; } .elementor .rvl-tile-photo img, .rvl-tile-photo img { width: 100%; height: 100%; object-fit: cover; display: block; } .rvl-bars { display: flex; align-items: flex-end; gap: 10px; height: 230px; } .rvl-bars div { flex: 1; background: var(--rv-green); border-radius: 8px; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px; color: var(--rv-lime); } .rvl-bars span { font-size: 12px; opacity: .8; } .rvl-bars b { font-weight: 500; font-size: 14px; } .rvl-tabsband { border-radius: 8px 8px 0 0; background-size: cover; padding: 72px 24px; text-align: center; } .rvl-tabs { background: var(--rv-mist); border-radius: 0 0 8px 8px; padding: 0 40px 40px; } .rvl-tablist { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--rv-line); margin: 0 0 32px; } .rvl-tablist button { appearance: none; background: none !important; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 22px 8px; font: inherit; font-size: 15px; color: var(--rv-black) !important; cursor: pointer; } .rvl-tablist button[aria-selected="true"] { border-bottom-color: var(--rv-green); } .rvl-tabpanel { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; } .rvl-tabpanel[hidden] { display: none; } .rvl-bordered { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: 20px; } .rvl-bordered li { border-left: 1px solid var(--rv-muted); padding-left: 18px; font-size: 18px; } .rvl-bordered strong { font-weight: 400; color: var(--rv-black); } .rvl-imgcard { min-height: 380px; border-radius: 8px; background-size: cover; background-position: center; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; } .rvl-imgcard i { color: var(--rv-lime); font-size: 24px; } .rvl-two-top { align-items: stretch; } .rvl-statlist { display: grid; gap: 0; } .rvl-statlist > div { display: grid; grid-template-columns: 130px 1fr; gap: 20px; padding: 26px; border-radius: 8px; align-items: start; } .rvl-statlist > div:nth-child(odd) { background: var(--rv-mist); } .rvl-statlist strong { font-family: "Forum", Georgia, serif; font-weight: 400; font-size: 44px; color: var(--rv-green); line-height: 1; } .rvl-statlist h4 { margin: 0 0 6px; font-size: 18px; font-weight: 400; } .rvl-statlist p { margin: 0; font-size: 14px; } .rvl-article { max-width: 780px; margin: 0 auto 40px; background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 12px; overflow: hidden; } .rvl-art-head { padding: 40px 40px 24px; } .rvl-chip { display: inline-block; font-size: 12px; padding: 4px 10px; border-radius: 4px; background: var(--rv-mist); margin-right: 10px; } .rvl-muted { color: var(--rv-muted); font-size: 13px; } .rvl-art-h1 { font-size: 34px !important; line-height: 1.2 !important; margin: 16px 0 12px !important; font-weight: 400 !important; } .elementor .rvl-art-img, .rvl-art-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; height: auto; } .rvl-art-body { padding: 32px 40px 40px; } .rvl-art-body h3 { font-size: 24px; font-weight: 400; margin: 32px 0 10px; } .rvl-art-body a { color: var(--rv-green); text-decoration: underline; } .rvl-takeaways { background: var(--rv-mist); border-radius: 8px; padding: 22px 26px; } .rvl-takeaways h4, .rvl-sources h4 { margin: 0 0 10px; font-size: 16px; font-weight: 500; } .rvl-takeaways ul { margin: 0; padding-left: 20px; } .rvl-quote { margin: 28px 0; padding: 0 0 0 24px; border-left: 3px solid var(--rv-lime); font-family: "Forum", Georgia, serif; font-size: 24px; line-height: 1.35; color: var(--rv-black); } .rvl-inline-cta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; background: var(--rv-lime); border-radius: 8px; padding: 24px 26px; margin: 28px 0; } .rvl-inline-cta h4 { margin: 0 0 4px; font-size: 18px; font-weight: 500; } .rvl-inline-cta p { margin: 0; color: var(--rv-green); } .rvl-sources { border-top: 1px solid var(--rv-line); margin-top: 28px; padding-top: 18px; font-size: 14px; color: var(--rv-muted); } .rvl-skels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .rvl-skel { background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: 8px; padding: 20px; } .rvl-skel h4 { margin: 0 0 4px; font-size: 17px; font-weight: 500; } .rvl-skel p { margin: 0 0 14px; font-size: 13px; color: var(--rv-muted); } .rvl-skel-stack { display: grid; gap: 6px; } .rvl-sk { display: block; font-size: 12px; padding: 12px 10px; border-radius: 4px; line-height: 1.3; } .rvl-sk-dark { background: var(--rv-green); color: var(--rv-lime); } .rvl-sk-lime { background: var(--rv-lime); color: var(--rv-green); } .rvl-sk-light { background: var(--rv-sand); border: 1px solid var(--rv-line); } .rvl-sk-mist { background: var(--rv-mist); } .rvl-sk-photo { background: linear-gradient(135deg, #9aa89e, #5d6f64); color: var(--rv-white); padding: 26px 10px; } @media (max-width: 1024px) { .rvl-skels { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rvl-impact { grid-template-columns: 1fr 1fr; row-gap: 28px; } } @media (max-width: 800px) { .rvl-split, .rvl-two, .rvl-tabpanel { grid-template-columns: 1fr; gap: 24px; } .rvl-photo { padding: 32px 24px 160px; min-height: 380px; } .rvl-statcard { right: 16px; left: 16px; width: auto; } .elementor .rvl-imgwrap img, .rvl-imgwrap img { width: 100%; height: 380px; } .rvl-float { position: relative; width: auto; margin-top: -60px; right: auto; bottom: auto; } .rvl-bento { grid-template-columns: 1fr; } .rvl-tile-dark, .rvl-tile-lime, .rvl-tile-photo { grid-row: auto; } .rvl-tile-photo { min-height: 260px; } .rvl-impact { grid-template-columns: 1fr; padding: 32px 24px 100px; } .rvl-impact-stat { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .2); padding: 18px 0 0; } .rvl-tabs { padding: 0 20px 24px; } .rvl-tablist { grid-template-columns: 1fr; } .rvl-statlist > div { grid-template-columns: 90px 1fr; padding: 20px; } .rvl-art-head, .rvl-art-body { padding-left: 22px; padding-right: 22px; } .rvl-skels { grid-template-columns: 1fr; } } /* My Applications: withdraw link and previous cards */ .rv-withdraw { margin: 10px 4px 0; text-align: right; } .rv-card-prev { margin: 0 0 12px; padding: 24px 28px; } .rv-card-prev .rv-badge-warn { background: #FDECEA; color: #A8321F; } /* Honeypot */ .rv-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }