/* * Aureole Intelligence — component patterns. * Extracted from landing-pages-claude-2026-05-09/seo.html and legal-services.html * (the approved HTML reference set). * * Loaded after style.css so design tokens (var(--navy), var(--serif), etc.) resolve. * * Subagents building landing pages: each ====== section below is one composable * pattern — read the usage comment, then apply the class via GB block * `globalClasses` or `className`. Never redeclare the CSS inline. */ /* ============================================================ FULL-WIDTH PAGE LAYOUT — !important guards GP main.min.css and GP customizer inline each set padding/max-width on the page wrappers (`.site-content { padding: 40px }`, `.site.grid-container { max-width: 1200px }`), and our own `.container` rule from style.css adds `max-width: 1240px` and side-padding to anything with `.container` class — including the page wrapper `
`. All these pillarbox our sections. !important is needed to definitively neutralise the cascade so sections run flush to the viewport. Inner section content is still constrained by the inner `
` that each section provides — that keeps the 1240px reading width. ============================================================ */ html, body { margin: 0 !important; padding: 0 !important; } body .site, body .site.grid-container, body .site.grid-container.container, #page, #page.grid-container, #page.container { max-width: 100% !important; padding: 0 !important; margin: 0 !important; width: 100% !important; } /* Zero-out only the GP wrappers (page-level
, content area, entry- content). DO NOT match every
— our cards (.engagement-card, .approach-card, .pattern-card, .value-card, .why-card) are
elements too, and a broad `body article` selector here was zeroing out their padding sitewide. */ body .site-content, body .site-main, body .site-content > .content-area, body .content-area, body article.page, body article.post, body article.page > .entry-content, body article.post > .entry-content, body .entry-content, body div.inside-article, body .inside-article { margin: 0 !important; padding: 0 !important; max-width: none !important; } body article.page > .entry-content > section, body article.page > .entry-content > .alignfull, body article.page > .entry-content > div, body article.post > .entry-content > section, body article.post > .entry-content > .alignfull, body article.post > .entry-content > div { max-width: 100% !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } /* GP renders an empty `
` wrapper before our chrome `