/* ==========================================================
   AI-CRIMS TECHNOLOGY — FINAL LAYOUT FIX
   Scoped ONLY to #technology
   Fixes the 3-column desktop layout and prevents cards
   from collapsing into the left column.
========================================================== */

#technology.technology {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;
    min-height: 760px !important;
    padding: 52px 0 105px !important;
    background:
        radial-gradient(circle at 46% 48%, rgba(62, 151, 255, .13), transparent 29%),
        radial-gradient(circle at 83% 43%, rgba(125, 72, 255, .11), transparent 31%),
        linear-gradient(135deg, #f7fbff 0%, #eef6ff 52%, #f9fbff 100%) !important;
}

/* IMPORTANT: restore the intended 3-column structure */
#technology.technology > .container.technology-shell {
    width: min(100% - 40px, 1280px) !important;
    max-width: 1280px !important;
    margin: 0 auto !important;

    display: grid !important;
    grid-template-columns:
        minmax(330px, .90fr)
        minmax(330px, .90fr)
        minmax(500px, 1.42fr) !important;

    grid-template-rows: auto auto !important;
    column-gap: 24px !important;
    row-gap: 14px !important;
    align-items: center !important;
}

/* LEFT */
#technology .technology-intro {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 0 35px 8px !important;
    text-align: left !important;
    align-self: center !important;
}

/* Make sure old section-heading rules cannot affect this section */
#technology .technology-intro h2 {
    margin: 0 !important;
    max-width: 460px !important;
    font-size: clamp(48px, 4.1vw, 64px) !important;
    line-height: .98 !important;
    letter-spacing: -.045em !important;
    font-weight: 800 !important;
    color: #08265a !important;
}

#technology .tech-kicker {
    margin: 15px 0 8px !important;
}

#technology .tech-description {
    max-width: 430px !important;
    margin: 24px 0 !important;
}

/* CENTER ILLUSTRATION */
#technology .technology-illustration-wrap {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 540px !important;
    height: 100% !important;
    display: grid !important;
    place-items: center !important;
    align-self: center !important;
    padding: 0 !important;
}

#technology .technology-illustration {
    width: min(100%, 520px) !important;
    max-width: 520px !important;
    max-height: 560px !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
    filter: drop-shadow(0 26px 35px rgba(37, 91, 190, .18)) !important;
}

#technology .technology-illustration-glow {
    position: absolute !important;
    width: 390px !important;
    height: 390px !important;
    border-radius: 50% !important;
    background: radial-gradient(
        circle,
        rgba(47, 149, 255, .25),
        rgba(112, 72, 255, .10) 43%,
        transparent 72%
    ) !important;
    filter: blur(5px) !important;
    z-index: 0 !important;
}

/* RIGHT STACK */
#technology .technology-methods {
    grid-column: 3 !important;
    grid-row: 1 / span 2 !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;

    align-self: center !important;
    justify-self: stretch !important;
}

/* CARD — the original HTML uses method-icon/method-copy/method-number */
#technology .tech-method-card {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 110px !important;

    display: grid !important;
    grid-template-columns: 92px minmax(0, 1fr) 52px 12px !important;
    align-items: center !important;
    gap: 15px !important;

    padding: 13px 17px 13px 17px !important;
    overflow: hidden !important;

    border: 1px solid rgba(150, 178, 224, .22) !important;
    border-left: 6px solid var(--accent) !important;
    border-radius: 22px !important;

    background: rgba(255, 255, 255, .84) !important;
    box-shadow:
        0 13px 32px rgba(60, 106, 176, .10),
        inset 0 1px 0 rgba(255, 255, 255, .9) !important;

    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
}

#technology .tech-method-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(
        110deg,
        var(--wash),
        transparent 45%
    ) !important;
}

#technology .method-blue {
    --accent: #148cff !important;
    --wash: rgba(20, 140, 255, .07) !important;
}

#technology .method-purple {
    --accent: #673bff !important;
    --wash: rgba(103, 59, 255, .07) !important;
}

#technology .method-green {
    --accent: #16bd91 !important;
    --wash: rgba(22, 189, 145, .07) !important;
}

#technology .method-pink {
    --accent: #cf3ce3 !important;
    --wash: rgba(207, 60, 227, .07) !important;
}

