@charset "utf-8";
/* Leviticus | Data Centers CSS | V1.0 */

/* =========================================================
   SHARED DATA CENTER PAGE ELEMENTS
   ========================================================= */
.eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #C9A44C;
}

.eyebrow span {
    width: 38px;
    height: 1px;
    background: #C9A44C;
}

/* =========================================================
   HERO
   ========================================================= */
.data-center-hero {
    position: relative;
    min-height: 650px;
    overflow: hidden;
    background: #08111B;
    border-bottom: 1px solid rgba(201, 164, 76, .22);
}

.data-center-hero-background {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg,
            rgba(11, 15, 20, .98) 0%,
            rgba(11, 15, 20, .92) 30%,
            rgba(11, 15, 20, .55) 52%,
            rgba(11, 15, 20, .12) 78%,
            rgba(11, 15, 20, .18) 100%),
        url("images/lev-data-centers-hero.webp") center right / cover no-repeat;
}

.data-center-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 72% 42%, rgba(201, 164, 76, .10), transparent 28%);
    pointer-events: none;
}

.data-center-hero-inner {
    position: relative;
    z-index: 2;
    min-height: 650px;
    display: flex;
    align-items: center;
}

.data-center-hero-content {
    width: 610px;
    padding: 78px 0 82px;
}

.data-center-hero-content h1 span {
    color: #C9A44C;
}

.data-center-hero-content p {
    max-width: 570px;
    margin-bottom: 34px;
    color: #D4D9DF;
}

.data-center-hero-actions {
    display: flex;
    align-items: center;
    gap: 18px;
}

/* =========================================================
   OVERVIEW
   ========================================================= */
.data-center-overview {
    padding: 76px 0;
    background: #0B0F14;
}

.data-center-overview-grid {
    display: grid;
    grid-template-columns: .9fr 1fr 1.15fr;
    gap: 58px;
    align-items: center;
}

.data-center-overview-heading h2 {
    max-width: 430px;
}

.data-center-overview-heading h2 em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    color: #C9A44C;
}

.data-center-overview-copy {
    padding: 8px 0;
}

.data-center-overview-copy p:last-child {
    margin-bottom: 0;
}

.data-center-overview-image {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    border: 1px solid rgba(201, 164, 76, .28);
}

.data-center-overview-image::after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 60px rgba(8, 17, 27, .32);
    pointer-events: none;
}

.data-center-overview-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =========================================================
   CORE CAPABILITIES
   ========================================================= */
.data-center-capabilities {
    padding: 72px 0 78px;
    background:
        radial-gradient(circle at 50% 0%, rgba(31, 106, 225, .07), transparent 35%),
        #08111B;
    border-top: 1px solid rgba(31, 106, 225, .16);
    border-bottom: 1px solid rgba(31, 106, 225, .16);
}

.data-center-section-heading {
    max-width: 720px;
    margin-bottom: 38px;
}

.data-center-section-heading > p {
    max-width: 620px;
    margin: 0;
}

.data-center-capabilities-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid rgba(201, 164, 76, .30);
    border-bottom: 1px solid rgba(201, 164, 76, .30);
}

.data-center-capability {
    position: relative;
    min-height: 255px;
    padding: 32px 30px 28px;
    border-right: 1px solid rgba(122, 133, 148, .22);
    overflow: hidden;
}

.data-center-capability:last-child {
    border-right: 0;
}

.data-center-capability::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: #C9A44C;
    transition: width .25s ease;
}

.data-center-capability:hover::after {
    width: 100%;
}

.capability-number {
    display: block;
    margin-bottom: 44px;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    color: #C9A44C;
}

.data-center-capability h3 {
    min-height: 44px;
    margin-bottom: 14px;
}

.data-center-capability p {
    margin: 0;
    font-size: 14px;
    line-height: 1.65;
}

/* =========================================================
   DATA CENTER INFRASTRUCTURE STACK
   ========================================================= */
.data-center-stack {
    position: relative;
    padding: 78px 0 90px;
    background:
        radial-gradient(circle at 76% 38%, rgba(31, 106, 225, .09), transparent 34%),
        #0B0F14;
    overflow: hidden;
}

