/* Chetak MES product page: purpose-built visual treatment */
.mes-experience .mes-hero {
    min-height: 760px;
    background-image: url('../images/mes-product/hero-command-centre.webp');
    background-position: center center;
}

.mes-experience .mes-hero::before {
    background: linear-gradient(90deg, rgba(1, 10, 27, .98) 0%, rgba(1, 10, 27, .93) 35%, rgba(1, 10, 27, .48) 66%, rgba(1, 10, 27, .15) 100%);
}

/* The supplied photography reserves dark space for product messages. */
.mes-image-frame--message,
.mes-showcase__image--message,
.mes-focus__image { overflow: hidden; }
.mes-showcase__image--message { position: relative; }
.mes-image-callout { position: absolute; z-index: 2; top: 34px; left: 34px; width: min(47%, 255px); padding: 0; color: #fff; text-align: left; }
.mes-image-callout::before { display: block; width: 38px; height: 3px; margin-bottom: 13px; content: ''; background: #42c9ff; box-shadow: 0 0 14px rgba(66, 201, 255, .85); }
.mes-image-callout span { display: block; color: #73d9ff; font-size: 10px; font-weight: 800; letter-spacing: 1.45px; line-height: 1.4; text-transform: uppercase; }
.mes-image-callout strong { display: block; margin-top: 8px; color: #fff; font-family: var(--thm-font-2, 'Prompt', sans-serif); font-size: clamp(19px, 1.9vw, 27px); font-weight: 700; letter-spacing: -.5px; line-height: 1.13; }
.mes-image-callout p { margin: 11px 0 0; color: rgba(232, 247, 255, .84); font-size: 13px; line-height: 1.55; }
.mes-image-frame--message .mes-image-callout { top: 48px; left: 46px; }
.mes-showcase__image--message .mes-image-callout {
    top: 50%;
    left: 5.5%;
    width: min(37%, 390px);
    transform: translateY(-50%);
}
.mes-showcase__image--message .mes-image-callout::before { width: 56px; height: 4px; margin-bottom: 19px; }
.mes-showcase__image--message .mes-image-callout strong { margin-top: 11px; font-size: clamp(31px, 3.25vw, 48px); letter-spacing: -1.1px; line-height: 1.05; }
.mes-showcase__image--message .mes-image-callout p { max-width: 345px; margin-top: 19px; font-size: 15px; line-height: 1.7; }
.mes-image-callout__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.mes-image-callout__tags b { padding: 8px 10px; border: 1px solid rgba(115, 217, 255, .46); border-radius: 2px; background: rgba(22, 124, 183, .13); color: #9be4ff; font-size: 9px; font-weight: 800; letter-spacing: 1px; line-height: 1; text-transform: uppercase; }
.mes-focus__image .mes-image-callout--quality { top: 13%; left: 5%; }
.mes-focus__image .mes-image-callout--quality p { max-width: 210px; }

.mes-product-story__content { top: 42px; right: auto; bottom: auto; left: 38px; width: min(48%, 255px); }
.mes-product-story__content::before { display: block; width: 38px; height: 3px; margin-bottom: 14px; content: ''; background: #55d4ff; box-shadow: 0 0 14px rgba(85, 212, 255, .7); }
.mes-product-story__content h3 { font-size: 27px; line-height: 1.12; }

.mes-product-stories { padding: 116px 0 122px; background: #061831; }
.mes-product-stories .mes-section-head { max-width: 720px; }
.mes-product-stories .mes-heading { color: #fff; }
.mes-product-stories .mes-section-head p { color: rgba(255,255,255,.72); }
.mes-product-stories__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.mes-product-story { position: relative; min-height: 515px; overflow: hidden; border: 1px solid rgba(76, 197, 255, .35); border-radius: 10px; background: #071d3c; box-shadow: 0 24px 55px rgba(0,0,0,.22); }
.mes-product-story::after { position: absolute; inset: 0; content: ''; background: linear-gradient(180deg, rgba(1,14,34,0) 30%, rgba(1,13,31,.96) 94%); pointer-events: none; }
.mes-product-story img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .65s ease; }
.mes-product-story:hover img { transform: scale(1.04); }
.mes-product-story__content { position: absolute; z-index: 1; top: 42px; right: auto; bottom: auto; left: 38px; width: min(48%, 255px); color: #fff; }
.mes-product-story__content span { color: #55d4ff; font-size: 12px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.mes-product-story__content h3 { margin: 9px 0 10px; color: #fff; font-family: var(--thm-font-2, 'Prompt', sans-serif); font-size: 27px; font-weight: 700; line-height: 1.12; }
.mes-product-story__content p { max-width: 470px; margin: 0; color: rgba(255,255,255,.79); font-size: 15px; line-height: 1.7; }

@media (max-width: 991px) { .mes-product-stories__grid { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
    .mes-experience .mes-hero { min-height: 680px; background-position: 62% center; }
    .mes-product-stories { padding: 75px 0; }
    .mes-product-story { min-height: 410px; }
    .mes-product-story__content { top: 28px; right: auto; bottom: auto; left: 24px; width: 56%; }
    .mes-product-story__content h3 { font-size: 23px; }
    .mes-image-callout, .mes-image-frame--message .mes-image-callout { top: 25px; left: 25px; width: 52%; }
    .mes-showcase__image--message .mes-image-callout { top: 50%; left: 7%; width: 43%; transform: translateY(-50%); }
    .mes-showcase__image--message .mes-image-callout strong { font-size: clamp(23px, 5vw, 31px); }
    .mes-showcase__image--message .mes-image-callout p { margin-top: 13px; font-size: 12px; }
    .mes-showcase__image--message .mes-image-callout__tags { margin-top: 16px; }
    .mes-focus__image .mes-image-callout--quality { top: 9%; left: 5%; }
    .mes-image-callout strong { font-size: 20px; }
    .mes-image-callout p { font-size: 11px; }
}