.sentrix-page {
    --sx-bg:#111514; --sx-panel:#171d1b; --sx-panel-2:#1d2522;
    --sx-text:#f0eee5; --sx-muted:#b8b9b1; --sx-line:rgba(240,238,229,.14);
    --sx-accent:#9fbcae; --sx-accent-2:#c6d7cf;
    background:var(--sx-bg); color:var(--sx-text); min-height:100vh;
    padding-top:var(--mvc-header-height); overflow-x:hidden;
}
body[data-page="sentrix"] { overflow-y:auto!important; }
body[data-page="sentrix"] .mvc-main,
body[data-page="sentrix"] .mvc-home-page { height:auto!important; min-height:100vh!important; overflow:visible!important; }
body[data-page="sentrix"] .mvc-home-page { padding-top:0!important; }
.sentrix-page h1,.sentrix-page h2,.sentrix-page h3,.sentrix-page p { margin:0; }
.sentrix-kicker { display:inline-block; margin-bottom:1.25rem; color:var(--sx-accent-2); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; }

.sentrix-hero { min-height:calc(100vh - var(--mvc-header-height)); padding:clamp(5rem,8vw,9rem) clamp(2rem,7vw,9rem) 5rem; display:grid; grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr); gap:clamp(3rem,6vw,7rem); align-items:center; background:radial-gradient(circle at 79% 37%,rgba(159,188,174,.12),transparent 29%),linear-gradient(135deg,#111514 0%,#151b19 100%); border-bottom:1px solid var(--sx-line); }
.sentrix-hero h1 { font-size:clamp(4.8rem,8vw,9rem); line-height:.82; letter-spacing:-.06em; }
.sentrix-hero h2 { margin-top:1.7rem; max-width:780px; font-size:clamp(2rem,3.1vw,4.1rem); line-height:1.02; font-weight:500; letter-spacing:-.045em; }
.sentrix-lead { margin-top:2rem!important; max-width:680px; color:var(--sx-muted); font-size:clamp(1rem,1.2vw,1.25rem); line-height:1.65; }
.sentrix-hero__visual img { width:100%; display:block; border:1px solid var(--sx-line); box-shadow:0 30px 90px rgba(0,0,0,.35); }
.sentrix-hero__actions { margin-top:2.5rem; display:flex; gap:.9rem; flex-wrap:wrap; }

.sentrix-primary,.sentrix-secondary,.sentrix-card__cta { display:inline-flex; align-items:center; justify-content:center; min-height:3.3rem; padding:0 1.65rem; border-radius:999px; text-decoration:none; font-size:.84rem; letter-spacing:.04em; text-transform:uppercase; transition:transform .2s ease,background .2s ease,color .2s ease; }
.sentrix-primary { background:var(--sx-accent-2); color:#101412; }
.sentrix-secondary { border:1px solid var(--sx-line); color:var(--sx-text); }
.sentrix-primary:hover,.sentrix-secondary:hover,.sentrix-card__cta:hover { transform:translateY(-2px); }

.sentrix-deployment { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.65rem; }
.sentrix-deployment span,.sentrix-device-cloud span,.sentrix-audience__items span,.sentrix-card__chips span { padding:.55rem .8rem; border:1px solid var(--sx-line); border-radius:999px; color:var(--sx-muted); font-size:.8rem; }

.sentrix-proof,.sentrix-problem,.sentrix-device-types,.sentrix-architecture,.sentrix-audience,.sentrix-cta { padding:clamp(5rem,8vw,9rem) clamp(2rem,8vw,10rem); border-bottom:1px solid var(--sx-line); }
.sentrix-proof { display:grid; grid-template-columns:.75fr 1.25fr; gap:6vw; align-items:end; }
.sentrix-proof__intro h2,.sentrix-problem h2,.sentrix-device-types h2,.sentrix-architecture h2,.sentrix-audience h2,.sentrix-cta h2 { font-size:clamp(2.1rem,4vw,5rem); line-height:1; letter-spacing:-.045em; font-weight:500; }
.sentrix-proof__intro p,.sentrix-cta p { margin-top:1.5rem; max-width:760px; color:var(--sx-muted); line-height:1.6; }

.sentrix-metrics { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--sx-line); border-left:1px solid var(--sx-line); }
.sentrix-metric { min-height:150px; padding:1.6rem; border-right:1px solid var(--sx-line); border-bottom:1px solid var(--sx-line); display:flex; flex-direction:column; justify-content:space-between; }
.sentrix-metric strong { font-size:clamp(2.2rem,3.7vw,4.6rem); line-height:1; font-weight:500; }
.sentrix-metric span { color:var(--sx-muted); font-size:.86rem; }

.sentrix-problem__grid { margin-top:3.5rem; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--sx-line); border-left:1px solid var(--sx-line); }
.sentrix-problem__grid>div { padding:1.8rem; min-height:220px; border-right:1px solid var(--sx-line); border-bottom:1px solid var(--sx-line); }
.sentrix-problem__grid strong { font-size:1.15rem; }
.sentrix-problem__grid p { margin-top:1rem; color:var(--sx-muted); line-height:1.55; font-size:.92rem; }

