/**
 * Content Blocks Block
 * CSS for flexible content block with multiple layouts:
 * - Fill Screen: Full-width content with centered text
 * - Blocky Section: Two-column layout with optional column reversal
 * - Block Row Columns: Grid layout with customizable columns
 * 
 * @package Salient
 * @since 1.0
 */

/* ==========================================================================
   BLOCK CONTAINER & LAYOUT
   ========================================================================== */

.content-blocks {
    position: relative;
    z-index: 1;
}

/* Fill Screen Layout */
.content-blocks.fill-screen {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.content-blocks.fill-screen .content-block-inner {
    border-radius: 0;
}

.content-blocks .content-block-inner {
    position: relative;
    overflow: hidden;
    padding: 60px 0 !important;
}

.content-blocks .page-container {
    position: relative;
    z-index: 2;
}

/* ==========================================================================
   TYPOGRAPHY SYSTEM - APERFEIÇOADO
   ========================================================================== */

/* Base typography for content blocks */
.content-blocks {
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    line-height: 1.5em;
}


/* Headings - APERFEIÇOADO com margins para separação */
.content-blocks h1,
.content-blocks h2,
.content-blocks h3,
.content-blocks h4,
.content-blocks h5,
.content-blocks h6 {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 0 24px 0 !important;
    letter-spacing: -0.02em !important;
}

.content-blocks h1 {
    font-size: 36px !important;
    line-height: 1.1 !important;
    margin: 0 0 32px 0 !important;
}

.content-blocks h2 {
    font-size: 32px !important;
    line-height: 1.15 !important;
    margin: 0 0 28px 0 !important;
}

.content-blocks h3 {
    font-size: 28px !important;
    line-height: 1.2 !important;
    margin: 0 0 24px 0 !important;
}

.content-blocks h4 {
    font-size: 24px !important;
    line-height: 1.25 !important;
    margin: 0 0 20px 0 !important;
}

.content-blocks h5 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin: 0 0 18px 0 !important;
}

.content-blocks h6 {
    font-size: 18px !important;
    line-height: 1.35 !important;
    margin: 0 0 16px 0 !important;
}

/* Paragraphs - APERFEIÇOADO */
.content-blocks p {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
    margin: 0 0 20px 0 !important;
}

.content-blocks p:last-child {
    margin-bottom: 0 !important;
}

/* Lists - APERFEIÇOADO */
.content-blocks ul,
.content-blocks ol {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
    margin: 0 0 24px 0 !important;
    padding-left: 28px !important;
}

.content-blocks ul {
    list-style-type: disc !important;
}

.content-blocks ol {
    list-style-type: decimal !important;
}

.content-blocks li {
    margin-bottom: 12px !important;
}

.content-blocks li:last-child {
    margin-bottom: 0 !important;
}

/* Lists alignment fix for centered content */
.content-blocks .text-center ul,
.content-blocks .text-center ol {
    display: inline-block !important;
    text-align: left !important;
    padding-left: 0 !important;
    list-style-position: inside !important;
}

.content-blocks .text-center ul {
    list-style-type: disc !important;
}

.content-blocks .text-center ol {
    list-style-type: decimal !important;
}

.content-blocks .text-center li {
    text-align: left !important;
}

/* Responsive list alignment */
@media (max-width: 767px) {
    .content-blocks .text-center ul,
    .content-blocks .text-center ol {
        display: block !important;
        text-align: center !important;
        padding-left: 28px !important;
        list-style-position: outside !important;
    }
    
    .content-blocks .text-center li {
        text-align: center !important;
    }
}

/* Text center content alignment */
.content-blocks .text-center {
    text-align: center !important;
}

.content-blocks .text-center p {
    text-align: center !important;
}

.content-blocks .text-center h1,
.content-blocks .text-center h2,
.content-blocks .text-center h3,
.content-blocks .text-center h4,
.content-blocks .text-center h5,
.content-blocks .text-center h6 {
    text-align: center !important;
}

.content-blocks .text-center blockquote {
    text-align: center !important;
}

.content-blocks .text-center blockquote p {
    text-align: center !important;
}

.content-blocks .text-center table {
    margin-left: auto !important;
    margin-right: auto !important;
}

.content-blocks .text-center figure {
    text-align: center !important;
}

.content-blocks .text-center figcaption {
    text-align: center !important;
}

/* Links - APERFEIÇOADO */
.content-blocks a {
    color: #42bcfc !important;
    text-decoration: underline !important;
    transition: color 0.3s ease !important;
    font-weight: 500 !important;
}

