/* CansOut.AI on Divi 5 - loaded after site.css (shared, unchanged, from the standalone theme).
   The Divi sections, rows, columns and modules carry the standalone site's class names, so site.css
   styles them. This file only neutralises Divi's own defaults where they would win over it, and
   maps the standalone .wrap onto Divi rows. Measured against Divi 5.13's base stylesheet. */

/* Divi's page shell: dark all the way down. Sections are transparent so .section.alt shows. */
body.co, body.co #page-container, body.co #et-main-area, body.co #main-content { background-color: var(--bg); }
body.co #main-content .container::before { display: none; }
:where(.co) .et_pb_section { background-color: transparent; }
/* Divi's global body font weight is 500; the site's body text is 400. */
body.co, .co .et_pb_module.et_pb_module { font-weight: 400; }

/* Divi styles bare headings (#333, 10px padding) and lists (disc, 23px padding, 26px lines).
   Zero-specificity prefix: beats Divi's tag rules by order, loses to every site.css class rule. */
:where(.co) :is(h1, h2, h3, h4, h5, h6) { color: inherit; padding-bottom: 0; }
:where(.co) p { padding-bottom: 0; }
.co .et-l--post .et_pb_module :is(ul, ol) { list-style-type: revert; list-style-position: outside; padding: revert; line-height: 1.6; }
/* Divi's .entry-content table rules (light borders, 9px/24px cells) outrank site.css's .co th/td. */
.co .entry-content table:not(.variations) { border: 0; margin: 0; }
.co .entry-content :is(th, td) { padding: 14px 16px; border-top: 0; }
/* Divi's reset zeroes list margins; browsers give them 1em. Tag-level, so .checks etc. still win. */
:where(.co .et-l--post .et_pb_module) :is(ul, ol) { margin-top: 1em; margin-bottom: 1em; }
/* ...which outranks site.css's own list rules, so those are restated here. */
.co .et-l--post .et_pb_module .checks { list-style: none; padding: 0; }
.co .et-l--post .prose .et_pb_module ul, .co .et-l--post .et_pb_module .prose ul { padding: 0 0 0 1.2em; }
.co .et-l--post .col .et_pb_module ol { list-style: none; margin: 0; padding: 8px 22px 22px; }

/* Divi 5 lays sections, rows and columns out as flex boxes with 60px/30px gaps between children.
   The standalone site stacks blocks and lets their own margins space them. */
.co .et_pb_section.et_flex_section, .co .et_pb_row.et_flex_row:not(.co-grid), .co .et_pb_column.et_flex_column { display: block; }
.co .et_pb_column.et_flex_column.plan { display: flex; flex-direction: column; row-gap: 0; }
.co .et_pb_row.et_flex_row.stats { gap: 0; }

/* Sections: the site.css padding, restated because Divi's customizer CSS loads after site.css. */
.co .et_pb_section.section { padding: clamp(72px, 10vw, 140px) 0; }
.co .et_pb_section.section.tight { padding: clamp(48px, 7vw, 88px) 0; }
.co .et_pb_section.hero { padding: clamp(56px, 9vw, 120px) 0 clamp(64px, 9vw, 110px); }
.co .et_pb_section.page-hero { padding: clamp(56px, 8vw, 104px) 0 clamp(40px, 6vw, 72px); }
.co .et_pb_section.section.co-pt0 { padding-top: 0; }
.co .et_pb_section.et_pb_section.co-plain { padding: 0; }
.co .et_pb_section.hero > .et_pb_row { position: relative; z-index: 1; }

/* Rows are the standalone .wrap: centred, --max wide less the gutters, no Divi padding. */
.co .et_pb_row.et_pb_row { width: calc(100% - 2 * var(--gutter)); max-width: calc(var(--max) - 2 * var(--gutter)); margin: 0 auto; padding: 0; }
.co .et_pb_row.et_pb_row.co-full { width: 100%; max-width: none; }
.co .et_pb_row.et_pb_row.prose { max-width: calc(780px - 2 * var(--gutter)); }
/* Divi clearfixes rows with ::after, which a CSS grid would place as an extra item. */
.co .et_pb_row.co-grid::before, .co .et_pb_row.co-grid::after { content: none; display: none; }
.co .et_pb_row.et_pb_row.cta-band { padding: clamp(40px, 7vw, 80px); }
@media (max-width: 980px) { .co .et_pb_row.et_pb_row.price-grid { max-width: 520px; } }

/* Columns: the row's CSS grid (site.css .grid/.stats/.split ...) places them, not Divi's floats. */
.co .et_pb_row > .et_pb_column { float: none; width: auto !important; margin: 0 !important; z-index: auto; }
.co .et_pb_row:not(.co-grid) > .et_pb_column { width: 100% !important; }

/* Modules: no Divi spacing - the margins belong to the content inside, as on the standalone site. */
.co .et_pb_column .et_pb_module.et_pb_module { margin: 0 !important; padding: 0; }
/* Block, not Divi flex, so margins collapse across module boundaries exactly as between the
   standalone elements. */
.co .et_pb_module.et_flex_module, .co .et_pb_module .et_pb_text_inner, .co .et_pb_module .et_pb_code_inner { display: block; }
/* Unitless like body.co, so it scales with each element's own font size (Divi sets it in px/em). */
.co .et_pb_module.et_pb_module { line-height: 1.6; }
/* Divi writes text-align: start on every Text module; alignment comes from the content (.center). */
.co .et_pb_module.et_pb_text { text-align: inherit; }
.co .et_pb_module .et_pb_text_inner, .co .et_pb_module .et_pb_code_inner { width: 100%; }
/* Absolute badges and ribbons position against the card, not Divi's module wrapper. */
.co .co-grid > .et_pb_column > .et_pb_module, .co .co-grid > .et_pb_column > .et_pb_module > .et_pb_text_inner { position: static; }
/* A plan's feature list takes the spare height (site.css gives .checks flex: 1), so the button
   sits at the bottom of the card. */
.co .co-grid > .plan > .et_pb_module:has(.checks), .co .co-grid > .plan > .et_pb_module:has(.checks) > .et_pb_text_inner { flex: 1; display: flex; flex-direction: column; }
.co .co-grid > .plan > .et_pb_module:last-child { margin-top: auto !important; }

/* The header layout stays on screen while scrolling. */
.co .et-l--header { position: sticky; top: 0; z-index: 60; }
.admin-bar.co .et-l--header { top: 32px; }
@media (max-width: 782px) { .admin-bar.co .et-l--header { top: 46px; } }
.co .co-header .site-header { position: static; }

/* Fallback for the builder canvas, where site.js (which fades .reveal content in) does not run. */
.et-fb .reveal, .et-vb .reveal, .et_fb .reveal, .et-fb-root-ancestor .reveal, .et-vb-root-ancestor .reveal { opacity: 1 !important; transform: none !important; }
