/* Portfolio narrative: Data -> governed data -> DataIA */
.portfolio-hero {
    min-height: 760px;
    padding: 156px 0 88px;
    overflow: hidden;
    background: #09121d;
    position: relative;
}

.portfolio-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.45;
    background-image: linear-gradient(rgba(116, 171, 192, 0.11) 1px, transparent 1px), linear-gradient(90deg, rgba(116, 171, 192, 0.11) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.35) 58%, transparent 100%);
}

.portfolio-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
    gap: 72px;
    align-items: center;
}

.portfolio-hero-copy, .hero-product-proof { position: relative; z-index: 1; }
.portfolio-kicker { color: #79d2c4; font-size: 0.76rem; font-weight: 800; letter-spacing: 0.14em; }
.portfolio-hero h1 { max-width: 11ch; margin: 18px 0 22px; color: #f5f9fa; font-family: var(--font-heading); font-size: clamp(3.4rem, 6vw, 6rem); line-height: 0.94; letter-spacing: 0; }
.portfolio-lede { max-width: 56ch; color: #b7c7cd; font-size: 1.12rem; line-height: 1.7; }
.hero-text-link { align-self: center; color: #dce8e8; font-size: 0.92rem; font-weight: 700; }
.hero-text-link i { margin-left: 8px; color: #79d2c4; }
.hero-proof-line { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 34px; color: #93abb5; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; }
.hero-proof-line span::before { content: '•'; color: #ff9d3f; margin-right: 8px; }

.hero-product-proof { margin: 0; border: 1px solid #284552; border-radius: 4px; background: #e9edf0; box-shadow: 20px 24px 0 rgba(0, 0, 0, 0.18); overflow: hidden; transform: rotate(1.8deg); }
.proof-toolbar { height: 40px; display: flex; align-items: center; gap: 7px; padding: 0 13px; color: #71909a; background: #162a35; font-size: 0.62rem; letter-spacing: 0.08em; }
.proof-toolbar span { width: 7px; height: 7px; border-radius: 50%; background: #568295; }
.proof-toolbar strong { margin-left: 6px; font-size: 0.6rem; }
.proof-toolbar em { margin-left: auto; color: #81d7c7; font-style: normal; font-weight: 800; }
.hero-product-proof img { display: block; width: 100%; height: 370px; object-fit: cover; object-position: 55% 49%; filter: saturate(0.8) contrast(1.04); }
.hero-product-proof figcaption { display: flex; gap: 10px; align-items: flex-start; padding: 16px 18px; color: #3a5964; background: #edf4f5; font-size: 0.82rem; font-weight: 600; line-height: 1.45; }
.hero-product-proof figcaption i { color: #0f7a70; margin-top: 3px; }

.data-journey { padding: 104px 0; background: #e9efef; color: #152b34; }
.journey-heading { max-width: 720px; }
.journey-heading h2 { max-width: 14ch; margin: 14px 0; font-family: var(--font-heading); font-size: clamp(2.5rem, 4.5vw, 4.3rem); line-height: 0.98; letter-spacing: 0; }
.journey-heading p { color: #587078; font-size: 1.05rem; }
.journey-map { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 60px; border-top: 1px solid #9db0b4; }
.journey-stage { min-height: 290px; position: relative; padding: 26px 28px 28px 0; border-right: 1px solid #9db0b4; }
.journey-stage + .journey-stage { padding-left: 28px; }
.journey-stage:last-child { border-right: 0; }
.journey-stage::before { content: ''; position: absolute; top: -7px; left: 0; width: 13px; height: 13px; border-radius: 50%; background: #122d3a; box-shadow: 0 0 0 5px #e9efef; }
.journey-stage-mdm::before { background: #d97825; }
.journey-stage-onto::before { background: #0b9182; }
.journey-index { display: block; color: #688087; font-family: var(--font-heading); font-size: 1.2rem; font-weight: 700; }
.journey-signal { display: block; margin-top: 28px; color: #587078; font-size: 0.69rem; font-weight: 800; letter-spacing: 0.12em; }
.journey-stage h3 { margin-top: 8px; font-family: var(--font-heading); font-size: 1.7rem; letter-spacing: 0; }
.journey-stage p { min-height: 74px; margin-top: 12px; color: #526a73; line-height: 1.55; }
.journey-stage a { color: #0d5358; font-size: 0.85rem; font-weight: 800; }
.journey-stage a i { margin-left: 6px; }

.products { background: #0c1924; }
.products .section-header { max-width: 700px; }
.product-cards-grid { gap: 14px; }
.product-card-equal { padding: 0 0 26px !important; border-radius: 4px !important; background: #122431 !important; box-shadow: none !important; overflow: hidden; }
.product-card-equal:hover { transform: translateY(-5px); border-color: #60808c !important; box-shadow: 0 18px 38px rgba(0,0,0,0.25) !important; }
.product-card-equal > :not(.portfolio-product-media) { margin-left: 26px; margin-right: 26px; }
.portfolio-product-media { height: 176px; position: relative; overflow: hidden; border-bottom: 1px solid rgba(154, 188, 197, 0.18); background: #07131d; }
.portfolio-product-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0.78; transition: transform 0.5s ease, opacity 0.5s ease; }
.product-card-equal:hover .portfolio-product-media img { transform: scale(1.04); opacity: 0.95; }
.portfolio-product-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(7, 19, 29, 0.8)); }
.portfolio-product-media span { position: absolute; z-index: 1; bottom: 15px; left: 18px; color: #f2f8f8; font-size: 0.67rem; font-weight: 800; letter-spacing: 0.12em; }
.product-card-equal .product-label { margin-top: 24px; }
.product-card-equal .product-name { font-size: clamp(1.8rem, 2vw, 2.35rem); }
.product-card-equal ul { margin-top: 4px; }
.product-card-actions { margin-top: auto !important; }

@media (min-width: 761px) and (max-width: 1000px) {
    .portfolio-hero-grid { grid-template-columns: minmax(0, 0.88fr) minmax(330px, 1.12fr); gap: 32px; }
    .portfolio-hero h1 { font-size: clamp(2.7rem, 5vw, 4.2rem); }
    .hero-product-proof img { height: 300px; }
}

@media (max-width: 760px) {
    .portfolio-hero { min-height: auto; padding: 136px 0 72px; }
    .portfolio-hero-grid { grid-template-columns: 1fr; gap: 46px; }
    .portfolio-hero h1 { max-width: 14ch; }
    .hero-product-proof { max-width: 720px; transform: none; }
    .journey-map { grid-template-columns: 1fr; margin-top: 42px; border-top: 0; border-left: 1px solid #9db0b4; }
    .journey-stage, .journey-stage + .journey-stage { min-height: 0; padding: 0 0 34px 28px; border-right: 0; }
    .journey-stage::before { top: 0; left: -7px; }
    .journey-signal { margin-top: 14px; }
    .journey-stage p { min-height: 0; }
}

@media (max-width: 560px) {
    .portfolio-hero { padding-top: 118px; }
    .portfolio-hero h1 { font-size: clamp(2.7rem, 15vw, 4rem); }
    .hero-product-proof img { height: 240px; }
    .proof-toolbar strong { display: none; }
    .journey-heading h2 { font-size: 2.45rem; }
    .data-journey { padding: 72px 0; }
}