.content-blocks a:hover {
    color: #1b1d21 !important;
    text-decoration: none !important;
}

/* Strong and Bold - APERFEIÇOADO */
.content-blocks strong,
.content-blocks b {
    font-weight: 700 !important;
}

/* Emphasis - APERFEIÇOADO */
.content-blocks em,
.content-blocks i {
    font-style: italic !important;
}

/* Definition Lists - APERFEIÇOADO */
.content-blocks dl {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
    margin: 0 0 24px 0 !important;
}

.content-blocks dt {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin: 0 0 8px 0 !important;
}

.content-blocks dd {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
    margin: 0 0 16px 0 !important;
    padding-left: 20px !important;
}

.content-blocks dd:last-child {
    margin-bottom: 0 !important;
}

/* ==========================================================================
   TABLES, CODE & QUOTES - APERFEIÇOADO
   ========================================================================== */

/* Tables - APERFEIÇOADO */
.content-blocks table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 24px 0 !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
}

.content-blocks table th,
.content-blocks table td {
    padding: 12px 16px !important;
    text-align: left !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    vertical-align: top !important;
}

.content-blocks table th {
    background-color: rgba(0, 0, 0, 0.05) !important;
    font-weight: 700 !important;
    font-family: 'Poppins', sans-serif !important;
}

.content-blocks table tr:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.content-blocks table tr:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

/* Responsive table wrapper */
.content-blocks .table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    margin: 0 0 24px 0 !important;
}

.content-blocks .table-responsive table {
    margin: 0 !important;
    min-width: 600px !important;
}