/* ICON FIX */
#technology .tech-method-card .method-icon {
    position: relative !important;
    z-index: 2 !important;
    width: 78px !important;
    height: 78px !important;
    min-width: 78px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 20px !important;
    color: var(--accent) !important;
    background: var(--wash) !important;
    font-size: 29px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

#technology .tech-method-card.method-green .method-icon {
    font-size: 18px !important;
    letter-spacing: -.04em !important;
}

/* TEXT FIX */
#technology .tech-method-card .method-copy {
    position: relative !important;
    z-index: 2 !important;
    min-width: 0 !important;
    width: auto !important;
}

#technology .tech-method-card .method-copy h3 {
    margin: 0 0 6px !important;
    color: #0a2d65 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
}

#technology .tech-method-card .method-copy p {
    margin: 0 !important;
    color: #607aa8 !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    max-width: none !important;
}

/* NUMBER + ARROW */
#technology .tech-method-card .method-number {
    position: relative !important;
    z-index: 2 !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    color: var(--accent) !important;
    background: var(--wash) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

#technology .tech-method-card .method-arrow {
    position: relative !important;
    z-index: 2 !important;
    color: var(--accent) !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

/* AI PROCESS */
#technology .ai-process-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 112px !important;

    padding: 13px 17px 15px !important;

    border: 1px solid rgba(141, 176, 229, .22) !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,.78) !important;
    box-shadow:
        0 14px 34px rgba(52,101,180,.10),
        inset 0 1px 0 rgba(255,255,255,.9) !important;

    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
}

#technology .ai-process-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-bottom: 11px !important;
}

#technology .ai-process-heading .process-icon {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 12px !important;
    color: #fff !important;
    background: linear-gradient(135deg, #168cff, #4f4bed) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

#technology .ai-process-heading strong {
    flex: 1 !important;
    color: #0b2d67 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

#technology .ai-process-heading a {
    color: #7690bd !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

#technology .ai-process-flow {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
}

#technology .ai-process-flow .flow-pill {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    height: 43px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 8px 7px !important;
    border-radius: 16px !important;
    font-size: 9px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

#technology .flow-blue { color:#2859bf !important; background:#edf5ff !important; }
#technology .flow-purple { color:#5a35d7 !important; background:#f0ecff !important; }
#technology .flow-green { color:#0ba27e !important; background:#e8faf5 !important; }
#technology .flow-pink { color:#aa24c6 !important; background:#faeaff !important; }

#technology .flow-result {
    color: #fff !important;
    background: linear-gradient(100deg, #155ff0, #3c48e8) !important;
    box-shadow: 0 9px 20px rgba(50,83,228,.22) !important;
}

#technology .ai-process-flow .flow-chevron {
    flex: 0 0 auto !important;
    color: #75a0df !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

/* BACKGROUND DECOR */
#technology .technology-orb,
#technology .technology-dots {
    pointer-events: none !important;
}

#technology .technology-orb-a {
    width: 330px !important;
    height: 330px !important;
    left: -150px !important;
    top: -145px !important;
}

#technology .technology-orb-b {
    width: 420px !important;
    height: 420px !important;
    right: -240px !important;
    bottom: -260px !important;
}

/* BOTTOM DARK CURVE */
#technology .technology-bottom-strip {
    position: absolute !important;
    left: -4% !important;
    right: -4% !important;
    bottom: -52px !important;
    width: 108% !important;
    height: 125px !important;
    border-radius: 50% 50% 0 0 / 36% 36% 0 0 !important;
    background: #06265c !important;
    z-index: 1 !important;
}

/* ==========================================================
   TABLET
========================================================== */
@media (max-width: 1200px) {
    #technology.technology > .container.technology-shell {
        grid-template-columns:
            minmax(300px, .88fr)
            minmax(280px, .78fr)
            minmax(430px, 1.20fr) !important;
        column-gap: 15px !important;
    }

    #technology .technology-intro h2 {
        font-size: 48px !important;
    }

    #technology .tech-method-card {
        grid-template-columns: 72px minmax(0, 1fr) 48px 10px !important;
        gap: 10px !important;
    }

    #technology .tech-method-card .method-icon {
        width: 66px !important;
        height: 66px !important;
        min-width: 66px !important;
    }
}

