/* ========================================================================== 
   GEMINI ASSOCIATES — INDIVIDUAL PILLAR PAGE MOBILE REDESIGN
   --------------------------------------------------------------------------
   These rules intentionally sit after the shared mobile layer. Each page
   keeps its own accent language while using the same compact mobile rhythm.
   ========================================================================== */

@media (max-width: 767.98px) {
    .pillar-page {
        --pillar-ink: #0c1e38;
        --pillar-copy: #52657a;
        --pillar-surface: #ffffff;
        --pillar-soft: #f4f8fb;
        --pillar-accent: #01a2d3;
        --pillar-accent-soft: rgba(1, 162, 211, 0.12);
    }

    /* The shared layer establishes the responsive geometry; this layer gives
       the detail pages a more editorial, left-aligned mobile composition. */
    .pillar-page :is(.semi-hero, .bio-hero, .water-hero, .lab-hero, .mfg-hero, .aroma-hero) .col-lg-7,
    .pillar-page :is(.semi-hero, .bio-hero, .water-hero, .lab-hero, .mfg-hero, .aroma-hero) .col-lg-5 {
        text-align: left !important;
    }

    .pillar-page :is(.semi-hero, .bio-hero, .water-hero, .lab-hero, .mfg-hero, .aroma-hero) .breadcrumb {
        justify-content: flex-start !important;
        text-align: left !important;
    }

    .pillar-page :is(.semi-pill-tag, .bio-pill-tag, .water-pill-tag, .lab-pill-tag, .mfg-pill-tag, .aroma-pill-tag) {
        justify-content: flex-start !important;
        width: fit-content;
        max-width: 100%;
    }

    .pillar-page :is(.semi-hero-title, .bio-hero-title, .water-hero-title, .lab-hero-title, .mfg-hero-title, .aroma-hero-title) {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 23rem;
    }

    .pillar-page :is(.semi-hero-lead, .bio-hero-lead, .water-hero-lead, .lab-hero-lead, .mfg-hero-lead, .aroma-hero-lead) {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 35rem;
    }

    .pillar-page :is(.semi-hero, .bio-hero, .water-hero, .lab-hero, .mfg-hero, .aroma-hero) .d-flex.flex-wrap {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .pillar-page :is(.semi-hero-frame, .bio-hero-frame, .water-hero-frame, .lab-hero-frame, .mfg-hero-frame, .aroma-hero-frame) {
        margin-top: 0.15rem;
        box-shadow: 0 18px 34px rgba(2, 18, 36, 0.32) !important;
    }

    .pillar-page .section-header-wrap {
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .pillar-page .section-eyebrow {
        display: flex !important;
        align-items: center;
        gap: 0.55rem;
        width: 100%;
        text-align: left;
        color: var(--pillar-accent) !important;
    }

    .pillar-page .section-eyebrow::before {
        content: '';
        flex: 0 0 1.75rem;
        height: 2px;
        background: var(--pillar-accent);
        box-shadow: 0 0 10px var(--pillar-accent);
    }

    .pillar-page .section-main-heading,
    .pillar-page .section-lead-text {
        text-align: left !important;
    }

    /* ------------------------------------------------------------------
       Swipe rails: one strong card with a purposeful next-card preview.
       The existing enhancement layer provides the gentle auto-advance.
       ------------------------------------------------------------------ */
    .pillar-page .pillar-auto-rail {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: stretch !important;
        gap: 12px !important;
        margin-inline: -1rem !important;
        width: calc(100% + 2rem) !important;
        max-width: 100vw !important;
        padding: 0.5rem 1rem 1.5rem 1rem !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 1rem !important;
        scroll-behavior: smooth;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .pillar-page .pillar-auto-rail::-webkit-scrollbar {
        display: none !important;
    }

    .pillar-page .pillar-auto-rail > [class*="col-"] {
        flex: 0 0 calc(100vw - 72px) !important;
        width: calc(100vw - 72px) !important;
        max-width: 315px !important;
        min-width: 250px !important;
        padding: 0 !important;
        display: flex !important;
        scroll-snap-align: start;
        align-self: stretch !important;
    }

    .pillar-page .pillar-auto-rail > [class*="col-"] > * {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        padding: 1.25rem !important;
        border-radius: 18px !important;
    }

    /* Universal typography and contrast in pillar sliders */
    .pillar-page .pillar-auto-rail :is(h2, h3, h4, h5) {
        color: #0c1e38 !important;
        font-weight: 700 !important;
        line-height: 1.28 !important;
    }

    .pillar-page .pillar-auto-rail p,
    .pillar-page .pillar-auto-rail li,
    .pillar-page .pillar-auto-rail .text-secondary,
    .pillar-page .pillar-auto-rail .text-muted {
        color: #334155 !important; /* High-contrast readable slate */
        font-size: 0.88rem !important;
        line-height: 1.55 !important;
    }

    .pillar-page .pillar-auto-rail .text-muted.small,
    .pillar-page .pillar-auto-rail small.text-muted {
        color: #475569 !important;
        font-size: 0.8rem !important;
    }

    /* Crystal-clear pill badges */
    .pillar-page .badge.bg-info-subtle,
    .pillar-page .badge.text-info {
        background-color: #e0f2fe !important;
        color: #0369a1 !important;
        border: 1px solid #bae6fd !important;
        font-weight: 700 !important;
    }

    .pillar-page .badge.bg-primary-subtle,
    .pillar-page .badge.text-primary {
        background-color: #dbeafe !important;
        color: #1d4ed8 !important;
        border: 1px solid #bfdbfe !important;
        font-weight: 700 !important;
    }

    .pillar-page .badge.bg-success-subtle,
    .pillar-page .badge.text-success {
        background-color: #dcfce7 !important;
        color: #15803d !important;
        border: 1px solid #bbf7d0 !important;
        font-weight: 700 !important;
    }

    .pillar-page .spec-badge-item {
        background: #f1f5f9 !important;
        color: #0f172a !important;
        border: 1px solid #cbd5e1 !important;
        font-weight: 600 !important;
        font-size: 0.74rem !important;
        padding: 4px 8px !important;
        border-radius: 6px !important;
    }

    .pillar-page code.text-primary {
        color: #0284c7 !important;
        background: #f0f9ff !important;
        padding: 2px 7px !important;
        border-radius: 5px !important;
        border: 1px solid #bae6fd !important;
        font-weight: 700 !important;
    }

    .pillar-page .pillar-auto-rail > [class*="col-"]:last-child {
        margin-right: 1rem !important;
    }

    /* ------------------------------------------------------------------
       Semiconductor / electronics: precise cyan on deep navy.
       ------------------------------------------------------------------ */
    .page-semiconductor-cdmo {
        --pillar-accent: #38bdf8;
        --pillar-accent-soft: rgba(56, 189, 248, 0.13);
    }

    .page-semiconductor-cdmo .semi-hero {
        background: linear-gradient(160deg, #061120 0%, #0a223c 58%, #063f5e 100%) !important;
    }

    .page-semiconductor-cdmo .semi-pill-tag,
    .page-semiconductor-cdmo .portfolio-card,
    .page-semiconductor-cdmo .stage-card {
        border-color: rgba(56, 189, 248, 0.32) !important;
    }

    .page-semiconductor-cdmo .overview-card,
    .page-semiconductor-cdmo .portfolio-card,
    .page-semiconductor-cdmo .stage-card {
        background: #ffffff;
        box-shadow: 0 10px 26px rgba(8, 30, 55, 0.08);
    }

    .page-semiconductor-cdmo .overview-icon-box {
        background: rgba(56, 189, 248, 0.12) !important;
        color: #0369a1 !important;
    }

    /* ------------------------------------------------------------------
       Green chemistry: softer green surfaces and a cleaner organic rhythm.
       ------------------------------------------------------------------ */
    .page-green-bio-chemistry {
        --pillar-accent: #059669;
        --pillar-accent-soft: rgba(5, 150, 105, 0.13);
    }

    /* Contrast pass: use deeper greens on light surfaces and brighter mint
       text only where it sits on the dark hero/contact backgrounds. */
    .page-green-bio-chemistry .section-eyebrow {
        color: #047857 !important;
    }

    .page-green-bio-chemistry .section-eyebrow::before {
        background: #047857;
        box-shadow: 0 0 8px rgba(4, 120, 87, 0.35);
    }

    .page-green-bio-chemistry .bio-hero .btn-primary {
        background: #047857 !important;
        border-color: #047857 !important;
        color: #ffffff !important;
    }

    .page-green-bio-chemistry :is(.bio-cat-card, .intro-card, .app-card, .resource-box) .text-success,
    .page-green-bio-chemistry :is(.bio-cat-card, .intro-card, .app-card, .resource-box) .text-success-emphasis {
        color: #047857 !important;
    }

    .page-green-bio-chemistry :is(.bio-cat-card, .intro-card, .app-card, .resource-box) .text-muted,
    .page-green-bio-chemistry :is(.bio-cat-card, .intro-card, .app-card, .resource-box) .text-secondary {
        color: #475569 !important;
    }

    .page-green-bio-chemistry .feedstock-tag {
        color: #065f46 !important;
        background: #d1fae5 !important;
        border-color: #6ee7b7 !important;
    }

    .page-green-bio-chemistry .spec-badge-item {
        color: #334155 !important;
        background: #f1f5f9 !important;
        border-color: #cbd5e1 !important;
    }

    .page-green-bio-chemistry .matrix-green-alt {
        color: #047857 !important;
    }

    .page-green-bio-chemistry #drop-in-alternatives .btn-outline-success {
        color: #047857 !important;
        border-color: #047857 !important;
    }

    .page-green-bio-chemistry #enquiry-form .enquiry-header-bar .bg-success {
        color: #a7f3d0 !important;
        background: rgba(16, 185, 129, 0.2) !important;
        border-color: #6ee7b7 !important;
    }

    .page-green-bio-chemistry #enquiry-form .contact-info-panel .text-white-50 {
        color: #d1fae5 !important;
    }

    .page-green-bio-chemistry #enquiry-form .enquiry-header-bar .text-white-50 {
        color: #d1fae5 !important;
    }

    .page-green-bio-chemistry #enquiry-form .contact-item-link {
        color: #a7f3d0 !important;
    }

    .page-green-bio-chemistry .bio-hero {
        background: linear-gradient(160deg, #031b14 0%, #064e3b 62%, #0b3040 100%) !important;
    }

    .page-green-bio-chemistry .bio-hero-title br {
        display: none;
    }

    .page-green-bio-chemistry .bio-hero-glow-1 {
        width: 330px;
        height: 330px;
        top: -90px;
        right: -120px;
        opacity: 0.24;
    }

    .page-green-bio-chemistry .bio-hero-glow-2 {
        width: 260px;
        height: 260px;
        bottom: -80px;
        left: -130px;
        opacity: 0.2;
    }

    .page-green-bio-chemistry .bio-frame-overlay-badge {
        background: rgba(2, 36, 25, 0.92) !important;
        border-color: rgba(110, 231, 183, 0.42) !important;
    }

    .page-green-bio-chemistry .bio-stats-strip {
        background: #031b14 !important;
    }

    .page-green-bio-chemistry .bio-stat-val {
        letter-spacing: -0.01em;
    }

    .page-green-bio-chemistry .intro-card {
        position: relative;
        overflow: hidden;
        border-color: #d1fae5 !important;
        background: linear-gradient(145deg, #ffffff 0%, #f4fdf8 100%) !important;
    }

    .page-green-bio-chemistry .intro-card::after {
        content: '';
        position: absolute;
        right: -2rem;
        bottom: -2rem;
        width: 7rem;
        height: 7rem;
        border-radius: 50%;
        background: rgba(52, 211, 153, 0.09);
        pointer-events: none;
    }

    .page-green-bio-chemistry .scientific-rigor-box {
        margin-top: 1.35rem !important;
        padding: 1.1rem 1rem !important;
        border-left-width: 4px !important;
        border-radius: 14px !important;
    }

    .page-green-bio-chemistry .scientific-rigor-title {
        align-items: flex-start;
        font-size: 1.05rem;
        line-height: 1.3;
    }

    .page-green-bio-chemistry .scientific-rigor-text {
        font-size: 0.87rem;
        line-height: 1.55;
    }

    .page-green-bio-chemistry .bio-cat-card,
    .page-green-bio-chemistry .app-card {
        padding: 0 !important;
        border-top: 3px solid #10b981 !important;
        background: linear-gradient(180deg, #ffffff 0%, #f1fcf7 100%);
    }

    .page-green-bio-chemistry .bio-cat-header,
    .page-green-bio-chemistry .app-card-content {
        padding: 1.15rem !important;
    }

    .page-green-bio-chemistry .bio-cat-header {
        background: linear-gradient(145deg, #ecfdf5 0%, #ffffff 78%) !important;
        border-bottom-color: #d1fae5 !important;
    }

    .page-green-bio-chemistry .bio-cat-body {
        padding: 1.15rem !important;
    }

    .page-green-bio-chemistry .bio-cat-body ul {
        padding-left: 1.15rem !important;
    }

    .page-green-bio-chemistry .feedstock-tag,
    .page-green-bio-chemistry .spec-badge-item {
        font-size: 0.72rem !important;
        line-height: 1.25;
    }

    .page-green-bio-chemistry .matrix-wrapper {
        margin: 0 !important;
        border-color: #bbf7d0 !important;
        border-radius: 16px !important;
        box-shadow: 0 10px 24px rgba(6, 78, 59, 0.08) !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }

    .page-green-bio-chemistry .matrix-table {
        min-width: 760px !important;
    }

    .page-green-bio-chemistry .matrix-table th {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 0.75rem 0.8rem !important;
        font-size: 0.7rem !important;
    }

    .page-green-bio-chemistry .matrix-table td {
        padding: 0.75rem 0.8rem !important;
        font-size: 0.78rem !important;
    }

    /* Turn the six-column desktop matrix into readable comparison cards on
       phones. This removes the sideways hunt across tiny table cells. */
    .page-green-bio-chemistry .matrix-wrapper {
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .page-green-bio-chemistry .matrix-table {
        display: block;
        min-width: 0 !important;
        width: 100% !important;
        border-spacing: 0;
    }

    .page-green-bio-chemistry .matrix-table thead {
        display: none;
    }

    .page-green-bio-chemistry .matrix-table tbody {
        display: grid;
        gap: 0.85rem;
    }

    .page-green-bio-chemistry .matrix-table tr {
        display: block;
        padding: 0.8rem 0.9rem;
        border: 1px solid #bbf7d0;
        border-radius: 16px;
        background: #ffffff;
        box-shadow: 0 8px 20px rgba(6, 78, 59, 0.07);
    }

    .page-green-bio-chemistry .matrix-table td {
        display: block;
        width: 100%;
        padding: 0.65rem 0 !important;
        border-bottom: 1px solid #ecfdf5 !important;
        color: #334155 !important;
        line-height: 1.4;
    }

    .page-green-bio-chemistry .matrix-table td:last-child {
        border-bottom: 0 !important;
    }

    .page-green-bio-chemistry .matrix-table td::before {
        display: block;
        margin-bottom: 0.25rem;
        color: #047857;
        font-size: 0.63rem;
        font-weight: 800;
        letter-spacing: 0.055em;
        line-height: 1.35;
        text-transform: uppercase;
    }

    .page-green-bio-chemistry .matrix-table td:nth-child(1)::before { content: 'Conventional'; }
    .page-green-bio-chemistry .matrix-table td:nth-child(2)::before { content: 'Greener alternative'; }
    .page-green-bio-chemistry .matrix-table td:nth-child(3)::before { content: 'Feedstock'; }
    .page-green-bio-chemistry .matrix-table td:nth-child(4)::before { content: 'Performance'; }
    .page-green-bio-chemistry .matrix-table td:nth-child(5)::before { content: 'Solubility fit'; }
    .page-green-bio-chemistry .matrix-table td:nth-child(6)::before { content: 'Engineering note'; }

    .page-green-bio-chemistry .matrix-table td > * {
        min-width: 0;
    }

    .page-green-bio-chemistry .matrix-table .badge {
        justify-self: start;
        white-space: normal;
        line-height: 1.25;
        text-align: left;
    }

    .page-green-bio-chemistry .matrix-conventional,
    .page-green-bio-chemistry .matrix-green-alt {
        line-height: 1.3;
    }

    .page-green-bio-chemistry #drop-in-alternatives .btn {
        width: 100%;
        min-height: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        white-space: normal;
    }

    .page-green-bio-chemistry .app-card-img {
        height: 160px !important;
    }

    .page-green-bio-chemistry .app-card-content {
        min-height: 205px;
    }

    .page-green-bio-chemistry .resource-box {
        height: 100%;
        padding: 1.15rem !important;
        border: 1px solid #d1fae5 !important;
        border-top: 3px solid #34d399 !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 8px 22px rgba(6, 78, 59, 0.07) !important;
    }

    .page-green-bio-chemistry #technical-resources .resource-box p {
        color: #52657a !important;
    }

    .page-green-bio-chemistry #enquiry-form .enquiry-header-bar {
        background: linear-gradient(145deg, #04251b 0%, #086044 100%) !important;
    }

    .page-green-bio-chemistry #enquiry-form .enquiry-header-bar h2 {
        font-size: 1.35rem !important;
        line-height: 1.2 !important;
    }

    .page-green-bio-chemistry #enquiry-form .contact-info-panel {
        min-height: auto;
        padding: 1.2rem !important;
        border-radius: 16px !important;
        background: linear-gradient(145deg, #064e3b 0%, #0c1e38 100%) !important;
    }

    .page-green-bio-chemistry #enquiry-form .contact-item-link {
        display: inline-block;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .page-green-bio-chemistry .matrix-table-card,
    .page-green-bio-chemistry .matrix-table {
        border-color: rgba(5, 150, 105, 0.2) !important;
    }

    /* ------------------------------------------------------------------
       Ultrapure water: icy surfaces, strong search/catalogue hierarchy.
       ------------------------------------------------------------------ */
    .page-speciality-ultrapure-waters {
        --pillar-accent: #0284c7;
        --pillar-accent-soft: rgba(2, 132, 199, 0.12);
    }

    .page-speciality-ultrapure-waters .water-hero {
        background: linear-gradient(160deg, #041321 0%, #0a2b4d 58%, #075b78 100%) !important;
    }

    .page-speciality-ultrapure-waters .catalogue-toolbar {
        position: sticky;
        top: calc(var(--ga-header-h, 70px) + 0.5rem);
        z-index: 3;
        background: rgba(255, 255, 255, 0.96) !important;
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 8px 20px rgba(14, 116, 144, 0.1) !important;
    }

    .page-speciality-ultrapure-waters .catalogue-table-card {
        border: 1px solid #bae6fd !important;
        background: #f8fdff !important;
        padding: 0.55rem !important;
    }

    .page-speciality-ultrapure-waters .btn-enquire-item {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
    }

    /* ------------------------------------------------------------------
       Laboratory: cool slate cards with a clear analytical workflow.
       ------------------------------------------------------------------ */
    .page-laboratory-testing-facilities {
        --pillar-accent: #0284c7;
        --pillar-accent-soft: rgba(2, 132, 199, 0.12);
    }

    .page-laboratory-testing-facilities .lab-hero {
        background: linear-gradient(160deg, #071526 0%, #0c2b4b 58%, #075985 100%) !important;
    }

    .page-laboratory-testing-facilities .about-val-card,
    .page-laboratory-testing-facilities .expertise-card,
    .page-laboratory-testing-facilities .process-step-card,
    .page-laboratory-testing-facilities .equip-card,
    .page-laboratory-testing-facilities .industry-card {
        border-left: 3px solid #38bdf8 !important;
        background: #ffffff;
    }

    .page-laboratory-testing-facilities .process-step-num {
        background: #e0f2fe !important;
        color: #0369a1 !important;
    }

    /* ------------------------------------------------------------------
       Manufacturing: amber/cyan operational cards and compact process flow.
       ------------------------------------------------------------------ */
    .page-accelerated-manufacturing {
        --pillar-accent: #0284c7;
        --pillar-accent-soft: rgba(2, 132, 199, 0.12);
    }

    .page-accelerated-manufacturing .mfg-hero {
        background: linear-gradient(160deg, #071526 0%, #12304b 62%, #075985 100%) !important;
    }

    .page-accelerated-manufacturing .service-card,
    .page-accelerated-manufacturing .process-step-card,
    .page-accelerated-manufacturing .doc-card,
    .page-accelerated-manufacturing .logistics-card,
    .page-accelerated-manufacturing .industry-card {
        border-top: 3px solid #38bdf8 !important;
        background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%);
    }

    .page-accelerated-manufacturing .service-card-header {
        background: rgba(224, 242, 254, 0.7) !important;
    }

    /* ------------------------------------------------------------------
       Fragrance: warmer rose accent, softer cards and a more premium feel.
       ------------------------------------------------------------------ */
    .page-fragrance-specialities {
        --pillar-accent: #be185d;
        --pillar-accent-soft: rgba(190, 24, 93, 0.11);
    }

    .page-fragrance-specialities .aroma-hero {
        background: linear-gradient(160deg, #220b1a 0%, #5b173d 58%, #7c2d5e 100%) !important;
    }

    .page-fragrance-specialities .aroma-val-card,
    .page-fragrance-specialities .ingredient-card,
    .page-fragrance-specialities .app-card,
    .page-fragrance-specialities .quality-support-box {
        border-top: 3px solid #f472b6 !important;
        background: linear-gradient(180deg, #ffffff 0%, #fff7fb 100%);
    }

    .page-fragrance-specialities .ingredient-badge-pill {
        display: inline-flex;
        max-width: 100%;
        line-height: 1.3;
        white-space: normal;
        background: #fdf2f8 !important;
        border-color: #f9a8d4 !important;
        color: #9d174d !important;
    }

    .page-fragrance-specialities .aroma-stat-val {
        color: #fbcfe8 !important;
    }

    @media (max-width: 380px) {
        .pillar-page .pillar-auto-rail > [class*="col-"] {
            flex: 0 0 calc(100vw - 64px) !important;
            width: calc(100vw - 64px) !important;
            max-width: 290px !important;
        }
    }
}