@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Montserrat:wght@400;500;600;700;800&display=swap');

html,
body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    font-family: "Manrope", "Montserrat", sans-serif;
}

:root{
    --jvc-primary-dark: #2a525d;
    --jvc-primary-deep: #1f424b;
    --jvc-primary-soft: #3f6d78;
    --jvc-accent: #8bbda2;
    --jvc-mint: #d1e8cb;
    --jvc-mint-soft: #e8f4e4;
    --jvc-text-muted: #4d636a;
    --jvc-ink: #0f2f35;
    --jvc-surface: #f7fbf6;
    --jvc-white: #ffffff;
    --jvc-ember: #ff4f22;
    --jvc-ember-deep: #e5451e;
}

body.jvc-landing{
    background:
        repeating-linear-gradient(90deg, rgba(42, 82, 93, 0.08) 0, rgba(42, 82, 93, 0.08) 1px, transparent 1px, transparent 38px),
        repeating-linear-gradient(0deg, rgba(42, 82, 93, 0.08) 0, rgba(42, 82, 93, 0.08) 1px, transparent 1px, transparent 38px),
        radial-gradient(circle at 18% 0%, #ffffff 0%, #f4fbf1 34%, #d1e8cb 100%);
    color: var(--jvc-ink);
    font-family: "Manrope", "Montserrat", sans-serif;
    position: relative;
    overflow-x: hidden;
}

body.jvc-landing h1,
body.jvc-landing h2,
body.jvc-landing h3,
body.jvc-landing h4,
body.jvc-landing h5{
    font-family: "Manrope", "Montserrat", sans-serif;
    font-weight: 700;
}

.jvc-topbar{
    background: linear-gradient(90deg, var(--jvc-primary-deep), var(--jvc-primary-dark));
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.92rem;
    padding: 12px 0;
    letter-spacing: 0.02em;
}
.jvc-topbar i{
    color: var(--jvc-mint);
    margin-right: 6px;
}
.jvc-social a{
    color: #fff;
    text-decoration: none;
}
.jvc-social a:hover{
    color: var(--jvc-mint);
}
.jvc-mainnav{
    background: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid rgba(42, 82, 93, 0.12);
    padding: 16px 0;
    backdrop-filter: blur(14px);
    box-shadow: 0 10px 30px rgba(16, 40, 46, 0.08);
}
.jvc-brand-logo{
    height: 80px;
    width: auto;
    display: block;
}
.jvc-mainnav .nav-link{
    color: var(--jvc-primary-deep);
    font-weight: 700;
    margin: 0 8px;
    padding: 8px 4px;
    border-bottom: 3px solid transparent;
    letter-spacing: 0.02em;
}
.jvc-mainnav .nav-link.active,
.jvc-mainnav .nav-link:hover{
    color: var(--jvc-primary-dark);
    border-bottom-color: var(--jvc-primary-dark);
}
.jvc-services-trigger{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: transparent;
    border: 0;
}
.jvc-services-trigger .material-icons-round{
    font-size: 18px;
}
.jvc-services-modal{
    position: fixed;
    inset: 0;
    z-index: 4000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 120px 20px 24px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}
.jvc-services-modal.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.jvc-services-modal__dialog{
    position: relative;
    z-index: 1;
    width: min(980px, 100%);
    max-height: calc(100vh - 140px);
    overflow: auto;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 251, 246, 0.98) 100%);
    border: 1px solid rgba(31, 66, 75, 0.12);
    box-shadow: 0 28px 70px rgba(10, 29, 33, 0.22);
}
.jvc-services-modal__grid{
    display: grid;
    grid-template-columns: 1fr;
}
.jvc-services-modal__item{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 15px;
    text-decoration: none;
    color: var(--jvc-primary-deep);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.jvc-services-modal__item:hover,
.jvc-services-modal__item.is-current{
    color: var(--jvc-primary-deep);
    transform: translateY(-2px);
    background: linear-gradient(135deg, rgba(42, 82, 93, 0.9), rgba(139, 189, 162, 0.9));
    box-shadow: 0 18px 36px rgba(16, 40, 46, 0.1);
    color: #fff
}
.jvc-services-modal__item-icon{
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(225, 9, 9, 0.1);
    color: #e10909;
    font-size: 22px;
}
.jvc-services-modal__item-copy{
    display: block;
}
.jvc-services-modal__item-title{
    display: block;
    font-weight: 800;
    line-height: 1.35;
}
.jvc-services-modal__item-meta{
    display: block;
    margin-top: 6px;
    color: var(--jvc-text-muted);
    font-size: 0.84rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.jvc-intranet-btn{
    background: linear-gradient(135deg, var(--jvc-primary-dark), var(--jvc-primary-deep));
    color: #fff;
    font-weight: 700;
    border-radius: 12px;
    padding: 10px 24px;
    border: 1px solid rgba(42, 82, 93, 0.2);
    box-shadow: 0 12px 26px rgba(42, 82, 93, 0.22);
}
.jvc-intranet-btn:hover{
    color: #fff;
    background: var(--jvc-primary-deep);
}
.carousel-control-prev,
.carousel-control-next{
    width: 7%;
    z-index: 20;
}
.carousel-control-prev-icon,
.carousel-control-next-icon{
    border-radius: 50%;
    background-color: rgba(42, 82, 93, 0.6);
    background-size: 50%;
}
.jvc-about-preview{
    background: linear-gradient(180deg, #f7fbf6 0%, #e1f0dc 100%);
    padding: 78px 0 90px;
}
.jvc-about-family{
    position: relative;
    padding: 86px 0;
    background: linear-gradient(90deg, #ffffff 0%, #ffffff 48%, #0f5b66 48%, #0a4852 100%);
    overflow: hidden;
}
.jvc-family-grid{
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: clamp(24px, 4vw, 54px);
    align-items: center;
}
.jvc-family-photo{
    background: #ffffff;
    border-right: 8px solid #e10909;
    box-shadow: 0 24px 50px rgba(16, 40, 46, 0.18);
}
.jvc-family-photo img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 4 / 3;
}
.jvc-family-content{
    color: #e9f4f6;
    padding: 10px 0;
}
.jvc-family-content__header{
    margin-bottom: 20px;
}
.jvc-family-content__header h2{
    margin-bottom: 14px;
    padding-left: 0;
    color: #ffffff;
}
.services-slider-header.jvc-family-content__header h2{
    color: #ffffff;
}
.jvc-family-content p{
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 18px;
    color: rgba(233, 244, 246, 0.92);
}
.jvc-about-principles{
    padding: 86px 0 94px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(247, 251, 246, 0.96) 100%);
}
.jvc-principles-stack{
    display: flex;
    flex-direction: column;
    gap: clamp(56px, 8vw, 92px);
}
.jvc-principles-row{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 480px);
    gap: clamp(32px, 5vw, 88px);
    align-items: center;
}
.jvc-principles-row-reverse{
    grid-template-columns: minmax(320px, 500px) minmax(0, 1fr);
}
.jvc-principles-copy{
    max-width: 720px;
}
.jvc-principles-copy-tight{
    max-width: 620px;
}
.jvc-principle-block + .jvc-principle-block{
    margin-top: 28px;
}
.jvc-principle-block h2{
    color: #00476a;
    font-size: clamp(2rem, 3vw, 2.65rem);
    letter-spacing: 0.02em;
    margin: 0 0 12px;
}
.jvc-principle-block h4{
    color: var(--jvc-primary-dark);
}
.jvc-principle-block p{
    margin: 0;
    color: #06364c;
    font-size: 1.12rem;
    line-height: 1.85;
    max-width: 720px;
}
.jvc-principles-photo{
    position: relative;
    margin: 0;
    cursor: zoom-in;
    justify-self: end;
}
.jvc-principles-row-reverse .jvc-principles-photo{
    justify-self: start;
}
.jvc-principles-photo__accent{
    position: absolute;
    display: block;
    height: 42px;
    background: linear-gradient(90deg, rgba(173, 173, 173, 0.95) 0%, rgba(240, 240, 240, 0.95) 88%);
    z-index: 0;
}
.jvc-principles-photo-top .jvc-principles-photo__accent{
    top: -40px;
    left: 28px;
    width: 72%;
}
.jvc-principles-photo-bottom .jvc-principles-photo__accent{
    top: -40px;
    left: 0;
    width: 78%;
}
.jvc-principles-photo img{
    position: relative;
    z-index: 1;
    display: block;
    width: min(100%, 500px);
    box-shadow: 0 20px 46px rgba(17, 39, 44, 0.14);
    image-rendering: -webkit-optimize-contrast; /* Para navegadores basados en Webkit */
    image-rendering: high-quality; /* Intenta mejorar la nitidez */
}
.jvc-principles-photo:focus-visible{
    outline: 3px solid var(--jvc-ember);
    outline-offset: 6px;
}
.jvc-about-timeline{
    padding: 18px 0 86px;
    background: #fff;
}
.jvc-about-timeline__list{
    max-width: 980px;
}
.jvc-about-timeline__item{
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}
.jvc-about-timeline__item + .jvc-about-timeline__item{
    margin-top: 38px;
}
.jvc-about-timeline__dot{
    width: 14px;
    height: 14px;
    border-radius: 50%;
    margin-top: 10px;
    background: #e58d8d;
}
.jvc-about-timeline__content{
    max-width: 860px;
}
.jvc-about-timeline__date{
    display: block;
    margin-bottom: 8px;
    font-size: 1.15rem;
    line-height: 1.2;
}
.jvc-about-timeline__content p{
    margin: 0;
    color: #06364c;
    font-size: 1.24rem;
    line-height: 1.6;
}
.jvc-about-policies{
    padding: 16px 0 96px;
    background: linear-gradient(180deg, #f7fbf6 0%, #ffffff 100%);
}
.jvc-about-policies__grid{
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: clamp(34px, 6vw, 84px);
    align-items: center;
}
.jvc-about-policies__docs{
    position: relative;
    min-height: 540px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 26px 0;
}
.jvc-about-policies__band{
    position: absolute;
    left: -8vw;
    right: -1vw;
    top: 50%;
    height: 42%;
    transform: translateY(-50%);
    background: linear-gradient(90deg, #ff4f22 0%, #ff4f22 62%, #e9471e 100%);
    border-radius: 0 14px 14px 0;
}
.jvc-about-policies__doc{
    position: relative;
    z-index: 1;
    margin: 0;
    flex: 1 1 0;
    max-width: 328px;
    background: #ffffff;
    padding: 18px;
    box-shadow: 0 24px 54px rgba(15, 35, 40, 0.14);
    cursor: zoom-in;
}
.jvc-about-policies__doc img{
    display: block;
    width: 100%;
    height: auto;
}
.jvc-about-policies__doc:focus-visible{
    outline: 3px solid var(--jvc-ember);
    outline-offset: 6px;
}
.jvc-about-policies__content p{
    color: var(--jvc-ink);
    font-size: 1.15rem;
    line-height: 1.7;
    margin: 24px 0 0;
}
.about-visual{
    position: relative;
    min-height: 520px;
    --about-main-left: 92px;
    --about-main-top: 72px;
    --about-main-width: min(380px, 72%);
    --about-main-height: 412px;
    --about-slot-shape-left: 18px;
    --about-slot-shape-top: 6px;
    --about-slot-overlay-left: calc(100% - min(308px, 56%));
    --about-slot-overlay-top: 14px;
    --about-scale-shape-x: 0.8947;
    --about-scale-shape-y: 0.8738;
    --about-scale-overlay-x: 0.8105;
    --about-scale-overlay-y: 0.8544;
}
.about-photo-shape{
    left: var(--about-slot-shape-left);
    top: var(--about-slot-shape-top);
    z-index: 1;
}
.about-photo{
    margin: 0;
    position: absolute;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 20px 46px rgba(17, 39, 44, 0.18);
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform, left, top;
    transform-origin: top left;
    left: var(--about-main-left);
    top: var(--about-main-top);
    width: var(--about-main-width);
    height: var(--about-main-height);
}
.about-photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.about-photo{
    cursor: zoom-in;
}
.about-photo:focus-visible{
    outline: 3px solid var(--jvc-ember);
    outline-offset: 4px;
}
.about-photo-main{
    z-index: 2;
    transform: scale(1, 1);
}
.about-photo-overlay{
    left: var(--about-slot-overlay-left);
    top: var(--about-slot-overlay-top);
    z-index: 0;
    transform: scale(var(--about-scale-overlay-x), var(--about-scale-overlay-y));
}
.about-photo-shape{
    transform: scale(var(--about-scale-shape-x), var(--about-scale-shape-y));
}
.about-photo-main{
    animation: aboutSwapMain 12s infinite ease-in-out;
}
.about-photo-overlay{
    animation: aboutSwapOverlay 12s infinite ease-in-out;
}
.about-photo-shape{
    animation: aboutSwapShape 12s infinite ease-in-out;
}
text-mutedx{
    color: var(--jvc-ink);
    font-size: 1.15rem;
    line-height: 1.7;
    margin: 0 0 20px;
}
@keyframes aboutSwapMain{
    0%,
    32% {
        left: var(--about-main-left);
        top: var(--about-main-top);
        transform: scale(1, 1);
        z-index: 2;
    }
    33%,
    65% {
        left: var(--about-slot-overlay-left);
        top: var(--about-slot-overlay-top);
        transform: scale(var(--about-scale-overlay-x), var(--about-scale-overlay-y));
        z-index: 0;
    }
    66%,
    100% {
        left: var(--about-slot-shape-left);
        top: var(--about-slot-shape-top);
        transform: scale(var(--about-scale-shape-x), var(--about-scale-shape-y));
        z-index: 1;
    }
}
@keyframes aboutSwapOverlay{
    0%,
    32% {
        left: var(--about-slot-overlay-left);
        top: var(--about-slot-overlay-top);
        transform: scale(var(--about-scale-overlay-x), var(--about-scale-overlay-y));
        z-index: 0;
    }
    33%,
    65% {
        left: var(--about-slot-shape-left);
        top: var(--about-slot-shape-top);
        transform: scale(var(--about-scale-shape-x), var(--about-scale-shape-y));
        z-index: 1;
    }
    66%,
    100% {
        left: var(--about-main-left);
        top: var(--about-main-top);
        transform: scale(1, 1);
        z-index: 2;
    }
}
@keyframes aboutSwapShape{
    0%,
    32% {
        left: var(--about-slot-shape-left);
        top: var(--about-slot-shape-top);
        transform: scale(var(--about-scale-shape-x), var(--about-scale-shape-y));
        z-index: 1;
    }
    33%,
    65% {
        left: var(--about-main-left);
        top: var(--about-main-top);
        transform: scale(1, 1);
        z-index: 2;
    }
    66%,
    100% {
        left: var(--about-slot-overlay-left);
        top: var(--about-slot-overlay-top);
        transform: scale(var(--about-scale-overlay-x), var(--about-scale-overlay-y));
        z-index: 0;
    }
}
@media (prefers-reduced-motion: reduce){
.about-photo-main,
    .about-photo-overlay,
    .about-photo-shape{
        animation: none;
    }
}
.about-years{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 196px;
    max-width: calc(100% - 16px);
    background: var(--jvc-primary-dark);
    color: #fff;
    border-radius: 12px;
    text-align: center;
    padding: 16px 14px;
    box-sizing: border-box;
    overflow: hidden;
    z-index: 3;
    box-shadow: 0 16px 30px rgba(16, 46, 53, 0.2);
}
.about-years strong{
    display: block;
    font-size: clamp(1.05rem, 3.8vw, 1.55rem);
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.about-years span{
    display: block;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 4px;
}
.about-content h2{
    color: var(--jvc-primary-dark);
    font-size: clamp(2rem, 3.6vw, 3.1rem);
    margin-bottom: 28px;
    padding-left: 14px;
    border-left: 5px solid #e10909;
}
.about-content p{
    color: var(--jvc-ink);
    font-size: 1.15rem;
    line-height: 1.7;
    margin: 0 0 20px;
}
.about-content ul{
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
}
.about-content li{
    position: relative;
    color: var(--jvc-ink);
    font-size: 1.12rem;
    line-height: 1.45;
    padding-left: 26px;
    margin-bottom: 10px;
}
.about-content li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: var(--jvc-primary-dark);
    box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.85);
}
.jvc-photo-modal{
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    z-index: 9999;
}
.jvc-photo-modal.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.jvc-photo-modal__overlay{
    position: absolute;
    inset: 0;
    background: rgba(8, 24, 28, 0.62);
}
.jvc-photo-modal__dialog{
    position: relative;
    z-index: 1;
    max-width: min(92vw, 980px);
    max-height: 88vh;
    background: #f8fbf7;
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 30px 70px rgba(15, 35, 40, 0.35);
    transform: scale(0.96);
    transition: transform 0.25s ease;
}
.jvc-photo-modal.is-open .jvc-photo-modal__dialog{
    transform: scale(1);
}
.jvc-photo-modal__image{
    display: block;
    width: 100%;
    height: auto;
    max-height: 78vh;
    object-fit: contain;
    border-radius: 14px;
    background: #0f2f35;
}
.jvc-photo-modal__close{
    position: absolute;
    top: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    color: #18363d;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 24px rgba(15, 35, 40, 0.2);
}
.jvc-photo-modal__close:hover{
    background: #e6f1e2;
}
body.jvc-modal-open{
    overflow: hidden;
}
.jvc-lab-carousel{
    background: #0f3c43;
}
.lab-slide{
    position: relative;
    height: 72vh;
}
.lab-slide-image{
    width: 100%;
    height: 72vh;
    object-fit: cover;
    display: block;
}
.lab-slide-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #0f3c43 0%, #1f515a 35%, rgba(31, 81, 90, 0.08) 80%, rgba(31, 81, 90, 0) 100%);
}
.lab-slide-content{
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 56px 90px;
    width: 100%;
    box-sizing: border-box;
    color: #cfe8dc;
    z-index: 2;
    margin-left: 0;
    margin-right: auto;
}
#jvcLabCarousel .reveal-target{
    opacity: 0;
    transform: translateX(-24px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
#jvcLabCarousel .reveal-target.is-visible{
    opacity: 1;
    transform: translateX(0);
}
@media (prefers-reduced-motion: reduce){
#jvcLabCarousel .reveal-target{
        opacity: 1;
        transform: none;
    }
}
.lab-slide-content h2{
    font-size: clamp(2rem, 3.4vw, 2.8rem);
    line-height: 1.12;
    font-weight: 800;
    margin-bottom: 14px;
    text-transform: uppercase;
    color: #cfe8dc;
}
.lab-slide-content p{
    font-size: 1rem;
    text-transform: uppercase;
    color: #cfe8dc;
    margin-bottom: 22px;
    letter-spacing: 0.02em;
}
.jvc-lab-carousel .carousel-indicators [data-bs-target]{
    background-color: #cfe8dc;
    width: 12px;
    height: 12px;
    border-radius: 50%;
}
.jvc-services-slider{
    padding: 70px 0 90px;
    background: #fff;
}
.jvc-services-page{
    padding: 70px 0 96px;
    background: #fff;
}
.service-detail-card{
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 16px 32px rgba(16, 40, 46, 0.12);
    display: flex;
    flex-direction: column;
}
.service-detail-media{
    width: 100%;
    overflow: hidden;
}
.service-detail-media img{
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
}
.service-detail-body{
    padding: 22px 20px 26px;
}
.service-detail-body h4{
    color: var(--jvc-primary-dark);
    font-weight: 700;
    margin-bottom: 10px;
}
.service-detail-body p{
    color: var(--jvc-ink);
}
.jvc-clients-slider{
    padding: 70px 0 90px;
    background: #fff;
    overflow: hidden;
}
.client-logo-card{
    background: #fff;
    border-radius: 18px;
    padding: 22px 18px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    min-height: 240px;
    min-width: 220px;
    flex: 0 0 220px;
}
.client-logo-card img{
    max-width: 100%;
    max-height: 140px;
    width: 100%;
    height: 140px;
    object-fit: contain;
}
.client-logo-card__caption{
    margin: 0;
    color: var(--jvc-primary-dark);
    font-size: 1rem;
    line-height: 1.3;
    text-align: center;
    font-weight: 500;
    text-wrap: balance;
}
.jvc-clients-marquee{
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: 30px;
    padding: 10px 0;
}
.jvc-clients-marquee__viewport{
    width: 100%;
    overflow: hidden;
}
.jvc-clients-marquee__track{
    display: flex;
    align-items: stretch;
    gap: 36px;
    width: max-content;
    padding: 0 18px;
    animation: jvcClientsMarquee 35s linear infinite;
}
.jvc-clients-marquee:hover .jvc-clients-marquee__track{
    animation-play-state: paused;
}
@keyframes jvcClientsMarquee{
    from{
        transform: translate3d(0, 0, 0);
    }
    to{
        transform: translate3d(-25%, 0, 0);
    }
}
@media (max-width: 991.98px){
    .client-logo-card{
        min-width: 180px;
        flex-basis: 180px;
        min-height: 210px;
        gap: 14px;
    }
    .client-logo-card img{
        max-height: 110px;
        height: 110px;
    }
    .client-logo-card__caption{
        font-size: 0.95rem;
    }
    .jvc-clients-marquee__track{
        gap: 24px;
        animation-duration: 27.5s;
    }
}
.destacados-container{
    width: min(1440px, calc(100% - 24px));
    max-width: 1440px;
}
.destacados-equal-col{
    display: flex;
}
.destacados-layout{
    align-items: stretch;
}
.destacados-copy{
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 420px;
    padding-right: 0;
}
.destacados-copy h5{
    font-size: clamp(1.65rem, 2vw, 2.15rem);
    line-height: 1.2;
    max-width: 14ch;
}
.destacados-copy .text-mutedx{
    color: var(--jvc-ink);
    font-size: 1.15rem;
    line-height: 1.7;
    margin: 0 0 20px;
    max-width: 34ch;
}
.destacados-copy__badge{
    margin-top: auto;
    padding-top: 28px;
}
.destacados-equal-col > #jvcShowcaseCarousel{
    flex: 1;
    display: flex;
    flex-direction: column;
}
.destacados-equal-col #jvcShowcaseCarousel .carousel-inner{
    min-height: 100%;
}
.destacados-equal-col #jvcShowcaseCarousel .carousel-item{
    min-height: 100%;
}
.destacados-equal-col #jvcShowcaseCarousel,
.destacados-equal-col #jvcShowcaseCarousel .carousel-inner,
.destacados-equal-col #jvcShowcaseCarousel .carousel-item,
.destacados-equal-col #jvcShowcaseCarousel .showcase-card,
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__row,
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__content-col,
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__media-col{
    height: 100%;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card{
    height: clamp(420px, 34vw, 535px);
    min-height: 420px;
    border: 0;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 24px 52px rgba(17, 39, 44, 0.12);
    overflow: hidden;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__body{
    height: 100%;
    padding: 2.1rem 2rem;
    display: flex;
    flex-direction: column;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__media-col{
    min-height: 420px;
    overflow: hidden;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__image{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__title{
    color: #364b73;
    font-size: clamp(1.55rem, 2.2vw, 2rem);
    line-height: 1.18;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__location{
    min-height: 3.2rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__list{
    display: grid;
    gap: 14px;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__item{
    min-height: 3.8rem;
    margin-bottom: 0 !important;
}
.destacados-equal-col #jvcShowcaseCarousel .showcase-card__item span{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#jvcShowcaseCarousel .carousel-indicators{
    position: static;
    margin: 0 0 18px;
    justify-content: center;
}
#jvcShowcaseCarousel .carousel-indicators [data-bs-target]{
    width: 34px;
    height: 4px;
    border: 0;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.74);
}
#jvcShowcaseCarousel .carousel-indicators .active{
    background-color: #ffffff;
}
#jvcShowcaseCarousel .carousel-control-prev,
#jvcShowcaseCarousel .carousel-control-next{
    width: 52px;
    opacity: 1;
}
#jvcShowcaseCarousel .carousel-control-prev{
    left: -18px;
}
#jvcShowcaseCarousel .carousel-control-next{
    right: -18px;
}
#jvcShowcaseCarousel .carousel-control-prev-icon,
#jvcShowcaseCarousel .carousel-control-next-icon{
    width: 42px;
    height: 42px;
    background-color: rgba(42, 82, 93, 0.18);
    background-size: 46%;
}
.services-slider-header h2{
    color: var(--jvc-primary-dark);;
}
.services-slider-header h3{
    color: var(--jvc-primary-dark);;
}
.services-slider-underline{
    display: inline-block;
    width: 140px;
    height: 3px;
    background: #e10909;
}
.services-slider-grid{
    margin-top: 36px;
}
.service-slide-card{
    position: relative;
    overflow: hidden;
    border-radius: 0;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.12);
    height: 100%;
}
.service-slide-card img{
    width: 100%;
    height: 450px;
    object-fit: cover;
    display: block;
}
.service-slide-overlay{
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.1) 55%, rgba(0, 0, 0, 0) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 18px;
    gap: 10px;
}
.service-slide-overlay h5{
    color: #fff;
    font-weight: 700;
    margin: 0;
    font-size: 1.05rem;
}
.service-tabs-wrapper{
    margin: 34px 0 48px;
}
.service-tabs{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
}
.service-tab{
    border: 1px solid rgba(31, 66, 75, 0.18);
    background: #fff;
    border-radius: 14px;
    padding: 18px 16px;
    text-align: center;
    font-weight: 700;
    color: var(--jvc-primary-deep);
    box-shadow: 0 10px 22px rgba(16, 40, 46, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
    min-height: 88px;
}
.service-tab:hover{
    transform: translateY(-3px);
    border-color: rgba(63, 109, 120, 0.4);
    box-shadow: 0 16px 30px rgba(16, 40, 46, 0.12);
}
.service-tab-title{
    display: block;
    font-size: 0.95rem;
    line-height: 1.3;
}
.service-tab-count{
    display: block;
    margin-top: 6px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(31, 66, 75, 0.55);
}
.service-tab.is-active{
    background: linear-gradient(135deg, var(--jvc-primary-dark), var(--jvc-primary-soft));
    color: #fff;
    border-color: transparent;
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(16, 40, 46, 0.22);
}
.service-tab.is-active .service-tab-count{
    color: rgba(255, 255, 255, 0.7);
}
.service-tab-panels{
    margin-top: 28px;
}
.service-tab-panel{
    display: none;
    animation: serviceTabFade 0.45s ease;
}
.service-tab-panel.is-active{
    display: block;
}
.service-tab-panel-header{
    text-align: center;
    margin-bottom: 24px;
}
.service-tab-panel-header h3{
    color: var(--jvc-primary-dark);
    margin-bottom: 6px;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
}
.service-tab-panel-header p{
    color: var(--jvc-text-muted);
    margin-bottom: 0;
}
@keyframes serviceTabFade{
    from{
        opacity: 0;
        transform: translateY(10px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}
.service-slide-btn{
    background: #e10909;
    color: #fff;
    font-weight: 700;
    border-radius: 0;
    padding: 8px 16px;
    width: fit-content;
}
.service-slide-btn:hover{
    color: #fff;
    background: #bf0808;
}
.service-category-block{
    margin: 32px 0 50px;
}
#jvcServicesSlider .carousel-control-prev,
#jvcServicesSlider .carousel-control-next{
    width: 3.2rem;
    height: 3.2rem;
    top: 48%;
    transform: translateY(-50%);
    opacity: 1;
}
#jvcServicesSlider .carousel-control-prev-icon,
#jvcServicesSlider .carousel-control-next-icon{
    background-color: #000;
    border-radius: 0;
    background-size: 55%;
}
#jvcServicesSlider .carousel-indicators{
    position: static;
    margin-top: 16px;
}
#jvcServicesSlider .carousel-indicators [data-bs-target]{
    background-color: #c9c9c9;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