/* Code - APERFEIÇOADO */
.content-blocks code {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    font-size: 16px !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.content-blocks pre {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    font-size: 16px !important;
    line-height: 1.5em !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    padding: 20px !important;
    border-radius: 8px !important;
    margin: 0 0 24px 0 !important;
    overflow-x: auto !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.content-blocks pre code {
    background-color: transparent !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
}

/* Blockquotes - APERFEIÇOADO */
.content-blocks blockquote {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 18px !important;
    line-height: 1.5em !important;
    font-style: italic !important;
    margin: 0 0 24px 0 !important;
    padding: 20px 24px !important;
    border-left: 4px solid #42bcfc !important;
    background-color: rgba(66, 188, 252, 0.05) !important;
    border-radius: 0 8px 8px 0 !important;
}

.content-blocks blockquote p {
    margin: 0 0 12px 0 !important;
}

.content-blocks blockquote p:last-child {
    margin-bottom: 0 !important;
}

.content-blocks blockquote cite {
    font-style: normal !important;
    font-size: 16px !important;
    color: rgba(0, 0, 0, 0.6) !important;
    display: block !important;
    margin-top: 12px !important;
}

/* Inline quotes */
.content-blocks q {
    font-style: italic !important;
}

.content-blocks q::before {
    content: '"' !important;
}

.content-blocks q::after {
    content: '"' !important;
}

/* ==========================================================================
   ADDITIONAL HTML ELEMENTS - APERFEIÇOADO
   ========================================================================== */

/* Underline - APERFEIÇOADO */
.content-blocks u {
    text-decoration: underline !important;
}

/* Horizontal Rule - APERFEIÇOADO */
.content-blocks hr {
    border: none !important;
    height: 1px !important;
    background-color: rgba(0, 0, 0, 0.1) !important;
    margin: 32px 0 !important;
}

/* Images & Figures - APERFEIÇOADO */
.content-blocks img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
    margin: 16px 0 !important;
    display: block !important;
}

.content-blocks figure {
    margin: 24px 0 !important;
    text-align: center !important;
}

.content-blocks figure img {
    margin: 0 0 12px 0 !important;
}

.content-blocks figcaption {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    color: rgba(0, 0, 0, 0.6) !important;
    font-style: italic !important;
    margin-top: 8px !important;
}

/* Small text */
.content-blocks small {
    font-size: 14px !important;
}

/* Marked text */
.content-blocks mark {
    background-color: rgba(255, 255, 0, 0.3) !important;
    padding: 2px 4px !important;
    border-radius: 2px !important;
}

/* Deleted text */
.content-blocks del {
    text-decoration: line-through !important;
    color: rgba(0, 0, 0, 0.5) !important;
}

/* Inserted text */
.content-blocks ins {
    text-decoration: underline !important;
}

/* Subscript and Superscript */
.content-blocks sub {
    font-size: 75% !important;
    line-height: 0 !important;
    position: relative !important;
    vertical-align: baseline !important;
    bottom: -0.25em !important;
}

.content-blocks sup {
    font-size: 75% !important;
    line-height: 0 !important;
    position: relative !important;
    vertical-align: baseline !important;
    top: -0.5em !important;
}

/* Abbreviations */
.content-blocks abbr {
    border-bottom: 1px dotted rgba(0, 0, 0, 0.5) !important;
    cursor: help !important;
}

/* Address */
.content-blocks address {
    font-style: italic !important;
    margin: 0 0 24px 0 !important;
}

/* Time */
.content-blocks var {
    font-style: italic !important;
}

/* Sample output */
.content-blocks samp {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    padding: 2px 4px !important;
    border-radius: 3px !important;
}

/* Keyboard input */
.content-blocks kbd {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    background-color: rgba(0, 0, 0, 0.1) !important;
    border: 1px solid rgba(0, 0, 0, 0.2) !important;
    border-radius: 3px !important;
    padding: 2px 6px !important;
    font-size: 14px !important;
}

/* ==========================================================================
   FILL SCREEN LAYOUT
   ========================================================================== */

.content-blocks .font-brushes {
    font-family: 'Brushes', cursive !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

.content-blocks .font-brushes.text-\[48px\] {
    font-size: 48px !important;
}

.content-blocks .font-brushes.lg\:text-\[64px\] {
    font-size: 64px !important;
}

.content-blocks .font-brushes.leading-none {
    line-height: 1 !important;
}

.content-blocks .font-brushes.font-normal {
    font-weight: 400 !important;
}


.content-blocks .font-brushes.mb-4 {
    margin-bottom: 16px !important;
}

/* Fill Screen Title */
.content-blocks .font-poppins.text-\[40px\] {
    font-size: 40px !important;
}

.content-blocks .font-poppins.md\:text-\[45px\] {
    font-size: 45px !important;
}

.content-blocks .font-poppins.xl\:text-\[64px\] {
    font-size: 64px !important;
}

.content-blocks .font-poppins.leading-none {
    line-height: 1 !important;
}

.content-blocks .font-poppins.font-extrabold {
    font-weight: 800 !important;
}

.content-blocks .font-poppins.text-text-white {
    color: #ffffff !important;
}

.content-blocks .font-poppins.mb-6 {
    margin-bottom: 24px !important;
}

/* Fill Screen Content */
.content-blocks .font-openSans {
    font-family: 'Open Sans', sans-serif !important;
}

.content-blocks .font-openSans.text-text-white {
    color: #ffffff !important;
}

.content-blocks .font-openSans.text-\[16px\] {
    font-size: 16px !important;
}

.content-blocks .font-openSans.md\:text-\[18px\] {
    font-size: 18px !important;
}

.content-blocks .font-openSans.xl\:text-\[18px\] {
    font-size: 18px !important;
}

.content-blocks .font-openSans.leading-\[1\.4\] {
    line-height: 1.4 !important;
}

.content-blocks .font-openSans.font-normal {
    font-weight: 400 !important;
}

.content-blocks .font-openSans.mb-3 {
    margin-bottom: 12px !important;
}

.content-blocks .font-openSans.px-4 {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.content-blocks .font-openSans.lg\:px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ==========================================================================
   BLOCKY SECTION LAYOUT
   ========================================================================== */

/* Column reversal */
.content-blocks.colrev .order-1 {
    order: 2 !important;
}

.content-blocks.colrev .order-2 {
    order: 1 !important;
}

/* Content Column */
.content-blocks .w-full.lg\:w-1\/2 {
    width: 100% !important;
}

@media (min-width: 1024px) {
    .content-blocks .w-full.lg\:w-1\/2 {
        width: 50% !important;
    }
}

.content-blocks .flex.flex-col.lg\:flex-row {
    display: flex !important;
    flex-direction: column !important;
}

@media (min-width: 1024px) {
    .content-blocks .flex.flex-col.lg\:flex-row {
        flex-direction: row !important;
    }
}

.content-blocks .gap-20 {
    gap: 80px !important;
}

.content-blocks .xl\:gap-\[120px\] {
    gap: 120px !important;
}

/* Text alignment */
.content-blocks .text-center.lg\:text-left {
    text-align: center !important;
}

@media (min-width: 1024px) {
    .content-blocks .text-center.lg\:text-left {
        text-align: left !important;
    }
}

.content-blocks .items-center.lg\:items-start {
    align-items: center !important;
}

@media (min-width: 1024px) {
    .content-blocks .items-center.lg\:items-start {
        align-items: flex-start !important;
    }
}

/* ==========================================================================
   BLOCK ROW COLUMNS LAYOUT
   ========================================================================== */

.content-blocks .cb-grid {
    position: relative;
    z-index: 2;
}

/* Grid Container */
.content-blocks .grid.grid-cols-1 {
    display: grid !important;
    grid-template-columns: 1fr !important;
}

.content-blocks .grid.sm\:grid-cols-2 {
    grid-template-columns: repeat(2, 1fr) !important;
}

.content-blocks .grid.lg\:grid-cols-2 {
    grid-template-columns: repeat(2, 1fr) !important;
}

.content-blocks .grid.lg\:grid-cols-3 {
    grid-template-columns: repeat(3, 1fr) !important;
}

.content-blocks .grid.lg\:grid-cols-4 {
    grid-template-columns: repeat(4, 1fr) !important;
}

.content-blocks .grid.gap-5 {
    gap: 20px !important;
}

/* Content Block Cards */
.content-blocks .content-block-card {
    background: #ffffff !important;
    border-radius: 30px !important;
    padding: 20px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 200px !important;
}

.content-blocks .content-block-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

.content-blocks .content-block-card.p-5 {
    padding: 20px !important;
}

.content-blocks .content-block-card.xl\:p-\[30px\] {
    padding: 30px !important;
}

.content-blocks .content-block-card.rounded-\[30px\] {
    border-radius: 30px !important;
}

.content-blocks .content-block-card.bg-white {
    background: #ffffff !important;
}

/* Card Typography */
.content-blocks .content-block-card .font-poppins.text-\[24px\] {
    font-size: 24px !important;
}

.content-blocks .content-block-card .font-poppins.font-bold {
    font-weight: 700 !important;
}

.content-blocks .content-block-card .font-poppins.mb-3 {
    margin-bottom: 12px !important;
}

.content-blocks .content-block-card .font-poppins.text-\[18px\] {
    font-size: 18px !important;
}

.content-blocks .content-block-card .font-poppins.mb-4 {
    margin-bottom: 16px !important;
}

/* ==========================================================================
   CTA BUTTONS
   ========================================================================== */

.content-blocks .abtn {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.content-blocks .abtn.flex.justify-center {
    justify-content: center !important;
}

.content-blocks .abtn.flex.mt-auto {
    margin-top: auto !important;
}

/* Button Styles */
.content-blocks .abtn a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 20px !important;
    border-radius: 20px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    font-family: 'Poppins', sans-serif !important;
}

.content-blocks .abtn a.border-1px-white {
    border: 1px solid #ffffff !important;
    background: transparent !important;
    color: #ffffff !important;
}

.content-blocks .abtn a.bg-dark-blue {
    background: #1b1d21 !important;
    color: #ffffff !important;
}

.content-blocks .abtn a:hover {
    opacity: 0.8 !important;
    transform: translateY(-1px) !important;
}

.content-blocks .abtn a .font-poppins.text-\[18px\] {
    font-size: 18px !important;
}

.content-blocks .abtn a .font-poppins.md\:text-\[20px\] {
    font-size: 20px !important;
}

.content-blocks .abtn a .font-poppins.leading-none {
    line-height: 1 !important;
}

.content-blocks .abtn a .font-poppins.font-semibold {
    font-weight: 600 !important;
}

.content-blocks .abtn a .font-poppins.text-text-white {
    color: #ffffff !important;
}

/* ==========================================================================
   BACKGROUND COLOR SCHEMES
   ========================================================================== */

/* Dark backgrounds - white text */
.content-blocks .content-block-inner[style*="background-color: #0F2027"],
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h1,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h2,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h3,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h4,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h5,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] h6,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] p,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] ul,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] ol,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] li,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] strong,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] b,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] em,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] i,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] blockquote,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] code,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] pre,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] table,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] th,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] td,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] dl,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] dt,
.content-blocks .content-block-inner[style*="background-color: #0F2027"] dd {
    color: #ffffff !important;
}