@media (max-width: 980px) {
    #technology.technology {
        min-height: auto !important;
        padding-bottom: 105px !important;
    }

    #technology.technology > .container.technology-shell {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto auto auto !important;
        row-gap: 28px !important;
    }

    #technology .technology-intro {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
        max-width: 760px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
    }

    #technology .technology-intro h2 {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #technology .tech-description,
    #technology .tech-highlights {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #technology .tech-actions {
        justify-content: center !important;
    }

    #technology .technology-illustration-wrap {
        grid-column: 1 !important;
        grid-row: 2 !important;
        min-height: 400px !important;
    }

    #technology .technology-methods {
        grid-column: 2 !important;
        grid-row: 2 / span 2 !important;
    }
}

@media (max-width: 680px) {
    #technology.technology {
        padding: 42px 0 100px !important;
    }

    #technology.technology > .container.technology-shell {
        width: calc(100% - 32px) !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto !important;
    }

    #technology .technology-intro,
    #technology .technology-illustration-wrap,
    #technology .technology-methods {
        grid-column: 1 !important;
        grid-row: auto !important;
    }

    #technology .technology-intro h2 {
        font-size: clamp(40px, 12vw, 58px) !important;
    }

    #technology .technology-illustration-wrap {
        min-height: 310px !important;
    }

    #technology .technology-illustration {
        width: min(92%, 420px) !important;
    }

    #technology .tech-method-card {
        min-height: 105px !important;
        grid-template-columns: 62px minmax(0,1fr) 42px 8px !important;
        gap: 9px !important;
    }

    #technology .tech-method-card .method-icon {
        width: 58px !important;
        height: 58px !important;
        min-width: 58px !important;
        border-radius: 16px !important;
    }

    #technology .tech-method-card .method-copy h3 {
        font-size: 13px !important;
    }

    #technology .tech-method-card .method-copy p {
        font-size: 11px !important;
    }

    #technology .tech-method-card .method-number {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        font-size: 13px !important;
    }

    #technology .ai-process-flow {
        overflow-x: auto !important;
        padding-bottom: 3px !important;
    }

    #technology .ai-process-flow .flow-pill {
        flex: 0 0 112px !important;
    }

    #technology .technology-bottom-strip {
        height: 80px !important;
        bottom: -38px !important;
    }
}
/* =========================================================
   TECHNOLOGY SECTION — SIZE ENHANCEMENT ONLY
   Keep the current layout, just make everything larger.
   ========================================================= */

#technology {
    min-height: 760px !important;
    padding: 55px 0 75px !important;
    overflow: hidden !important;
}

/* Main technology container */
#technology .technology-container,
#technology .tech-container,
#technology .technology-inner {
    width: min(1500px, 94%) !important;
    max-width: 1500px !important;
    margin: 0 auto !important;
}

/* If the section uses a generic content wrapper */
#technology > .container {
    width: min(1500px, 94%) !important;
    max-width: 1500px !important;
}

/* LEFT SIDE */
#technology .tech-content,
#technology .technology-content,
#technology .tech-left {
    transform: scale(1.08);
    transform-origin: left center;
}

/* Badge */
#technology .tech-badge,
#technology .technology-badge {
    font-size: 14px !important;
    padding: 11px 20px !important;
}

/* Technology Stack */
#technology .tech-label,
#technology .technology-label {
    font-size: 15px !important;
    letter-spacing: 5px !important;
    margin-bottom: 12px !important;
}

/* Main heading */
#technology h1,
#technology .tech-title,
#technology .technology-title {
    font-size: clamp(54px, 4.2vw, 76px) !important;
    line-height: 0.98 !important;
    letter-spacing: -2.5px !important;
    margin-bottom: 22px !important;
}

/* Description */
#technology .tech-description,
#technology .technology-description,
#technology p {
    font-size: 16px !important;
    line-height: 1.65 !important;
    max-width: 470px !important;
}

/* Feature indicators */
#technology .tech-features,
#technology .technology-features {
    gap: 22px !important;
    margin-top: 28px !important;
}

#technology .tech-feature,
#technology .technology-feature {
    min-width: 90px !important;
}

#technology .tech-feature-icon,
#technology .feature-icon {
    width: 58px !important;
    height: 58px !important;
    font-size: 22px !important;
}

