/* Last section of every page (home page #inquiry look, 2026-10-29): a white band holding one rounded maroon card with soft red glows,
   a dot grid and a deep shadow. Add class "final-card" to the page's last <section> (its direct child .container becomes the card).
   Content is untouched; only background and shape change. Text inside is white, #ff0000 is kept for accents. */
html body section.final-card:not(#_) { position: relative; overflow: visible; background: #fff; background-image: none; padding-top: 50px; padding-bottom: 50px; color: #fff; }
html body section.final-card:not(#_)::before, html body section.final-card:not(#_)::after { content: none; display: none; }
html body section.final-card:not(#_) > .container { position: relative; overflow: clip; box-sizing: border-box; width: calc(100% - 24px); max-width: 1476px; margin-inline: auto; padding: clamp(28px, 3.4vw, 52px); border-radius: 26px; background: #470000; box-shadow: 0 26px 60px rgba(71, 0, 0, .28); color: #fff; }
html body section.final-card:not(#_) > .container::before { content: ""; display: block; position: absolute; right: -90px; top: -330px; left: auto; bottom: auto; width: 560px; height: 560px; border-radius: 50%; background: rgba(255, 0, 0, .1); pointer-events: none; }
html body section.final-card:not(#_) > .container::after { content: ""; display: block; position: absolute; left: 34%; bottom: -400px; right: auto; top: auto; width: 620px; height: 620px; border-radius: 50%; background: rgba(255, 0, 0, .1); pointer-events: none; clear: none; }
html body section.final-card:not(#_) > .container > * { position: relative; z-index: 1; }
html body section.final-card:not(#_) :is(h1, h2, h3, h4, p, li, span, strong, a:not(.alive-btn):not(.hp-more)) { color: inherit; }
html body section.final-card:not(#_) :is(h2, .final-card__title) { color: #fff; }
/* dot grid accent like the home page contact box */
html body section.final-card:not(#_) > .container > :first-child::after { content: ""; position: absolute; left: -10px; bottom: -22px; z-index: -1; width: 130px; height: 110px; background-image: radial-gradient(#ff0000 1.6px, transparent 1.8px); background-size: 16px 16px; opacity: .6; pointer-events: none; }
@media (max-width: 575px) { html body section.final-card:not(#_) { padding-top: 36px; padding-bottom: 36px; } html body section.final-card:not(#_) > .container { width: calc(100% - 24px); border-radius: 20px; padding: 24px 18px; } }
/* arrow glyphs inside circles stay white even in white inner cards (the span colour rule above would make them inherit the card text colour) */
html body section.final-card.final-card:not(#_) :is(.hp-more__ic, .alive-btn:not(.alive-btn--onred) .icon) { color: #fff; }