.content-blocks .content-block-inner[style*="background-color: #1B71B6"],
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h1,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h2,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h3,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h4,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h5,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] h6,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] p,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] ul,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] ol,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] li,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] strong,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] b,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] em,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] i,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] blockquote,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] code,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] pre,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] table,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] th,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] td,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] dl,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] dt,
.content-blocks .content-block-inner[style*="background-color: #1B71B6"] dd {
    color: #ffffff !important;
}

.content-blocks .content-block-inner[style*="background-color: #24A7D9"],
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h1,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h2,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h3,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h4,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h5,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] h6,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] p,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] ul,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] ol,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] li,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] strong,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] b,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] em,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] i,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] blockquote,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] code,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] pre,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] table,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] th,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] td,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] dl,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] dt,
.content-blocks .content-block-inner[style*="background-color: #24A7D9"] dd {
    color: #ffffff !important;
}

/* Transparent background - dark text */

.content-blocks .content-block-inner[style*="background-color: transparent"],
.content-blocks .content-block-inner[style*="background-color: transparent"] h1,
.content-blocks .content-block-inner[style*="background-color: transparent"] h2,
.content-blocks .content-block-inner[style*="background-color: transparent"] h3,
.content-blocks .content-block-inner[style*="background-color: transparent"] h4,
.content-blocks .content-block-inner[style*="background-color: transparent"] h5,
.content-blocks .content-block-inner[style*="background-color: transparent"] h6,
.content-blocks .content-block-inner[style*="background-color: transparent"] p,
.content-blocks .content-block-inner[style*="background-color: transparent"] ul,
.content-blocks .content-block-inner[style*="background-color: transparent"] ol,
.content-blocks .content-block-inner[style*="background-color: transparent"] li,
.content-blocks .content-block-inner[style*="background-color: transparent"] strong,
.content-blocks .content-block-inner[style*="background-color: transparent"] b,
.content-blocks .content-block-inner[style*="background-color: transparent"] em,
.content-blocks .content-block-inner[style*="background-color: transparent"] i,
.content-blocks .content-block-inner[style*="background-color: transparent"] blockquote,
.content-blocks .content-block-inner[style*="background-color: transparent"] code,
.content-blocks .content-block-inner[style*="background-color: transparent"] pre,
.content-blocks .content-block-inner[style*="background-color: transparent"] table,
.content-blocks .content-block-inner[style*="background-color: transparent"] th,
.content-blocks .content-block-inner[style*="background-color: transparent"] td,
.content-blocks .content-block-inner[style*="background-color: transparent"] dl,
.content-blocks .content-block-inner[style*="background-color: transparent"] dt,
.content-blocks .content-block-inner[style*="background-color: transparent"] dd {
    color: #1b1d21 !important;
}

