/* ============================================================
   LEADING EDGE CLOUD — COMMON RESPONSIVE SYSTEM
   Loaded LAST. This file is structural; page-specific visual
   styling remains in style.css / site.css / platform.css.
   Minimum font-size introduced here: 12px.
   ============================================================ */

:root {
    --cr-max: 1180px;
    --cr-platform-max: 1280px;
    --cr-gutter: 20px;
    --cr-mobile-gutter: 16px;
    --cr-line: #e2e8f0;
}

/* =========================================
   MOBILE HERO PRODUCT FIX
   ========================================= */
@media (max-width: 768px) {

    .hero-product {
        width: 100%;
        height: auto;
        min-height: 0;
        margin: 20px 0 0;
        padding: 0;
        display: block;
    }

    .hero-monitor-screen {
        width: 100%;
        height: auto;
        min-height: 0;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .hero-monitor-screen img {
        display: block;
        width: 100%;
        height: auto;
        max-height: none;
        margin: 0;
        padding: 0;
        object-fit: contain;
    }
}
/* ---------- HARD BASELINE ---------- */
html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    overflow-x: hidden;
}

main,
section,
article,
header,
footer,
nav,
aside,
div,
ul,
ol,
li,
form,
fieldset {
    min-width: 0;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}

img,
svg,
video {
    height: auto;
}

iframe {
    border: 0;
}