#technology .tech-feature span,
#technology .technology-feature span {
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* CTA buttons */
#technology .tech-actions,
#technology .technology-actions {
    margin-top: 30px !important;
}

#technology .tech-actions a,
#technology .technology-actions a,
#technology .tech-button {
    min-height: 52px !important;
    padding: 0 24px !important;
    font-size: 14px !important;
}

/* CENTER AI ILLUSTRATION */
#technology .tech-visual,
#technology .technology-visual,
#technology .tech-image {
    transform: scale(1.12) !important;
    transform-origin: center center !important;
}

/* Make actual illustration larger */
#technology .tech-visual img,
#technology .technology-visual img,
#technology .tech-image img {
    width: 100% !important;
    max-width: 470px !important;
}

/* RIGHT CARDS */
#technology .tech-cards,
#technology .technology-cards,
#technology .tech-right {
    gap: 14px !important;
}

/* Individual cards */
#technology .tech-card,
#technology .technology-card {
    min-height: 102px !important;
    padding: 15px 20px !important;
    border-radius: 20px !important;
}

/* Card icon */
#technology .tech-card-icon,
#technology .technology-card-icon {
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    border-radius: 18px !important;
    font-size: 23px !important;
}

/* Card title */
#technology .tech-card h3,
#technology .technology-card h3 {
    font-size: 15px !important;
    margin-bottom: 5px !important;
}

/* Card description */
#technology .tech-card p,
#technology .technology-card p {
    font-size: 13px !important;
    line-height: 1.45 !important;
}

/* Number circles */
#technology .tech-card-number,
#technology .technology-card-number {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    font-size: 15px !important;
}

/* Arrow */
#technology .tech-card-arrow,
#technology .technology-card-arrow {
    font-size: 18px !important;
    margin-left: 8px !important;
}

/* AI PROCESS */
#technology .ai-process,
#technology .tech-process,
#technology .technology-process {
    min-height: 105px !important;
    padding: 17px 20px !important;
    border-radius: 20px !important;
    margin-top: 14px !important;
}

#technology .ai-process h3,
#technology .tech-process h3 {
    font-size: 16px !important;
}

/* Process items */
#technology .process-item,
#technology .ai-process-item {
    min-height: 45px !important;
    padding: 10px 16px !important;
    border-radius: 22px !important;
    font-size: 12px !important;
}

/* FINAL SCORE */
#technology .similarity-score,
#technology .score-item {
    min-width: 115px !important;
    min-height: 48px !important;
    font-size: 12px !important;
}

/* =========================================================
   LARGE DESKTOP — 1440px+
   ========================================================= */

@media (min-width: 1440px) {

    #technology {
        min-height: 800px !important;
    }

    #technology .technology-container,
    #technology .tech-container,
    #technology .technology-inner,
    #technology > .container {
        width: min(1540px, 94%) !important;
        max-width: 1540px !important;
    }

    #technology h1,
    #technology .tech-title,
    #technology .technology-title {
        font-size: 78px !important;
    }

    #technology .tech-visual img,
    #technology .technology-visual img,
    #technology .tech-image img {
        max-width: 520px !important;
    }

    #technology .tech-card,
    #technology .technology-card {
        min-height: 110px !important;
        padding: 17px 22px !important;
    }
}

/* =========================================================
   TABLET / SMALL SCREEN
   ========================================================= */

@media (max-width: 1100px) {

    #technology .tech-content,
    #technology .technology-content,
    #technology .tech-left {
        transform: none !important;
    }

    #technology .tech-visual,
    #technology .technology-visual,
    #technology .tech-image {
        transform: scale(1) !important;
    }

    #technology h1,
    #technology .tech-title,
    #technology .technology-title {
        font-size: 52px !important;
    }
}

@media (max-width: 768px) {

    #technology {
        min-height: auto !important;
        padding: 45px 20px 60px !important;
    }

    #technology h1,
    #technology .tech-title,
    #technology .technology-title {
        font-size: 46px !important;
        letter-spacing: -1.5px !important;
    }

    #technology .tech-visual img,
    #technology .technology-visual img,
    #technology .tech-image img {
        max-width: 400px !important;
    }

    #technology .tech-card,
    #technology .technology-card {
        min-height: 100px !important;
    }
}