/* White background - dark text */
.content-blocks .content-block-inner[style*="background-color: #ffffff"],
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h1,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h2,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h3,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h4,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h5,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] h6,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] p,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] ul,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] ol,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] li,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] strong,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] b,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] em,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] i,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] blockquote,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] code,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] pre,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] table,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] th,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] td,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] dl,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] dt,
.content-blocks .content-block-inner[style*="background-color: #ffffff"] dd {
    color: #1b1d21 !important;
}

/* ==========================================================================
   CARD BACKGROUND COLOR ADAPTATION SYSTEM
   ========================================================================== */

/* Cards with white background - always dark text regardless of section background */
.content-blocks .content-block-card.bg-white,
.content-blocks .content-block-card.bg-white .shared-rich-text,
.content-blocks .content-block-card.bg-white p,
.content-blocks .content-block-card.bg-white h1,
.content-blocks .content-block-card.bg-white h2,
.content-blocks .content-block-card.bg-white h3,
.content-blocks .content-block-card.bg-white h4,
.content-blocks .content-block-card.bg-white h5,
.content-blocks .content-block-card.bg-white h6,
.content-blocks .content-block-card.bg-white ul,
.content-blocks .content-block-card.bg-white ol,
.content-blocks .content-block-card.bg-white li,
.content-blocks .content-block-card.bg-white strong,
.content-blocks .content-block-card.bg-white b,
.content-blocks .content-block-card.bg-white em,
.content-blocks .content-block-card.bg-white i,
.content-blocks .content-block-card.bg-white blockquote,
.content-blocks .content-block-card.bg-white code,
.content-blocks .content-block-card.bg-white pre,
.content-blocks .content-block-card.bg-white table,
.content-blocks .content-block-card.bg-white th,
.content-blocks .content-block-card.bg-white td,
.content-blocks .content-block-card.bg-white dl,
.content-blocks .content-block-card.bg-white dt,
.content-blocks .content-block-card.bg-white dd,
.content-blocks .content-block-card.bg-white a {
    color: #1b1d21 !important;
}