.data-center-stack::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .14;
    background:
        linear-gradient(90deg, transparent 49.8%, rgba(31, 106, 225, .18) 50%, transparent 50.2%),
        linear-gradient(0deg, transparent 49.8%, rgba(31, 106, 225, .12) 50%, transparent 50.2%);
    background-size: 110px 110px;
}

.data-center-stack .container {
    position: relative;
    z-index: 2;
}

.data-center-stack-intro {
    display: grid;
    grid-template-columns: 390px 1fr;
    gap: 90px;
    align-items: end;
    margin-bottom: 58px;
}

.data-center-stack-intro h2 {
    margin-bottom: 0;
}

.data-center-stack-intro > p {
    max-width: 680px;
    margin: 0 0 3px;
}

.infrastructure-stack {
    position: relative;
    max-width: 1120px;
    margin-left: auto;
    border: 1px solid rgba(122, 133, 148, .18);
    background: rgba(10, 14, 20, .55);
}

.stack-layer {
    position: relative;
    display: grid;
    grid-template-columns: 92px 1fr;
    gap: 28px;
    align-items: center;
    min-height: 104px;
    padding: 20px 34px;
    border-bottom: 1px solid rgba(122, 133, 148, .18);
    transition: background .25s ease, transform .25s ease;
}

.stack-layer:last-child {
    border-bottom: 0;
}

.stack-layer::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, #1F6AE1, #C9A44C);
    opacity: .35;
}

.stack-layer:hover {
    background: rgba(31, 106, 225, .055);
    transform: translateX(-6px);
}

.stack-number {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(31, 106, 225, .65);
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    color: #C9A44C;
    box-shadow: 0 0 18px rgba(31, 106, 225, .10);
}

.stack-layer h3 {
    margin: 0 0 5px;
}

.stack-layer p {
    max-width: 680px;
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
}

.stack-layer:nth-child(1) { margin-left: 0; }
.stack-layer:nth-child(2) { margin-left: 34px; }
.stack-layer:nth-child(3) { margin-left: 68px; }
.stack-layer:nth-child(4) { margin-left: 102px; }
.stack-layer:nth-child(5) { margin-left: 136px; }

/* =========================================================
   EXPERTISE / CRITICAL ENVIRONMENTS
   ========================================================= */
.data-center-expertise {
    background: #08111B;
    border-top: 1px solid rgba(31, 106, 225, .18);
    border-bottom: 1px solid rgba(201, 164, 76, .22);
}

.data-center-expertise-grid {
    display: grid;
    grid-template-columns: .95fr 1.55fr;
}

.expertise-panel,
.environments-panel {
    padding: 64px 0 68px;
}

.expertise-panel {
    padding-right: 64px;
    border-right: 1px solid rgba(201, 164, 76, .35);
}

.environments-panel {
    padding-left: 64px;
}

.expertise-panel h2,
.environments-panel h2 {
    max-width: 520px;
}

.expertise-panel p {
    max-width: 560px;
    margin-bottom: 0;
}

.environments-panel > p {
    margin-bottom: 30px;
}

.environment-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border-top: 1px solid rgba(122, 133, 148, .20);
}

.environment-list span {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 10px;
    border-right: 1px solid rgba(122, 133, 148, .20);
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    color: #D7DDE4;
}

.environment-list span:last-child {
    border-right: 0;
}

/* =========================================================
   CTA
   ========================================================= */
.data-center-cta {
    position: relative;
    padding: 54px 0 58px;
    background:
        radial-gradient(circle at 72% 50%, rgba(31, 106, 225, .08), transparent 34%),
        #0B0F14;
    overflow: hidden;
}

.data-center-cta::before,
.data-center-cta::after {
    content: "";
    position: absolute;
    left: -5%;
    width: 110%;
    height: 1px;
    opacity: .45;
}

.data-center-cta::before {
    top: 18px;
    background: linear-gradient(90deg, transparent, #C9A44C 32%, transparent 65%);
    transform: rotate(-1deg);
}

.data-center-cta::after {
    bottom: 22px;
    background: linear-gradient(90deg, transparent 25%, #1F6AE1 68%, transparent);
    transform: rotate(1deg);
}

.data-center-cta-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.25fr 1fr auto;
    gap: 70px;
    align-items: center;
}

.data-center-cta-inner h2 {
    margin: 0;
}

.data-center-cta-inner > p {
    margin: 22px 0 0;
}

.data-center-cta-inner > .btn {
    min-width: 170px;
}