button,
input,
select,
textarea {
    max-width: 100%;
    font: inherit;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

a,
p,
h1,
h2,
h3,
h4,
h5,
h6,
span,
strong,
small,
label {
    overflow-wrap: anywhere;
}

/* Do not let decorative absolute objects create a horizontal page. */
.hero,
.hero-product,
.platform-hero,
.page-hero,
.resources-hero,
.cs-hero,
.kc-hero,
.gp-hero,
.insight-hero,
.hospital-hero,
.hotel-hero,
.school-hero,
.farm-hero {
    max-width: 100%;
}

/* ---------- COMMON CONTAINERS ---------- */
.container,
.site-container,
.section-container,
.resources-wrap,
.about-wrap,
.platform-container,
.hospital-container,
.hotel-container,
.school-container,
.farm-wrap {
    width: min(var(--cr-max), calc(100% - (var(--cr-gutter) * 2)));
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.platform-container {
    width: min(var(--cr-platform-max), calc(100% - (var(--cr-gutter) * 2)));
}

/* ---------- COMMON GRID SAFETY ---------- */
.hero-grid,
.platform-grid,
.platform-intro-grid,
.platform-section-grid,
.platform-module-grid,
.access-grid,
.resource-grid,
.resources-featured-card,
.resources-hero-grid,
.resources-intro-grid,
.resources-category-grid,
.insight-grid,
.industry-grid,
.industry-cards,
.features-grid,
.cards-grid,
.card-grid,
.about-products-grid,
.approach-grid,
.partner-types,
.footer-grid,
.footer-top,
.trust-grid,
.hero-trust,
.finance-layout,
.procurement-layout,
.inventory-layout,
.production-layout,
.assets-layout,
.bi-layout,
.connected-grid,
.security-grid,
.finance-feature-grid,
.procurement-feature-grid,
.inventory-feature-grid,
.procurement-panel-grid,
.procurement-detail-grid,
.inventory-panel-grid,
.inventory-detail-grid,
.finance-panel,
.form-grid,
.form-row,
.contact-grid,
.cs-hero-grid,
.cs-intro-grid,
.cs-reading-grid,
.cs-story-grid,
.gp-hero-grid,
.gp-intro-grid,
.kc-hero-grid,
.kc-intro-grid,
.insight-article-grid,
.insight-reading-grid,
.hospital-hero-inner,
.hospital-overview-grid,
.hospital-feature-row,
.hospital-erp-flow,
.hotel-hero-inner,
.hotel-overview-grid,
.hotel-feature-row,
.hotel-erp-flow,
.school-hero-inner,
.school-overview-grid,
.school-feature-row,
.school-erp-flow,
.farm-hero-grid,
.farm-operation-strip {
    min-width: 0;
}

/* Every direct grid child must be allowed to shrink. */
.hero-grid > *,
.platform-grid > *,
.platform-intro-grid > *,
.platform-section-grid > *,
.platform-module-grid > *,
.access-grid > *,
.resource-grid > *,
.resources-featured-card > *,
.resources-hero-grid > *,
.resources-intro-grid > *,
.resources-category-grid > *,
.insight-grid > *,
.industry-grid > *,
.industry-cards > *,
.features-grid > *,
.cards-grid > *,
.card-grid > *,
.about-products-grid > *,
.approach-grid > *,
.partner-types > *,
.footer-grid > *,
.footer-top > *,
.trust-grid > *,
.hero-trust > *,
.finance-layout > *,
.procurement-layout > *,
.inventory-layout > *,
.production-layout > *,
.assets-layout > *,
.bi-layout > *,
.connected-grid > *,
.security-grid > *,
.finance-feature-grid > *,
.procurement-feature-grid > *,
.inventory-feature-grid > *,
.procurement-panel-grid > *,
.procurement-detail-grid > *,
.finance-panel > *,
.form-grid > *,
.form-row > *,
.contact-grid > *,
.cs-hero-grid > *,
.cs-intro-grid > *,
.cs-reading-grid > *,
.cs-story-grid > *,
.gp-hero-grid > *,
.gp-intro-grid > *,
.kc-hero-grid > *,
.kc-intro-grid > *,
.insight-article-grid > *,
.insight-reading-grid > *,
.hospital-hero-inner > *,
.hospital-overview-grid > *,
.hospital-feature-row > *,
.hotel-hero-inner > *,
.hotel-overview-grid > *,
.hotel-feature-row > *,
.school-hero-inner > *,
.school-overview-grid > *,
.school-feature-row > *,
.farm-hero-grid > *,
.farm-operation-strip > * {
    min-width: 0;
}

/* ---------- COMMON MEDIA / CARDS ---------- */
.platform-card,
.resource-card,
.resource-category,
.insight-card,
.industry-card,
.feature-card,
.content-card,
.about-product-card,
.approach-card,
.partner-types > *,
.cs-story-card,
.gp-card,
.kc-quick-card,
.insight-article,
.hospital-feature-panel,
.hotel-feature-panel,
.school-feature-panel,
.farm-operation-panel {
    min-width: 0;
    max-width: 100%;
}

.platform-card img,
.resource-card img,
.resource-category img,
.insight-card img,
.industry-card img,
.feature-card img,
.content-card img,
.about-product-card img,
.cs-story-card img,
.gp-card img {
    max-width: 100%;
    height: auto;
}

/* ---------- COMMON ACTIONS ---------- */
.btn,
.btn-lg,
.farm-btn,
.hospital-btn,
.hotel-btn,
.school-btn,
.cs-cta-btn,
.gp-cta-btn,
.kc-cta-btn,
.final-cta-primary,
.final-cta-secondary,
.platform-hero-actions a,
.platform-cta-actions a {
    min-height: 44px;
    max-width: 100%;
}

.hero-actions,
.platform-hero-actions,
.resources-actions,
.final-cta-actions,
.cta-actions,
.farm-hero-actions,
.farm-cta-actions,
.hospital-hero-actions,
.hotel-hero-actions,
.school-hero-actions,
.cs-cta-actions,
.gp-cta-actions,
.kc-cta-actions {
    min-width: 0;
}

/* ---------- COMMON FORMS ---------- */
.form-grid,
.form-row,
.contact-grid,
.form-columns {
    min-width: 0;
}

.form-grid > *,
.form-row > *,
.contact-grid > *,
.form-columns > * {
    min-width: 0;
}

input,
select,
textarea {
    min-height: 44px;
}

textarea {
    min-height: 120px;
    resize: vertical;
}

/* ---------- REAL TAB SYSTEMS ----------
   Horizontal navigation is intentionally scrollable. The content
   panels themselves always reflow. This is the critical distinction.
   -------------------------------------------------------------- */

.finance-function-nav-wrap,
.procurement-function-nav-wrap,
.inventory-function-nav-wrap,
.platform-module-nav,
.cs-story-tab-nav,
.gp-tab-nav,
.insight-tab-nav,
.kc-tab-nav {
    min-width: 0;
    max-width: 100%;
}

.finance-function-nav,
.procurement-function-nav,
.inventory-function-nav,
.platform-module-nav,
.cs-story-tab-nav,
.gp-tab-nav,
.insight-tab-nav,
.kc-tab-nav {
    min-width: max-content;
}

.finance-function-tab,
.procurement-function-tab,
.inventory-function-tab,
.platform-module-nav a,
.cs-story-tab,
.gp-tab,
.insight-tab,
.kc-tab {
    flex: 0 0 auto;
    max-width: none;
}

.finance-panel,
.procurement-panel,
.inventory-panel,
.cs-story-panel,
.gp-panel,
.insight-panel,
.kc-panel {
    min-width: 0;
    max-width: 100%;
}

.finance-panel-main,
.finance-panel-sidebar,
.procurement-panel-grid > *,
.procurement-detail-grid > *,
.inventory-panel-grid > *,
.inventory-detail-grid > *,
.cs-story-panel-copy,
.cs-story-panel-visual,
.gp-panel-head,
.gp-panel-visual,
.insight-panel-copy,
.insight-panel-visual,
.kc-panel-head,
.kc-panel-visual {
    min-width: 0;
}

/* ---------- TABLES ---------- */
.table-responsive,
.responsive-table,
.data-table-wrap,
.finance-table-wrap,
.quotation-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.table-responsive table,
.responsive-table table,
.data-table-wrap table,
.finance-table-wrap table,
.quotation-table-wrap table {
    max-width: none;
}

/* ============================================================
   TABLET — 1100px
   ============================================================ */
@media (max-width: 1100px) {

    .container,
    .site-container,
    .section-container,
    .resources-wrap,
    .about-wrap,
    .platform-container,
    .hospital-container,
    .hotel-container,
    .school-container,
    .farm-wrap {
        width: min(100% - 40px, var(--cr-platform-max));
    }

    /* Stop desktop two-column layouts from forcing a horizontal page. */
    .platform-intro-grid,
    .finance-layout,
    .procurement-layout,
    .inventory-layout,
    .production-layout,
    .assets-layout,
    .bi-layout,
    .connected-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .platform-module-nav {
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: flex-start;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .platform-module-nav a {
        min-width: 150px;
    }

    .security-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .procurement-panel-grid,
    .procurement-detail-grid,
    .inventory-panel-grid,
    .inventory-detail-grid {
        grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr);
        gap: 36px;
    }

    .footer-top,
    .footer-grid {
        grid-template-columns: 2fr repeat(3, minmax(0, 1fr));
    }
}

/* ============================================================
   NAVIGATION + TABLET — 900px
   ============================================================ */
@media (max-width: 900px) {

    .site-header {
        height: 70px;
    }

    .nav-wrap {
        gap: 14px;
    }

    /* Both versions used in the project are supported. */
    .main-nav,
    .nav-cta {
        display: none;
    }

    .mobile-toggle {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        margin-left: auto;
        padding: 0;
    }

    .main-nav.open,
    .main-nav.mobile-open {
        position: absolute;
        top: 70px;
        left: 12px;
        right: 12px;
        z-index: 1100;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: auto;
        height: auto;
        max-height: calc(100dvh - 82px);
        padding: 8px;
        overflow-x: hidden;
        overflow-y: auto;
        background: #fff;
        border: 1px solid var(--cr-line);
        border-radius: 0 0 16px 16px;
        box-shadow: 0 18px 45px rgba(14,39,74,.14);
    }

    .main-nav.open .nav-item,
    .main-nav.mobile-open .nav-item {
        display: block;
        width: 100%;
        height: auto;
    }

    .main-nav.open .nav-item > a,
    .main-nav.open .plum-link,
    .main-nav.mobile-open .nav-item > a,
    .main-nav.mobile-open .plum-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 48px;
        height: auto;
        padding: 12px 10px;
        white-space: normal;
    }

    .main-nav.open .nav-search,
    .main-nav.mobile-open .nav-search {
        width: 100%;
        min-height: 48px;
        padding: 12px 10px;
        text-align: left;
    }

    /* Dropdowns become part of the mobile document flow. */
    .main-nav.open .mega-menu,
    .main-nav.mobile-open .mega-menu {
        position: static;
        left: auto;
        top: auto;
        width: auto !important;
        max-width: none;
        max-height: none;
        transform: none !important;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        display: none;
        overflow: visible;
        border: 0;
        border-top: 1px solid #edf1f6;
        border-radius: 0;
        box-shadow: none;
    }

    .main-nav.open .nav-item.menu-open > .mega-menu,
    .main-nav.mobile-open .nav-item.menu-open > .mega-menu {
        display: block;
    }

    .main-nav.open .platform-menu,
    .main-nav.open .simple-menu,
    .main-nav.open .industry-menu,
    .main-nav.open .special-menu,
    .main-nav.open .mega-grid,
    .main-nav.mobile-open .platform-menu,
    .main-nav.mobile-open .simple-menu,
    .main-nav.mobile-open .industry-menu,
    .main-nav.mobile-open .special-menu,
    .main-nav.mobile-open .mega-grid {
        display: grid;
        grid-template-columns: 1fr;
        width: auto !important;
        max-width: none;
    }

    .main-nav.open .mega-intro,
    .main-nav.mobile-open .mega-intro {
        display: none;
    }

    /* Main page layouts. */
    .hero-grid,
    .platform-hero-grid,
    .resources-hero-grid,
    .about-intro-grid,
    .story-grid,
    .resources-intro-grid,
    .contact-grid,
    .cs-hero-grid,
    .cs-intro-grid,
    .cs-reading-grid,
    .gp-hero-grid,
    .gp-intro-grid,
    .kc-hero-grid,
    .kc-intro-grid,
    .insight-article-grid,
    .insight-reading-grid,
    .hospital-hero-inner,
    .hotel-hero-inner,
    .school-hero-inner,
    .farm-hero-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hero-visual,
    .platform-hero-visual,
    .resources-hero-visual,
    .cs-hero-visual,
    .gp-hero-visual,
    .kc-hero-visual,
    .insight-hero-visual,
    .hospital-hero-visual,
    .hotel-hero-visual,
    .school-hero-visual {
        order: 2;
        max-width: 100%;
    }

    .about-products-grid,
    .approach-grid,
    .insight-grid,
    .industry-grid,
    .industry-cards,
    .features-grid,
    .cards-grid,
    .partner-types {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .resources-featured-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .resources-featured-visual {
        min-height: 300px;
        order: 1;
    }

    .resources-featured-content {
        order: 2;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }

    /* Platform module content must never retain a 420px/650px child. */
    .procurement-panel-grid,
    .procurement-detail-grid,
    .inventory-panel-grid,
    .inventory-detail-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }
}

/* ============================================================
   MOBILE — 760px
   ============================================================ */
@media (max-width: 760px) {

    :root {
        --cr-gutter: 16px;
    }

    .container,
    .site-container,
    .section-container,
    .resources-wrap,
    .about-wrap,
    .platform-container,
    .hospital-container,
    .hotel-container,
    .school-container,
    .farm-wrap {
        width: calc(100% - 32px);
    }

    /* ----- universal grids ----- */
    .about-products-grid,
    .approach-grid,
    .insight-grid,
    .industry-grid,
    .industry-cards,
    .features-grid,
    .cards-grid,
    .card-grid,
    .partner-types,
    .resource-grid,
    .finance-feature-grid,
    .procurement-feature-grid,
    .inventory-feature-grid,
    .security-grid,
    .footer-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    /* ----- heroes ----- */
    .hero,
    .platform-hero,
    .page-hero,
    .resources-hero,
    .cs-hero,
    .gp-hero,
    .kc-hero,
    .insight-hero,
    .hospital-hero,
    .hotel-hero,
    .school-hero,
    .farm-hero {
        min-height: 0;
        overflow: hidden;
    }

    .hero-content,
    .platform-hero-content,
    .resources-hero-copy,
    .cs-hero-copy,
    .gp-hero-copy,
    .kc-hero-copy,
    .insight-hero-copy,
    .hospital-hero-content,
    .hotel-hero-content,
    .school-hero-content,
    .farm-hero-content {
        max-width: 100%;
        min-width: 0;
    }

    .hero-actions,
    .platform-hero-actions,
    .resources-actions,
    .final-cta-actions,
    .cta-actions,
    .farm-hero-actions,
    .farm-cta-actions,
    .hospital-hero-actions,
    .hotel-hero-actions,
    .school-hero-actions,
    .cs-cta-actions,
    .gp-cta-actions,
    .kc-cta-actions {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
    }

    .hero-product,
    .hero-visual,
    .platform-hero-visual,
    .resources-hero-visual,
    .cs-hero-visual,
    .gp-hero-visual,
    .kc-hero-visual,
    .insight-hero-visual,
    .hospital-hero-visual,
    .hotel-hero-visual,
    .school-hero-visual {
        width: 100%;
        max-width: 100%;
        min-width: 0;
		margin-top:10px !important;
    }

    /* ----- platform function tabs ----- */
    .finance-function-nav-wrap,
    .procurement-function-nav-wrap,
    .inventory-function-nav-wrap,
    .platform-module-nav,
    .cs-story-tab-nav,
    .gp-tab-nav,
    .insight-tab-nav,
    .kc-tab-nav {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        overscroll-behavior-x: contain;
        touch-action: pan-x;
    }

    .finance-function-nav,
    .procurement-function-nav,
    .inventory-function-nav,
    .platform-module-nav,
    .cs-story-tab-nav,
    .gp-tab-nav,
    .insight-tab-nav,
    .kc-tab-nav {
        width: max-content;
        max-width: none;
    }

    .finance-function-tab,
    .procurement-function-tab,
    .inventory-function-tab,
    .platform-module-nav a,
    .cs-story-tab,
    .gp-tab,
    .insight-tab,
    .kc-tab {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    /* ----- finance panel: sidebar above content ----- */
    .finance-panel,
    .finance-panel.active {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
        overflow: hidden;
    }

    .finance-panel-sidebar {
        padding: 26px 22px;
        border-right: 0;
        border-bottom: 1px solid #e4ebf3;
    }

    .finance-panel-main {
        min-width: 0;
        padding: 28px 22px;
    }

    .finance-feature-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-content-heading h3 {
        font-size: 26px;
    }

    /* ----- procurement / inventory panels ----- */
    .procurement-panel-grid,
    .procurement-detail-grid,
    .inventory-panel-grid,
    .inventory-detail-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .procurement-panel h3,
    .inventory-panel h3,
    .inventory-detail-grid h3 {
        font-size: clamp(27px, 8vw, 38px);
        letter-spacing: -1px;
    }

    .procurement-feature-grid,
    .inventory-feature-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .inventory-module {
        padding-left: 0;
        padding-right: 0;
    }

    /* ----- resource tab systems ----- */
    /* Desktop uses a permanent left rail. On phones the rail becomes
       a horizontally scrollable strip above the active content. */
    .cs-story-tabs,
    .gp-tab-system,
    .insight-tab-system,
    .kc-tab-system {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .cs-story-tab-nav,
    .gp-tab-nav,
    .insight-tab-nav,
    .kc-tab-nav {
        display: flex;
        align-items: stretch;
        gap: 6px;
        width: 100%;
        padding: 10px;
        border-right: 0;
        border-bottom: 1px solid #e3e9f0;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        touch-action: pan-x;
    }

    .cs-story-tab,
    .gp-tab,
    .insight-tab,
    .kc-tab {
        width: auto;
        min-width: 180px;
        margin: 0;
        flex: 0 0 auto;
    }

    .cs-story-tab-content,
    .gp-tab-content,
    .insight-tab-content,
    .kc-tab-content {
        width: 100%;
        min-width: 0;
        padding: 0;
    }

    .gp-tab-content,
    .kc-tab-content {
        padding: 28px 22px 32px;
    }

    .cs-story-panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
        padding: 32px 24px 36px;
    }

    .gp-panel-head,
    .kc-panel-head {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
    }

    .insight-panel {
        grid-template-columns: minmax(0, 1fr);
        min-height: 0;
    }

    .insight-panel-copy {
        padding: 32px 24px 36px;
    }

    .insight-panel-visual {
        min-height: 360px;
    }

    .cs-story-tab-content,
    .gp-tab-content,
    .insight-tab-content,
    .kc-tab-content {
        width: 100%;
        min-width: 0;
    }

    .cs-story-panel,
    .gp-panel,
    .insight-panel,
    .kc-panel {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .cs-story-panel,
    .gp-panel-head,
    .kc-panel-head {
        grid-template-columns: minmax(0, 1fr);
    }

    .insight-panel {
        grid-template-columns: minmax(0, 1fr);
    }

    .cs-story-panel-visual,
    .gp-panel-visual,
    .insight-panel-visual,
    .kc-panel-visual {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    /* ----- featured resource blocks ----- */
    .resources-featured-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .resources-featured-content {
        padding: 28px 22px;
    }

    .resource-category,
    .resource-category:nth-child(4),
    .resource-category:nth-child(5) {
        grid-column: 1 / -1;
        width: 100%;
    }

    /* Fixed-width process diagrams from platform.css become contained
       horizontal canvases rather than 570–720px page-wide elements. */
    .procurement-flow,
    .inventory-flow {
        width: 100%;
        min-width: 0 !important;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    /* ----- tables ----- */
    .table-responsive,
    .responsive-table,
    .data-table-wrap,
    .finance-table-wrap,
    .quotation-table-wrap {
        width: 100%;
        max-width: 100%;
        margin-right: 0;
    }

    /* ----- specialist feature rows ----- */
    .hospital-feature-row,
    .hotel-feature-row,
    .school-feature-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

    .hospital-feature-row.reverse,
    .hotel-feature-row.reverse,
    .school-feature-row.reverse {
        direction: ltr;
    }

    .hospital-feature-content,
    .hospital-feature-panel,
    .hotel-feature-content,
    .hotel-feature-panel,
    .school-feature-content,
    .school-feature-panel {
        width: 100%;
        min-width: 0;
    }

    .hospital-overview-grid,
    .hotel-overview-grid,
    .school-overview-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    /* ----- footer ----- */
    .footer-top,
    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-brand {
        grid-column: 1 / -1;
    }
}

/* ============================================================
   SMALL PHONES — 560px
   ============================================================ */
@media (max-width: 560px) {

    .container,
    .site-container,
    .section-container,
    .resources-wrap,
    .about-wrap,
    .platform-container,
    .hospital-container,
    .hotel-container,
    .school-container,
    .farm-wrap {
        width: calc(100% - 28px);
    }

    .site-header {
        height: 64px;
    }

    .main-nav.open,
    .main-nav.mobile-open {
        top: 64px;
        left: 8px;
        right: 8px;
        max-height: calc(100dvh - 72px);
    }

    /*.brand {
        min-width: 0;
    }

    .brand-text,
    .brand-name {
        min-width: 0;
        max-width: calc(100vw - 110px);
    }

    .brand-text strong,
    .brand-name strong {
        font-size: 12px;
        white-space: nowrap;
    }

    .brand-text small,
    .brand-name small {
        font-size: 12px;
        letter-spacing: 1px;
        white-space: nowrap;
    }
*/
    .mobile-toggle {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
    }

    /* Buttons become full-width only where the action group is clearly
       a mobile stack. This prevents short inline buttons from being
       stretched throughout the site. */
    .hero-actions,
    .platform-hero-actions,
    .resources-actions,
    .final-cta-actions,
    .farm-hero-actions,
    .farm-cta-actions,
    .hospital-hero-actions,
    .hotel-hero-actions,
    .school-hero-actions,
    .cs-cta-actions,
    .gp-cta-actions,
    .kc-cta-actions {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .hero-actions > *,
    .platform-hero-actions > *,
    .resources-actions > *,
    .final-cta-actions > *,
    .farm-hero-actions > *,
    .farm-cta-actions > *,
    .hospital-hero-actions > *,
    .hotel-hero-actions > *,
    .school-hero-actions > *,
    .cs-cta-actions > *,
    .gp-cta-actions > *,
    .kc-cta-actions > * {
        width: 100%;
        max-width: 100%;
    }

    .platform-section,
    .platform-module,
    .connected-section,
    .security-section,
    .section,
    .page-body {
        padding-top: 58px;
        padding-bottom: 58px;
    }

    .page-hero {
        padding-top: 54px;
        padding-bottom: 46px;
    }

    .resources-hero {
        padding-top: 22px;
        padding-bottom: 48px;
    }

    .resources-featured-content {
        padding: 24px 18px;
    }

    .resources-featured-visual {
        min-height: 240px;
    }

    .content-card {
        padding: 24px 18px;
    }

    /* Make every panel visual fit the viewport, including decorative
       diagrams that were designed around fixed desktop dimensions. */
    .cs-story-panel-visual,
    .gp-panel-visual,
    .insight-panel-visual,
    .kc-panel-visual,
    .hospital-feature-panel,
    .hotel-feature-panel,
    .school-feature-panel {
        overflow: hidden;
    }

    .cs-story-panel-visual > *,
    .gp-panel-visual > *,
    .insight-panel-visual > *,
    .kc-panel-visual > *,
    .hospital-feature-panel > *,
    .hotel-feature-panel > *,
    .school-feature-panel > * {
        max-width: 100%;
    }

    /* Specialist dashboard mockups: scale rather than push the page wide. */
    .hospital-dashboard,
    .hotel-dashboard,
    .school-dashboard,
    .farm-board {
        width: 100%;
        max-width: 100%;
    }

    .hospital-stat-grid,
    .hotel-stat-grid,
    .school-stat-grid,
    .farm-board-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hospital-care-flow,
    .hotel-room-grid,
    .school-class-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hospital-resource-grid,
    .hotel-resource-grid,
    .school-resource-grid,
    .hospital-intelligence-grid,
    .hotel-metric-grid,
    .school-metric-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .footer-top,
    .footer-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px;
    }

    .footer-brand,
    .footer-column {
        grid-column: auto;
    }

    .footer-bottom,
    .site-footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .footer-bottom-links {
        flex-wrap: wrap;
    }
}

/* ============================================================
   VERY SMALL PHONES — 390px
   ============================================================ */
@media (max-width: 390px) {

    .container,
    .site-container,
    .section-container,
    .resources-wrap,
    .about-wrap,
    .platform-container,
    .hospital-container,
    .hotel-container,
    .school-container,
    .farm-wrap {
        width: calc(100% - 24px);
    }

   /* .brand-mark,
    .brand-logo {
        flex: 0 0 36px;
        width: 36px;
        height: 36px;
    }

    .brand-text strong,
    .brand-name strong {
        font-size: 12px;
        letter-spacing: .8px;
    }

    .brand-text small,
    .brand-name small {
        font-size: 12px;
        letter-spacing: .7px;
    }*/

    .finance-panel-sidebar,
    .finance-panel-main {
        padding-left: 18px;
        padding-right: 18px;
    }

    .procurement-feature,
    .inventory-feature {
        padding: 14px;
    }

    .cs-story-tab,
    .gp-tab,
    .insight-tab,
    .kc-tab {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* ---------- ACCESSIBILITY ---------- */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* ---------- PRINT ---------- */
@media print {
    .site-header,
    .mobile-toggle,
    .main-nav,
    .nav-cta,
    .hero-actions,
    .platform-hero-actions,
    .resources-actions,
    .cs-cta-actions,
    .gp-cta-actions,
    .kc-cta-actions {
        display: none !important;
    }

    body {
        overflow: visible;
    }
}