/* Cards with other background colors */
.content-blocks .content-block-card.bg-gray-100,
.content-blocks .content-block-card.bg-gray-100 .shared-rich-text,
.content-blocks .content-block-card.bg-gray-100 p,
.content-blocks .content-block-card.bg-gray-100 h1,
.content-blocks .content-block-card.bg-gray-100 h2,
.content-blocks .content-block-card.bg-gray-100 h3,
.content-blocks .content-block-card.bg-gray-100 h4,
.content-blocks .content-block-card.bg-gray-100 h5,
.content-blocks .content-block-card.bg-gray-100 h6,
.content-blocks .content-block-card.bg-gray-100 ul,
.content-blocks .content-block-card.bg-gray-100 ol,
.content-blocks .content-block-card.bg-gray-100 li,
.content-blocks .content-block-card.bg-gray-100 strong,
.content-blocks .content-block-card.bg-gray-100 b,
.content-blocks .content-block-card.bg-gray-100 em,
.content-blocks .content-block-card.bg-gray-100 i,
.content-blocks .content-block-card.bg-gray-100 blockquote,
.content-blocks .content-block-card.bg-gray-100 code,
.content-blocks .content-block-card.bg-gray-100 pre,
.content-blocks .content-block-card.bg-gray-100 table,
.content-blocks .content-block-card.bg-gray-100 th,
.content-blocks .content-block-card.bg-gray-100 td,
.content-blocks .content-block-card.bg-gray-100 dl,
.content-blocks .content-block-card.bg-gray-100 dt,
.content-blocks .content-block-card.bg-gray-100 dd,
.content-blocks .content-block-card.bg-gray-100 a {
    color: #1b1d21 !important;
}

/* Cards with dark backgrounds */
.content-blocks .content-block-card.bg-gray-800,
.content-blocks .content-block-card.bg-gray-800 .shared-rich-text,
.content-blocks .content-block-card.bg-gray-800 p,
.content-blocks .content-block-card.bg-gray-800 h1,
.content-blocks .content-block-card.bg-gray-800 h2,
.content-blocks .content-block-card.bg-gray-800 h3,
.content-blocks .content-block-card.bg-gray-800 h4,
.content-blocks .content-block-card.bg-gray-800 h5,
.content-blocks .content-block-card.bg-gray-800 h6,
.content-blocks .content-block-card.bg-gray-800 ul,
.content-blocks .content-block-card.bg-gray-800 ol,
.content-blocks .content-block-card.bg-gray-800 li,
.content-blocks .content-block-card.bg-gray-800 strong,
.content-blocks .content-block-card.bg-gray-800 b,
.content-blocks .content-block-card.bg-gray-800 em,
.content-blocks .content-block-card.bg-gray-800 i,
.content-blocks .content-block-card.bg-gray-800 blockquote,
.content-blocks .content-block-card.bg-gray-800 code,
.content-blocks .content-block-card.bg-gray-800 pre,
.content-blocks .content-block-card.bg-gray-800 table,
.content-blocks .content-block-card.bg-gray-800 th,
.content-blocks .content-block-card.bg-gray-800 td,
.content-blocks .content-block-card.bg-gray-800 dl,
.content-blocks .content-block-card.bg-gray-800 dt,
.content-blocks .content-block-card.bg-gray-800 dd,
.content-blocks .content-block-card.bg-gray-800 a {
    color: #ffffff !important;
}

.content-blocks .content-block-card.bg-gray-900,
.content-blocks .content-block-card.bg-gray-900 .shared-rich-text,
.content-blocks .content-block-card.bg-gray-900 p,
.content-blocks .content-block-card.bg-gray-900 h1,
.content-blocks .content-block-card.bg-gray-900 h2,
.content-blocks .content-block-card.bg-gray-900 h3,
.content-blocks .content-block-card.bg-gray-900 h4,
.content-blocks .content-block-card.bg-gray-900 h5,
.content-blocks .content-block-card.bg-gray-900 h6,
.content-blocks .content-block-card.bg-gray-900 ul,
.content-blocks .content-block-card.bg-gray-900 ol,
.content-blocks .content-block-card.bg-gray-900 li,
.content-blocks .content-block-card.bg-gray-900 strong,
.content-blocks .content-block-card.bg-gray-900 b,
.content-blocks .content-block-card.bg-gray-900 em,
.content-blocks .content-block-card.bg-gray-900 i,
.content-blocks .content-block-card.bg-gray-900 blockquote,
.content-blocks .content-block-card.bg-gray-900 code,
.content-blocks .content-block-card.bg-gray-900 pre,
.content-blocks .content-block-card.bg-gray-900 table,
.content-blocks .content-block-card.bg-gray-900 th,
.content-blocks .content-block-card.bg-gray-900 td,
.content-blocks .content-block-card.bg-gray-900 dl,
.content-blocks .content-block-card.bg-gray-900 dt,
.content-blocks .content-block-card.bg-gray-900 dd,
.content-blocks .content-block-card.bg-gray-900 a {
    color: #ffffff !important;
}

