/* ---------- Overview bento ---------- */
        .ov-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 32px;
            padding-bottom: clamp(28px, 3vw, 52px);
            border-bottom: 1px solid #D5D5D5;
        }

        .ov-head .h2-display { letter-spacing: -0.01em; }

        .ov-lead { 
            margin: 14px 0 0;
            text-align: right; 
            line-height: 1.6;
            color: var(--gray);
        }

    .youtube-player iframe{    border-radius: 16px;} 
         .ov-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 726px;
    gap: 24px;
    margin-top: clamp(28px, 3vw, 52px);
}

        .ov-card {
            position: relative;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 28px;
            padding: 24px;
            border-radius: 16px;
            background: rgba(255, 255, 255, .75);
            box-shadow: 0 2px 14px rgba(17, 74, 159, .04);
            transition: transform .4s var(--ease), box-shadow .4s var(--ease);
        }

        .ov-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 16px 36px -16px rgba(17, 74, 159, .2);
        }

        .ov-title {
            margin: 0;
            font-size: clamp(20px, 1.6vw, 24px);
            line-height: 1.5;
            font-weight: 500;
            color: #2E2E2E;
            letter-spacing: -3%;
        }

        .ov-title span {
            display: block;
            color: var(--lte);
        }

        .ov-text {
            margin: 0; 
            line-height: 1.45;
            color: var(--lte);
            position: relative;
            z-index: 1;
            max-width: 35ch;
        }

        .ov-head-block { position: relative; z-index: 1; }

        /* Featured blue card */
        .ov-feat {
            grid-column: 3;
            grid-row: 1;
            color: #fff;
            background: linear-gradient(135deg, #1A2F8A 0%, #2447B5 55%, #3F73F5 100%);
        }

        .ov-feat .ov-title { color: #fff; }
        .ov-feat .ov-title span { color: #AFC2E4; }
        .ov-feat .ov-text { color: #fff; max-width: 34ch; }

        /* Dot pattern */
         
        .ov-wide::after {
            content:url("../images/icons/pattern-blue.svg");
            position: absolute;
            pointer-events: none;
            background-size: 10px 10px;
            top: 0;
    right: 0;
        }
        .ov-feat::after{
            content:url("../images/icons/pattern-white.svg");
            position: absolute;
            pointer-events: none;
            background-size: 10px 10px;
        }

        .ov-feat::after {
            top: 0;
            right: 0; 
        }

        .ov-wide {
            grid-column: 1 / span 2;
        }

       

        /* Video frame */
        .ov-video {
            grid-column: 3;
            grid-row: 2 / span 2;
            position: relative; 
            border-radius: 20px; 
            box-shadow: 0 18px 40px -16px rgba(17, 74, 159, .3);
            min-height: 320px;
            border:6px solid #E6E6E6;
        }

        .ov-video-inner {
            position: relative;
            width: 100%;
            height: 100%;
            min-height: 308px;
            border-radius: 14px;
            overflow: hidden;
            background: #0b1f4d;
        }

        .ov-video-inner img,
        .ov-video-inner video {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .ov-video-inner::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(26, 47, 138, .35);
            pointer-events: none;
            transition: opacity .3s ease;
        }

        .ov-video-inner.is-playing::after { opacity: 0; }

        .ov-play {
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: 2;
            width: 72px;
            height: 72px;
            transform: translate(-50%, -50%);
            display: flex;
            align-items: center;
            justify-content: center;
            border: 0;
            background: transparent;
            cursor: pointer;
            transition: transform .3s var(--ease);
        }

        .ov-play:hover { transform: translate(-50%, -50%) scale(1.1); }
        .ov-video-inner.is-playing .ov-play { display: none; }

        @media (max-width: 1199.98px) {
            .ov-text { font-size: 16px; }
        }
@media (min-width: 992px) and (max-width: 1399.98px) {
    .ov-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (min-width: 1400px) and (max-width: 1599.98px) {
    .ov-grid {
        grid-template-columns: 1fr 1fr 650px;
    }
}
        /* Tablet: 2 columns */
        @media (max-width: 991.98px) {
            .ov-head { flex-direction: column; gap: 0; }
            .ov-lead { text-align: left; flex: none; }

            .ov-grid { grid-template-columns: repeat(2, 1fr); }
            .ov-feat,
            .ov-video,
            .ov-wide {
                grid-column: 1 / -1;
                grid-row: auto;
            }
            .ov-video { min-height: 380px; }
        }

        /* Mobile: single column */
        @media (max-width: 575.98px) {
            .ov-grid { grid-template-columns: 1fr; gap: 16px; }
            .ov-card { padding: 20px; gap: 20px; }
            .ov-video { min-height: 260px; }
            .ov-video-inner { min-height: 248px; }
        }
           .youtube-player { 
    border-radius: 16px;}
    .youtube-player .vid-play-icon{width:28px;border-radius: 0px !important;height: auto;}
    .youtube-player img{height:100%;    border-radius: 16px;}
    .ov-video .vid{    height: 100%;}
    .ov-video .youtube-player{    height: 100%;}
        /* overview end */
        /* ---------- Problems & Solutions ---------- */
.ps-head .h2-display { letter-spacing: -0.01em; }

.ps-lead { 
    padding-bottom: 16px;
    border-bottom: 1px solid #D5D5D5; 
    line-height: 1.6;
    color: var(--gray);
}

.ps-table {
    margin-top: clamp(28px, 3.4vw, 52px);
    border-radius: 16px;
    overflow: hidden;
}

.ps-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.ps-cell {
    padding: 28px 24px;
}

.ps-row:first-child .ps-cell { padding-top: 36px; }
.ps-row:last-child .ps-cell  { padding-bottom: 36px; }

.ps-problem  { background: #FAFAFD; }
.ps-solution { background: #FCFDF8; }

.ps-tag {
    display: block;
    font-size: 16px;
    line-height: 1.4;
}
.ps-tag-red   { color: #E00000; }
.ps-tag-green { color: #0A7A1E; }

.ps-title {
    margin: 22px 0 14px;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.3;
    font-weight: 500;
    letter-spacing: -3%;
    color: var(--gray);
}

.ps-text {
    margin: 0;
    max-width: 62ch; 
    line-height: 1.45;
    color: #a9a9a9;
}

.ps-solution .ps-tag + .ps-text { margin-top: 22px; }
.ps-text-dark { color: var(--gray); max-width: 66ch; }

.ps-footer {
    margin: clamp(28px, 3vw, 44px) 0 0;
    font-size: clamp(16px, 1vw, 18px);
            line-height: 1.4 !important;
    color: var(--gray);
}

@media (max-width: 1199.98px) {
    .ps-text { font-size: 16px; }
}

/* Tablet and mobile: problem on top, solution directly below */
@media (max-width: 767.98px) {
    .ps-row { grid-template-columns: 1fr; }
    .ps-cell { padding: 20px; }
    .ps-row:first-child .ps-cell:first-child { padding-top: 28px; }
    .ps-row:last-child .ps-cell:last-child   { padding-bottom: 28px; }
    .ps-title { margin: 14px 0 10px; }
    .ps-solution .ps-tag + .ps-text { margin-top: 14px; }
}
/* ---------- Room walkthrough ---------- */
.wt-head .h2-display { letter-spacing: -0.01em; }

.wt-lead { 
    line-height: 1.6;
    color: var(--gray);
}

.wt-grid {
    display: grid;
    grid-template-columns: 881fr 570fr;
    gap: clamp(28px, 2.8vw, 42px);
    align-items: start;
    margin-top: clamp(28px, 3.4vw, 52px);
}

.wt-media {
    position: sticky;
    top: 100px;
    overflow: hidden;
    
}

.wt-media img {
    display: block;
    width: 100%;
    height: auto;
    transition: opacity .35s ease;
}

.wt-media img.is-swapping { opacity: 0; }

/* Accordion */
.wt-item { border-bottom: 1px solid #D5D5D5; }


.wt-btn {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    width: 100%;
    padding: 16px 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: var(--gray);
}

.wt-num {
    flex: 0 0 34px;
    font-size: 24px;
    line-height: 1.3;
    color: var(--lte);
    transition: color .25s ease;
}

.wt-btn-text { flex: 1 1 auto; }

.wt-label {
    display: block;
    font-size: 15px;
    line-height: 1.5;
    color: var(--gray);
}

.wt-title {
    display: block;
    margin-top: 5px;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.3;
    color: var(--gray);
    transition: color .25s ease;
}

.wt-chevron {
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--primary);
    transition: transform .3s var(--ease);
}

.wt-item.is-open .wt-chevron { transform: rotate(180deg); }
.wt-item.is-open .wt-num,
.wt-item.is-open .wt-title { color: var(--primary); }

.wt-btn:hover .wt-title { color: var(--primary); }

/* Smooth open/close without fixed heights */
.wt-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .4s var(--ease);
}

.wt-item.is-open .wt-panel { grid-template-rows: 1fr; }
.wt-panel-inner { overflow: hidden;  }

.wt-text {
    margin: 4px 0 0;
    line-height: 1.45;
    color: var(--gray);
}

.wt-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 26px;
    margin: 20px 0 22px;
    padding: 0 0 0 12px;
    list-style: none;
}

.wt-tags li {
    position: relative;
    padding-left: 14px;
    color: var(--primary);
}

/* .wt-tags li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--primary);
    transform: translateY(-50%);
} */

.wt-item.is-open .wt-panel-inner { padding-bottom: 4px; }

@media (max-width: 1199.98px) {
    .wt-text,
    .wt-tags li { font-size: 16px; }
}

/* Tablet and mobile: image on top, accordion below */
@media (max-width: 991.98px) {
    .wt-grid { grid-template-columns: 1fr; }
    .wt-media { position: static; }
}

@media (max-width: 575.98px) {
    .wt-btn { gap: 14px; padding: 16px 0; }
    .wt-num { flex-basis: 28px; font-size: 20px; }
    .wt-panel-inner { padding-left: 42px; }
    .wt-tags { gap: 6px 18px; padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .wt-panel,
    .wt-chevron,
    .wt-media img { transition: none; }
}

/* ---------- Services grid ---------- */
.sv-head .h2-display { letter-spacing: -0.01em; }

.sv-lead { 
    padding-bottom: clamp(20px, 2.4vw, 24px);
    border-bottom: 1px solid #D5D5D5; 
    line-height: 1.6;
    color: var(--gray);
}

.sv-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(32px, 3.4vw, 52px) 30px;
    margin-top: clamp(28px, 3.4vw, 52px);
}

.sv-card {
    display: flex;
    flex-direction: column;
    color: inherit;
}

.sv-img {
    aspect-ratio: 358 / 252;
    overflow: hidden;
    background: #E8EDF5;
}

.sv-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sv-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 24px 0 18px;
    border-bottom: 1px solid #D9DDE5;
    transition: border-color .3s ease;
}

.sv-title {
    margin: 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.33;
    font-weight: 400;
    color: var(--gray);
    transition: color .3s ease;
}

.sv-arrow {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid #D5DEEC;
    border-radius: 6px;
    background: transparent;
    color: var(--primary);
    transition: background .3s ease, border-color .3s ease, color .3s ease;
}

.sv-arrow svg { transition: transform .3s var(--ease); }

.sv-text {
    margin: 18px 0 0; 
    line-height: 1.45;
    color: #A3A3A8;
    transition: color .3s ease;
}

/* Hover / focus state (also the default look of the first card) */
.sv-card:hover .sv-title,
.sv-card:focus-visible .sv-title{ color: var(--primary); }

.sv-card:hover .sv-top,
.sv-card:focus-visible .sv-top { border-color: #333; }

.sv-card:hover .sv-arrow,
.sv-card:focus-visible .sv-arrow {
    background: #1A2F8A;
    border-color: #1A2F8A;
    color: #fff;
}

.sv-card:hover .sv-arrow svg,
.sv-card:focus-visible .sv-arrow svg{ transform: rotate(-45deg); }

.sv-card:hover .sv-text,
.sv-card:focus-visible .sv-text{ color: #2E2E2E; }

@media (max-width: 1199.98px) {
    .sv-grid { column-gap: 24px; }
    .sv-text { font-size: 16px; }
}

/* Tablet: 2 columns */
@media (max-width: 991.98px) {
    .sv-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile: 1 column */
@media (max-width: 575.98px) {
    .sv-grid { grid-template-columns: 1fr; gap: 36px; }
    .sv-top { padding-top: 18px; }
}

/* Touch devices have no hover: keep every card in its normal state */
@media (hover: none) {
    .sv-grid:not(:hover) .sv-card:first-child .sv-title { color: var(--gray); }
    .sv-grid:not(:hover) .sv-card:first-child .sv-top { border-color: #D9DDE5; }
    .sv-grid:not(:hover) .sv-card:first-child .sv-arrow { background: transparent; border-color: #D5DEEC; color: var(--primary); }
    .sv-grid:not(:hover) .sv-card:first-child .sv-arrow svg { transform: none; }
    .sv-grid:not(:hover) .sv-card:first-child .sv-text { color: #A3A3A8; }
}

/* ---------- Capabilities & Outcomes ---------- */
.cp-head .h2-display { letter-spacing: -0.01em; }

.cp-lead { 
    line-height: 1.6;
    color: var(--gray);
}

.cp-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 42px 24px;
    margin-top: clamp(30px, 2vw, 32px);
}
.pss-section{ margin-top: clamp(30px, 2vw, 32px)}
/* Grid items stretch to equal height, so the outcome lines align across a row */
.cp-item {
    display: flex;
    flex-direction: column;
    padding: 24px;
}

.cp-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 8px;
    background: #EEF4FD;
    color: var(--primary);
}

.cp-icon svg {
    width: 26px;
    height: 26px;
    stroke-width: 1.25;
}

.cp-title {
    margin: 28px 0 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.3;
    font-weight: 500;
    color: var(--primary);
    letter-spacing: -3%;
}

.cp-text {
    margin: 16px 0 28px;
    line-height: 1.45;
    color: var(--gray);
}

.cp-outcome {
    margin: auto 0 0;
    padding-left: 12px;
    border-left: 2px solid var(--primary);
    line-height: 1.45;
    color: var(--primary);
}
@media (max-width: 1599.98px) {
 .cp-item { 
    padding:   17px;
}
.cp-grid { 
    gap: 42px 4px; 
}
}
@media (max-width: 1199.98px) {
    .cp-item { padding: 0 12px; } 
}

/* Tablet: 2 columns */
@media (max-width: 991.98px) {
    .cp-grid { grid-template-columns: repeat(2, 1fr);gap: 42px 27px; }
    .cp-item { padding: 0; }
}

/* Mobile: 1 column */
@media (max-width: 575.98px) {
    .cp-grid { grid-template-columns: 1fr; gap: 45px; }
    .cp-icon { width: 52px; height: 52px; }
    .cp-title { margin-top: 20px; }
    .cp-text { margin: 14px 0 18px; }
}
/* ---------- Deployment procedure ---------- */
.pr-head .h2-display { letter-spacing: -0.01em; }

.pr-lead { 
    line-height: 1.6;
    color: #6B7280;
}

/* Steps: 4 columns */
.pr-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(36px, 4.4vw, 64px) 30px;
    margin-top: clamp(28px, 3vw, 52px);
}

.pr-step {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.pr-num {
    font-size: clamp(48px, 4.6vw, 64px);
    line-height: 1;
    font-weight: 500;
    color: var(--s-icon);
}

.pr-title {
    margin: clamp(24px, 3.2vw, 44px) 0 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.5;
    font-weight: 400;
    color: var(--primary); 
    font-weight: 500;
    letter-spacing: -3%;
}

.pr-text {
    margin: 22px 0 0;
    line-height: 1.45;
    color: #6B7280;
}

.pr-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    margin-top: auto;
    padding: 36px 0 4px;
    border-bottom: 1px solid var(--primary);
    color: var(--primary);
    text-decoration: none;
}

/* Underline sits on the text + arrow only, pushed to the bottom of the card */
.pr-link::after { content: none; }
.pr-link {
    border-bottom: 1px solid var(--primary);
    padding-bottom: 4px;
    margin-top: auto;
}

/* .pr-text + .pr-link { margin-top: 36px; } */

.pr-link svg {
    width: 18px;
    height: 18px;
    stroke-width: 1.5;
    transition: transform .3s var(--ease);
}

.pr-link:hover svg { transform: translateX(4px); }

/* Handover */
.pr-handover { margin-top: clamp(24px, 5vw, 52px); }

.pr-ho-label {
    display: block;
    font-size: 16px;
    color: var(--primary);
}

.pr-ho-title {
    margin: 14px 0 0;
    font-size: clamp(26px, 2.6vw, 32px);
    line-height:1.125;
    font-weight: 500;
    letter-spacing: -3%;
    color: var(--gray);
}

.pr-ho-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 32px 30px;
    margin-top: 24px;
    align-items: start;
}

.pr-ho-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 8px;
    background: #EEF4FD;
    color: var(--primary);
}

.pr-ho-icon svg {
    width: 26px;
    height: 26px;
    stroke-width: 1;
}

.pr-ho-item-title {
    margin: 16px 0 0;
    line-height: 1.8;
    letter-spacing: -3%;
    font-weight: 500;
    color: var(--primary);
}

.pr-ho-item-text {
    margin: 16px 0 0;
    
    line-height: 1.45;
    color: #6B7280;
}

@media (max-width: 1399.98px) {
    .pr-text,
    .pr-link,
    .pr-ho-item-title,
    .pr-ho-item-text { font-size: 16px; }
}

/* Laptop: 3 handover columns */
@media (max-width: 1199.98px) {
    .pr-grid { grid-template-columns: repeat(2, 1fr); }
    .pr-ho-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Tablet */
@media (max-width: 767.98px) {
    .pr-ho-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile: everything single column */
@media (max-width: 575.98px) {
    .pr-grid { grid-template-columns: 1fr; gap: 32px; }
    .pr-title { margin-top: 16px; }
    .pr-text { margin-top: 12px; }
    .pr-ho-grid { grid-template-columns: 1fr; gap: 28px; }
    .pr-ho-icon { width: 52px; height: 52px; }
    .pr-ho-item-title { margin-top: 16px; line-height: 1.4; }
}

/* ---------- Support after go-live ---------- */
.sp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(40px, 6vw, 110px);
    align-items: stretch;   /* left column = full height of right column */
}

/* Sticks under the header until the right column finishes scrolling */
.sp-sticky {
    position: sticky;
    top: 100px;
}

.sp-sticky .h2-display { letter-spacing: -0.01em; }

.sp-lead { 
    max-width: 62ch; 
    line-height: 1.45;
    color: var(--gray);
}

.sp-note {
    margin: 28px 0 0;
    max-width: 62ch; 
    line-height: 1.45;
    letter-spacing: -3%;
    font-weight: 500;
    color: var(--primary);
}

.sp-note a {
    color: inherit;
    transition: opacity .25s ease;
}
.sp-note a:hover { opacity: .75; }

.sp-right {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(40px, 5.4vw, 80px) clamp(24px, 3.4vw, 50px);
}

.sp-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 8px;
    background: #EEF4FD;
    color: var(--primary);
}

.sp-icon svg {
    width: 26px;
    height: 26px;
    stroke-width: 1.25;
}

.sp-title {
    margin: 28px 0 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.5;
    letter-spacing: -3%;
    font-weight: 500;
    color: var(--primary);
}

.sp-text {
    margin: 14px 0 0; 
    line-height: 1.45;
    color: var(--gray);
} 

/* Tablet and mobile: stack, no sticky */
@media (max-width: 991.98px) {
    .sp-grid { grid-template-columns: 1fr; }
    .sp-sticky { position: static; }
}

@media (max-width: 575.98px) {
    .sp-right { grid-template-columns: 1fr; gap: 32px; }
    .sp-icon { width: 52px; height: 52px; }
    .sp-title { margin-top: 18px; }
} 

.sp-sticky {
    position: sticky;
    top: 150px;             /* set to your sticky header height + breathing room */
}
/* ---------- Why GS IT ---------- */
.wy-head .h2-display { letter-spacing: -0.01em; }

.wy-lead { 
    line-height: 1.6;
    color: var(--gray);
}

.wy-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(40px, 5.4vw, 80px) clamp(24px, 3.4vw, 50px);
    margin-top: clamp(28px, 3.4vw, 52px);
}

.wy-line {
    display: block;
    width: 32px;
    height: 2px;
    background: var(--primary);
}

.wy-title {
    margin: 28px 0 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: -3%;
    color: var(--primary);
}

.wy-text {
    margin: 22px 0 0;
    
    line-height: 1.45;
    color: #a9a9a9;
}

.wy-proof-label {
    display: block;  
    line-height: 1.45;
    color: var(--primary);
}

.wy-proof {
    margin: 10px 0 0;
    
    line-height: 1.45;
    color: var(--gray);
}

@media (max-width: 1399.98px) {
    .wy-text,
    .wy-proof-label,
    .wy-proof { font-size: 16px; }
}

/* Tablet: 2 columns */
@media (max-width: 991.98px) {
    .wy-grid { grid-template-columns: repeat(2, 1fr); 
    }
    
}

/* Mobile: 1 column */
@media (max-width: 575.98px) {
    .wy-grid { grid-template-columns: 1fr; gap: 36px; }
    .wy-title { margin-top: 20px; }
    .wy-text { margin-top: 14px; }
}
/* ---------- Authorised partners ---------- */
.pt-head .h2-display { letter-spacing: -0.01em; }

.pt-brand {
    margin-top: clamp(24px, 2.6vw, 36px);
    padding: 24px 0 24px 24px;
    border-left: 2px solid var(--primary);
}

.pt-brand img {
    display: block;
    height: 32px;
    width: auto;
}

.pt-brand p {
    margin: 16px 0 16px;
    line-height: 1.45;
    color: var(--gray);
}

/* Cards: 2 columns, rows stretch to equal height */
.pt-groups {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: clamp(32px, 4.4vw, 66px);
}

.pt-card {
    padding: 24px;
    border: 1px solid #D9DDE5;
    border-radius: 16px;
    background: #fff;
}

.pt-card-title {
    margin: 0;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.4;
    font-weight: 400;
    color: var(--primary);
}

.pt-logos {
    display: grid;
    grid-template-columns: repeat(var(--cols, 4), 1fr);
    align-items: center;
    gap: 28px 16px;
    margin-top: clamp(12px, 2.5vw, 42px);
}

.pt-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 72px;
}

.pt-logo img {
    max-width: 100%; 
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Certifications */
.pt-certs {
    margin-top: clamp(30px, 4.6vw, 66px);
    padding-top: clamp(30px, 4.4vw, 66px);
    border-top: 1px solid #D5D5D5;
}

.pt-certs-title {
    margin: 0;
    font-size: clamp(18px, 2.4vw, 32px);
    line-height: 1.3;
    font-weight: 400;
    color: var(--primary);
}

.pt-certs-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: center;
    gap: 24px 16px;
    margin-top: clamp(24px, 3vw, 40px);
}

.pt-cert {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
}

.pt-cert img {
    max-width: 100%;
    max-height: 64px;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media (max-width: 1399.98px) {
    .pt-brand p { font-size: 16px; }
    .pt-logo img { max-height: 64px; }
}

/* Tablet: cards stack, logos 3 per row */
@media (max-width: 991.98px) {

    .pt-brand { padding: 16px 0 16px 24px; }
    .pt-groups { grid-template-columns: 1fr; gap: 20px; }
    .pt-logos { grid-template-columns: repeat(3, 1fr); }
    .pt-certs-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Mobile */
@media (max-width: 575.98px) {
    .pt-brand { padding: 16px; }
    .pt-card { padding: 20px; }
    .pt-logos { grid-template-columns: repeat(3, 1fr); gap:3px 12px; }
    .pt-logo { height: 46px; }
    .pt-logo img { max-height: 34px; } 
    .pt-cert { 
    height: 50px;
}
.pt-cert img { 
    max-height: 64px; 
}
}


/* ---------- Selected projects ---------- */
.pj-head .h2-display { letter-spacing: -0.01em; }

.pj-lead {
    margin: clamp(20px, 2.4vw, 24px) 0 0;
    line-height: 1.6;
    color: var(--gray);
}

.pj-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(24px, 3.4vw, 30px);
    margin-top: clamp(28px, 3.4vw, 52px);
}

.pj-card {
    display: flex;
    flex-direction: column;
}

.pj-img {
    aspect-ratio: 487 / 270;
    overflow: hidden;
    background: #E8EDF5;
}

.pj-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s var(--ease);
}

.pj-card:hover .pj-img img { transform: scale(1.04); }

.pj-title {
    margin: 24px 0 0;
    padding-bottom: 18px;
    border-bottom: 1px solid #D5D5D5;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.4;
    font-weight: 400;
    color: var(--primary);
}

.pj-text {
    margin: 18px 0 0;
    
    line-height: 1.45;
    color: var(--gray);
}

.pj-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 18px 0 0;
    padding: 0 0 0 10px;
    list-style: none;
}

.pj-tags li {
    position: relative;
    padding-left: 14px;
    font-size: 16px;
    line-height: 1.5;
    color: var(--primary);
}

.pj-tags li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--primary);
    transform: translateY(-50%);
}

@media (max-width: 1399.98px) {
    .pj-text { font-size: 16px; }
}

/* Tablet: 2 columns */
@media (max-width: 991.98px) {
    .pj-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile: 1 column */
@media (max-width: 575.98px) {
    .pj-grid { grid-template-columns: 1fr; gap: 36px; }
    .pj-title { margin-top: 18px; }
}

/* ---------- Get started / CTA ---------- */
.cta-section {
    color: #fff;
    background:url('https://cdn.gs-it.ae/images/it-amc-dubai/slider-banner.jpeg') no-repeat center center/cover;
}

.cta-section .eyebrow { color: #fff; }
.cta-section .eyebrow::before { background: #fff; }

.cta-grid {
    display: grid;
    grid-template-columns: 1fr 585px;
    gap: clamp(40px, 7vw, 200px);
    align-items: center;
}

.cta-title {
    margin: 0;
    color: #fff;
    font-weight: 300;
    letter-spacing: -0.01em;
}

.cta-lead { 
    max-width: 58ch;
    
    line-height: 1.45;
    color: #fff;
}

.cta-steps {
    margin: 38px 0 0;
    padding: 0;
    list-style: none;
}

.cta-steps li {
    display: flex;
    gap: 20px;
    margin-bottom: 18px;
}

.cta-step-num {
    flex: 0 0 24px; 
    line-height: 1.6;
    color: #fff;
}

.cta-step-title {
    margin: 0; 
    line-height: 1.6;
    color: #fff;
    letter-spacing: -3%;
    font-weight: 500;
}

.cta-step-text {
    margin: 2px 0 0; 
    line-height: 1.4;
    color: rgba(255, 255, 255, .55);
}

.cta-contact {
    margin: 44px 0 0;
    
    line-height: 1.5;
    letter-spacing: -3%;
    font-weight: 500;
    color: #fff;
}

.cta-contact a { color: #fff; }
.cta-contact a:hover { text-decoration: underline !important; }

/* Form card */
.cta-card {
    padding: 24px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(8, 20, 70, .25);
}

.cta-card-title {
    margin: 0;
    font-size: 24px;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: -3%;
    color: var(--primary);
}

.cta-card-sub {
    margin: 4px 0 20px;
    font-size: 16px;
    color: var(--gray);
}

.cta-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
}

.cta-field { margin-bottom: 16px; }

.cta-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 500;
    color: #111A2B;
}

.cta-field input,
.cta-field textarea {
    width: 100%;
    min-height: 48px;
    padding: 10px 14px;
    border: 1px solid #DDE4EF;
    border-radius: 10px;
    font: inherit;
    font-size: 15px;
    color: #111A2B;
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.cta-field textarea {
    min-height: 82px;
    resize: vertical;
}

.cta-field input:focus,
.cta-field textarea:focus {
    outline: 0;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(23, 71, 166, .12);
}

.cta-field textarea::placeholder { color: #9AA3B2; }

/* jQuery validate messages */
.cta-form label.error {
    margin: 4px 0 0;
    font-size: 13px;
    font-weight: 400;
    color: #C1121F;
}

/* multiple-select plugin, matched to the inputs */
.cta-form .ms-parent { width: 100% !important; }

.cta-form .ms-choice {
    height: 48px;
    line-height: 46px;
    padding: 0 12px;
    border: 1px solid #DDE4EF;
    border-radius: 10px;
    font-size: 15px;
    background: #fff;
}

.cta-form .ms-choice > span.placeholder { color: #333; }

.cta-submit {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 14px 24px;
    border: 0;
    border-radius: 100px;
    font-size: 16px;
    color: #fff;
    background: linear-gradient(90deg, #114A9F 0%, #032C69 100%);
    box-shadow: 0 10px 26px -12px rgba(12, 41, 111, .5);
    transition: transform .3s var(--ease), box-shadow .3s ease;
}

.cta-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px -12px rgba(12, 41, 111, .55);
}

@media (max-width: 1399.98px) {
    .cta-grid { grid-template-columns: 1fr 520px; }
    .cta-lead,
    .cta-step-num,
    .cta-step-title,
    .cta-step-text,
    .cta-contact { font-size: 16px; }
}

/* Tablet and mobile: copy on top, form below */
@media (max-width: 991.98px) {
    .cta-grid { grid-template-columns: 1fr; gap: 23px; }
    .cta-card { max-width: 100%; }
    .cta-steps {
    margin: 8px 0 0; 
}
.cta-contact {
    margin: 22px 0 0;}
}

@media (max-width: 575.98px) {
    .cta-row { grid-template-columns: 1fr; }
    .cta-card { padding: 20px; } 
}
.groupfield-mn {
    display: flex;
    gap: 12px;
} 

.groupfield-mn{
  display: flex;
  gap: 12px;
}
.groupfield-mn .mb-field{flex:1;}
.callback-card .mb-field {
    margin-bottom: 15px;
}
.callback-card .form-control, .callback-card .form-select {
    background: transparent;}
    .selectsts { 
    background: transparent;
}
.ms-choice{overflow: hidden;}
.ms-choice>span{overflow: hidden;}
.callback-card .form-control, .callback-card .form-select {
    background: transparent;
}
.callback-card .form-control, .callback-card .form-select {
    background: var(--s-tint);
    border: 1px solid var(--s-border);
    border-radius: 10px;
    padding: 3px 10px;
    font-size: 14px;
    color: #575757;
    min-height: 32px;
}

.callback-card .form-control, .callback-card .form-select {
    background: transparent;
}
.callback-card .form-control, .callback-card .form-select {
    background: var(--s-tint);
    border: 1px solid var(--s-border);
    border-radius: 10px;
    padding: 3px 10px;
    font-size: 14px;
    color: #575757;
    min-height: 32px;
}.mts-frm-s button.ms-choice>span.placeholder {
    height: auto;
    line-height: 32px;
    padding-left: 10px;
}
/* ============================================================
   Room Configurations (tabbed) — uses tokens from global.css
   ============================================================ */

.rc-section { --rc-card-border: var(--s-border); }
.bg-F8F9FD {
    background: #F8F9FD;
}
.rc-head { margin-bottom: clamp(28px, 3.4vw, 52px); }
.rc-intro {
  font-size: 16px;
  line-height: 1.6;
  color: var(--gray);
}
@media (min-width: 992px) {
  .rc-intro { text-align: right; }
}

/* ---------- Tabs ---------- */
.rc-tabs {
  display: flex;
  flex-wrap: nowrap;
  border-bottom: 1px solid #E3E8F0;
  overflow-x: auto;
  scrollbar-width: none;
}
.rc-tabs::-webkit-scrollbar { display: none; }
.rc-tabs .nav-item { flex: 1 0 200px; }

.rc-tab {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
  padding: 18px 16px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  margin-bottom: -1px;
  transition: background .3s var(--ease), border-color .3s var(--ease);
  height: 100%;
}
.rc-tab-name   {  font-weight: 500;letter-spacing: -3%;line-height: 1.3; color: var(--gray); transition: color .25s; }
.rc-tab-people { font-size: 16px; line-height: 1.3; color: var(--lte);  transition: color .25s; }

.rc-tab:hover .rc-tab-name { color: var(--primary); }

.rc-tab.active,
.rc-tab:focus-visible {
  background: linear-gradient(180deg, #F8F9FD 0%, #DEEBFE 100%);
  border-bottom-color: var(--primary);
  outline: 0;
}
.rc-tab.active .rc-tab-name,
.rc-tab.active .rc-tab-people { color: var(--primary); }

/* ---------- Overview ---------- */
.rc-overview { padding-top: clamp(24px, 2.4vw, 24px); margin-bottom: 20px; }

.rc-room-label {
  line-height: 1.4;
  color: var(--gray);
  margin-bottom: 24px;
}
.rc-room-title {
  font-size: clamp(26px, 2.4vw, 32px);
  line-height: 1.1;
  font-weight: 400;
  letter-spacing: -3%;
  color: var(--primary);
  margin-bottom: 16px;
}
.rc-room-desc {
  
  line-height: 1.6;
  color: var(--lte);
  max-width: 60ch;
  margin-bottom: 16px;
}

.rc-ideal {
  border-left: 2px solid var(--primary);
  padding-left: 16px;
  margin-bottom: 28px;
}
.rc-ideal-label {  color: var(--gray); margin-bottom: 0px;}
.rc-ideal-text  {  letter-spacing: -3%;color: var(--primary); margin-bottom: 0;font-weight: 500; }

.rc-cta { display: inline-flex; align-items: center; gap: 12px; padding: 14px 28px; font-size: 17px; }
.rc-cta svg { width: 18px; height: 18px; transition: transform .35s var(--ease); }
.rc-cta:hover svg { transform: translateX(4px); }

.rc-media { overflow: hidden; }
.rc-media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

/* ---------- Feature cards ---------- */
.rc-features { margin-bottom: clamp(28px, 3vw, 40px); }

.rc-feature {
  display: flex;
  gap: 16px;
  height: 100%;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--rc-card-border);
  border-radius: var(--bs-border-radius-lg);
}
.rc-icon {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #EEF5FF;
  color: var(--primary);
}
.rc-icon svg { width: 20px; height: 20px; stroke-width: 1; }
.rc-feature-title {   color: var(--gray); margin: 0 0 0px; }
.rc-feature-text  {  line-height: 1.6; color: var(--lte); margin: 0; }

/* ---------- Usage / scenarios ---------- */
.rc-used { margin-bottom: 20px; }
.rc-used-title {
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.15;
  font-weight: 400;
  letter-spacing: -3%; 
  color: var(--primary);
  margin-bottom: 16px;
}
.rc-used-text {line-height: 1.6; color: var(--gray); margin: 0; }

.rc-scenarios { margin-bottom: 20px; }
.rc-scenario {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 16px ;
  background: #fff;
  border: 1px solid var(--rc-card-border);
  border-radius: var(--bs-border-radius-lg);
  transition: border-color .3s, box-shadow .3s var(--ease), transform .3s var(--ease);
}
.rc-scenario:hover {
  border-color: #c7d9fb;
  box-shadow: 0 12px 30px -16px rgba(17, 74, 159, .2);
  transform: translateY(-3px);
}
.rc-scenario-no    {   font-weight: 500;letter-spacing: -3%;color: var(--gray); margin-bottom: 16px; }
.rc-scenario-title {  font-weight: 500;letter-spacing: -3%; color: var(--primary); margin-bottom: 16px; }
.rc-scenario-text  {   line-height: 1.6; color: var(--lte); margin-bottom: 16px; }
.rc-scenario-support { margin-top: auto; }
.rc-support-label  {   font-weight: 500;letter-spacing: -3%;color: var(--gray); margin-bottom: 16px; }

.rc-foot {  line-height: 1.6; color: var(--gray); margin: 0; }

@media (max-width: 991.98px) {
  .rc-scenario-no,
  .rc-scenario-title { margin-bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .tab-pane.fade { transition: none; }
  .rc-scenario:hover { transform: none; }
}

/* ---------- Certified platforms strip ---------- */ 

.pss-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(24px, 3vw, 48px);
    padding: 16px;
    border-radius: 16px;
    background: linear-gradient(90deg, #EEF4FD 0%, #EAF1FC 100%);
}

.pss-title {
    flex: 0 1 auto;
    margin: 0;
    
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.2;
    font-weight: 500;
    color: var(--primary);
}

.pss-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 16px clamp(24px, 4vw, 64px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.pss-item {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pss-item img {
    display: block;
    width: auto;
    height: auto; 
    object-fit: contain;
}

.pss-name {
    font-size: 16px;
    line-height: 1.4;
    color: var(--gray);
    white-space: nowrap;
}

/* Tablet and mobile: title above, logos in a 2-column grid */
@media (max-width: 1420px) {
    .pss-bar { flex-direction: column; align-items: flex-start; }
    .pss-list { justify-content: flex-start; width: 100%; }
}

@media (max-width: 575.98px) {
    .pss-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .pss-item { gap: 10px; } 

    .pss-name { white-space: normal; font-size: 15px; }
}
 /* ---------- Room walkthrough ---------- */

/* Tokens still used by the stage, pins, caption and hint */
#walkthrough{
  --wt-primary:var(--primary,#114a9f);--wt-sky:var(--blue-300,#80b4ff);
  --wt-border:var(--border,#e0e8f3);--wt-muted:var(--text-muted,#777878);--wt-r:var(--r-card,16px);
}
@property --x{syntax:'<percentage>';inherits:true;initial-value:50%}
@property --y{syntax:'<percentage>';inherits:true;initial-value:50%}

.wt-head .h2-display { letter-spacing: -0.01em; }

 

.wt-grid {
    display: grid;
    grid-template-columns: 881fr 570fr;
    gap: clamp(28px, 2.8vw, 42px);
    align-items: start;
    margin-top: clamp(28px, 3.4vw, 52px);
}

.wt-media {
    position: sticky;
    top: 100px;
}

/* ---------- Stage (image + spotlight + pins) ---------- */
.wt-stage{position:relative;aspect-ratio:1345/976;border-radius:var(--wt-r);overflow:hidden;background:#F2F3F5;border:1px solid var(--wt-border);
  transition:--x .6s cubic-bezier(.2,.7,.2,1),--y .6s cubic-bezier(.2,.7,.2,1)}
.wt-stage img{    width: 81%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity .35s ease;
    position: relative;
    left: 84px;}
.wt-stage img.is-swapping{opacity:0}
.wt-spot{position:absolute;inset:0;pointer-events:none;transition:opacity .3s;
  background:radial-gradient(circle at var(--x) var(--y),rgba(17,74,159,0) 0,rgba(17,74,159,0) 70px,rgba(10,43,94,.42) 150px)}
.wt-spot::after{content:"";position:absolute;left:var(--x);top:var(--y);width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;
  border:2px solid #fff;box-shadow:0 0 0 1px rgba(17,74,159,.4),0 0 0 8px rgba(255,255,255,.18)}
.wt-stage.is-idle .wt-spot{opacity:0}

/* pins */
.wt-pin{position:absolute;left:var(--px);top:var(--py);width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;padding:0;
  border:1.5px solid #fff;background:rgba(255,255,255,.85);color:var(--wt-primary);
  font-weight:600;font-size:12px;line-height:1;font-family:inherit;cursor:pointer;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.18);transition:transform .2s,background .2s,color .2s;z-index:2}
.wt-pin:hover{transform:scale(1.12)}
.wt-pin.on{background:var(--wt-primary);color:#fff;transform:scale(1.2)}
.wt-pin.on::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--wt-sky);animation:wtPing 1.8s ease-out infinite}
@keyframes wtPing{0%{transform:scale(.8);opacity:1}100%{transform:scale(1.7);opacity:0}}

/* caption + hint */
.wt-cap{position:absolute;left:14px;right:14px;bottom:14px;z-index:3;background:rgba(255,255,255,.95);color:#000;border-radius:12px;
  padding:10px 14px;font-size:14.5px;box-shadow:0 4px 14px rgba(0,0,0,.12);display:flex;gap:10px;align-items:center}
.wt-cap b{color:var(--wt-primary);font-weight:700}
.wt-hint{font-size:14px;color:var(--wt-muted);margin:12px 0 0}

/* ---------- Accordion ---------- */
.wt-item { border-bottom: 1px solid #D5D5D5; }
.wt-item:first-child { border-top: 0; }

.wt-btn {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    width: 100%;
    padding: 16px 0;
    border: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    color: var(--gray);
}
.wt-btn:focus-visible { outline: 2px solid var(--wt-primary); outline-offset: 2px; }

.wt-num {
    flex: 0 0 34px;
    font-size: 24px;
    line-height: 1.3;
    color: var(--lte);
    transition: color .25s ease;
}

.wt-btn-text { flex: 1 1 auto; }

.wt-label {
    display: block;
    font-size: 16px;
    line-height: 1.5;
    color: var(--gray);
}

.wt-title {
    display: block;
    margin-top: 14px;
    font-size: clamp(20px, 1.6vw, 24px);
    line-height: 1.3;
    letter-spacing: -3%;
    font-weight:500;
    color: var(--gray);
    transition: color .25s ease;
}

.wt-chevron {
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--primary);
    transition: transform .3s var(--ease);
}

.wt-item.is-open .wt-chevron { transform: rotate(180deg); }
.wt-item.is-open .wt-num,
.wt-item.is-open .wt-title { color: var(--primary); }

.wt-btn:hover .wt-title { color: var(--primary); }

/* Smooth open/close without fixed heights */
.wt-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .4s var(--ease);
}

.wt-item.is-open .wt-panel { grid-template-rows: 1fr; }
.wt-panel-inner { overflow: hidden; padding-left: 56px; }

.wt-text {
    margin: 4px 0 0;
    
    line-height: 1.45;
    color: var(--gray);
}

.wt-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 26px;
    margin: 20px 0 22px;
    padding: 0 0 0 12px;
    list-style: none;
}

.wt-tags li {
    position: relative;
    padding-left: 14px; 
    color: var(--primary);
}

.wt-tags li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--primary);
    transform: translateY(-50%);
}

.wt-item.is-open .wt-panel-inner { padding-bottom: 4px; }

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
    .wt-text,
    .wt-tags li { font-size: 16px; }
}

/* Tablet and mobile: image on top, accordion below */
@media (max-width: 991.98px) {
    .wt-grid { grid-template-columns: 1fr; }
    .wt-media { position: static; }
}

@media (max-width: 900px) {
    .wt-hint { display: none; }
    .wt-pin { width: 24px; height: 24px; margin: -12px 0 0 -12px; font-size: 11px; }
    .wt-spot::after { width: 80px; height: 80px; margin: -40px 0 0 -40px; }
    .wt-cap { font-size: 13px; padding: 8px 12px; }
}

@media (max-width: 575.98px) {
    .wt-btn { gap: 14px; padding: 16px 0; }
    .wt-num { flex-basis: 28px; font-size: 20px; }
    .wt-panel-inner { padding-left: 42px; }
    .wt-tags { gap: 6px 18px; padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .wt-pin.on::before { animation: none; }
    .wt-stage,
    .wt-panel,
    .wt-chevron,
    .wt-stage img { transition: none; }
}
.rc-acc-btn { display: none; }

@media (max-width: 991.98px) {

  /* Show every pane, stacked, instead of one active tab */
  #room-configurations .tab-content > .tab-pane {
    display: block !important;
    opacity: 1 !important;
    border-bottom: 1px solid var(--s-border);
  }

  .rc-acc-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 18px 4px;
    background: none;
    border: 0;
    text-align: left;
    color: var(--gray);
  }

  .rc-acc-text { display: flex; flex-direction: column; gap: 2px; }
  .rc-acc-name { font-size: 18px; font-weight: 500; line-height: 1.3; }
  .rc-acc-people { font-size: 14px; color: var(--graylte); }

  .rc-acc-btn svg {
    flex-shrink: 0;
    transition: transform .3s var(--ease);
  }

  .rc-acc-btn[aria-expanded="true"] { color: var(--primary); }
  .rc-acc-btn[aria-expanded="true"] svg { transform: rotate(180deg); }

  /* Collapsed by default, open when pane has .is-open */
  .rc-acc-body { display: none; padding-bottom: 24px; }
  .tab-pane.is-open .rc-acc-body { display: block; 
background: #f9f9f9;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #f7f4f4;
    margin-bottom: 20px;}
}