.sentrix-feature { padding:clamp(5rem,8vw,9rem) clamp(2rem,7vw,9rem); display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(3rem,7vw,9rem); align-items:center; border-bottom:1px solid var(--sx-line); }
.sentrix-feature--reverse .sentrix-feature__copy { order:2; }
.sentrix-feature--reverse .sentrix-screenshot { order:1; }
.sentrix-feature__copy h2 { font-size:clamp(2.2rem,3.7vw,4.8rem); line-height:1; letter-spacing:-.04em; font-weight:500; }
.sentrix-feature__copy>p { margin-top:1.6rem; color:var(--sx-muted); line-height:1.65; font-size:1rem; }
.sentrix-checklist { margin:2rem 0 0; padding:0; list-style:none; border-top:1px solid var(--sx-line); }
.sentrix-checklist li { padding:.9rem 0; border-bottom:1px solid var(--sx-line); color:var(--sx-text); }
.sentrix-checklist li::before { content:"—"; color:var(--sx-accent); margin-right:.75rem; }
.sentrix-screenshot { margin:0; }
.sentrix-screenshot img { width:100%; display:block; border:1px solid var(--sx-line); box-shadow:0 24px 70px rgba(0,0,0,.3); }
.sentrix-screenshot figcaption { margin-top:.7rem; color:var(--sx-muted); font-size:.75rem; }

.sentrix-device-types { display:grid; grid-template-columns:.8fr 1.2fr; gap:6vw; align-items:center; }
.sentrix-device-cloud,.sentrix-audience__items { display:flex; flex-wrap:wrap; gap:.7rem; }

.sentrix-architecture { background:var(--sx-panel); }
.sentrix-deploy-grid { margin-top:3.5rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--sx-line); border-left:1px solid var(--sx-line); }
.sentrix-deploy-grid article { min-height:320px; padding:2rem; border-right:1px solid var(--sx-line); border-bottom:1px solid var(--sx-line); }
.sentrix-deploy-grid article>span { color:var(--sx-accent); font-size:.75rem; }
.sentrix-deploy-grid h3 { margin-top:4rem; font-size:2.2rem; font-weight:500; }
.sentrix-deploy-grid p { margin-top:1.2rem; max-width:380px; color:var(--sx-muted); line-height:1.55; }

.sentrix-audience { display:grid; grid-template-columns:1fr 1fr; gap:6vw; align-items:center; }
.sentrix-cta { min-height:550px; display:grid; grid-template-columns:1fr auto; gap:4rem; align-items:end; background:radial-gradient(circle at 85% 20%,rgba(159,188,174,.14),transparent 30%),var(--sx-panel-2); }

