/* ============================================================
   iXBRL.one landing — custom CSS
   Every rule is scoped under .ixbrl-lp so nothing leaks into the
   rest of the GeneratePress site. Colours use MDB CSS variables
   only (--mdb-*), no hard-coded brand hexes except the Excel green.
   Verbatim from ixbrl-lp.html's <style> block, minus the .site-footer
   rules -- those moved to ixbrl-footer.css since the footer is now
   rendered site-wide (footer.php), outside this .ixbrl-lp wrapper.
   ============================================================ */

/* GeneratePress's own Customizer-generated CSS ("Container" layout set to
"One Container") includes ".one-container .container{background-color:var(--base-3)}"
(plain white) -- GP's body carries class .one-container whenever that layout
is selected, and every one of this landing page's 13 section wrappers uses
the same ".container" class name (unrelated meaning: Bootstrap/MDB's grid
container, not GP's). Without this override every section gets an opaque
white box painted over its own intended background the moment someone picks
"One Container" in the Customizer -- found via the exact same collision in
the footer (see ixbrl-footer.css), not something visible in "Separate
Containers" mode, which is why it wasn't caught immediately. Extra specificity
(element + 2 classes, vs GP's 2 classes) so this doesn't depend on stylesheet
load order. */
.ixbrl-lp section .container { background-color: transparent; }

/* vertical rhythm: MDB tops out at py-5; the landing needs a larger section pad */
.ixbrl-lp .py-6 { padding-top: 5.5rem; padding-bottom: 5.5rem; }
@media (max-width: 767.98px) { .ixbrl-lp .py-6 { padding-top: 3rem; padding-bottom: 3rem; } }

/* hatched image placeholder — replace .ph elements with real <img> when art arrives */
.ixbrl-lp .ph { background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.045) 0 8px, rgba(0,0,0,0) 8px 16px); background-color: var(--mdb-gray-100); }

/* connector line between the four "how it works" steps */
.ixbrl-lp .step { position: relative; }
.ixbrl-lp .step::after { content: ""; position: absolute; top: 26px; left: calc(50% + 34px); right: calc(-50% + 34px); height: 2px; background: var(--mdb-primary-border-subtle); }
.ixbrl-lp .step:last-child::after { display: none; }
@media (max-width: 767.98px) { .ixbrl-lp .step::after { display: none; } }

/* comparison table: horizontal scroll at ALL widths with a sticky label column.
   Deliberate deviation from MDB .table-responsive — we also need the sticky
   first column and the subtle-primary "us" column, which stock MDB has no class for. */
.ixbrl-lp .cmp-scroll { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.ixbrl-lp .cmp { border-collapse: separate; border-spacing: 0; min-width: 880px; }
.ixbrl-lp .cmp td, .ixbrl-lp .cmp th { padding: .55rem .75rem; border-bottom: 1px solid var(--mdb-gray-200); }
.ixbrl-lp .cmp thead th { background: #fff; border-bottom: 2px solid var(--mdb-gray-300); vertical-align: bottom; }
.ixbrl-lp .cmp .cmp-first { position: sticky; left: 0; z-index: 2; background: #fff; min-width: 190px; box-shadow: 1px 0 0 var(--mdb-gray-200); }
.ixbrl-lp .cmp tbody tr:hover .cmp-first, .ixbrl-lp .cmp tbody tr:hover td { background: var(--mdb-gray-100); }
.ixbrl-lp .cmp .us { background: var(--mdb-primary-bg-subtle); border-left: 1px solid var(--mdb-primary-border-subtle); border-right: 1px solid var(--mdb-primary-border-subtle); }
.ixbrl-lp .cmp tbody tr:hover td.us { background: var(--mdb-primary-bg-subtle); }
@media (max-width: 991.98px) { .ixbrl-lp .cmp { min-width: 760px; } .ixbrl-lp .cmp .cmp-first { min-width: 150px; } }

/* client logos: greyscale by default, brand colour on hover */
.ixbrl-lp .logo { height: 40px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .65; transition: filter .2s, opacity .2s; }
.ixbrl-lp .logo:hover { filter: grayscale(0); opacity: 1; }
/* Centravis ships as a white-on-dark asset; the file in /logos/ is the recoloured
   dark version, so it only needs the greyscale filter dropped on hover */
.ixbrl-lp .logo[alt="Centravis"]:hover { filter: none; opacity: 1; }
/* Renault's wordmark reads optically smaller than the others at the same height */
.ixbrl-lp .logo[alt="Renault"] { height: 54px; max-width: 180px; }

/* MDB buttons are single-line by default; Ukrainian CTA labels wrap on mobile */
.ixbrl-lp .btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; line-height: 1.3; height: auto; }

/* "first year together, then on your own" sequence rail */
.ixbrl-lp .seq { position: relative; }
/* .ixbrl-lp .seq::before { content: ""; position: absolute; top: 27px; left: 12%; right: 12%; height: 2px; background: linear-gradient(90deg, var(--mdb-primary) 0%, var(--mdb-primary) 55%, var(--mdb-primary-border-subtle) 100%); z-index: 0; }
@media (max-width: 991.98px) { .ixbrl-lp .seq::before { display: none; } } */