/* WordPress-specific styles. New in the classic build. The block theme never needed these because WordPress supplied its own block stylesheet and theme.json handled the element defaults; a classic theme has to provide them. Kept in a separate file so futuristic.css and components.css stay byte-identical to the versions that shipped with the block build — the design CSS is not touched by this conversion. */ /* --- rich text ------------------------------------------------------------ The design resets p{margin:0} because every designed section controls its own spacing. Editor-written prose (blog posts, Privacy Policy, Terms) needs the rhythm put back, or it renders as one unbroken wall of text. */ .rh-richtext > * + *{margin-top:var(--wp--preset--spacing--50)} .rh-richtext p{line-height:var(--wp--custom--line-height--lead);max-width:var(--wp--custom--measure--prose)} .rh-richtext h2{margin-top:var(--wp--preset--spacing--70)} .rh-richtext h3{margin-top:var(--wp--preset--spacing--60)} .rh-richtext ul,.rh-richtext ol{padding-left:1.25em;line-height:var(--wp--custom--line-height--lead)} .rh-richtext li + li{margin-top:var(--wp--preset--spacing--20)} .rh-richtext img{max-width:100%;height:auto;border-radius:var(--wp--custom--radius--image)} .rh-richtext blockquote{ margin:0;padding:var(--wp--preset--spacing--50); background:var(--wp--preset--color--surface-tint); border-left:3px solid var(--wp--preset--color--green-700); border-radius:var(--wp--custom--radius--card); } .rh-richtext table{width:100%;border-collapse:collapse} .rh-richtext th,.rh-richtext td{ padding:var(--wp--preset--spacing--30); border-bottom:1px solid var(--wp--preset--color--green-200); text-align:left; } .rh-richtext code{ font-family:var(--wp--preset--font-family--mono); font-size:var(--wp--preset--font-size--small); background:var(--wp--preset--color--surface-tint); padding:2px 6px;border-radius:6px; } /* --- main landmark -------------------------------------------------------- */ .rh-main{display:block} /* --- scroll reveal: disabled --------------------------------------------- The design faded each section up from opacity 0 as it entered the viewport. On a real page that reads as sections being washed out or half-drawn — especially while scrolling quickly, or on the section currently at the fold. Content now renders solid from first paint. The JS still adds .is-revealed on entry, so the one-shot flourishes that hang off it (the signal line drawing itself, the underline sweep) still play. Only the whole-section fade is gone. Overridden here rather than edited into futuristic.css, so the original design CSS stays intact and this is one block to delete if the fade is ever wanted back. */ [data-reveal]{opacity:1 !important;transform:none !important} /* The heading underline is part of the reveal chain; draw it regardless. */ .rh-underline::after{width:96px} /* --- image placeholders --------------------------------------------------- Until real photography arrives, an empty slot should read as a considered part of the design rather than a missing asset. The striped swatch and its "4:3 placeholder" caption are replaced by a soft brand-tinted panel. font-size:0 hides the caption text without removing the element, so the aria-label carrying the production alt text is still announced. */ .rh-ph{ background:linear-gradient(135deg, var(--wp--preset--color--green-50) 0%, var(--wp--preset--color--green-100) 55%, var(--wp--preset--color--green-200) 100%) !important; border:1px solid var(--wp--preset--color--green-200); border-radius:var(--wp--custom--radius--image); font-size:0 !important; color:transparent !important; overflow:hidden; position:relative; } /* A single faint diagonal sheen, so large panels are not flat blocks. */ .rh-ph::after{ content:"";position:absolute;inset:0; background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%); } @media (prefers-reduced-motion: reduce){.rh-ph::after{display:none}} /* --- core alignment and media classes ------------------------------------ */ .alignleft{float:left;margin:0 var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) 0} .alignright{float:right;margin:0 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--50)} .aligncenter{display:block;margin-left:auto;margin-right:auto} .alignwide,.alignfull{max-width:none} .wp-caption{max-width:100%} .wp-caption-text,.wp-element-caption{ font-size:var(--wp--preset--font-size--small); line-height:var(--wp--custom--line-height--small); color:var(--wp--preset--color--body); margin-top:var(--wp--preset--spacing--20); } .sticky,.gallery-caption,.bypostauthor{display:block} /* --- pagination ----------------------------------------------------------- */ .wp-block-query-pagination,.navigation.pagination{ display:flex;gap:var(--wp--preset--spacing--20);flex-wrap:wrap; margin-top:var(--wp--preset--spacing--70); } .navigation.pagination .page-numbers{ display:inline-flex;align-items:center;justify-content:center; min-width:44px;min-height:44px;padding:0 var(--wp--preset--spacing--30); border:1px solid var(--wp--preset--color--green-200); border-radius:var(--wp--custom--radius--pill); color:var(--wp--preset--color--green-700);text-decoration:none; } .navigation.pagination .page-numbers:hover{background:var(--wp--preset--color--green-50)} .navigation.pagination .page-numbers.current{ background:var(--wp--preset--color--green-700);color:#fff; border-color:var(--wp--preset--color--green-700); } /* Focus is never removed anywhere in this design. */ .navigation.pagination .page-numbers:focus-visible{ outline:2px solid var(--wp--preset--color--green-700);outline-offset:2px; } /* --- Elementor containment ------------------------------------------------ Elementor wraps every widget in its own section and container. The design's sections are full-bleed and manage their own .rh-wrap inner width, so those wrappers must not add a second max-width or horizontal padding — that is what makes builder output look subtly narrower than the design. */ .elementor-widget-container > .rh-section, .elementor-widget-container > .rh-hero{margin:0} .elementor-section-full_width > .elementor-container{max-width:none} /* --- the .rh-grid name collision ----------------------------------------- THE CAUSE OF THE WASHED-OUT CARDS. `.rh-grid` is used for two unrelated things in this design: 1. the decorative 44px technical grid backdrop, which carries a radial-gradient mask so it fades out towards the edges, and 2. the card-grid LAYOUT class — `