.content-blocks a.bg-dark-blue,
.content-blocks a.bg-dark-blue span{
    color: #ffffff !important;
}
/* ==========================================================================
   BACKGROUND IMAGE
   ========================================================================== */

.content-blocks .bannimfull {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
}

.content-blocks .bannimfull.rounded-\[30px\] {
    border-radius: 30px !important;
}

.content-blocks .bannimfull img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 30px !important;
}

/* ==========================================================================
   RESPONSIVE DESIGN
   ========================================================================== */

/* Large screens (xl) */
@media (min-width: 1280px) {
    .content-blocks .content-block-inner {
        padding: 80px 0 !important;
    }
    
    .content-blocks .font-brushes.text-\[48px\].lg\:text-\[64px\] {
        font-size: 64px !important;
    }
    
    .content-blocks .font-poppins.text-\[40px\].md\:text-\[45px\].xl\:text-\[64px\] {
        font-size: 64px !important;
    }
    
    .content-blocks .font-openSans.text-\[16px\].md\:text-\[18px\].xl\:text-\[18px\] {
        font-size: 18px !important;
    }
    
    .content-blocks .content-block-card.p-5.xl\:p-\[30px\] {
        padding: 30px !important;
    }
    
    /* XL table adjustments */
    .content-blocks table {
        font-size: 20px !important;
    }
    
    .content-blocks table th,
    .content-blocks table td {
        padding: 16px 20px !important;
    }
    
    .content-blocks pre {
        padding: 24px !important;
        font-size: 18px !important;
    }
    
    .content-blocks code {
        font-size: 18px !important;
    }
    
    .content-blocks blockquote {
        padding: 24px 28px !important;
        font-size: 20px !important;
    }
    
    /* XL definition list adjustments */
    .content-blocks dl {
        font-size: 20px !important;
    }
    
    .content-blocks dt {
        font-size: 20px !important;
    }
    
    .content-blocks dd {
        font-size: 20px !important;
    }
    
    /* XL additional elements adjustments */
    .content-blocks figcaption {
        font-size: 18px !important;
    }
    
    .content-blocks small {
        font-size: 16px !important;
    }
    
    .content-blocks kbd {
        font-size: 16px !important;
    }
}