#jvcServicesSlider .carousel-indicators .active{
    background-color: #111;
}
.jvc-footer{
    background: linear-gradient(180deg, #1a3c43 0%, var(--jvc-primary-deep) 100%);
    color: rgba(255, 255, 255, 0.95);
    padding: 64px 0 18px;
    position: relative;
    overflow: hidden;
}
.jvc-footer::before{
    content: "";
    position: absolute;
    inset: -120px auto auto -90px;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(209, 232, 203, 0.22) 0%, rgba(209, 232, 203, 0) 72%);
    pointer-events: none;
}
.jvc-footer h5{
    color: var(--jvc-mint);
    margin-bottom: 16px;
    font-size: 1.2rem;
}
.jvc-footer-brand p{
    margin-top: 16px;
    margin-bottom: 0;
    line-height: 1.7;
    max-width: 490px;
    color: rgba(255, 255, 255, 0.9);
}
.jvc-footer-logo{
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: center;
    padding: 14px 26px;
    border-radius: 999px;
    filter:
        drop-shadow(0 0 3px white)
        drop-shadow(0 0 6px white)
        drop-shadow(0 0 10px white);
}
.jvc-footer-brand-logo{
    height: 80px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}
.jvc-footer-tagline{
    display: block;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.74);
    font-size: 0.9rem;
    line-height: 1.3;
}
.jvc-footer-list,
.jvc-footer-links{
    list-style: none;
    margin: 0;
    padding: 0;
}
.jvc-footer-list li{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    line-height: 1.5;
}
.jvc-footer-list .material-icons{
    font-size: 19px;
    color: var(--jvc-mint-soft);
    margin-top: 2px;
}
.jvc-footer-links li{
    margin-bottom: 10px;
}
.jvc-footer-links a{
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    font-weight: 600;
}
.jvc-footer-links a:hover{
    color: var(--jvc-mint);
}
.jvc-footer-bottom{
    margin-top: 36px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    text-align: center;
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.98rem;
}
.jvc-whatsapp-btn{
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: #25d366;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 16px 30px rgba(20, 120, 65, 0.35);
    z-index: 1080;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.jvc-whatsapp-btn svg{
    width: 33px;
    height: 33px;
}
.jvc-whatsapp-btn:hover{
    color: #fff;
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 20px 34px rgba(20, 120, 65, 0.42);
}
@media (max-width: 1199px){
.jvc-about-preview{
        padding: 62px 0 70px;
    }
.jvc-about-family{
        padding: 70px 0;
    }
.jvc-about-principles{
        padding: 72px 0 80px;
    }
.jvc-family-photo{
        border-right-width: 6px;
    }
.about-visual{
        min-height: 480px;
        --about-main-left: 72px;
        --about-main-top: 72px;
        --about-main-width: min(346px, 70%);
        --about-main-height: 382px;
        --about-slot-shape-left: 10px;
        --about-slot-shape-top: 0;
        --about-slot-overlay-left: calc(100% - min(278px, 52%));
        --about-slot-overlay-top: 14px;
        --about-scale-shape-x: 0.9249;
        --about-scale-shape-y: 0.8639;
        --about-scale-overlay-x: 0.8035;
        --about-scale-overlay-y: 0.8220;
    }
.about-years{
        width: 182px;
    }
.about-years span{
        font-size: 1.4rem;
    }
.jvc-footer{
        padding-top: 54px;
    }
}
@media (max-width: 991px){
    .jvc-services-trigger{
        width: 100%;
        justify-content: space-between;
    }
    .jvc-services-modal{
        padding: 84px 14px 18px;
    }
    .jvc-services-modal__dialog{
        max-height: calc(100vh - 114px);
    }
    .jvc-services-modal__grid{
        grid-template-columns: 1fr;
    }
.jvc-about-preview{
        padding: 50px 0 58px;
    }
.jvc-about-policies{
        padding: 8px 0 84px;
    }
.jvc-about-family{
        padding: 60px 0;
        background: linear-gradient(180deg, #0f5b66 0%, #0a4852 100%);
    }
.jvc-family-grid{
        grid-template-columns: 1fr;
        gap: 28px;
    }
.jvc-about-policies__grid{
        grid-template-columns: 1fr;
        gap: 34px;
    }
.jvc-about-policies__docs{
        min-height: auto;
        justify-content: center;
        flex-wrap: wrap;
        padding: 22px 0 8px;
    }
.jvc-about-policies__band{
        left: -24px;
        right: -24px;
        height: 180px;
        border-radius: 0;
    }
.jvc-about-policies__doc{
        max-width: min(100%, 320px);
    }
.jvc-about-policies__doc--offset{
        transform: none;
    }
    .jvc-about-principles{
        padding: 60px 0 68px;
    }
.jvc-about-timeline{
        padding: 8px 0 70px;
    }
.jvc-principles-stack{
        gap: 48px;
    }
.jvc-principles-row,
    .jvc-principles-row-reverse{
        grid-template-columns: 1fr;
        gap: 28px;
    }
.jvc-principles-photo,
    .jvc-principles-row-reverse .jvc-principles-photo{
        justify-self: stretch;
        order: 2;
    }
.jvc-principles-copy{
        max-width: none;
        order: 1;
    }
.jvc-principles-photo img{
        width: 100%;
        max-width: none;
    }
.jvc-principles-photo-top .jvc-principles-photo__accent,
    .jvc-principles-photo-bottom .jvc-principles-photo__accent{
        top: -24px;
        left: 18px;
        width: 68%;
        height: 28px;
    }
.jvc-family-content{
        padding-top: 0;
    }
.about-visual{
        min-height: 420px;
        --about-main-left: 44px;
        --about-main-top: 46px;
        --about-main-width: min(308px, 68%);
        --about-main-height: 334px;
        --about-slot-shape-left: 10px;
        --about-slot-shape-top: 0;
        --about-slot-overlay-left: calc(100% - min(244px, 48%));
        --about-slot-overlay-top: 14px;
        --about-scale-shape-x: 0.9740;
        --about-scale-shape-y: 0.8982;
        --about-scale-overlay-x: 0.7922;
        --about-scale-overlay-y: 0.8204;
    }
.about-photo-main,
    .about-photo-overlay,
    .about-photo-shape{
        animation: none;
    }
.about-years{
        right: 24px;
        width: 168px;
        padding: 14px 12px;
    }
.jvc-about-policies__content p{
        font-size: 1rem;
    }
.jvc-family-content__header h2{
        margin-bottom: 12px;
    }
.about-content h2{
        margin-bottom: 18px;
    }
.about-content p,
    .about-content li{
        font-size: 1rem;
    }
    .jvc-mainnav{
        padding: 12px 0;
    }
.jvc-brand-logo{
        height: 44px;
    }
.jvc-mainnav .nav-link{
        margin: 0;
        border-bottom: 0;
    }
.jvc-footer{
        padding-top: 46px;
    }
.lab-slide{
        height: 56vh;
    }
.lab-slide-image{
        height: 56vh;
    }
.lab-slide-content{
        padding: 0 36px;
        max-width: 100%;
    }
.lab-slide-content h2{
        font-size: 1.8rem;
    }
.service-slide-card img{
        height: 320px;
    }
.service-detail-media img{
        height: 220px;
    }
.service-tabs{
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    }
.jvc-footer h5{
        margin-bottom: 12px;
    }
.jvc-footer-bottom{
        margin-top: 28px;
        font-size: 0.9rem;
    }
.jvc-whatsapp-btn{
        width: 56px;
        height: 56px;
        right: 14px;
        bottom: 14px;
    }
.jvc-whatsapp-btn svg{
        width: 30px;
        height: 30px;
    }
}
@media (max-width: 575px){
.about-visual{
        min-height: 352px;
    }
.jvc-about-policies__band{
        height: 132px;
    }
.jvc-about-family{
        padding: 52px 0;
    }
    .jvc-about-principles{
        padding: 48px 0 54px;
    }
.jvc-about-timeline{
        padding: 0 0 54px;
    }
.jvc-about-timeline__date{
        font-size: 1rem;
    }
.jvc-about-timeline__content p{
        font-size: 1rem;
        line-height: 1.55;
    }
.jvc-about-timeline__item + .jvc-about-timeline__item{
        margin-top: 28px;
    }
.jvc-principles-stack{
        gap: 38px;
    }
.jvc-principle-block h2{
        font-size: 1.8rem;
    }
.jvc-principle-block p{
        font-size: 1rem;
        line-height: 1.75;
    }
.jvc-principles-photo-top .jvc-principles-photo__accent,
    .jvc-principles-photo-bottom .jvc-principles-photo__accent{
        top: -18px;
        left: 14px;
        width: 64%;
        height: 22px;
    }
.jvc-family-photo{
        border-right-width: 4px;
        padding: 14px;
    }
.jvc-family-content h2{
        font-size: 1.7rem;
    }
.about-photo-shape{
        width: min(220px, 70%);
        left: 6px;
    }
.about-photo-main{
        left: 20px;
        width: min(270px, 76%);
        height: 278px;
        border-radius: 20px;
    }
.about-photo-overlay{
        left: calc(100% - min(178px, 48%));
        top: 20px;
        width: min(178px, 48%);
        height: 200px;
        border-radius: 20px;
    }
.about-photo-shape{
        left: 6px;
        top: 0;
        width: min(220px, 70%);
        height: 220px;
        border-radius: 20px;
    }
.about-years{
        right: 8px;
        width: 148px;
    }
.about-years span{
        font-size: 1.2rem;
    }
.lab-slide-content{
        padding: 0 22px;
    }
.lab-slide-content h2{
        font-size: 1.5rem;
    }
.service-slide-card img{
        height: 260px;
    }
.service-detail-media img{
        height: 200px;
    }
.service-tabs{
        display: flex;
        overflow-x: auto;
        gap: 12px;
        padding-bottom: 8px;
    }
.service-tab{
        min-width: 210px;
        flex: 0 0 auto;
    }
.lab-slide{
        height: 52vh;
    }
.lab-slide-image{
        height: 52vh;
    }
}
.jvc-project-catalog{
    padding: 82px 0 96px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(232, 244, 228, 0.96) 100%);
}
.project-grid{
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: 110px;
    gap: 18px;
}
.project-card{
    position: relative;
    overflow: hidden;
    min-height: 280px;
    border-radius: 0;
    background: #12343d;
    cursor: pointer;
    box-shadow: 0 20px 42px rgba(15, 35, 40, 0.14);
    grid-column: span 4;
    grid-row: span 3;
}
.project-card--wide{
    grid-column: span 6;
}
.project-card--tall{
    grid-row: span 4;
}
.project-card img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(1);
    transform: scale(1.02);
    transition: transform 0.5s ease, filter 0.45s ease;
}
.project-card__shade{
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8, 33, 42, 0.08) 0%, rgba(8, 33, 42, 0.84) 100%);
    transition: opacity 0.35s ease, background 0.35s ease;
}
.project-card__content{
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 22px 22px 20px;
    color: #fff;
}
.project-card__meta{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: auto;
}
.project-card__meta span{
    padding: 6px 10px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(8px);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.project-card__detail{
    transform: translateY(18px);
    opacity: 0;
    transition: transform 0.35s ease, opacity 0.35s ease;
}
.project-card__detail p{
    margin: 0 0 8px;
    color: rgba(255, 255, 255, 0.96);
    font-size: 0.95rem;
    line-height: 1.45;
}
.project-card__detail p:last-child{
    margin-bottom: 0;
    color: rgba(255, 255, 255, 0.82);
}
.project-card:hover img,
.project-card:focus-visible img,
.project-card.is-active img{
    filter: grayscale(0);
    transform: scale(1.06);
}
.project-card:hover .project-card__shade,
.project-card:focus-visible .project-card__shade,
.project-card.is-active .project-card__shade{
    background: linear-gradient(180deg, rgba(10, 46, 59, 0.05) 0%, rgba(10, 46, 59, 0.78) 60%, rgba(10, 46, 59, 0.92) 100%);
}
.project-card:hover .project-card__detail,
.project-card:focus-visible .project-card__detail,
.project-card.is-active .project-card__detail{
    transform: translateY(0);
    opacity: 1;
}
.project-card:focus-visible{
    outline: 3px solid #ff5a1a;
    outline-offset: 4px;
}
.project-loading{
    margin-top: 28px;
    text-align: center;
    color: #1f424b;
    font-weight: 700;
}
#project-sentinel{
    width: 100%;
    height: 2px;
}
.jvc-blog-catalog{
    padding: 82px 0 96px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(232, 244, 228, 0.98) 100%);
}
.blog-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px;
}
.blog-card{
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(15, 35, 40, 0.12);
    overflow: hidden;
}
.blog-card__media{
    display: block;
    aspect-ratio: 16 / 8;
    overflow: hidden;
}
.blog-card__media img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s ease;
}
.blog-card:hover .blog-card__media img{
    transform: scale(1.04);
}
.blog-card__body{
    padding: 26px 30px 18px;
}
.blog-card__body h3{
    margin: 0 0 14px;
    color: #0c3553;
    font-size: clamp(1.45rem, 2vw, 2.15rem);
    line-height: 1.2;
}
.blog-card__body h3 a{
    color: inherit;
    text-decoration: none;
}
.blog-card__body p{
    margin: 0 0 24px;
    color: #49636d;
    font-size: 1.05rem;
    line-height: 1.65;
}
.blog-card__link{
    color: #003f63;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
}
.blog-card__footer{
    border-top: 1px solid rgba(12, 53, 83, 0.1);
    padding: 16px 30px;
    color: #9aa8b0;
    font-size: 0.95rem;
}
.blog-detail{
    padding: 54px 0 90px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(247, 251, 246, 0.96) 100%);
}
.blog-detail .container{
    max-width: 1080px;
}
.blog-detail__hero{
    margin-bottom: 24px;
}
.blog-detail__hero img{
    width: 100%;
    display: block;
    box-shadow: 0 22px 44px rgba(12, 53, 83, 0.12);
}
.blog-detail__meta{
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-bottom: 28px;
    color: #ff5a1a;
    font-size: 1.05rem;
}
.blog-detail__meta span{
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.blog-detail__meta .material-icons{
    font-size: 18px;
}
.blog-detail__header{
    max-width: 900px;
    margin-bottom: 36px;
}
.blog-detail__header h1{
    margin: 0 0 18px;
    color: #00476a;
    font-size: clamp(2.35rem, 4vw, 4rem);
    line-height: 1.08;
}
.blog-detail__header p{
    margin: 0;
    color: #335664;
    font-size: 1.18rem;
    line-height: 1.8;
}
.blog-detail__content{
    color: #09364c;
    font-size: 1.08rem;
    line-height: 1.85;
}
.blog-detail__content > * + *{
    margin-top: 1.3rem;
}
.blog-detail__content h2,
.blog-detail__content h3,
.blog-detail__content h4{
    color: #00476a;
    line-height: 1.18;
    margin-top: 2.1rem;
    margin-bottom: 0.8rem;
}
.blog-detail__content img,
.blog-detail__content iframe,
.blog-detail__content video,
.blog-detail__content table{
    max-width: 100%;
}
.blog-detail__content img,
.blog-detail__content iframe,
.blog-detail__content video{
    display: block;
    height: auto;
}
.blog-detail__content iframe{
    min-height: 360px;
    width: 100%;
}
.blog-detail__content table{
    width: 100%;
}
.blog-detail__content blockquote{
    margin: 1.6rem 0;
    padding: 1rem 1.25rem;
    border-left: 4px solid #ff5a1a;
    background: rgba(255, 90, 26, 0.06);
}
#contact-sentinel{
    width: 100%;
    height: 2px;
}
.jvc-contact-page{
    padding: 72px 0 96px;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.98), rgba(232, 244, 228, 0.94)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(247, 251, 246, 0.98) 100%);
}
.jvc-contact-hero{
    display: grid;
    grid-template-columns: minmax(300px, 0.86fr) minmax(0, 1.14fr);
    gap: clamp(28px, 5vw, 72px);
    align-items: center;
    margin-bottom: 56px;
}
.jvc-contact-visual{
    position: relative;
    min-height: 560px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.jvc-contact-visual__shape,
.jvc-contact-visual__outline{
    position: absolute;
    border-radius: 42px;
    transform: rotate(-18deg);
}
.jvc-contact-visual__shape{
    width: min(390px, 82%);
    height: 420px;
    left: 18%;
    bottom: 52px;
    background: linear-gradient(180deg, #ff5a1a 0%, #ef4b22 100%);
    box-shadow: 0 28px 58px rgba(255, 79, 34, 0.18);
}
.jvc-contact-visual__outline{
    width: min(430px, 90%);
    height: 420px;
    left: 8%;
    bottom: 86px;
    border: 1px solid rgba(255, 79, 34, 0.65);
    background: transparent;
}
.jvc-contact-visual img{
    position: relative;
    z-index: 1;
    width: min(530px, 88%);
    max-height: 750px;
    object-fit: cover;
    object-position: center top;
    filter: drop-shadow(0 22px 40px rgba(15, 35, 40, 0.16));
}
.jvc-contact-card{
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(12, 53, 83, 0.08);
    box-shadow: 0 22px 44px rgba(15, 35, 40, 0.1);
    padding: clamp(28px, 4vw, 42px);
}
.jvc-contact-card h3{
    margin: 0 0 24px;
    color: #00476a;
    font-size: clamp(2rem, 3.2vw, 3rem);
    line-height: 1.05;
}
.jvc-contact-form .form-label{
    color: #003f63;
    font-weight: 700;
    margin-bottom: 8px;
}
.jvc-contact-form .form-control{
    border: 1px solid rgba(12, 53, 83, 0.12);
    border-radius: 0;
    min-height: 56px;
    background: #ffffff;
    padding: 14px 16px;
    color: #113641;
    box-shadow: none;
}
.jvc-contact-form textarea.form-control{
    min-height: 150px;
    resize: vertical;
}
.jvc-contact-form .form-control:focus{
    border-color: #e10909;
    box-shadow: 0 0 0 4px rgba(255, 90, 26, 0.12);
}
.jvc-contact-submit{
    width: 100%;
    margin-top: 22px;
    padding: 14px 20px;
    border: 0;
    border-radius: 5px;
    background: linear-gradient(90deg, #e10909 0%, #e10909 100%);
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    box-shadow: 0 18px 28px rgba(255, 79, 34, 0.16);
}
.jvc-contact-submit:hover{
    color: #ffffff;
    transform: translateY(-1px);
}
.jvc-contact-direct{
    margin-top: 26px;
}
.jvc-contact-direct h4{
    margin: 0 0 18px;
    color: #00476a;
    font-size: clamp(1.7rem, 2.4vw, 2.5rem);
}
.jvc-contact-direct__list{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.jvc-contact-direct__list li{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #06364c;
    font-size: 1.02rem;
    line-height: 1.6;
}
.jvc-contact-direct__list .material-icons{
    color: #00476a;
    font-size: 20px;
    margin-top: 2px;
}
.jvc-contact-direct__list a{
    color: inherit;
}
.jvc-contact-locations{
    margin-top: 18px;
}
.jvc-contact-map-card{
    height: 100%;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(12, 53, 83, 0.08);
    box-shadow: 0 20px 40px rgba(15, 35, 40, 0.08);
    overflow: hidden;
}
.jvc-contact-map-card__header{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 22px 24px 18px;
}
.jvc-contact-map-card__pin{
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(0, 71, 106, 0.08);
    color: #00476a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}
.jvc-contact-map-card__header h5{
    margin: 0 0 4px;
    color: #003f63;
    font-size: 1.24rem;
}
.jvc-contact-map-card__header p{
    margin: 0;
    color: #335664;
    line-height: 1.6;
}
.jvc-contact-map-card__frame{
    position: relative;
    aspect-ratio: 16 / 9;
    background: #e9eef3;
}
.jvc-contact-map-card__frame iframe{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
#blog-sentinel{
    width: 100%;
    height: 2px;
}
@media (max-width: 991px){
    .jvc-contact-page{
        padding: 56px 0 72px;
    }
    .jvc-contact-hero{
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 40px;
    }
    .jvc-contact-visual{
        min-height: 420px;
    }
    .jvc-contact-visual__shape{
        left: 22%;
        bottom: 36px;
        height: 320px;
    }
    .jvc-contact-visual__outline{
        left: 10%;
        bottom: 60px;
        height: 320px;
    }
    .jvc-contact-visual img{
        max-height: 400px;
    }
    .jvc-project-catalog{
        padding: 64px 0 76px;
    }
    .jvc-blog-catalog{
        padding: 64px 0 76px;
    }
    .project-grid{
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .blog-grid{
        gap: 24px;
    }
    .project-card,
    .project-card--wide{
        grid-column: span 3;
    }
}
@media (max-width: 767px){
    .destacados-container{
        width: min(100%, calc(100% - 24px));
    }
    .destacados-copy{
        max-width: none;
        padding-right: 0;
    }
    .destacados-copy .text-mutedx{
        max-width: none;
    }
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card,
    .destacados-equal-col #jvcShowcaseCarousel .carousel-item{
        min-height: 0;
        height: auto;
    }
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__row,
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__content-col,
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__media-col{
        height: auto;
    }
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__body{
        padding: 1.5rem;
    }
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__media-col{
        min-height: 240px;
    }
    .destacados-equal-col #jvcShowcaseCarousel .showcase-card__image{
        min-height: 240px;
        border-radius: 0 0 1rem 1rem;
    }
    #jvcShowcaseCarousel .carousel-control-prev{
        left: 4px;
    }
    #jvcShowcaseCarousel .carousel-control-next{
        right: 4px;
    }
    .jvc-contact-card{
        padding: 24px 20px;
    }
    .jvc-contact-visual{
        min-height: 340px;
        padding: 10px;
    }
    .jvc-contact-visual__shape{
        width: min(280px, 80%);
        height: 240px;
        left: 16%;
        bottom: 30px;
    }
    .jvc-contact-visual__outline{
        width: min(320px, 92%);
        height: 240px;
        left: 4%;
        bottom: 46px;
    }
    .jvc-contact-visual img{
        width: min(280px, 82%);
        max-height: 320px;
    }
    .jvc-contact-map-card__header{
        padding: 20px 18px 16px;
    }
    .blog-grid{
        grid-template-columns: 1fr;
    }
    .blog-card__body{
        padding: 22px 20px 16px;
    }
    .blog-card__footer{
        padding: 16px 20px;
    }
    .blog-detail{
        padding: 34px 0 62px;
    }
    .blog-detail__meta{
        gap: 12px;
        font-size: 0.95rem;
    }
    .blog-detail__content iframe{
        min-height: 220px;
    }
    .project-grid{
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }
    .project-card,
    .project-card--wide,
    .project-card--tall{
        grid-column: auto;
        grid-row: auto;
        min-height: 340px;
    }
    .project-card__detail{
        opacity: 0;
    }
.project-card.is-active .project-card__detail{
        opacity: 1;
    }
}
.jvc-capability-page{
    padding: 0 0 96px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.68) 0%, rgba(232, 244, 228, 0.92) 100%);
}
.capability-page-header{
    max-width: 760px;
    margin: 0 auto 34px;
}
.capability-page-header p{
    margin: 18px auto 0;
    color: #335664;
    font-size: 1.05rem;
    line-height: 1.7;
}
.capability-hero-stack{
    position: relative;
    margin-bottom: 68px;
}
.capability-hero-panel{
    display: none;
    position: relative;
    min-height: clamp(320px, 28vw, 500px);
    overflow: hidden;
    border-radius: 0;
    background-image: var(--capability-hero-image);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    box-shadow: 0 22px 48px rgba(15, 35, 40, 0.14);
}
.capability-hero-panel.is-active{
    display: flex;
    align-items: stretch;
}
.capability-hero-panel__inner{
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    width: 100%;
    padding-top: clamp(56px, 8vw, 96px);
    padding-bottom: clamp(52px, 7vw, 86px);
}
.capability-hero-panel__copy{
    max-width: min(720px, 100%);
    color: #fff;
}
.capability-hero-panel__shade{
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(8, 31, 43, 0.08) 0%, rgba(10, 37, 52, 0.28) 36%, rgba(14, 49, 72, 0.82) 100%),
        linear-gradient(90deg, rgba(10, 38, 54, 0.6) 0%, rgba(10, 38, 54, 0.18) 42%, rgba(10, 38, 54, 0) 72%);
}
.capability-hero-panel__eyebrow,
.capability-services-panel__eyebrow,
.capability-cta-card__eyebrow{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(42, 82, 93, 0.1);
    color: #264b56;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.capability-hero-panel__eyebrow{
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
}
.capability-hero-panel__copy h1{
    margin: 0 0 14px;
    color: #ffffff;
    font-size: clamp(2.45rem, 4.2vw, 4.3rem);
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.03em;
    text-shadow: 0 10px 28px rgba(10, 29, 33, 0.24);
}
.capability-hero-panel__copy p{
    margin: 0;
    max-width: 920px;
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(0.98rem, 1.15vw, 1.12rem);
    font-weight: 500;
    line-height: 1.55;
    text-shadow: 0 8px 22px rgba(10, 29, 33, 0.22);
}
.capability-hero-panel__actions{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}
.capability-hero-panel__primary-btn{
    background: #ffffff;
    color: #1a4f73;
    font-weight: 800;
    border-radius: 999px;
    padding: 12px 24px;
    box-shadow: 0 16px 28px rgba(12, 38, 51, 0.14);
}
.capability-hero-panel__primary-btn:hover{
    color: #173f52;
    background: #f0f7fa;
}
.capability-hero-panel__secondary-btn{
    border: 1px solid transparent;
    color: rgba(255, 255, 255, 0.92);
    border-radius: 999px;
    padding: 12px 10px;
    background: transparent;
    box-shadow: none;
}
.capability-hero-panel__secondary-btn:hover{
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}
.capability-category-selector{
    margin-bottom: 62px;
}
.capability-category-slider{
    position: relative;
    padding: 0 34px;
}
.capability-category-grid{
    display: flex;
    flex-wrap: nowrap;
    gap: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 2px 0 8px;
}
.capability-category-grid::-webkit-scrollbar{
    display: none;
}
.capability-category-slider__nav{
    appearance: none;
    position: absolute;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(15, 35, 40, 0.10);
    border-radius: 50%;
    color: #204751;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 35, 40, 0.12);
    transform: translateY(-50%);
    cursor: pointer;
    transition: color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.capability-category-slider__nav:hover{
    color: #ffffff;
    background: #204751;
    box-shadow: 0 12px 24px rgba(40, 85, 131, 0.20);
    transform: translateY(-50%) scale(1.03);
}
.capability-category-slider__nav .material-icons{
    font-size: 22px;
}
.capability-category-slider__nav--prev{
    left: 0;
}
.capability-category-slider__nav--next{
    right: 0;
}
.capability-category-card{
    appearance: none;
    display: flex;
    gap: 10px;
    align-items: center;
    flex: 0 0 calc((100% - 36px) / 3);
    width: calc((100% - 36px) / 3);
    min-height: 82px;
    padding: 18px 20px;
    border: 1px solid rgba(42, 82, 93, 0.12);
    border-radius: 14px;
    background: #ffffff;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(15, 35, 40, 0.04);
    scroll-snap-align: start;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.capability-category-card:hover,
.capability-category-card.is-active{
    transform: translateY(-2px);
    border-color: rgba(108, 117, 125, 0.20);
    box-shadow: 0 14px 28px rgba(15, 35, 40, 0.12);
}
.capability-category-card.is-active{
    background: linear-gradient(135deg, var(--jvc-primary-deep) 0%, var(--jvc-primary-dark) 100%);
    border-color: rgba(31, 66, 75, 0.95);
    box-shadow: 0 16px 30px rgba(40, 85, 131, 0.20);
}
.capability-category-card__icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    color: #204751;
    background: #eef3f7;
    border-radius: 50%;
    transition: color 0.2s ease, background 0.2s ease;
}
.capability-category-card.is-active .capability-category-card__icon{
    color: #ffffff;
    background: rgba(255, 255, 255, 0.16);
}
.capability-category-card__icon .material-icons{
    font-size: 22px;
}
.capability-category-card__body{
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.capability-category-card__body strong{
    color: #204751;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
}
.capability-category-card.is-active .capability-category-card__body strong{
    color: #ffffff;
}
.capability-category-card__body span{
    color: #55707a;
    font-size: 0.94rem;
    line-height: 1.55;
}
.capability-services-panel{
    display: none;
}
.capability-category-summary{
    display: none;
}
.capability-category-summary.is-active{
    display: block;
}
.capability-services-panel.is-active{
    display: block;
}
.capability-services-panel__header{
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px;
}
.capability-services-panel__header h2{
    margin: 14px 0 0;
    color: #1f424b;
    font-size: clamp(2rem, 3.2vw, 3rem);
}
.capability-services-panel__header p{
    margin: 0;
    max-width: 340px;
    color: #4b636c;
    line-height: 1.7;
}
.capability-service-stack{
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.capability-service-card{
    display: grid;
    grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1.08fr);
    gap: clamp(22px, 4vw, 34px);
    padding: clamp(22px, 4vw, 34px);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.84);
    border: 1px solid rgba(42, 82, 93, 0.1);
    box-shadow: 0 22px 46px rgba(15, 35, 40, 0.08);
}
.capability-service-card__media{
    display: grid;
    gap: 14px;
}
.capability-service-card__photo{
    position: relative;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: hidden;
    cursor: pointer;
    display: block;
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 16px 30px rgba(18, 44, 55, 0.14);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.capability-service-card__photo:hover{
    transform: translateY(-2px);
    box-shadow: 0 18px 34px rgba(18, 44, 55, 0.2);
}
.capability-service-card__photo--featured{
    min-height: 320px;
}
.capability-service-card__photo--thumb{
    min-height: 185px;
}
.capability-service-card__thumb-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.capability-service-card__photo img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}
.capability-service-card__photo:hover img{
    transform: scale(1.06);
}
.capability-service-card__photo-caption{
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    padding: 14px 18px;
    background: #1f4d7c;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
}
.capability-gallery-modal{
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
}
.capability-gallery-modal__backdrop{
    position: absolute;
    inset: 0;
    background: rgba(7, 18, 24, 0.74);
    backdrop-filter: blur(6px);
}
.capability-gallery-modal__dialog{
    position: relative;
    z-index: 1;
    width: min(1080px, 100%);
}
.capability-gallery-modal__frame{
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
}
.capability-gallery-modal__figure{
    margin: 0;
    overflow: hidden;
    border-radius: 28px;
    background: #ffffff;
    box-shadow: 0 32px 68px rgba(8, 20, 25, 0.28);
}
.capability-gallery-modal__figure img{
    width: 100%;
    max-height: 78vh;
    object-fit: contain;
    display: block;
    background: #eef3f7;
}
.capability-gallery-modal__figure figcaption{
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 22px;
    color: #21414d;
    font-size: 0.98rem;
    background: #ffffff;
}
.capability-gallery-modal__figure strong{
    font-size: 1.05rem;
}
.capability-gallery-modal__close,
.capability-gallery-modal__nav{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    color: #ffffff;
    background: rgba(17, 54, 74, 0.88);
    box-shadow: 0 16px 30px rgba(5, 20, 27, 0.18);
    transition: transform 0.18s ease, background 0.18s ease;
}
.capability-gallery-modal__close:hover,
.capability-gallery-modal__nav:hover{
    transform: scale(1.05);
    background: rgba(20, 72, 98, 0.95);
}
.capability-gallery-modal__close{
    position: absolute;
    top: -18px;
    right: -6px;
    z-index: 2;
    width: 48px;
    height: 48px;
}
.capability-gallery-modal__nav{
    width: 52px;
    height: 52px;
}
.capability-gallery-modal__close .material-icons,
.capability-gallery-modal__nav .material-icons{
    font-size: 1.9rem;
}
.is-gallery-modal-open{
    overflow: hidden;
}
.capability-service-card__body h3{
    margin: 0 0 18px;
    color: #1f424b;
    font-size: clamp(1.55rem, 2.4vw, 2.2rem);
    line-height: 1.15;
}
.capability-service-card__content{
    color: #36525c;
    font-size: 1.02rem;
    line-height: 1.85;
}
.capability-service-card__content > * + *{
    margin-top: 1rem;
}
.capability-service-card__content ul{
    padding-left: 1.2rem;
}
.capability-cta-card{
    margin-top: 46px;
    padding: clamp(28px, 4vw, 42px);
    border-radius: 28px;
    background: rgba(237, 238, 241, 0.90);
    color: #fff;
    display: flex;
    justify-content: space-between;
    gap: 22px;
    box-shadow: 0 24px 52px rgba(17, 39, 44, 0.18);
}
.capability-cta-card__copy{
    max-width: 720px;
}
.capability-cta-card__copy h2{
    margin: 16px 0 12px;
    color: #fff;
    font-size: clamp(2rem, 3vw, 3rem);
}
.capability-cta-card__copy p{
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.7;
}
.capability-cta-card .service-slide-btn{
    flex: 0 0 auto;
}
@media (max-width: 991px){
    .capability-service-card{
        grid-template-columns: 1fr;
    }
    .capability-category-grid{
        gap: 14px;
    }
    .capability-category-card{
        flex-basis: calc((100% - 14px) / 2);
        width: calc((100% - 14px) / 2);
    }
    .capability-services-panel__header,
    .capability-cta-card{
        flex-direction: column;
        align-items: flex-start;
    }
}
@media (max-width: 767px){
    .jvc-capability-page{
        padding: 0 0 72px;
    }
    .capability-hero-stack{
        margin-bottom: 52px;
    }
    .capability-hero-panel{
        min-height: 360px;
        background-image: var(--capability-hero-mobile-image, var(--capability-hero-image));
    }
    .capability-hero-panel__inner{
        align-items: flex-end;
        padding-top: 110px;
        padding-bottom: 34px;
    }
    .capability-hero-panel__copy h1{
        font-size: 2rem;
    }
    .capability-hero-panel__copy p{
        font-size: 0.96rem;
        line-height: 1.55;
    }
    .capability-category-card{
        flex-basis: min(255px, calc(100vw - 130px));
        width: min(255px, calc(100vw - 130px));
        min-height: 76px;
        padding: 16px;
    }
    .capability-service-card{
        padding: 18px;
        border-radius: 22px;
    }
    .capability-service-card__photo{
        border-radius: 16px;
    }
    .capability-service-card__photo--featured{
        min-height: 240px;
    }
    .capability-service-card__photo--thumb{
        min-height: 120px;
    }
    .capability-service-card__thumb-grid{
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }
    .capability-service-card__photo-caption{
        padding: 12px 14px;
        font-size: 0.88rem;
    }
    .capability-gallery-modal{
        padding: 16px;
    }
    .capability-gallery-modal__frame{
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .capability-gallery-modal__figure{
        order: 1;
        border-radius: 20px;
    }
    .capability-gallery-modal__figure figcaption{
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 16px;
    }
    .capability-gallery-modal__nav{
        position: absolute;
        top: calc(50% - 26px);
        z-index: 2;
    }
    .capability-gallery-modal__nav--prev{
        left: 10px;
    }
    .capability-gallery-modal__nav--next{
        right: 10px;
    }
    .capability-gallery-modal__close{
        top: 10px;
        right: 10px;
    }
}