.project-showcase__right { overflow-y:auto!important; }
.sentrix-card { margin:2.2vw 2.2vw 2.2vw 1.2vw; border:1px solid rgba(230,227,217,.20); background:rgba(18,22,21,.62); }
.sentrix-card__visual { display:block; position:relative; overflow:hidden; }
.sentrix-card__visual img { display:block; width:100%; max-height:39vh; object-fit:cover; object-position:top center; transition:transform .5s ease; }
.sentrix-card__visual:hover img { transform:scale(1.015); }
.sentrix-card__eyebrow { position:absolute; top:1rem; left:1rem; padding:.5rem .7rem; background:rgba(17,21,20,.88); color:#dce5e0; font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; }
.sentrix-card__body { padding:clamp(1.5rem,2.6vw,3rem); }
.sentrix-card__brand { display:flex; align-items:baseline; gap:1rem; flex-wrap:wrap; }
.sentrix-card__brand>span { font-size:1.5rem; font-weight:700; letter-spacing:.04em; }
.sentrix-card__brand small { color:rgba(226,220,200,.65); }
.sentrix-card__body h1 { margin:1.5rem 0 0; max-width:900px; font-size:clamp(1.65rem,2.6vw,3.2rem); line-height:1.05; font-weight:500; letter-spacing:-.035em; }
.sentrix-card__body p { margin-top:1.25rem; max-width:900px; color:rgba(226,220,200,.72); line-height:1.55; }
.sentrix-card__chips { margin-top:1.5rem; display:flex; flex-wrap:wrap; gap:.55rem; }
.sentrix-card__chips span { border-color:rgba(226,220,200,.18); color:rgba(226,220,200,.74); }
.sentrix-card__cta { margin-top:1.8rem; gap:.8rem; background:#b66449; color:#f4eee2; }

@media(max-width:1000px){
    .sentrix-hero,.sentrix-proof,.sentrix-feature,.sentrix-device-types,.sentrix-audience,.sentrix-cta{grid-template-columns:1fr}
    .sentrix-hero{min-height:auto}
    .sentrix-feature--reverse .sentrix-feature__copy,.sentrix-feature--reverse .sentrix-screenshot{order:initial}
    .sentrix-problem__grid{grid-template-columns:repeat(2,1fr)}
    .sentrix-metrics,.sentrix-deploy-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
    .sentrix-page{padding-top:var(--mvc-header-height)}
    .sentrix-hero{padding-top:4rem;grid-template-columns:1fr}
    .sentrix-proof,.sentrix-problem,.sentrix-device-types,.sentrix-architecture,.sentrix-audience,.sentrix-cta,.sentrix-feature{padding-left:1.4rem;padding-right:1.4rem}
    .sentrix-problem__grid,.sentrix-metrics,.sentrix-deploy-grid{grid-template-columns:1fr}
    .sentrix-card{margin:1rem 0}
}


/* ============================================================
   v6 - Header fix for long scrolling pages
   ============================================================ */

/*
   The base portfolio template uses a transparent fixed header.
   On a long scrolling page this lets page content show through it.
   SENTRIX therefore gets its own opaque fixed header layer.
*/
body[data-page="sentrix"] .header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;

    z-index: 1000;

    background: #111514;
    border-bottom: 1px solid rgba(240, 238, 229, 0.14);

    /* Prevent underlying text/images from visually contaminating the header. */
    isolation: isolate;
}

/* Keep the entire menu/header surface opaque, including both template columns. */
body[data-page="sentrix"] .header__left,
body[data-page="sentrix"] .header__right {
    background: #111514;
}

/*
   SENTRIX is a normal vertically scrolling landing page.
   Its first content pixel starts below the fixed portfolio header.
*/
body[data-page="sentrix"] .sentrix-page {
    padding-top: var(--mvc-header-height) !important;
}

/* The body scrolls; the page itself must not create a second scroll context. */
body[data-page="sentrix"] .mvc-home-page {
    padding-top: 0 !important;
    overflow: visible !important;
}

body[data-page="sentrix"] .sentrix-hero {
    min-height: calc(100vh - var(--mvc-header-height));
}

/* Improve readability while scrolling without changing the visual language. */
@supports (backdrop-filter: blur(8px)) {
    body[data-page="sentrix"] .header {
        background: rgba(17, 21, 20, 0.96);
        backdrop-filter: blur(8px);
    }

    body[data-page="sentrix"] .header__left,
    body[data-page="sentrix"] .header__right {
        background: transparent;
    }
}

@media screen and (max-width: 768px) {
    body[data-page="sentrix"] .sentrix-page {
        padding-top: var(--mvc-header-height) !important;
    }

    body[data-page="sentrix"] .header {
        background: #111514;
    }
}