/* Large screens (lg) */
@media (min-width: 1024px) {
    .content-blocks .font-brushes.text-\[48px\].lg\:text-\[64px\] {
        font-size: 64px !important;
    }
    
    .content-blocks .font-poppins.text-\[40px\].md\:text-\[45px\].xl\:text-\[64px\] {
        font-size: 45px !important;
    }
    
    .content-blocks .font-openSans.text-\[16px\].md\:text-\[18px\].xl\:text-\[18px\] {
        font-size: 18px !important;
    }
    
    .content-blocks .font-openSans.px-4.lg\:px-0 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Medium screens (md) */
@media (min-width: 768px) {
    .content-blocks .font-brushes.text-\[48px\].lg\:text-\[64px\] {
        font-size: 48px !important;
    }
    
    .content-blocks .font-poppins.text-\[40px\].md\:text-\[45px\].xl\:text-\[64px\] {
        font-size: 45px !important;
    }
    
    .content-blocks .font-openSans.text-\[16px\].md\:text-\[18px\].xl\:text-\[18px\] {
        font-size: 18px !important;
    }
    
    .content-blocks .abtn a .font-poppins.text-\[18px\].md\:text-\[20px\] {
        font-size: 20px !important;
    }
}

/* Small screens (sm) */
@media (min-width: 640px) {
    .content-blocks .grid.sm\:grid-cols-2 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .content-blocks .content-block-inner {
        padding: 40px 0 !important;
    }
    
    .content-blocks .font-brushes.text-\[48px\].lg\:text-\[64px\] {
        font-size: 36px !important;
    }
    
    .content-blocks .font-poppins.text-\[40px\].md\:text-\[45px\].xl\:text-\[64px\] {
        font-size: 32px !important;
    }
    
    .content-blocks .font-openSans.text-\[16px\].md\:text-\[18px\].xl\:text-\[18px\] {
        font-size: 16px !important;
    }
    
    .content-blocks .content-block-card {
        min-height: 180px !important;
        padding: 16px !important;
    }
    
    .content-blocks .grid.gap-5 {
        gap: 16px !important;
    }
    
    /* Mobile table adjustments */
    .content-blocks table {
        font-size: 16px !important;
    }
    
    .content-blocks table th,
    .content-blocks table td {
        padding: 8px 12px !important;
    }
    
    .content-blocks pre {
        padding: 16px !important;
        font-size: 14px !important;
    }
    
    .content-blocks code {
        font-size: 14px !important;
    }
    
    .content-blocks blockquote {
        padding: 16px 20px !important;
        font-size: 16px !important;
    }
    
    /* Mobile definition list adjustments */
    .content-blocks dl {
        font-size: 16px !important;
    }
    
    .content-blocks dt {
        font-size: 16px !important;
    }
    
    .content-blocks dd {
        font-size: 16px !important;
        padding-left: 16px !important;
    }
    
    /* Mobile additional elements adjustments */
    .content-blocks figcaption {
        font-size: 14px !important;
    }
    
    .content-blocks small {
        font-size: 12px !important;
    }
    
    .content-blocks kbd {
        font-size: 12px !important;
    }
    
    .content-blocks hr {
        margin: 24px 0 !important;
    }
}

@media (max-width: 480px) {
    .content-blocks .content-block-inner {
        padding: 30px 0 !important;
    }
    
    .content-blocks .font-brushes.text-\[48px\].lg\:text-\[64px\] {
        font-size: 28px !important;
    }
    
    .content-blocks .font-poppins.text-\[40px\].md\:text-\[45px\].xl\:text-\[64px\] {
        font-size: 24px !important;
    }
    
    .content-blocks .font-openSans.text-\[16px\].md\:text-\[18px\].xl\:text-\[18px\] {
        font-size: 14px !important;
    }
    
    .content-blocks .content-block-card {
        min-height: 160px !important;
        padding: 12px !important;
    }
    
    .content-blocks .grid.gap-5 {
        gap: 12px !important;
    }
    
    /* Small mobile table adjustments */
    .content-blocks table {
        font-size: 14px !important;
    }
    
    .content-blocks table th,
    .content-blocks table td {
        padding: 6px 8px !important;
    }
    
    .content-blocks pre {
        padding: 12px !important;
        font-size: 12px !important;
    }
    
    .content-blocks code {
        font-size: 12px !important;
    }
    
    .content-blocks blockquote {
        padding: 12px 16px !important;
        font-size: 14px !important;
    }
    
    /* Small mobile definition list adjustments */
    .content-blocks dl {
        font-size: 14px !important;
    }
    
    .content-blocks dt {
        font-size: 14px !important;
    }
    
    .content-blocks dd {
        font-size: 14px !important;
        padding-left: 12px !important;
    }
    
    /* Small mobile additional elements adjustments */
    .content-blocks figcaption {
        font-size: 12px !important;
    }
    
    .content-blocks small {
        font-size: 10px !important;
    }
    
    .content-blocks kbd {
        font-size: 10px !important;
    }
    
    .content-blocks hr {
        margin: 20px 0 !important;
    }
}

/* ==========================================================================
   ACCESSIBILITY & PERFORMANCE
   ========================================================================== */

/* Focus states */
.content-blocks .abtn a:focus {
    outline: 2px solid #42bcfc !important;
    outline-offset: 2px !important;
}

.content-blocks .content-block-card:focus-within {
    outline: 2px solid #42bcfc !important;
    outline-offset: 2px !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .content-blocks .content-block-card,
    .content-blocks .abtn a {
        transition: none !important;
    }
    
    .content-blocks .content-block-card:hover {
        transform: none !important;
    }
}

/* High contrast mode */
@media (prefers-contrast: high) {
    .content-blocks .content-block-card {
        border: 2px solid #000000 !important;
    }
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
    .content-blocks .content-block-card {
        border: 1px solid #000000 !important;
        break-inside: avoid !important;
    }
    
    .content-blocks .abtn {
        display: none !important;
    }
    
    .content-blocks .bannimfull {
        display: none !important;
    }
}